/*
 +------------------------------------------------------------------------+
 | WORLDWORDSANDIMAGES.COM                                                |
 +------------------------------------------------------------------------+
 | wwi.css                                                                |
 | main style sheet                                                       |
 |                                                                        |
 | Dtek Digital Media, www.dtek.net                                       |
 | 2005.09.13                                                             |
 |                                                                        |
 +------------------------------------------------------------------------+
 */

/* 
 * global defaults
 *
 */

body, html  {
	background-color: #666666;
	background-image: url(../img/bg.gif);
	margin: 0;
	padding: 0;
	border: 0;
	height: 100%;
	text-align: center; /* centering hack for Win/IE5.5 */
}

div, td, p, ul, ol  {
	/*font-family: sans-serif;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
}

a:link, a:visited, a:active  {
	text-decoration: underline;
	color: #FFFFFF;
}
a:hover  {
	text-decoration: none;
	color: #CCCCCC;
}



/* 
 * font elements
 *
 */
 
.headfoot  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #999999;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

.headfoot-small  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #999999;
	letter-spacing: 0.1em;
}

.headfoot-highlight  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #66CCFF;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

a.headfoot-highlight:link, a.headfoot-highlight:visited, a.headfoot-highlight:active  {
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #66CCFF;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

a.headfoot-highlight:hover  {
	text-decoration: underline;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #66CCFF;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.page  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #999999;
	letter-spacing: 0.1em;
}

a.page:link, a.page:visited, a.page:active  {
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
	letter-spacing: 0.1em;
}
a.page:hover  {
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	color: #999999;
	letter-spacing: 0.1em;
}
a.page-sel:link, a.page-sel:visited, a.page-sel:active, a.page-sel:hover  {
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	color: #999999;
	letter-spacing: 0.1em;
}

a.photonav:link, a.photonav:visited, a.photonav:active  {
	text-decoration: none;
	color: #FFFFFF;
}
a.photonav:hover  {
	text-decoration: none;
	color: #999999;
}

.credit  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #999999;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

a.credit:link, a.credit:visited, a.credit:active  {
	text-decoration: none;
	font-size: 9px;
	font-weight: normal;
	color: #FFFFFF;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
a.credit:hover  {
	text-decoration: none;
	font-size: 9px;
	font-weight: normal;
	color: #999999;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

a.theme-thumb:link, a.theme-thumb:visited, a.theme-thumb:active  {
	text-transform: uppercase;
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
}
a.theme-thumb:hover  {
	text-transform: uppercase;
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	color: #999999;
}

.title  {
	color: #66CCFF;
	text-transform: uppercase;
	font-size: 13px;
}
 
.highlight  {
	color: #66CCFF;
	text-transform: uppercase;
}

.content-header  {
	font-weight: bold;
}

.copyright  {
	font-size: 9px;
	/*color: #5D5D5D;*/
	color: #999999;
	text-transform: uppercase;
}

.news  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	letter-spacing: 0.05em;
	line-height: 1.4;
	color: #999;
}
.news a:link, .news a:visited, .news a:active  {
	text-decoration: none;
	color: #fff;
}
.news a:hover  {
	text-decoration: none;
	color: #ccc;
}


.news-header  {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	letter-spacing: 0.05em;
	line-height: 1.4;
	color: #66CCFF;
}


 
/* 
 * layout elements
 *
 */

#page-box  {
	margin: 0 10px;
	height: 100%;
}
#page-content  {
	width: 740px;
	height: 100%;
	margin: 0 auto;
	text-align: left;  /* counter the centering hack for Win/IE5.5 */
	background-color: #262626;
	/* needed in case the viewport is shorter than the page content */
	background-image: url(../img/c_bg.gif); 
}

#side-header-box  {
	background-color: #262626;
	border-right: solid #CCCCCC 1px;
	border-left: solid #CCCCCC 1px;
	border-bottom: solid #CCCCCC 1px;
	height: 72px;
	width: 738px;
	/* the next line is a version of the 'commented backslash hack'
	   to set the true block width for all browsers except Mac/IE5. this
	   ensures that our borders line up correctly with the #page-content 
       background image
       see: http://www.sam-i-am.com/work/sandbox/css/mac_ie5_hack.html */
    /* \*/ width: 740px; /* */
}
#header-box  {
	background-color: #262626;
	border-right: solid #CCCCCC 1px;
	border-left: solid #CCCCCC 1px;
	border-bottom: solid #CCCCCC 1px;
	height: 111px;
	width: 738px;
	/* see the 'commented backslash hack' note above */
    /* \*/ width: 740px; /* */
}
td.side-header  {
	vertical-align: bottom;
}
#side-header  {
	margin: 7px;
	vertical-align: bottom;
}
#logo  {
	margin: 0 10px 1px 14px;
}

td.menu  {
	vertical-align: top;
}

.menubar  {
	float: left;
	width: 100%;
	margin: 49px 10px 25px 0;
}

#catnav  {
	/*clear: left;*/
/* 	display: inline-block; */
/* 	width: 50%; */
	float: right;
/* 	text-align: right; */
	border-top: 1px #262626 solid;
/* 	padding-top: -1px; */
/* 	border: 1px white dashed; */
	vertical-align: bottom;
	margin-right: 10px;
	margin-bottom: 3px;
/* 	margin: 0 10px 3px 0; */
}

#content-box  {
	background-color: #424242;
	border-right: solid #CCCCCC 1px;
	border-left: solid #CCCCCC 1px;
	width: 738px;
	/* see the 'commented backslash hack' note above */
    /* \*/ width: 740px; /* */
}

#footer-box  {
	background-color: #262626;
	border-right: solid #CCCCCC 1px;
	border-left: solid #CCCCCC 1px;
	border-top: solid #CCCCCC 1px;
	width: 738px;
	/* see the 'commented backslash hack' note above */
    /* \*/ width: 740px; /* */
}
#footer-left  {
	float: left;
	width: 350px;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	margin: 4px 7px 70px 7px;
	padding: 0;
}
#footer-right  {
	float: right;
	width: 350px;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	margin: 6px 7px 70px 7px;
	padding: 0;
	text-align: right;
}

/* home page content */

#content-home-left  {
	float: left;
	width: 181px;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	margin: 8px 0 0 20px;
	padding: 0;
}
#content-home-right  {
	margin: 57px 0 0 271px;
/*	float: right;
	display: inline;
	margin: 57px 70px 0 70px;
	padding: 0;*/
/* 	border: 1px red dashed; */
}
#content-home-news  {
	clear: left;
	float: left;
	width: 189px;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	margin: 15px 0 0 16px;
	padding-bottom: 20px; /* IE/Win prefers padding to margin here... */
/* 	border: 1px white dashed; */
}
#content-home-news #text-block  {
	width: 189px;
	background-color: #000000;
	padding: 4px;
}

/* photo detail pages */

#content-hdetail  {
	background-color: #424242;
	margin: 30px 13px 0 13px;
	border-bottom: 1px dashed #424242; /* IE/Win wants this */
}
#content-vdetail  {
	background-color: #424242;
	margin: 10px 60px 0 60px;
	border-bottom: 1px dashed #424242; /* IE/Win wants this */
}

/* now defined dynamically in photo.php so the photonav elements float to the 
   correct width...
#content-hdetail .photo-box  {
	float: left;
	width: 418px;
}
*/
#content-hdetail .photo  {
	margin-right: 28px;
	margin-bottom: 28px;
}
/* now defined dynamically in photo.php so the photonav elements float to the 
   correct width...
#content-vdetail .photo-box  {
	float: left;
	width: 289px;
}
*/
#content-vdetail .photo  {
	margin-right: 28px;
	margin-bottom: 28px;
}

#content-hdetail .copy  {
	margin-bottom: 30px;
}
#content-vdetail .copy  {
	margin-bottom: 60px;
}

#photonav-left  {
	float: left;
	width: 60px; /* roughly fits the narrowest photo in the db... */
	margin-top: 3px;
	margin-left: 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999999;
}
#photonav-right  {
	float: right;
	width: 150px; /* roughly fits the narrowest photo in the db... */
	margin-top: 3px;
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999999;
}

#content-detail-clear  {
	clear: both;
}


/* thumbnail pages */

#content-thumbs  {
	background-color: #424242;
	margin: 12px 9px;
}
div.thumb-box  {
	/*text-align: center; */ /* uncomment to center-align rows of less than 4 thumbs*/
	margin: auto;
	background-color: #000000;
	width: 100%;
}
table.thumb-box  {
	width: 100%; /* comment to center-align rows of less than 4 thumbs */
	margin: auto;
	background-color: #000000;
}
td.photo-thumb-box  {
	text-align: center;
	width: 25%;
}
td.theme-thumb-box  {
	width: 25%;
}

/* region index page */

#content-map  {
	background-color: #424242;
	margin: 0;
}

/* about and contact page content */

#content-side-left  {
	float: left;
	width: 181px;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	margin: 8px 0 30px 20px;
}
#content-side-right-box  {
	float: right;
	display: inline; /* IE/Win hack to fix float element double-margins */ 
	width: 467px;
}
#content-side-right  {
	margin: 30px 70px 30px 0;
}


/* error messages (photo detail and thumbnail pages) */

#error  {
	height: 250px;
	margin: 30px;
	padding: 10px;
	background-color: #262626;
	color: #000000;
}


/* 
 * image elements
 *
 */

img.side-logo  {
	margin-bottom: 15px;
}

img.logo  {
	float: left;
}

img.news-logo  {
	margin: 0 0 3px 77px;
}

img.thumbnail  {
	margin: 5px;
}
 
img.fullsize  {
	border: solid #000000 3px;
}

img.arrow-right  {
	vertical-align: middle;
}

img.photonav-arrowr  {
	vertical-align: middle;
	margin: 0 0 2px 3px;
	border: 0;
}
img.photonav-arrowl  {
	vertical-align: middle;
	margin: 0 3px 2px 0;
	border: 0;
}

img.icons  {
	vertical-align: baseline;
}
 
 

/* 
 * form elements
 *
 */

input.text  {
	width: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}

input.button  {
	background-color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-transform: uppercase;
}

input.checkbox  {
}

textarea  {
	width: 100%;
	height: 100px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}