
.title-contact{padding: 35px 0;color: #303030;}

.top_comment{
  font-size: 18px;
  text-align: center;
  margin: 20px 0;
  line-height: 1.7;
}


.list-step{ display: flex; padding: 18px 0;}
.list-step .step{ width: 200px; padding: 12px; border: 2px solid #000; text-align: right; font-size: 20px; font-weight: 500; color: #000;}
.list-step .step .step-num{ font-size: 16px; text-align: left; width: 100%; margin-bottom: 0px;}
.list-step .step .step-num small{ background: #000; color: #FFF; display: inline-block; padding: 2px 4px; margin-bottom: 4px; }
.list-step .step.current{ background: #ffea00; color: #000;}
.list-step i{ margin: auto 18px; color: #000000; font-size: 20px;}

.step{
  list-style-type: none;
  display:table;
  width:100%;
  padding:0;
  margin:0;
  overflow:hidden;
  border: 2px solid #ffeb00;
  border-radius: 10px;
}
.step li{
  display:table-cell;
  position:relative;
  background: #ffffff;
  height: 70px;
  /* padding: 1em 0.5em 1em 2em; */
  color: #363535;
  font-size: 18px;
  line-height: 70px;
  text-align: center;
  width: calc(100% / 3);
  font-weight: bold;
}
.step li:last-child{
  padding-right: 1em;
}
.step li:last-child:before,
.step li:last-child:after{
  display:none;
}
.step li:before,
.step li:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
}
.step li:before{
  top: -6px;
  right:-1em;
  border-style: solid;
  border-color: transparent transparent transparent #ffeb00;
  border-width: 40px 0 40px 1em;
  z-index: 10;
}
.step li:after{
  top: -9px;
  right: -0.8em;
  border-style: solid;
  border-color: transparent transparent transparent #ffffff;
  border-width: 43px 0 43px 1em;
  z-index: 10;
}
.step li.is-current{
  background: #ffeb00;
  font-weight: bold;
}
.step li.is-current:after{
  border-color: transparent transparent transparent #ffeb00;
}



.form-contact ul{display: table;width: 100%;border-top: 2px solid #d7d7d7;}
.form-contact ul li{ display: table-row;}
.form-contact ul li div{display: table-cell;padding: 37px 12px;border-bottom: 2px solid #d7d7d7;vertical-align: middle;}
.form-contact ul li div.text-title{ width: 30%; vertical-align: top !important; }
.form-contact ul li div.text-title small{/* color: #fff; */padding: 2px 10px;background: #ffeb00;margin: auto 12px;font-size: 13px;font-weight: 300;}
.car-info-contact ul li div{ padding: 12px; border-bottom: 1px dashed #d7d7d7;}
.car-info-contact ul li:last-child div{  border-bottom: none;}
.form-contact ul li div select{
	-moz-appearance: none;
	-webkit-appearance: none;
	-o-appearance: none;
	-ms-appearance: none;
	appearance: none;
	border-radius: 0;
	border: 0;
	margin: 0;
	padding: 0;
	background: none transparent;
	vertical-align: middle;
	font-size: inherit;
	color: inherit;
	font-size: 16px;
	box-sizing: content-box;
}
.style-select {
  overflow: hidden;
  display: inline-block;
  *
  display: inline;
  *
  zoom: 1;
  position: relative;
  border-radius: 0.2em;
  border: 2px solid #d7d7d7;
  /* box-shadow: 0 2px 0 #AAA; */
  background-color: white;
  padding: 0 !important;
}
.style-select > select {
  width: 130%;
  padding: 0.6em 2.4em 0.6em 0.6em !important;
  font-size: 1rem;
}
.style-select:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 1.8em;
  display: block;
  content: "";
  background: url("/contact/images/arrow.png") center no-repeat;
  pointer-events: none;
}


.form-contact ul li div .contact-note{width: 100%;height: 100px;overflow-y: auto;border: 2px solid #d7d7d7;padding: 8px;border-radius: 8px;font-size: 16px;}
.form-contact ul li div input[type="text"]{border: 2px solid #d7d7d7;padding: 8px;border-radius: 6px;font-size: 16px;}
.form-contact ul li div input[type="text"].w100px{ width: 100px;}
.form-contact ul li div input[type="text"].w50px{ width: 50px;}
.form-contact ul li div input[type="text"].w60{ width: 40%;}
.form-contact ul li div input[type="text"].w80{ width: 80%;}
.form-contact ul li div .entry{ border: 2px solid #000; padding: 5px;  background-color: #FFF; cursor: pointer;}
.form-contact ul li div .entry:hover{background: #fff109;}

.comfirm{ padding: 18px 0; text-align: center;}
.confirm input[type="submit"]{
	border-top:none;
	border-left:none;
	border-right:none;

}

.button-confirm{ border: 2px solid #5d5d5d;background-color: #FFF; font-size: 16px; color: #000; padding: 15px 0; text-align: center;  min-width: 150px; display: inline-block;; margin: 20px auto;}
.button-confirm.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active {
    background-color: #fff109;
    color: #000;
}




.button-back{ border: 2px solid #000;
    background-color: #FFF;
    font-size: 16px;
    color: #000;
    padding: 15px 0;
    text-align: center;
    min-width: 150px;
    display: inline-block;
    margin: 20px auto;}
.button-back.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active {
		    background-color: #b1b1b1;
		    color: #000;
		}



.edit_errors {
	border:5px solid #EEE;
	border: 5px solid #EEE;
	background-color: #FFF;
	padding: 10px;
	color: #fd4658;
	font-weight: bold;
	line-height: 1.7em;
	font-size: 16px;
	margin: 40px 0 40px;
	color: #1f93ff;
	text-align: left;
}
.w120{ width: 120px !important;}

@media(min-width:1000px){
	.button-confirm{ min-width: 350px;}
}
@media(max-width:620px){
  .form-contact ul, .form-contact ul li{ display: block;}
  .form-contact ul li div{display: block;width: 100%;padding: 12px;}
  .form-contact ul li div.text-title{ border-bottom: 0; width: 100%;}

  .form-contact ul li div select{ width: 100%;}
  .form-contact ul li div .contact-note{ width: 100%;}
  .form-contact ul li div input[type="text"].w60{ width: 100%;}
  .form-contact ul li div input[type="text"].w80{ width: 100%;}
  .form-contact ul li div .entry{ margin: 4px auto; display: block; text-align: center; font: 14px;}
 .contact-left{ border-bottom: none !important;}
}

@media(max-width:580px){
  .list-step .step{width: 33%; font-size: 14px;}
  .list-step i{ margin: auto 8px;}
}

@media(max-width:480px){
  .list-step .step{width: 33%; font-size: 12px;}
  .list-step .step .step-num{ margin-bottom: 12px;}

	.step li {
		font-size: 14px;
	}
	.step li:last-child {
		padding-right: 0em;
	}
  
}

@media ( max-width:590px) {

	.button-confirm{padding: 21px 19px;}
	.button-back{width: 120px;}
}
