/*---------------------------------
Filename:master.css
Decription:Master Style Sheet
Website:http://www.untappd.com
---------------------------------*/
@import url("reset.css"); 

/* Global ------ */
body{background:#fff url(../images/footer-bg.jpg) center bottom no-repeat; font-family:"Helvetica Neue",Arial,Helvetica,Geneva,sans-serif; font-size:14px; line-height:18px; color:#333}
#container{width:960px; margin:20px auto 0 auto}
a{color:#f90; text-decoration:none; outline: none;}
a:hover{color:#c60}
a:active{outline:none}
.clear{clear:both}

/* Header ------ */
h2{color:#369; font-size:20px; margin-bottom:8px}
h3{color:#369; font-size:16px; margin-bottom:4px}
h3 a{color:#369; font-size:16px; margin-bottom:4px}

/* Buttons ------ */
.download{display:block; margin:10px auto; width:180px}
.download p{text-align:center}
.download a{display:block; background:transparent url(../images/download-btn.png) top left no-repeat; width:180px; height:36px; text-indent:-9999px}
.download a:hover{background-position:left center}
.download a:active{background-position:bottom left}

/* Header ------ */
#header{background:#fff url(../images/header-bg.png) top left repeat-x; height:93px}
#header div.inner{width:960px; margin:0 auto}
#header div.inner h1{padding-top:5px}
#header div.inner h1 a{display:block; width:278px; height:78px; background:transparent url(../images/raknet-logo.png) top left no-repeat; text-indent:-9999px}

/* Nav ------ */
#nav{width:524px; float:right; margin-top:28px; position:relative}
#topnav{background:transparent url(../images/nav-bg.png) top left no-repeat; height:28px;  padding:5px}
#topnav li{float:left; padding:0 11px 4px 11px}
#topnav li a{color:#fff; text-transform:uppercase; text-shadow:1px 1px 1px #999; font-weight:bold; text-decoration:none; font-size:15px}
#topnav li a:hover{color:#356c90; text-shadow:none}
#topnav li a.active{color:#356c90; text-shadow:none}
#topnav li span{float:left; padding:5px 8px 5px 12px; position:absolute; left:0; top:27px; display:none; color:#fff; width:524px; -moz-border-radius:5px; -webkit-border-radius:5px; background:transparent url(../images/subnav-bg.png) top left no-repeat}
#topnav li:hover span{display:block}
#topnav li span a{display:block; float:left; font-size:14px; margin-right:20px}
#topnav li span a:hover{text-decoration:none}

/* Footer ------ */
#footer{background:transparent url(../images/gradient-up.png) top center no-repeat; width:960px; margin:0 auto; height:40px; padding:50px}
#footer p{text-align:center; font-size:12px; color:#666}
#footer p a{text-align:center; font-size:12px; color:#666}

/* Home ------ */
div.intro{height:120px; margin:20px 0 30px 0; font-size:16px; line-height:24px}
div.intro div.home-download{float:right; width:300px; height:127px; font-size:14px; line-height:18px; background:transparent url(../images/home-dl-bg.png) top left no-repeat; padding:5px 10px; margin-left:20px}
div.intro div.home-download p{text-align:left}
div.customers{background:transparent url(../images/gradient-down.png) top center no-repeat; padding-top:20px}
div.customers ul{display:table; margin-top:8px}
div.customers ul li{width:230px; height:126px; background:transparent url(../images/home-client-box.png) top left no-repeat; float:left; margin-right:13px; text-align:center; padding-top:22px}
div.customers ul li.last{margin:0}

/* Slider ------ */
#slides div.slides_container{width:960px; height:308px}
#slides ul.pagination{width:960px; height:32px; background:transparent url(../images/home-slide-btm.jpg) top left no-repeat}
#slides ul.pagination li{float:left; width:192px; text-align:center; padding-top:6px}
#slides ul.pagination li.current{font-weight:bold}

/* Internal ------ */
ul.sub-nav{height:41px; background:transparent url(../images/sub-nav-bg.png) top left no-repeat; padding-top:12px; margin-bottom:20px}
ul.sub-nav li{float:left; margin-right:40px}
ul.sub-nav li a{color:#f90; text-decoration:none}
ul.sub-nav li a:hover{color:#c60}
ul.sub-nav li a.active{color:#c60; font-weight:bold}
div.sidebar{float:right; width:320px}
div.sidebar div{border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; background-color:#d6e0eb; margin-bottom:20px; padding:10px; font-size:13px}
div.sidebar div.sb-download p{text-align:left}
div.sidebar div.sb-testimonials p{line-height:18px; font-size:13px; margin-top:24px}
div.sidebar div.sb-testimonials span{display:block; margin-top:8px; color:#666}
div.content{width:610px; min-height:400px}
div.news-content{width:800px; }
div.content p{margin-bottom:20px}

/* RakNet ------ */
div.content div.col-right{float:right; width:290px}
div.content div.col-left{width:290px}
div.content div.col-right, div.content div.col-left{font-size:13px}
div.content div.col-right p, div.content div.col-left p{margin-bottom:20px}
div.content ul.customers{margin-bottom:30px; display:table}
div.content ul.customers li{float:left; width:170px; height:149px; margin-right:45px; margin-bottom:30px; border:1px solid #ddd}
div.content ul.customers li.last{margin-right:0}
/* News ------ */
ul.news-list li{margin-bottom:36px; font-size:12px}
ul.news-list li span{display:block; margin-bottom:12px}
ul.news-list li p{margin-bottom:10px}

/* Options ------ */
div.options table{border:1px solid #fff}
div.options table tr td{padding:10px 8px; font-size:12px; border-bottom:1px solid #fff}
div.options tr.header td{background-color:#d6e0eb; color:#369; padding:8px; font-size:13px}
div.options .row1{background-color:#e6eaef}
div.options .row1:hover, div.options .row2:hover{background-color:#96adc4; color:#fff}
div.options .row2{background-color:#f2f2f2}

/* Download ------ */
div.content ul.download-options li{float: left;width: 200px;margin-right: 60px;}
div.content span.hobbyist-btn a{display:block; height:36px; width:158px; background:transparent url(../images/hobbyist-btn.png) top left no-repeat; text-indent: -9999px}
div.content span.hobbyist-btn a:hover{background-position:center}
div.content span.hobbyist-btn a:active{background-position:bottom}
div.content span.commercial-btn a{display:block; height:36px; width:158px; background:transparent url(../images/commercial-btn.png) top left no-repeat; text-indent: -9999px}
div.content span.commercial-btn a:hover{background-position:center}
div.content span.commercial-btn a:active{background-position:bottom}


/* Evaluation ------ */
div.content form.eval-form ul li{margin-bottom:10px}
div.content form.eval-form ul li label{display:block; font-weight:bold}
div.content form.eval-form ul li input{width:260px; border:1px solid #d6e0eb; padding:5px; font-size:12px}
div.content form.eval-form ul li p{font-size:11px}
div.content form.eval-form ul li.check-type input{width:18px}
div.content form.eval-form ul li span.agree{display:block; height:36px; width:117px; background:transparent url(../images/agree-btn.png) top left no-repeat}
div.content form.eval-form ul li span.agree:hover{background-position:center}
div.content form.eval-form ul li span.agree:active{background-position:bottom}
div.content form.eval-form ul li span.agree input{height:36px; width:117px; background:transparent; text-indent:-9999px; border:none; cursor:pointer}

/* Comapny ------ */
div.content-company{background:transparent url(../images/gradient-down.png) top center no-repeat; padding-top:20px; width:100%}
div.content-company div.map{float:right; margin:60px 200px 0 0; border:1px solid #ccc; padding:0; direction:block; width:400px; height:284px}