/*=========MOBILE DEFAULT STYLES============*/

/*START EQUALIZER MENU STYLES*/
	.equalizer-menu {
		position: absolute;
		top: 30px;
		right: 20px;
		width: 38px;
		height: 38px;
		cursor: pointer;
		z-index: 400;
	}

	.control-bar {
		position: absolute;
		width: 10px;
		height: 30px;
		overflow: hidden;
	}

	.control-bar:nth-child(2) {
		margin-left: 11px;
	}

	.control-bar:nth-child(3) {
		margin-left: 22px;
	}

	.bar {
		background: #fff;
	}

	.bar-horizontal {
		width: 12px;
		height: 1px;
		transform-origin: center center;
		transition: all 0.2s ease-out;
	}

	.control-bar:first-child .bar-top {
		margin-top: 0;
		width: 1px;
		height: 15px;
		transform: translateX(5px);
		transition: all 0.2s ease-out;
	}

	.control-bar:first-child .bar-bottom {
		width: 1px;
		height: 17px;
		transform: translateX(5px) translateY(2px);
	}

	.equalizer-menu.open > .control-bar:first-child .bar-top {
		height: 22px;
		transition: all 0.2s ease-out;
	}


	.control-bar:nth-child(2) .bar-top {
		width: 1px;
		height: 22px;
		transform: translateX(5px);
		transition: all 0.2s ease-out;
	}

	.equalizer-menu.open > .control-bar:nth-child(2) .bar-top {
		height: 8px;
		transition: all 0.2s ease-out;
	}

	.control-bar:nth-child(2) .bar-bottom {
		width: 1px;
		height: 24px;
		transform: translateX(5px) translateY(2px);
	}


	.control-bar:nth-child(3) .bar-top {
		width: 1px;
		height: 8px;
		transform: translateX(5px);
		transition: all 0.2s ease-out;
	}

	.equalizer-menu.open > .control-bar:nth-child(3) .bar-top {
		height: 18px;
		transition: all 0.2s ease-out;
	}

	.control-bar:nth-child(3) .bar-bottom {
		width: 1px;
		height: 24px;
		transform: translateX(5px) translateY(2px);
	}
/*END EQUALIZER MENU STYLES*/

/*START MAIN/SPASH STYLES*/
	.main-content {
		position: relative;
		width: 100vw;
		height: 100vh;
		margin: 0 auto;
		overflow: hidden;
	}

	.logo-header {
		position: absolute;
		top: 30px;
		left: 20px;
		width: 55px;
		height: auto;
		opacity: 0.65;
		z-index: 550;
		-webkit-user-select: none;
		user-select: none;
		transition: all 0.2s ease-out;
	}

	.logo-header:hover {
		opacity: 0.85;
		transition: all 0.2s ease-out;
	}

	.social-links-container {
		display: none;
	}

	.mobile-links-container {
		position: absolute;
		width: 80vw;
		display: block;
		z-index: 25;
		margin: 0 auto;
		left: 0;
		right: 0;
		bottom: 50px;
	}

	.contact-button-wrapper {
		position: relative;
		width: 80vw;
		height: 45px;
		overflow: hidden;
	}

	.about-epk-button {
		position: relative;
		display: block;
		overflow: hidden;
		width: 80vw;
		height: 45px;
		font-family: 'lasiver', sans-serif;
		font-weight: 500;
		font-size: 0.95em;
		text-transform: uppercase;
		letter-spacing: 0.25em;
		text-align: center;
		outline: none !important;
		box-shadow: none !important;
		border-radius: 0;
		background: #fff;
		color: #26252b;
		border: none;
		z-index: 510;
		transform-origin: 50% 50%;
		transition: all 0.2s ease-out;
	}

	.about-epk-button:before {
		content: '';
		position: absolute;
		width: 32px;
		height: 2px;
		background: #333;
		left: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}

	.about-epk-button:after {
		content: '';
		position: absolute;
		width: calc(32px + 0.25em);
		height: 2px;
		background: #333;
		right: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}

	.contact-button-wrapper.selected > .about-epk-button {
		width: 0;
		transform-origin: 50% 50%;
		transition: all 0.2s ease-out;
	}

	.epk-button-half {
		position: absolute;
		display: inline-block;
		top: 0;
		overflow: hidden;
		width: calc(40vw - 10px);
		height: 45px;
		font-family: "lasiver", sans-serif;
		font-weight: 500;
		font-size: 0.95em;
		text-transform: uppercase;
		letter-spacing: 0.25em;
		text-align: center;
		outline: none !important;
		box-shadow: none !important;
		border: none;
		border-radius: 0;
		cursor: pointer;
		background: #fff;
		color: #26252b;
		z-index: 550;
		transition: all 0.2s ease-out;
	}

	.epk-button-half:before {
		content: '';
		position: absolute;
		width: 8px;
		height: 2px;
		background: #333;
		left: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}

	.epk-button-half:after {
		content: '';
		position: absolute;
		width: calc(8px + 0.125em);
		height: 2px;
		background: #333;
		right: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}

	.epk-left {
		left: -40vw;
	}

	.epk-right {
		right: -40vw;
	}

	.contact-button-wrapper.selected > .epk-left {
		left: 0;
		transition: all 0.2s ease-out;
	}

	.contact-button-wrapper.selected > .epk-right {
		right: 0;
		transition: all 0.2s ease-out;
	}

	.epk-button {
		position: relative;
		display: block;
		overflow: hidden;
		width: 80vw;
		height: 45px;
		font-family: 'lasiver', sans-serif;
		font-weight: 500;
		font-size: 0.95em;
		text-transform: uppercase;
		letter-spacing: 0.25em;
		text-align: center;
		outline: none !important;
		box-shadow: none !important;
		border-radius: 0;
		transition: all 0.2s ease-out;
	}

	.pdf-button {
		margin-top: 20px;
		background: transparent;
		border: 2px solid #d8d8d8;
		color: #d8d8d8;
		transition: all 0.2s ease-out;
	}

	.pdf-button:before {
		content: '';
		position: absolute;
		width: 32px;
		height: 2px;
		background: #d8d8d8;
		left: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}

	.pdf-button:after {
		content: '';
		position: absolute;
		width: calc(32px + 0.25em);
		height: 2px;
		background: #d8d8d8;
		right: 0;
		top: 21px;
		transition: all 0.2s ease-out;
	}


	.bg-container {
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		perspective: 4000px;
	}

	.bg-invisible {
		position: absolute;
		width: 100vw;
		height: 100vh;
		top: 0;
		left: 0;
		z-index: 10;
		background: transparent;
	}

	.bg-wrapper {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform: translateZ(0);
		-ms-transform: translateZ(0);
		transform: translateZ(0);
	}

	.bg-wrapper img {
		position: absolute;
		top: 0;
		left: -103.334vw;
		width: auto;
		height: 105vh;
		display: block;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		/*background-color: rgba(255, 255, 255, 0.01);*/
	}

	.bg-wrapper img:first-child {
		transform: translateZ(50px);
	}

	.bg-wrapper img:nth-child(2) {
		transform: translateZ(175px);
	}

	.bg-wrapper img:nth-child(3) {
		transform: translateZ(200px);
	}

	.bg-wrapper img:nth-child(4) {
		transform: translateZ(250px);
	}

	.bg-wrapper img:nth-child(5) {
		transform: translateZ(420px);
	}
/*END MAIN/SPLASH STYLES*/

/*START MODAL OVERLAY STYLES*/
	.modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding-top: 20px;
		z-index: 500;
		background: rgba(0,0,0,0.97);
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		opacity: 0;
		/*-webkit-filter: blur(10px);*/
		transform-origin: center;
		transform: scale(0);
		transition: all 0.2s ease-out;
	}

	.modal-overlay.open {
		opacity: 1;
		/*-webkit-filter: blur(0);*/
		transform-origin: center;
		transform: scale(1);
		transition: all 0.2s ease-out;
	}

	.close-overlay {
		position: absolute;
		width: 30px;
		height: auto;
		right: 20px;
		top: 30px;
		cursor: pointer;
		z-index: 950;
	}

	.modal-content-container {
		position: relative;
		margin: 0 auto;
		width: 100vw;
		margin-top: 90px;
	}

	.av-line {
		position: absolute;
		top: 0;
		left: 0;
		width: 85px;
		height: auto;
	}

	.modal-content-wrapper {
		position: relative;
		margin: 0 auto;
		width: calc(100vw - 170px); /* Determine px value by (av-line width + 40)*2 */
	}

	.modal-left-container {
		position: relative;
		width: 100%;
		display: block;
		float: none;
		margin: 0 auto;
	}

	.menu-left-container {
		display: none;
	}

	.menu-right-container {
		display: none;
	}

	.mobile-modal-links {
		position: relative;
		display: block;
		width: 100%;
		margin: 0 auto;
		text-align: center;
		padding-top: 11.648px; /* determine by (.av-line height)/2 -- aspect ratio = 0.274 */
	}

	.mobile-modal-links li {
		position: relative;
		display: block;
		font-family: 'lasiver', sans-serif;
		font-weight: 500;
		font-size: 0.95em;
		text-transform: uppercase;
		letter-spacing: 0.15em;
		text-align: center;
		color: #fff;
		margin-bottom: 50px;
	}
/*END MODAL OVERLAY STYLES*/

/*START MENU OVERLAY STYLES*/
	.menu-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding-top: 20px;
		z-index: 399;
		background: rgba(0,0,0,0.97);
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		opacity: 0;
		/*-webkit-filter: blur(10px);*/
		transform-origin: center;
		transform: scale(0);
		transition: all 0.2s ease-out;
	}

	.menu-overlay.open {
		opacity: 1;
		/*-webkit-filter: blur(0);*/
		transform-origin: center;
		transform: scale(1);
		transition: all 0.2s ease-out;
	}
/*END MENU OVERLAY STYLES*/

/*START CONTACT OVERLAY STYLES*/
	.contact-modal-content-wrapper {
		position: relative;
		margin: 0 auto;
		width: calc(100vw - 120px);
	}


	.modal-header {
		position: relative;
		display: block;
		font-family: 'lasiver', sans-serif;
		font-weight: 700;
		font-size: 2em;
		text-transform: uppercase;
		letter-spacing: 0;
		word-spacing: 0;
		color: #fff;
		padding-left: 10px;
	}

	.contact-av-line {
		left: -30px;
	}


	/*START CONTACT FORM STYLES*/
		.form-container {
			position: relative;
			width: 100%;
			height: auto;
			overflow-x: hidden;
			overflow-y: auto;
			transition: all 0.3s ease-out;
		}

		#recaptcha {
		  position: absolute;
		  opacity: 0;
		  visibility: hidden;
		}

		.form-wrapper {
			position: relative;
			width: 100%;
			height: 110%;
			overflow: hidden;
			opacity: 1;
			transition: all 0.2s ease-out;
		}

		.form-wrapper.sending {
			opacity: 0;
			/*height: 0;*/
			transition: all 0.2s ease-out;
		}

		.contact-form > .form-wrapper > input {
			box-shadow: none !important;
		}

		input[type="text"], input[type="email"], textarea {
			position: relative;
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
			font-size: 0.9em;
			background: transparent;
			border: none;
			border-left: 1px solid #fff;
			border-bottom: 1px solid #fff;
			box-shadow: none !important;
			width: calc(100% - 8px);
			margin-top: 35px;
			padding: 6px;
			padding-left: 8px;
			color: #fff;
			border-radius: 0;
			transition: all 0.2s ease-out;
		}

		/*textarea {
			line-height: 1.4em;
		}*/

		textarea {
			line-height: 1.3em;
			resize: none;
			overflow-wrap: break-word;
			word-wrap: break-word;
			word-break: keep-all;
			-webkit-hyphens: auto;
			-moz-hyphens: auto;
			hyphens: auto;
		}

		.form-spacer {
			position: relative;
			width: 100%;
			height: 25px;
		}

		.form-label {
			position: absolute;
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
			font-size: 0.9em;
			text-align: left;
			color: #fff;
			cursor: text;
		}

		.name-label {
			opacity: 0.85;
			transform-origin: 0% 50%;
			transform: scale3d(1, 1, 1) translate3d(8px, -28px, 0);
			transition: all 0.2s ease-out;
		}

		.name-label.focus {
			opacity: 0.65;
			transform-origin: 0% 50%;
			transform: scale3d(0.7, 0.7, 1) translate3d(8px, 8px, 0);
			transition: all 0.2s ease-out;
		}

		.email-label {
			opacity: 0.85;
			transform-origin: 0% 50%;
			transform: scale3d(1, 1, 1) translate3d(8px, -28px, 0);
			transition: all 0.2s ease-out;
		}

		.email-label.focus {
			opacity: 0.65;
			transform-origin: 0% 50%;
			transform: scale3d(0.7, 0.7, 1) translate3d(8px, 8px, 0);
			transition: all 0.2s ease-out;
		}

		.message-label {
			opacity: 0.85;
			transform-origin: 0% 50%;
			transform: scale3d(1, 1, 1) translate3d(8px, -46px, 0);
			transition: all 0.2s ease-out;
		}

		.message-label.focus {
			opacity: 0.65;
			transform-origin: 0% 50%;
			transform: scale3d(0.7, 0.7, 1) translate3d(8px, 8px, 0);
			transition: all 0.2s ease-out;
		}


		::-webkit-input-placeholder {
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
		   	color: #d8d8d8;
		}

		:-moz-placeholder { /* Firefox 18- */
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
		   	color: #d8d8d8;  
		}

		::-moz-placeholder {  /* Firefox 19+ */
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
		   	color: #d8d8d8;  
		}

		:-ms-input-placeholder {  
			font-family: 'lasiver', sans-serif;
			font-weight: 400;
		   	color: #d8d8d8;  
		}

		.form-buttons-container {
			position: relative;
			width: 100%;
			display: block;
			margin-top: 10px;
		}

		.form-btn {
			position: relative;
			display: block;
			overflow: hidden;
			width: 100%;
			height: 45px;
			font-family: 'lasiver', sans-serif;
			font-weight: 500;
			font-size: 0.95em;
			text-transform: uppercase;
			letter-spacing: 0.25em;
			text-align: center;
			outline: none !important;
			box-shadow: none !important;
			border-radius: 0;
			opacity: 1;
			transition: all 0.2s ease-out;
		}

		.form-btn.sending {
			height: 0;
			padding: 0;
			opacity: 0;
			transition: all 0.2s ease-out;
		}

		.submit-btn {
			margin-right: 0;
			background: #fff;
			color: #26252b;
			border: none;
			transition: all 0.2s ease-out;
		}

		.submit-btn.sending {
			height: 0;
			padding: 0;
			opacity: 0;
			transition: all 0.2s ease-out;
		}

		.reset-btn {
			margin-top: 20px;
			background: transparent;
			border: 2px solid #d8d8d8;
			color: #d8d8d8;
			transition: all 0.2s ease-out;
		}

		.reset-btn.sending {
			height: 0;
			padding: 0;
			opacity: 0;
			transition: all 0.2s ease-out;
		}

		.submit-btn:before {
			content: '';
			position: absolute;
			width: 38px;
			height: 2px;
			background: #333;
			left: 0;
			top: 21px;
			transition: all 0.2s ease-out;
		}

		.submit-btn:after {
			content: '';
			position: absolute;
			width: calc(38px + 0.25em);
			height: 2px;
			background: #333;
			right: 0;
			top: 21px;
			transition: all 0.2s ease-out;
		}

		.reset-btn {
			margin-top: 20px;
			background: transparent;
			border: 2px solid #d8d8d8;
			color: #d8d8d8;
		}

		.reset-btn:before {
			content: '';
			position: absolute;
			width: 38px;
			height: 2px;
			background: #d8d8d8;
			left: 0;
			top: 21px;
			transition: all 0.2s ease-out;
		}

		.reset-btn:after {
			content: '';
			position: absolute;
			width: calc(38px + 0.25em);
			height: 2px;
			background: #d8d8d8;
			right: 0;
			top: 21px;
			transition: all 0.2s ease-out;
		}

	/*END CONTACT FORM STYLES*/

	/*START CONTACT SENDING STYLES*/
		.form-status {
			position: relative;
			top: 0;
			margin-top: 10px;
			margin-left: 10px;
			color: #777;
		}

		.status-text {
			position: relative;
			display: inline-block;
			float: left;
			font-size: 0.9em;
			line-height: 1.3em;
			color: #d8d8d8;
			font-weight: 400;
			margin-top: 10px;
		}

		.load-dots {
			position: relative;
			display: inline-block;
			transform: translateX(5px) translateY(10px);
		}

		.dot {
			position: absolute;
			display: inline-block;
			width: 2px;
			height: 2px;
			border-radius: 100%;
			background: #d8d8d8;
			opacity: 0;
		}

		.dot:first-child {
			animation: loaderDots 2s infinite ease;
		}

		.dot:nth-child(2) {
			margin-left: 7px;
			animation: loaderDots 2s infinite ease;
			animation-delay: 0.3s;
		}

		.dot:nth-child(3) {
			margin-left: 14px;
			animation: loaderDots 2s infinite ease;
			animation-delay: 0.5s;
		}

		@keyframes loaderDots {
			0% {
				opacity: 0;
				transform: translateY(7px);
			}
			
			50% {
				opacity: 1;
				transform: translateY(0);
			}
			
			100% {
				opacity: 0;
				transform: translateY(3px);
			}
		}
	/*END CONTACT SENDING STYLES*/
/*END CONTACT OVERLAY STYLES*/

/*START PROMO VIDEO OVERLAY STYLES*/
	.video-iframe {
		position: absolute;
		display: block;
		width: 320px;
		height: 180px;
		top: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		margin-top: calc((100vh - 180px)/2);
		z-index: 1250;
		box-shadow: 0px 0px 60px 4px rgba(255, 255, 255, 0.15);
		transform: scale(1);
		transition: all 0.2s ease-out;
	}
/*END PROMO VIDEO OVERLAY STYLES*/

