#back-to-main, #back-to-contact, #next-from-main-button, #show-more-button, #next-from-contact-button, #show-less-button, .submit, #submit { background-color: #1f288d !important; } #back-to-main:hover, #back-to-contact:hover, #next-from-main-button:hover, #show-less-button:hover, #next-from-contact-button:hover, #show-more-button:hover, .submit, #submit:hover { background-color: #3D32A1 !important; } .options-grid { display: grid; grid-template-columns: 1fr; /* Single column layout */ gap: 1rem; /* 4 units gap */ width: 100%; margin-bottom: 0; } @media (min-width: 950px) { .options-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 950px) { .discount-option-list { grid-template-columns: repeat(1, 1fr); } } .flex-container { display: flex; justify-content: center; max-width: 1750px; width: 100%; margin: 0 auto; padding-bottom: 20px; } .spinner { border: 4px solid rgba(0, 0, 0, 0.1); border-top-color: #ff6900; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; } #selected-item-background { z-index: 5; } #option-question { z-index: 10; } #after-9-months:hover + #popup-text { display: block; } #popup-text { display: none; z-index: 20; } #option-question:hover + #popup-text { display: block; } #option-item { position: relative; z-index: 1; } #option-item:hover { z-index: 999; } /*input:focus {*/ /* border-color: #1f288d;*/ /* outline: none;*/ /* color: #1f288d;*/ /*}*/ .selectable-block { transition: border-color 0.3s ease; } .selectable-block.active { border-color: #ff6900; } #popup-text { display: none; z-index: 9999; } #option-question:hover + #popup-text { display: block; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } button { background-color: #1f288d; color: #fff; border: none; cursor: pointer; } input[type="checkbox"]:checked { background-color: #ff6900; border-color: transparent; } input[type="checkbox"]:focus { outline: 2px solid #ff6900; } input[type="checkbox"]:not(:focus) { outline: none; } .error { border: 1px solid red; background-color: #fdd; } .error-message { color: red; font-size: 0.9em; margin-top: 5px; display: block; } .hidden { display: none; } .selected { border: 1px solid #ff6900; border-radius: 8px; } .selected #option-name { color: #ff6900; font-weight: 300; } .selected .product-name { color: #ff6900; font-weight: 300; } body { font-family: 'Montserrat'; } .selected-display { min-width: 500px; } .flex-container { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding-top: 20px; padding-left: 20px; padding-right: 20px; width: 100%; } @media (min-width: 1200px) { /*p.product-name {*/ /* font-size: 14px;*/ /*}*/ /*span.product-price {*/ /* font-size: 18px;*/ /*}*/ /*p.product-unit {*/ /* font-size: 13px*/ /*}*/ h4.option-name { font-size: 14px; } p.option-price { font-size: 18px; } p.option-unit { font-size: 13px } } @media (max-width: 1200px) { /*p.product-name {*/ /* font-size: 14px;*/ /*}*/ /*span.product-price {*/ /* font-size: 18px;*/ /*}*/ /*p.product-unit {*/ /* font-size: 13px*/ /*}*/ h4.option-name { font-size: 14px; } p.option-price { font-size: 18px; } p.option-unit { font-size: 13px } } @media (max-width: 950px) { /*p.product-name {*/ /* font-size: 18px;*/ /*}*/ /*span.product-price {*/ /* font-size: 24px;*/ /*}*/ /*p.product-unit {*/ /* font-size: 16px*/ /*}*/ h4.option-name { font-size: 18px; } p.option-price { font-size: 24px; } p.option-unit { font-size: 16px } } @media (min-width: 768px) { .flex-container { flex-direction: row; padding-left: 40px; padding-right: 40px; } } @media (min-width: 1024px) { .flex-container { padding-left: 40px; padding-right: 40px; } } @media (min-width: 1200px) { .flex-container { padding-left: 50px; padding-right: 50px; } } @media (min-width: 1400px) { .flex-container { padding-left: 88px; padding-right: 88px; } } @media (max-width: 1600px) { .selected-display { min-width: 400px; } } @media (max-width: 1400px) { .selected-display { min-width: 450px; } } @media (max-width: 1100px) { .selected-display { min-width: 400px; } } @media (max-width: 767px) { #selected-display { min-width: 100% !important; } } #usp-popup { z-index: 9999 !important; } #usp-popup, #usp-popup-overlay { animation: none !important; transition: none !important; } .select-year-button { transition: background-color 0.3s, color 0.3s; } .select-year-button.selected { background-color: #ff6900; color: white; } .select-year-button.first.selected { border: 0; border-radius: 0.375rem 0 0 0.375rem; } .select-year-button.second.selected { border: 0; border-radius: 0 0.375rem 0.375rem 0; }