/* MODAL SOCIAL LINKS */

	.modalsoclinks {
		position: absolute;
		display: block;
		top: 27px;
		right: calc(2vw + 34px);
		width: 140px;
		height: 25px;
		z-index: 999;
		}
		
	.modalsoclinks_1col {
		display: none;
		}
		
		
		@media only screen and (min-width: 1366px) and (max-width: 1500px) and (min-height: 721px) {
			.modalsoclinks {
				top: 29px;
				width: 130px;
				height: 22px;
				}
			.mainfb, .maintwtr, .mainmail, .maininst {
				background-size: 22px 22px;
				width: 22px;
				height: 22px;
				}
			}
		@media only screen and (max-width: 1365px) and (min-height: 721px) {
			.modalsoclinks {
				top: 29px;
				width: 120px;
				height: 20px;
				}
			.mainfb, .maintwtr, .mainmail, .maininst {
				background-size: 20px 20px;
				width: 20px;
				height: 20px;
				}
			}
		@media only screen and (min-width: 1501px) and (max-height: 720px) {
			.modalsoclinks {
				top: 17px;
				width: 140px;
				height: 25px;
				}
			.mainfb, .maintwtr, .mainmail, .maininst {
				background-size: 25px 25px;
				width: 25px;
				height: 25px;
				}
			}
		@media only screen and (min-width: 1366px) and (max-width: 1500px) and (max-height: 720px) {
			.modalsoclinks {
				top: 18px;
				width: 130px;
				height: 22px;
				}
			.mainfb, .maintwtr, .mainmail, .maininst {
				background-size: 22px 22px;
				width: 22px;
				height: 22px;
				}
			}
		@media only screen and (max-width: 1365px) and (max-height: 720px) {
			.modalsoclinks {
				top: 20px;
				width: 120px;
				height: 20px;
				}
			.mainfb, .maintwtr, .mainmail, .maininst {
				background-size: 20px 20px;
				width: 20px;
				height: 20px;
				}
			}
	
	.soclinkwrappermodal {
		position: relative;
		width: 100%;
		height: 100%;
		display: block;
		left: 0px;
		bottom: 0px;
		}
				
/* MODALS */

		.fullview {
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100vw;
		height: 100vh;
		max-height: 100vh;
		background-color: #fff;
		}
		
		.timelineheadermodal {
		position: relative;
		display: block;
		width: 100%;
		height: 78px;
		min-height: 78px;
		margin: 0 auto;
		background-color: #fff;
		z-index: 0;
		}
		
		@media only screen and (max-height: 740px) {
			.timelineheadermodal {
				height: 58px; 
				min-height: 58px;
			}
		}
		
		.logo_overlay_modal {
		background-image: url('../images/jfoxlogo_95876d.png');
		background-size: 120px 21px;
		background-position: center;
		background-repeat: no-repeat;
		position: absolute;
		top: 18px;
		left: 2%;
		top: 50%;
		margin-top: -24px;
		width: 120px;
		height: 51px;
		}
		
		.secondrulewrapper_modal {
	
		position: relative;
		top: 0px;
		left: 0;
		background-color:none;
		width: 100%;
		height:1.5vw;
		z-index: 0;
		}
	
		.secondruleleft_modal {
	
		position: absolute;
		left: 2%;
		background-color:#95876d;
		width: 44.25%;
		height:100%;
		}
		
		.secondruleleft_extend {
	
		position: absolute;
		left: 2%;
		background-color:#f5f4f3;
		width: 96%;
		height:100%;
		z-index: -1;
		}

		.secondruleright_modal {
	
		position: absolute;
		right: 2%;
		background-color:#cd1811;
		width: 44.25%;
		height:100%;
		}
		
		.header {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100vw;
		height: 100%;
		background-color: fff;
		}
		
		.headerscroll {
		display: none;
		}
		
		.closex {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 50px !important;
		letter-spacing: 1px;
		line-height: 50px;
		color: #000;
		position: absolute;
		top: 50%;
		margin-top: -22px;
		right: 2vw;
		background-color: #ffffff !important;
		z-index: 9999;
		}
		
		.modalcontent {
		position: relative;
		display: block;
		width: 100%;
		height: calc(100% - (1.5vw + 78px));
		height: -o-calc(100% - (1.5vw + 78px)); /* opera */
		height: -webkit-calc(100% - (1.5vw + 78px)); /* google, safari */
		height: -moz-calc(100% - (1.5vw + 78px)); /* firefox */
		height: expression(100% - (1.5vw + 78px)); /* explorer */
    	z-index: 0;
		}
		
		@media only screen and (max-height: 740px) {
			.modalcontent {
				height: calc(100% - (1.5vw + 58px));
				height: -o-calc(100% - (1.5vw + 58px)); /* opera */
				height: -webkit-calc(100% - (1.5vw + 58px)); /* google, safari */
				height: -moz-calc(100% - (1.5vw + 58px)); /* firefox */
				height: expression(100% - (1.5vw + 58px)); /* explorer */
			}
		}
		
		.modalcategories {
		position: relative;
		left: 2vw;
		width: 96%;
		height: 5%;
		z-index: 900;
		}
		
		.modalcategory1, .modalcategory3, .modalcategory1_r, .modalcategory3_r, .modalcategoryinline {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 4px;
		line-height: .8;
		color: #000;
		}
		
		.modalcategory1 {
		position: absolute;
		top: 50%;
		margin-top: -6px;
		left: 0%;
		width: 40%;
		border: 3px solid #fff;
		}
		
		.modalcategory3 {
		position: absolute;
		top: 50%;
		margin-top: -6px;
		left: 74.8%;
		width: 30%;
		border: 3px solid #fff;
		}
		
		.modalcategory1_r {
		position: absolute;
		top: 50%;
		margin-top: -6px;
		left: 0%;
		width: 30%;
		padding-left: 4px;
		border: 3px solid #fff;
		}
		
		.modalcategory3_r {
		position: absolute;
		top: 50%;
		margin-top: -6px;
		left: 56.5%;
		width: 30%;
		border: 3px solid #fff;
		}
		
		.modalcategory1scroll {
		display: none;
		}
		
		.modalcategory3scroll {
		display: none;
		}
		
		.uppercontent {
		position: relative;
		top: 0%;
		display: block;
		width: 96vw;
		height: 55%;
		margin: 0 auto;
		background-color: #fff;
    	z-index: 10;
		}
		
		.uppercontent:before {
		content: ' ';
		position: absolute;
		bottom: 0%;
		left: 0%;
		width: 100%;
		height: 1.5vw;
		background-color: #000;
		z-index: 99;
		} 
		
		.modalcolumn1 {
		position: relative;
		display: block;
		left: 0;
		height: 100%;
		width: 46.1%;
		float: left;
		}
		
		.modalcolumn2 {
		position: absolute;
		display: block;
		left: 44.7%;
		top: 0%;
		height: 100%;
		width: 27.25%;
		margin-left: 1.5vw;
		}
		
		.modalcol2spacer {
		position: relative;
		display: block;
		top: 0%;
		height: 5%;
		width: 100%;
		}
		
		.modalcolumn2scroll {
		display: none;
		}
		
		.modalcolumn3 {
		position: relative;
		display: block;
		left: 0;
		height: 100%;
		width: 25.5%;
		float: right;
		padding-bottom: 3%;
		}
		
		.modalcolumn1_r {
		position: relative;
		display: block;
		right: 0;
		height: 100%;
		width: 46.1%;
		float: right;
		}
		
		.modalcolumn2_r {
		position: absolute;
		display: block;
		left: 25.5%;
		top: 0%;
		height: 100%;
		width: 25.5%;
		margin-left: 1.5vw;
		}
		
		.modalcolumn3_r {
		position: relative;
		display: block;
		left: 0;
		height: 100%;
		width: 25.5%;
		float: left;
		padding-bottom: 3%;
		}
		
		.modalcolumn2:after {
			content: "";
			display: table;
			clear: both;
		}
		
		.modalcolumn2_r:after {
			content: "";
			display: table;
			clear: both;
		}
		
		.modalheadline, .modalheadlineright {
		font-family: "knockout_welterweight", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 110px !important;
		letter-spacing: 1px;
		line-height: .8;
		color: #000;
		position: relative;
		top: 0%;
		left: 0%;
		width: 100%;
		overflow: visible;
		}
		
		span.modalheadline-2nd {
		font-family: "knockout_welterweight", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 85px !important;
		letter-spacing: 1px;
		line-height: .8;
		color: #000;
		display: inline-block;
		}
		
		.modalheadline {
		padding: 15px 15px 0px 0px;
		border-right: 1.5vw solid #000;
		}
		
		
		.modalheadlineright {
		padding: 15px 0px 0px 15px;
		border-left: 1.5vw solid #000;
		}
	
		
		@media only screen and (min-width: 1024px) and (max-width: 1300px) {
			.modalheadline, .modalheadlineright {
				font-size: 70px !important;
			}
		}
		
		@media only screen and (min-width: 1300px) and (max-width: 1500px) {
			.modalheadline, .modalheadlineright {
				font-size: 90px !important;
			}
		}
		
		@media only screen and (min-width: 1024px) and (max-width: 1300px) {
			span.modalheadline-2nd {
				font-size: 40px !important;
			}
		}
		
		@media only screen and (min-width: 1300px) and (max-width: 1500px) {
			span.modalheadline-2nd {
				font-size: 60px !important;
			}
		}
		
		.modalheadline:before {
	
		content: ' ';
		position: absolute;
		display: block;
		background-color: #fff;
		width: 1.6vw;
		height: 3.2vw;
		top: 50%;
		margin-top: -1.6vw;
		right:-5.5%;
		line-height: 0;
		border-top-left-radius: 100px;
		border-bottom-left-radius: 100px;
		border-right: 0;
		z-index: 110;
		}
		
		.modalheadlineright:before {
	
		content: ' ';
		position: absolute;
		display: block;
		background-color: #fff;
		width: 1.6vw;
		height: 3.2vw;
		top: 50%;
		margin-top: -1.6vw;
		left:-5.5%;
		line-height: 0;
		border-top-right-radius: 100px;
		border-bottom-right-radius: 100px;
		border-left: 0;
		z-index: 110;
		}
		
		.modallogowrapper {
		position: relative;
		top: 2%;
		height: 40px;
		width: 100%;
		}
		
		.modallogowrapper_r {
		position: relative;
		top: 10%;
		left: 1.5vw;
		height: 40px;
		width: 100%;
		padding-left: 15px;
		}
		
		.modalscrolldowniconleft, .modalscrolldowniconright  {
		display: none;
		}
		
		.modalnetflix {
		background-image: url('../images/netflix_2014.svg');
		background-size: auto 100%;
		background-position: left;
		background-repeat: no-repeat;
		position: relative;
		display: inline-block;
		height: 100%;
		width: 140px;
		float:left;
		}
		
		.modaltff {
		background-image: url('../images/tribecaff.svg');
		background-size: auto 100%;
		background-position: left;
		background-repeat: no-repeat;
		position: relative;
		display: inline-block;
		height: 100%;
		width: 80px;
		float:left;
		}
		
		.modalcategoryinline {
		position: relative;
		top: 11%;
		left: 0%;
		width: 100%;
		}
		
		.modalcreditsslug, .modalcreditsslug_r {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 4px;
		line-height: .8;
		color: #000;
		position: relative;
		display: block;
		margin-top: 10%;
		left: 0%;
		width: 100%;
		}
		
		.modalcreditsslug_r {
		margin-left: 2px;
		}
		
		.modalimage {
		background-size: cover;
		background-repeat: no-repeat;
		position: relative;
		top: 78px;
		width: 100vw;
		height: 45vh;
		background-color: #000;
		}
		
		.lowerrule {
		top: -1.5vw;
		width: 96%;
		height: 1.5vw;
		margin: 0 auto;
		background-color: #000;
		}
		
		.modalcreditswrapper {
		position: relative;
		left: 4.5%;
		display: inline-block;
		margin-bottom: 20px;
		width: 91.5%;
		z-index: 999;
		}
	
		.modalcredits, .modalcredits_r {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 3px;
		line-height: .8;
		color: #000;
		position: relative;
		left: 0%;
		margin-top: 5%;
		width: 100%;
		}
		
		.modalcredits_r {
		padding-left: 2px;
		}
		
		.modalurl, .modalurl_r {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 3px;
		line-height: .8;
		color: #000;
		position: relative;
		left: 0%;
		margin-top: 4%;
		width: 100%;
		}
		
		#modalurl_r {
		margin-left: 2px;
		}
		
		span.credit {
		font-family: "gibson_regular", sans-serif;
		font-style: normal;
		text-align: center;
		font-size: 9px !important;
		letter-spacing: 1px;
		line-height: 1.5;
		color: #000;
		}
		
		span.url {
		font-family: "gibson_regular", sans-serif;
		font-style: normal;
		text-align: center;
		font-size: 12px !important;
		letter-spacing: 1px;
		line-height: 1.5;
		}
		
	/* MODAL TEXT DROPDOWN */
	
		.descriptionext, .descriptionext_r {
		background-image: url('../images/uparrow_active.svg');
		background-size: auto 80%;
		background-position: 100% 0%;
		background-repeat: no-repeat;
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 4px;
		line-height: .8;
		color: #000;
		position: absolute;
		display: none;
		top: 50%;
		margin-top: -6px;
		width: auto;
		background-color: #ffffff !important;
		border: 3px solid #fff;
		z-index: 80;
		}
		
		.descriptionext {
		left: 45.75%;
		margin-left: 1.45vw;
		}
		
		.descriptionext_r {
		left: 27%;
		}
		
		.descriptionext.readmore {
		display: block;
		}
		
		.descriptionext_r.readmore {
		display: block;
		}
		
		.description, .description_r {
		background-image: url('../images/downarrow_active.svg');
		background-size: auto 80%;
		background-position: 100% 0%;
		background-repeat: no-repeat;
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 9px !important;
		letter-spacing: 4px;
		line-height: .8;
		color: #000;
		position: absolute;
		display: block;
		top: 50%;
		margin-top: -6px;
		width: auto;
		background-color: #ffffff !important;
		border: 3px solid #fff;
		}
		
		.description {
		left: 45.75%;
		margin-left: 1.45vw;
		}
		
		.description_r {
		left: 27%;
		}
		
		.description_scroll {
		display: none;
		}
		
		.description.readmore {
		display: none;
		}
		
		.description_r.readmore {
		display: none;
		}
		
		span.description_blue {
		color: #0000EE;
		}
		
		span.description_blue:hover {
		text-decoration: underline;
		}
		
		span.description_red {
		color: #cd1811;
		}
		
		span.description_red:hover {
		text-decoration: underline;
		}
		
		-moz-keyframes fadeinext {
		0%  {opacity: 0;}
		100% {opacity: 1;}
		}

		@-webkit-keyframes fadeinext {
		0%  {opacity:0;}
		100% {opacity: 1;}
		}

		@keyframes fadeinext {
		0%  {opacity: 0;}
		100% {opacity: 1;}
		}
		
		-moz-keyframes fadeout {
		0%  {opacity: 1;}
		100% {opacity: 0;}
		}

		@-webkit-keyframes fadeout {
		0%  {opacity: 1;}
		100% {opacity: 0;}
		}

		@keyframes fadeout {
		0%  {opacity: 1;}
		100% {opacity: 0;}
		}

		.modalcontentext, .modalcontentext_r {
		position: relative;
		top: 0%;
		left: 0%;
		display: block;
		width: 100%;
		height: 55%;
    	z-index: 50;
    	overflow: auto;
		border-bottom: 1.5vw solid #000;
    	z-index: 50;
		}
		
		.modalcontentext.readmore, .modalcontentext_r.readmore {
		height: 55%;
		animation-name: modalcontmore, plusbackgroundindex;
		animation-duration: 1s, 0.001s;
		animation-iteration-count: 1, 1;
		animation-timing-function: linear, linear;
		-webkit-animation-delay: .2s, 0s; /* Chrome, Safari, Opera */
		animation-fill-mode: forwards;
		animation-delay: .2s, 0s;
		background-color: rgba(255, 255, 255, 0);
		z-index: 50;
		}
		
		.modalcontentext.readless, .modalcontentext_r.readless {
		height: 55%;
		animation-name: modalcontless, minusbackgroundindex;
		animation-duration: 1s, 1s;
		animation-iteration-count: 1, 1;
		animation-timing-function: linear, linear;
		-webkit-animation-delay: 0s, .5s; /* Chrome, Safari, Opera */
		animation-fill-mode: forwards, forwards;
		animation-delay: 0s, .5s;
		background-color: rgba(255, 255, 255, 1);
		z-index: 9999;
		}
		
		-o-keyframes modalcontmore {
		0%  {height: 55%;}
		100% {height: -o-calc(100% - 1.5vw);}
		}
		
		-moz-keyframes modalcontmore {
		0%  {height: 55%;}
		100% {height: -moz-calc(100% - 1.5vw);}
		}

		@-webkit-keyframes modalcontmore {
		0%  {height: 55%;}
		100% {height: -webkit-calc(100% - 1.5vw);}
		}

		@keyframes modalcontmore {
		0%  {height: 55%;}
		100% {height: calc(100% - 1.5vw);}
		}
		
		-o-keyframes modalcontless {
		0%  {height: -o-calc(100% - 1.5vw);}
		100% {height: 55%;}
		}
		
		-moz-keyframes modalcontless {
		0%  {height: -moz-calc(100% - 1.5vw);}
		100% {height: 55%;}
		}

		@-webkit-keyframes modalcontless {
		0%  {height: -webkit-calc(100% - 1.5vw);}
		100% {height: 55%;}
		}

		@keyframes modalcontless {
		0%  {height: calc(100% - 1.5vw);}
		100% {height: 55%;}
		}
		
		-o-keyframes plusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		100% {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		}
		
		-moz-keyframes plusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		100% {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		}

		@-webkit-keyframes plusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		100% {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		}

		@keyframes plusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		100% {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		}
		
		-o-keyframes minusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		50%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		100% {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		}
		
		-moz-keyframes minusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		50%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		100% {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		}

		@-webkit-keyframes minusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		50%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		100% {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		}

		@keyframes minusbackgroundindex {
		0%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		50%  {background-color: rgba(255, 255, 255, 1); z-index: 9999;}
		100% {background-color: rgba(255, 255, 255, 0); z-index: 50;}
		}
		
		.modalcolumn2ext {
		position: relative;
		display: inline-block;
		height: 55%;
		width: 100%;
		background-color: none;
		overflow: visible;
		z-index: 50;
		}
		
		.modaltextext, .modaltextext_r  {
		font-family: "chronicle_display_reg", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 12px !important;
		letter-spacing: .4px;
		line-height: 1.4;
		color: #000;
		position: relative;
		display: block;
		top:15px;
		left: 4.5%;
		padding-bottom: 12px;
		width: 91.5%;
		height: 100%;
		-moz-column-count: 2;
  		-webkit-column-count: 2;
  		column-count: 2;
		-moz-column-width: 150px;
		-webkit-column-width: 150px;
		column-width: 150px;
		-webkit-column-gap: 15px; /* Chrome, Safari, Opera */
		-moz-column-gap: 15px; /* Firefox */
		overflow-y: hidden;
    	overflow-x: hidden;
    	z-index: 52;
		}
	
		.modaltextext.readmore, .modaltextext_r.readmore {
		height: 100%;
    	animation-name: modaltxtmore;
		animation-duration: .5s;
		animation-iteration-count: 1;
		animation-timing-function: linear;
		-webkit-animation-delay: 1s; /* Chrome, Safari, Opera */
		animation-delay: 1s;
		animation-fill-mode: forwards;
    	z-index: 52;
		}
		
		.modaltextext.readless, .modaltextext_r.readless {
		height: 100%;
    	animation-name: modaltxtless;
		animation-duration: .5s;
		animation-iteration-count: 1;
		animation-timing-function: linear;
		-webkit-animation-delay: 0s; /* Chrome, Safari, Opera */
		animation-delay: 0s;
		animation-fill-mode: forwards;
    	z-index: 52;
		}
		
		-moz-keyframes modaltxtmore {
		0%  {height: 100%;}
		100% {height: auto;}
		}

		@-webkit-keyframes modaltxtmore {
		0%  {height: 100%;}
		100% {height: auto;}
		}
		
		-o-keyframes modaltxtmore {
		0%  {height: 100%;}
		100% {height: auto;}
		}

		@keyframes modaltxtmore {
		0%  {height: 100%;}
		100% {height: auto;}
		}
		
		-moz-keyframes modaltxtless {
		0%  {height: auto;}
		100% {height: 100%;}
		}

		@-webkit-keyframes modaltxtless {
		0%  {height: auto;}
		100% {height: 100%;}
		}
		
		-o-keyframes modaltxtless {
		0%  {height: auto;}
		100% {height: 100%;}
		}

		@keyframes modaltxtless {
		0%  {height: auto;}
		100% {height: 100%;}
		}
	
		
	/* GALLERY THUMBS */
			
		.gallerywrapper {
		position: relative;
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between; 
		align-content: flex-start;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;
		background-color: #f5f4f3;
		border-bottom: 4px solid #000;
		overflow: auto;
		}
		 
		.gridsquare  {
		position: relative;
		display: inline-table;
		width: 30%;
		padding-bottom: 30%;
		margin:1.66% 1.66% 1.66% 1.66%;
    	overflow:hidden;
		}
	
		.gridcontent {
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		position:absolute;
		height:100%; 
		width:100%;
		padding: 10% 5%;
		background-color: #424242;
		overflow:hidden;
		}
		
		
	/* GALLERY CAROUSEL */
		
		.carouselcontainer, .carouselcontainer_r {
		position: absolute;
		display: none;
		top:0%;
		width: 98%;
		height: 100%;
		background-color: #fff;
		overflow:visible;
		z-index: 10000;
		}
		
		.carouselcontainer {
		left:100%;
		}
		
		.carouselcontainer_r {
		left:-100%;
		}
		
		.carouselcontainer:before, .carouselcontainer_r:before {
		content: ' ';
		position: absolute;
		top: 3%;
		width: 1.5vw;
		height: 90.25%;
		background-color: #000;
		z-index: 10000;
		}
		
		.carouselcontainer:before{
		left: 0%;
		}
		
		.carouselcontainer_r:before{
		right: 0%;
		}
		
		.carouselcontainer.expand, .carouselcontainer_r.expand {
		display: block;
		animation-duration: .5s;
		animation-iteration-count: 1;
		-webkit-animation-delay: 0s; /* Chrome, Safari, Opera */
		animation-delay:0s;
		animation-fill-mode: forwards;
		}
		
		.carouselcontainer.expand {
		left:100%;
		animation-name: galleryopen;
		}
		
		.carouselcontainer_r.expand {
		left: -100%;
		animation-name: galleryopenright;
		}
		
		.carouselcontainer.contract, .carouselcontainer_r.contract {
		display: block;
		animation-duration: .5s;
		animation-iteration-count: 1;
		-webkit-animation-delay: 0s; /* Chrome, Safari, Opera */
		animation-delay:0s;
		animation-fill-mode: forwards;
		}
		
		.carouselcontainer.contract {
		left:2%;
		animation-name: galleryclose;
		}
		
		.carouselcontainer_r.contract {
		left:0%;
		animation-name: gallerycloseright;
		}
		
		-moz-keyframes galleryopen {
		0%  {left: 100%;}
		100% {left: 2%;}
		}

		@-webkit-keyframes galleryopen {
		0%  {left: 100%;}
		100% {left: 2%;}
		}

		@keyframes galleryopen {
		0%  {left: 100%;}
		100% {left: 2%;}
		}
		
		-moz-keyframes galleryclose {
		0%  {left: 2%;}
		100% {left: 100%;}
		}

		@-webkit-keyframes galleryclose {
		0%  {left: 2%;}
		100% {left: 100%;}
		}

		@keyframes galleryclose {
		0%  {left: 2%;}
		100% {left: 100%;}
		}
		
		-moz-keyframes galleryopenright {
		0%  {left: -100%;}
		100% {left: 0%;}
		}

		@-webkit-keyframes galleryopenright {
		0%  {left: -100%;}
		100% {left: 0%;}
		}

		@keyframes galleryopenright {
		0%  {left: -100%;}
		100% {left: 0%;}
		}
		
		-moz-keyframes gallerycloseright {
		0%  {left: 0%;}
		100% {left: -100%;}
		}

		@-webkit-keyframes gallerycloseright {
		0%  {left: 0%;}
		100% {left: -100%;}
		}

		@keyframes gallerycloseright {
		0%  {left: 0%;}
		100% {left: -100%;}
		}
		
		.galleryclosex {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 50px !important;
		letter-spacing: 1px;
		line-height: 50px;
		color: #cd1811;
		position: absolute;
		top: 50%;
		margin-top: -22px;
		right: 2vw;
		background-color: #ffffff !important;
		z-index: 99999;
		display: none;
		}
		
		.galleryclosex.expand {
		display: block;
		}
		
		.galleryclosex.contract {
		display: none;
		}
	
		.swiper-container {
		position: absolute;
		width: 95%;
		height:94%;
		top: 3%;
		left: 1.5vw !important;
		}

		.swiper-slide {
		position: relative;
		overflow: hidden !important;
		line-height: 0;
		width: 100%;
		height: 96%;
		}
		
		.swiper-slide 
		{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		}
		
		.swiper-pagination {
		position: absolute;
		bottom: 0% !important;
		}
		
		#caption_A
		{	
		background-image: url('http://eoe.vectorbornellc.netdna-cdn.com/featured/images/surv_caption.png');
		background-size: 909px, 49px;
		position: relative;
		width: 909px;
		height: 49px;
		line-height:0;
		display: block;
		margin: 0 auto;
		padding: 0;
		z-index: 0;
		}
		
	/* VIDEO */
			
		
		.modalvidcontentwrapper {
		position: absolute;
		top: 60%;
		width: 100%;
		height: 40%;
		overflow:hidden;
		z-index: 9998;
		background-color: rgba(0, 0, 0, 1);
		}
		
		.modalvidcontent {
		position: relative;
		top:0%;
		width: 100%;
		height: 100%;
		max-height: 100%;
		overflow:hidden;
		z-index: 0;
		}
	
		.modalvideo {
		position: absolute;
		top: 50%;
  		-ms-transform: translateY(-50%);
  		-webkit-transform: translateY(-50%);
  		transform: translateY(-50%);
		min-width: 100%; 
		min-height: auto;
		width: 100%; 
		height: auto;
		overflow: hidden;
		}
		
		@media only screen and (max-aspect-ratio: 9/16) {
			.modalvideo {
			min-width: auto; 
			min-height: 100%;
			width: auto; 
			height: 100%;	
			}
		}
		
		.dim {
		opacity: 0;
		webkit-transition: 500ms;
    	-moz-transition: 500ms;
    	-o-transition: 500ms;
		transition: 500ms;
		}
		
	/* DUAL BUTTONS */
		
		.vidbuttonwrapper {
		position: relative;
		display: block;
		margin: 0 auto;
		top: 50%;
		-ms-transform: translateY(-40px);
		-webkit-transform: translateY(-40px);
		transform: translateY(-40px);
		width: 60%;
		height: 80px;
		z-index: 100;
		}
		
		.vidbuttonwrapper.expand {
		display: none;
		}
		
		.vidbuttonleft, .vidbuttonright {
		background-image: url('../images/playarrow.svg');
		background-size: 10px auto;
		background-position: 50% 70%;
		background-repeat: no-repeat;
		font-family: "knockout_welterweight", sans-serif;
		font-style: normal;
		font-weight: 100;
		text-align: center;
		font-size: 12px !important;
		letter-spacing: 2px;
		color: #fff !important;
		text-decoration: none !important;
		position: absolute;
		width: 48%;
		height: 100%;
		display: block;
		padding: 20px 0px 20px 0px;
		z-index: 98;
		}
		
		.vidbuttonleft, .vidbuttoncolorleft, .vidbuttonborderleft {
		left: 0%;
		
		}
		
		.vidbuttonright, .vidbuttoncolorright, .vidbuttonborderright {
		right: 0%;
		}
		
		.vidbuttonleft:hover ~ .vidbuttoncolorleft {
		left: 0%;
		background-color: #1219b0;
		opacity: .85;
		}
		
		.vidbuttonright:hover ~ .vidbuttoncolorright {
		right: 0%;
		background-color: #cd1811;
		opacity: .85;
		}
		
		.vidbuttonleft a, .vidbuttonright a {
		color: #fff !important;
		text-decoration: none !important;
		}
		
		.vidbuttonborderleft, .vidbuttonborderright {
		position: absolute;
		width: 48%;
		height: 100%;
		display: block;
		border: 1px solid #fff;
		border-radius: 4px;
		z-index: 90;
		}
		
		.vidbuttonleft:hover ~ .vidbuttonborderleft:after  {
		content: ' ';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 8px;
		top: 8px;
		border-width: 0px 1px 1px 0px;
		border-style: solid;
		border-color: #fff;
		border-radius: 0px 0px 8px 0px;
		z-index: 90;
		}
		
		.vidbuttonright:hover ~ .vidbuttonborderright:after  {
		content: ' ';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 8px;
		top: 8px;
		border-width: 0px 1px 1px 0px;
		border-style: solid;
		border-color: #fff;
		border-radius: 0px 0px 8px 0px;
		z-index: 90;
		}
		
		.vidbuttoncolorleft, .vidbuttoncolorright {
		position: absolute;
		width: 48%;
		height: 100%;
		display: block;
		border-radius: 4px;
		z-index: 60;
		}
		
		.vidbuttoncolorleft {
		left: 0;
		background-color: #000;
		opacity: .3;
		}
		
		.vidbuttoncolorright {
		right: 0;
		background-color: #cd1811;
		opacity: .6;
		}
		
	/* SINGLE BUTTONS */
	
		
		.vidbuttonwrapper.expand {
		display: none;
		}
		
		.vidbuttonsingle {
		background-image: url('../images/playarrow.svg');
		background-size: 10px auto;
		background-position: 50% 70%;
		background-repeat: no-repeat;
		font-family: "knockout_welterweight", sans-serif;
		font-style: normal;
		font-weight: 100;
		text-align: center;
		font-size: 12px !important;
		letter-spacing: 2px;
		color: #fff;
		position: absolute;
		left: 50%;
		margin-left: -24%;
		width: 48%;
		height: 100%;
		display: block;
		padding: 20px 0px 20px 0px;
		z-index: 98;
		}
		
		.vidbuttonsingle:hover ~ .vidbuttoncolorsingle {
		left: 50%;
		margin: 0 auto;
		background-color: #1219b0;
		opacity: 1 !important;
		}
		
		.vidbuttonsingle:hover ~ .vidbuttoncolorsingle_r {
		left: 50%;
		margin-left: -24%;
		background-color: #cd1811;
		opacity: 1 !important;
		}
		
		.vidbuttonsingle a {
		color: #fff !important;
		text-decoration: none !important;
		}
		
		.vidbuttonbordersingle {
		position: absolute;
		left: 50%;
		margin-left: -24%;
		width: 48%;
		height: 100%;
		display: block;
		border: 1px solid #fff;
		border-radius: 4px;
		z-index: 90;
		}
		
		.vidbuttonsingle:hover ~ .vidbuttonbordersingle:after  {
		content: ' ';
		position: absolute;
		width: 100%;
		height: 100%;
		left: 8px;
		top: 8px;
		border-width: 0px 1px 1px 0px;
		border-style: solid;
		border-color: #fff;
		border-radius: 0px 0px 8px 0px;
		z-index: 90;
		}
		
		.vidbuttoncolorsingle, .vidbuttoncolorsingle_r {
		position: absolute;
		left: 50%;
		margin-left: -24%;
		width: 48%;
		height: 100%;
		display: block;
		border-radius: 4px;
		z-index: 60;
		}
		
		.vidbuttoncolorsingle {
		background-color: #000;
		opacity: .7;
		}
		
		.vidbuttoncolorsingle_r {
		background-color: #cd1811;
		opacity: .6;
		}


		
	/* VIDEO EXPANDED */
	
		.modalvidmask.expand {
		display:none;
		}
		
		.modalvidcontentwrapper.expand {
		position: absolute;
		top:0%;
		width: 100%;
		height: 100%;
		overflow:visible;
		z-index: 10000;
		}
		
		.modalvidcontentwrapper.contract {
		position: absolute;
		top:60%;
		width: 100%;
		height: 40%;
		overflow:visible;
		}
		
		.modalvidcontent.expand {
		position: absolute;
		top:0%;
		width: 100%;
		height: 100%;
		-ms-transform: translateY(0px);
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
		overflow:visible;
		z-index: 10000;
		}
		
		.modalvidcontent.contract {
		position: relative;
		top:0%;
		width: 100%;
		height: 100%;
		overflow:hidden;
		}
		
		.modalvideo.expand {
		position: fixed;
		top: 0%;
		margin: 0;
		-ms-transform: translateY(0%);
		-webkit-transform: translateY(0%);
  		transform: translateY(0%);
		width: 100%; 
		height: auto;
		overflow: visible;
		background-color: #000;
		}
		
		@media only screen and (min-aspect-ratio: 8/5) {
			.modalvideo.expand {
			margin: 0 auto;
			width: auto; 
			height: 100%;	
			}
		}
		
		.modalvideo.contract{
		position: absolute;
		top: 50%;
		-ms-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
  		transform: translateY(-50%);
		min-width: 100%; 
		min-height: auto;
		width: 100%; 
		height: auto;
		overflow: hidden;
		}
		
		@media only screen and (max-aspect-ratio: 9/16) {
			.modalvideo.contract {
			min-width: auto; 
			min-height: 100%;
			width: auto; 
			height: 100%;	
			}
		}
		
		
		.vidbuttonleft.expand, .vidbuttonright.expand, 
		.vidbuttoncolorleft.expand, .vidbuttoncolorright.expand,
		.vidbuttonborderleft.expand, .vidbuttonborderright.expand  {
		display: none;
		}
		
		.expand {
		-webkit-backface-visibility: hidden;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition:all 0.5s ease-in-out;
		-o-transition:all 0.5s ease-in-out;
		transition:all 0.5s ease-in-out;
		}
		
		.contract {
		-webkit-backface-visibility: hidden;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition:all 0.5s ease-in-out;
		-o-transition:all 0.5s ease-in-out;
		transition:all 0.5s ease-in-out;
		}
		
		.vidclosex {
		font-family: "gibson_semibold", sans-serif;
		font-style: normal;
		text-align: left;
		font-size: 50px !important;
		letter-spacing: 1px;
		line-height: 50px;
		color: #cd1811;
		position: absolute;
		top: 50%;
		margin-top: -22px;
		right: 2vw;
		background-color: #ffffff !important;
		z-index: 99999;
		display: none;
		}
		
		.vidclosex.expand {
		display: block;
		}
		
	/* STILL LOWER IMAGES */
	
		.modalimgcontentwrapper {
		position: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		top: 60%;
		width: 100%;
		height: 40%;
		overflow:hidden;
		z-index: 9998;
		background-color: rgba(0, 0, 0, 1);
		}
		
		.modalimgcontent {
		object-fit: cover;
		position: relative;
		top:0%;
		height: 100%;
		flex-basis: 100%;
		max-height: 100%;
		overflow:hidden;
		}
		
		img.mdlimg {
		width: 100%;
		height: auto;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);	
		}
		
		.mdlimg-1 {
			display: inline-block;
			order: 1;
		}
		
		.mdlimg-2 {
			display: none;
		}
		
		.mdlimg-3 {
			display: none;
		}
		
		.mdlimg-4 {
			display: none;
		}
		
		@media (min-width: 1200px) {
			.modalimgcontent {
				flex-basis: 49%;
				width: 49%;
			}
			.mdlimg-2 {
				display: inline-block;
				order: 2;
			}
		} 
		
		@media (min-width: 2200px) {
			.modalimgcontent {
				flex-basis: 33%;
				width: 33%;
			}
			.mdlimg-3 {
				display: inline-block;
				order: 3;
			}
		}