/* --- WORK PAGE STYLES ---*/

#work_banner {background: url("../images/work/services_top.jpg") top center repeat-x;}

#work_how {
    padding-top:5em;
    margin-top:0;
    margin-bottom: 0;
}
#work_how .button_container {
	width:100%;
	display: flex;
	justify-content: space-between;
	margin-top:3em;
}
#work_how .button_container .left_half, #work_how .button_container .right_half {
	flex-basis: 49%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1em 2em;
	box-sizing: border-box;
	min-height: 500px;
	text-align: left;
	position: relative;
	box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	overflow: hidden;
}
#work_how .button_container .text {
	width:21em;
	display: flex;
	justify-content: center;
	flex-direction: column;
	position: relative;
	z-index: 1;
	pointer-events: none;
}
#work_how .button_container .text p {
	opacity: 0;
	height: 0;
	transition: opacity 250ms ease-in-out;
}
#work_how .clicked .text p {
	opacity: 1;
	height: auto;
}
#work_how .clicked .text h2 {
	text-shadow: 0px 2px 35px rgba(0, 0, 0, 0.46); 
}
#work_how .button_container .bg {
	position: absolute;
	top:0;
	left: 0;
	width:100%;
	height: 100%;
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform .5s ease-in-out;
}
#work_how .button_container .left_half .bg {
	background-image: url(../images/work/Button_Content.jpg);
}
#work_how .button_container .right_half .bg {
	background-image: url(../images/work/Button_Platform.jpg);
}
#work_how .button_container .bg:hover {
	transform: scale(1.2);
}
#work_how .button_container .left_half .bg::after, #work_how .button_container .right_half .bg::after {
	content: "";
	position: absolute;
	top:0;
	left: 0;
	width:100%;
	height: 100%;
	background:rgba(1,81,117,.75); 
	opacity: 0;
	transition: opacity 250ms ease-in-out;
	pointer-events: none;
}
#work_how .button_container .clicked .bg::after {
	opacity: 1;
}


#work_features {
    margin-top:-7em;
    margin-bottom: 0;
	display: flex;
	justify-content: center;
	background: linear-gradient(to bottom, rgba(253,248,236,1) 0%, rgba(253,248,236,0) 100%);
}
#work_features .inner_container {
    width: 100%;
    padding: 10em 0 0 0;
	box-sizing: border-box;
}
#work_features .left_half {
    flex-basis: 56%;
    display: flex;
	align-items: center;
	margin-bottom: -3em;
}
#work_features .right_half {
    flex-basis: 44%;
    display: flex;
    justify-content: flex-start;
	align-items: center;
	box-sizing: border-box;
}
#work_features .right_half .inner {
    width: 27em;
	text-align: left;
}

#work_features .content, #work_features .platform {
	padding: 3em 0;
	position: relative;
	z-index: 0;
	display: none;
}
#work_features .content {
	padding-bottom: 0;
}
#work_features .clicked {
	xdisplay: block;
	z-index: 2;
}

#work_features .content .content_inner {
	display: flex;
	width:100%;
}
#work_features .platform .platform_inner {
	display: inline-block;
	max-width: 1200px;
}
.featurelist_legend { display: flex; width: 100%; }
.featurelist_legend p {margin: .7em 1.5em .7em .7em;}
.featurelist_legend div:nth-child(4) > p {margin-right:0;}

.feature_rows_legend {
    flex-direction: row;
    display: flex;
    width: 100%;
    white-space: nowrap;
    align-items: center;
	justify-content: center;
}

.featurelist { 
	display: flex;
	width: 100%;
	padding: 1em 1em 3em .5em;
	justify-content: center;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.featurelist > div:nth-child(2n) {
	justify-content: flex-end;
}

.feature_row_container { display: inline-flex; flex-basis: 50%; align-items: center; text-align: left;}

.feature_row_title {width:12em; text-align: right; }
.feature_row_title p {font-size: 1em; color: #5d5d5d; margin-bottom: .7em; margin-top: .7em; line-height: 1.3em;}

.feature_row { white-space: nowrap; flex-direction:row;}
.feature_bar {width: 2em; height: 1.25em; display: inline-block;}	
.feature_column_bars {text-align: left; padding-left: 1.5em; xwhite-space: nowrap}

.feature_rows_legend .feature_bar {height:1em;}

#work_process {
}
#work_process .content, #work_process .platform {
	padding: 0 0 3em;
	position: relative;
	z-index: 0;
	display: none;
}

.diagrama {
    width: 87%;
    padding: 2em 0 0 0;
	max-width: 900px;
	margin: auto;
}

.diagramb {
    width: 87%;
    padding: 2em 0 0 0;
	max-width: 810px;
	margin: auto;
}

.row_diagrama, .row_diagrama_alt, .row_diagramb, .row_diagramb_alt {
    max-width: 1200px;
    flex-direction: row;
    justify-content: space-between;
    display: inline-flex;
    width: 100%;
    margin: 0em;
}
.column_diagram {
    max-width: 1200px;
    flex-direction: column;
    justify-content: center;
    display: inline-flex;
    width: 70%;
    margin: 0em;
	margin: 0 0 -3em 0.75em;
}

.column_diagram_text {
	flex-direction: column;
    width: 85%;
    display: inline-flex;
	justify-content: center;
}

.column_diagram_icon {
	flex-direction: column;
    width: 16.6%;
    display: inline-flex;
	justify-content: center;
}
.column_diagram_icon img {width: 100%; height: auto;}

.diagram_margin_right {margin-right: 3.4%; text-align: right;}
.diagram_margin_right p {margin: 0 0 0 4em;}
.diagram_margin_right h4 {margin: 0 0 .2em 2em;}

.diagram_margin_left {margin-left: 3.4%; text-align: left;}
.diagram_margin_left p {margin: 0 4em 0 0;}
.diagram_margin_left h4 {margin: 0 2em .2em 0;}

.column_diagram h4 {margin: 0 0em .2em 0;}	

.diagram_bars  {opacity: .6; width: 86%; height: auto; margin:auto;}

#content_bar_2 {margin-top: -1em;}

#platform_icon_1 {width: 17em; height: auto; margin-right: -4em;}
#platform_icon_2 {width: 15em; height: auto; margin-left: -2em;}
#platform_icon_3 {width: 13em; height: auto; margin-right: .3em; margin-bottom: .4em;}
#platform_icon_4 {width: 15em; height: auto; margin-left: -2em;}
#platform_icon_5 {width: 15em; height: auto; margin-right: -1.1em; margin-top: -.4em;}
#platform_icon_6 {width: 13.5em; height: auto; margin-left: -1em;}
#platform_icon_9 {width: 11em; height: auto; margin-right: .2em; margin-bottom: .2em;}
#platform_icon_7 {width: 15em; height: auto; margin-left: -1.1em; margin-top: -.4em;}
#platform_icon_8 {width: 13em; height: auto; margin-right:  -1.1em;}


#content_icon_1 {width: 12em; height: auto; margin-right: .8em; padding-bottom: .3em;}
#content_icon_2 {width: 15em; height: auto; margin-left: -1.1em; margin-top: -.4em;}
#content_icon_3 {width: 13em; height: auto; margin-right: -1.1em; margin-bottom: .4em;}
#content_icon_4 {width: 16em; height: auto; margin-left: -2em;}
#content_icon_5 {width: 14em; height: auto; margin-right: -1.1em; margin-top: -.4em;}
#content_icon_6 {width: 12em; height: auto; margin-left: .5em;}
#content_icon_7 {width: 15em; height: auto; margin-right: -1.1em; margin-top: -.4em;}


.diagram_desktop_icon {display: block;}
.diagram_mobile_icon {display: none;}


#work_impact {
    margin: 0;
    margin-bottom: 0;
}
#work_impact .mt_container {
    display: flex;
	text-align: center;
}
#work_impact .row {
	margin-top:3em;
}
#work_impact .row_third {
	position: relative;
	flex-basis: 32%;
	justify-content: flex-start;
	text-align: left;
	background-color: #dc6500;
	padding: 1em 2em;
	box-sizing: border-box;
	min-height: 13em;
}
#work_impact .row_third::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../images/culture/texture.png");
    background-size: 150%;
    background-position: 50% 50%;
    opacity: .75;
}
#work_impact .content, #work_impact .platform {
	padding: 3em 0;
	position: relative;
	display: none;
	z-index: 0;
}
#work_impact .clicked {
	xdisplay: block;
	z-index: 1;
}

#work_case_studies {
    xpadding: 3em 0;
    margin: 0;
    margin-bottom: 0;
}
#work_case_studies .inner_container {
	display: flex;
	justify-content: center;
	width: 100%;
}
#work_case_studies .content, #work_case_studies .platform {
	position: relative;
	width:100%;
	padding: 3em 0;
}
#work_case_studies .top_text {
	max-width: 1200px;
	text-align: center;
	margin: 0 auto 2em auto;
}
#work_case_studies .carousel {
	width:100%;
	height: auto;
	overflow: hidden;
}
#work_case_studies .carousel .box_slider {
	position: relative;
	width: auto;
	xheight: 37em;
}
#work_case_studies .carousel .box {
	xposition: relative;
	xleft:-15em;
	width: 35em;
	height: 37em;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding: 1em 2em 3em 2em;
	box-sizing: border-box;
	margin-right: .5em;
	cursor: pointer;
} 
.slick-list {
	padding: 0 18% !important;
}

#work_case_studies .platform .b1 {
	background: url(../images/work/Platform_Seagate.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .platform .b2 {
	background: url(../images/work/Platform_IREP.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .platform .b3 {
	background: url(../images/work/Platform_Arena.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .platform .b4 {
	background: url(../images/work/Platform_Soccer.jpg) 50% 50% / cover no-repeat;
}

#work_case_studies .content .b1 {
	background: url(../images/work/Content_Datasphere_City.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .content .b2 {
	background: url(../images/work/Content_LaCie_Family.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .content .b3 {
	background: url(../images/work/Content_Operation.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .content .b4 {
	background: url(../images/work/Content_NUC.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .content .b5 {
	background: url(../images/work/Content_Build_Rig.jpg) 50% 50% / cover no-repeat;
}
#work_case_studies .content .b6 {
	background: url(../images/work/Content_SchedulingConflictsHS.jpg) 50% 100% / cover no-repeat;
}

#work_case_studies .carousel_dots {
	margin-top: 2em;
	display: none;
	justify-content: center;
	flex-direction: row;
}
#work_case_studies .carousel_dots .dot {
	display:inline-block;
	width:.75em;
	height:.75em;
	border-radius:50%;
	background-color:#5d5d5d;
	margin-right:.5em;
	cursor: pointer;
}
#work_case_studies .carousel_dots .dot.selected {background-color:#de6600;}

#work_services {
    padding: 3em 0 0;
    margin: 0;
    margin-bottom: 0;
}
#work_services .content {
	width:100%;
}
#work_services .top_text {
	max-width: 1200px;
	text-align: center;
	margin: 0 auto 2em auto;
}
#work_services .services_container {
	display: flex;
	width:100%;
	height: 650px;
}
#work_services .services_container .service {
	cursor: pointer;
	flex-basis: 25%;
	flex-shrink: 1;
	position: relative;
	overflow: hidden;
	transition: flex-basis 500ms ease-in-out;
}
#work_services .services_container .service::before {
	content: "";
	position: absolute;
	top:0;
	right: 0;
	width:2em;
	height: 100%;
	background: linear-gradient(to left, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
	opacity: .17;
}
#work_services .services_container .service > .inner {
	position: relative;
	padding-top:2em;
	padding-left: 2em;
	padding-bottom: 2em;
	padding-right: 2em;
	overflow: hidden;
	max-width: 50em;
	transition: padding-top 250ms ease-in-out;
}
#work_services .services_container .clicked > .inner {
	padding-top:4em;
}
#work_services .services_container .service .flex_container {
	margin-top:2em;
	opacity: 0;
	width: 100%;
	padding-right: 5em;
	box-sizing: border-box;
	transition: opacity 500ms ease-in-out;
}
#work_services .services_container .account {
	background: url("../images/work/Account-LG.jpg") 50% 50% / cover no-repeat;
}
#work_services .services_container .creative {
	background: url(../images/work/Creative-LG.jpg) 50% 50% / cover no-repeat;
}
#work_services .services_container .content {
	background: url("../images/work/Content-LG.jpg") 50% 50% / cover no-repeat;
}
#work_services .services_container .solutions {
	background: url("../images/work/Development-LG.jpg") 50% 50% / cover no-repeat;
}
#work_services .services_container .service .row_1 {
	display: flex;
	flex-direction: row;
	justify-content: center;
	margin-bottom: 1em;
}
#work_services span {
	display: block;
}
#work_services .clicked span {
	display: inline-block;
}
#work_services .services_container .service .row_1 .img {
	margin-right: 3em;
	max-width:12%;
	flex-shrink: 0;
	flex-grow: 0;
}
#work_services .services_container .clicked {
	flex-basis: 70%;
}
#work_services .services_container .clicked .flex_container {
	opacity: 1;
}

#work_clients {
	padding: 3em 0 2em 0;
	display: flex;
    justify-content: center;
	text-align: center;
	flex-wrap: wrap;
}
#work_clients .text_container {
	max-width: 1200px;
}

.client_row {
	padding-top: 1em;
    xdisplay: flex;
    xflex-direction: row;
    xjustify-content: space-around;
    width: 100%;
    margin: 1em auto;
    xflex-wrap: wrap;
    xalign-items: center;
	overflow: hidden;
}
.client_row .slick-slider .slick-track, .client_row .slick-slider .slick-list {
	display: flex;
	align-items: center;
}

.client_row img {
	width:17em;
	height: auto;
	padding:.5em 1em;
	margin: 0 2em;
	box-sizing: border-box;
}


@media only screen and (max-width: 1400px) {
	
	#work_features .left_half {
		margin-bottom: 0;
	}
	
}

@media only screen and (max-width: 1200px) {
	
	#work_clients {padding: 2.5em 0 1em 0;}	
	#work_clients p {margin: 0px 9em;}	
	
	x.client_row {width: 65%;}

	x.client_row img {width:38%;}
	
}

@media only screen and (max-width: 1100px) {
	
	x.client_row {width: 75%;}
	
}

@media only screen and (max-width: 1024px) {
	
	#work_how .button_container {
		flex-wrap: wrap;
		justify-content: center;
	}
	#work_how .button_container .left_half, #work_how .button_container .right_half {
		flex-basis: 100%;
		max-width: 600px;
		min-height: 450px;
	}
	#work_how .button_container .left_half {
		margin-bottom: 2em;
	}
	#work_how .button_container .text {
		width:100%;
	}
	
	#work_case_studies .carousel .box {
		margin-right:0;
		width:100vw;
	}
	
	#work_features .content {
		padding-bottom: 3em;
	}
	#work_features .content .content_inner {
		flex-wrap: wrap;
	}
	#work_features .left_half, #work_features .right_half {
		flex-basis: 100%;
	}
	#work_features .right_half {
		justify-content: center;
	}
	#work_features .right_half .inner {
		width:100%;
		padding: 0 20px;
	}
	
	#work_case_studies .top_text {
		padding: 0 20px;
	}
	
	#work_services .services_container {
		flex-direction: column;
		height: auto !important;
		pointer-events: none;
	}
	#work_services .services_container .service {
		flex-basis: 100%;
	}
	#work_services .services_container .service > .inner {
		max-width: 100%;
	}
	#work_services .services_container .service .flex_container {
		width:100% !important;
		padding-right:0;
	}
	.slick-list {
		padding: 0 0 !important;
	}
	#work_services .services_container .clicked {
		xflex-basis: 550px;
	}
	#work_services .services_container .service .flex_container {
		opacity: 1;
	}
	#work_services .services_container .service::before {
		top:auto;
		right: auto;
		bottom:0;
		left: 0;
		width:100%;
		height: 2em;
		background: linear-gradient(to top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
	}
	#work_services span {
		display: inline-block;
	}
	
	#work_clients .text_container {
		padding: 0 20px;
	}
	x.client_row {
		width:100%;
	}
	x.client_row img {
		max-width: 20%;
	}
	
}

@media only screen and (max-width: 900px) {
	
	x.client_row img {width: 35%;}	
	#work_clients p {margin: 0px 4em;}
	
}

@media only screen and (max-width: 800px) {
	
	x.client_row {width: 85%;}
	
	x.client_row {
		flex-direction: initial;
	}
	x.client_row img {
		max-width: 50%;
	}
	
}

@media only screen and (max-width: 750px) {
	
	#work_services .services_container .service .row_1 .img {
		margin-right:2em;
		max-width: 15%;
	}
	
	x.client_row img {width: 40%; padding: .2em 1em;}
	
}

@media only screen and (max-width: 630px) {
	
	/*.client_row img {width: 55%; padding: .2em 1em;}*/	
	
	x.client_row {width: 100%;}
	
}

@media only screen and (max-width: 600px) {
	
	#work_services .top_text {
		padding: 0 20px;
	}
	
	.feature_row_container {
		flex-wrap: wrap;
		flex-basis: 100%;
		flex-direction: column;
	}
	.feature_row_title {
		width:auto;
	}
	.feature_column_bars {
		padding-left: 20px;
		padding-right: 20px;
	}

}

@media only screen and (max-width: 550px) {
	
	#work_clients p {margin: 0px 2em;}
	
	.featurelist_legend p {
		font-size: 1em;
		margin: .7em 1.5em .7em .4em;
	}
	
	x.client_row img {width: 75%; padding: .2em 1em;}
    
    .diagram_margin_left p, .diagram_margin_right p {
        margin: 0;
    }

}

@media only screen and (max-width: 450px) {
	
	#work_how, #work_case_studies .content, #work_case_studies .platform, #work_services, #work_clients {
		padding:0;
		padding-top:1em;
	}
	#work_features {
		margin-top:-10em;
	}
	
	.feature_bar {
		width:1.5em;
	}
	
	.client_row img {
		width:12em;
        margin: 0 0.5em;
	}

}

@media only screen and (max-width: 350px) {
	
	x.client_row img {
		max-width: 75%;
		margin-bottom: 10px;
	}
	
}

@media only screen and (max-width: 320px) {

	x.client_row img {width: 100%;}
	#work_clients p {margin: 0px 1em;}
	
}





#learnstlouis2022_banner {background: url("../images/work/learnstouis2022_top.jpg") top center repeat-x;}

#bugme {
    width: 100%;
    position: absolute;
    top: 50px;
    background: rgb(54 54 54 / 80%);
    text-align: center;
    padding: 15px;
    display: flex;
    justify-content: center;
    opacity: 0;
}

#bugme .bm_row {
    max-width: 1200px;
    flex-direction: row;
    justify-content: space-between;
    display: inline-flex;
    width: 100%;
}

#bugme .gutter {
    width: 25px;
    flex-shrink: 0;
    text-align: right;
}
#bugme p {
    padding: 0;
    margin: 0;
}
#bugme a {
    color: #fff;
    text-decoration: underline;
}
#bugme a:hover {
    color: #ff8000;
}
#bugme_X {
    align-self: flex-end;
    cursor: pointer;
}





.section2 {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3.75em 0;
	box-sizing: border-box;
}
.container2 {
	display: flex;
	align-items: center;
	justify-content: center;
}
.btn-cta {margin-top: 2.2em;}
.full_width {width: 100%;}

/*  CONNTACT OUR SALES TEAM  */
#connect_sales {}
#connect_sales .row {align-items: center;}
#connect_sales .row .left_half {width: 37%;}
#connect_sales .row .left_half h2 {padding-right: 12%;}
#connect_sales .row .right_half {width: 57%;}
#connect_sales .row .right_half iframe {width: 100%;}


/*  SET UP A MEETING  */
#connect_meet {}
#connect_meet .row {margin-top: 3em;}
#connect_meet .row_third {
    flex-basis: 32.5%;
    align-items: flex-start;
    justify-content: flex-start;
    background-color: #dc6500;
    padding: 2.5em 2.25em;
    box-sizing: border-box;
    min-height: 12.9375em;
    height: auto;
    position: relative;
}
#connect_meet .row_third .inner {position: relative;}
#connect_meet .row_third::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/culture/texture.png);
    background-size: 150%;
    background-position: 50% 50%;
    opacity: .75;
}
.sale_connect p {font-family: 'Roboto Condensed', sans-serif;}
.sales_icon {
	width: 67px;
	height: 58px;
	position: relative;
	margin-bottom: 1em;
}

@keyframes hvr-pop {
  50% {transform: scale(1.15);}
}
#sales_email_button .sales_icon {transform: perspective(1px) translateZ(0);}
#sales_email_button:hover .sales_icon {
  animation-name: hvr-pop;
  animation-duration: 0.4s;
  animation-timing-function: linear;
  animation-iteration-count: 1;
}

@keyframes hvr-buzz-out {
  10% {transform: translateX(3px) rotate(2deg);}
  20% {transform: translateX(-3px) rotate(-2deg);}
  30% {transform: translateX(3px) rotate(2deg);}
  40% {transform: translateX(-3px) rotate(-2deg);}
  50% {transform: translateX(2px) rotate(1deg);}
  60% {transform: translateX(-2px) rotate(-1deg);}
  70% {transform: translateX(2px) rotate(1deg);}
  80% {transform: translateX(-2px) rotate(-1deg);}
  90% {transform: translateX(1px) rotate(0);}
  100% {transform: translateX(-1px) rotate(0);}
}
#sales_phone_button .sales_icon {transform: perspective(1px) translateZ(0);}
#sales_phone_button:hover .sales_icon {
  animation-name: hvr-buzz-out;
  animation-duration: 0.75s;
  animation-timing-function: linear;
  animation-iteration-count: 1;
}

@keyframes hvr-wobble-bottom {
  16.65% {transform: skew(-12deg);}
  33.3% {transform: skew(10deg);}
  49.95% {transform: skew(-6deg);}
  66.6% {transform: skew(4deg);}
  83.25% {transform: skew(-2deg);}
  100% {transform: skew(0);}
}
#sales_meeting_button .sales_icon {
	transform: perspective(1px) translateZ(0);
	transform-origin: 100% 0;
}
#sales_meeting_button:hover .sales_icon {
	animation-name: hvr-wobble-bottom;
	animation-duration: 1s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
}


/* --------  MEDIA QUERIES  -------- */
@media only screen and (max-width: 1250px) {
	#connect_sales .row, #connect_meet .row {
		box-sizing: border-box;
		padding: 0;
	}
}


@media only screen and (max-width: 1200px) {
	#connect_together .inner_container {width: 80%;}
	#connect_sales {text-align: center;}
	#connect_sales .row {
		flex-wrap: wrap;
		justify-content: center;
	}
	#connect_sales .row .left_half {width: 80%;}
	#connect_sales .row .left_half h2 {padding-right: 0%;}
	#connect_sales .row .right_half {
		width: 65%;
		margin-top: 3em;
	}
}


@media only screen and (max-width: 1024px) {
	#connect_together, #connect_join, #connect_inquiry, #connect_meet .row_third {min-height: unset;}
	#connect_sales .row .right_half {width: 80%;}
	.column_withus_third {width: 22%;}
    .slick-list {padding: 0!important;}
}


@media only screen and (max-width: 900px) {
	h2 {margin: 0;}
}


@media only screen and (max-width: 798px) {
	.btn-cta {margin-top: 26px;}
	.section2 {padding: 40px 0;}
	#connect_together .inner_container, #connect_sales .row .left_half {width: 100%;}
	#connect_sales.section2 {padding-bottom: 0;}
	#connect_sales .row .right_half {
		width: 100%;
		margin-top: 30px;
	}
	#connect_meet .row {margin-top: 30px;}
	#connect_meet .row_third {padding: 30px 20px;}
    #events_banner.section {padding: 40px 0;}
    #events_banner .inner_container {width: 100%;}
    #events_carousel {margin-top: 0;}
    #events_carousel .carousel .box {
		margin-right: 0;
		width: 100vw;
        height: 75vw;
        padding: 40px 20px;
	}
    #events_carousel .b2 {
        background: 
            linear-gradient(0deg, rgba(0,0,0,0) 60%, rgba(0,0,0,0.66) 100%), 
            url(../images/connect/ADT.jpg) 50% 75% / cover no-repeat;
    }
    #events_carousel .b4 {
        background: 
            linear-gradient(0deg, rgba(0,0,0,0) 60%, rgba(0,0,0,0.66) 100%), 
            url(../images/connect/Archive.jpg) 50% 75% / cover no-repeat;
    }
}


@media only screen and (max-width: 750px) {
	#connect_sales .row {
		flex-direction: row;
		align-items: inherit;
	}
	#connect_meet .row_third {
		width: 65%;
    	align-items: center;
		padding: 20px;
	}
	#connect_meet .row_third .inner {
		display: flex;
		align-items: center;
	}
	.sales_icon {
		margin-bottom: 0;
		margin-right: 1em;
	}
	#connect_join .row_withus {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	#connect_join .column_withus_third {
		width: 100%;
		margin-right: 0%;
		text-align: center;
		border-right: none;
		padding-right: 0%;
	}
	#connect_join .column_withus_twothird {
		width: 100%;
		text-align: center;
		margin-top: 1em;
	}
}


@media only screen and (max-width: 600px) {
	.section2 {padding: 30px 0;}
	#connect_meet .row_third {
		width: 90%;
		padding: 14px;
	}
	.sales_icon {
		width: 57px;
		height: 48px;
	}
    #events_banner.section {padding: 30px 0;}
    #events_carousel .carousel .box {
        height: 25em;
        padding: 30px 20px;
    }
    .slick-dots {margin-top: 1.25em!important;}
}


.section3 {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3.75em 0;
	box-sizing: border-box;
}

/*  TOP BANNER  */
#ots_banner {
	background: url(../images/ots/Top-Band.jpg) center center no-repeat;
}
#ots_banner .c-white {
	text-shadow: 0px 20px 70px #000;
}
#ots_mean {
	padding-bottom: 6em;
}

/*  TRAINING LIBRARY  */
#ots_description {
	margin-top:0;
	margin-bottom: 0;
	padding-top: 0;
	background: linear-gradient(to bottom, rgba(253,248,236,1) 0%, rgba(253,248,236,0) 100%);
}
#ots_description .row {margin-top: -2em;}
#ots_description .row_third {
    flex-basis: 32.5%;
    align-items: flex-start;
    justify-content: flex-start;
    background-color: #dc6500;
    padding: 2.5em 2.25em;
    box-sizing: border-box;
    min-height: 12.9375em;
    height: auto;
    position: relative;
}
#ots_description .row_third .inner {position: relative;}
#ots_description .row_third::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/culture/texture.png);
    background-size: 150%;
    background-position: 50% 50%;
    opacity: .75;
}
#ots_description h3 {
	margin-top:0;
	margin-bottom: 0;
}
#ots_description li {
	margin:0;
	line-height: 135%;
}

/*  QUIZ QUEST  */
#ots_quiz {
	background: linear-gradient(to top, rgba(253,248,236,1) 0%, rgba(253,248,236,0) 100%);
	padding-bottom: 3.75em;
}
#ots_quiz li {
	margin:0;
	line-height: 135%;
}


/*  SALES SKILLS  */
.ots_main_volume {
	flex-wrap: wrap;
	padding-bottom: 0;
}
.ots_main_volume .container {
	max-width:1500px;
	position: relative;
}
.half_container {
	display: flex;
	width:100%;
	justify-content: space-around;
}
.half_container .left_half, .half_container .right_half {
	flex-basis: 48%;
	display: flex;
	align-items: center;
}
.half_container .left_half .inner, .half_container .right_half .inner {
	position: relative;
}
.half_container img {
	display: block;
}
.half_container .video {
	position: absolute;
	top: 5.7%;
	left: 12%;
	width: 76.4%;
	height: auto;
}

/* --------  MEDIA QUERIES  -------- */
@media only screen and (max-width: 1250px) {
	#ots_contact .row, #ots_contact .row {
		box-sizing: border-box;
		padding: 0;
	}
}


@media only screen and (max-width: 1200px) {
	#ots_mean .inner_container {width: 100%;}
	#ots_contact .row {
		flex-wrap: wrap;
		justify-content: center;
	}
	#ots_contact .row .left_half {width: 80%;}
	#ots_contact .row .left_half h2 {padding-right: 0%;}
	#ots_contact .row .right_half {
		width: 65%;
		margin-top: 3em;
	}
}


@media only screen and (max-width: 1024px) {
	#ots_mean {min-height: unset;}
	#ots_contact .row .right_half {width: 80%;}
	
	.half_container {
		flex-wrap: wrap;
	}
	.half_container .left_half, .half_container .right_half {
		flex-basis:100%;
	}
	.half_container .left_half {
		margin-bottom: 2em;
	}
	.half_container .video_wrapper {
		max-width:450px;
		margin: 0 auto;
	}
}


@media only screen and (max-width: 900px) {
	h2 {margin: 0;}
}


@media only screen and (max-width: 798px) {
	.btn-cta {margin-top: 26px;}
	.section3 {padding: 40px 0;}
	#ots_mean .inner_container, #ots_contact .row .left_half {width: 100%;}
	#ots_contact.section {padding-bottom: 0;}
	#ots_contact .row .right_half {
		width: 100%;
		margin-top: 30px;
	}
}


@media only screen and (max-width: 750px) {
	#ots_contact .row {
		flex-direction: row;
		align-items: inherit;
	}
}


@media only screen and (max-width: 600px) {
	.section3 {padding: 30px 0;}
}

@media only screen and (max-width: 450px) {
	
	#ots_download .close_button:before {
		font-size:26px;
	}
	#ots_download h3 {
		padding: 0 28px;
	}
	
}
