/* RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
html { height: 100%; overflow-y: scroll; }
body { height: 100%; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
sup { vertical-align: super; }
table { border-collapse: collapse; border-spacing: 0; }
div, img { display: block; }

/* ########################################################################## */

.ver_tablet,
.ver_phone { display: none !important; }
.ver_desktop { display: block !important; }

/* ########################################################################## */

a:link, a:visited { text-decoration: none; color: #2167ac; }
a:hover { color: #222222; text-decoration: underline; }

.sprite { display: block; background: transparent url('../images/sprites.png?ver=1.0') no-repeat 0 0; border: 0; text-indent: -6000px; overflow: hidden; color: transparent; text-transform: capitalize; }

/* ########################################################################## */

.bgs { position: fixed; width: 100%; height: 100%; z-index: 1; top: 0; left: 0; overflow: hidden; background-color: #111111; text-align: center; }
.bgs .bg { position: absolute; display: none; line-height: 0; top: 0; left: 0; z-index: 1; }
.bgs > div > img { position: absolute; display: block; line-height: 0; top: 0; left: 0; }

/* ########################################################################## */

body { font-family: Helvetica, Arial, sans-serif; font-style: normal; font-size: 15px; line-height: 20px; color: #222222; text-align: center; letter-spacing: 0; background-color: #fafafa; -webkit-font-smoothing: antialiased; }

#wrapper { width: 100%; text-align: center; min-height: 100%; height: auto !important; margin: 0 auto; }

/* ########################################################################## */

/* HOME */
#content_splash { width: 100%; height: auto; text-align: center; padding: 0; position: relative; z-index: 10; }
#content_splash_inner { width: 972px; margin: 0 auto; padding: 80px 40px 40px 40px; text-align: center; display: none; }

#logo { width: 500px; height: 50px; margin: 0 auto 40px auto; background: transparent url('../images/logo-big.png?ver=1.0') no-repeat 0 0; border: 0; text-indent: -6000px; overflow: hidden; color: transparent; text-transform: capitalize; }

#logo_phone { width: 280px; height: 28px; margin: 0 auto 40px auto; background: transparent url('../images/logo-small.png?ver=1.0') no-repeat 0 0; border: 0; text-indent: -6000px; overflow: hidden; color: transparent; text-transform: capitalize; }

/* ########################################################################## */
/* RETINA DISPLAY */
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    
    #logo { background-image: url('../images/logo-big@2x.png?ver=1.0'); background-size: 500px 50px; }
    #logo_phone { background-image: url('../images/logo-small@2x.png?ver=1.0'); background-size: 280px 28px; }
    
}

/* ########################################################################## */
/* RESPONSIVE */

@media only screen and (max-width: 1160px) {
    
    .ver_tablet,
    .ver_phone { display: none !important; }
    .ver_desktop { display: block !important; }
    
    #content_splash { min-width: 880px; }
    #content_splash_inner { width: 800px; }
    
}

@media only screen and (max-width: 960px) {
    
    .ver_desktop,
    .ver_phone { display: none !important; }
    .ver_tablet { display: block !important; }
    
    #content_splash { min-width: 700px; }
    #content_splash_inner { width: 620px; }
    
}

@media only screen and (max-width: 760px) {
    
    .ver_desktop,
    .ver_tablet { display: none !important; }
    .ver_phone { display: block !important; }
    
    #wrapper { height: auto; min-height: 0; margin: 0; }
    
    #content_splash { width: 100%; min-width: 320px; height: auto; }
    #content_splash_inner { width: 100%; padding: 40px 0; }
    
}

/* ########################################################################## */
/* CLEARFIX */

/* http://sonspring.com/journal/clearing-floats */
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
* html .clearfix { height: 1%; /* IE5-6 */ }
* + html .clearfix { display: inline-block; /* IE7not8 */ }
.clearfix:after { /* FF, IE8, O, S, etc. */ content: "."; display: block; height: 0; clear: both; visibility: hidden; }