@charset "UTF-8";
body { background: url(../img/bg-home.jpg) top repeat-x; font-family: Arial, Helvetica, sans-serif; color: #6f6f6f; margin: 0px; font-size:62.5%; background-color: #000; }
body#page { background-image: url(../img/header-page.jpg); }
.wrap { width: 963px; margin: 0 auto; overflow: visible; }
#header { position: relative; height: 410px; }
body#page #header { height: 193px; }
#header .logo { position: absolute; top: 76px; left: 0px; }
#header .contact { position: absolute; top: 73px; right: 0px; }
#header .image { position: absolute; top: 191px; left: 0px; }
#header #navigation { width: 963px; position: absolute; top: 0px; }
#header #navigation ul { list-style-type: none; margin: 0; padding: 0; }
#header #navigation li { height: 53px; display: block; padding: 0; cursor: pointer; float: left; position:relative; }
#header #navigation a { display:block; width: 116px; height:53px; text-indent: -9999px; outline:none; background-image:url(../img/nav-sprite.jpg); }
#nav1 { background-position: 0px 0px; }
#nav1:hover { background-position: 0px 53px; }
#nav2 { background-position: -116px 0px; width: 130px!important; }
#nav2:hover { background-position: -116px 53px; }
#nav3 { background-position: -246px 0px; width: 141px!important; }
#nav3:hover { background-position: -246px 53px; }
#nav4 { background-position: -387px 0px; width: 254px!important; }
#nav4:hover { background-position: -387px 53px; }
#nav5 { background-position: -641px 0px; width: 157px!important; }
#nav5:hover { background-position: -641px 53px; }
#nav6 { background-position: -798px 0px; width: 165px!important; }
#nav6:hover { background-position: -798px 53px; }
#content { width: 100%; background-image: url(../img/content-bg.jpg); background-repeat: repeat-x; background-color: #FFF; }
body#page #content { background-image: none; background-color: #FFF; }
#content .left { width: 332px; float: left; padding-top: 45px; }
#content .left .enquiry { background-image: url(../img/enquiry-bg.jpg); width: 255px; height: 444px; padding: 30px 37px; font-size: 1.4em; font-family: Georgia, "Times New Roman", Times, serif; }
#content .right { width: 616px; float: right; padding-top: 19px; font-size: 1.2em; }
#content .right .web-design { background-image: url(../img/web-design.jpg); width: 275px; height: 152px; padding: 35px 320px 20px 20px; color: #FFF; font-weight: bold; }
#content .right .web-design h1 { color: #003245; font-size: 2em; }
#content .right .text { padding: 30px 30px 70px; }
#content .right .text-page { padding: 10px 30px 40px; }
#middle { width: 100%; height: 285px; background-image: url(../img/middle-bg.jpg); padding-top: 15px; font-size: 1.2em; }
#middle .column { width: 283px; float: left; position: relative; }
#middle .middle-column { width: 285px; float: left; padding: 0px 56px; position: relative; }
#middle .stage { position: absolute; top: -13px; left: 230px; }
#middle .middle-column .stage { left: 280px; }
#middle h3 { font-size: 1.6em; margin-bottom: 1.5em; }
#lower { width: 100%; background-color: #FFF; padding-top: 30px; }
#lower .wrap { width: 1000px; padding-left: 40px; }
#lower .left { width: 591px; height: 403px; float: left; }
#lower .left .service { background-image: url(../img/services.jpg); width: 497px; height: 252px; margin-top: 50px; padding: 54px 0px 0px 90px; }
#lower .left .service ul { list-style-type: none; width: 247px; float: left; margin: 0px; padding: 0px; font-size: 1.4em; line-height: 16px; }
#lower .left .service li { padding: 0px; margin: 0px 0px 21px 0px; }
#lower .right { background-image: url(../img/iphone.jpg); width: 409px; height: 403px; float: left; }
#lower .right .video { width: 323px; height: 262px; margin-top: 141px; margin-left: 56px; background-color: #0F0; }
#footer { width: 100%; background-color: #000; height: 90px; color: #FFF; font-size: 1.2em; }
#footer .left { width: 270px; float: left; background: url(../img/footer-logo.jpg) 0px 20px no-repeat; padding: 24px 0px 10px 70px; }
#footer .left p { margin: 2px 0px; padding: 0px; }
#footer .right { width: 620px; float: right; text-align: right; padding-top: 24px; }
#footer .right ul { list-style-type: none; margin: 0px; padding: 0px; }
#footer .right li { display: inline; margin-left: 15px; }
#footer .right a { font-size: 1.1em; color: #FFF; text-decoration: none; }
#footer .right a:hover { color: #008bc0; }
h1, h2, h3, h4 { font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; color: #008bc0; margin: 18px 0px 10px; padding: 0px; line-height: 28px; }
h1 { font-size: 2.2em; }
h2 { font-size: 2em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.4em; }
p { line-height: 18px; }
ul, ol { line-height: 18px; }
li { margin-bottom: 8px; }
a { color: #6f6f6f; }
a:hover { color: #008bc0; }
a img { border: none; }
h2.small-h2 { font-size: 1.6em; }
ol.big { font-size: 1.6em; color: #008bc0; font-style: italic; font-family: Georgia, "Times New Roman", Times, serif; }
ol.big span { font-size: 0.7em; font-family: Arial, Helvetica, sans-serif; color: #6f6f6f; font-style: normal; }
.box { padding: 15px 0px; border-bottom: #CCC 1px dashed; }
.box strong { font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; font-weight: bold; color: #008bc0; }
.form1, .form2, .form3, .form4 { display:block; width: 200px; height:26px; outline:none; background-image: url(../img/form-sprite.jpg); border: none; border-width: 0px; padding: 16px 0px 0px 57px; margin-bottom: 4px; }
.form1 { background-position: 0px 0px; }
.form1:focus, .form1:hover { background-position: 255px 0px; text-indent: 0px; }
.form2 { background-position: 0px -43px; }
.form2:focus, .form2:hover { background-position: 255px -43px; text-indent: 0px; }
.form3 { background-position: 0px -86px; }
.form3:focus, .form3:hover { background-position: 255px -86px; text-indent: 0px; }
.form4 { background-position: 1px -129px; height: 100px!important; width: 242px!important; padding: 10px 5px 10px 10px; background-attachment: scroll; }
.form4:focus, .form4:hover { background-position: 257px -129px; text-indent: 0px; }
.submit { background-image: url(../img/submit.jpg); width: 215px; height: 34px; border: none; }
.clear { clear: both; }