 
#msform { position: relative;margin-top: 20px;   max-width: 1200px; width: 100%; margin-bottom:5rem; margin: auto;  border: solid 1px #e7e7e7;}
#progressbar { padding: 0; padding-top: 3rem; margin: 0 auto;overflow: hidden;color: lightgrey; display: flex; justify-content:space-between; list-style: none; background: linear-gradient(180deg, #f0f0f0, #f2f2f2, #f4f4f4, #f6f6f6, #f9f9f9, #fbfbfb, #fdfdfd, #ffffff);   position: relative; border-bottom: solid 1px #e7e7e7}
#progressbar li .step{ width: 56px; height: 56px; background: #fff;  border: solid 2px #dcdcdc; border-radius: 56px; display: flex; flex-direction: column; justify-content: center; align-items: center; font-family:'Montserrat'; color: #818181; box-sizing: border-box; padding-top: 5px; position: relative; margin: auto; z-index: 1}
#progressbar li .step i{display: block; font-style: normal; font-size: 17px; font-weight: 700; position: relative;}
#progressbar li .step span{display: block; font-size: 9px; font-weight: 600;  position: relative;}
#progressbar li .step:before{ width: 44px; height: 44px; border-radius: 44px; background: #dfdfdf;position:absolute;top:4px;left:0; right: 0; margin: auto; content: '';}
#progressbar li {text-align: center; width: 241px; position: relative}
#progressbar li.active .step{    color: #fff; border-color: #e11f26}
#progressbar li.active .step:before{background: #e11f26}
#progressbar li p{font-size: 12px; padding-top: .25rem}
#progressbar li.active P{ color: #e11f26}
#progressbar li:after {content: '';width: 100%;height: 5px;background: #c1c1c1;position: absolute;left: 6rem;top: 25px;z-index: 0}
#progressbar li:before { width: 20px; height: 21px; content: ''; position: absolute; right: -13px; top: 1rem; z-index: 2; background: url('../images/arrow.png')}
#progressbar li:last-child:after, #progressbar li:last-child:before{display: none}
.numberposition{position:absolute;right:40.5%; top:22px}
.phone{ padding-left:15px !important; border-left:none !important; border-bottom:1px solid #b8b8b8; border-top:1px solid #b8b8b8; border-right:1px solid #b8b8b8}
.code{ background-color:#f0f0f0; font-size:15px; padding-left:7px; padding-right:1px; width:60px}

#msform fieldset {background: white;box-sizing: border-box;width: 100%;margin: 0;padding-bottom: 20px;position: relative; padding: 3rem 2rem}
#msform fieldset:not(:first-of-type) {    display: none}
#msform fieldset h2{font-size: 22px; font-weight: 700}
#msform fieldset h3{font-size: 18px;  }
#msform fieldset label{ display: block}
#msform fieldset label .input_data{ display:block;max-width: 500px; width: 100%;padding: .7rem 1rem;margin-top:1.5rem; margin-bottom:2rem; font-size: 22px; font-weight: 700}
#msform fieldset p{margin-bottom: 0; line-height: 32px;}
#msform fieldset button.action-button,.edit-action,.contact-action{ background: #e11f26; display: inline-block; padding: 1rem 3rem; color: #fff; cursor: pointer; font-size: 20px;  font-family:'Montserrat'; border-radius: 3px; margin-top: 2.5rem;  border: solid 1px #e11f26; font-weight: 600}
#msform fieldset button.action-button img,.edit-action img,.contact-action img{display: inline-block; margin-left:.5rem;  transform: translateX(0); transition: all .3s}
#msform fieldset button.action-button:hover img,.edit-action:hover img,.contact-action:hover img{ transform: translateX(5px)}
.edit-action,.contact-action{ margin-top:0px}

#msform fieldset button.previous {background: none; display: inline-block; padding: 1rem 3rem; color: #e11f26; cursor: pointer; font-size: 20px;  font-family:'Montserrat'; border-radius: 3px; margin-top: 3rem; border: solid 1px #e11f26; font-weight: 600; text-align: center}
#msform fieldset button.previous img{display: inline-block; margin-right:.0;  transform: translateX(0); transition: all .3s}
#msform fieldset button.previous:hover{background: #e11f26; color: #fff}
#msform fieldset button.previous:hover img{ transform: translateX(-5px); filter: brightness(0) invert(1)}

#msform fieldset label textarea{ display:block;max-width: 600px; width: 100%;padding: .8rem 1rem; border:solid 1px #b8b8b8  }
.edit-action11{ background: #e11f26; display: inline-block; padding: 0.8rem 2.5rem; color: #fff; cursor: pointer; font-size: 20px;  font-family:'Montserrat'; border-radius: 3px; margin-top: 0.6rem;  border: solid 1px #e11f26; font-weight: 600}
.edit-action11:hover{ color:#fff}

.database_details{display: flex; align-items: center;  padding:2rem 2rem; padding-right: 0; border-bottom: solid 1px #e8e7e7; padding-bottom: 3rem}
.no_of_datavbse{display: flex; align-items: center}
.no_of_datavbse span, .no_of_datavbse a{display: inline-block}
.no_of_datavbse span{margin: 0   1rem}
.no_of_datavbse  span.quanty{ font-size:35px; font-weight: 700; font-family:'Montserrat'; margin: 0 1rem; margin-left: 1rem;}
.no_of_datavbse a{ font-size: 14px; font-weight: 700; color: #a8a8a8; display: flex; align-items: center}
.no_of_datavbse a span{margin: 0; padding-left: .25rem; display: inline-block; text-decoration: underline; padding-top: 5px}

.analysis{display: flex; align-items: center;}
.analysis{display: flex; align-items: center}
.analysis span, .no_of_datavbse a{display: inline-block}
.analysis span{margin: 0   1rem; }
.analysis  span.quanty{ font-size:35px; font-weight: 700; font-family:'Montserrat';   margin-left: .5rem }
.analysis span i{display: block; font-style: normal; font-size: 13px; color: #616161}

.v_line{width: 1px; background: #e8e7e7; height: 51px; margin: 0 2rem}


#msform fieldset .payment_form label{display: flex; width: 100%; padding: .25rem 0; max-width: 520px;}
#msform fieldset .payment_form label input.name{width: 100%; padding: 1rem .5rem; border:solid 1px #b8b8b8}
#msform fieldset .payment_form label input::placeholder{color: #181617}
#msform fieldset .payment_form label input.email, .payment_form label input.phone{ padding: 1rem .5rem; width: 48.5%;border:solid 1px #b8b8b8}
#msform fieldset .payment_form label input.phone{margin-left: auto}
#msform fieldset .payment_form label select.country{width: 100%; padding: 1rem .5rem; appearance: none;-webkit-appearance: none; background: url("../images/arrow-down.png") no-repeat; background-position: 101% 42%;   background-size: 56px 59px; }
select.databasecount,select.databasesize{width: 100%; padding: 0.9rem .5rem .9rem 1rem; appearance: none;-webkit-appearance: none; background: url("../images/arrow-down.png") no-repeat; background-position: 101% 42%;   background-size: 56px 59px;max-width:500px }
select.databasecountdown{width: 100%; padding: 0.9rem .5rem .9rem 1rem; appearance: none;-webkit-appearance: none; background: url("../images/arrow-down.png") no-repeat; background-position: 101% 42%;   background-size: 56px 59px;width:300px }


#msform fieldset  label.check_sec { display: block; position: relative;  padding-left: 2rem;  cursor: pointer;  font-size: 16px;  -webkit-user-select: none;
  -moz-user-select: none;  -ms-user-select: none;  user-select: none; background: #fff; margin-top: 2rem }

.check_sec input {  position: absolute;  opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
span.checkmark {  position: absolute;  top: 3px;  left: 0;  height: 20px;  width: 20px;   background-color: #fff; padding: 0; border: solid 1px #888}
.check_sec:hover input ~ .checkmark {  background-color: #ccc;}
.check_sec input:checked ~ .checkmark {  background-color: #454545;}
.checkmark:after {  content: "";  position: absolute;  display: none;}
.check_sec input:checked ~ .checkmark:after {  display: block;}
.check_sec .checkmark:after{left:7px;top:4px; width:5px;height:10px;border:solid white; border-width:0 2px 2px 0; transform: rotate(45deg);}

#msform fieldset label.radio-container {display:inline-block;position:relative; padding:0 25px; cursor:pointer;font-size:14px;user-select:none;font-weight:600; width: 110px; margin-bottom: 1rem}
label.radio-container input.radio_btn { position:absolute; opacity:0; cursor: pointer;}
.checkmark-radio { position:absolute;top: 0;left:0;height:18px;width: 18px;background-color:#fff; border-radius:50%;border:solid 1px #000;}
label.radio-container:hover input.radio_btn ~ .checkmark-radio {background-color:#ccc;}
label.radio-container input.radio_btn:checked ~ .checkmark-radio {border:solid 1px #e11f26}
.checkmark-radio:after { content: ""; position: absolute; display: none;}
label.radio-container input.radio_btn:checked ~ .checkmark-radio:after { display: block;}
label.radio-container .checkmark-radio:after {	top: 2px;left: 2px;width: 12px;	height: 12px;border-radius: 50%;	background: #e11f26;}

.confirm-dis{font-size: 15px}
.term_a{color: #e11f26;}
.term_a:hover{text-decoration: underline; color: #e11f26}
.trams_ul li{ color: #656565; padding:5px 0}
.pyment_done{ font-size: 34px; font-weight: 700; text-align: center; padding-top: 1rem  }
.upload_btn{ background: #e11f26; display: inline-block; padding: 1rem 2rem; color: #fff; cursor: pointer; font-size: 20px;  font-family:'Montserrat'; border-radius: 3px; margin-top: 3rem;  border: solid 1px #e11f26; font-weight: 600}
.upload_btn img{margin-right: .5rem}
.upload_btn:hover, .upload_btn:focus{color: #fff}

.database_table{width: 100%; border-color: #d9d9d9 }
.database_table th{ background: #e5e5e5; padding: 1rem; text-align: center}
.database_table td{padding: 1rem; text-align: center}
.database_table th:first-child, .database_table td:first-child{text-align: left}
.database_table td:nth-child(2){color: #e11f26; font-weight: 600}
.recommend{ font-size:11px; color:#999}
.msg-block{ display:none; margin-bottom:-22px}

.payment_head{display: flex; align-items: center; justify-content: center}
.green_tick{ display: inline-block;  width: 38px; height: 38px; border-radius: 38px; background: #0aa54f; position: relative; margin-right: 1rem;}
.green_tick:before{content: "";display: block;width: 11px;height: 20px;border: solid #fff;border-radius:3px;border-width: 0 3px 3px 0px;transform: rotate(
45deg);position: absolute;top: 8px;left: 0; right: 0; margin: auto}
.upload_file{border: solid 1px hsl(0deg 0% 0% / 30%); background: #e11f26; font-size: 15px; padding-left:1rem; padding-right: 0; color: #fff ; outline:none; border-radius: 2px; max-width: 295px; width: 100%; margin: auto}
.upload_file span{display: inline-block; padding: 1rem 1rem; padding-left: 1rem; border-left: solid 1px #fff; margin-left: 1rem; outline: 0; }
.upload_file:focus{outline: none; box-shadow: 0 0 10px  hsl(0deg 0% 0% / 30%);}
.upload_file:focus span{background: #C1171D}
.file_menu{max-width: 295px; width: 100%}
.instructions ul{ list-style: none; padding-left: 0}
.instructions ul li {padding-left: 22px;margin: 8px 0;line-height: 30px;background-position: 0 10px;position: relative;}
.instructions ul li:before{content: "";display: block;width: 6px;height: 12px;border: solid #181617;border-width: 0 2px 2px 0;transform: rotate(45deg);position: absolute;
top: 8px;left: 5px;}

.dropbax_link{text-decoration: underline}
.img_filter{filter: drop-shadow(1px 1px 1px #757575)}

 ul.nav.file_repair_icon{list-style: none; display: flex;  padding: 0; flex-wrap: nowrap; max-width: 1001px; width: 100%; margin: auto}
.file_repair_icon li  {padding: 0 1.4rem; text-align: center; position: relative; margin: 2.5rem 0;}
.file_repair_icon li:first-child{padding-left: 0}
.file_repair_icon li a{padding: 1.5rem .9rem; display: block;  border: solid 1px #f3f3f3;  min-height: 100%}
.file_repair_icon li span{display: block; font-weight: 600; font-size: 16px; margin-top: 1rem} 
.file_repair_icon li:after{ width: 31px;  height: 31px; background: #fff; border-radius: 100%; position: absolute; right:-1rem; top:5rem; content: '';}
.file_repair_icon li:before {content: "";display: block;width: 10px;height:10px;border: solid #9f9d9d;border-width: 0 2px 2px 0;transform: rotate(-45deg
);position: absolute; right:-4px; top:5.7rem; z-index: 1}
.file_repair_icon li:last-child:after, .file_repair_icon li:last-child:before{display: none}
.file_repair_icon li a.active{background: #f6f6f6; display: block; border: solid 1px #e9e9e9}
.step_sec{ background: #ffffff; padding:1.5rem 2rem; border: solid 1px #e9e9e9; width: 100%; max-width: 1001px; margin: auto; display: flex; position: relative; margin-bottom: 4rem;align-items: center}
.left_step span{ font-family: 'Montserrat'; font-size: 14px; font-weight: 700; display: block; color: #e11f26}
.left_step i{ font-style: normal; font-family: 'Montserrat';  font-size: 35px; font-weight: 700; line-height: 35px}
.left_step {padding: 0 2rem; text-align: center;  position: relative;}
.left_step:before{ width: 1px; height: 100%; content: ''; position: absolute; right: 0; top: 0; background: linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(196,196,196,1) 49%, rgba(0,0,0,0) 100%);}
.step_sec p{ padding-left: 2rem; margin-bottom: 0; padding-bottom: 0; line-height: 28px; padding-top: .8rem}
.vinput input,.vinput input:focus{font-weight:600; border:solid 1px #fff; padding:1px 2px; width:87%;outline: none;color:#181617}
.vinput.active input,.vinput.active input:focus{border:1px solid #b8b8b8;}
.vinput.active select{border:1px solid #b8b8b8;-o-appearance: auto;
   -ms-appearance: auto;
   -webkit-appearance: auto;
   -moz-appearance: auto;
   appearance: auto;}
.vinput select{font-weight:600; border:solid 1px #fff; padding:1px 2px; width:87%;outline: none;-o-appearance: none;
   -ms-appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none; background-color:#fff}
   .vinput select:disabled{ color:#000;opacity:1}
.step_tab{min-height: auto !important}
.eedit,.esubmit{ cursor:pointer}
 
@media screen and (max-width:1024px){

.file_repair_icon li{padding: 0 .5rem} 
.file_repair_icon li a{padding: 1.5rem .5rem;}
.file_repair_icon li:before, .file_repair_icon li:after{display: none}
.file_repair_icon li span{font-size: 14px;}

}


@media screen and (max-width:1024px){
.database_details{padding: 2rem .5rem}
.v_line{display: none}
.analysis span.quanty{font-size: 24px}
.no_of_datavbse{padding-right: 1rem}
}


@media screen and (max-width:992px){
#progressbar li:before{ display: none}
#progressbar li P{font-size: 12px;}
.confrom_step .no_of_datavbse, .confrom_step .analysis{ flex-direction: column}
.confrom_step .database_details {justify-content: space-around; align-items: baseline;}
.confrom_step .no_of_datavbse img, .confrom_step .analysis img{margin: 1rem 0}
   table.database_table{display: block; overflow: scroll; white-space: nowrap}

}

@media screen and (max-width:767px){
    #progressbar li:after{display: none}
    #progressbar{flex-wrap: wrap;     justify-content: center;}
    #progressbar li{width: auto; padding: .5rem}
    #msform fieldset{text-align: center}
    #msform fieldset a.previous, #msform fieldset button.action-button{    padding: 1rem 2rem;}
    .database_details{flex-direction: column; text-align: left}
    .analysis{width: 100%; margin-top: 1rem}
    .radio-sec{justify-content: center}
    #msform fieldset .payment_form label{flex-direction: column}
    #msform fieldset .payment_form label input.phone{margin-top: 1rem}
    #msform fieldset .payment_form label input.email, .payment_form label input.phone{width: 100%}
    .confrom_step .no_of_datavbse, .confrom_step .analysis{flex-direction: row}
    .no_of_datavbse span.quanty{font-size: 24px;     margin: 0 .5rem;}
    .trams_ul{text-align: left}
    .pyment_done{font-size: 24px;}
    #msform fieldset label.check_sec{text-align: left}
    
}
 
 