/* mobile version */
/*@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }*/
/* @media all and (max-device-height: 668px) and (max-device-width: 376px) and (-webkit-min-device-pixel-ratio: 1)*/
@media all and (max-width: 818px) and (orientation: landscape)
{
	body
	{
		cursor:pointer;
		min-width: 100%;
		-webkit-text-size-adjust:none;
	}

	.main
	{
		/*width:100%;*/
		width: 100vw;
		display: inline-block;
	}

	header
	{
		/*width:100%;*/
		width: 100vw;
		height: 65px;
	}

	.tagline
	{
		line-height: normal;
		margin-bottom: 0px;
	}
	.main-margin-top
	{
		height: 96px;
		max-height:110px;
	}
	.header-logo
	{
		top: 12px;
		left: 0px;
		height: 45px!important;
	}

	#menu-button
	{
		margin-right: 10px!important;
		margin-top: 20px;
	}

	#side-menu-items
	{
		position: fixed;
		width: 235px;
	    margin: 0 auto;
	    top: 30%;
	    left:25%;
	    right: 25%;
	    opacity: 0;
	    transition: 0.5s;
	}

	#main-content
	{
		width:auto;
		margin-top: 20px;
		margin-left: 10px;
		margin-right: 10px;
	}

	#main-content-div
	{
		display: inline-block;
	}

	#main-content-div-txt
	{
		width: 100%;
		height: auto;
	}

	#main-content-div-col1, #main-content-div-col1-2, #main-content-div-col1-1, #main-content-div-logo-locations
	{
		width: 100%;
	}

	#main-content-div-col1-2
	{
		width: 314px;
	}

	#main-content-div-logo-locations
	{
	    width: 90vw;
	}

	#main-content-div-col2
	{
		min-width: 100%;
		width: 100%;
		margin-bottom: 20px;
	}

	#main-content-div-form
	{
		float: left;
		min-width: 100%;
		width: 100%;
		/* min-height:100vh; */
	}
	
	.scroll-pages:last-of-type #main-content-div {
		min-height: 30vh;
	}

	#main-content-div-col1-1
	{
	    height: auto;
	    float: left;
	}

	.main-content-div-col2-main
	{
		width:100%;
		height: 100%;
	}

	#content-article-block
	{
		width:100%;
		min-height:160px;
	}

	.content-article-logo, .content-article-text, .content-article-text-wide
	{
		margin-top: 0px;
	}

	.article-logo, .article-logo-wide
	{
	    float: left;
		margin-top: -8px;
	}

	.content-article-logo-wide
	{
		width: auto;
	}

	#content-article-block .content-article-logo2
	{
		width: 314pxs;
		padding-right: none;
	}

	#content-article-block .content-article-text
	{
		margin-left: 0px;
		padding-left: 0px;
	}

	#content-article-block .content-article-text2, #content-article-block .content-article-text-bottom
	{
		width: 314px;
		height: auto;
		margin-left: 0px;
		padding-left: 0px;
	}

	.content-article-text-bottom
	{
		position: relative;
	}

	#main-content-div-logo-locations .map-separator
	{
		height: 0px;
	}

	.separator-small
	{
		width: 100%;
		height: 18px;
	}

	.separator
	{
		width: 100%;
		height: 10px!important;
	}
	.article-separator
	{
		width: 638px;
		height: 30px;
	}

	#main-content-div-logo-locations .separator
	{
		height: 30px;
	}

	footer
	{
		/*width:100%;*/
		width: 100vw;
	}

	#footer-content p
	{
		margin-bottom: 15px;
		margin-top: 15px;
	}

	.info_message
	{
		margin-top: 65px;
		padding-bottom: 0px;
	}

	#map
	{
		height: 50vh;
	    width: 100%;
	}

	/* Tooltips */

	.tooltip
	{
		position: relative;
		display:inline-block!important;
	}

	.tooltip .tooltiptext:before
	{
		content: '';
		height: 0;
		width: 0;
		top: -22px;
		margin-left: -18px;
		position: absolute;
		border-bottom: 27px solid rgba(0, 158, 226, 1);
		border-right: 23px solid transparent;
		z-index: 1;
	}

	.tooltip .tooltiptext
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: absolute;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		z-index: 9;
	}

	.tooltip .tooltiptext.right:before
	{
		content: '';
		height: 0;
		width: 0;
		top: -22px;
		right: 0px;
		position: absolute;
		border-bottom: solid 12px rgba(0, 158, 226, 1);
		border-right: solid 13px rgba(0, 158, 226, 1);
		border-left: solid 12px transparent;
		border-top: solid 15px transparent;
		z-index: 1;
	}

	.tooltip .tooltiptext.right
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}


	.tooltip .tooltiptext.top-right:before
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: 0;
		border-right: 0;
	}
	.tooltip .tooltiptext.top-right:after
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: solid 15px transparent;
		border-right: solid 13px rgba(0, 158, 226, 1);
		border-left: solid 12px transparent;
		border-top: solid 12px rgba(0, 158, 226, 1);
		z-index: 1;
	}

	.tooltip .tooltiptext.top-right
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}

	.tooltip .tooltiptext.top-left:before
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: 0;
		border-right: 0;
	}
	.tooltip .tooltiptext.top-left:after
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		left: 0px;
		position: absolute;
		border-bottom: solid 15px transparent;
		border-right: solid 12px transparent;
		border-left: solid 12px rgba(0, 158, 226, 1);
		border-top: solid 13px rgba(0, 158, 226, 1);
		z-index: 1;
	}

	.tooltip .tooltiptext.top-left
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}

	.info-message.show
	{
		margin-top: -40px;
		padding-top: 6px;
		padding-bottom: 20px;
	}

	.div_error
	{
		padding: 10px;
	}

	.div_info
	{
		padding: 10px;
	}

	#map1, #map2, #map3, #map4
	{
		height: 70vh;
		width: 100%;
	}

	/******* Action buttons ******/

	a.action-button {
		min-width: 310px;
		width: 49%;
	}

	/******* Framework model ******/
	.fw-model {
		margin: 40px 0 0 0;
	}

	.fw-model-menu div {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div:not(:last-of-type) {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div span {
		border-bottom: 1px solid #EDEDED;
	}

	.fw-model-menu {
		border-bottom: 0;
	}

	.fw-model-row {
		display: flex;
		flex-flow: row;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.fw-model-row div {
		width: 48%;
		height: auto;
		min-height: 175px;
	}

	.fw-model-row div:not(:last-of-type){
		margin: 20px 0 0 0;
	}

	#request-demo-popup {
		position: fixed;
		width: 100%;
		height: auto;
		top: 100vh;
		left: 0;
		background: #ffffff;
		z-index: 10;
		box-shadow: 0 0 10px rgba(1, 1, 1, 0.1);
		animation-duration: 0.8s;
		animation-fill-mode: both;
		opacity: 0;
		bottom: 0;
		transition: top 0.5s ease-in-out;
	}

	#request-demo-popup .popup-content {
		padding: 20px 40px 160px 40px;
	}
	
	#request-demo-popup.reveal {
		display: block;
		animation-name: bounceInBottom;
	}
	
	#request-demo-popup.unreveal {
		animation-name: slideInBottom;
	}

	@keyframes bounceInBottom {
		0% { top: 150vh; opacity: 0;}
		65% { top: 3%; opacity: 1; }
		75% { top: 1%; }
		85% { top: -1%; }
		100% { top: 0%; opacity: 1; }
	}
	
	@keyframes slideInBottom {
		0% { top: 0%; opacity: 1; }
		55% { top: 1%; }
		65% { top: -1%; }
		75% { top: 3%; opacity: 1; }
		100% { top: 150vh; opacity: 0; }
	}
	
	#event-page.xmas .main-margin-top {
		height: 130px;
		max-height: 130px;
	}
	
	#event-form .event-opt-list .event-option .option {
		margin-bottom: 20px;
	}
	
	.xmas-header-left {
		position: absolute; 
		left: 0; 
		top: 65px;
		width: 80px;
	}
	
	.xmas-header-right {
		position: absolute; 
		right: 0; 
		top: 65px;
		width: 130px;
	}
	
	.xmas-footer { 
		bottom: -45px; 
		height: 200px; 
	}
	
	.xmas-footer-margin {
		display: block;
		height: 200px;
	}
	
	.main-grid {
		grid-template-columns: 1fr;
	}
	
	.main-grid .grid-col-1 {
	  	padding: 0;
	}
	
	.main-grid .grid-col-1 .title {
	  	padding: 0 0 20px 0;
	}
	
	.main-grid > .one-video {
	  	padding-top: 20px;
	}
	
	.main-grid > .one-video > video {
	  	width: 500px!important;
	  	height: auto!important;
	}
}

@media all and (max-width: 818px) and (orientation: portrait)
{
	body
	{
		cursor:pointer;
		min-width: 100%;
		-webkit-text-size-adjust:none;
	}

	.main
	{
		/*width:100%;*/
		width: 100vw;
		display: inline-block;
	}

	header
	{
		/*width:100%;*/
		width: 100vw;
		height: 90px;
	}

	.tagline
	{
		line-height: normal;
		margin-bottom: 26px;
	}

	.main-margin-top
	{
		height: 130px;
		max-height: 250px;
	}

	.header-logo
	{
		top:16px;
		left:0px;
		height: 60px!important;
	}

	#menu-button
	{
		margin-right: 10px!important;
		margin-top: 30px;
	}

	#side-menu-items
	{
		position: fixed;
		width: auto;
	    margin: 0 auto;
	    top: 30%;
	    left:25%;
	    right: 25%;
	    opacity: 0;
	    transition: 0.5s;
	}

	#main-content
	{
		width:auto;
		margin-top: 20px;
		margin-left: 10px;
		margin-right: 10px;
	}

	#main-content-div
	{
		display: inline-block;
	}

	#main-content-div-txt
	{
		width: 100%;
		height: auto;
	}

	#main-content-div-col1, #main-content-div-col1-2, #main-content-div-col1-1, #main-content-div-logo-locations
	{
		width: 100%;
	}

	#main-content-div-col1-2
	{
		width: 314px;
	}

	#main-content-div-logo-locations
	{
	    width: 90vw;
	}

	#main-content-div-col2
	{
		min-width: 100%;
		width: 100%;
	}

	#main-content-div-form
	{
		float: left;
		min-width: 100%;
		width: 100%;
		/* min-height:80vh; */
	}
	
	.scroll-pages:last-of-type #main-content-div {
		min-height: 30vh;
	}

	#main-content-div-col1-1
	{
	    height: auto;
	    float: left;
	}

	.main-content-div-col2-main
	{
		width:100%;
		height: 100%;
	}

	#content-article-block
	{
		width:100%;
	}

	.content-article-logo, .content-article-text, .content-article-text-wide
	{
		margin-top: 0px;
	}

	.article-logo, .article-logo-wide
	{
	    float: left;
		margin-top: -8px;
	}

	.content-article-logo-wide
	{
		width: auto;
	}

	#content-article-block .content-article-logo2
	{
		width: 100%;
		padding-right: 0px;
	}

	#content-article-block .content-article-text
	{
		margin-left: 0px;
		padding-left: 0px;
	}

	#content-article-block .content-article-text2, #content-article-block .content-article-text-bottom
	{
		width: 314px;
		height: auto;
		margin-left: 0px;
		padding-left: 0px;
	}

	.content-article-text-bottom
	{
		position: relative;
	}

	#main-content-div-logo-locations .map-separator
	{
		height: 0px;
	}

	.separator-small
	{
		width: 100%;
		height: 18px;
	}

	.separator
	{
		width: 100%;
		height: 30px;
	}
	.article-separator
	{
		width: 638px;
		height: 30px;
	}

	#main-content-div-logo-locations .separator
	{
		height: 30px;
	}

	footer
	{
		/*width:100%;*/
		width: 100vw;
	}

	#footer-content p
	{
		margin-bottom: 15px;
		margin-top: 15px;
	}

	.info_message
	{
		margin-top: 90px;
	}

	#map
	{
		height: 50vh;
	    width: 100%;
	}

	/* Tooltips */

	.tooltip
	{
		position: relative;
		display:inline-block!important;
	}

	.tooltip .tooltiptext:before
	{
		content: '';
		height: 0;
		width: 0;
		top: -22px;
		margin-left: -18px;
		position: absolute;
		border-bottom: 27px solid rgba(0, 158, 226, 1);
		border-right: 23px solid transparent;
		z-index: 1;
	}

	.tooltip .tooltiptext
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: absolute;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		z-index: 9;
	}

	.tooltip .tooltiptext.right:before
	{
		content: '';
		height: 0;
		width: 0;
		top: -22px;
		right: 0px;
		position: absolute;
		border-bottom: solid 12px rgba(0, 158, 226, 1);
		border-right: solid 13px rgba(0, 158, 226, 1);
		border-left: solid 12px transparent;
		border-top: solid 15px transparent;
		z-index: 1;
	}

	.tooltip .tooltiptext.right
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}


	.tooltip .tooltiptext.top-right:before
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: 0;
		border-right: 0;
	}
	.tooltip .tooltiptext.top-right:after
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: solid 15px transparent;
		border-right: solid 13px rgba(0, 158, 226, 1);
		border-left: solid 12px transparent;
		border-top: solid 12px rgba(0, 158, 226, 1);
		z-index: 1;
	}

	.tooltip .tooltiptext.top-right
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}

	.tooltip .tooltiptext.top-left:before
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		right: 0px;
		position: absolute;
		border-bottom: 0;
		border-right: 0;
	}
	.tooltip .tooltiptext.top-left:after
	{
		content: '';
		height: 0;
		width: 0;
		bottom: -22px;
		left: 0px;
		position: absolute;
		border-bottom: solid 15px transparent;
		border-right: solid 12px transparent;
		border-left: solid 12px rgba(0, 158, 226, 1);
		border-top: solid 13px rgba(0, 158, 226, 1);
		z-index: 1;
	}

	.tooltip .tooltiptext.top-left
	{
		display: block;
		opacity: 0;
		pointer-events: none;
		position: relative;
		min-width:160px;
		max-width:160px;
		min-height: 100%;
		font-family: 'UniversNextLight';
		background-color: rgba(0, 158, 226, 1);
		/*-moz-border-radius: 6px;*/
		-webkit-border-radius: 6px;
		border-radius: 6px;
		/*-moz-box-shadow: -5px 5px 10px #888888;*/
		-webkit-box-shadow: -5px 5px 10px #888888;
		box-shadow: -5px 5px 10px #888888;
		color: #fff!important;
		font-size: 14px;
		line-height: 21px;
		padding: 16px 18px;
		margin-right:260px;
		z-index: 9;
	}

	.info-message.show
	{
		margin-top: -50px;
	}

	.div_error
	{
		padding: 10px;
	}

	.div_info
	{
		padding: 10px;
	}

	/******* Action buttons ******/
	
	.action-buttons-wrapper {
		width: 100%;
	}
	
	.action-buttons {
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	}
	a.action-button {
		box-sizing: border-box;
		width:unset;
		min-width: 100%;
	}

	a.action-button:not(:last-of-type){
		margin: 0 0 10px 0;
	}
	
	.action-buttons-wrapper .action-buttons.small:first-of-type {
		margin: 0 auto 10px auto;
	}
	
	.action-buttons-wrapper .action-buttons.small a:first-of-type {
		margin: 0 0 10px 0;
	}

	/******* Framework model ******/
	.fw-model {
		margin: 40px 0 0 0;
	}

	.fw-model-menu div {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div:not(:last-of-type) {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div span {
		border-bottom: 1px solid #EDEDED;
	}

	.fw-model-menu {
		border-bottom: 0;
	}

	/******* Framework model ******/
	.fw-model {
		margin: 40px 0 0 0;
	}

	.fw-model-menu div {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div:not(:last-of-type) {
		width: 100%;
		margin-top: 15px;
	}

	.fw-model-menu div span {
		border-bottom: 1px solid #EDEDED;
	}

	.fw-model-menu {
		border-bottom: 0;
	}

	.fw-model-row {
		display: flex;
		flex-flow: row;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.fw-model-row div {
		width: 48%;
		height: auto;
		min-height: 175px;
		margin: 20px 0 0 0;
	}

	.fw-model-row div:not(:last-of-type){
		margin: 20px 0 0 0;
	}

	#mcss-d #main-content-div-col1 h2 {
		margin-bottom: 30px;
	}

	#request-demo-popup {
		position: fixed;
		width: 100%;
		height: auto;
		top: 100vh;
		left: 0;
		background: #ffffff;
		z-index: 10;
		box-shadow: 0 0 10px rgba(1, 1, 1, 0.1);
		animation-duration: 0.8s;
		animation-fill-mode: both;
		opacity: 0;
		bottom: 0;
		transition: top 0.5s ease-in-out;
	}

	#request-demo-popup .popup-content {
		padding: 20px 40px 160px 40px;
	}
	
	#request-demo-popup.reveal {
		display: block;
		animation-name: bounceInBottom;
	}
	
	#request-demo-popup.unreveal {
		animation-name: slideInBottom;
	}

	@keyframes bounceInBottom {
		0% { top: 150vh; opacity: 0;}
		65% { top: 3%; opacity: 1; }
		75% { top: 1%; }
		85% { top: -1%; }
		100% { top: 0%; opacity: 1; }
	}
	
	@keyframes slideInBottom {
		0% { top: 0%; opacity: 1; }
		55% { top: 1%; }
		65% { top: -1%; }
		75% { top: 3%; opacity: 1; }
		100% { top: 150vh; opacity: 0; }
	}
	
	#event-form input[type="text"],
	#event-form select {
		width: 100%!important;
	}
	
	#event-form textarea {
		width: 100%!important;
	}
	
	#event .separator {
		display: none;
	}
	
	#event-page.xmas .main-margin-top {
		height: 200px;
	}
	
	#event-form .event-opt-list .event-option .option {
		margin-bottom: 20px;
	}
	
	.xmas-header-left {
		position: absolute; 
		left: 0; 
		top: 90px;
		width: 100px;
	}
	
	.xmas-header-right {
		position: absolute; 
		right: 0; 
		top: 90px;
		width: 150px;
	}
	
	.xmas-footer { 
		bottom: -45px; 
		height: 200px; 
	}
	
	.xmas-footer-margin {
		display: block;
		height: 200px;
	}
	
	.main-grid {
		grid-template-columns: 1fr;
	}
	
	.main-grid .grid-col-1 {
	  	padding: 0;
	}
	
	.main-grid .grid-col-1 .title {
	  	padding: 0 0 20px 0;
	}
	
	.main-grid > .one-video {
	  	padding-top: 20px;
	}
	
	.main-grid > .one-video > video {
	  	width: 100%!important;
	  	height: auto!important;
	}
}
