#rates-start p { font-family: Energy, Helvetica, Arial, sans-serif; font-size: 20px; color: var(--ae-body); } #rates-start .q-zipcode .input-group { margin: 25px auto 0; width: 320px; } #rates-start .q-zipcode input, #rates-start .q-zipcode .btn { font-family: OpenSans, Helvetica, Arial, sans-serif; font-size: 18px; padding-bottom: 12px; padding-top: 12px; } #rates-start .q-zipcode input { /* ----- edit --q1-input-radius in site/style ----- */ border-bottom-left-radius: var(--q1-input-radius); border-top-left-radius: var(--q1-input-radius); } #rates-start .q-zipcode .btn { /* ----- edit --q1-input-radius in site/style ----- */ border-bottom-right-radius: var(--q1-input-radius); border-top-right-radius: var(--q1-input-radius); padding-left: 24px; padding-right: 24px; } #rates-start, #rates-start p { color: var(--ae-body); text-align: center; } #rates-start .question { x-margin-top: 10px; } #rates-start .question label { x-color: red; font-family: Energy, Helvetica, Arial, sans-serif; font-size: 18px; font-weight: 400; margin-right: 10px; } #rates-start .answer input[type=radio] { position: absolute; opacity: 0; } #rates-start .answer input[type=radio] + label:before { background: transparent; border-radius: 100%; border: 1px solid var(--ae-body); content: ""; display: inline-block; height: 1em; margin-right: 0.25em; position: relative; text-align: center; top: 0.1em; width: 1em; } #rates-start .btn-submit { margin-top: 20px; } #rates-start .answer input[type=radio]:checked + label:before { background-color: var(--ae-radio-checked); box-shadow: inset 0 0 0 2px white; } #rates-start .loading.stripes { background: url("/images/structure/loading-stripes.gif"); border: 1px solid var(--ae-border-loading); border-radius: 4px; height: 16px; margin: 5px 0; } #rates-start .loading.spark { animation: rotateSpark 3s linear infinite; background: white; border-radius: 100%; display: block; height: 48px; margin: 20px 0; padding: 5px; } @keyframes rotateSpark { 000% { transform: rotate(000deg); } 100% { transform: rotate(360deg); } } @media (min-width: 768px) { #rates-start, #rates-start p { color: white; text-align: left; } #rates-start p { font-size: 21px; margin-bottom: 10px; } #rates-start .q-zipcode .input-group { width: auto; } #rates-start .q-zipcode input, #rates-start .q-zipcode .btn { font-size: 18px; padding: 14px 26px; } #rates-start .q-house-apartment-business { margin-bottom: 15px; } #rates-start .answer input[type=radio] + label:before { border: 2px solid white; } #rates-start .answer input[type=radio]:checked + label:before { box-shadow: inset 0 0 0 1px var(--ae-bg-radio); } } @media (min-width: 1400px) { #rates-start { margin-top: 2px; } #rates-start .q-zipcode .input-group { margin-top: 27px; } #rates-start .question label { font-size: 23px; font-weight: 300; } #rates-start .q-house-apartment-business { margin-bottom: 15px; } #rates-start .q-house-apartment-business p { margin-bottom: 15px; } #rates-start p { font-size: 26px; } #rates-start .q-zipcode .btn, #rates-start .q-zipcode input { font-size: 1.3rem; } } #rates-start .error-msg, #rates-start label.error { background: var(--ae-bg-rates-error); border: 1px solid var(--ae-rates-error); color: white; font-size: 1rem; margin: 5px 0; padding: 10px; }