@color1: #444444;
@color2: #B58D31;

body{
	color:#707070;
	background:#000;
	padding:0; margin:0;
	font-family:"BandaRegular";
	font-size:14px;
	a{ color:#707070; }
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #b7b7b7 !important;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #b7b7b7 !important;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #b7b7b7 !important;
}
:-moz-placeholder { /* Firefox 18- */
  color: #b7b7b7 !important;
}

.parsley-errors-list{
	list-style:none;
	padding:0; margin:0;
	color:#F00;
	font-size:11px;
	.parsley-required{ text-align:right; margin-top:-10px;}
}
.swal-text{ text-align:center}
#maincont{
	background:#FFF; width:960px; height:567px; overflow:hidden; margin:auto; 
	
	&.type1{
		.step1{
			background:url(../../images/step-1-1.png);
		}
		.step2{
			background:url(../../images/step-1-2.png);
		}
		.step3{
			background:url(../../images/step-1-3.png);
		}
		.step4{
			background:url(../../images/step-1-4.png);
		}
		h1{ color:@color1}
		h1.line:before {background: @color1;}
		button{ background:@color1}
		.container input:checked ~ .checkmark {
			background-color: @color1;
		}
	}
	
	&.type2{
		.step1{
			background:url(../../images/step-2-1.png);
		}
		.step2{
			background:url(../../images/step-2-2.png);
		}
		.step3{
			background:url(../../images/step-2-3.png);
		}
		.step4{
			background:url(../../images/step-2-4.png);
		}
		h1{ color:@color2}
		h1.line:before {background: @color2;}
		button{ background:@color2}
		.container input:checked ~ .checkmark {
			background-color: @color2;
		}
		
	}
	
	.text-center{ text-align:center;}
	.text-right{ text-align:right}
	.text-left{ text-align:left}
	.text-10{ font-size:10px;}
	.vcenter{
		  width:90%;
		  position: absolute;
		  left: 50%;
		  top: 50%;
		  -webkit-transform: translate(-50%, -50%);
		  transform: translate(-50%, -50%);
	}
	.text2{
		width:470px;
		position: absolute;
		right: 3%;
		top:40%;
		background:rgba(255,255,255,0.85);
		padding:20px;
	}
	button{
		border-radius: 10px 10px 10px 10px;
		-moz-border-radius: 10px 10px 10px 10px;
		-webkit-border-radius: 10px 10px 10px 10px;
		font-size:18px;
		color:#FFF;
		padding:10px 25px;
		border:0px;
	}
	input,select{ 
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
		-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px; color:#5E292A;
		border:1px solid #707070; 
		padding:8px; 
		text-align:center;
		border-radius: 10px 10px 10px 10px;
		-moz-border-radius: 10px 10px 10px 10px;
		-webkit-border-radius: 10px 10px 10px 10px;
		width:95%;
		font-size:16px;
		margin:10px 0px;
		background-color:#FFF;
	}
	select{ 
		height:35px;
		option.ns{ display:none}
	}
	.steps{
		width:100%; height:100%; position:relative; display:none;
		&.step1{ display:block}
		.opa85{
			background:rgba(255,255,255,0.85);
			display:inline-block;
			width:370px;
			height:100%;
			padding:0 10px;	
			position:relative;		
		}
		
		h1{
			font-size:35px;
			margin-bottom: 60px;
    		position: relative;
			padding:0; margin:0;
			&.text-left{
				margin-bottom:10px;
			}
		}
		h1.line:before {
			content: "";
			width: 116px;
			height: 2px;
			position: absolute;
			bottom: -15px;
			left: 50%;
			margin-left: -40px;
		}
		h1.text-left:before {
			background: transparent;
			bottom:0;
		}
	}
	
	.row{
		&.cb{ clear:both}
		.col{ display:inline-block; float:left; overflow:hidden; clear:right}
		.col-40{ width:40%}
		.col-50{
			width:50%;
			&.r{ float:right; text-align:right}
		}
		.col-60{ 
			width:60%;
			input,select{ width:91%;}
		}
		.parsley-errors-list .parsley-required{
			margin-top:-10px;
			}
	}


}




.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 10px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


.container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}


.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 16px;
    width: 16px;
    background-color: #eee;
	border:1px solid #999;
}


.container:hover input ~ .checkmark {
    background-color: #ccc;
}


.container input:checked ~ .checkmark {
    background-color: #eee;
	
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}


.container input:checked ~ .checkmark:after {
    display: block;
}

.container .checkmark:after {
    left: 5px;
    top: 1px;
    width: 5px;
    height: 8px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}