/* -------------------------------------------------------------- 
 www.AlastairTaylor.com CSS by Alastair Taylor
 http://www.alastairtaylor.com

   * Copyright (c) 2009-Present. 

   master.css
   * Sets styles for on screen pages.
   
-------------------------------------------------------------- */

/*for the logo
 @font-face for ie please :) font-family:museo, "helvetica neue", helvetica, sans-serif; 
font-weight:900;
text-indent:-7px; */

/*----------T Y P O G R A P H Y----------------*/
body {
	font-size: 62.5%; 
	font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif;}

h1 {
	font: bold 4.2em/1.5em "Helvetica neue", Helvetica, Arial, sans-serif;
	letter-spacing:-0.06em;}

h2 {
	font:bold 3em/1.1em "Helvetica neue", Helvetica, Arial, sans-serif;
	letter-spacing:-0.07em;
	text-align:left;}

h3 {
	font:normal 1.4em/1em "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
	font-variant:small-caps;}
	
p, label, input, textarea, a, li{ font: normal 1.4em/2em Georgia, Times, "Times New Roman", serif;}

a {
	font-size:1em; 
	text-decoration:none;}
	
p.opener {font-size:2em;}

a.button {
	text-decoration:none;
	font-size:1.4em;}

a.livesite {
	text-decoration:none;
	font:normal small-caps 1.4em/1em "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;}

.italic {font-style:italic;}

div#footer p {font: 1.2em "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;}

form input, form textarea{font: normal 1.4em "Helvetica Neue", Helvetica, Arial, sans-serif;}

form input#submit {font: normal 1.4em/2em Georgia, Times, "Times New Roman", serif; text-align:left;}

/*------------L A Y O U T-----------*/

div#wrap {
	width:980px;
	/*margin-left:30px;*/
	margin:0 auto; 
	padding:0px;}

div#container {margin-left:70px; padding-top:50px}

body#index div#container {padding-top:100px;}

div#title {
	width:552px;
	float:left;}

div#insert {
	float:left;
	width:240px;
	margin-left:50px;
	padding:20px 0;
	margin-bottom:40px;}

div#top_p {
	float:left;
	width:240px;
	margin:0px 0 20px 30px;}

div#top_p p{margin-bottom:20px;}

#contactfrm {float:left;
	width:400px;}

div#footer {
	margin:50px 0 0 0;
	padding:50px 0;
	display:block;}

.case {
	clear:both;
	padding:20px 0 0px 0;}

.col1{width:290px; padding-bottom:15px;}



h2 {
	margin:10px 0px; 
	display:block;}
	
h3 {margin-bottom:10px;}

p {margin:0px 0 20px 0px;}

a {
	padding: 2px 2px;
	outline: none;}

.clear {clear:both;}

#container ul {margin-top:20px;}

div#insert p {margin-top:0;}

p.opener {
	display:block;
	width:250px; 
	float:left; 
	padding:20px 20px 40px 20px; 
	margin:0 20px 10px 0;}
	
a.button {
	margin:15px 0;
	padding:10px 15px 5px 15px;}

a.livesite {
	margin:15px 0;
	padding:5px;}

div#footer p {
	letter-spacing:0.05em;
	margin-left: 70px;
	padding:0px 0px;}
			
a#logo {
	padding:0;
	margin:0;
	text-indent:-10000px;
	display:block;
	width:50px;
	height:70px;
	font-size:63px;
	line-height:125%;
	float:left;
}		
p.topmargin{margin-top:20px;}
	
img.folioimg{ 
	float:right; 
	clear:both; 
	margin:10px 0 30px 0; 
	display:block; 
	padding:0px;}
	
/*------------for the nav------------*/

ul#nav {margin-left:20px; display:block; float:left; width:500px;}

ul#nav li {list-style-type:none; display:inline;}		
		
ul#nav a{text-decoration:none;}

ul#nav li#about a{ background: url(../images/nav/about_a.png) no-repeat bottom left; width:80px; height:16px;}

ul#nav li#folio a{ background: url(../images/nav/portfolio_a.png) no-repeat bottom left; width:126px; height:16px;}

ul#nav li#services a{ background: url(../images/nav/services_a.png) no-repeat bottom left; width:107px; height:16px;}

ul#nav li#contact a{ background: url(../images/nav/enquiries_a.png) no-repeat bottom left; width:122px; height:16px;}

ul#nav li#about a:hover, ul#nav li#folio a:hover, ul#nav li#services a:hover, ul#nav li#contact a:hover{background-position: bottom right;}

ul#nav li#services {display:none;}

ul#nav li a{
	text-indent:-1000em;
	display:block;
	float:left;
	margin:0px;
	padding:25px 0 5px 0;}


/*---forms---*/

form {margin:10px 0 20px 0;
}

form label{
	float:left;
	margin:5px 0 0 0;
	width:70px;
	display:block;
}

form input, form textarea{
	
	display:block;
	float:left;
	margin:0px 0px 10px 10px;
	border:none; 
	padding:10px;
	width:300px;
}

form input#submit {
	line-height:1em;
	width:150px;
	margin-left:80px;
	padding:10px 15px 5px 15px;
	}
		
/*------------C O L O U R  a n d  B O R D E R S-----------*/

body {background:#fff url(../images/background.jpg) fixed repeat;}

h1 {color:#999;}

h1.highlight {color:#ac2024;}

h1 span {color:#ac2024;}

h2 {color:#333;}
	
h3 {color:#333;}

p, label, input, textarea, a, li{color:#666;}

a {color:#333;background:#fff; border-bottom:1px solid #ccc;}

a:hover {background:#ddd; border-bottom:1px solid #333;}

p.opener {background:#333; border-bottom:5px solid #ac2024; color:#fff; }

abbr {border-bottom:1px dashed #ccc;}

a.button {
	color:#fff;
	background-color:#333;
	border-bottom:5px solid #ac2024;}

a.button:hover {
	background-color:#ac2024;
	border-bottom:5px solid #621215;}

a.livesite {
	color:#333;
	background-color:#eee;
	border-bottom:5px solid #999;}

a.livesite:hover {
	background-color:#ccc;
	border-bottom:5px solid #666;}
	
a.livesite:active {border-bottom:5px solid #ac2024;}

body div#footer {color:#ccc; }

a#logo {
	background:#ac2024 url(../images/a_logo.png) no-repeat bottom center;
	color:#fff;
	border-bottom:7px solid #666;}

a#logo:hover {
	border-bottom:7px solid #333;
	background-color:#999;
}

ul#nav a{color:#000; }

ul#nav li a {border-bottom:0px solid #fff ;}

ul#nav li#about a:hover, ul#nav li#folio a:hover, ul#nav li#services a:hover, ul#nav li#contact a:hover{
	background-color:#eee;
	border-bottom:2px solid #ccc ;}

.case {
	border:2px solid #ddd; 
	border-width:2px 0 0 0;}

img.folioimg{ border:1px solid #eee;}

form input, form textarea{background:#ccc;}

form input#submit {
	color:#333;
	background-color:#ccc;
	border-bottom:5px solid #ac2024;}

form input#submit:hover {
	color:#fff;
	background-color:#ac2024;
	border-bottom:5px solid #ac2024;}	

form input, form textarea{border:none;}