/* Row 1 */
.row1 {
  height: 100%;
  min-height: 100%;
  display: flex;
  align-items: stretch;
  z-index: 2;
  position: relative;
  justify-content: space-between;
}
.row1 .formBlock {
  display: flex;
  align-items: center;
}
.row1 .requestCarPurchaseOfferForm {
  text-align: left;
  padding: var(--unit_x18);
  margin: 0 auto 0px 0px;
}
.row1 form[name="requestCarPurchaseOfferForm"] {
  width: 100%;
}
.row1 .requestCarPurchaseOfferForm .backLabelArea {
  margin-top: var(--unit_x14);
  text-align: center;
  /*display: none;*/
  cursor: pointer;
  width: 100%;
}

.requestCarPurchaseOfferForm .stepElm[data-stepnr] .body .radios {
  display: flex;
  justify-content: left;
}
.requestCarPurchaseOfferForm .stepElm[data-stepnr] .body .radios .input_radio:first-child {
  margin-right: var(--unit_x100);
}
.requestCarPurchaseOfferForm .stepElm[data-stepname] .buttons {
  margin-top: var(--unit_x14);
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname] .body .infoTxt {
  margin-bottom: var(--unit_x14);
}
.requestCarPurchaseOfferForm .stepElm[data-stepname] .buttons a,
.requestCarPurchaseOfferForm .stepElm[data-stepname] .buttons button {
  width: 100%;
}
/* step_uploadOffer */

.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea {
  background-color: var(--col_pd100);
  border: 1px var(--col_pd50) dashed;
  border-radius: var(--unit_x5);
  height: var(--unit_x145);
  padding: 0px var(--unit_x40);
  color: var(--col_pl10);
  font-size: var(--unit_x10);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  cursor: pointer;
  position: relative;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea.error {
  border-color: var(--col_pr60);
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea input {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .imgPreviewBox {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-start;
  align-items: flex-start;
  position: absolute;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 90%;
  top: 5%;
  left: 0px;
  padding: 10px;
  overflow-y: scroll;
  z-index: 10;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .imgPreviewBox .prevImg {
  position: relative;
  width: 33%;
  height: 50%;
  border-radius: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .imgPreviewBox .prevImg:hover:before {
  content: ' ';
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  border-radius: 5px;
  background-color: rgba(255,255,255,0.8);
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .imgPreviewBox .prevImg:hover:after {
  content: url("data:image/svg+xml,%3Csvg width='16px' height='16px' fill='currentColor' viewBox='0 0 16 16' class='bi bi-trash' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/%3E%3Cpath fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4L4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/%3E%3C/svg%3E");  position: absolute;
  left: 0px;
  top: calc(50% - 8px);
  width: 100%;
  height: 100%;
  fill: red;
  color: red;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .imgPreviewBox .prevImg:nth-child(n+4) {
  margin-top: 10px;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea .uploadInProgressBox {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 0;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: none;
}
.row1 .requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .uploadArea input[type="file"] {
  z-index: 0;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea {
  background-color: var(--col_pd100);
  border: 1px var(--col_pd50) dashed;
  border-radius: var(--unit_x5);
  height: var(--unit_x48);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea input {
  color: var(--col_pl10);
  font-size: var(--unit_x10);
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
  text-align: center;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea.error {
  border-color: var(--col_pr60);
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: var(--col_pl10); opacity: 1; /* Firefox */ }
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: var(--col_pl10); }
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .linkArea input::-ms-input-placeholder { /* Microsoft Edge */ color: var(--col_pl10); }
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_uploadOffer"] .betweenLabel {
  color: var(--col_pl50);
  text-align: center;
  margin: var(--unit_x8) 0px;
  font-size: var(--unit_x10);
}
.requestCarPurchaseOfferForm .progressBarSteps {
  margin-top: var(--unit_x18);
}

.requestCarPurchaseOfferForm .overviewDataLine {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
  flex-direction: row;
  margin-bottom: var(--unit_x16);
}
.requestCarPurchaseOfferForm .overviewDataLine .overviewPreview {
  min-height: var(--unit_x170);
  background-color: var(--col_pd100);
  border: 1px var(--col_pd50) dashed;
  border-radius: var(--unit_x5);
  position: relative;
}
.requestCarPurchaseOfferForm .overviewDataLine .overviewPreview.linkPreview {
  min-height: var(--unit_x25);
}
.requestCarPurchaseOfferForm .overviewDataLine .overviewPreview.linkPreview .previewBox {
  overflow-y: hidden;
  overflow-x: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.requestCarPurchaseOfferForm .overviewDataLine .overviewPreview.linkPreview .previewBox::-webkit-scrollbar { display: none; }

.requestCarPurchaseOfferForm .overviewDataLine .overviewPreview .previewBox {
  position: absolute;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 90%;
  height: 90%;
  top: 5%;
  left: 5%;
}
.requestCarPurchaseOfferForm .overviewDataLine .info {
  margin-bottom: 0;
}
.requestCarPurchaseOfferForm .overviewDataLine .dataElm {
  margin-bottom: var(--unit_x16);
}

.requestCarPurchaseOfferForm .stepElm[data-stepname] .buttons {
  margin-top: var(--unit_x14);
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_overview"] .thumbnailBox .previewBox {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: flex-start;
  justify-content: flex-start;
  align-items: flex-start;
  overflow-y: scroll;
  max-height: 280px;
}
.requestCarPurchaseOfferForm .stepElm[data-stepname="step_overview"] .thumbnailBox .previewBox .prevImg {
  position: relative;
  width: 48%;
  height: 50px;
  border-radius: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  justify-content: space-between;
  margin-top: 10px;
}




.nav_scrollElm {
  display: block;
  z-index: 3;
}
@media (max-height:720px) and (min-width:998px) {
  .nav_scrollElm {
    display: none;
  }
}



.spaceTop {
  margin-top: var(--unit_x14);
}
.spaceDown {
  margin-bottom: var(--unit_x14);
}
