* { scroll-behavior: smooth; } .article-wrapper { display: flex; width: 100%; justify-content: center; margin-bottom: 50px; } .offer-container { display: flex; justify-content: center; flex-wrap: wrap; gap: 27px 27px; margin: 50px auto; } .offer-item { display: flex; gap: 20px; align-items: center; justify-content: space-between; width: 250px; height: 84px; border: 1px solid black; border-radius: 10px; padding: 20px; transition: all 0.2s; cursor: pointer; text-align: center; } .input-error { font-size: 13px; color: red; } .offer-item:hover { scale: 1.05; } .offer-item p { margin: 0; padding: 0; font-size: 14px; } .article-container { position: relative; width: 100%; max-width: 1000px; margin: 0 auto; margin-top: 50px; margin-bottom: 50px; padding: 1rem; display: flex; flex-direction: column; } .input-wrapper { padding: 40px; background: #ededed; border-radius: 15px; position: relative; } .input-container { display: flex; flex-direction: column; margin: 20px 0; } .input-container label { font-size: 18px; font-weight: 500; } .input { border-radius: 50px; padding: 10px 20px; border: none; max-height: 40px; background-color: #fff; } input:valid, input:invalid { background-color: #fff !important; } .input-lg { border-radius: 10px; padding: 10px; border: none; height: 200px; } .input-button { background-color: #3685e0; border: none; border-radius: 0; color: white; padding: 10px 20px; text-align: center; text-decoration: none; display: block; border-radius: 10px; font-size: 16px; margin: 2px auto; width: 40%; cursor: pointer; } .main-image { width: 100%; height: auto; margin: auto; object-fit: cover; margin-top: 2rem; margin-bottom: 2rem; border-radius: 10px; } .link { text-decoration: none; color: rgb(3, 109, 163); } .paragraph-xl-link { font-size: 1.5rem; text-decoration: none; font-weight: 600; color: rgb(3, 109, 163); } .link:hover { text-decoration: underline; } .title { text-align: center; font-size: 4rem; font-weight: 600; margin-bottom: 50px; } .title-sm { font-size: 2rem; font-weight: 600; margin: 2rem auto; border-bottom: 5px solid #ff4858; border-bottom-right-radius: 10px; width: fit-content; padding-bottom: 0.5rem; padding-right: 10px; display: block; } .title-sm-link { color: black; text-decoration: none; font-size: 2rem; font-weight: 600; } .title-sm-link:hover { color: rgb(3, 109, 163); } .paragraph-xl { font-size: 1.5rem; font-weight: 600; margin-bottom: 3rem; } .paragraph { margin-bottom: 1rem; text-align: start; width: 100%; } .paragraph-center { text-align: center; font-size: 25px; } .contact-title { font-size: 37px; text-align: center; margin: 40px 0; } .groupInputContainer { display: flex; gap: 20px; flex-grow: 1; flex-wrap: wrap; } .grow-1 { flex-grow: 1; } .grow-2 { flex-grow: 2; } .grow-3 { flex-grow: 3; } .checkbox-container { display: flex; gap: 20px; align-items: center; margin: 20px 0; } .checkbox-container label { margin: 0; } .form-response { position: absolute; display: flex; justify-content: center; align-items: center; width: 40%; height: 100px; background-color: #fff; border: 1px solid #46af00; padding: 20px; border-radius: 10px; left: 50%; top: 50%; transform: translate(-50%); animation: form-response 2s; } .error-form-response{ position: absolute; display: flex; justify-content: center; align-items: center; width: 40%; height: 100px; background-color: #fff; border: 2px solid #ed2441; padding: 20px; border-radius: 10px; left: 50%; top: 50%; transform: translate(-50%); } .form-response p { margin: 0; font-size: 16px; font-weight: 500; text-align: center; } .error-form-response p { margin: 0; font-size: 16px; font-weight: 500; text-align: center; } .hidden { display: none; } @media screen and (max-width: 991px) { .contents { display: none; } .title-sm { font-size: 1.5rem; margin-bottom: 1rem; } .paragraph-xl { font-size: 1.3rem; margin-bottom: 1rem; } }