body {

  padding-top: 80px;

}



#repairTypes {

  width: 100%;

}



.clipped-nav {

  height: 60px;

  top: 0px;

  left: 0px;

  width: 100%;

  background-color: white;

  border-bottom: 1px solid #ECECEC;

  position: fixed;

  z-index: 999999;

}



.clipped-nav .exit,

.clipped-nav .member {

  float: left;

  width: 50%;

  margin: 0px;

  padding: 0px;

  line-height: 60px;

}



.clipped-nav .exit:hover,

.clipped-nav .member:hover {

  cursor: pointer;

}



.clipped-nav .member {

  text-align: right;

  font-size: 13px;

  color: #1B009E;

  padding-right: 20px;

}



.clipped-nav .exit {

  font-size: 13px;

  color: #3B3B3B;

  text-transform: uppercase;

  font-weight: bold;

  padding-left: 20px;

}



.form-register {

  margin-bottom: 60px;

}



.clipped-logo {

  position: absolute;

  height: 50px;

  top: 5px;

  left: 50%;

  margin-left: -64px;

}



@media (max-width:600px) {

  .clipped-logo {

    width: 90px;

    height: 27px;

    top: 16px;

    margin-left: -45px;

  }



  .clipped-nav a[href='/login'] {

    transform: scale(0.6);

  }

}



.form-control {

  margin-bottom: 12px;

}



#vehicleInspection {

  display: none;

}



tbody img {

  max-width: 160px;

}



.buttonInfo,
.buttonAddAddOn {

  border: 1px #C4C4C4 solid;

  border-radius: 20px;

  font-size: 14px;

  line-height: 30px;

  padding-top: 5px;

  padding-bottom: 5px;

  text-align: center;

  text-transform: uppercase;

  color: #1B009E;

  background-color: white;

  background-image: url('/assets/down-arrow.svg');

  background-position-x: calc(100% - 12px);

  background-position-y: 50%;

  background-repeat: no-repeat;

  background-size: 16px 12px;

  appearance: none;

  outline: none;

  margin-bottom: 10px;

  padding-left: 16px;

  padding-right: 32px;

}



.buttonAddAddOn {

  background-color: #1B009E;

  color: white;

  padding-right: 16px;

}



.buttonInfo:hover,
.buttonAddAddOn:hover {
  cursor: pointer;
}



.stripe {

  display: block;

  margin: 0px auto;

  width: 220px;

  max-width: 80%;

  padding: 15px;

  border-radius: 10px;

  margin-top: 40px;

  border: 1px solid #C4C4C4;

  background: white;

}



.stripe img {

  max-width: 60%;

  margin-top: 10px;

}



.heading-toggle {

  display: inline-block;

  float: right;

}



.heading-toggle:hover {

  cursor: pointer;

}



.py-5 {

  padding-top: 0px !important;

  padding-bottom: 0px !important;

  overflow: hidden;

}



#spotCheck {

  overflow: scroll;

}



.selectedAddOn {

  background-color: #009e3f !important;

  background-image: none !important;

}



.selectedAddOn:before {

  content: '';

  display: inline-block;

  margin-right: 10px;

  width: 9px;

  height: 12px;

  border: solid white;

  border-width: 0 2px 2px 0;

  transform: rotate(45deg);

}



.fas.fa-camera {

  margin-right: 10px;

}







#step3 {

  overflow-y: scroll;

  overflow-x: hidden;

}



td img {

  width: 155px;

}



td {

  padding: 6px;

  border-bottom: 1px solid #c0c0c0;

  padding-top: 30px;

  padding-bottom: 15px;

}



.info {

  box-sizing: border-box;

  border: 1px solid #C4C4C4;

  border-radius: 20px;

  padding-left: 20px;

  padding-right: 20px;

  padding-top: 8px;

  padding-bottom: 8px;

  color: #1B009E;

  font-size: 14px;

  font-weight: 600;

  line-height: 21px;

  text-align: center;

  -webkit-appearance: none;

  background-color: white;

  text-transform: uppercase;

}



.select {

  font-size: 30px;

  -webkit-appearance: none;

  background-color: white;

  font-weight: 600;

  border: none;

  color: #b3b3b3;

}



.select:hover {

  color: #1B009E;

}



.select:focus {

  color: #b3b3b3;

}



.select.selected {

  color: #1B009E;

}



.info .fa {

  color: #1B009E;

  font-size: 14px;

  font-weight: 600;

  margin-left: 10px;

}



.selectedRepairTypeMedia {

  display: none;

}



.selectedRepairTypeMedia input {

  width: 145px;

}



.submitBooking {

  border-radius: 30px;

  background-color: #1B009E;

  color: #FFFFFF;

  font-size: 18px;

  font-weight: 600;

  text-align: center;

  padding-left: 25px;

  padding-right: 25px;

  padding-top: 10px;

  padding-bottom: 10px;

  -webkit-appearance: none;

  border: none;

  margin-top: 30px;

  margin-bottom: 50px;

}



.infoButton {

  display: none;

}



#vehicleAge,
label[for=vehicleAge] {

  display: none;

}



.searchButton {

  font-size: 14px;

  line-height: 30px;

  padding-top: 5px;

  padding-bottom: 5px;

  text-align: center;

  text-transform: uppercase;

  color: white;

  font-weight: 900;

  background-color: #1B009E;

  border-radius: 20px;

  padding-left: 30px;

  padding-right: 30px;

  width: auto;

  border: 1px solid #1B009E;

  outline: none !important;

}



.manualButton {

  font-size: 14px;

  line-height: 30px;

  padding-top: 5px;

  padding-bottom: 5px;

  text-align: center;

  text-transform: uppercase;

  color: #1B009E;

  font-weight: 900;

  background-color: white;

  border-radius: 20px;

  padding-left: 30px;

  padding-right: 30px;

  width: auto;

  border: 1px solid #1B009E;

  outline: none !important;

  margin-left: 20px;

}



#vinNumber {

  margin-top: 20px;

}



#step3 {

  -ms-overflow-style: none;
  /* for Internet Explorer, Edge */

  scrollbar-width: none;
  /* for Firefox */

  overflow-y: scroll;

}



#step3::-webkit-scrollbar {

  display: none;
  /* for Chrome, Safari, and Opera */

}



@media(max-width: 767px) {

  .uploadedPhoto {

    max-width: 80%;

  }



  .selectedRepairTypeMedia input {

    width: auto;

  }



  div[name='filedrag'] {

    width: auto !important;

  }



  .input-group {

    width: auto;

  }



  .col-md-3 img {

    width: 100% !important;

  }



  .col-md-4 {

    padding-left: 20px !important;

    padding-right: 20px !important;

    padding-top: 10px;

  }



  .col-md-1 {

    padding-top: 20px;

    padding-bottom: 20px;

    padding-left: 20px !important;

    padding-right: 20px !important;

    width: 35% !important;

    text-align: center;

    margin: auto;

  }



  .titleCol {

    width: 60% !important;

  }



  span.group-span-filestyle {

    text-align: center;

    width: 165px;

    margin-left: auto;

    margin-right: auto;

    padding-top: 20px;

    padding-bottom: 20px;

  }

}





/* James Additions 8 Nov 2021 */



#phone-enquiry {

  width: 160px;

  padding: 10px 20px;

  background-color: #1B009E;

  color: white;

  font-size: 14px;

  position: fixed;

  bottom: 20px;

  right: 20px;

  border-radius: 50px;

  font-weight: 600;

  text-align: center;

  z-index: 200;

}



#phone-enquiry img {

  width: 12px;

  height: auto;

  display: inline-block;

  margin-right: 5px;

  margin-bottom: 2px;

}



.repair-booking-details {

  background-color: #ededed;

  padding: 30px 40px;

  border-radius: 20px;

}



.repair-booking-form {

  padding: 20px 50px;

}



.how-it-works {

  background-color: #fff;

  padding: 20px 15px;

  display: flex;

  margin-bottom: 15px;

}



.how-it-works .first {

  width: 25%;

  float: left;

  display: flex;

}



.how-it-works .last {

  width: 75%;

  float: left;

}



.how-it-works p {

  margin-bottom: 0px;

}



.searchButton {

  margin-left: 10px;

  line-height: 22px;

  font-size: 13px;

  padding: 5px 10px;

  top: -2px;

  position: relative;

}



#vehicleRegistration {

  display: inline-block;

  width: 70%;

}



.select-rt {

  position: absolute;

  right: 10px;

  bottom: 10px;

  padding: 5px 10px;

  color: #1B009E;

  border: 1px solid #e4e4e4;

  font-size: 13px;

  border-radius: 50px;

  font-weight: 600;

  text-align: center;

}



.select-rt.selected {

  background-color: #1b009e;

  color: white;

}



.repairTypeQuantityLabel {

  font-size: 12px;

  line-height: 30px;

  display: inline-block;

  margin-right: 10px;

}



.repairTypeQuantityInput {

  height: 30px;

  width: 50px;

  display: inline-block;

}



.rt-card {

  border: 1px solid #e4e4e4;

  border-radius: 20px;

  overflow: hidden;

}



.selectedRepairTypeMedia {

  background-color: #e4e4e4;

  padding: 10px 20px;

  min-height: 80px;

}



.uploadedImage {

  width: 100px;

  display: inline-block;

  margin-right: 20px;

  margin-bottom: 20px;

}



.uploadedPhoto {

  width: 100%;

}



form.spotCheckUpload {

  width: 220px;

  position: absolute;

  right: 0px;

}

.repairRequestGuide {
  width: auto;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  min-height: 50vh;
}

@media (max-width:768px) {

  #phone-enquiry {

    top: 65px;

    bottom: unset;

    right: 5px;

  }

  .submitBooking {

    margin-bottom: 50px;

  }

  span.group-span-filestyle {

    width: unset !important;

  }

  form.spotCheckUpload {

    position: unset !important;

  }

  .selectedRepairTypeMedia {

    text-align: center;

  }



  .repair-booking-details {

    display: none;

  }

  .repair-booking-form {

    padding: 20px;

  }

  #vehicleRegistration {

    width: 50%;

  }

}