/* NOTES: 
CSS style sheets written by  Dno hadjinicola, Web Theoria for Nissi Bay web site
July 2008 */

/*____________________________________ BODY  ____________________________________*/


html, body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
font: 12px Arial, Helvetica, sans-serif;
font-size-adjust: 0.50;
color: #666;
background: #000000 url(../images/bgFade.gif) 0 0 repeat-x; text-align:center;
}

.clear-both { clear:both; }
p { font-size:12px; font-family: Arial, Helvetica, sans-serif; color: #000000; line-height: 1.4em; }
a {  color: #000000; text-decoration:underline; }
a:hover {  color:#000000; text-decoration:underline;  }


/*____________________________________ MAIN CONTAINER ____________________________________*/

#mainContainer {  width: 800px; padding: 0 0; background-color:#000000;  margin-left: auto; margin-right: auto; text-align: left;  }
#topContainer { width: 800px; padding: 0 0; height: 78px; background: #010101 url(../images/header_top.gif) no-repeat; margin-left: auto; margin-right: auto; }

/*____________________________________ HEADER ____________________________________*/

#right_container{ width: 400px; height: 102px; float:right; padding: 0; margin: 0;}
#header { height: 131px; width: 800px; background: #FFF url(../images/header_bottom.gif) 0 100% no-repeat; position:relative; }
#leftLogo { height:83px; width:141px; margin: 0 0 0 0; padding: 0; float:left; background: url(../images/header_logo.gif) no-repeat; }
#left_logo_type { height:70px; width:388px; margin: 0 0 0 0; padding: 0; float:left; background: url(../images/header_logoType.gif) no-repeat; }
#top_right {  height:83px; width:235px; margin: 0 0 0 0; padding: 0; float:right;  }

/*____________________________________ BANNER ____________________________________*/

#banner { width: 800px; margin: 0 0 0 0; }

/*____________________________________ NAV ____________________________________*/

#nav { height:37px; width:700px; text-align:left; margin: 12px 0 0 25px; padding: 0; float:left;}
#nav ul { margin: 0; padding: 0; list-style: none;}	
#nav li { display:inline; }
#nav li a { font-size: 12px; letter-spacing: -0.50px; text-transform: uppercase; padding-left: 12px; padding-right: 12px; border-right: 1px solid #000000; line-height: 37px; color:#000000; text-decoration: none; }
#nav li a:hover, #nav li .active_link { text-decoration: none; color:#FF3300; }
#nav li.last a { padding-right: 0; border-right: none; }

/*____________________________________ BELOW NAV ____________________________________*/

#below_nav { width: 800px; margin: 0px; height: 15px; }

/*____________________________________  SUB NAV (Not currently used in this site )____________________________________*/

#sub_nav { width: 660px; text-align:center; margin: 5px 20px 4px 20px; padding: 0; float:left;}
#sub_nav ul { margin: 0; padding: 0; list-style: none;}	
#sub_nav li { display:inline; }
#sub_nav li a { font-size: 11px; padding-left: 11px; padding-right: 12px; border-right: 1px solid #000; line-height: 18px; color:#000; font-weight: normal; text-decoration: none; }
#sub_nav li a:hover, #sub_nav li .active { text-decoration: none; color:#666666; }
#sub_nav li.last a { padding-right: 0; border-right: none; }


/*____________________________________ MID SECTION ____________________________________*/

#mid_section { width: 800px; margin: 15px 0 0 0;}


/*____________________________________ RIGHT COLUMN ____________________________________*/

#Right_wide_top { display:block; width: 625px; height:86px; float: right; background-color:#000; padding:0; margin:15px 0 0 0; background: #000 url(../images/topWide_right.gif) 0 0 no-repeat;}
#Right_wide_top .pbox { margin: 65px 25px 0 25px; padding: 0; }
#Right_wide { width: 625px; float: right; background-color: #ffffff; padding:0; margin: 0 0 0 0;  background: #ffffff url(../images/botWide_right.gif) 0 100% no-repeat; }
#Right_wide .pbox, #Right_wide .pbox_linebot { margin: 40px 25px 25px 25px; padding: 0; }
#Right_wide a { color: #ff7f00; text-decoration: none; }
#Right_wide a:hover { color:#000000; text-decoration: none; }	 

/*____________________________________ LEFT COLUMN ____________________________________*/
#left_thin { width: 155px; float: left; padding:0 0 0 0; margin:15px 0 25px 0; background-color:#1a1a1a; line-height: 13px; background: #1a1a1a url(../images/leftThin_bot.gif) 0 100% no-repeat;}
#left_thin .holder { width: 155px; float: left; padding:0 0 10px 0; margin:0; }
#left_thin .pbox { margin: 20px 8px 20px 8px; padding: 0 0 0 0;}
#left_thin .pbox p { color:#ffffff; margin: 4px 0 4px 0; font-size:11px;}
#left_thin .pbox .title { color:#7723A8; font-size:13px; }
#left_thin .pbox a { color:#999999; text-decoration: none; }
#left_thin .pbox a:hover { color:#ccc; text-decoration: none; }
#left_thin .imageTitle { width: 155px; height:41px; float: left; padding:0 0 0 0; margin: 0 0 0 0; background: #000 url(../images/leftThin_top.gif) 0 0 no-repeat; }
#left_thin .image { width: 155px; float: left; padding:0 0 0 0; margin: 0 0 0 0; }
#left_thin h2 {  font-size:14px; margin: 10px 0 0 0; padding: 0; line-height: 18px; font-weight: normal; color:#f5C500;  }
#left_thin #more { width: 80px; padding:0 3px 0 0; margin: 5px 8px 0 0; float:left; font-size:9px; }
#left_thin #more a { color:#666666; text-decoration:none; }
#left_thin #more a:hover { color:#ffffff; text-decoration:none; }


#noteMore { width: 60px; padding:0 3px 0 0; margin: 5px 8px 0 0; float:left; font-size:9px; }
#noteMore a { color:#666666; text-decoration:none; }
#noteMore a:hover { color:#000000; text-decoration:none; }

/*____________________________________ CONTENT AREA ____________________________________*/

#content { margin: 0; width:800px; padding:0; }

/*____________________________________ PRE SET MARGINS ____________________________________*/

.toplarge {  margin-top: 41px;  }
.topmid {  margin-top: 20px;  }
.topsml {  margin-top: 10px;  }
.botlarge {  margin-bottom: 40px;  }
.botmid {  margin-bottom: 20px;  }
.botsml {  margin-bottom: 10px;  }

/*____________________________________ GALLERY ____________________________________*/

ul.gallerythumbs { margin:0; padding:0; list-style: none outside none;  }
ul.gallerythumbs li { float:left; text-align:center; margin:0 15px 15px 15px; width:100px; }

/*____________________________________ MISC ____________________________________*/

#more_plain a { font-size:9px; padding:0; margin: 5px 0 0 0; float:left; color: #666666; text-decoration: none; }
#more_plain a:hover { font-size:9px; padding:0; margin: 5px 0 0 0; float:left; color: #FFFFFF; text-decoration: none; }
.image { float: left; margin: 0 0 0 7px; padding: 0; }
div .more { width: 40px; padding:0; margin:0 0 0 0; float:left; color:#999999; line-height:6px; font-size:11px; background:url(../images/arrowNote.gif) no-repeat right center;}
div .more_link { width: 80px; padding:0; margin:0 0 15px 0; float:left; color:#999999; line-height:6px; font-size:11px; background:url(../images/arrowNote.gif) no-repeat right center;}
#moreInfo { width: 40px; padding:0 0 0 0; margin: 0 0 0 0; float:left; color:#999999; line-height:12px; text-decoration: none; font-size:11px; background:url(../images/generic/arrowNoteInfo.gif) no-repeat right center;}

/*____________________________________ COLOURS ____________________________________*/

.nissi {  color:#ff7f00;  }
.fix {  color:#000000;  }

/*____________________________________ TITLES ____________________________________*/

.title_generic { font-size:14px; margin: 0 0 4px 0; height:20px; padding: 0 0 0 26px; line-height: 20px; font-weight:normal; color:#000000; background:url(../images/arrow_generic.gif) no-repeat left center;  }

/*____________________________________ BORDERS AND DIVIDERS ____________________________________*/

div .divider { display:block; height:1px; margin: 0 40px 0 40px; padding:0; border-bottom: 1px solid #CCC; border-bottom-width:1px; position:relative; }

/*____________________________________ HEADERS ____________________________________*/

/***H1***/
h1 {font-size:20px; margin: 0 0 25px 0; padding: 0; line-height: 18px; font-weight: bold; color:#ff7f00; }

h2 {  font-size:16px; margin: 0 0 0 0; padding: 0; line-height: 18px; font-weight: bold; color:#ff7f00;  }


h3 {font-size:13px; margin: 20px 0 4px 0; padding: 0; line-height: 14px; font-weight:bold; color:#000000; }

/***NO SPACE***/
h1.nospace, h2.nospace, h3.nospace { margin-bottom:4px; } 
.no_top_space {  margin-top:0;}

/*____________________________________ FOOTER ____________________________________*/
.tl_footer {  background: url(../images/footer_tl.gif) 0 0 no-repeat; color:#000000; }
.tr_footer {  background: url(../images/footer_tr.gif) 100% 0 no-repeat; padding:12px; color:#000000;  }
#footer_wrapper { margin: 15px 0 0 0; width:800px; height: 100px; padding:0; background-color:#343434; position:relative; background: #343434 url(../images/footer_bottom.gif) 0 100% no-repeat; }
#webtheoria { float: right; width: 131px; height:37px; color:#CCCCCC; margin: 10px 0 0 0; background: url(../images/webtheoria_logo.gif) 0 0 no-repeat; }	
#footer_wrapper .terms { width:300px; margin: 10px 0 0 0; font-size: 11px; color: #FFF; padding: 0; line-height: 20px; color: #CCCCCC; float:left; }

#ads { height:39px; margin: 5px 0 0 0; padding: 0; color:#FFFFFF; position:relative; }
#ads ul{ margin:0; padding:0; list-style: none outside none; }
#ads li { display:block; float:left; padding:0 0 0 25px; margin:0; }
#botContainer { width: 800px; padding: 0 ; height: 76px; margin-left: auto; margin-right: auto; margin-bottom:80px; }
#botContainer .terms { width:300px; margin: 10px 0 0 0; font-size: 11px; color: #FFF; padding: 0; line-height: 20px; color:#666666; float:left; }

/*____________________________________ AJAX LIGHTBOX GALLERY RULES ____________________________________*/

#lightbox{  position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;  }
#lightbox a img{ border: none; }
#outerImageContainer{  position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;  }
#imageContainer{  padding: 10px;  }
#loading{  position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;  }
#hoverNav{  position: absolute; top: 0; left: 0; height: 100%;width: 100%; z-index: 10;  }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{  width: 49%; height: 100%; background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */ display: block;  }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{  font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto;width: 100%	 }
#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}		
#overlay{  position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000;  }