/*
------------------------------------------------------------------------------------
COM.EZZATO.DEV
By : Andre Lorenzoni at andre@ezzato.com
------------------------------------------------------------------------------------
*/	

.lightbox {
	position:fixed;
	/*display:none;*/
	display:table;
	z-index:-1;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	vertical-align:middle;
	text-align:center;
	-o-transition:.3s;
	-ms-transition:.3s;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	transition:.3s;
	filter: alpha(opacity=0); 	
	-khtml-opacity: 0;      	
	-moz-opacity: 0;       		
	opacity: 0;  
}

.lightbox-open {
	display:table;
	z-index:11;
	filter: alpha(opacity=100); 	
	-khtml-opacity: 1;      	
	-moz-opacity: 1;       		
	opacity: 1; 
	top:0px; 
	left:0px;
}

.lightbox .wrapper .wrapper-content .close {
	position:absolute;
	top:10px;
	right:15px;
	color:#ffffff;
	cursor:pointer;
	z-index:1;
	font-size:40px;
	transition: 5s;
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	font-weight:bold;
	font-family:"Material Icons"
}

.lightbox .wrapper .wrapper-content .close:hover {
	color:#000000;
}

.lightbox .wrapper {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	margin:0 auto;
	background-color: rgba(0,0,0,.5);
}

.lightbox .wrapper .wrapper-content {
	position:relative;
	width:100%;
	min-height:280px;
	height: 280px;
	vertical-align:middle;
	margin:0 auto;
	background-color:#222222;

	display: table;
}

.lightbox .wrapper .wrapper-content .lightbox-content-wrapper {
	position:relative;
	display:table;
	width:1300px;
	margin:0 auto;
}

.lightbox .wrapper .wrapper-content .content {
	position:relative;
	padding:20px;


	display: table-cell;
	min-height: 280px;
	vertical-align: middle;

}

.lightbox .wrapper .wrapper-content .content .title {
	position:relative;
	display:table;
	font-size:54px;
	font-weight:bold;
	color:#ffffff;
	padding:10px 0px;
	text-align: left;
}

/*
.lightbox .wrapper .wrapper-content .content .exception {
}
*/

.lightbox .wrapper .wrapper-content .content .exception:after {
	content:'';
	font-family:"Material Icons";
	color:#FF4D4D;
	font-size: 50px;
	padding: 8px;
	vertical-align:middle;
}

.lightbox .wrapper .wrapper-content .content .text {
	position:relative;
	display:table;
	font-size:14px;
	color:#ffffff;
	padding:10px 0px;
	text-align:left;
}

.lightbox .wrapper .wrapper-content .content .timeout-timer {
	position:relative;
	display:table;
	font-size:22px;
	color:#ffffff;
	padding:10px 0px;
}

.lightbox button {
	position:relative;
	color:#ffffff;
	background-color:#000000;
	/*border:solid 1px #000000;*/
	padding:6px;
	font-size:14px;
	font-weight:bold;
	cursor:pointer;
	display: inline;
	transition: 5s;
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
}

.lightbox button:hover {
	background-color:#ffffff;
	color:#000000;
}

.lightbox .bt-container {
	position:relative;
	padding:10px 0px;
	display:table;
	width: 100%;
	text-align: left;
}

.lightbox .form {
	display:table;
}

.lightbox .form .field {
	width:auto;
	margin:0px;
}

.lightbox-base {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    display: none;/**/
	vertical-align:middle;
	background-color: rgba(0, 0, 0, 0.5);
}

.lightbox-active {
	display:table!important;
}

.lightbox-base .lightbox-base-container {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	width:100%;
	height: 100%;
	margin: 0 auto;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .step  {
	position:absolute;
	top:20px;
	left:20px;
	font-size:34px;
	color:#ffffff;
	text-transform:none;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .logo {
	position:relative;
	display:table;
	width:100%;
	padding:20px 0px;
	text-transform:uppercase;
	font-weight:bold;
	font-size:22px;
	color:#ffffff;
}

.lightbox-base .lightbox-base-container .lightbox-base-content{
	position:relative;
	display:table;
	vertical-align:middle;
	text-align:center;
	margin:0 auto;
	background-color:#C1250B;
	max-width:525px;
	padding:20px;
}


.lightbox-base .lightbox-base-container .lightbox-base-content .text {
	font-size:17px;
	color:#ffffff;
	text-transform:none;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .text .li-check {
	position:relative;
	display:table;
	width:100%;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .text .li-check ul {
	position:relative;
	display:table;
	width:100%;
	/*list-style:url(../img/content/list-check.png);*/
}

.lightbox-base .lightbox-base-container .lightbox-base-content .text .li-check ul li{
	position:relative;
	padding:0px;
	color:#ffffff;
	/*list-style:url(../img/content/list-check.png);*/
}

.lightbox-base .lightbox-base-container .lightbox-base-content .text b {
	font-family:inherit;
	color:inherit;
	font-size:inherit;
	font-weight:bold;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .phone-num {
	font-size: 46px;
	color: #ffffff;
	text-align: center;
	padding: 20px 0px;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .opt {
	position:relative;
	display:table;
	width:100%;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .title {
	text-transform:uppercase;
	font-size:17px;
	color:#ffffff;
	text-transform:none;
	width: 100%;
	text-align: right;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .button-container {
	display:table;
	width:100%;
	position:relative;
	text-align:center;
	padding:10px 0px;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .button-container button {
	margin:0 auto;
	width:180px;
}

.lightbox-base .lightbox-base-container .lightbox-base-content .close {
	position:absolute;
	display:table-cell;
	top:20px;
	right:20px;
	vertical-align:middle;
	width:52px;
	height:52px;
	background-image:url(../img/layout/bt-close.png);
	background-position:center center;
	background-repeat:no-repeat;
	cursor:pointer;
	z-index:2;
}


.lightbox-base .lightbox-base-container .lightbox-base-content .close:hover {
	background-image:url(../img/layout/bt-close-over.png);
}

.lightbox input,
.lightbox select {
	color: #ffffff !important;
}

.lightbox .lightbox-img-zoom {
	max-width: 95vw;
	max-height: 95vh;
}

.lightbox .wrapper .wrapper-content .content .scroller {
		overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	display: block;
	width: 100%;
	max-height: 80vh;
	margin: 5vh 0px;
	padding: 10px;
	text-align: left;
	color: #ffffff;
	}


/*
--------------------------------------------------------------------------------------
DESKTOP ONLY
--------------------------------------------------------------------------------------
*/

@media only screen and (min-width: 760px) and (max-width: 10000px) { 

	
}

/*
--------------------------------------------------------------------------------------
NOTEBOOK / SMALL SCREEEN
--------------------------------------------------------------------------------------
*/

@media only screen and (min-width: 1200px) and (max-width: 1460px) { 

	.lightbox .wrapper .wrapper-content .lightbox-content-wrapper {
		width:1100px;
	}

}

/*
--------------------------------------------------------------------------------------
TABLET
--------------------------------------------------------------------------------------
*/

@media only screen and (min-width: 760px) and (max-width: 1200px) { 
	
	.lightbox .wrapper .wrapper-content .lightbox-content-wrapper {
		width:100%;
	}
}

/*
--------------------------------------------------------------------------------------
SMARTPHONE
--------------------------------------------------------------------------------------
*/

@media only screen and (min-width: 200px) and (max-width: 760px) { 

	.lightbox .wrapper .wrapper-content .lightbox-content-wrapper {
		width:100%;
		padding:10px;
	}
	
	.lightbox .wrapper .wrapper-content .content .title {
		font-size:28px;
		
	}

	.lightbox .wrapper .wrapper-content .content .exception:after {
		font-size:30px;
	}
	
	.lightbox .wrapper .wrapper-content .content .text {
		font-size:12px;
	}

	

	.lightbox .form {
		width:100%;
	}
	.lightbox .form .field {
		width: 100%;
		margin: 10px 0px;
	}

	.lightbox button {
		font-size:20px;
	}

}