@charset "utf-8";
/****** CODING BY CHRIS GOODWIN.info ****/
/***Clean? Who ever said I was clean?****/
/************ MAIN / SETUP **************/
/***********Come and Learn!**************/
html {
background: #ded7c5 url(../images/light_texture.jpg) center top;
min-width: 980px;
padding: 0;
margin: 0;
}
body { 
padding: 0;
margin: 0;
background: url(../images/background.gif)  no-repeat center top;
width: 100%;
height: 100%;
display: table;
color: #e3ddc7;
font-family: Tahoma, Geneva, Arial, sans-serif;
min-width: 980px;
}
#backgroundwrapper{
background: url(../images/bottom.gif) repeat-x bottom center;
}
/************ HEADER ********************/
/***********Come and Learn!**************/
#navbackground {
background: url(../images/header.jpg) no-repeat center top;
margin: 0;
width: 100%;
display: table;
}
#headerwrapper{
float:left;
position:relative;
left:50%;
width: 975px;
margin: 0 auto 0 -487px;
padding: 0;
height:120px;
display: table;
}
#header{
padding: 0;
margin: 0;
}
/****NAVIGATION*****/
ul.nav, ul.logo{
margin: 0;
padding: 0;
list-style: none;
display: inline;
font-size:18px;
}
.nav li{
float:right;
margin: 29px 11px 0 0;
padding: 0 11px 0 0;
border-right: 2px solid #4d8e8d;
}
.logo li{
float: left;
margin: 10px 0 0 12px;
padding: 0 0 0 0;
}
.logo li a{
font-weight:normal;
color: #4d8e8d;
text-decoration:none;
font-size:37px;
}
.logo li a:hover .logoborder{
position: relative;
border-top: 10px solid #a3c32b;
padding-top: 2px;
color: #df3c20;
}
.multi{
font-size: 14px;
text-align:right;
margin: -5px 0 -2px 0;
color: #df3c20;
display:block;
}
a:hover .multi{
color: #4d8e8d;
display:block;
}
.nav li a{
font-weight:bold;
letter-spacing: -.06em;
color: #e3ddc7;
}
/*******NAV COLORS**********/
.nav li.client{
border:none;
margin-right: -1px;
}
.nav li.client a{
text-decoration:none;
}
.nav li.client a:hover{
position: relative;
border-top: 12px solid #a3c32b;
padding: 21px 0 0 0;
color: #4d8e8d;
}
/*******NAV COLORS**********/
.nav li.work{
border-right-color: #a3c32b;
}
.nav li.work a{
text-decoration:none;
}
.nav li.work a:hover{
position: relative;
border-top: 12px solid #fac20d;
padding: 21px 0 0 0;
color: #a3c32b;
}
/*******NAV COLORS**********/
.nav li.about{
border-right-color: #fac20d;
}
.nav li.about a{
text-decoration:none;
}
.nav li.about a:hover{
position: relative;
border-top: 12px solid #df3c20;
padding: 21px 0 0 0;
color: #fac20d;
}
/*******NAV COLORS**********/
.nav li.blog{
border-right-color: #df3c20;
}
.nav li.blog a{
text-decoration:none;
}
.nav li.blog a:hover{
position: relative;
border-top: 12px solid #d348a1;
padding: 21px 0 0 0;
color: #df3c20;
}
/*******NAV COLORS**********/
.nav li.contact{
border-right-color: #d348a1;
}
.nav li.contact a{
text-decoration:none;
}
.nav li.contact a:hover{
position: relative;
border-top: 12px solid #4d8e8d;
padding: 21px 0 0 0;
color: #d348a1;
}
/******** TITLE (top middle area) *******/
/***********Come and Learn!**************/
#titlewrapper{
float:left;
position:relative;
left:50%;
width: 975px;
margin: 0 0 0 -487px;
clear:both;
height: 228px;
display: table;
}
#title{
padding: 10px 0 0 10px;
}
.maintitle{
font-size:4em;
color: #DF3C20;
}
.smalltitle{
padding:0;
margin:0;
margin-top: -20px;
color: #4E8F8E;
}
/************ CONTENT (body) ************/
/***********Come and Learn!**************/
#contenttopimage {
width: 100%;
margin: 0 auto 0 0;
clear:both;
background: url(../images/contentTop.jpg) center top no-repeat;
height: 197px;
} 
#contentarea{
padding:0px 20px 0;
}
#contentbackground {
width: 100%;
height: 100%;
display: table;
background: url(../images/contentTile.jpg) repeat-y center top;
}
#centercontent{
float:left;
position:relative;
left:50%;
width: 975px;
margin: -95px 0 0 -488px;
padding: 0px 0 0;
}
h1{
margin: 0;
padding: 0 0 0 0;
}
/************ FOOTER  *******************/
/***********Come and Learn!**************/
#footer{
width: 940px;
display: table;
padding:110px 0 30px 15px;
margin: 0px 0 0 0;
font-size: 12px;
clear:both;
}
#footer a:hover{
color: #e3ddc7 !important;
background-color: #df3c20;
}
#footerimage{
width: 975px;
margin: 0 auto;
padding: 0;
background: url(../images/bottomInner_13.gif) center bottom no-repeat;
display: table;
}
/************ HOME PAGE  *******************/
/***********Come and Learn!**************/
.home{
width:198px;
height: 320px;
float: left;
padding: 0 15px 20px;
border-right: 6px dotted #a3c32b;
margin: 0 0 30px;
}
#contentarea a{
text-decoration:none;
color: #e3ddc7;
}
#contentarea .homeheader a{
text-decoration:none;
color: #4d8e8d;
}
#contentarea a:hover{
cursor: pointer;
color: #df3c20;
}
.homeheader{
margin: 0;
padding:0 0 20px;
color: #4d8e8d;
font-size: 26px;
letter-spacing: -.04em;
}
.bottomimage1{
height: 100%;
background: url(../images/home1.jpg) no-repeat bottom center;
}
.bottomimage2{
height: 100%;
background: url(../images/home2.jpg) no-repeat bottom center;
}
.bottomimage3{
height: 100%;
background: url(../images/home3.jpg) no-repeat bottom center;
}
.bottomimage4{
height: 100%;
background: url(../images/home4.jpg) no-repeat bottom center;
}
.home.homelast{
border: none;
}
/************ RECENT WORK  *******************/
/***********Come and Learn!**************/

.potography img{
filter:alpha(opacity=100);
opacity:1;
border: none;
}
.potography a:hover img {
filter:alpha(opacity=60);
opacity:.6;
}

.workitem {
width: 935px;
float:left;
padding: 0 0 40px 0;
margin: 0 0 40px 10px;
border-bottom: 8px dotted #a3c32b;
}
.worklast {
padding: 0;
margin: 0;
border: none;
}
.worktitle {
float:left;
width:550px;
padding:0 0 10px 5px;;
}
.worktype {
text-align:right;
float:left;
width:350px;
}
.workimage {
width: 550px;
float:left;
margin:0;
padding:0;
}
.workimage img {
border:0;
}
.workinfo {
width: 345px;
float:left;
margin:0;
padding:0 10px 0 20px;
}
.workh2 {
color: #4d8e8d;
margin:0;
padding:0;
font-size: 26px;
letter-spacing: -.04em;
}
.workh22 {
color: #4d8e8d;
margin:0;
padding:0 0 20px 0;
font-size: 40px;
letter-spacing: -.04em;
}
.workh222 {
color: #4d8e8d;
margin:0;
padding:0 0 0px 0;
font-size: 26px;
letter-spacing: -.04em;
}
.worktitle2 {
float:left;
padding:0 0 10px 5px;;
}
.workinfo2{
color: #4d8e8d;
margin:20px 0 0 0;
padding:0;
font-size: 20px;
letter-spacing: -.04em;
}
.workinfo p{
padding: 0 0 10px;
margin: 0;
}
.workinfo a {
color: #4d8e8d !important;
}
.workinfo a:hover {
background-color: #a3c32b;
}
/************ LEFT AND RIGHT SIDES  ******/
/***********Come and Learn!**************/
#leftside{
width: 470px;
float: left;
padding: 0 15px 0 10px;
}
.aboutmeleft{
width: 550px !important;
padding: 0 40px 0 10px !important;
}
.aboutmeright{
width: 320px !important;
}
#leftside h1{
color: #df3c20;
margin:0;
padding:0;
font-size: 36px;
letter-spacing: -.04em;
text-transform: uppercase;
}
#leftside h2{
color: #4d8e8d;
margin:0;
padding:0;
font-size: 24px;
letter-spacing: -.04em;
font-weight:normal;
}
#rightside{
width: 440px;
float: left;
}
#leftside .last{
color: #df3c20;
margin:0;
padding:0;
font-size: 24px;
letter-spacing: -.04em;
}
#leftside .top{
margin-top:0;
}
#leftside .last a{
color: #df3c20;
font-size: 24px;
text-decoration:underline;
}
#leftside .last a:hover{
color: #e3ddc7;
background-color: #4d8e8d;
}
#leftside p a{
text-decoration:underline;
}
#leftside p a:hover{
color: #e3ddc7;
background-color: #4d8e8d;
}
/************ FORMS  ******/
/***********Come and Learn!**************/
input, textarea, select {
margin: 5px 0 10px;
	padding:2px;
	width:285px;
	font-size: 18px;
	color: #4d8e8d;
	border:2px solid #a3c32b;
	-moz-border-radius:0.4em;
	-khtml-border-radius:0.4em;
}
input:hover, input:focus, textarea:hover, textarea:focus {
	border:2px solid #df3c20;
	
} 
#rightside .contact{
margin-left: 40px;
	font-size: 20px;
	color: #4d8e8d;
}
textarea{
font-family: Tahoma, Geneva, Arial, sans-serif;
height: 100px;
}
#rightside .submit {
width:150px;
}
#rightside .smallarea {
height:40px;
}
#rightside .checkbox {
margin: 5px 0 5px;
	padding:0px;
	width:20px;
}