/* global styles **************************************************************/

a {color:#9e9; cursor:pointer; text-decoration:none;}
a:hover {text-decoration:underline;}
img, object {max-width:100%;}

body {color:#ddd; font-family:'Ubuntu', sans-serif;
    background:-webkit-gradient(radial, center center, 0, center center, 16, color-stop(15%, #000), color-stop(16%, transparent)) 0 0,
        -webkit-gradient(radial, center center, 0, center center, 16, color-stop(15%, #000), color-stop(16%, transparent)) 8px 8px,
        -webkit-gradient(radial, center center, 0, center center, 16, color-stop(15%, rgba(255,255,255,.1)), color-stop(20%, transparent)) 0 1px,
        -webkit-gradient(radial, center center, 0, center center, 16, color-stop(15%, rgba(255,255,255,.1)), color-stop(20%, transparent)) 8px 9px;
    background:-webkit-radial-gradient(#000 15%, transparent 16%) 0 0,
        -webkit-radial-gradient(#000 15%, transparent 16%) 8px 8px,
        -webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
        -webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
    background:-moz-radial-gradient(#000 15%, transparent 16%) 0 0,
        -moz-radial-gradient(#000 15%, transparent 16%) 8px 8px,
        -moz-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
        -moz-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
    background:-ms-radial-gradient(#000 15%, transparent 16%) 0 0,
        -ms-radial-gradient(#000 15%, transparent 16%) 8px 8px,
        -ms-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
        -ms-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
    background:-o-radial-gradient(#000 15%, transparent 16%) 0 0,
        -o-radial-gradient(#000 15%, transparent 16%) 8px 8px,
        -o-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
        -o-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
    background:radial-gradient(#000 15%, transparent 16%) 0 0,
        radial-gradient(#000 15%, transparent 16%) 8px 8px,
        radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
        radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
    background-color:#282828; background-size:16px 16px;}

/* text selection */
::-moz-selection {background:#369; color:#fff; text-shadow:none;}
::selection {background:#369; color:#fff; text-shadow:none;}
a::-moz-selection {color:#ff0;}
a::selection {color:#ff0;}


/* base template default styles ***********************************************/

.alert {color:#000; font-size:16px; line-height:24px; margin:0; text-align:center; width:100%;
    background-color:transparent;
    background-color:rgba(255,255,255,.5); /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FFFFFFF,endColorstr=#7FFFFFFF); /* IE6–IE9 */
}
:root .alert {filter:none;}
.alert a {color:#c00;}
.view-public a {display:block; height:100%; text-decoration:none; width:100%;}
.view-public a:hover {background:#fee;}

#wrap {margin:0 auto; position:relative;}
header[role=banner],
    nav.skip {margin:0 0 20px; text-align:center;}
header[role=banner] h1 {margin:0;}
header[role=banner] h1 a {color:#ddd; font-size:36px; line-height:50px; text-decoration:none;}
section[role=main] > h1,
    section[role=main] > header h1 {font:36px/36px 'Times New Roman',Times,serif; letter-spacing:-1px; margin:0 0 20px;}
section[role=main],
    aside[role=complementary] {padding:0 10px;}
aside[role=complementary] {display:none;}

nav.global {margin:0 0 10px; padding:10px; background-color:transparent;
    background-color:rgba(0,0,0,.5); /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000); /* IE6–IE9 */
}
:root nav.global {filter:none;}
nav.global a {display:block; height:100%; line-height:40px; width:100%;}
nav.global h2 {margin:0;}
nav.global ul,
    nav.blog ul {margin:0; padding:0;}
nav.global li > ul {margin:5px 0 20px;}

footer[role=contentinfo] {margin:10px 0; text-align:center;}


/* media queries for responsive design ****************************************/

/* prevent Respond FOUC */
.js body {display:none;}
@media only screen and (min-width:1px), print {.js body {display:block;}}

/* mobile (iPhone portrait) */
@media only screen and (min-width:320px) {
    .js header[role=banner] {padding:0 0 40px;}
    .js nav.global {padding:0; position:absolute; top:50px; width:100%; background-color:transparent;
        background-image:-webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,.5))); /* Saf4+, Chrome */
        background-image:-webkit-linear-gradient(top, transparent, rgba(0,0,0,.5)); /* Chrome 10+, Saf5.1+, iOS 5+ */
        background-image:-moz-linear-gradient(top, transparent, rgba(0,0,0,.5)); /* FF3.6 */
        background-image:-ms-linear-gradient(top, transparent, rgba(0,0,0,.5)); /* IE10 */
        background-image:-o-linear-gradient(top, transparent, rgba(0,0,0,.5)); /* Opera 11.10+ */
        background-image:linear-gradient(to bottom, transparent, rgba(0,0,0,.5));
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000,endColorstr=#7F000000); /* IE6–IE9 */
    }
    .js nav.global a {color:#fff; font-weight:bold; text-decoration:none;}
    .js nav.global a:hover {color:#9e9;}
    .js nav.global > ul > li {float:left; text-align:center; width:33%;}
    .js nav.global > ul > li:first-child + li {width:34%;}
    .js nav.global h2 {color:#fff; cursor:pointer; font-size:14px; font-weight:bold; line-height:40px;
        text-decoration:none;}
    .js nav.global li > ul {display:none; left:0; margin:0; position:absolute; top:100%; width:100%;
        background-color:transparent;
        background-color:rgba(0,0,0,.8); /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000); /* IE6–IE9 */
    }
    :root.js nav.global li > ul {filter:none;}
    nav.global li.active > h2 {background-color:transparent;
        background-image:-webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,.8))); /* Saf4+, Chrome */
        background-image:-webkit-linear-gradient(top, transparent, rgba(0,0,0,.8)); /* Chrome 10+, Saf5.1+, iOS 5+ */
        background-image:-moz-linear-gradient(top, transparent, rgba(0,0,0,.8)); /* FF3.6 */
        background-image:-ms-linear-gradient(top, transparent, rgba(0,0,0,.8)); /* IE10 */
        background-image:-o-linear-gradient(top, transparent, rgba(0,0,0,.8)); /* Opera 11.10+ */
        background-image:linear-gradient(to bottom, transparent, rgba(0,0,0,.8));
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000,endColorstr=#CC000000); /* IE6–IE9 */
    }
    nav.global li.active > ul {display:block;}
} /* mobile (iPhone portrait) */

/* mobile (iPhone landscape) */
@media only screen and (min-width:480px) {
} /* mobile (iPhone landscape) */

/* HDPI (iPhone 4) */
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
    only screen and (-o-min-device-pixel-ratio:3/2),
    only screen and (min-device-pixel-ratio:1.5) {
} /* HDPI (iPhone 4) */

/* tablet (iPad portrait) */
@media only screen and (min-width:768px) {
} /* tablet (iPad portrait) */

/* tablet (iPad landscape) */
@media only screen and (min-width:1024px) {
} /* tablet (iPad landscape) */

/* tablet (iPad) */
@media only screen and (min-width:768px) and (max-width:1024px) {
} /* tablet (iPad) */

/* tablet (iPad portrait) */
@media only screen and (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
} /* tablet (iPad portrait) */

/* tablet (iPad landscape) */
@media only screen and (min-width:768px) and (max-width:1024px) and (orientation:landscape) {
} /* tablet (iPad landscape) */


/* presentational classes *****************************************************/

/* micro clearfix: http://nicolasgallagher.com/micro-clearfix-hack/ */
.cf:before, .cf:after {content:""; display:table;}
.cf:after {clear:both;}
.cf {*zoom:1;}

/* image replacement: http://nicolasgallagher.com/another-css-image-replacement-technique/ */
.ir {background-color:transparent; border:0; color:transparent; font:0/0 a; text-shadow:none;}


/* print styles ***************************************************************/

@media print {
    * {background:transparent !important; color:#000 !important; text-shadow:none !important; filter:none !important;
        -ms-filter:none !important;}
    a, a:visited {text-decoration:underline;}
    a[href]:after {content:" (" attr(href) ")";}
    abbr[title]:after {content:" (" attr(title) ")";}
    a[href^="javascript:"]:after, a[href^="#"]:after {content:"";}
    nav.skip {display:none;}
}