/* Minification failed. Returning unminified contents.
(5,27): run-time error CSS1039: Token not allowed after unary operator: '-sc-blue'
 */

section.vehicle-make-model-selector { }

.vehicle-make-model-selector-container { 
   border: 2px solid var(--sc-blue);
   padding: 15px;
}


.vehicle-make-model-selector-container .selector-fields {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   grid-column-gap: 20px;
   grid-row-gap: 15px;
   align-items: end;

}

vehicle-make-model-selector-container .error { 
   margin-bottom: 20px;
}

.vehicle-select .btn-big {
   white-space: nowrap;
}


div.vehicle-model-list {
   width: 100%;
   column-count: 3;
   column-gap: 30px;
}


section.vehicle-make-list {
   margin: 40px 0;
   padding: 0;
}

.vehicle-list { 
   column-count: 6;
   column-gap: 30px;
}

section.vehicle-model-list {
   margin: 30px 0;
}

.vehicle-list a,
div.vehicle-model-list a { 
   display: block;
   margin-bottom: 10px;
}


table.vehicle-details,
table.vehicle-tyre-size-selection {
   border-left: 1px solid #d8d8d8;
   border-top: 1px solid #d8d8d8;
   border-right: none;
   border-bottom: none;
   border-collapse: collapse;
}

table.vehicle-details {
   width: 100%;
   max-width: 800px;
}

table.vehicle-details td,
table.vehicle-tyre-size-selection td { 
   font-size: 16px;
   font-weight: normal;
   padding: 5px 5px 3px 5px;
   border-right: 1px solid #d8d8d8;
   border-bottom: 1px solid #d8d8d8;
   vertical-align: top;
   line-height: 1.6;
}

section.product-detail div.vehicle-details {
   display: flex;
   flex-direction: column;
   gap: 10px;
   padding: 0 10px 40px 10px;
}

section.product-detail div.vehicle-details div.button { 
   text-align: right;
}

section.product-detail table.vehicle-details td {
   font-size: 14px;
   padding: 2px 5px 1px 5px;
}

section.product-detail table.vehicle-details td.label { 
   width: auto;
   padding-right: 5px;
   width: 140px;
}

section.product-detail div.vehicle-details a.return-to-selector { 
}

table.vehicle-details td.label {
   font-weight: bold;
   padding-right: 20px;
   white-space: nowrap;
   width: 190px;
}

table.vehicle-details td:not(.label) > :last-child {
   margin-bottom: 0;
}


@media (max-width: 940px) {
   .vehicle-list {
      column-count: 5;
   }
}

@media (max-width: 800px) {
   .vehicle-make-model-selector-container .selector-fields { 
      grid-template-columns: repeat(3, 1fr);
      grid-template-areas: "make model product" "btn btn btn";
   }

   .vehicle-make-model-selector-container .selector-fields .vehicle-make { 
      grid-area: make;
   }

   .vehicle-make-model-selector-container .selector-fields .vehicle-model {
      grid-area: model;
   }

   .vehicle-make-model-selector-container .selector-fields .vehicle-product {
      grid-area: product;
   }

   .vehicle-make-model-selector-container .selector-fields .vehicle-select {
      grid-column: 1 / 4;
      grid-area: btn;
      text-align: right;
   }

}

@media (max-width: 760px) {
   .vehicle-list {
      column-count: 4;
   }
}

@media (max-width: 640px) {
   .vehicle-list {
      column-count: 3;
   }
}

@media (max-width: 500px) {
   .vehicle-make-model-selector-container .selector-fields {
      grid-template-columns: repeat(2, 1fr);
      grid-template-areas: "make model" "product product" "btn btn";
   }

   .vehicle-make-model-selector-container .selector-fields .vehicle-select {
      grid-column: initial;
      grid-area: btn;
      text-align: right;
   }
}

@media (max-width: 450px) {
   .vehicle-list {
      column-count: 2;
   }
}