@charset "UTF-8";
@import url("fonts.css");
@import url(http://fonts.googleapis.com/css?family=Podkova:400,700);


/*--------------------------------------------------
    OVERALL
---------------------------------------------------*/
body { font: 14px 'Podkova', serif; margin: 0; padding: 0; color: #e6e7e8; background: #9c9c9e;  }
ul, ol, dl { padding: 0; margin: 0; }
a img { border: none; }
a:link { color: #6d6e71; text-decoration: none; }
a:visited { color: #6d6e71; text-decoration: none; }
a:hover, a:active, a:focus { text-decoration: none; }
h1 { font-size: 16px; text-transform: uppercase; font-weight: normal; color: #000;}
h2 {  font-size: 15px;  }
.right { float: right; margin-left: 8px; }
.left { float: left; margin-right: 8px; }
.half { width: 46%; float: left; margin-left: 25px; }
.half ~ .half { margin-left: 40px; width: 42%; }
.clr { clear:both;  }

/***** PRELOADER *****/
#preloader { position:absolute; top:48px; left:7px; width: 1000px; height: 610px; background-color:#fff; z-index:2; }
#status { width:200px; height:200px; position:absolute; left:50%; top:45%; background-image:url(../images/status.gif); background-repeat:no-repeat; background-position:center; margin:-100px 0 0 -100px; }


/*--------------------------------------------------
    GENERAL LAYOUT
---------------------------------------------------*/
#container { position: relative; width: 1014px; height: 669px; margin: 0 auto;  z-index: 1; background: url(../images/bg-container.png) no-repeat;  }
#stretch { position: absolute; width: 100%; height: 100%; top: 0; z-index: 0; }

/***** HEADER *****/
header { position: relative; height: 54px; width: 999px; margin: 0 auto; background: url(../images/bg-header.png) repeat-x; z-index: 10; }
#logo { width: 1000px; height: 91px; position: absolute; top: 17px; background: url(../images/logo.png) no-repeat center; margin: 0 auto;   }
#logo a { display: block; width: 115px; height: 73px; margin: 0 auto; }
#home { display: block; width: 18px; height: 0; padding-top: 18px; overflow: hidden; background: url(../images/icon-home.png) no-repeat; position: absolute; top: 15px; left: 20px; }
#store { display: block; width: 25px; height: 0; padding-top: 18px; overflow: hidden; background: url(../images/icon-store.jpg) no-repeat; position: absolute; top: 15px; left: 20px; }
#facebook { display: block; width: 25px; height: 0; padding-top: 18px; overflow: hidden; background: url(../images/icon-facebook.jpg) no-repeat; position: absolute; top: 15px; left: 55px; }
#twitter { display: block; width: 25px; height: 0; padding-top: 18px; overflow: hidden; background: url(../images/icon-twitter.jpg) no-repeat; position: absolute; top: 15px; left: 88px; }

/***** TOP NAV *****/
#top-nav { position: absolute; right: 0; top: 15px; list-style: none; }
#top-nav li { display: inline-block; color: #6d6e71; text-transform: uppercase; text-decoration: none; margin: 0 30px 0 0;  font-size: 14px;}

/***** CONTENT *****/
#content { margin: -6px 0 0 7px; width: 999px; height: 520px; overflow: hidden; background: url(../images/bg-content.jpg) no-repeat; line-height: 24px; }
#content #inner { padding: 60px 80px 0; }

/***** FOOTER *****/
footer { font-size: 9px; z-index: 10; color: #6d6e71; padding: 0 20px; }
footer #left { float: left; }
footer #right { float: right; margin-right: 8px;  }
footer h1 { font-size: 25px; margin: 10px 0 27px; }
footer #copywrite { position: absolute; bottom: 22px; }
footer ul { float: left; list-style: none; color: #939598; font-size: 11px; text-transform: uppercase; line-height: 16px; margin-top: 14px; text-align: right;   }
footer ul ~ ul { margin-left: 40px; }


/*--------------------------------------------------
    INDIVIDUAL PAGE STYLES
---------------------------------------------------*/

/***** HOMEPAGE SLIDESHOW *****/
.slideshow { height: 1000px; margin-top: -25px; }
.rhino-container { }

/***** ABOUT US *****/
img#about { clear: both; margin: 10px 0 0 -40px; }

/***** PROJECTS *****/
#projects { width: 921px; overflow: hidden; margin: 15px 0 0 -42px;  }
#projects.categories { width: 940px; }
#projects #slider { padding: 0; width: 10000px; position: relative;}
#projects ul { list-style: none; width: 940px; float: left; }
#projects li { position: relative; float: left; height: 190px; width: 216px; margin: 0 11px 8px 0; border: 3px solid transparent; overflow: hidden; }
#projects li:hover { border: 3px solid #fff; overflow: hidden;  }
#projects li a { color: #fff; }
#projects li span { display: block; position: absolute; background: #000; padding-left: 10px; text-transform: uppercase; font-size: 13px; width: 100%; letter-spacing: 1px; }
#projects li span.top { top: 0; }
#projects li span.top + img { margin-top: 24px; }
#projects li span.bottom { bottom: 0; }
a.project-controls { display: block; width: 27px; height: 25px; background: url('../js/fancybox/fancybox.png') no-repeat; overflow: hidden; text-decoration: none; position: absolute; cursor: pointer; top: 310px; }
#prev { background-position: -40px -30px; left: 15px;  }
#next { background-position: -40px -60px; right: 20px; }


/***** CONTACT *****/
#contact-info { float: left; width: 320px; font-size: 13px; color: #e6e7e8; margin-left: 15px; }
#contact-info a { color: #e6e7e8; }
#contact-info h1 { margin: 0 0 10px 0; border-bottom: 2px solid #939598; padding-bottom: 5px; color: #e6e7e8; }
#contact-info h2 { margin: 10px 0 10px 0; border-bottom: 2px solid #939598; padding-bottom: 5px; }
#contact-info p { font-size: 16px; line-height: 20px; margin-top: 5px; }
#contact-info span.spacer { display: inline-block; width: 60px; }
#contact-info ul li { list-style: none; margin-bottom: 8px;}
#contact-info ul li#line { border-bottom: 2px solid #939598; height: 0px; }
#contact-info label { display: inline-block; width: 80px; }
#contact-info input { background: #fff; border: none; padding: 3px; width: 225px; }
#contact-info textarea { background: #fff; border: none; padding: 5px; width: 305px; height: 40px; }
#contact-info label#textarea-label { display: block; width: 200px; margin: 15px 0 5px;  }
#contact-info input#submit { width: 96px; height:20px; background: url(../images/btn-send.png) no-repeat; float: right; cursor: pointer; }
#map-canvas, iframe { float: right; width: 350px; height: 300px; border: 2px solid #939598; margin-top: 24px;  }
#contact-info span.error { color: #f8be00; position: absolute; left: 425px; }

/***** BACKGROUND TESTER *****/
#background-tester { position: absolute; top: 0; left: 0; z-index: 100; padding: 0 10px; height: 25px; background: #ff00e4; padding-top: 5px; font-size: 18px; }
#background-tester a { color: #fff; cursor: pointer; }