/* 
	zelcreative.com
	Created August 16, 2009
*/

/*

* {
	margin:0;
	padding:0;
	}
	
*/

html, body {
	height:100%; /* gives layout 100% height */
	overflow:inherit; /* triggers 100% height in Opera 9.5 */
	}

* html #container { 
	height:100%; /* IE6 treats height as min-height */
	}

p {
	padding:0; /* bottom padding clears the #footer (footer fix) */
	line-height: 23px;
	font-size:16px;
	text-shadow:2px 1px 1px #000000;
	
	}

html {
	/*width:100%;*/
	height:100%;

	}

body {
	background: url(../images/bg.gif) repeat;
	font-family: helvetica, georgia, sans-serif;
    text-align: center;
	color: #DFDFDF;
	height: 100%;
	background-color: #0F0F0F; /* if bg.gif is slow to load, won't see white bg */
	}

ul, li, img, body, html {
    margin: 0;
    padding: 0;
	}

a {
	text-decoration: none;
	color: #CF8C0C;
	outline:0;
	}

a:hover {
	text-decoration: underline;
	}

a img {
	border: none;
	}

h1 {
	font-size: 1em;
	color:#CFCFCF;
	text-align: left;
	font-weight: bold;
	text-shadow:2px 1px 1px #000000;
	}

span.ocwd {
	display:none;
}
	
h3 {
	font-size: 1.6em;
	color:#009F16;
	margin: 0 0 30px 0;
	text-align: left;
	font-weight: bold;
	}

.floatleft {
	float: left;
	margin: 0 25px 0 0;
	}

.floatright {
	float: right;
	margin: 0 12px 0 25px;
	}

#container{
	min-height:100%;
	width:100%; /* also necessary for footer fix */
	margin:0 auto; /* centers #container */
	}
	
/* --- */
#container ul, #container ul li a {
	list-style-type: none;
	text-decoration: none;
	color: #EFEFEF;
	font-size: 1.1em;
	padding: 8px 15px 0 0;
	position: relative;
	}

#nav ul, #nav ul li a {
	list-style-type: none;
	text-decoration: none;
	color: #EFEFEF;
	font-size: 20px;
	padding: 8px 15px 10px 10px;
	margin-top: -17px;
	position: relative;
	outline:0;
	}
/* --- */

/* HEADER */	

#header {
	background-color: #000000;
	/*background:url(../images/top-bg.jpg) repeat-x;*/
	margin: 0 auto 0 auto;
	height: 164px;
	}
#header a img {
	margin-right:10px;
}
#nav {
	background: url(../images/nav.png) repeat-x;
	height: 72px;
	}

html>body #nav{
	position: relative; /* header overlapping nav in ie8 without this */
	} 
	
* html #nav {
	margin-top: -4px; /* align nav bar for ie6 */
	}

#nav ul li {
	margin: 0;
	padding: 0;
	cursor: default;
	list-style-type: none;
	display: inline;
	}

div#nav ul li.selected a,
div#nav ul li.selected a:visited,
div#nav ul li a:hover {
	background: url(../images/hover.gif) repeat-x;
	padding-top: 7px;
	}

/* fix nav hover/selected position for chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
div#nav ul li.selected a,
div#nav ul li.selected a:visited,
div#nav ul li a:hover {
	padding-top: 6px;
	}
}

/* MAIN */

#main{
	width: 800px;
	line-height: 1.5em;
	text-align: left;
	background-color: #191919;
	border: 1px solid #323131;
	padding: 25px 25px 25px 25px;
	margin: 15px auto 50px auto;
	overflow:hidden;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	}

#main ul li{
	list-style-type: square;
	color: #DFDFDF;
	font-size: .9em;
	margin-left: 50px;
	line-height: 1.3em;
	text-shadow:2px 1px 1px #000000;
	}

#main p.indent {
	margin-left: 20px;
	}

#main p.privacy {
	font-size: 1em;
	line-height: 1.2em;
	text-align: justify;
	}
	
#main img.center {
    display: block;
	margin: 15px auto 15px auto;
	}
	

/* home page images/sprites */

#homebox {
	margin:30px auto -15px;
	width:800px;
	overflow:hidden;
	}

#homeimages ul {
	display:inline;
	overflow:hidden;
}
	
	
div#main div#homebox ul#homeimages li {
	float:left;
	font-family:"Lucida Sans Unicode","Lucida Grande",Arial,Helvetica,sans-serif;
	color:#999999;
	font-size:0.8em;
	margin: 0 0 0 83px;
	list-style-type:none;
	width:150px;
}
	
#homeimages li a {
	width:148px;
	height:150px;
	background: url(../images/homesprite.png);
	border: 1px solid #323131;
	float: left;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	outline: 0; /*removes ugly white outline when clicking */
}

div#main div#homebox ul#homeimages li  p {
	text-align:center;
	text-transform:capitalize;
	font-size:13px;
	line-height:30px;	
}

/* sprites */

#homeimages li a.paint {
	background-position:-450px -150px;
    background-color: #1F1F1F;
}

#homeimages li a.blog {
	background-position:-150px -150px;
    background-color: #1F1F1F;
}

#homeimages li a.quote {
	background-position: 150px -150px;
    background-color: #1F1F1F;
}

#homeimages li a.paint:hover {
	background-position:-450px -300px;
    background-color: #0F0F0F;
}

#homeimages li a.blog:hover {
	background-position:-150px -300px;
    background-color: #0F0F0F;
}

#homeimages li a.quote:hover {
	background-position: 150px -300px;
    background-color: #0F0F0F;
}

#centersf {
margin: 0 auto;
width: 642px;
}

/* footer */

#footer {
	font-family:"Lucida Sans Unicode","Lucida Grande",Arial,Helvetica,sans-serif;
	border-top: 1px solid #323131;
	color:#999999;
	font-size:11px;
	text-align:center;
	background-color: #191919;
	padding-top: 7px;
	overflow: visible;
	width:100%; /* part of align to bottom fix */
	margin:-22px auto 0; /* part of align to bottom fix */
	height:22px;
	margin:-22px auto 0; /* part of align to bottom fix */
	}
	
#footer a {
	text-decoration: none;
	color:#999999;
	}

#footer a:hover {
	text-decoration: none;
	}	
	
/*
* html #footer {
padding-bottom: -5px;
} 
*/


span.quote {
	font-size: 0.9em;
	border-top: 1px dotted #9F9F9F;
	padding-top: 5px;
	}

/* home page testimonial rotator 
	commented lines are if you want
	the rotator inside the main div */
	
#testimonials{
	background-color:#0F0F0F;
	/*border: 1px solid #C93;*/
	border: 2px dashed #323131;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	/*width:700px;*/
	width: 850px;
	height:100px;
	padding:5px 0 15px 0;
	position:relative;
	overflow: hidden;
	/*margin: 60px auto 0 auto;*/
	margin: -25px auto 50px auto;
	}

#quotes{
	font:16px Georgia, "Times New Roman", Times, serif;
	line-height: 1.4em;
	padding: 25px 25px 25px 25px;
	margin: 5px auto 50px auto;
	color:#CFCFCF;
	/*width:650px;*/
	width:800px;
	height:90px;
	padding:5px 0 10px 0;
	position:relative;
	text-align: left;
	}

#author{
	color:#C93;
	position:absolute;
	bottom:7px;
	right:10px;
	font-size: 0.8em;
	}

	/* */

/* PORTFOLIO */

#main #portblock {
width:850px;
margin-top:30px;
margin-bottom:60px;
overflow:hidden;
}

#main #portlist {
width:385px;
float:left;
}

#main div.portimages {
font-family:"Lucida Sans Unicode","Lucida Grande",Arial,Helvetica,sans-serif;
color:#999999;
font-size:0.8em;
text-align:center;
float:right;
margin-top:40px;
width:455px;
/*overflow:hidden;
height:850px;*/
}

#main div.portimages ul li {
list-style-type: none;
/*margin: -385px 0 0 375px;*/
}
	
#main ul.portlist {
font-size:18px;
margin-bottom:30px;
margin-top:-10px;
}

#main ul.push{
margin-bottom:60px;

}

#main ul.portlist li a {
color:#DFDFDF;
}
	
#main ul.portlist li a:hover {
text-decoration: none;
color:#CF8C0C;
}


/*.portfoliotext {
width: 400px;
float: left;
margin-top: -5px;
height: 500px;
}*/

ul.portlist li.bhd {
display:none;
}

/* form styling */

input, textarea {
	background-color: #0F0F0F;
	border: 1px solid #3F3F3F;
	color: #9F9F9F;
	width: 290px;
	overflow: auto; /* removes scroll bars in ie */
	font-family: helvetica, georgia, sans-serif;
	font-size: 16px;
	padding: 3px;
	}

form {
	text-align: left;
	}

#contact .submit {
	font-size: 12px;
	background-color: #3F3F3F;
	border: 1px solid #8F8F8F;
	color: #FFFFFF;
	height: 25px;
	margin-top: 10px;
	text-transform: uppercase;
	width: 299px;
	}

#form {
	width: 299px;
	margin: 40px 0 10px 40px;
	border: 1px solid #5F5F5F;
	padding: 10px;
	/*background-color: #3F3F3F;*/
	}
	
img.phone {
	margin: -50px 10px 0px 43px;
	float:left;
	}	

img.mail {
	float: right;
	margin: 30px 85px 0 0;
	}

#formheader {
	width: 300px;
	background-color: #3F3F3F;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 5px;
	font-size:11px;
	}
	
span.formheader {
	color: #CFCFCF;
	}

p.spacer {
	color: #191919;
	}
	
/* captcha relates styling */

#form img.captcha {
	border: 1px solid #5F5F5F;
	margin-top: 5px;
	}
	
span.explain {
	display:block;
	font-size:10px;
	color:#999999;
	text-align:center;
	margin-top: -5px;
	}

.formerror {
	border:1px solid red;
}
	
.capdraw {
	border: 1px solid #DFDFDF;
	color: #9F9F9F;
	font-size:14px;
	}
	
/* chat button */

#chat {
	float:right;
	margin: -10px -10px 0 35px;
	padding-bottom: 35px;
	}

/* media temple + firefox styline */

#mtfire table {
	text-align: center;
	width: 170px;
	height: 60px;
	margin:auto;
	}

#mtfire {
	margin: 0 auto 25px auto;
	overflow: hidden;
	font-family:"Lucida Sans Unicode","Lucida Grande",Arial,Helvetica,sans-serif;
	font-size: .7em;
	color: #999999;
	}

#mtfire a.mt {
    width: 59px;
    height:27px;
    background-repeat: no-repeat;
    background-image: url(../images/mt-bw.png);
    display: block;
    margin: auto;
    overflow: hidden;
	}

#mtfire a.mt:hover {
    width: 59px;
    height:27px;
    background-repeat: no-repeat;
    background-image: url(../images/mt.png);
    display: block;
    margin: auto;
    overflow: hidden;
    }
	
#mtfire a.fire {
    width: 30px;
    height:29px;
    background-repeat: no-repeat;
    background-image: url(../images/fire-bw.png);
    display: block;
    margin: auto;
    overflow: hidden;
    }

#mtfire a.fire:hover {
    width: 30px;
    height:29px;
    background-repeat: no-repeat;
    background-image: url(../images/fire.png);
    display: block;
    margin: auto;
    overflow: hidden;
    }

#affiliates {
	width:700px;
	margin: 0 auto;
}

#affiliates div {
	float:left;
	margin: 0 50px 0 15px;
}

#affiliates125 {
	width:700px;
	margin-left:245px
}

#affiliates125 div {
	float:left;
	width:125px;
	margin: 30px 50px 0 0;
	display:inline;	
}

#main div.hosts {
	float:left;
	width:125px;
	margin-right:15px;
}


#testimonialspage p{
	font-size: 14px;
	line-height: 1.3em;
	padding-right: 30px;
	/*color: #BFBFBF;*/
	color:#efefef;
	text-align:left;
	}


#testimonialspage a {
	color: #BF7D00;
	}

	
.clear {
clear:both;
}

#portlist h2 {
font-size:18px;
color:#CF8C0C;
border-bottom:1px solid #CF8C0C;
padding-bottom:5px;
}

.videos {
	width:640px;
	height:385px;
	margin:0 auto;
	border:5px solid #3F3F3F;
}

div#client-quotes {
width:700px;
margin:0 auto;
background-color:#0F0F0F;
padding:10px 30px;
font-family:georgia,serif;
border:1px solid #3F3F3F;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}

div#client-quotes p {
font-size:17px;
font-style:italic;
}

p.center {
text-align:center;
margin:30px 0 15px 0;
}

p.small {
font-size:12px;
color:#AFAFAF;
line-height:16px;
margin-left:15px;
}

div.thesis {
width:800px;
}

.books {
	width:790px;
	padding-top:10px;
}

.books img {
	float:left;
	margin-right:15px;
}

.books img.diw {
	margin-top:25px;
	width:190px;
	height:198px;
	display:block;
}

.books img.bbb {
	width:155px;
	height:218px;
	margin-right:10px;
	padding-top:30px;
	display:block;
}

.books p.author {
	margin-top:-20px;
	color:#cfcfcf;
}

h3.border {
	border-top:1px solid #8F8F8F;
	padding-top:20px;
}