@font-face {
  font-family: wasraiders;
  font-style: normal;
  font-display: swap;
    src: url("../font/wasraiders.woff2") format("opentype");
}
:root {
  --clr-primary-SoftBlue: hsl(220deg 100% 50%);
  --clr-primary-SoftRed: hsl(220deg 100% 50%);
  --clr-secondry-VeryDarkBlue: rgba(37, 43, 70, 0.801);
  --clr-neutral-White: hsl(0, 0%, 100%);
  --clr-neutral-GrayishBlue: hsl(229, 8%, 60%);
  --clr-neutral-VeryDarkBlue: hsl(229, 31%, 21%);
  --clr-neutral-DarkLightBlue: hsl(231, 18%, 36%);
  --clr-neutal-LightBlue: hsl(222, 17%, 89%);
  --clr-primary-White: #ffffff;
  /* Fonts Sizes */
  --font-sm: 0.875rem; /* 14px */
  --font-md: 1.125rem; /* 18px */
  /* Screens Sizes */
  --screen-small: 639px; /* 639px */
}


body {
    font-family: 'Rubik', sans-serif;
    background-color: #fff;
    color: #333;
    margin: 0px;
     text-transform: capitalize;
}
 .signin-section {
    max-width: 600px;
    margin: 40px auto;
    background-color: #fff;
    padding: 30px;
    border-radius: 10px;
}       

input {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 10px;
    width: 100%;
    box-sizing: border-box;
    font-family: montserrat;
    color: #2C3E50;
    font-size: 15px;
}


.header {
position: fixed;
    background-color: #fff;
    top: 0px;
    left: 0px;
    width: -webkit-fill-available;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    display: flex
;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    height: 50px;
}

.header span {
    font-weight: 500;
    text-transform: uppercase;
}


.header__links a {
  font-size: var(--font-sm);
  text-transform: uppercase;
  transition: all 300ms ease-in-out;
}

.header__links a:is(:hover, :focus) {
  color: var(--clr-primary-SoftRed);
}

.header__links a:not(:last-child) {
  margin-right: 1.5625rem; /* 25px */
}
a, a:visited, a:hover {
    color: var(--clr-neutral-VeryDarkBlue);
}
a {
    display: inline-block;
    text-decoration: none;
}


a.btn-blu {
  background-color: var(--clr-primary-SoftRed);
  color: var(--clr-neutral-White);
  padding: 0.5625rem 1.5625rem; /* 9px 25px */
  border-radius: 5px;
  border: 2px solid transparent;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 500;
  transition: all 300ms ease-in-out;
}

a.btn-blu:hover {
  background-color: var(--clr-neutral-White);
  border: 2px solid var(--clr-primary-SoftRed);
  color: var(--clr-primary-SoftRed);
}

.mainbtn-blu {
    background-color: var(--clr-primary-SoftRed);
    color: var(--clr-neutral-White);
    padding: 0.5625rem 1.5625rem;
    border-radius: 5px;
    border: 2px solid transparent;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 500;
    transition: all 300ms ease-in-out;
    cursor: pointer;
}

.mainbtn-blu:hover {
  background-color: var(--clr-neutral-White);
  border: 2px solid var(--clr-primary-SoftRed);
  color: var(--clr-primary-SoftRed);
}




   /* Contact */

.contact {
  background-color: var(--clr-primary-SoftBlue);
  color: var(--clr-neutral-White);
  text-align: center;
  padding: 30px 0;
}

.contact__header {
  margin-bottom: 1.25rem; /* 20px */
}

.contact__header--subtitle {
  font-size: inherit;
  font-weight: 500;
  letter-spacing: 4px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .contact__header--subtitle {
    letter-spacing: 7px;
  }
}

.contact__header--title {
  font-size: 1.5rem;
  font-weight: 500;
  margin-top: 0.5rem; /* 16px */
}

@media (min-width: 768px) {
  .contact__header--title {
    max-width: 700px;
    font-size: 2.2rem; /* 35.2px */
    margin: 2rem auto; /* 2rem => 32px */
  }
}

.contact__form {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

@media (min-width: 768px) {
  .contact__form {
    max-width: 470px;
    flex-direction: row;
    margin: auto;
  }
}
.form__input {
    position: relative;
    width: 100%;
    height: 3.125rem;
    padding: 0 1.25rem;
    border-radius: 5px;
    border: 2px solid transparent;
    outline: none;
    font-family: 'Rubik', sans-serif;
    font-size: 1rem;
    font-weight: 500;
    transition: all 300ms ease-in-out;
    border: 2px solid var(--clr-primary-SoftRed);
      color: var(--clr-primary-White) !important;

}

.form__input:hover {
      color: var(--clr-primary-SoftRed) !important;

}


.form__input--submit {
      background-color: var(--clr-primary-White);
  border: 2px solid var(--clr-primary-White);
  color: var(--clr-primary-SoftRed) !important;
    cursor: pointer;  
}

.form__input--submit:hover {
      color: var(--clr-primary-White) !important;
      background-color: var(--clr-primary-SoftRed);
}

.button_blu {
     position: relative;
    width: 100%;
    height: 3.125rem;
    padding: 0 1.25rem;
    border-radius: 5px;
    border: 2px solid transparent;
    outline: none;
    font-family: 'Rubik', sans-serif;
    font-size: 1rem;
    font-weight: 500;
    transition: all 300ms ease-in-out;
    border: 2px solid var(--clr-primary-SoftRed);   
    color: var(--clr-primary-SoftRed) !important;
    background-color: var(--clr-primary-White);
}



.button_blu:hover {
          background-color: var(--clr-primary-SoftRed);

    color: var(--clr-primary-White) !important;
}





.div_desc {
       
    width: max-content;
    padding: 11px;
    margin: 10px;
    border-radius: 10px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-around;  
}


 /* Footer */
.container--px {
    padding-right: 12.5rem;
    padding-left: 12.5rem;
}
.footer {
  text-align: center;
  background-color: #2c2e2f;
}

.footer .container {
  padding-top: 10px;
  padding-bottom: 10px;
      padding-right: 1.5rem;
    padding-left: 1.5rem;
}

@media (min-width: 768px) {
  .footer .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

.footer__left {

}

@media (min-width: 768px) {
  .footer__left {
    display: flex;
    align-items: center;
  }
}

.footer__left--logo {
  margin-bottom: 1.875rem; /* 30px */
}

@media (min-width: 768px) {
  .footer__left--logo {
    margin-bottom: 0;
    margin-right: 3.125rem; /* 50px */
  }
}

.footer__left--logo i {
  padding: 8px;
}

.footer__left--logo span {
  font-size: 1.4375rem; /* 23px */
  color: var(--clr-neutral-White);
}

.footer__left--links {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 1.25rem; /* 20px */
}

@media (min-width: 768px) {
  .footer__left--links {
    margin: 0;
    flex-direction: row;
    gap: 0 1.25rem; /* 0 20px */
  }
}

.footer__left--links li a {
  color: var(--clr-neutal-LightBlue);
  text-transform: uppercase;
  letter-spacing: 2px;
  transition: color 300ms ease-in-out;
}

@media (min-width: 768px) {
  .footer__left--links li a {
    font-size: 14px;
  }
}

.footer__left--links li a:is(:hover, :active) {
  color: var(--clr-primary-SoftRed);
}

.footer__right--icons {

}

.footer__right--icons a {
  color: var(--clr-neutral-White);
  font-size: 35px;
  margin: 20px 10px;
  transition: color 300ms ease-in-out;
}

.footer__right--icons a:is(:hover, :active) {
  color: var(--clr-primary-SoftRed);
}

/* (: */
    /* FAQS */

.faqs{
  max-width: 38.75rem; /* 620px */
  margin: auto;
  text-align: center;

}

.faqs__info {
  
}

.faqs__info p {
  color: var(--clr-neutral-GrayishBlue);
  font-size: 1.2rem; /* 19.2px */
}

.faqs__questions {

}

.questions__question {
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 2px solid var(--clr-neutal-LightBlue);
  padding-right: 50px;
}

.question__input-radio {
  position: absolute;
  top: 0;
  left: 0;
  appearance: none;
  opacity: 0;
}

.question__info {
  height: 3.125rem; /* 50px */
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.question__info h3 {
  margin: 0;
  font-weight: 500;
  font-size: 1.25rem; /* 20px */
  text-align: left;
  transition: color 300ms ease-in-out;
}

.question__info:hover > h3 {
  color: var(--clr-primary-SoftRed);
}

.question__info > span {
  position: absolute;
  right: 0;
  display: block;
  min-width: 1.25rem; /* 20px */
  min-height: 1.25rem; /* 20px */
}

.question__info > span i {
  font-size: 3.125rem; /* 50px */
  color: var(--clr-primary-SoftBlue);
}

.question__input-radio:checked ~ .question__info > span i {
  transform: rotate(-180deg);
}

.question__text {
  height: 0;
  overflow: hidden;
  text-align: left;
}

.question__input-radio:checked ~ .question__text {
  height: auto;
}

.faqs .faqs__cta {
  background-color: var(--clr-primary-SoftBlue);
  color: var(--clr-neutral-White);
  padding: 1rem 1.875rem; /* 16px 30px */
  border-radius: 5px;
  font-size: 1rem; /* 16px */
  margin-top: 1.25rem; /* 20px */
  transition: opacity 300ms ease-in-out;
}

.faqs .faqs__cta:is(:hover, :active) {
  opacity: 0.8;
}
















.mobail_mode {
        margin-right: 10%;margin-left: 10%;
}





@media (max-width: 500px) {
  .displaynone {
    display: none;
  }

  .sceFVR {
    width: 100% !important;
    margin: 20px;
  }
  .RYCGR {
    flex-direction: column;
    align-items: flex-start !important;
  }
  .faqs__questions {
    margin: 20px;
  }
  .footer .container22 {
     padding-top: unset !important; 
     padding-bottom: unset !important; 
}
.container22--px {
     padding-right: unset !important; 
     padding-left: unset !important;
}


.container22 {
    flex-direction: column;
        margin: 20px !important;width: -webkit-fill-available !important;
}
.info {
    margin-left: unset !important; 
}
.mobail_mode {
        margin: 20px !important;
}
..info{
    margin-left : 0px !important;
}

.car-image {
  width: 100% !important; 
      margin-bottom: 20px;

}


}