/*
------------------------------------------------------------------------------------------- 
-- HERO CONTENT CAROUSEL
------------------------------------------------------------------------------------------- 
*/
.hero {
	position:relative;
	width: 100%;
}

.hero-content {
	position:relative;
	width: 100%;
}

.hero-menu {
	display:none;
	/*z-index: 200;*/
	/* stop menu from being selected */
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
}

.abs{
	position:absolute;
	margin:0;
}


.hero-content-carousel {
	margin: 0;
	padding: 0;
}

.hcc-stage {
	overflow: hidden;
	position: relative;
}
.hcc-sprite {
	position: absolute;
	left: 0;
	top: 0;
	background:#333;
}

.hero-content-item, .hcc-item {
	position:absolute;
	left: 0;
	top: 0;
	display:none;
}

.hero-content-item:first-child {
	position:relative;
	display:block;
}

.hci-pod {
	width:100%;
	height:100%;
}

/* POD */
.hci-pod {
	position: relative;
}

/* AVAILABLE SIZES */
.hero-170 .hci-pod {
	height: 170px;
}

.hero-230 .hci-pod {
	height: 230px
}

.hero-270 .hci-pod {
	height: 270px;
}


/* OVERLAY */
.hci-overlay {
	position: relative;
	margin: 0 10px 10px 10px;
	
}


/* AVAILABLE SIZES less MARGIN BOTTOM 10px */
.hero-170 .hci-overlay {
	height: 160px
}

.hero-230 .hci-overlay {
	height: 220px;
}

.hero-270 .hci-overlay {
	height: 260px;
}

.hci-info {
	padding: 17px 10px 0px 10px;
}

/* TX */
.hci-tx {
	display: block;
	position: absolute;
	bottom: 0px;
	right: 0px;	
	color: #333;
	font-size: 1.2em;
	text-align: right;
	margin:0;
}

.hci-tx img {
	margin: 6px 0 0 0;
	padding: 0px;
}


.hci-terms {
	font-size: 11px;
	color: #666666;
	font-family: "Helvetica";
	padding: 6px 5px 5px 5px;
}

.hci-terms p {
	font-size: 11px;
}

.hero-terms {
	height:0;
	overflow:hidden;
	padding:0;
}

.hero-cover {
	display : block;
	width:100%;
	height:100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color : #000;
	/*z-index:250;*/
	opacity: 0;
}


/* 
------------------------------------------------------------------------------------------- 
-- CAROUSEL UI
------------------------------------------------------------------------------------------- 
*/

.hcc-arrow-btn, .hero-content-carousel .hcc-arrow-btn {
	display:block;
	position: absolute;
	top: 0px;
	width: 40px;
	height: 100%;
	/*cursor: pointer;*/
	/*z-index:100;*/
}

.hero-content-carousel .hcc-arrow-btn-left {
	display:block;
	/*top: 0px;
	left: 0px;*/
	width: 100%;
	height: 100%;
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:center center;
	background-image: url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/shop_arrow_left.png_1300071601.png);
	/*filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}
.hero-content-carousel .hcc-arrow-btn-right {
	display:block;
	/*top: 0px;
	right: 0px;*/
	width: 100%;
	height: 100%;
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:center center;
	background-image: url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/shop_arrow_right.png_1300071601.png);
	/*filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}

a.hcc-play-pause-btn {
	display: block;
	position: absolute;
	cursor: pointer;
	height: 18px;
	background: transparent url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/playPauseBtn.png_1300071601.png) no-repeat 0 0;
	padding-left: 20px;
	color: #fff;
	line-height:18px;
	font-family: "Helvetica";
	font-size: 1.2em;
}

a.hcc-play-pause-btn {
	text-decoration:none;
}

a.hcc-show-terms-btn {
	display: block;
	position: absolute;
	cursor: pointer;
	color: #fff;
	/*line-height:1.2em;*/
	font-family: "Helvetica";
	font-size: 1.2em;
}

a.hcc-show-terms-btn.grey {
	color: #333;
}

a.hcc-show-terms-btn:hover {
	text-decoration:none;
}


/* 
------------------------------------------------------------------------------------------- 
-- VIDEO UI
------------------------------------------------------------------------------------------- 
*/

video {
 /*-webkit-transform-style:preserve-3d;*/
}


a.video-play-btn {
	cursor: pointer;
	text-decoration:none;
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
 *display:inline;
}

a.video-play-btn:hover {
	text-decoration: none;
}

.video-play-btn-1 {
	position:absolute;
	/*display: block;*/
	width: 116px;
	height: 116px;
	/*background: transparent url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/playVideoBtn_1.png_1300071601.png) no-repeat 0 0;
	filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}

.video-play-btn-1 .vpbtn-1-icon {
	display: block;
	width: 116px;
	height: 116px;
	background: transparent url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/playVideoBtn_1.png_1300071601.png) no-repeat 0 0;
	/*filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}

/* on margin-top account for 10px bottom margin on overlay */
.video-play-btn-1.vpb1-center {
 left:50%; 
 margin-left:-58px;
 top:50%; 
 margin-top:-48px;
}

.video-play-btn-1.vpb1-centerH {
 left:50%; 
 margin-left:-58px;
}

/* on margin-top account for 10px bottom margin on overlay */
.video-play-btn-1.vpb1-centerV {
 top:50%; 
 margin-top:-48px;
}

.video-play-btn-2 {
	position:absolute;
	bottom: 0px;
	left: 0px;
	height: 50px;
	text-decoration:none;
}

.video-play-btn-2 .vpbtn-2-bg {
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	background-color:#333;
	-webkit-border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-moz-border-radius: 4px;
}

.video-play-btn-2 .vpbtn-2-bg .vpbtn-2-icon {
	display:block;
	position:absolute;
	right:6px;
	width:39px;
	height:50px;
	background: transparent url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/playVideoBtn_2.png_1300071601.png) no-repeat 0 0;
	/*filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}

.vpbtn-2-content {
	display:block;
	position:relative;
	left:0px;
	top:0px;
	line-height: 50px;
	color: #fff;
	font-family: "SkyTextMedium";
	font-size: 24px;
	padding-left:10px;
	padding-right:55px;
}

.vpbtn-2-sub {
	font-family: "SkyTextRegular";
	font-size: 18px;
}

.video-close-btn {
	display: block;
	position: absolute;
	cursor: pointer;
	width: 22px;
	height: 22px;
	visibility:hidden;
	background: transparent url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/closeVideoBtn.png_1300071601.png) no-repeat 0 0;
	/*filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/css/widgets/hero/hero.css)';*/
}

.video-player {
	/*height:100%;
	width:100%;*/
	background-color:#222;
}

.no-video-message {
	float:left;
	margin: 20px 20px 20px 20px;
	color:#FFF;
}

.no-video-message p, .no-video-message li {
	font-size: 12px;
	line-height: 16px;
}

.no-video-message ul {
	display: block;
	list-style: disc inside;
}

.no-video-message h3 {
	color:#00618E;
}
.no-video-message a {
	color:#00618E;
}

/* 
------------------------------------------------------------------------------------------- 
-- LOAD INDICATORS
------------------------------------------------------------------------------------------- 
*/
.load-indicator {
	display : block;
	position : absolute;
}
.li-apple {
	width: 32px;
	height: 32px;
	background-image:url(/shop/export/system/modules/com.sky.storefront/resources/assets/sixteen/images/hero/ajax-loader.gif_1300071601.gif);
}



/* 
------------------------------------------------------------------------------------------- 
-- OTHER
------------------------------------------------------------------------------------------- 
*/

object {
	outline:none
}

.js-container {
	position: absolute;
	overflow: hidden;
}

#output {
	margin:0;
	clear: both;
	width: 950px;
	height: 300px;
	overflow: scroll;
	border: 1px solid #666;
	color: #000;
	background-color: #fcfcfc;
	padding: 10px;
	position: relative;
	/*z-index:3000;*/
	top:20px;
	left:0px;
}


/* 
------------------------------------------------------------------------------------------- 
-- BULLET TIME : CUSTOM JS OBJECT
------------------------------------------------------------------------------------------- 
*/

#ui-slider {
	display: none;
	height: 30px;
	background-color:#000;
	position : absolute;
	left: 50%;
	/* DYNAMICALLY SET IN JS
	width: 600px;
	margin-left: -300px;
	bottom: 40px; */

}
.ui-slider-handle {
	display: block;
	width: 30px;
	height: 30px;
	background-color:#fff;
	position : absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}





/* OVERRIDES */
.hero h2 {
	margin-bottom:20px;
}



/* DEMO ... should be replaced by inline styling from CMS 
.hci-overlay h1, .hci-overlay h2,  .hci-overlay h3, .hci-overlay, .hci-tx  {
	color: #fff;
}

.chevronLink.white {
	color: #fff;
}

.hci-info {
	width:300px;
}

.hero .btnWrap {
	margin-right: 30px;
}*/