* { padding: 0; margin: 0; } @import url('<a href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap%27)">https://fonts.googleapis.com/css2?family=Montserrat&amp;amp;display=swap&amp;#39;)</a>; body { background-color:gray; font-family: 'Montserrat', sans-serif; } .policy { max-width: 569px; width: 100%; margin: 0; padding-top: 20px; text-align: center; } .policy p { color: #fff; opacity: 0.5; text-align: center; font-size: 14px; border-bottom:1px dashed #fff; display: inline; } .policy p:hover { opacity: 1; } .popup-calc { position: relative; background: #fff; margin: 0 auto; text-align: center; padding: 50px; width: 67%; font-size: 25px; font-family: 'Montserrat', sans-serif; } .cost-calculation { display: flex; flex-direction: column; align-items: center;&nbsp; justify-content: center; background-color: gray; padding: 20px 50px;&nbsp; border-radius: 5px; font-family: 'Montserrat', sans-serif; } @media (min-width: 320px) and (max-width: 480px) { .cost-calculation { border:0; border-radius: 0; } } .cost-calculation h3 { text-transform: uppercase; text-align: center; color: white; font-weight: 700; font-family: inherit; padding-bottom: 20px; font-family: 'Montserrat', sans-serif; } .cost-calculation input { background: rgba(225, 225, 225, 0.7); border: 0; height: 30px; border-radius: 2px; margin-bottom: 15px; font-size: 12px; width: 100%; font-family: 'Montserrat', sans-serif; box-sizing: border-box; padding-left: 15px; font-weight: 700; } @media (min-width: 320px) and (max-width: 480px) { .cost-calculation input { margin-bottom: 12px; } } .cost-calculation input:focus { background: rgba(225, 225, 225, 0.9) } .cost-calculation input::placeholder { color: #5d5d5d; } .input-parameters { width: 100%; } .input-parameters-row { display: flex; justify-content: space-between; width: 100%; } .input-parameters-row input { width: 47%; } .cost-calculation .product-name { width: 100%; } .price-res { color: #dfdfdf; display: flex; align-items: center; width: 100%; } .price-res input { margin: 0; padding-left: 15px; } .price-container { width: 55%; display: flex; padding-right: 10px; } .product-price-label { text-align: right; font-size: 14px; padding-right: 20px; } .nds-container { width: 45%; display: flex; } #nds-check { width: 30%; } .nds-check-label { font-size: 14px; text-align: center; width: 30%; display: flex; align-items: center; justify-content: center; } .product-submit-btn { padding-left: 0 !important; color: whitesmoke; background: #bf0000 !important; width: 77% !important; } @media (max-width: 576px) { .cost-calculation { padding: 20px 10px; } .price-res { flex-direction: column; } .nds-container, .price-container { width: 100%; padding-right: 0; padding-bottom: 15px; } .input-parameters-row { flex-direction: column; } .input-parameters-row input { width: 100%; } } .suggest__item-link:hover{ color: #3265e6; cursor: pointer; } .autocomplete-suggestions { text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,.1); position: absolute; display: none; z-index: 9999; max-height: 254px; overflow: hidden; overflow-y: auto; box-sizing: border-box; } .autocomplete-suggestion { position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #333; } .autocomplete-suggestion b { color: black; } .autocomplete-suggestion.selected { background: #f0f0f0; }