@import url("reset.css");
/* colors

cream: f1ecd8
dark brown: #5A5545
mid brown (old link): #b4aa8a;
red 9f1319

hr lines : c9b8a8

*/



body { background: #f1ecd8;
 font-family: Georgia, serif;
margin: 0;
padding: 0;
text-align: center;

}
html, body, #container {height: 100%;}
body > #container {height: auto; min-height: 100%;}

h1 {font-size: 40px; /*text-transform: uppercase;*/ color: #5A5545; border-bottom: 1px solid #c9b8a8; margin: 1em 0 0.5em;font-style: italic;}
#body_home h1{ font-size: 72px; margin: .5em 0; padding-bottom: .15em; }

h2 {font-size: 40px;  margin-top: 1em; color: #5A5545;font-style: italic;padding-bottom: .15em; border-bottom: 1px solid #c9b8a8;}


h3 {font-size: 18px;   color: #35281b; font-style: italic;}

#header{background: url(../imgs/bg_header.gif) repeat-x left -10px; position: fixed; top: 0px; left: 0px;
height: 80px; width: 100%; z-index: 104; }
#header_container{ width: 960px; text-align: left; margin: 0 auto;  }

#header_logocontainer{ position: relative; z-index: 1003; top: -45px; left: -20px; width: 298px; height: 176px; background: url(../imgs/logo_affair3.png) no-repeat; }


#footer{ border-top-color: #9d917c; width: 100%; height: 90px; background: #5d4f3b  url(/imgs/bg_footer.gif) top left repeat-x; color: #b4aa8a; text-align: center; border-top: 1px solid; font-style: italic; padding-top: 16px;


position: relative;
	margin-top: -170px; /* negative value of footer height */
	height: 170px;
	clear:both;
	
	}
#footer p{ width: 900px; margin: 1px auto; font-size: 10px; text-align: left; color: #8b7e6a;}
#footernav{ padding-left: 50px;}
#footernav a:link{color:#8b7e6a !important;}
 
#container{ width: 960px; text-align: left; margin: 0 auto;  background: #f1ecd8;
/*padding-bottom: 50px; min-height: 590px; */ margin-top: 79px;
position: relative;
padding-top: 20px;
padding-bottom: 90px;
}
#body_home #container{width: 860px;}

#thecontent{ color: #5A5545; background: transparent; line-height: 2em; /*float: left;*/ }\
#body_about #thecontent{float: left; }



/* =======  home ======   */
#home_workdisplay{ width: 520px; height: 390px; background:url(/imgs/bg_home.jpg) top left no-repeat; float: left; padding: 21px 0 0 25px; margin-left: 40px;}
#theslideshow{top: 21px; left: 25px; position: relative; width: 464px; height: 325px; background:  url(/imgs/ajax-loader.gif) center center no-repeat ;}
#home_morework{ width: 520px; height: 40px; overflow: hidden;  position: relative; left: -25px; top:5px;}
#home_morework a{background:url(/imgs/bg_home_more.jpg) 0px 0px no-repeat;width: 520px; height: 40px; display: block}
#home_morework a:hover{background-position:0 -40px;}
#home_morework a span{margin-left: -2000px;}
#home_swingtag{ width: 100px; height: 138px; overflow: hidden;  position: relative; left: -15px; top:-35px; z-index: 200;}


#thequote_container{ padding: 45px 0em 0;  width: 250px; float: left; background:  url(/imgs/ornament1.gif) top center no-repeat ;}
#quotemark_start{color:  #c9b8a8; display: block; float: left; margin-top: -8px; margin-left: -12px; line-height: 10px; height: 30px; width: 27px;background: url(/imgs/quotemarks.gif) top left no-repeat;}
#quotemark_end{display: none; color:  #c9b8a8;  display: block; position: relative; top:-20px; left: 0px; height: 26px; width: 30px; background: url(/imgs/quotemarks.gif) 0px -160px no-repeat;  z-index: 0;}
#quotemarks_end{ margin: 0 0 0 13px; position: relative; top: 10px;}

#thequote{ color:  #5A5545; font-size: 24px; padding:0 0 45px 20px; width: 230px; font-style: italic; letter-spacing: -1px;  line-height: 30px; display: block; z-index: 100; position: relative; top:0px; left: 0px;background:  url(/imgs/ornament2.gif) bottom center no-repeat ;}
#p_home{ font-size: 18px;}
#hometext{ padding: 0 40px 30px; margin-bottom: 6em;}
#quote_source{ position: relative; font-size: 8px; top:-60px; left: 173px;}



a, a:link{ color: #9f1319;}
a:hover{color: #000;}
.contentsection{ padding-top: 10px; line-height: 2.5em; font-size: 17px;}

.thetext{ line-height:1.6em; }
.contenttext p, .thetext p{/* font-size: 22px; */font-size: 17px; line-height: 1.6em;  margin: 1em 0; color:#5A5545;}
.contenttext p a:link, .thetext p a:link{ color: #9f1319}





ul#thenav{ width: 660px; height: 85px; list-style: none;  margin: 0; padding: 0;  margin-left: 270px; margin-top: -186px;}
ul#thenav li{ float: left; text-align: center; /* background: #222;*/ overflow: hidden; height: 84px; }

ul#thenav li a:link, ul#thenav li a { position:relative; display: block; height: 84px;  line-height: 84px; color: #f1ecd8; text-decoration: none; overflow: hidden; }
/*ul#thenav li a span{ width: 100%; height: 100%;  background: red url(../imgs/arrow.gif) center bottom  no-repeat; }*/
ul#thenav li a div { width: 100%; height: 100%; position: absolute; top: 0; left:0;  background:  url(../imgs/arrow.gif) center bottom  no-repeat; margin-top: 10px; }

ul#thenav li#nav_home a{ background:  url(http://www.thirdman.co.nz/imgs/nav_home.gif) center top no-repeat ; width: 80px; padding: 0; }
ul#thenav li#nav_about a{ background:  url(http://www.thirdman.co.nz/imgs/nav_about.gif) center top no-repeat ; width: 80px; padding: 0; }
ul#thenav li#nav_work a{ background:  url(http://www.thirdman.co.nz/imgs/nav_work.gif) center top no-repeat ; width: 80px; padding: 0; }
ul#thenav li#nav_distractions a{ background:  url(http://www.thirdman.co.nz/imgs/nav_distractions.gif) center top no-repeat ; width: 160px; padding: 0; }
ul#thenav li#nav_contact a{ background:  url(http://www.thirdman.co.nz/imgs/nav_contact.gif) center top no-repeat ; width: 80px; padding: 0; }

ul#thenav li a.thecurrent div{top: -12px;}
 
ul#thenav li a span, ul#thenav li a:link span, #nav_home li a span{ display: none; }

ul#thenav em{ display: none;}

#filtermenudiv{position: relative; top:-10px; right: 160px;  float: right; background: transparent;}
#filtermenu { float: right; padding-bottom: 10px;}
#filtermenu  li{ float: left;  border-left: 1px solid #c9b8a8;  text-align: center; line-height: 20px; margin-top: 5px;}
#filtermenu  li#featured_li{  border-left: 0px solid #5A5545; }
#filtermenu  li a{color: #5A5545; text-decoration: none; text-transform: uppercase; padding: 0 .7em 0;}
#filtermenu  li a:hover{color: #000;}
#filterword{ display: none;}




/*work images*/
#workimages{text-align: center; width: 900px;}
ul.thumbmenu{ background: transparent; width: 900px; }
ul.thumbmenu li{float: left; margin: 0 6px 16px 0; width: 140px;height: 156px;  text-align: center; font-size: 12px; text-transform: uppercase; color: #5A5545; font-style: italic; line-height: 1.5em;}
ul.thumbmenu li a img{ padding: 2px; border: 1px solid #c9b8a8; margin-top: 10px;  margin-bottom: 0px;}
ul.thumbmenu li.featured a img{ background: #bbb; }
ul.thumbmenu li a:hover img{padding: 2px; /*border: 1px solid #fff;*/ background: #fff; }
ul.thumbmenu li a img{ }

.thumbimage{ }
.thumbtitle{color: black; font-size: 13px; color: #5A5545; letter-spacing: -.03em;}


.workcontent_li{width:94px !important;height:104px !important;}

#thework_container{margin-top: 30px; /**/ }
#returnlinkdiv{float: right;}
#thework_img{ padding: 10px 0; text-align: center; margin-bottom: 80px;}

#thealbumdescription{ width: 67%; margin-right: 20px; color: #5A5545; padding-right: 10px; border-right: 1px solid #c9b8a8; float: left; }
#thealbuminfo{display: block;}

#img_updiv{width: 36px; height: 30px; overflow: hidden; z-index: 99;display:  hidden; }
#img_updiv a, #item_updiv a{}
.theups{float: right; position: relative; top:0; }
.theups a{ background: url(/imgs/littlearrow.png) 0px 4px no-repeat ; height: 30px; width: 36px; padding-left: 15px; color: #5A5545; text-decoration: none;}
.theups a:hover{color: #000; background-position: 0px -36px;}
.content_img{border: 1px solid #c9b8a8; padding: 2px;}
.theprevbtn{ float: left; display: none;}
.thenextbtn{ float: right; display: none;}

#thework_info{}

#thecontactitems{ padding-left: 100px; background: url(/imgs/contacticons.gif) top left no-repeat; height: 174px; padding-top: 10px; width: 270px; float: left; }
#thecontactitems p{ padding-top: 0px; padding-bottom: 18px;}

#thecontactform {margin-left: 350px; padding-left: 60px; width: 550px; background:  url(/imgs/ajax-loader.gif) center center no-repeat ; height: 350px;border-left: 1px solid  #c9b8a8;}




/*   MISC    */
hr {  border-left-color: red;  border-bottom-color: red;  border-right-color: red;  border-top-color: #5a5545;  border-width: 0px;  border-style: solid;  background: transparent; height: 1px;  border-top: 1px solid #c9b8a8; clear: both; }

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

#loading{ width: 100%; height: 200px; background:  url(/imgs/ajax-loader.gif) center center no-repeat ; }
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */




/***** form submit *******/
#contactform{ background:  url(/imgs/contactform.gif) top left no-repeat ; border: 0px solid red; padding: 2px; height: 300px; }

.clear {clear:both}

/*.element{width: 550px;	clear: left;
}

.element * {
	padding:5px; 
	margin:5px 2px; 
	font-size:14px;
}
.element label {
	float:left; 
	width:125px;
}.element input.text {
	float:left; 
	width:360px;
	font-size:11px;

}*/

#contactform label {
	float:left; 
	width:125px; display: none;
}


.element#e_name{margin-top: 23px !important;}
.element#e_email{margin-top: 13px!important; }
.element#e_comment{margin-top: 12px!important;}
.element#e_submit{margin-top: 7px;margin-left: 146px;}

#contactform input.text{	width:332px; height: 24px;
	font-size:11px; line-height: 20px;
	padding-top: 8px; padding-left: 8px;
	margin-left: 146px;
	  border: 0px solid white;
	         background: transparent  ; /*url(/imgs/contactform_light.gif) -146px -23px no-repeat*/

}


#contactform .textarea{	width:332px; height: 150px;
	font-size:11px;
	padding-top: 8px; padding-left: 8px;
	margin-left: 146px;
	background: transparent; border: 0px solid white;
}

.element .highlight {
	border:2px solid #9f1319;
	background:url(iconCaution.gif) no-repeat 2px
}
/*.element #submit {
	float:left;
	margin-left: 146px;
	background:  url(/imgs/contactform.gif) 146px 288px no-repeat ;
}
.element.submit {
	padding-left: 130px;
}

#contactform .thesubmit{	margin-left: 146px;
	background: red url(/imgs/logo.png) 0px 0px no-repeat;
	 width: 80px; height: 31px;
	font-size:11px;
	padding: 2px;
 border: 1px solid white;
}*/
#contactform .thesubmit{	cursor:pointer; border: 0px solid white;
font-weight:bold; padding: 3px 17px 10px !important;
font-size: 12px; color: #5A5545;
background:url(/imgs/formbtn.gif) repeat-x 0px 0px; width: 80px; height: 31px;
text-align: center;
}

#contactform .thesubmit:hover
{
background-position: 0px -70px;
color: black;
} 

.loading {
	float:right; 
	background:url(ajax-loader.gif) no-repeat 1px; 
	height:28px; 
	width:28px; 
	display:none;
}
.done {
	margin:20px auto; 
	display:none
}
textarea { font-family: sans-serif; }


    .focusField{
        color:#000;
    }
    .idleField{
        color: #f1ecd8;
       }