/** HTML5 Boilerplate **/

/* === Base styles: opinionated defaults === */
html,button,input,select,textarea {color: #222;}
body {font-size: 1em;line-height: 1.4;}
/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {background: #b3d4fc;text-shadow: none;}
::selection {background: #b3d4fc;text-shadow: none;}
/*
 * A better looking default horizontal rule
 */
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}
/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */
img {vertical-align: middle;}
/*
 * Remove default fieldset styles.
 */
fieldset {border: 0;margin: 0;padding: 0;}
/*
 * Allow only vertical resizing of textareas.
 */
textarea {resize: vertical;}

/* === Chrome Frame prompt === */
.chromeframe {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0;}

/* === Parallax Scroll === */
body, html {height: 100%;min-height: 100%;background-color: #000000;}
body {}
.no-js {padding-top: 106px;}
h2 {margin-top: 0;}
.loading {
	background: url('../img/loading.gif') no-repeat center center;}
section {min-width: 960px;opacity: 0;}
.loaded section,.no-js section {opacity: 1;-webkit-transition: opacity 300ms ease-out;-moz-transition: opacity 300ms ease-out;transition: opacity 300ms ease-out;}
main {overflow-x: hidden;}
#preload {width: 1px;height: 1px;overflow: hidden;position: absolute;top: 0;left: 0;}
.bcg {background-position: center center;background-repeat: no-repeat;background-attachment: fixed;background-size: cover;height: 100%;width: 100%;}
.hsContainer {width: 100%;height: 100%;overflow: hidden;position: relative;}
.hsContent {max-width: 700px;position: absolute;left: 50%;top: 50%;}
.hsContent h2  {color: #f4f4f4;background-color: rgba(0,0,0,0.5);padding: 10px 5px;font-size: 35px;line-height: 38px;margin-bottom: 12px;}
.hsContent p {width: 400px;color: #b2b2b2;}
.hsContent a {color: #b2b2b2;text-decoration: underline;}
/* Slide 1 */
#slide-1 .bcg {background-image:url('../img/marilyn.jpg')}
#slide-1 .hsContent {bottom: 200px;top: auto;}
/* Slide 2 */
#slide-2 .bcg {background-image:url('../img/wmkeys.jpg')}
#slide-2 .hsContent {margin-left: -450px;bottom: 200px;top: auto;}

/* === Helper classes === */

/*
 * Image replacement
 */
.ir {background-color: transparent;border: 0;overflow: hidden;
    /* IE 6/7 fallback */ *text-indent: -9999px;}
.ir:before {content: "";display: block;width: 0;height: 150%;}
/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {display: none !important;visibility: hidden;}
/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;
    position: absolute;width: 1px;}
/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus {clip: auto;height: auto;margin: 0;overflow: visible;position: static;width: auto;}
/*
 * Hide visually and from screenreaders, but maintain layout
 */
.invisible {visibility: hidden;}
/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the `contenteditable` attribute is included anywhere else in the document. Otherwise it causes space to appear at the top and bottom of elements that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using `:before` to contain the top-margins of child elements.
 */
.clearfix:before,.clearfix:after {content: " "; /* 1 */display: table; /* 2 */}
.clearfix:after {clear: both;}
/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix { *zoom: 1;}

/* ===  EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. === */
@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}
@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25),(min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* === Print styles. Inlined to avoid required HTTP connection: h5bp.com/r === */
@media print {
    * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */box-shadow: none !important;text-shadow: none !important;}
    a,a:visited {text-decoration: underline;}
    a[href]:after {content: " (" attr(href) ")";}
    abbr[title]:after {content: " (" attr(title) ")";}
    /*
     * Don't show links for images, or javascript/internal links
     */
    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content: "";}
    pre,blockquote { border: 1px solid #999;page-break-inside: avoid;}
    thead {display: table-header-group; /* h5bp.com/t */}
    tr,img {page-break-inside: avoid;}
    img {max-width: 100% !important;}
    @page {margin: 0.5cm;}
    p,h2,h3 {orphans: 3;widows: 3;}
    h2,h3 {page-break-after: avoid;}
}