/* mediaquery */
:root {
  --color-primary: #5dafe0;
  --color-secondary: #000;
  --color-tertiary: #B565E0;
  --color-navy: #304671;
  --color-navy-dark: #121e3a;
  --color-primary-dark: #1c6fad;
  --color-primary-light: #eef4fb;
  --color-white: #FFF;
  --color-black: #000;
  --color-grey: #6c757d;
  --color-lightgrey: #fafafa;
  --background-error: #f8d7da;
  --border-error: #f5c6cb;
  --color-error: #721c24;
  --background-info: #cce5ff;
  --border-info: #b8daff;
  --color-info: #004085;
  --background-warning: #fff3cd;
  --border-warning: #ffeeba;
  --color-warning: #856404;
  --background-success: #d4edda;
  --border-success: #c3e6cb;
  --color-success: #155724;
  --font-primary: quicksand;
  --font-secondary: quicksand; }

.quote .cotizador .wrap-box-custom {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  gap: 20px; }
  @media only screen and (max-width: 768px) {
    .quote .cotizador .wrap-box-custom {
      flex-direction: column; } }
  .quote .cotizador .wrap-box-custom .box-model {
    width: 50%;
    display: grid;
    grid-template-areas: "title title" "text ico" "btn ico";
    grid-template-columns: auto 1fr;
    gap: 10px;
    background: rgba(255, 255, 255, 0.7); }
    @media only screen and (max-width: 768px) {
      .quote .cotizador .wrap-box-custom .box-model {
        width: 100%;
        grid-template-columns: auto auto; } }
    @media only screen and (max-width: 480px) {
      .quote .cotizador .wrap-box-custom .box-model {
        grid-template-areas: "title ico" "text ." "btn btn";
        grid-template-columns: 1fr auto; } }
    .quote .cotizador .wrap-box-custom .box-model h2 {
      grid-area: title;
      margin: 0;
      text-align: left;
      font-size: 1.4rem;
      font-weight: bold;
      line-height: inherit;
      color: #5dafe0; }
      @media only screen and (max-width: 768px) {
        .quote .cotizador .wrap-box-custom .box-model h2 {
          text-align: center; } }
      @media only screen and (max-width: 480px) {
        .quote .cotizador .wrap-box-custom .box-model h2 {
          text-align: left; } }
    .quote .cotizador .wrap-box-custom .box-model p {
      grid-area: text;
      font-size: 16px;
      line-height: 20px; }
    .quote .cotizador .wrap-box-custom .box-model .ico-car {
      height: 46px;
      width: 109px;
      margin: auto auto 0; }
      @media only screen and (max-width: 768px) {
        .quote .cotizador .wrap-box-custom .box-model .ico-car {
          height: 35px;
          width: 90px;
          margin: auto; } }
      @media only screen and (max-width: 480px) {
        .quote .cotizador .wrap-box-custom .box-model .ico-car {
          margin: auto 0 auto auto;
          height: 24px;
          width: 60px; } }
    .quote .cotizador .wrap-box-custom .box-model .ico-moto {
      margin: auto auto 0;
      width: 90px; }
      @media only screen and (max-width: 768px) {
        .quote .cotizador .wrap-box-custom .box-model .ico-moto {
          height: 50px;
          margin: auto;
          width: 72px; } }
      @media only screen and (max-width: 480px) {
        .quote .cotizador .wrap-box-custom .box-model .ico-moto {
          margin: auto 0 auto auto;
          height: 35px;
          width: 50px; } }
    .quote .cotizador .wrap-box-custom .box-model .btn-small {
      grid-area: btn;
      margin: auto 0 0 0; }
    .quote .cotizador .wrap-box-custom .box-model span {
      grid-area: ico;
      margin: auto;
      opacity: 0.4; }
    @media only screen and (max-width: 768px) {
      .quote .cotizador .wrap-box-custom .box-model .btn-small {
        margin: auto; } }
