@charset "UTF-8";

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 16px;
	vertical-align: top;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Defaults */
body, body * {
	border: 0;
	outline: 0;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}
div,
svg,
img {
	width: 970px;
	height: 250px;
	top: 0;
	left: 0;
	position: absolute;
	z-index: 0;
	visibility: hidden;
}
img,
svg {
	width: 100%;
	height: auto;
}
.center {
	margin: auto;
	top: 0; left: 0; bottom: 0; right: 0;
}

/* Visual Containers */
#container {
	overflow: hidden;
	background-color: #fff;
	visibility: visible;
	/*margin:  500px 500px 0px 970px;*/
}
#borderInner,
#border {
    width: 100%;
    height: 100%;
	fill: white;
    fill-opacity: 0.0;
    stroke-opacity: 1.0;
	visibility: visible;
}
#borderInner {
    stroke: #fff;
    stroke-width: 14px;
}
#border {
    stroke: #000;
    stroke-width: 1px;
}
#logo {
	height: 51px;
	top: 169px;
	left: -1px;
}



/* Intro */
.intro {
	width: 276px;
	height: 260px;
	top: -5px;
	left: -5px;
	overflow: hidden;
}
#introB { left: 251px; }
#introC { left: 507px; }
.introShadow {
	width: 276px;
	height: 260px;
}
.introImg {
	width: 246px;
	height: 230px;
	top: 15px;
	left: 15px;
}
.headline {
	height: 23px;
	top: 250px;
}

/* Endframe, Carousel & Slider*/
.column {
 	width: 182px;
	height: 750px;
	left: 10px;
	visibility: visible;
}
#columnB { left: 202px; }
#columnC { left: 394px; }
#columnD { left: 586px; }
#columnA,
#columnC {
	top: 250px;
}
#columnB,
#columnD {
	top: -750px;
}
.block {
 	width: 182px;
	height: 250px;
	visibility: visible;
	overflow: hidden;
}
.blockMid { top: 250px; }
.blockBottom { top: 500px; }
.blockAlt {
	height: 230px;
	top: 10px;
}
.block img { visibility: visible; }
.theTxt {
	height: 10px;
	top: 90px;
}
.everywear {
	height: 14px;
	top: 111px;
}
.title {
	height: 15px;
	top: 137px;
}

#sliderHolder {
	width: 182px;
    height: 237px;
    top: 7px;
    left: 778px;
	cursor: pointer;
	background-color: #fff;
	visibility: visible;
}
#the {
	height: 9px;
	top: 66px;
}
#everywear {
	height: 14px;
	top: 84px;
}
#collection {
	height: 10px;
	top: 110px;
}
.productTxt {
	height: 14px;
	top: 60px;
}
#labels {
	width: 182px;
    height: 18px;
    top: 250px;
    left: 778px;
	visibility: visible;
}
.productLabel {
	height: 8px;
	top: 5px;
}
#slideLabel {
	height: 8px;
	top: 226px;
}
#backLabel { left: 44px; }
#muleLabel {
	left: -48px;
	visibility: visible;
}
#jeanLabel { left: -47px; }
#jacketLabel { left: -52px; }
#shirtLabel { left: -47px; }

#carouselWrapper { top: 250px; }
#carouselA { left: 10px; }
#carouselB { left: 202px; }
#carouselC { left: 394px; }
#carouselD { left: 586px; }
#carouselE { left: 970px; }
#pricesHolder {
	width: 384px;
	height:250px;
	left: 586px;
	overflow: hidden;
	visibility:visible;
}
.price {
	width: 192px;
	height: 21px;
}
#efMuleA { left: 182px; }
#efMuleB {
	width: 374px;
	left: 192px;
}
#efMuleC { left: 0px; }
#mulePrice {
	top: 184px;
	left: 182px;
}
#jeanA { left: 192px; }
#jeanB { left: 384px; }
#jeanC {
	width: 374px;
	left: 193px;
}
#jeanPrice {
	top: 184px;
	left: 292px;
}
#jacketA { left: 192px; }
#jacketB { left: 960px; }
#jacketC {
	width: 374px;
	left: 576px;
}
#jacketPrice {
	top: 34px;
	left: 292px;
}
#shirtA { left: 970px; }
#shirtB { left: 576px; }
#shirtC {
	width: 374px;
	left: 576px;
}
#shirtPrice {
	top: 42px;
	left: 292px;
}

.gutter {
	width: 10px;
	height: 250px;
	background-color: #fff;
	visibility: visible;
}
#gutterA { left: 192px; }
#gutterB { left: 384px; }
#gutterC { left: 576px; }
#gutterD { left: 576px; }
#gutterE { left: 768px; }
#gutterF { left: 960px; }


/* Content Slider */
#dragHolder,
#dragInner {
	width: 950px;
	height: 45px;
	top: 204px;
	left: 10px;
	visibility: visible;
}
#dragHolder { overflow: hidden; }
#dragInner {
	top: 45px;
	left: 0px;
}
.nodeCirc {
	width: 182px;
	height: 42px;
	top: 6px;
	visibility: visible;
}
#dragNodeCircB { left: 192px; }
#dragNodeCircC { left: 384px; }
#dragNodeCircD { left: 576px; }
#dragNodeCircE { left: 768px; }
#dragStrip {
	height: 21px;
	top: 13px;
	visibility: visible;
}
.node {
	width: 182px;
	height: 16px;
	top: 14px;
	visibility: visible;
	cursor: pointer;
}
#dragNodeB { left: 192px; }
#dragNodeC { left: 384px; }
#dragNodeD { left: 576px; }
#dragNodeE { left: 768px; }
.viewLabel {
	width: 182px;
	height: 19px;
	top: 8px;
	cursor: pointer;
}
#viewLabelB { left: 192px; }
#viewLabelC { left: 384px; }
#viewLabelD { left: 576px; }
#viewLabelE {
	height: 8px;
	top: 19px;
	left: 768px;
}
.viewLabelbackground {
	width: 75px;
	height: 17px;
	top: 14px;
	left: 53px;
	background-color: #fff;
	cursor: pointer;
}
#viewLabelbackgroundB {
	width: 75px;
	left: 245px;
}
#viewLabelbackgroundC {
	width: 85px;
	left: 434px;
}
#viewLabelbackgroundD {
	width: 75px;
	left: 630px;
}
#viewLabelbackgroundE {
	width: 75px;
	left: 826px;
}
#dragBackground {
	width: 157px;
    height: 18px;
    top: 14px;
    left: 781px;
	background-color: #fff;
    visibility: visible;
/*    border: 1px solid #FF0004;*/
}
#dragHandleHolder {
	width: 49px;
	height: 24px;
	top: 11px;
	left: 833px;
	visibility: visible;
}
#dragHandle,
#dragHand {
	width: 49px;
	height: 24px;
	visibility: visible;
}
#slider {
	width: 950px;
	height: 250px;
	top: 500px;
	left: 10px;
	visibility: visible;
}
.noUi-target,
.noUi-target * {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-ms-touch-action: none;
		touch-action: none;
	-ms-user-select: none;
	-moz-user-select: none;
		user-select: none;
}
.noUi-target {
	position: relative;
	direction: ltr;
}
.noUi-base {
	width: 768px;
	height: 250px;
	position: relative;
	z-index: 1; /* Fix 401 */
	visibility: visible;
}
.noUi-origin {
	position: absolute;
	right: 0;
	top: -250px;
	left: 0;
	bottom: 0;
	height: 10px;
	visibility: visible;
}
.noUi-handle {
/*	border: 1px solid #F90004;*/
	width: 182px;
    height: 250px;
	cursor: pointer;
	top: 0px;
    left: 0px;
	position: relative;
	z-index: 1;
	visibility: visible;
	background-color: rgba(255,255,255,0);
}
.noUi-stacking .noUi-handle { z-index: 10; }
.noUi-state-drag * { cursor: inherit !important; }
.noUi-base,
.noUi-handle {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.noUi-draggable { cursor: w-resize; }



/* Exits & Ctas */
#mainExitHolder {
	width: 970px;
	height: 250px;
	cursor: pointer;
	visibility: visible;
	pverflow: hidden;
}
.mLink {
	width: 970px;
	height: 100%;
	background-color: rgba(255,255,255,0);
	visibility: visible;
}
#muleExit { left: 970px; }
#jeanExit { left: 1940px; }
#jacketExit { left: 2910px; }
#shirtExit { left: 3880px; }

#cta {
	/*width: 130px;
	height: 34px;*/
	width: 128px;
	height: 32px;
	border: 1px solid black;
	overflow: hidden;
	top: 122px;
	left: 970px;
}
#ctaTxt {
	height: 13px;
	top: 10px;
}
#ctaOverlay {
	width: 100%;
	height: 100%;
	fill: #000;
	stroke: #000;
	stroke-width: 1;
	fill-opacity: 0.0;
	stroke-opacity: 1.0
}
#ctaHotspot {
	width: 130px;
    height: 32px;
    top: 250px;
    left: 804px;
    cursor: pointer;
	background-color: rgba(255,255,255,0);
	visibility: visible;
	overflow: hidden;
}
#hLinkHolder,
.hLink {
	width: 157px;
	height: 100%;
	visibility: visible;
}
#mainExitAlt { left: 0px; }
#muleExitAlt { left: 157px; }
#jeanExitAlt { left: 314px; }
#jacketExitAlt { left: 471px; }
#shirtExitAlt { left: 628px; }
