/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* ----© Copyright Chris Godby 2010 <<<-----------------------*/
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* ----Globals <<<-----------------------*/
/* ------------------------------------------------*/
html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; color:#FFF; font-family:Arial,Helvetica,sans-serif}
html, body{height:100%}
body{
	background-image:url(../images/body-bg.png);
	background-repeat:repeat-x;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
div#wrapper{
	min-height:100%;
	height:auto !important;
	height:100%;
	margin-right:auto;
	margin-bottom:-91px;
	margin-left:auto;
	background-image: url(../images/header-bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	width: 100%;
}
div#container{margin-right:auto; margin-left:auto; width:997px}
h1{font-size:30px; letter-spacing:-1px; margin-bottom:10px}
p{line-height:20px; margin-bottom:10px; font-size:14px}
a{color:#2e87d0; text-decoration:underline}
a:hover{color:#589FDA}

/* ------------------------------------------------*/
/* ----Buttons <<<-----------------------*/
/* ------------------------------------------------*/
#get-started-btn{background-image:url(../images/btn-get-started.png); height:52px; width:160px; display:block; float:right; text-indent:-9999px; margin-top:23px}
#get-started-btn:hover{background-position:left bottom}
#get-started-btn-subpage{background-image:url(../images/btn-get-started.png); height:52px; width:160px; display:block; float:right; text-indent:-9999px; margin-top:9px}
#get-started-btn-subpage:hover{background-position:left bottom}

/* ------------------------------------------------*/
/* ----Homepage Style <<<-----------------------*/
/* ------------------------------------------------*/
#web-design-ingredients{
	background-image:url(../images/web-design-ingredients.png);
	height:48px;
	width:997px;
	background-position:center;
	margin-bottom:50px;
	text-indent:-9999px;
	margin-top: 120px;
}
#header-bar{background-color:#1d1d1e; border-bottom-width:4px; border-bottom-style:solid; border-bottom-color:#378dae; padding-top:15px; padding-right:15px; padding-bottom:15px; padding-left:15px}
#header-bar-subpage{background-color:#1d1d1e; border-bottom-width:4px; border-bottom-style:solid; border-bottom-color:#378dae; height:68px; padding-right:10px; padding-left:15px}
#content{margin-top:30px}
#content h2{color:#192a30; font-size:24px; margin-bottom:10px}
#content p{font-size:14px; color:#333; margin-bottom:10px}
#content #left-content {
	width: 680px;
	float: left;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #eceef4;
}
#content #content-right {
	float: right;
	width: 300px;
}
#proposal-btn {
	background-image: url(../images/project-proposal-btn.png);
	text-indent: -9999px;
	display: block;
	height: 35px;
	width: 159px;
	margin-bottom: 20px;
}
#content-right strong {
	color: #333333;
	display: block;
	width: 90px;
	float: left;
}
#proposal-btn:hover {
	background-position: left bottom;
}



#cu3er-container {
	width:880px;
	outline:0;
	height: 340px;
	margin-top: 30px;
	margin-left: 58px;
}
#worked-with {
	background-image: url(../images/cu3er-BG.png);
	background-repeat: no-repeat;
	height: 100px;
	width: 996px;
	position: absolute;
	top: 589px;
}


/* ------------------------------------------------*/
/* ----General Classes <<<-----------------------*/
/* ------------------------------------------------*/
.header-left{float:left; width:750px}
.header-left-subpage{float:left; width:750px; margin-top:15px}
.header-left-subpage h1{margin-bottom:0px}

#featured-work{background-image:url(../images/featured-work.png); background-repeat:no-repeat; height:357px; width:997px; margin-top:55px}
.services{width:294px; float:left; margin-right:15px; margin-left:15px}
.pushright{margin-left:27px}

.services h2{color:#192a30; font-size:28px; letter-spacing:-1px}
.services p{font-size:12px; color:#333}

/* ------------------------------------------------*/
/* ----Navigation <<<-----------------------*/
/* ------------------------------------------------*/
#logo{background-image:url(../images/web-design-logo.png); height:83px; width:107px; display:block; float:left}
#nav-bar{height:111px}
#nav{list-style-type:none; float:right; height:21px; width:401px; margin-top:48px}
#nav li{float:left}
#nav   li a{display:block; background-image:url(../images/navigation.png); height:21px; text-indent:-9999px}

#nav #home a{background-position:0px 0px; width:62px}
#nav #about a{background-position:-62px 0px; width:76px}
#nav #faq a{background-position:-138px 0px; width:54px}
#nav #blog a{background-position:-192px 0px; width:65px}
#nav #work a{background-position:-257px 0px; width:71px}
#nav #contact a{background-position:-328px 0px; width:73px}

#nav #home a:hover{background-position:0px 21px; width:62px}
#nav #about a:hover{background-position:-62px 21px; width:76px}
#nav #faq a:hover{background-position:-138px 21px; width:54px}
#nav #blog a:hover{background-position:-192px 21px; width:65px}
#nav #work a:hover{background-position:-257px 21px; width:71px}
#nav #contact a:hover{background-position:-328px 21px; width:73px}

#nav #home.active a{background-position:0px 21px; width:62px}
#nav #about.active a{background-position:-62px 21px; width:76px}
#nav #faq.active a{background-position:-138px 21px; width:54px}
#nav #blog.active a{background-position:-192px 21px; width:65px}
#nav #work.active a{background-position:-257px 21px; width:71px}
#nav #contact.active a{background-position:-328px 21px; width:73px}
.clear{clear:both}

/* ------------------------------------------------*/
/* ----Portfolio Style <<<-----------------------*/
/* ------------------------------------------------*/
#print, #logo, #web{clear:both; margin-bottom:20px}
.port-wrap .description h3{margin-bottom:20px; padding-bottom:10px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#E2E2E2}
.port-wrap img{background-color:#FFF; padding:5px; border:1px solid #E2E2E2; float:left; width:600px}
.port-wrap .description{float:right; width:360px; padding-left:10px}
.port-wrap{clear:both; padding-top:40px}
.port-item{float:left; height:300px; border-bottom-width:1px; border-bottom-style:dashed; border-bottom-color:#E5E5E5; width:325px; margin-right:10px; margin-bottom:20px}
.port-item-end{float:left; height:300px; border-bottom-width:1px; border-bottom-style:dashed; border-bottom-color:#E5E5E5; width:325px; margin-right:0px; margin-bottom:20px}
.port-item-end strong{text-transform:uppercase; color:#1D1D1E}
#content   .port-item h3, #content .port-item-end h3{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	color:#0D98D1;
	text-transform:none;
	font-size:18px;
	margin-top:5px;
	font-weight: normal;
	margin-bottom: 5px;
}
#content    .port-item p,  #content .port-item-end p{line-height:18px; margin:0px; padding:0px}
.port-item strong{text-transform:uppercase; color:#1D1D1E}

.port-img{
	width:317px;
	height:200px;
	padding:4px;
	border:1px solid #CCC;
	background-color: #FFF;
}
.port-img-end{width:317px; height:200px; padding:4px; margin-right:0px; border:1px solid #CCC}
.port-img:hover{background-color:#EAEAEA}

/* ------------------------------------------------*/
/* ----Form Style <<<-----------------------*/
/* ------------------------------------------------*/
#contact input{background-image:url(../images/form-field-bg.png); background-repeat:repeat-x; border:1px solid #c7c7c8; height:30px; width:360px; margin-top:5px; margin-bottom:20px; line-height:normal; float:left}
#contact .send-btn{background-image:url(../images/send-btn.png); height:52px; width:160px; border-top-style:none; border-right-style:none; border-bottom-style:none; border-left-style:none; margin:0px; padding:0px}
#contact .hidden-field{margin:0px; padding:0px; height:0px; width:0px}

#contact .short-field{width:160px}
#contact textarea{width:600px; background-image:url(../images/form-field-bg.png); background-repeat:repeat-x; border:1px solid #c7c7c8; padding:10px; font-family:Arial,Helvetica,sans-serif; font-size:14px; float:left}

#contact .field-left{width:160px; float:left}
#contact .field-right{
	float:right;
	width:160px;
	margin-right: 320px;
}
#contact span{color:#333; font-size:12px}
#contact .field-left input, #contact .field-right input{width:160px; float:none}
/* ------------------------------------------------*/
/* ----Footer <<<-----------------------*/
/* ------------------------------------------------*/
#push{padding-top:30px; clear:both}

#footer{width:100%; background-image:url(../images/footer-bg.png); background-repeat:repeat-x}
#footer,#push {
	height:91px
}
#footer #inner-footer{
	width:997px;
	margin: 0 auto;
	height:91px;
	background-image: url(../images/footer-bg.png);
	background-repeat: repeat-x;
}
#footer   #inner-footer p{
	font-size:11px;
	width: 400px;
	float: left;
	margin: 0px;
	padding-top: 40px;
}
#inner-footer #foot-logo{
	background-image:url(../images/footer-logo.png);
	background-repeat:no-repeat;
	height:91px;
	width:98px;
	float: right;
}
blockquote p{font-family:Georgia,"Times New Roman",Times,serif; font-style:italic; background-image:url(../images/blockquote.png); background-repeat:no-repeat; background-position:0px 5px; padding-left:45px; width:400px; text-align:justify; float:left; margin-right:20px; margin-left:20px; margin-top:20px; height:150px}