body {background: #17262F  url(http://wideskydesigns.com/images/template/bg-trans.png) repeat-x; margin: 0; padding: 0; font-family: "Arial Narrow", Arial, Helvetica, sans-serif}
body#home {background:  url(http://wideskydesigns.com/images/template/bg-trans.png) repeat-x 0 80px; background-color: #17262F}

@font-face {font-family: "Eurostile LT"; src: url('/template_files/fonts/EurosLTExtTwo.otf');}
@font-face {font-family: Eurostile; src: url('/template_files/fonts/Eurostile.otf');}

.wrapper {width: 760px; margin: 0 auto; position: relative;}
#home #wrapper {margin-top: 80px;}

a {outline: none;}
#header ul,
#maincontent h1,
#footer p,
#maincontent h2,
li h3,
#maincontent form legend,
.button {font-family: "Eurostile LT", Eurostile, "Arial Narrow", Arial;}

#maincontent h2 {color: #222; font-size: 18px; text-transform: uppercase; margin: 40px 0 10px; clear: both; line-height: 20px; width: 100%}

#header {width: 760px; margin: 0 auto; height: 50px; position: relative;}
#header p.logo a {position: absolute; background: transparent url(http://wideskydesigns.com/images/template/logo-trans.png) no-repeat; width: 245px; height: 60px; top: 0px; outline: none;}
#home #header p.logo a {background-position-x: -64px}
#header p.logo a strong {position: absolute; left: -9999px;}
#header ul {float: right; margin-top: 35px; font-size: 14px;}
#header ul li {display: block; float: left; clear:none; margin-right: 5px;}
#header ul li a {color: #ccc; text-decoration: none; padding: 5px 5px 24px 5px; outline: none;}		
#header ul li a:hover,
#header ul li a.active {color: #fff; background: transparent url(http://wideskydesigns.com/images/template/nav-arrow.png) no-repeat 50% bottom; }
#header ul li.contact a {color: #f6f1af; margin-right: 0;}
#header ul li.contact a:hover { background: transparent url(http://wideskydesigns.com/images/template/nav-arrow-hover.png) no-repeat 50% bottom;}


#clouds {position: absolute; width: 100%; background: url(http://wideskydesigns.com/images/template/bg-cloud-horizontal.png) repeat-x 0 0; height: 321px; top: 84px;}
#home #clouds {top: 163px;}

#maincontent {min-height: 400px;}
#home #maincontent {background: url(http://wideskydesigns.com/images/template/bg-sprite.png) no-repeat; width: 780px; height: 400px; margin: 15px auto 0; position: relative;}
#home #maincontent h1 {color: #fff; font-size: 20px; width: 460px; position: absolute; top: 190px; left: 380px; z-index: 100}
#home #maincontent img.feature {position: absolute; z-index: 0; bottom: 56px; left: 20px; display: none;}
#home #maincontent p.button {position: absolute; top: 310px; left: 380px; z-index: 100}
#home #maincontent p.tagline {z-index: 100}
#maincontent p.feature strong {position: absolute; left: -9999px; }		

#page #maincontent {background: #fff url(http://wideskydesigns.com/images/template/bg-cloud-fade.jpg) no-repeat 0 -250px; width: 740px; padding: 20px; margin: 15px auto 0; overflow: auto; position: relative; -moz-border-radius: 10px; -webkit-border-radius: 10px;}

#page #maincontent h1 {color: #17262F; font-size: 26px; margin: 60px 0 0 380px; width: 355px;}
#page #maincontent p.intro {margin-left: 380px; width: 355px;}
#page #maincontent p {margin: 0 0 20px; line-height: 1.8em; font-size: 16px;}
#maincontent p.tagline {position: absolute; top: 240px; width: 380px; left: 380px; font-size: 16px; line-height: 26px; margin-bottom: 120px;}

#maincontent p.feature {position: absolute; background: url(http://wideskydesigns.com/images/template/bg-sprite.png) no-repeat 0 -385px; width: 780px; height: 77px; bottom: -5px; z-index: 200;}
#maincontent a {color: #17262F;}
#maincontent p.button a,
#maincontent input.button  {display: block; width: 260px; font-size: 11px; position: relative; text-align: center; padding-top: 10px; height: 20px; color: #fff; text-decoration: none; background: url(http://wideskydesigns.com/images/template/bg-button.png) repeat-x 50% 0; z-index: 300; -moz-border-radius: 15px; -webkit-border-radius: 15px;}
#maincontent input.button {height: 30px; cursor: pointer; border: none;}
#maincontent input.button:hover,
#maincontent p.button a:hover {background-position: 50% -30px;}

#maincontent .main {width: 350px; float: left; clear: none; margin-right: 30px;}
#maincontent .sub {width: 350px; float: left; clear: right; margin-top: 140px;}

#maincontent ul.sites {list-display: none; margin:  0 0 60px 0; padding: 0;}
#maincontent ul.sites li {float: left; clear: none; margin-bottom: 10px; background: none; padding-top: 20px; list-style: none; width: 300px}
#maincontent ul.sites li h2 {color: #222; font-size: 18px; text-transform: uppercase; margin: 10px 0 10px; clear: both; }
#maincontent ul.sites li p {width: 300px; float: left; margin-right: 20px; line-height: 24px;}
#maincontent ul.sites li a.site {width: 280px; margin-bottom: 10px}
#maincontent ul.sites li a img,
#maincontent .fullsite img,
#maincontent img.preview {float: right; border: 1px #ededed solid; -moz-border-radius: 10px; -webkit-border-radius: 10px;}
#maincontent img.preview {padding: 2px; float: none}
#maincontent a.site {border: 1px #ccc solid; padding: 5px; display: block; background: #fff; float: left; clear: both; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px;}
#maincontent ul.sites li a.site:hover {background: #ededed; border-color: #ccc;}		
#maincontent ul.sites li p.button	{clear: left; float: left; position: relative;}
#maincontent ul.sites li p.button a {padding: 4px 0; height: 22px;}
#maincontent ul li {background: url(http://wideskydesigns.com/images/template/icon-birds.png) no-repeat left 18px; padding: 5px 0 5px 25px; margin: 10px 0; line-height: 1.8em; font-size: 16px; display: block}

#maincontent hr {background: url(http://wideskydesigns.com/images/template/bg-birds.png) no-repeat 100% 5px; height: 85px; border: none; }

#maincontent ul.services {}
#maincontent ul.services li {float: left; clear: none; background: none; width: 300px; height: 300px;}
#maincontent ul.services li h2 {width: 100%;}
#maincontent ul.services li p {text-align: justify}
#maincontent img.feature {float: left; clear: none; margin: 0 5px 0 0;}
#maincontent a.previous {float: left; clear: none; width: 130px; display: block; text-align: left; margin: 10px;}
#maincontent a.next {float: right; clear: none; width: 130px; display: block; text-align: right; margin: 10px;}

#maincontent form {position: relative; float: left; clear: none;}
#maincontent form legend,
#maincontent #contactinfo h2 {margin: 0 0 20px; display: block; font-size: 16px; text-transform: capitalize; font-weight: normal}
#maincontent form select.text,
#maincontent form textarea.text,
#maincontent form input.text {width: 300px; border: 1px #17262F solid; padding: 5px;}
#maincontent form textarea.text {height: 120px}
#maincontent form select {display: block; width: 320px}
#maincontent p#thankyou {font-size: 20px;}
#maincontent #contactinfo {width: 360px; float: right; clear: none}

#footer {width: 740px; margin: 20px auto 0; color: #ddd;}	
#footer p {margin: 0 0 5px;}
#footer .org {position: absolute; left: -9999px;}
#footer .tel {font-weight: bold;}
#footer .vcard { width: 330px; float: left; clear: none; font-size: 14px;}
#footer .notice {width: 370px; float: right; clear: none; font-size: 14px; margin-right: 10px;}
#footer a { color: #f6f1af; text-decoration: underline;}