/* styles.css - reset the default browser styling
 *
 * (c) 2008 Innergy Group
 * Author: Tom@Lwis (www.lwis.net)
 */


@import "reset.css";

body { padding-bottom: 25px; background: #3f90d1 url(../images/pattern1.png) repeat fixed; color: #fff; font: 15px/normal Helvetica, "Helvetica Neue", Arial, sans-serif; text-align: center; }

a,a:link,a:visited { color: #fbed06; }
a:hover { color: #3f90d1; }

p { margin-bottom: 1em; }

ul { list-style: disc; margin-bottom: 1em; padding-left: 2em; }
ol { list-style: decimal; margin-bottom: 1em; padding-left: 2em; }
ul.reset, ul.reset ul, ul.reset ol, ol.reset, ol.reset ol, ol.reset ul { list-style: none; }

.reset { margin: 0; padding: 0; }
.label { color: #3f90d1; }


/* Headings */

h1,h2,h3,h4,h5,h6 { margin-bottom: .5em; color: #3f90d1; line-height: normal; }

h1 { font-size: 40px; }
h2 { font-size: 25px; }
h3 { font-size: 140%; }
h4 { font-size: 120%; }
h5 { font-size: 110%; }
h6 { font-size: 100%; }


/* Form modeling */

input.text, textarea, select { padding: 3px; border: none; border-width: 0; background-color: transparent; color: #5a5a5a; font-family: Helvetica, "Helvetica Neue", Arial, sans-serif; font-size: 1em; }
input.text:focus, textarea:focus, select:focus { outline: 0; }
input.button { border-style: solid; border-width: 2px; border-color: #f9f8f3 #828177 #828177 #f9f8f3; background-color: #e3e3e3; color: #555; font-size: 11px; font-weight: bold; }
input.button:active { border-color: #828177 #f9f8f3 #f9f8f3 #828177; }
textarea { overflow: auto; height: 100px; resize: none; }
input.checkbox { width: 15px; height: 15px; }
label { color: #3f90d1; }

form div.field { clear: both; overflow: hidden; width: 188px; height: 18px; margin-bottom: .5em; padding: 9px 10px 6px; background: transparent url(../images/bg-field1.png) 0 0 no-repeat; }
form div.field input { padding: 0; font-weight: bold; }

form div.field-textarea { clear: both; overflow: hidden; width: 403px; height: 88px; margin-bottom: .5em; padding: 9px 10px; background: transparent url(../images/bg-field2.png) 0 0 no-repeat; }
form div.field-textarea textarea { width: 403px; height: 88px; padding: 0; font-weight: bold; }


/* Column group model */

div.colgroup { clear: both; }
div.colgroup div.colset { clear: both; width: 100%; }
div.colgroup div.col { display: inline; float: left; width: 49.9%; }
div.colgroup div.port { float: left; }
div.colgroup div.star { float: right; }


/* Contact form model */

form.contact-form { width: 423px; }
form.contact-form label { float: left; padding: 0 7px 5px; font-weight: bold; }
form.contact-form input.text, form.contact-form textarea { line-height: 15px; }
form.contact-form div.field { clear: left; }
form.contact-form div.field input.text { width: 188px; }

form.contact-form-compact { width: 343px; }
form.contact-form-compact div.colB { overflow: hidden; width: 128px; }
form.contact-form-compact div.colB div.field { width: 128px; background-image: url(../images/bg-field4.png); }
form.contact-form-compact div.colB div.field input { width: 108px; }
form.contact-form-compact div.field-textarea { width: 325px; background-image: url(../images/bg-field3.png); }
form.contact-form-compact div.field-textarea textarea { width: 325px; }


/* Box models */

.box { margin-bottom: 1em; }
.boxA {  }


/* List models */

.listA { text-align: center; }
.listA li { display: inline; margin: 0 10px; }
.listA li img { margin: 10px 0; vertical-align: middle; }


/* Custom headings */

#logo { float: left; margin: 0; text-transform: uppercase; }
#tagline { margin-bottom: 1em; font-size: 40px; }


/* Single layers */

#container { width: 916px; margin: 0 auto; background: #1c0e06 url(../images/bg1.jpg) 50% 0 no-repeat;  color: #fff; text-align: left; }
body.internal #container { background-image: url(../images/bg2.jpg); }
#header { background: url(../images/trans1.png) -100px -100px no-repeat; }
#navbar { height: 50px; padding: 11px 20px 12px; background: url(../images/bg3.jpg) 0 0 no-repeat; color: #fff; }
#content { padding: 30px 20px 0; }
div.inner { padding: 17px 26px; }


/* The Overlay */

#overlay { display: none; position: fixed; top: 0; left: 0; z-index: 100; width: 100%; min-width: 916px; min-height: 530px; height: 100%; background: url(../images/trans1.png) repeat; }
#overlay .window { position: fixed; top: 50%; left: 50%; z-index: 101; overflow: visible; width: 822px; height: 505px; margin: -253px 0 0 -411px; background: url(../images/borders4.png) 0 0 no-repeat; text-align: left; }
#overlay .window .inner { position: relative; z-index: 106; width: 784px; height: 467px; padding: 19px; background: url(../images/bg-tray.jpg) 12px 12px no-repeat; }
#overlay .window .close { position: absolute; top: -16px; right: -16px; z-index: 111; width: 42px; height: 42px; background: url(../images/btn_close.png) no-repeat; cursor: pointer; }


/* Custom windows */

#overlay #contact .inner { width: 742px; height: 441px; padding: 32px 40px; background-image: url(../images/bg-tray2.jpg); }
#overlay #contact .barA { overflow: hidden; width: 363px; height: 430px; padding-top: 12px; border-right: solid 1px #d8ccc8; }
#overlay #contact .barB { overflow: hidden; float: right; width: 343px; height: 430px; margin-left: -1px; padding: 12px 0 0 35px; border-left: solid 1px #d8ccc8; }
#overlay #contact address, #contact .social-links { font-size: 24px; font-family: Georgia, Helvetica, "Helvetica Neue", Arial, sans-serif; }

#overlay #design .preview { position: relative; z-index: 49; margin-bottom: 5px; width: 774px; height: 380px; padding: 5px; background: url(../images/loader.gif) 50% 50% no-repeat; }
#overlay #design .preview img { float: left; }
#overlay #design .preview .overlay { position: absolute; top: 0; left: 0; z-index: 50; width: 784px; height: 390px; background: url(../images/borders1.png) no-repeat; }


/* Main carousel */

#carousel { overflow: hidden; width: 620px; height: 65px; margin: 0 auto; background: url(../images/bg2.png) 0 0 no-repeat; }
#carousel { position: relative; }
#carousel .clip { overflow: hidden; width: 460px; height: 55px; padding: 5px 80px; }
#carousel ul.thumbs li { position: relative; display: inline; float: left; margin: 0 8px 0 7px; cursor: pointer; }
#carousel ul.thumbs li .overlay { position: absolute; top: 0; left: 0; width: 77px; height: 55px; background: url(../images/borders2.png) 0 0 no-repeat; }

#carousel a.next { position: absolute; top: 12px; right: 8px; width: 42px; height: 42px; cursor: pointer; background: transparent url(../images/arrows1-next-horizontal.png) no-repeat 0 0; text-indent: -9999px; }
#carousel a.next:hover { background-position: -42px 0; }
#carousel a.next:active { right: 7px; top: 13px; }

#carousel a.next-disabled,
#carousel a.next-disabled:hover,
#carousel a.next-disabled:active { cursor: default; background-position: -84px 0; }

#carousel a.prev { position: absolute; top: 12px; left: 8px; width: 42px; height: 42px; cursor: pointer; background: transparent url(../images/arrows1-prev-horizontal.png) no-repeat 0 0; text-indent: -9999px; }
#carousel a.prev:hover { background-position: -42px 0; }
#carousel a.prev:active { left: 7px; top: 13px; }

#carousel a.prev-disabled,
#carousel a.prev-disabled:hover,
#carousel a.prev-disabled:active { cursor: default; background-position: -84px 0; }


/* Custom column groups */

#colgroup1 .colA { float: left; width: 375px; }
#colgroup1 .colB { float: right; width: 425px; }
#colgroup1 .colB .colgroupA .col { width: 208px !important; }

#colgroup2 .colA { float: left; width: 460px; }
#colgroup2 .colB { float: right; width: 343px; overflow: hidden; }
#colgroup2 .colB .colgroupA .colA { width: 208px; }
#colgroup2 .colB .colgroupA .colB { width: 128px; }


/* Global navigation */

#nav { float: right; margin-top: 21px; }
#nav li { float: left; padding-left: 30px; background: url(../images/divider1.png) 8px 50% no-repeat; }
#nav li.first { padding-left: 0; background: none; }

#nav li a { float: left; height: 0; padding-top: 14px; overflow: hidden; background-image: url(../images/nav.png); background-repeat: no-repeat; }
#nav a, #nav a:visited { color: #fff; }
#nav a:hover, #nav a.on { color: #3f90d1; }

#navi1 a { width: 50px; background-position: 0 0; }
#navi2 a { width: 59px; background-position: -50px 0; }
#navi3 a { width: 76px; background-position: -109px 0; }
#navi4 a { width: 71px; background-position: -185px 0; }
#navi5 a { width: 80px; background-position: -256px 0; }

#navi1 a:hover, #navi1 a.on { background-position: 0 -14px; }
#navi2 a:hover, #navi2 a.on { background-position: -50px -14px; }
#navi3 a:hover, #navi3 a.on { background-position: -109px -14px; }
#navi4 a:hover, #navi4 a.on { background-position: -185px -14px; }
#navi5 a:hover, #navi5 a.on { background-position: -256px -14px; }


/* Featured designs */

#featured-designs { text-align: left; }
#featured-designs li { float: left; margin: 0 0 1em; }
#featured-designs li.odd { margin: 0 23px; }
#featured-designs h2 { padding: 0 10px; color: #fff; font-size: 1em; font-weight: normal; }


/* Main video section */

#video { margin-bottom: 2em; }
#video .box { width: 316px; height: 279px; border: solid 1px #fff; }


/* Social links section */

#social-links { clear: both; width: 343px; }


/* Designs list */

#designs { font-size: 13px; line-height: 1.5em; }
#designs li { clear: both; }
#designs li h2 { font-weight: normal; }
#designs li div.preview { position: relative; float: left; width: 428px; height: 252px; padding: 5px; margin-bottom: 30px; }
#designs li div.preview div.overlay { position: absolute; top: 0; left: 0; width: 438px; height: 262px; background: url(../images/borders3.png) 0 0 no-repeat; }
#designs li div.desc { float: right; width: 370px; margin-bottom: 30px; padding-top: 1em; }
#designs li div.desc a.view { margin-right: 10px; }


/* Story section */

#story { font-size: 13px; line-height: 1.5em; }
#story p, #story blockquote, #story ul, #story ol { margin-bottom: 1.5em; }
#story h1, #story h2, #story h3, #story h4, #story h5, #story h6 { color: #3f90d1; line-height: normal; }
#story h1, #story h2, #story h3 { font-weight: normal; }


/* Footer */

#footer { position: relative; height: 20px; bottom: -10px; background: url(../images/box1-bottom.png) 50% 100% no-repeat; }
#footer { clear: both; padding: 1em 40px; font-family: "Trebuchet MS", Helvetica, "Helvetica Neue", Arial, sans-serif; text-align: right; text-transform: lowercase; }
#footer a, #footer a:visited { color: #fff; text-decoration: none; }
#footer a:hover { color: #3f90d1; }


/* Image preloads */

#preload1 { height: 0; background: url(../images/bg-tray.jpg) -9999px -9999px no-repeat; }
#preload2 { height: 0; background: url(../images/bg-tray2.jpg) -9999px -9999px no-repeat; }



/* DO NOT EDIT OR ADD CODE BELOW */

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/* hide from ie/mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* end hide */