/* Feature Graphic */
/*#feature-wrapper .row { width: 130%; right: 10%; position: relative; }*/
#feature-wrapper .row { width: 100%; position: relative; }
#feature-wrapper .column:last-child { /*background-image: url(/home/images/18_home/feature_graphic_homepage.jpg); background-repeat: no-repeat; background-size: contain;*/ }
#feature-wrapper .column:first-child {padding-right: 40px;}
.fh0 h1 {margin-bottom: 15px;}
.fh0 p {margin-bottom: 30px;}
.fh0 p:last-child {margin-bottom: 0px;}

/* Rotating Words noscript Start */
.rw-words{ display: inline;	}
.rw-words-1 span{
	position: absolute;
	opacity: 0;
	overflow: hidden;
	font-weight: 400;
	padding-bottom: 2px;
	border-bottom: 1px solid #000000;
	-webkit-animation: rotateWord 14s ease-out infinite 0s;
	-ms-animation: rotateWord 14s ease-out infinite 0s;
	animation: rotateWord 14s ease-out infinite 0s;
}

.rw-words-1 span:nth-child(2) { 
  -webkit-animation-delay: 2s; 
	-ms-animation-delay: 2s; 
	animation-delay: 2s; 
}
.rw-words-1 span:nth-child(3) { 
  -webkit-animation-delay: 4s; 
	-ms-animation-delay: 4s; 
	animation-delay: 4s; 
}
.rw-words-1 span:nth-child(4) { 
  -webkit-animation-delay: 6s; 
	-ms-animation-delay: 6s; 
	animation-delay: 6s; 
}
.rw-words-1 span:nth-child(5) { 
  -webkit-animation-delay: 8s; 
	-ms-animation-delay: 8s; 
	animation-delay: 8s; 
}
.rw-words-1 span:nth-child(6) { 
  -webkit-animation-delay: 10s; 
	-ms-animation-delay: 10s; 
	animation-delay: 10s; 
}
.rw-words-1 span:nth-child(7) { 
  -webkit-animation-delay: 12s; 
	-ms-animation-delay: 12s; 
	animation-delay: 12s; 
}

@keyframes rotateWord {
	0% { opacity: 0; }
	3% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	6% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	17% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	20% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

@-webkit-keyframes rotateWord {
	0% { opacity: 0; }
	3% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	6% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px) }
	17% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px) }
	20% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-moz-keyframes rotateWord {
	0% { opacity: 0; }
	3% { opacity: 0; -moz-transform: translateY(-30px); transform: translateY(-30px); }
	6% { opacity: 1; -moz-transform: translateY(0px); transform: translateY(0px) }
	17% { opacity: 1; -moz-transform: translateY(0px); transform: translateY(0px) }
	20% { opacity: 0; -moz-transform: translateY(30px); transform: translateY(30px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
/* Rotating Words noscript End */

/* Rotating Words JS Portion Start */
.slider-words{ display: inline;	}
.slider-words span{
	position: absolute;
	opacity: 0;
	overflow: hidden;
	font-weight: 400;
	padding-bottom: 2px;
	border-bottom: 1px solid #000000;
}

.slider-words span.current {
	-webkit-animation: rotateWordSlider 3s ease-out 0s;
	-ms-animation: rotateWordSlider 3s ease-out 0s;
	animation: rotateWordSlider 3s ease-out 0s;
}

.slider-words span.current.first {
	-webkit-animation: rotateWordSliderFirst 2.6s ease-out 0s;
	-ms-animation: rotateWordSliderFirst 2.6s ease-out 0s;
	animation: rotateWordSliderFirst 2.6s ease-out 0s;
}

.slider-words span.current.last {
	-webkit-animation: rotateWordSlider 3s ease-out 0s;
	-ms-animation: rotateWordSlider 3s ease-out 0s;
	animation: rotateWordSlider 3s ease-out 0s;
}

@-moz-keyframes rotateWordSlider {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@-webkit-keyframes rotateWordSlider {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transsform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@keyframes rotateWordSlider {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@-moz-keyframes rotateWordSliderFirst {
	0% { opacity: 1; }
	85% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@-webkit-keyframes rotateWordSliderFirst {
	0% { opacity: 1; }
	85% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@keyframes rotateWordSliderFirst {
	0% { opacity: 1; }
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
}

@-moz-keyframes rotateWordSliderLast {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
}

@-webkit-keyframes rotateWordSliderLast {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
}

@keyframes rotateWordSliderLast {
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	8% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px);}
	90% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
	100% { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
}

/* Rotating Words JS Portion END */


.responsive-filler-box { width: 100%; position: relative; display: inline-block; }
.responsive-filler-box:after { padding-top: 72.66666667%; display: block; content: ''; }

.device-wrapper { position: relative; }
.ipad-wrapper { position: absolute; top: 0; width: 100%; }
.ipad-frame {z-index: 2; width: 100%; height: 100%; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_ipad/ipad_frame.png); background-repeat: no-repeat; background-size: contain; position: absolute; top: 0; }
/*#wrapper-work-rut-ipad { height: 423px; width: 100%; left: 19px; top: 19px; position: absolute; }*/
#wrapper-work-rut-ipad { height: 91.6%; width: 88.8%; top: 4%; left: 2.9%; position: absolute; }
#wrapper-work-rut-ipad-noscript { height: 91.6%; width: 88.8%; top: 4%; left: 2.9%; position: absolute; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_ipad/screen_content.jpg); background-repeat: no-repeat; background-size: contain; }

.iphone-wrapper { position: absolute; width: 24.6%; left: 75%; /*margin-top: 25.1%;*/ bottom: 3px; }
.iphone-frame { z-index: 3; width: 100%; height: 100%; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_iphone/iphone_frame.png); background-repeat: no-repeat; background-size: contain; position: absolute; margin: 0; }
#wrapper-work-rut-iphone { height: 96%; margin: 0; position: absolute; width: 87%; left: 9%; top: 2%; }
#wrapper-work-rut-iphone-noscript { height: 96%; margin: 0; position: absolute; width: 87%; left: 9%; top: 2%; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_iphone/screen_inventory.jpg); background-repeat: no-repeat; background-size: contain; }

.ipad-frame-image { z-index: 2; width: 100%; height: auto; visibility: hidden; display: block; }
.iphone-frame-image {z-index: 3; width: 100%; display: block; visibility: hidden; }

.img-contact-ipad {z-index: 0; width: 89%; height: 92%; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_ipad/screen_contacts_lowres.jpg); background-repeat: no-repeat; background-size: contain; position: absolute; margin: 0; display: block; top:4.1%; left: 2.9%; background-color: #000000;}

.img-contact-iphone {z-index: 2; width: 87%; height: 95.5%; background-image: url(/home/features/2019/stuck-in-a-work-rut/images/feature_graphic_iphone/screen_contacts.jpg); background-repeat: no-repeat; background-size: contain; position: absolute; margin: 0; display: block; top:2%; left: 9%; background-color: #000000;}

#wrapper-work-rut-ipad.gsapSlider {	z-index: 1;}
#wrapper-work-rut-iphone.gsapSlider {	z-index: 3;}

.gsapSlider {
	overflow: hidden;
	position: relative;
}
.gsap-slides {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column-reverse;
	overflow: hidden;
	height: 100%;
}

.gsap-slides li {
	width: /*100%*/inherit;
	background-size: contain;
	background-repeat: no-repeat;
}
.gsap-nav {
	display: none;
	padding: 10px;
	position: absolute;
	bottom: 10px;
	left: 0;
	width: 100%;
}
.gsap-nav ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: flex;
	width: 100%;
	justify-content: center;
}
.gsap-nav ul li {
	background-color: green;
	width: 10px;
	height: 10px;
	border: solid 1px white;
	border-radius: 5px;
	margin: 0 5px;
	padding: 0;
}
.gsap-nav ul li.current {
	background-color: white;
}
.gsap-nav ul li:hover {
	cursor: pointer;
}


.feature-br-wip-text, .feature-br-m, .feature-br-m-lg, .feature-br-lg-m, .feature-br-lg, .feature-br-xl, .feature-br-en-lg, .feature-br-en-sm, .feature-br-br-lg, .feature-br-br-sm, .feature-br-cn-sm, .feature-br-de-sm-m, .feature-br-es-sm, .feature-br-fr-m, .feature-br-fr-m-sm, .feature-br-fr-sm, .feature-br-fr-xsm, .feature-br-it-m, .feature-br-kr-m, .feature-br-kr-sm, .feature-br-nl-m, .feature-br-nl-sm, .feature-br-se-sm, .feature-br-cz-sm, .feature-br-tr-med {display:none;}


/* Specific breaks for feature paragraph */

/*General breaks*/
@media only screen and (max-width: 480px) {
	.feature-br-wip-text {display:block;}
}

@media only screen and (min-width: 480px) and (max-width: 900px) {
	.feature-br-m {display:block;}
}

@media only screen and (min-width: 900px) and (max-width: 1068px) {
		.feature-br-m-lg {display:block;}
}

@media only screen and (min-width: 1068px) and (max-width: 1400px) {
		.feature-br-lg-m {display:block;}
}

@media only screen and (min-width: 900px) and (max-width: 1400px) {
	.feature-br-wip-text {display:block;}
		.feature-br-lg {display:block;}
}

@media only screen and (min-width: 1400px) {
	.feature-br-xl {display:block;}
}

/*EN breaks*/
@media only screen and (min-width: 408px) and (max-width: 456px) {
	.feature-br-en-sm {display:block;}
}
@media only screen and (min-width: 1023px) and (max-width: 1068px) {
	.feature-br-en-lg {display:block;}
}

/*BR breaks*/
@media only screen and (min-width: 432px) and (max-width: 540px) {
	.feature-br-br-sm {display:block;}
}
@media only screen and (min-width: 1400px) and (max-width: 1440px) {
	.feature-br-br-lg {display:block;}
}

/*CN breaks*/
@media only screen and (min-width: 432px) and (max-width: 560px) {
	.feature-br-cn-sm {display:block;}
}

/*DE breaks*/
@media only screen and (min-width: 385px) and (max-width: 564px) {
	.feature-br-de-sm-m {display:block;}
}

/*ES breaks*/
@media only screen and (min-width: 340px) and (max-width: 524px) {
	.feature-br-es-sm {display:block;}
}

/*FR breaks*/
@media only screen and (min-width: 900px) and (max-width: 960px) {
	.feature-br-fr-m {display:block;}
}

@media only screen and (min-width: 590px) and (max-width: 900px) {
	.feature-br-fr-m-sm {display:block;}
}

@media only screen and (min-width: 432px) and (max-width: 550px) {
	.feature-br-fr-sm {display:block;}
}
@media only screen and (min-width: 380px) and (max-width: 432px) {
	.feature-br-fr-xsm {display:block;}
}

/*IT breaks*/
@media only screen and (min-width: 900px) and (max-width: 910px) {
	.feature-br-it-m {display:block;}
}

@media only screen and (min-width: 432px) and (max-width: 576px) {
	.feature-br-it-sm {display:block;}
}

/*KR breaks*/
@media only screen and (min-width: 525px) and (max-width: 900px) {
	.feature-br-kr-m {display:block;}
}

@media only screen and (min-width: 340px) and (max-width: 432px) {
	.feature-br-kr-sm {display:block;}
}

/*NL breaks*/
@media only screen and (min-width: 520px) and (max-width: 680px) {
	.feature-br-nl-m {display:block;}
}

@media only screen and (min-width: 340px) and (max-width: 450px) {
	.feature-br-nl-sm {display:block;}
}

/*SE breaks*/
@media only screen and (min-width: 340px) and (max-width: 480px) {
	.feature-br-se-sm {display:block;}
}

/*CZ breaks*/
@media only screen and (min-width: 300px) and (max-width: 380px) {
.feature-br-cz-sm {display: block;}
}

/*TR breaks*/
@media only screen and (min-width: 480px) and (max-width: 570px) {
.feature-br-tr-med {display: block;}
}


/* X-X-X-LARGE SCREENS (CASCADE TO LOWER SCREEN) */
@media only screen and (min-width: 1850px) {
}

/* X-X-LARGE SCREENS (CASCADE TO LOWER SCREEN) */
@media only screen and (min-width: 1600px) and (max-width: 1849px) {
}

/* X-LARGE SCREENS (SPECIFIC) */
@media only screen and (min-width: 1400px) {
	#feature-wrapper .row { width: 124%; right: 12%; position: relative; }
	.iphone-wrapper { /*margin-top: 25.4%;*/ width: 152px; }
	#wrapper-work-rut-iphone { top: 2.2%; }
	.img-contact-iphone { top: 2.2%; }
}


@media only screen and (max-width:1400px) {
	#feature-wrapper .row { width: 100%; right: 0%; position: static; }
}
/* MEDIUM SCREENS (CASCADE TO LOWER SCREENS) */
@media only screen and (max-width: 1100px) {
	#feature-wrapper .section.venti { padding: 90px 0;}
}

/* MEDIUM-SMALL SCREENS CUSTOM (CASCADE TO LOWER SCREENS) */
@media only screen and (max-width: 900px) {
	#feature-wrapper .section.venti { padding: 70px 0;}
	#feature-wrapper .feature-med-12 {width: 100%;}
	#feature-wrapper .row {flex-direction: column;}
	#feature-wrapper .column:last-child {margin-top: 20px;}

	#feature-wrapper .row { flex-direction: column; }
	#feature-wrapper .column:last-child { margin-top:20px; }
	#feature-wrapper .column:first-child { padding-right: 0px; }
	
	/* Rotating Words */
	.rw-sentence { font-size: 18px; }
}

/* MEDIUM-SMALL SCREENS CUSTOM (SPECIFIC) */
@media only screen and (min-width: 735px) and (max-width: 900px) {
	#feature-wrapper .row.fh0 p:first-of-type {width: 85%;} 
}

/* EXTRA SMALL SCREENS < 400px */
@media only screen and (max-width: 400px) {
	#feature-wrapper .section.venti { padding: 50px 0;}
	
	/* Rotating Words */
	.rw-sentence { font-size: 9px; }
}