/* when in fallback mode (for browsers that don't support transitions) hide anything outside of the Sequence container */
.sequence.sequence-fallback { overflow: hidden; }

.sequence {
	position: relative;
	height: auto;
	width: 100%;
	/*max-width: 960px;*/
	margin: 0 auto;
	background: white;
}
.sequence .sequence-canvas {
	height: 0/*100%*/;
	width: 100%; 
}
.sequence .sequence-canvas > li {
	position: absolute; width: 100%; height: 100%;
	z-index: 1; top: 0; left:0; right: 0; bottom:0; margin: 0; padding: 0 
}
.sequence .sequence-canvas > li > * { bottom: 0; left: 0; position: absolute; right: 0; top: 0;}
.sequence .sequence-canvas > li > div > * {  position: relative; }
.sequence .controls { z-index: 9998; position: absolute; top: auto; left:0; right: 0; bottom:0; margin: 0 }
.sequence .sequence-prev,
.sequence .sequence-next { }
.sequence .sequence-next,
.sequence .sequence-prev,
.sequence .sequence-pause {
	position: absolute;
	z-index: 10000;
	top: 10px; 
}
.sequence .sequence-next {}
.sequence .sequence-next:hover,
.sequence .sequence-prev:hover,
.sequence .sequence-pause:hover { }
.sequence .sequence-prev {}

.sequence .sequence-pause { right: 60px }

.sequence .sequence-pause.paused {}

.sequence .sequence-pause.paused:hover { }


.sequence .status {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	height: 6px; display: block;
	margin: 0;
	position: absolute;
	bottom: 0; left:0;
	width: 100%; z-index: 131
}
.sequence .status.paused {
	-webkit-animation: paused .5s linear alternate infinite !important;
	-moz-animation: paused .5s linear alternate infinite !important;
	-ms-animation: paused .5s linear alternate infinite !important;
	-o-animation: paused .5s linear alternate infinite !important;
	animation: paused .5s linear alternate infinite !important; 
}
.sequence .status.active {
	-webkit-animation: status-bar 5s ease-out;
	-moz-animation: status-bar 5s ease-out;
	-ms-animation: status-bar 5s ease-out;
	-o-animation: status-bar 5s ease-out;
	animation: status-bar 5s ease-out;
}
.sequence .pause-icon {
	right: 20px;
	position: absolute;
	bottom: 20px;
}
.sequence .sequence-preloader {
	height: 100%;
	position: absolute;
	width: 100%;
	z-index: 999999; 
}
.sequence .sequence-preloader img {
	background: #ff9933;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	display: inline-block;
	height: 12px;
	opacity: 0;
	position: relative;
	top: -50%;
	width: 12px;
	-webkit-animation: preload 1s infinite;
	-moz-animation: preload 1s infinite;
	-ms-animation: preload 1s infinite;
	-o-animation: preload 1s infinite;
	animation: preload 1s infinite; }
.sequence .sequence-preloader .preloading {
	height: 12px;
	margin: 0 auto;
	top: 50%;
	position: relative;
	width: 48px;
}
.sequence .sequence-preloader img:nth-child(2) {
	-webkit-animation-delay: 0.15s;
	-moz-animation-delay: 0.15s;
	-ms-animation-delay: 0.15s;
	-o-animation-delay: 0.15s;
	animation-delay: 0.15s; }
.sequence .sequence-preloader img:nth-child(3) {
	-webkit-animation-delay: 0.3s;
	-moz-animation-delay: 0.3s;
	-ms-animation-delay: 0.3s;
	-o-animation-delay: 0.3s;
	animation-delay: 0.3s; }
.sequence .sequence-preloader .preloading-complete {
	opacity: 0;
	visibility: hidden;
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-ms-transition-duration: 1s;
	-o-transition-duration: 1s;
	transition-duration: 1s; 
}

/* DNP Slider */
.sequence .slide > * {}

.sequence .slide.animate-in > * {}

.sequence div.fluid-width-video-wrapper iframe,
.sequence div.fluid-width-video-wrapper iframe * { }

#slideshow { }
#slideshow .main-inner { border-bottom: 1px solid #ddd }

.sequence,
#slideshow .main-inner { background: none; overflow: hidden }

.sequence .controls {opacity:1}

.sequence .label_slider > * { padding: 0 60px; }

@media only screen and (max-width:980px) {
	.sequence .label_slider > * { padding: 0 20px; }
}

.sequence .label_slider.media_wrapper > * { padding: 0 }

.sequence .sequence-canvas { margin: 0 }

/* Main Image */
.image_main {position: relative; top: 0; left:0; display: block; width: 100%; max-width: 100%}

/* navigation */
.controls li {
	position: absolute; top: 50%; cursor: pointer; text-indent: -999em; 
    height: 40px; width: 40px;
	margin: 0; margin-top:-20px; 
	-moz-transition: background 0.4s ease-out 0s; 
	-webkit-transition: background 0.4s ease-out 0s; 
	transition: background 0.4s ease-out 0s;
}

.sequence .controls li { 
	background-color: #333; 
	transition: background-color 0.4s ease-out 0s; -moz-transition: background-color 0.4s ease-out 0s; -webkit-transition: background-color 0.4s ease-out 0s; 
	bottom: 60px; margin-top: 0; top: auto 
}
.sequence .controls li:hover {  }
.sequence .controls li.sequence-prev { left: 60px;  }
.sequence .controls li.sequence-next { left: 101px; right:auto;  }


.controls li a:hover {
    background-color: #000;
}


.sequence .sequence-pagination { z-index: 9999; position: absolute; top: auto; left:auto; right: 120px; bottom:60px; margin: 0; display: block; }
.sequence .sequence-pagination li { 
	background-color: #333; height: 40px; width: 40px; float: left;  margin-right: 1px;
	transition: background-color 0.4s ease-out 0s; -moz-transition: background-color 0.4s ease-out 0s; -webkit-transition: background-color 0.4s ease-out 0s;
}
.sequence .sequence-pagination li:hover { cursor: pointer }

@media only screen and (min-width:280px) and (max-width:720px) {
	.sequence .sequence-pagination,
	.sequence .controls li.sequence-pause,
	.sequence .controls li.sequence-prev,
	.sequence .controls li.sequence-next { display: none }	
	.protoss-circles { margin-left: 12% }
}
@media only screen and (min-width:480px) and (max-width:720px) {
	.sequence .sequence-pagination { bottom: 10px; }
	.sequence .controls li.sequence-pause { bottom: 10px; right: 20px }
	.sequence .controls li.sequence-prev { bottom: 10px; left: 20px }
	.sequence .controls li.sequence-next { bottom: 10px; left: 61px }
}
@media only screen and (min-width:720px) and (max-width:980px) {
	.sequence .sequence-pagination { bottom: 20px; }
	.sequence .controls li.sequence-pause { bottom: 20px; right: 20px }
	.sequence .controls li.sequence-prev { bottom: 20px; left: 20px }
	.sequence .controls li.sequence-next { bottom: 20px; left: 61px }	
	.protoss-circles { margin-left: 15% }
}

/* content styling */
.label_slider h1,
.label_slider h2 {line-height: 1}

.label_slider h1.big {font-size: 50px; line-height: 50px; margin-top:0 !important}
.main-inner .label_slider h2.big {font-size: 30px; line-height: 25px; }
.label_slider h2.big {font-size: 40px; line-height: 40px; margin-top:0 !important}

.white-text .big, .white-text .big strong {text-shadow: 2px 2px 0px rgba(0,0,0,0.9);}
.black-text .big, .black-text .big strong {text-shadow: 2px 2px 0px rgba(255,255,255,0.9);}

.big strong {font-size: 105%}

.box_skitter #seq1.long-strikers-dark,
.box_skitter #seq2.long-strikers-light {float:left; clear: both;}

.label_wrapper p.readmore {display:block !important}

.label_slider { display: block }

.label_slider.media_wrapper {position:absolute !important; top:0 !important; right: 0 !important; left: 0 !important; bottom:0 !important; padding: 0 !important; margin: 0 !important;  width: 100%; height: 100%;}

/* text @copyright (c) 2012 Dan Partac - http://pcadviser.ro */
.white-text h1, .white-text h2,
.white-text h3, .white-text strong {color:#fff; text-shadow: 1px 1px 0px rgba(0,0,0,0.7);}
.white-text p,
.white-text ul {color:#eee; text-shadow: 1px 1px 0px rgba(0,0,0,0.9);}

.black-text h1, .black-text h2,
.black-text h3, .black-text strong {color:#111; text-shadow: 1px 1px 0px rgba(255,255,255,0.9);}
.black-text p,
.black-text ul {color:#333; text-shadow: 1px 1px 0px rgba(255,255,255,0.9);}

/* strikers @copyright (c) 2012 Dan Partac - http://pcadviser.ro */
.strikers-light h1, .strikers-dark h1 {padding: 15px 20px; margin:15px 0 10px;}
.strikers-light h2, .strikers-dark h2 {padding: 10px 17px; margin:15px 0 0;}
.strikers-light p, .strikers-light ul,
.strikers-dark p, .strikers-dark ul {padding: 5px 15px; margin: 15px 0 0;}

.strikers-light h1, .strikers-light h2, .strikers-light h4,
.strikers-light p, .strikers-light ul {color:#111; background: rgb(255,255,255); background: rgba(255,255,255,0.75); float:left; text-shadow: 1px 1px 0px rgba(255,255,255,0.9); clear: both; border-radius: 5px; -webkit-border-radius: 5px;}

.strikers-dark h1, .strikers-dark h2, .strikers-dark h4,
.strikers-dark p, .strikers-dark ul {color: #fff; background: rgb(0,0,0); background: rgba(0,0,0,0.75); float:left; text-shadow: 1px 1px 0px rgba(0,0,0,0.9); clear: both; border-radius: 5px; -webkit-border-radius: 5px; }

.strikers-light p.readmore, .strikers-dark p.readmore {background: none; margin: 15px 0 0; }

/* long strikers @copyright (c) 2012 Dan Partac - http://pcadviser.ro */
.long-strikers-light h1, .long-strikers-dark h1 {padding: 5px 15px 5px 5000px; margin:15px 0 15px -5000px !important;}
.long-strikers-light h2, .long-strikers-dark h2 {padding: 5px 15px 5px 5000px; margin:15px 0 15px -5000px !important;}
.long-strikers-light p, .long-strikers-light ul,
.long-strikers-dark p, .long-strikers-dark ul {padding: 5px 15px 5px 5000px; margin: 15px 0 15px -5000px !important;}

.long-strikers-light h1, .long-strikers-light h2, .long-strikers-light h4,
.long-strikers-light p, .long-strikers-light ul {color:#111; background: rgb(255,255,255); background: rgba(255,255,255,0.75); float:left; text-shadow: 1px 1px 0px rgba(255,255,255,0.9); clear: both; border-radius: 10px; -webkit-border-radius: 10px;}

.long-strikers-dark h1, .long-strikers-dark h2, .long-strikers-dark h4,
.long-strikers-dark p, .long-strikers-dark ul {color: #fff; background: rgb(0,0,0); background: rgba(0,0,0,0.75); float:left; text-shadow: 1px 1px 0px rgba(0,0,0,0.9); clear: both; border-radius: 10px; -webkit-border-radius: 10px; }

.long-strikers-light p.readmore, .long-strikers-dark p.readmore {background: none; margin: 15px 0;}

/* protoss */
.white-text .big, .white-text .big strong,
.black-text .big, .black-text .big strong,
.white-text h1, .white-text h2,
.black-text h1, .black-text h2,
.white-text p, .white-text ul,
.black-text p, .black-text ul {text-shadow: none}



/* responsive design @copyright (c) 2012 Dan Partac - http://pcadviser.ro */
@media only screen and (max-width:480px) {
	.white-text .big, .white-text .big strong {text-shadow: 1px 1px 0px rgba(0,0,0,0.9);}
	.black-text .big, .black-text .big strong {text-shadow: 1px 1px 0px rgba(255,255,255,0.9);}
	.label_slider h1.big {font-size: 20px; margin-left: 0%; line-height: 18px; margin-bottom:5px}
	.label_slider h2.big {font-size: 16px; margin-left: 2%; line-height: 16px; margin-bottom:5px}
}
@media only screen and (min-width:480px) and (max-width:720px) {
	.white-text .big, .white-text .big strong {text-shadow: 1px 1px 0px rgba(0,0,0,0.9);}
	.black-text .big, .black-text .big strong {text-shadow: 1px 1px 0px rgba(255,255,255,0.9);}
	.label_slider h1.big {font-size: 28px; margin-left: 5%; line-height: 28px; margin-bottom:10px}
	.label_slider h2.big {font-size: 20px; margin-left: 8%; line-height: 20px; margin-bottom:10px}
}
@media only screen and (min-width:720px) and (max-width:980px) {
	.label_slider h1.big {font-size: 36px; margin-left: 8%; line-height: 36px; margin-bottom:15px}
	.label_slider h2.big {font-size: 28px; margin-left: 12%; line-height: 28px; margin-bottom:15px}
}	
@media only screen and (max-width:720px) {
	.label_slider h1 { font-size: 19px; line-height: 19px; }
	.label_slider h2 { font-size: 16px; line-height: 16px; }
	
	.label_slider {width: 100% !important; /*margin: 0 !important;*/ }
	
	.label_slider p, .label_slider ol, .label_slider ul/*, 
	.label_slider img, .label_slider h1, .label_slider h2 */ {display:none !important}
}