/* backgorunds */

html, body									{ background-color: #111;}

#content, .content 							{ background-color: #222;}
.content .titrePage 							{ background-color: #111;}

#menubar, #the_page #menuSwitcher.menuhidden	{ background-color: #222;}

#thePicturePage, #imageHeaderBar			{ background-color: #111;}
#imageInfos, #infoSwitcher.infohidden 		{ background-color: #333;}
#thePicturePage #comments 					{ background-color: #333;}
#pictureCommentList li 						{ background-color: #444;}
#pictureCommentList .commentElement 			{ background-color: transparent;}

.switchBox, .header_notes 					{ background-color: #555;}
.thumbnailCategory, .commentElement 			{ background-color: #333;}
.message									{ background-color: #666;}

INPUT[type="text"], INPUT[type="password"],
INPUT[type="button"], INPUT[type="submit"],
INPUT[type="reset"], INPUT[type="file"],
SELECT, TEXTAREA							{ background-color: #555;}
INPUT:focus, SELECT:focus, TEXTAREA:focus	{ background-color: #666;}


/* font colors */

body, legend									{ color: #aaa;}
a											{ color: #ccc;}
a:hover 										{ color: #fff;}
INPUT.rateButton							{ color: #fff;}
H1, H3, INPUT.rateButtonSelected 			{ color: #ccc;}
.message									{ color: #fff;}
.commentContent .comments_toggle:hover		{ color: #fff;}
INPUT[type="text"], INPUT[type="password"],
INPUT[type="button"], INPUT[type="submit"],
INPUT[type="reset"], INPUT[type="file"],
SELECT, TEXTAREA							{ color: #ccc;}
INPUT:focus, SELECT:focus, TEXTAREA:focus	{ color: #fff;}


/* borders */

#content,.content, .content .titrePage		{ border-bottom: 2px solid #444;}
#imageHeaderBar 								{ border: solid 0 #444; border-bottom-width:2px;}
#copyright								 	{ border-top-width:2px;}
.switchBox 									{ border: 1px solid #000;}
.switchBoxTitle 								{ border-bottom: 1px solid #444;}
FIELDSET, INPUT, SELECT, TEXTAREA 			{ border: 1px solid #777;}


/* icons */ 

.pwg-icon									{ background-image: url(../default/s26/outline_808080.png);}
A:hover .pwg-icon 							{ background-image: url(../default/s26/outline_ffffff.png);}


/* general rules */

body 		{ margin: 5px 0;}
a:hover 		{ border-bottom: none;}
#copyright	{ padding:0 4px 0 0; text-align:right;}


/* content */

#the_page  #content.menushown, #the_page > .content.menushown, .contentWithMenu 	{ margin-left: 240px;}
#the_page  #content.menuhidden, #the_page > .content.menuhidden 					{ margin-left: 35px;}
#the_page  #content, #the_page > .content											{ margin-right: 0;}

#content,.content 			{ margin-bottom: 4px; padding-bottom: 4px;}
#thePicturePage #content 	{ padding-bottom: 0;}
.content .titrePage 			{ padding:0; margin-bottom:4px;}
.content .titrePage H2 		{ line-height: 20px; margin: 0; padding: 8px 0 0 2px;}


/* menubar */

#menubar  {
	display: inline;
	width: 230px;
	float: left;
	margin: 28px 8px 10px 0;
	padding: 0;
}
#menubar DT				{ text-align: left;}
#menubar dd 				{ padding: 0 0 1em 1em;}
#menubar .pwg-icon-filter { display: none;}


/* switchers */

#menuSwitcher {
	display: block;
	text-align: center;
	height: 32px;
	cursor: pointer;
	float: left;
	margin: 28px 0 0 -34px;
}


#imageInfos, #infoSwitcher.infohidden 		{ border-radius: 10px 0 0 10px;}
#menubar, #the_page #menuSwitcher.menuhidden	{ border-radius: 0 10px 10px 0;}
#the_page #menuSwitcher.menuhidden 			{ width: 25px; margin-left: 0;}

#infoSwitcher {
	display: block;
	text-align: center;
	height: 32px;
	cursor: pointer;
	position:absolute;
	left:75%;
	top:0;
	margin: 10px 0 0 7px;
	z-index:99;
}

#infoSwitcher.infohidden {
	width:25px;
	top:10px;
	right:0;
	left:auto;
	margin:0;
}

#theImage.infohidden 		{ width: 100%;}

#commentsSwitcher 					{ float: left; margin: 2px 0; cursor:pointer;}
.noCommentContent #commentsSwitcher	{ display: none;}

.switchArrow				{ width: 16px; height: 16px; margin: 8px 5px 8px 4px;}
.switchArrow				{ background: transparent url("icon/arrows_ccc.png");}
.switchArrow:hover 			{ background: transparent url("icon/arrows_fff.png");}
.menuhidden .switchArrow		{ background-position: 0 0;}
.menushown   .switchArrow		{ background-position: -16px 0;}
.infohidden .switchArrow		{ background-position: -16px 0;}
.infoshown   .switchArrow		{ background-position: 0 0;}
.commentshidden .switchArrow	{ background-position: -48px 0;}
.commentsshown   .switchArrow	{ background-position: -32px 0;}


/* switchboxes */

.switchBox {
    border-radius: 4px 4px 4px 4px;
    padding: 0.5em 10px;
    text-align: left;
    z-index: 100;
}
.derivativeSizeDetails				{ display: none;}

/* thumbnails */

#thumbnails  						{ padding-top: 5px;}
.thumbnails IMG 						{ margin-bottom: 0; vertical-align: middle;}
.thumbnailCategory DIV.illustration,
.commentElement DIV.illustration 		{ margin: 2px; text-align: center;}


/* picture page */

.contentWithMenu #imageHeaderBar 	{ padding: 0;}
#imageHeaderBar 						{ padding: 0 0 0 10px;}
#imageHeaderBar 						{ width: auto;}
#imageHeaderBar h2 					{ font-size: 100%; font-weight: inherit;}
#imageHeaderBar .browsePath {
	display:inline-block;
	float:none;
	font-size:120%;
	line-height:20px;
	padding: 8px 0 0 2px;
	font-weight:bold;
	margin:0;
}
.imageNumber 						{ display: inline-block; float: right; line-height: 26px; margin: 0 2px 0 0; min-width: 40px; text-align: center;}
#imageToolBar 						{ margin-top: -28px; margin-bottom: 0; float: right;}
#thePicturePage .pwg-button 			{ width: 26px;}
#thePicturePage .actionButtons 		{ margin-right: 26px;}

#theImageAndInfos {
	display: block;
	width: 100%;
	position: relative;
}
#theImage {
	display: inline-block;
	width: 75%;
	vertical-align: top;
	overflow: auto;
	padding: 10px 0 5px 0;
}

.rateButtonStarFull 					{ background: url('icon/rating-stars.png') no-repeat -16px center; width:16px;}
.rateButtonStarEmpty 				{ background: url('icon/rating-stars.png') no-repeat 0 center; width:16px;}


/* image infos */

#imageInfos {
	display: inline-block;
	width: 24.5%;
	vertical-align: top;
	padding-top: 35px;
	padding-bottom: 5px;
	margin: 10px 0 10px 0.5%;
	word-wrap:break-word;
}

#imageInfos .navThumbs 				{ width: 250px; height: 130px; margin: auto; padding: 0 5px;}
#imageInfos .navThumb 				{ position: relative; width: 120px; height: 120px; margin: 0; overflow: hidden;}
#imageInfos #linkPrev 				{ float: left;}
#imageInfos #linkNext				{ float: right;} 
#imageInfos .thumbHover 				{ position: absolute; width: 100%; height: 100%;}
#imageInfos .prevThumbHover 			{ background: transparent url(icon/none.png) no-repeat center center;}
#imageInfos .prevThumbHover:hover 	{ background: transparent url(icon/img_prev.png) no-repeat center center;}
#imageInfos .nextThumbHover 			{ background: transparent url(icon/none.png) no-repeat center center;}
#imageInfos .nextThumbHover:hover 	{ background: transparent url(icon/img_next.png) no-repeat center center;}

#imageInfos dl.imageInfoTable		{ display: block; padding: 0 15px; margin: 12px auto;}
#imageInfos .imageInfo 				{ display: block; line-height: 16px;}
#imageInfos .imageInfo dt				{ display: block; font-weight: bold; text-align: left; padding: 0;}
#imageInfos .imageInfo dd			{ display: block; text-align: left; margin: 0 0 5px 20px;}
#imageInfos h3						{ margin: 20px 0 10px;}


/* image comments */

#thePicturePage #comments 			{ padding: 2px 5px;}
#thePicturePage #comments h3 			{ margin: 10px 0;}
#thePicturePage #comments form 		{ margin: 10px 0;}
#thePicturePage #comments fieldset		{ margin: 0 1em;}

.noCommentText						{ display:block;}
.commentshidden #pictureComments		{ display: none;}
.commentContent .comments_toggle 	{ cursor: pointer;}

#commentAdd, #pictureCommentList 	{ width: 48%; padding: 0 1%;}
#commentAdd  						{ float: left; }
#pictureCommentList 					{ float: right; }

#commentAdd input[type="text"],
#commentAdd textarea {
	min-width: 95%;
	max-width: 95%;
	width: 95%;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 100%;
}
#pictureCommentList li {
	clear: both;
	display: block;
	padding: 0.5em 0;
	margin-bottom: 5px;
	border-radius: 5px;
	width: 100%;
}
#pictureCommentList ul 				{ list-style: none; padding: 0;}
#pictureCommentList li ul				{ list-style-type: none; padding: 4px;}
#pictureCommentList .author 			{ font-weight: bold;}
#pictureCommentList .date 			{ font-style: italic;}
#pictureCommentList .commentsOrder	{ float: left; margin-bottom: 5px;}
#pictureCommentList .navigationBar	{ float: right; margin-bottom: 5px;}
#pictureComments h4					{ margin: 0;}
#pictureComments form p				{ margin: 5px 0;}
#pictureComments form p textarea		{ margin: 10px 0;}
#pictureComments INPUT				{ margin: 10px;}
#pictureComments INPUT[type=submit]	{ margin: 0;}

/* plugins */

#the_page .content .stuffs 		{ margin: 0!important}
.categoryActions .theme_menuf 	{ display: none;}