/* A Feature Coating - Stylesheet */
/*
Design: Dan Gray - www.dangray.com.au
All Rights Reserved
*/


* {margin:0px; padding:0px;}
img, div, li { behavior: url(/iepngfix.htc) }
body {margin:0px; padding:0px; font-family:Arial, Helvetica, sans-serif; text-align:center; background-color:#30a8dd;}

a {text-decoration:none;color:#00aaff;}
a img {border:0px;}

h1,h2,h3 {line-height:1;}

h1 {font-weight:normal; font-size:32px; line-height:40px; }
h2 {font-weight:normal; font-size:24px; margin:0px 20px; color:#fff;line-height:24px;}
h3 {font-weight:normal; font-size:18px; margin:20px 20px 5px; color:#fff;}
h4 {font-weight:normal; font-size:14px; margin:20px 20px 5px; color:#fff;}

p {margin:0 20px 6px 20px; }
p, li {font-size:11px; line-height:14px;color:#fff; padding:2px 0;}

ul {margin:0 20px 6px;}

br.clear {clear:both;}


.ui-tabs .ui-tabs-hide { display: none; }

#header-wrap {width:100%;background:url('/images/header-back.gif') 0 150px repeat-x #fff; height:180px;}
#main-wrap {width:100%;background:url('/images/main-back.gif') bottom left repeat-x #3d4246;}
#footer-wrap {width:100%;background-color:#30a8dd;border-top:1px solid #31b9ed;}

#header, #main, #menu, #footer {width:960px; margin:0px auto;position:relative;text-align:left;}




/* ------------- HEADER --------------------*/

#header {height:180px;}

#header h1 {position:absolute; bottom:30px; left:20px; margin:0; padding:0; height:auto;}

#header #call {position:absolute; bottom:70px; right:20px; margin:0px; text-align:right; color:#30a8dd; font-size:12px; line-height:18px;}
#header #call em {font-style:normal; font-size:24px;}


#header ul {padding:0px; margin:0px;}
#header ul.menu {list-style:none; position:absolute; bottom:0px;left:0px; height:30px; z-index:1000;  }
#header ul.menu li {display:block; float:left; position:relative; font-size:11px; text-transform:uppercase; }
#header ul.menu li.active a {color:#00aaff;}

#header ul.menu li a {display:block;line-height:30px; padding:0 20px;  color:#aaa; }
#header ul.menu li a:hover {color:#fff;}
#header ul.menu li ul {display:none; z-index:2000;background-color:#969490; padding:0 0 10px 0;}
#header ul.menu li ul li {width:100%; text-align:left;}
#header ul.menu li.active ul li {font-weight:normal;}
#header ul.menu li ul li.active {font-weight:bold;}
#header ul.menu li:hover ul {display:block;position:absolute; top:30px; left:0; width: 200px; }


/* ------------- MAIN --------------------*/

#main {padding:50px 0}
#main h2 {}
#main ul {padding-left:20px;}
#main p.intro {color:#aaa;margin-top:-5px; padding-top:0px; margin-bottom:20px; margin-right:330px;}

#main .home.welcome {float:left; width:320px;}
#main .home.welcome h2 {margin-bottom:20px;}
#main .home.project {float:left; width:640px;}
#main .home.project img {margin:-1px 19px; border:1px solid #fff;background:url('/images/loader.gif') 290px 150px #222 no-repeat;}
#main .home .links {list-style:none; margin:55px 0 0px;padding:0px;}
#main .home .links li {float:left; width:120px; padding:80px 20px 10px; display:block;}
#main .home .links a {font-size:18px; color:#fff; display:block;}
#main .home .links a:hover {color:#00aaff;}
#main .home #our_coatings {background:url('/images/icon-our-coatings.gif') 10px 0px no-repeat;}
#main .home #our_facilities {background:url('/images/icon-our-facilities.gif') 10px 0px no-repeat;}



#main .coating {float:left; width:320px;margin-bottom:50px;}

#main .note {float:left; width:280px; padding-left:20px;padding-right:20px; margin:0px; color:#aaa;}
#main .research {margin:0px; float:left; width:140px;padding-left:20px; list-style:none;margin-bottom:60px;}


#main #tabs img, #main img.photo {float:right; border:1px solid #fff; margin-left:38px; margin-bottom:10px;}

#main #tabs img.project { margin:9px -1px 9px 19px; border:1px solid #fff; display:block;background:url('/images/loader.gif') 290px 150px #222 no-repeat; width:600px; height:340px;}

#main #tabs {height:360px;margin:0 20px;border-top:1px solid #555;}

#main #tabs .menu {float:left; width:280px; padding:0px 20px 0 0; margin:0px; list-style:none;}
#main #tabs .menu li {padding:8px 5px; border-bottom:1px solid #555;}
#main #tabs .menu li a {color:#aaa; text-transform:uppercase;}
#main #tabs .menu li.ui-state-active a {color:#00aaff;}
#main #tabs div {float:left; width:620px; background-color:#3d4246;}

#main #tabs em, #main .home.project em {font-style:normal; color:#777;}


#main #timeline {}
#main #timeline h3 {float:left; display:block; width:280px; margin:0px; padding:10px 20px; font-size:24px; color:#777; }
#main #timeline p {padding:10px 0 10px 320px; border-top:1px solid #555;}

#main #contact {float:left; width:320px;margin-bottom:150px;}

#main #form {float:left; width:640px;}
#main #form ul {list-style:none;padding-left:0px;}
#main #form li {position:relative;padding:5px 0;}
#main input {width:320px;border:none;}
#main textarea {width:320px; height:100px; border:none;}
#main label {float:left; width:100px; color:#aaa;}
#main label em {color:#00aaff;}
#main label.error {position:absolute; left:440px; top:5px; color:#00aaff; width:180px;}

#main input.submit {background-color:#333; color:#aaa;padding:5px 0; text-transform:uppercase; }
#main input.submit:hover {background-color:#111; color:#00aaff;}


/* ------------- FOOTER --------------------*/

#footer {padding:50px 20px 80px; width:920px;}

#footer a {color:#fff;}
#footer a:hover {color:#9de;}
#footer h2 {font-size:11px; text-transform:uppercase;line-height:20px; margin:0px;}

#footer .links {float:left; width:160px;}
#footer .links ul {margin:0px; padding:5px 0px; width:160px; border-top:1px solid #4db4e2;}
#footer .links li {list-style:none;}

#footer .contact p {border-top:1px solid #4db4e2;margin:0px; text-align:right; width:280px; float:left; padding:5px 0;}

#footer #copyright {clear:both; text-align:right; margin:0px;padding:5px 0; border-top:1px solid #4db4e2;}

