/* Porsche Site Colors RED: #d5001c, BLACK: #000; Buttons: Blue #15577e, Grey: #313639, or White with grey outline Fonts font-family: 'Fira Sans Condensed', 'Trebuchet MS', Helvetica, sans-serif; font-weight: 100,200,300,400,500,700 */ /* ************Inventory Models************ */ .available-models { display: grid; justify-content: center; background: #f5f5f5; } .available-models .btn-good3 { width: 100%; margin-bottom: 11px; background: #313639; color: #ffffff; } .available-models .btn-good3:hover { background: #d5001c; } .available-models .bx-viewport { height: auto !important; min-height: 370px !important; background: #f5f5f5; overflow: visible !important; } .available-models .bxslider2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; /* Adjust gap as needed */ padding: 0; margin: 0; list-style: none; width: auto !important; } .available-models .bxslider2 li { border-radius: 20px; padding: 15px; background: #ffffff; } .available-models .bx-controls { display: none; } /* Responsive adjustments */ @media (max-width: 1300px) { .available-models .bxslider2 { grid-template-columns: repeat(2, 1fr); /* 2 columns on tablets */ } } @media (max-width: 992px) { .available-models .bxslider2 { grid-template-columns: repeat(1, 1fr); /* 2 columns on tablets */ } } @media (max-width: 600px) { .available-models .bxslider2 { grid-template-columns: 1fr; /* 1 column on smaller screens */ gap: 20px; /* Reduce gap for smaller screens */ } .available-models .bxslider2 li { padding: 10px; /* Adjust padding for mobile */ } } /* ***********END Inventory Models*********** */ .btn-primary { white-space: normal; } .badgelisting { min-width: 115px; } @media (min-width: 480px){ .bxslider2 .photo { min-height: 315px; } } @media (min-width: 768px) and (max-width: 991px) { .navbar-inverse .navbar-nav > li > a { margin-right: 5px; margin-left: 5px; } .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus { margin-right: 5px; margin-left: 5px; } } @media (min-width: 768px) and (max-width: 1123px) { .hdr-button { margin-top: 0; } }