/* ==========================================================================
   HEADER STYLES
   ========================================================================== */ 

#sequence { display: block; height: 100%; margin: 0; position: absolute; background:red; width: 950px;
	/*backface-visibility prevents graphical glitches when frames are animating*/
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
}


#sequence ul{ margin: 0; padding: 0; }
#sequence ul li{ height: 100%; position: absolute; top: -50%; width: 100%; z-index: 50; }
#sequence ul li.current-frame{ z-index: 55!important; }
#sequence ul li .slide, #sequence ul li .title, #sequence ul li .subtitle { position: absolute; }
#sequence ul li ol li{ display: inline-block; position: static; width: 35px; margin-right: 15px; position: relative; }
#sequence ul li ol li a{ opacity: .35;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
#sequence ul li ol li a:hover{ opacity: 1; }
#sequence ul li ol li img{ width: 35px; }



/*  SLIDER NAV DOTS */
#nav { display: none; text-align: center; position: relative; top: 95%; margin: 0; padding: 0;z-index: 1000;
	-webkit-transition-duration: .5s; -moz-transition-duration: .5s; -o-transition-duration: .5s; -ms-transition-duration: .5s; transition-duration: .5s;
}
#nav li { display: inline-block; }
#nav li span{ display: block; cursor: pointer; opacity: 0.5; background-color: #333; height: 12px; width: 12px; text-indent: -10000em; border-radius: 20px;
	-webkit-transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; -ms-transition-duration: 1s; transition-duration: 1s;
}
#nav li span.active { opacity: 1; background-color: #26a3ea; }
#nav li span:hover{ opacity: 1; }















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

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
* { background: transparent !important; color: #000 !important; 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) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
img { max-width: 100% !important; page-break-inside: avoid; }

@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}