/*
SmartCube
Author: Lee Munroe December 2008
*/


/* 
################### CSS contents ###################
* 1 Reset defaults
* 2 Layout
* 3 Nav
* 4 Headings
* 5 Lists
* 6 Images
* 7 Links
* 8 Forms
* 9 Tables
* 10 Typography 
* 11 Other
*/


/* 
# Colour reference ###################

#daffff Light blue
#718a94 Medium blue
#1d2321 Dark blue

#f66ea8 Light pink
#af1958 Dark pink

#E1DED3 Cream


*/
 
/*
# Reset defaults ################### 
*/

*{
margin:0;
padding:0;
}

a{
text-decoration:none;
outline: none;
}

.clear{
clear:both;
}

html {
overflow: -moz-scrollbars-vertical;
}

#skipto{
display:none;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}











/*
# Layout ################### 
*/

body{
font:75%/1.5  Helvetica, Arial,Verdana, sans-serif;
color:#2a2a2c;
background:url(../images/bg.gif);
background-attachment: fixed;
}

.container{
width:980px;
padding:0 10px;
margin:0 auto;
}

#header{
background:url(../images/header.png) repeat-x top;
height:100px;
position:fixed;
top:0;
left:0;
width:100%;
z-index:10;
}

#banner{
height:233px;
padding-top:90px;
background:url(../images/banner.png) bottom center #1d2321 no-repeat;
border-bottom:1px solid #0d090c;
}

#latest{
background:#718a94;
border-top:1px solid #a6c5ca;
border-bottom:1px solid #0d090c;
padding:5px 0;
text-align:center;
}

#main{
margin-top:40px;
text-align: justify;
}

.aboutcontent{
width:470px;
float:left;
margin-right:40px;
}

.contactcontent{
width:215px;
float:left;
margin-right:40px;
}

.formcontent{
width:215px;
float:left;
margin-top:170px;
}

.projectcontent{
width:215px;
float:left;
margin-right:40px;
}

.projectimage{
width:725px;
float:left;
}

.projectimage div{
position:relative;
background:url(../images/shadow.png) no-repeat top left;
padding:5px;
}

#footer{
background:url(../images/footer.png) repeat-x top;
padding:20px 0;
}

.footercontact{
width:215px;
float:left;
margin-right:40px;
}

.footermap{
width:215px;
float:left;
margin-right:40px;
}

.footergmap{
width:470px;
float:left;
}









/*
# Nav ################### 
*/

#header ul{
float:right;
list-style:none;
margin-top:20px;
}

#header ul li{
display:inline;
}

#header ul li a{
float:left;
display:block;
background:url(../images/nav.gif) top left no-repeat;
height:31px;
padding-left:20px;
margin-left:5px;
}

#header ul li a span{
float:left;
display:block;
background:url(../images/nav.gif) top right no-repeat;
height:25px;
padding-top:6px;
padding-right:20px;
color:#fff;
font-size:1.2em;
}

#header ul li a:hover{
background-position:0% -31px;
cursor: pointer;
}

#header ul li a:hover span{
background-position:100% -31px;
}











/*
# Headings ################### 
*/

#logo{
width:289px;
height:74px;
background:url(../images/logo.gif) no-repeat;
float:left;
}

#logo a{
display:block;
height:100%;
width:100%;
}

#logo span{
position:absolute;
top:-9999px;
left:-9999px;
}


h1{
padding-top:60px;
text-align: center;
font-size: 3em;
color:#ff006d;
}

h1 a{
color:#f66ea8;
}

h2{
width:550px;
font-family:Georgia, Times, Serif;
color:#fff;
font-weight: normal;
text-align: center;
margin:0 auto;
font-size:1.8em;
}

h3{
width:400px;
height:70px;
}

h3 span{
position:absolute;
top:-9999px;
left:-9999px;
}

h3.about{
background:url(../images/about.gif) no-repeat top left;
}

#about, #contact, #projects{
padding-top:100px;
margin-bottom:20px;
}

h3.contact{
background:url(../images/contact.gif) no-repeat top left;
width:200px;
}

h3.projects{
background:url(../images/projects.gif) no-repeat top left;
}

h4{
margin:20px 5px 20px;
}

h4 a{
padding:20px;
font-size:1.6em;
background:#1d2321;
color:#fff;
border:none!important;
}

h4 a:hover{
background:#af1958;
}












/*
# Lists ################### 
*/

.features{
list-style: none;
margin:20px 0;
}

.features li{
margin-bottom:10px;
padding-left:20px;
background: url(../images/bullet.gif) no-repeat top left;
}











/*
# Images ################### 
*/

img{
border:none;
}

.projectimage img{
border:#1d2321 10px solid;
}











/*
# Links ################### 
*/

a{
color:#af1958;
font-weight: bold;
}

#main a{
border-bottom:1px solid #af1958;
}

a:hover{

}

a.img{
border:none!important;
}

#latest a{
background:url(../images/latest.gif) no-repeat top left;
padding-left:90px;
display:inline-block;
color:#fff;
font-weight:normal;
}

#latest a span{
background:url(../images/latest.gif) no-repeat top right;
padding-top:25px;
padding-right:20px;
height:53px;
display:block;
font-family: Georgia, Times, Serif;
font-size:1.6em;
cursor: pointer;
}

#latest a:hover{
background-position:0% -78px;
}

#latest a:hover span{
background-position:100% -78px;
color:#fff;
}

#latest a:hover{
color:#1d2321;
}

.projectimage div a{
position:absolute;
top:15px;
left:15px;
display:block;
width:695px;
height:270px;
background:url(../images/overlay.png) no-repeat top;
}

.projectimage a:hover{
background-position:0% -270px;
}

#footer a{
color:#fff;
font-weight: normal;
}











/*
# Forms ################### 
*/

label{
display:block;
font-weight: bold;
}

.text{
background:#718a94;
padding:3px;
border:1px solid #718a94;
color:#fff;
}

.submit{
padding:5px;
}












/*
# Tables ################### 
*/













/*
# Typography ################### 
*/

p{
margin:10px 0;
}

.content{
text-align: justify;
}

.projectimage p{
margin:0 5px;
text-align:right;
}











/*
# Other ################### 
*/

.right{
	float: right;
}

.left{
	float: left;
}

.alignleft{
	text-align: left;
}

.alignright{
	text-align: right;
}

.aligncenter{
	text-align: center;
}

.last{
margin:0!important;
}

#twitter{
margin-top:40px;
}

#twitter_div{
width:238px;
height:154px;
background:url(../images/twitter.gif) no-repeat;
padding:15px;
float:right;
}

#twitter_div li{
list-style:none;
color:#E1DED3;
}

#twitter_div a{
color:#f66ea8;
}

#twitter-link{

}

.error {
color:#9F1E00;
font-weight:bold;
}