/**
CSS Doc For zavoli.co.uk

Author: James Chambers - james@jc-studios.co.uk
Last Modified : 18-07-2010
**/

/** Reset **/

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { 
	margin: 0; padding: 0; 
} 

/** 'Layout' Formatting Styles **/

body {
	margin: 0
	padding: 0px;
	font-family: Helvetica, Verdana, Arial;
	font-size: 13px;
	color: #333;
	background: #fff;
}
a img {
	border: none;
	text-decoration: none;
}
#container {
	width: 1000px;
	height: auto;
	margin: 0 auto 0 auto;
}
#header {
	width: 1000px;
	height: auto;
	margin: 40px 0 10px 0;
}
#skype {
	float: right;
	width: auto;
	margin: 0 35px 0 0;
}
#navigation {
	width: 950px;
	height: auto;
	margin: 10px 0px 10px 0px;
	padding: 5px;
	border-bottom: #333 1px dotted;
	clear: both;
}
h1 {
	font-weight: lighter;
	margin: 0;
	color: #006239;
	font-size: 42px;
}
h2 {
	font-weight: lighter;
	margin: 20px 0 -15px 0;
	color: #006239;
	font-size: 26px;
}
h3, h4 {
	font-weight: lighter;
	color: #006239;
	margin: 20px 0 -10px 0;
	font-size: 26px;
}
#installerbox h3 {
	font-weight: lighter;
	color: #006239;
	margin: 0;
	font-size: 26px;
}
#twitterbox h4 {
	font-weight: lighter;
	color: #006239;
	margin: 0;
	font-size: 26px;
}
p {
	line-height: 1.5em;
	margin: 10px 0 10px 0;
}
#maincontent ul {
	margin: 10px 0 10px 70px;
	width: 500px;
}
#maincontent li {
	margin: 7px 0 7px 0;
}
#maincontent a {
	color: #333;
	text-decoration: none;
	border-bottom: #333 1px dotted; 
}
#maincontent a:hover {
	color: #78aa25;
	text-decoration: none;
	border-bottom: #333 1px dotted; 
}
.navigation {
    position: relative;
    height: 30px; width: 1000px;
}
.navigation li {
    float: left;
    list-style: none;
}
.navigation li.back {
    background: url("/images/navbg.gif") no-repeat right -30px;
    width: 9px; height: 30px;
    z-index: 8;
    position: absolute;
        }
.navigation li.back .left {
    background: url("/images/navbg.gif") no-repeat top left;
    height: 30px;
    margin-right: 9px;
}
.navigation li a {
    position: relative;
    overflow: hidden;
    text-decoration: none;
    font-size: 12px;
    color: #333;
    outline: none;
    text-align: center;
    height: 30px;
    line-height: 30px;
    z-index: 10;
    letter-spacing: 0;
    float: left;
    display: block;
    margin: auto 10px;
}
#featurepic {
	width: 950px;
	height: 379px;
	margin: 20px auto 15px auto;
}
#maincontent {
	width: 690px;
	height: 100%;
	float: left;
	padding: 0 15px 0 0;
	border-right: #333 1px dotted;
}
#twitterbox {
	width: 250px;
	margin: 0 25px 0 0;
	padding: 15px 0 0 0;
	float: right;
	clear: right;
	border-top: #333 1px dotted;
}
#twitterbox ul li {
	width: 250px;
}
#installerbox {
	width: 250px;
	margin: 0 25px 0 0;
	padding: 0 0 15px 0;
	float: right;
}
#installers {
	position: relative;
	height: 250px;
	overflow: hidden;
}
#installers p {
	margin: 10px 0 10px 0;
	font-size: 14px;
}
#installers a {
	color: #333;
	text-decoration: none;
	border-bottom: #333 1px dotted; 
}
#installers a:hover {
	color: #78aa25;
	text-decoration: none;
	border-bottom: #333 1px dotted; 
}
#installers img {
	vertical-align: middle;
	float: right;
}
#installinfo {
	height: 100%;
	width: 580px;
	overflow: auto;
	font-size: 12px;
}
#twitter_div ul {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
#twitter_div li {
	padding: 0px;
	margin: 0px 0px 10px 0px;
}
#twitter_div a {
	color: #666; 
	text-decoration: underline;
}
#twitter_div a:hover {
	color: #78aa25;
}
#footer {
	width: 100%;
	clear: both;
	text-align: right;
	padding: 20px 0 0 0; 
}
#contactform {
	width: 471px;
	margin: 0 auto 0 auto;
}
#contactform input, #contactform textarea {
	padding: 5px;
	width: 471px;
	font-family: Helvetica, sans-serif;
	color: #636363;
	letter-spacing: 1pt;
	font-size: 1.3em;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
}
#contactform textarea:focus, #contactform input:focus {
	border: 2px solid #78aa25;
}
#contactform input.submitbutton {
	width: 100px;
}
#contactform input.submitbutton:hover {
	width: 100px;
	border: 2px solid #78aa25;
}
#contactform input.resetbutton {
	width: 100px;
	margin: 10px 0 0 10px;
}
#contactform input.resetbutton:hover {
	width: 100px;
	margin-left: 10px;
	border: 2px solid #ff0000;
}
#msg {
	display: none;
	position: absolute;
	z-index: 200;
	color: #fff;
	line-height: 40px;
}
#msgcontent {
	display: block;
	width: 169px;
	height: 40px;
	background: url(/images/validation-bg.png) left center no-repeat;
	padding-left: 18px;
}
#footer a {
	color: #333;
	border-bottom: #333 1px dotted; 
	text-decoration: none;
}
#footer a:hover {
	color: #78aa25;
	border-bottom: #78aa25 1px dotted; 
	text-decoration: none;
}
#gallery {
	margin: 0 0 10px 70px;
}
#gallery ul {
	margin: 0;
	padding: 0;
}
.galleria { list-style: none;width: 300px;}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:300px} /* MSIE bug */

.caption{font-style:italic;color:#887;}
.demo{position:relative;margin-top:2em;}
.gallery{width:auto;margin:0 auto;}
.gallery li{width:68px;height:50px;margin: 0 2px;}
.gallery li div{left:240px}
.gallery li div .caption{font:italic 0.7em/1.4 georgia,serif;}