/*************************
  Coppermine Photo Gallery
  ************************
  Copyright (c) 2003-2010 Coppermine Dev Team
  originally written by Gregory DEMAR

  The floog style was written by Florian Staudacher

  This program is free software; you can redistribute it and/or modify
  it under the terms of the GNU General Public License version 3
  as published by the Free Software Foundation.
  
  ********************************************
  Coppermine version: 1.4.18
  $HeadURL: https://coppermine.svn.sourceforge.net/svnroot/coppermine/trunk/cpg1.4.x/themes/water_drop/style.css $
  $Revision: 4380 $
  $Author: gaugau $
  $Date: 2008-04-12 12:00:19 +0200 (Sa, 12 Apr 2008) $
**********************************************/

/* BEGIN just the close-button of the notice */
#close { float: right; border: 1px solid #CCD7E0; margin: -10px -10px 0 0; background: #BB0000; color: #FFFFFF;	font-weight: bold; font-size: 16px; padding: 5px; cursor: pointer; }
/* END just the close button of the notice */

.cat_info { position: absolute; top: 0; right:50px; border-left: 1px solid #FFFFFF; padding: 5px 5px 7px 15px; width: 150px; }
.subcat { margin-left: 15px; padding: 0 3px 0; }
.loading { float:right; }

#site-description { float: left; }
.headerbar { display: block; padding: 0 5px 0; margin-bottom: 15px; height: 80px; }
.headerbar * { border: none; }
#header-box { position: absolute; top: 5px; right: 20px; text-align: right; color: #FFF; }
#header-box * { color: #FFF; }

/* BEGIN big-ass links at the top */
.sitemenu {  padding-top: 40px !important; }
.sitemenu, .sitemenu * { color: #FFF; font-size: 16px; }
div.sitemenu a { padding: 40px 6px 0; margin: 0; }
.sitemenu a:hover { background: #53575e; }  /* dark color: #1c232d */
/* END big-ass links at the top */

/* BEGIN ye olde html tags */
* { font-family: "Lucida Grande", "Trebuchet MS", Verdana, Arial, sans-serif !important; }
body { background: url(images/bg.png) top repeat-x #1c232d;
       font-size: 12px; color: #000666; margin: 0px; padding: 10px; }
table {}
h1{ font-weight: normal; font-size: 21px; text-decoration: none; line-height : 120%; color: #718EA5; margin: 10px 3px 15px; }
h2 { color: #FFF; font-size: 18px; margin: 0.3em 0 1em; }
h3 { font-weight: normal; font-size: 12px; margin: 0.3em 0 1em; }
p { margin: 2px 0px; }
p, div { font-size: 13px; }
ul { margin-left: 5px;  padding: 0px; }
li { margin-left: 10px; margin: 4px 0 4px; padding: 0px; list-style-position: outside; list-style-type: disc; }
input[type=text], input[type=password], textarea, select { background: #999 !important; padding: 0.2em; }
select { padding: 0; }
input[type=file] { color: #000; }
a { color: #003366; text-decoration: none; }
a:hover { text-decoration: none; }
/* END ye olde html tags */

/* BEGIN useful clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* END useful clearfix */
 
/* BEGIN layout containers */
.tha_main_table { width: 1024px !important; float:left; margin:0 auto;}
.the_main_content{ width: 1325px;  margin:0 auto; }
.sub_header { background: url(images/subheader.png) top left repeat-x #2b3036; padding: 5px;
	margin: 0 0 10px; height: 18px; color: #FFF; position: relative;
	margin-top:10px;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.sub_header * { color: #FFF; }
.sub_sub_menu, .sub_sub_menu * { font-weight: bold; color: #FFF; border-bottom: 1px solid #FFF; }
.sub_sub_menu a { padding: 10px 5px 5px; border:none; }
.sub_sub_menu a:hover { background: #bbb; } /* even lighter color: #c6c6c6 */
.album { background: url(images/vert_gradient.png) top left repeat-x #bfbfbf; padding: 1em; color: #FFF; 
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.album * { color: #FFF; }
/* END layout containers */

.list { background: #FFF; padding: 5px; margin: 0 0 5px; min-width: 600px;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.list:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.list {display:inline-block;} 
/* Hide from IE Mac \*/ 
.list {display:block;} 
/* End hide from IE Mac */ 

/* BEGIN form elements */
.textinput { border: 1px solid #888; padding: 0 3px 0; font-size: 12px; }
.listbox { border: 1px solid #888;  background: #999 !important; }
.button { border: 1px solid #888; background: #999 !important; vertical-align : middle; }
.comment_button { border: 1px solid #888; padding: 0 3px 0; color: #444; }
.radio { font-size: 100%; vertical-align : middle; }
.checkbox { font-size: 100%; vertical-align : middle; }
/* END form elements */

.bblink a { color: #0033CC; text-decoration: none; }
.bblink a:hover { color: #0033CC; text-decoration: underline; }

/* BEGIN various tables */
.tableh1 { color: #000; padding: 0 5px 0; }


.tableh1_compact { color: #FFF; padding: 2px 5px 2px; }
.tableh2 { color : #000; padding: 3px 10px 3px; }
.tableh2_compact { color : #000; padding: 2px 5px 2px; }
.tableb { border: 2px; padding: 3px 10px 3px; }
.tableb_compact { padding: 2px 5px 2px; }
.tablef { padding: 10px; }
/* END various tables */

/* BEGIN cat list */
.catrow_noalb {
        background: url(images/hor_gradient.png) top left repeat-y #37abe1; position: relative;
        color : #FFF; margin: 0 0 1px; padding: 5px 10px;
        -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.catrow_noalb .catlink b a { color: #FFF; }
.catrow_noalb:hover { background: #0084c4; }
.catrow {  background: #F2F5F7 ; padding: 3px 10px 3px; }
.catlink { display: block; margin: 1px 0 1px; }
/* END cat list */

/* BEGIN blue boxes for albums and thumbnails */
.album_thing,
.thumbnails { padding: 0.5em; float: left; font-size: 0.8em !important; margin: 0 1px 1px 0; color: #FFF; min-width: 20em;
	background: url('images/hor_gradient.png') top left repeat-y #37abe1; position: relative; text-align: left;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.album_thing:hover,
.thumbnails:hover { background: #0084c4; }
/* END blue boxes */

/* BEGIN album list */
.album_thing {  padding-bottom: 2.5em; }
.album_thing_header { display: block; border-bottom: 1px solid #FFF; margin-bottom: 5px; }
.album_thing_image { float: left; margin: 5px; }
.album_thing_content { margin: 5px; display: inline; }
.album_thing_infos { border-top: 1px dotted #CCC; padding-top: 3px; margin-top: 3px; font-size: 0.85em;
	position: absolute; bottom: 0.5em; left: 0.5em; right: 0.5em; }
.album_thing .buttonlist { /* position: absolute; top: -15px; right: -2px; */ position:relative; top:20px; right:4px; }
/* END album list */

/* BEGIN thumbnails */
.thumbnails img { float: left; margin-right: 0.5em; }
.thumb_filename { display: block; font-size: 0.9em; clear: left; float: left; }
.thumb_title { font-weight: bold; padding: 2px; margin: -1em 0 0.9em; display: block; }
.thumb_caption { padding: 1px; display : block; }
.thumb_caption a { text-decoration: underline; color: #FFF; }
.thumb_num_comments { font-weight: normal; font-size: 85%; padding: 2px; font-style : italic; display : block; }
/* END thumbnails */

/**
 * FIXME: don't know where the following styles apply
 * leaving them in for now...
 */
.user_thumb_infobox { margin-top: 1px; margin-bottom: 1px; }
.user_thumb_infobox th { font-weight : bold; font-size: 100%; margin: 1px 0; text-align : center; }
.user_thumb_infobox td { font-size: 85%; margin: 1px 0; text-align : center; }
.user_thumb_infobox a { text-decoration: none; color: #000; }
.user_thumb_infobox a:hover { color: #000; text-decoration: underline; }
.sortorder_cell { background: #8AA5B5 ; color: #FFF; padding: 0 2px; margin: 0px; }
.sortorder_options { background: #8AA5B5 ; color: #FFF; padding: 0px; margin: 0px; font-weight: normal; font-size: 80%; white-space: nowrap; }
.admin_menu_thumb { font-size: 90%; border: 1px solid #CCD7E0; background: url(images/button_bg.gif) bottom; color: #000;
	font-weight: bold; margin-top: 0px; margin-bottom: 0px; width: 85px; }
.admin_menu_thumb a { color: #000; text-decoration: none; display: block; position: relative; padding: 1px 10px; }
.admin_menu_thumb a:hover { color: #000; text-decoration: underline; }
td #admin_menu_anim { background-image : url(images/button_bg_anim.gif); }
.comment_date { color : #5F5F5F; font-size: 90%; vertical-align : middle; }

/* BEGIN pagination */
.pagination { position: absolute; right: 1em; top: 0; padding: 2px 0 0; }
.pagination span,
.pagination > a { display: inline-block; }
.pagination > a { top: 3px; position: relative; }
.active_page b,
.navmenu a { border: 2px solid #888; padding: 3px 7px; background: none; margin: 0; }
.active_page { margin-right: 0.2em; }
.navmenu a { font-weight: bold; background : #888; }
.navmenu a:hover { background : #777; border: 2px solid #777; }
/* END pagination */

/* BEGIN list of buttons */
.buttonlist ul li { list-style: none !important; padding: 0; }
.admin_menu,
.buttonlist ul li { font-size: 90%; border: 1px solid #888; background: #999;
	margin: 2px; text-align: center; min-width: 7em; float: left;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.admin_menu a,
.buttonlist ul li a { text-decoration: none; display: block; position: relative; padding: 0.3em; }
.admin_menu a:hover,
.buttonlist ul li a:hover { text-decoration: none; background: #AAA; }
/* END buttons */

/* BEGIN admin menu */
.admin_menu_wrapper { margin: 1em 0 1.5em; }
.adm_menu { font-size: 9px; width: }
/* END admin menu */

/* BEGIN single image display */
.display_media { padding: 3px 10px; margin: 0 auto 0; width: 60%; min-width: 900px; }
.image { margin: 2px; border: 1px solid #BBB; }
.imageborder { margin: 5px auto 5px; text-align: center; padding: 5px; background: #fff; border: 1px solid #BBB;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.img_navbar, .img_admin_menu { text-align: center; margin: 1em auto; min-width: 600px; width: 60%; background-image:url(images/headerbg.png); padding:5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;  }
.img_navbar .navmenu a { background: none; border: none; padding: 0; }
 
.img_navbar img { background: #888; padding: 6px; vertical-align: middle; }
 
#picinfo { text-align: center; width: 60%; min-width: 600px; margin: auto; }
.img_desc,
.img_description { text-align: left; margin: 1em auto; width: 60%; min-width: 600px; background-color:#999999; padding:5px;  }
.img_desc { background: #999; border: 1px solid #888; padding: 0.8em 0;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.img_title { font-weight: bold; }
.img_title,
.img_caption { margin: 0.2em 1.5em; }
.img_info { position: relative; }
.img_info:hover { background: #777; }
.img_info_val { position: absolute; right: 10px; }
#comments { margin: 2em auto; width: 60% !important; min-width: 600px; }
.comment { padding: 3px 10px; background: #aaa; margin: 3px 0;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.commentInfo { float: right; background: #ccc;  width: 20% !important; padding: 3px 10px; margin: -3px -10px 0 0;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.commentDate { font-size: 9px; float: right; color: #666; margin: 3px 0 0; text-align: right; }
.votings { margin: 1em auto; }
/* END single image display */

/* BEGIN filmstrip */
.filmstrip { width: 60%; margin: 0 auto 0; min-width: 600px; }
.film_images table tr td { vertical-align: middle; background: #999; }
.film_images table tr td a { padding: 2px; display: block; }
.film_images table tr td a img:hover { border: 1px solid #DDD; }
/* END filmstrip */

/* BEGIN footer */
.footer { font-size : 9px; }
.footer a { text-decoration: none; color: #FFF; }
.footer a:hover { color: #FFF; text-decoration: underline; }
/* END footer */

/* TODO: sort these declarations in their respective areas */
.statlink, .statlink * { color: #000; }
.alblink a { text-decoration: underline; color: #000; }
.alblink a:hover { color: #000000; text-decoration: underline; }
.topmenu {  line-height : 130%; font-size : 110%; }
.topmenu a { color : #03C; text-decoration : none; }
.topmenu a:hover  { color : #0033CC; text-decoration : underline; }
.img_caption_table { border: none; background: #FFF; width : 100%; margin : 0; }
.img_caption_table th { background: #D1D7DC; font-size : 100%; color : #000; padding: 4px 10px; border-top : 1px solid #FFFFFF; }
.img_caption_table td { background: #F2F5F7 ; padding: 6px 10px; border-top : 1px solid #FFFFFF; white-space: normal; }

/* BEGIN debug */
.debug_text { border: 3px solid #789; background: #1c232d; width: 100%; margin: 0; font-size: 10px; font-family: monospace !important; }
/* END debug */

.clickable_option { cursor : default; }
.listbox_lang { color: #006; background-color: #F2F5F7; border: 1px solid #F2F5F7; font-size: 80%; vertical-align : middle; }

/**
 * BEGIN vanity images
 * TODO: make the images into css sprites
 */
#vanity a { display:block; width:57px; height:20px; margin: 3px 20px; }
#vanity img {border:0}
#v_php {float:left;background-image:url(../../images/powered-php.gif);}
#v_php:hover {background-image:url(../../images/h_powered-php.gif);}
#v_mysql {float:left;background-image:url(../../images/powered-mysql.gif);}
#v_mysql:hover  {background-image:url(../../images/h_powered-mysql.gif);}
#v_xhtml {float:right;background-image:url(../../images/valid-xhtml10.gif);}
#v_xhtml:hover {background-image:url(../../images/h_valid-xhtml10.gif);}
#v_css {float:right;background-image:url(../../images/valid-css.gif);}
#v_css:hover{background-image:url(../../images/h_valid-css.gif);}
/* END vanity */

#footerlink{
	width:900px;
	clear:both;
	text-align:center;
	margin:0 auto;
}
#footerlink ul {
	margin-top:10px;
	margin:0 auto;
	clear:both;
}

#footerlink ul li{
	display:inline;
	list-style:none;
	margin-left:10px;

}

#footerc{
	clear:both;
	text-align:center;
	color:#FFF;
}

#footerlink ul li a{
	color:#FFF !important;
}
 
#footerc a{
	color:#FFF;
}
.tableb{
/*	border:1px solid #FFF;	*/
	background-color:#CCC;
}

.tableb_alternate{	
/*	border:1px solid #666;*/
	background-color:#999;	
}


.maintable div h2{
	background-image: url(images/headerbg2.png);
	height:20px;
	padding:4px;
	border: 4px solid #FFF;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}

.banner_dx{
	width:150px;
	float:right;
	overflow:hidden;
	text-align:center;
}

.banner_sx{
	width:150px;
	float:left;
	overflow:hidden;	
	text-align:center;	
}

.tableh1 h2{
		background-image: url(images/headerbg2.png);
	height:20px;
	padding:4px;
	border: 4px solid #FFF;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
