/* CONTAINER */
/* ---------------------------------------------------------------------------------------- */

#naviTop {background: #f6f7f8; height: 105px; border-bottom: 3px solid #fff;}
#pageNavi {position: relative; top: 10px; margin: 0 auto; width: 930px; text-align: left;}
#infoTextContainer {position: relative; top: 20px; margin: 0 auto; padding: 0; width: 930px; text-align: left; clear: both; z-index: 4;}

#imgOuterContainer {position: fixed; top: 210px; left: 0; width: 100%; height: 340px; overflow: hidden; z-index: 3;}
#imgInnerContainer {text-align: center; width: 930px; height: 340px; overflow: hidden; position: relative; top: 0; margin: 0 auto; text-align: left;}
#imgContainer {text-align: center; width: 740px; height: 340px; overflow: hidden; position: relative; top: 0; left: 0;}

#content {width: 766px; padding-top: 210px; margin-left: 0;}


/* CONTENT */
/* ---------------------------------------------------------------------------------------- */

/* werke mit text */
#contentContainer {text-align: left; padding: 5px 21px 40px 210px;}
#container #content #contentContainer #footer ul {margin-left: 210px;}

#pictContainer {margin: 0; padding: 0 30px;}

/* werkeuebersicht */

.pictFrame {float: left; margin: 0 20px 20px 0; background: #fff;}
.pictFrame a {width: 150px; height: 140px; display: block; padding-top: 10px; text-align: center;}
.pictFrame a:link, 
.pictFrame a:active, 
.pictFrame a:visited {border: 3px solid #edeff0; color: #fff;}
.pictFrame a:hover {border: 3px solid #ff0099; color: #fff;}

/* kategorienübersicht */

.pictOverviewFrame {float: left; margin: 0 20px 20px 0; background: #fff;}
.pictOverviewFrame span {margin: 0 0 20px 0; padding: 4px 10px 6px 10px; background: #edeff0; font-size: 11px; font-weight: normal; text-align: left; height: 30px; display: block; color: #ff0099; font-weight: bold;}
.pictOverviewFrame a {width: 150px; height: 210px; display: block; padding: 0; text-align: center;}
.pictOverviewFrame a:link, 
.pictOverviewFrame a:active, 
.pictOverviewFrame a:visited {border: 3px solid #edeff0; text-decoration: none; color: #a4adb4;}
.pictOverviewFrame a:hover {border: 3px solid #ff0099; text-decoration: none; color: #ff0099;}
.pictOverviewFrame a:hover span {color: #fff; background: #ff0099;}

.pictOverviewFrame2 {float: left; margin: 0 20px 20px 0; background: #fff;}
.pictOverviewFrame2 span {margin: 0 0 20px 0; padding: 4px 10px 6px 10px; background: #edeff0; font-size: 11px; font-weight: normal; text-align: left; height: 30px; display: block; color: #ff9900; font-weight: bold;}
.pictOverviewFrame2 a {width: 150px; height: 210px; display: block; padding: 0; text-align: center;}
.pictOverviewFrame2 a:link, 
.pictOverviewFrame2 a:active, 
.pictOverviewFrame2 a:visited {border: 3px solid #edeff0; text-decoration: none; color: #a4adb4;}
.pictOverviewFrame2 a:hover {border: 3px solid #ff9900; text-decoration: none; color: #ff9900;}
.pictOverviewFrame2 a:hover span {color: #fff; background: #ff9900;}

/* info text */

#infoTextContainer .infoText {float: right; width: 187px; background: #fff; border-top: 3px solid #d2d6da; border-bottom: 3px solid #d2d6da; text-align: left; margin: 0; padding: 10px 0 0 0;}
#infoTextContainer .infoText h3 {font-size: 10px; line-height: 15px; color: #ff0099; font-weight: normal; margin: 0; padding: 0 15px 1em 0;}
#infoTextContainer .infoText p {font-size: 10px; line-height: 15px; color: #939ea5; margin: 0; padding: 0 10px 10px 0;}

/* werke blaettern (vor / zurueck) */

#pageNavi ul {list-style: none; margin: 0; padding: 0; border: 0; float: right;  width: 187px; font-size: 10px; line-height: 15px;}
#pageNavi ul li {float: left; margin: 0; padding: 0; border: 0;}
#pageNavi ul li a {display: block; width: 15px; height: 15px; line-height: 15px; overflow: hidden; margin: 0; padding: 0; float: left; text-decoration: none;}
#pageNavi ul li a img {display: none;}

#pageNavi ul li.btnBack {margin-left: 10px; margin-right: 10px;}
#pageNavi ul li.btnBack a:link, 
#pageNavi ul li.btnBack a:active, 
#pageNavi ul li.btnBack a:visited {background: url(../images/navigation/btn_prev.gif) no-repeat;}
#pageNavi ul li.btnBack a:hover {background: url(../images/navigation/btn_prev_over.gif) no-repeat;}

#pageNavi ul li.btnFor {margin-left: 10px;}
#pageNavi ul li.btnFor a:link, 
#pageNavi ul li.btnFor a:active, 
#pageNavi ul li.btnFor a:visited {background: url(../images/navigation/btn_next.gif) no-repeat;}
#pageNavi ul li.btnFor a:hover {background: url(../images/navigation/btn_next_over.gif) no-repeat;}

#pageNavi ul li.btnClose {float: right; margin-right: 10px;}
#pageNavi ul li.btnClose a:link, 
#pageNavi ul li.btnClose a:active, 
#pageNavi ul li.btnClose a:visited {background: url(../images/navigation/btn_close.gif) no-repeat;}
#pageNavi ul li.btnClose a:hover {background: url(../images/navigation/btn_close_over.gif) no-repeat;}

#currentPage {padding: 0 10px; background: #fff; color: #ff0099; text-align: center; width: 30px;}
#nrOfPages {padding: 0 10px; background: #edeff0; color: #b7bec3; text-align: center; width: 30px;}

/* grossdarstellung */

#imgContainer img {width: auto; height: auto;}


/* FOOTER */
/* ---------------------------------------------------------------------------------------- */

#footer ul {margin-left: 30px; margin-top: 20px;}
