/* Colorbox */ #cboxWrapper, .cboxPhoto { max-width: none; } .cboxIframe, .cboxPhoto { display: block; border: 0; } #cboxContent, #cboxLoadingOverlay, #cboxOverlay { background: #000; } #cboxCurrent, #cboxTitle { position: absolute; top: -22px; } #cboxOverlay, #cboxWrapper, #colorbox { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; -webkit-transform: translate3d(0, 0, 0); } #cboxOverlay { position: fixed; width: 100%; height: 100%; opacity: 0.9; } #cboxBottomLeft, #cboxMiddleLeft { clear: left; } #cboxContent { position: relative; margin-top: 32px; overflow: visible; } #cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; background: #000; padding: 1px; } #cboxTitle { margin: 0; left: 0; color: #000; } #cboxLoadingGraphic, #cboxLoadingOverlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cboxClose, #cboxNext, #cboxPrevious, #cboxSlideshow { cursor: pointer; border: 0; padding: 0; margin: 0; overflow: visible; text-indent: -9999px; width: 20px; height: 20px; position: absolute; top: -20px; background: url(images/controls.png) no-repeat; } .cboxPhoto { float: left; margin: auto; -ms-interpolation-mode: bicubic; } .cboxIframe { width: 100%; height: 100%; padding: 0; margin: 0; background: #fff; } #cboxContent, #cboxLoadedContent, #colorbox { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } #cboxClose:active, #cboxNext:active, #cboxPrevious:active, #cboxSlideshow:active, #colorbox { outline: 0; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadingGraphic { background: url(images/loading.gif) center center no-repeat; } #cboxCurrent { right: 205px; text-indent: -9999px; } #cboxPrevious { background-position: 0 0; right: 44px; } #cboxPrevious:hover { background-position: 0 -25px; } #cboxNext { background-position: -25px 0; right: 22px; } #cboxNext:hover { background-position: -25px -25px; } #cboxClose { background-position: -50px 0; right: 0; } #cboxClose:hover { background-position: -50px -25px; } .cboxSlideshow_off #cboxPrevious, .cboxSlideshow_on #cboxPrevious { right: 66px; } .cboxSlideshow_on #cboxSlideshow { background-position: -75px -25px; right: 44px; } .cboxSlideshow_on #cboxSlideshow:hover { background-position: -100px -25px; } .cboxSlideshow_off #cboxSlideshow { background-position: -100px 0; right: 44px; } .cboxSlideshow_off #cboxSlideshow:hover { background-position: -75px -25px; } /* Slick */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: 0; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-list, .slick-slider .slick-track { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:after, .slick-track:before { display: table; content: ""; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; width: 100%; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* Project */ @font-face { font-family: "Affogato"; src: local("Affogato Regular"), local("Affogato-Regular"), url("../fonts/Affogato-Regular.woff2") format("woff2"), url("../fonts/Affogato-Regular.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: "Affogato"; src: local("Affogato Bold"), local("Affogato-Bold"), url("../fonts/Affogato-Bold.woff2") format("woff2"), url("../fonts/Affogato-Bold.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border: 0; outline: 0; } :root { --extra: 20px; --gold: #989058; --gold-l: #dad4ca; --gold-d: #505031; --brown: #342722; --gray-d: #231f20; --font: "Affogato", tahoma, sans-serif; } @media (min-width: 1241px) { :root { --extra: calc((100vw - 1200px) / 2); } } html { scroll-behavior: smooth; max-width: 100vw; overflow-x: hidden; } body { min-height: 100vh; font: 16px var(--font) / 1.5; color: var(--gold-d); background: #fff; margin: 0; padding: 0; font-family: var(--font); } button, input, label select, textarea { font: inherit; } img { display: block; max-width: 100%; height: auto; } a, label, button, input[type="submit"] { cursor: pointer; transition: all .3s ease-out; } label abbr { text-decoration: none; } .wrap { width: 100%; max-width: 1240px; padding-inline: 20px; margin-inline: auto; } .cta { padding: 9px 39px; border-radius: 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--brown); text-transform: uppercase; background-color: var(--gold-l); border: 1px solid var(--gold-l); text-decoration: none; } .cta:hover { background-color: transparent; color: var(--gold-l); } /* #topo */ #topo { position: relative; border-bottom: 8px solid var(--gold); } #topo .wrap { height: 90vh; min-height: 600px; position: relative; padding: 100px 20px; display: flex; flex-direction: column; justify-content: center; } #topo h1 { width: 225px; height: 119px; text-indent: -999rem; background: url(../img/logo-reserva-jardins.svg) no-repeat center / contain; } #topo p { position: absolute; bottom: 80px; left: 20px; } #topo .cta { display: inline-flex; gap: 12px; } #topo .cta::before { content: ''; width: 0px; height: 0px; border-style: solid; border-width: 10px 0 10px 18px; border-color: transparent transparent transparent var(--gold); transition: all .3s ease-out; } #topo .cta:hover::before { border-color: transparent transparent transparent var(--gold-l); } #topo video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; } /* Nav */ #nav { position: fixed; top: 80px; right: 20px; z-index: 90; } #nav h2 { width: 60px; height: 60px; } #nav h2 a { display: block; width: 100%; height: 100%; text-indent: -999rem; background: url("data:image/svg+xml,%0A%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M34.2697 1.56386C35.7836 9.65537 34.9262 19.6525 32.7795 30.2635C32.2532 32.8642 31.5435 35.459 30.6683 38.0307C43.0989 35.0014 52.1409 29.192 53.8381 20.8167C55.3579 13.3159 46.3336 5.65885 34.2697 1.56386ZM5.95507 59.9942C10.4909 55.8703 14.7014 50.8196 18.2555 45.1781C12.4187 46.3828 6.28624 47.3907 0 48.2016V40.1738C3.61917 40.4981 8.06034 40.585 12.9096 40.3881C15.8132 40.2722 18.6576 40.0405 21.3957 39.6988C24.4353 33.8604 26.7594 27.5702 28.0604 21.1352C29.6098 13.4897 29.6275 6.06429 28.362 0H28.8055H33.9386H44.1338C50.4732 1.72024 56.5702 4.48885 59.9883 7.38488L59.9942 27.6281C54.0746 33.8778 42.8268 38.9111 28.9179 42.6528C26.3927 48.7171 23.0219 54.5902 19.1426 59.9884L5.95507 59.9942Z' fill='%23DAD4CA'/%3E%3Cpath d='M59.9882 0.00598907H44.1394C50.4789 1.72624 56.576 4.49485 59.9941 7.39089L59.9882 0.00598907Z' fill='%23989058'/%3E%3Cpath d='M34.2698 1.5638C35.7837 9.65531 34.9262 19.6524 32.7795 30.2634C32.2532 32.8641 31.5436 35.4589 30.6683 38.0306C43.0989 35.0014 52.1409 29.1919 53.8381 20.8166C55.3579 13.3159 46.3336 5.65879 34.2698 1.5638Z' fill='%23989058'/%3E%3Cpath d='M0 40.1739C3.61914 40.4982 8.06027 40.5851 12.9094 40.3882C15.813 40.2723 18.6575 40.0406 21.3955 39.6989C24.4351 33.8605 26.7591 27.5703 28.0601 21.1353C29.6095 13.4898 29.6272 6.06431 28.3617 0H28.8052H0V40.1739Z' fill='%23989058'/%3E%3Cpath d='M0 59.9884L5.95502 60C10.4908 55.876 14.7013 50.8254 18.2554 45.1839C12.4186 46.3886 6.28618 47.3965 0 48.2073V59.9884Z' fill='%23989058'/%3E%3Cpath d='M59.9881 59.9883L59.9999 27.6339C54.0804 33.8835 42.8326 38.9168 28.9236 42.6585C26.3985 48.7228 23.0277 54.5959 19.1483 59.9941L59.9881 59.9883Z' fill='%23989058'/%3E%3C/svg%3E%0A") no-repeat center / contain; } #nav ul { list-style: none; margin-top: 20px; display: flex; gap: 20px; flex-direction: column; } #nav li {} #nav li a { display: block; width: 60px; height: 60px; text-indent: -999rem; } #nav li a:hover { background-color: var(--brown) !important; } #nav li.cadastro a {} #nav li.whatsapp a { background: var(--gold) url("data:image/svg+xml,%0A%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.4453 4.80859C25.9883 7.35156 27.5625 10.6816 27.5625 14.3145C27.5625 21.7012 21.3867 27.7559 13.9395 27.7559C11.6992 27.7559 9.51953 27.1504 7.52148 26.1211L0.4375 27.9375L2.31445 20.9746C1.16406 18.9766 0.498047 16.6758 0.498047 14.2539C0.498047 6.86719 6.55273 0.8125 13.9395 0.8125C17.5723 0.8125 20.9629 2.26562 23.4453 4.80859ZM13.9395 25.4551C20.1152 25.4551 25.2617 20.4297 25.2617 14.3145C25.2617 11.2871 23.9902 8.50195 21.8711 6.38281C19.752 4.26367 16.9668 3.11328 14 3.11328C7.82422 3.11328 2.79883 8.13867 2.79883 14.2539C2.79883 16.373 3.4043 18.4316 4.49414 20.248L4.79688 20.6719L3.64648 24.7891L7.88477 23.6387L8.24805 23.8809C10.0039 24.9102 11.9414 25.4551 13.9395 25.4551ZM20.1152 17.0996C20.418 17.2812 20.6602 17.3418 20.7207 17.5234C20.8418 17.6445 20.8418 18.3105 20.5391 19.0977C20.2363 19.8848 18.9043 20.6113 18.2988 20.6719C17.209 20.8535 16.3613 20.793 14.2422 19.8242C10.8516 18.3711 8.67188 14.9805 8.49023 14.7988C8.30859 14.5566 7.1582 12.9824 7.1582 11.2871C7.1582 9.65234 8.00586 8.86523 8.30859 8.50195C8.61133 8.13867 8.97461 8.07812 9.2168 8.07812C9.39844 8.07812 9.64062 8.07812 9.82227 8.07812C10.0645 8.07812 10.3066 8.01758 10.6094 8.68359C10.8516 9.34961 11.5781 10.9844 11.6387 11.166C11.6992 11.3477 11.7598 11.5293 11.6387 11.7715C11.0332 13.043 10.3066 12.9824 10.6699 13.5879C12.002 15.8281 13.2734 16.6152 15.2715 17.584C15.5742 17.7656 15.7559 17.7051 15.998 17.5234C16.1797 17.2812 16.8457 16.4941 17.0273 16.1914C17.2695 15.8281 17.5117 15.8887 17.8145 16.0098C18.1172 16.1309 19.752 16.918 20.1152 17.0996Z' fill='%23DAD4CA'/%3E%3C/svg%3E%0A") no-repeat center / auto 50%; } @media ( min-width: 600px ){ #nav li.cadastro { display: none; } } @media ( max-width: 899px ){ #nav h2 { width: 40px; height: 40px; } #nav li a { width: 40px; height: 40px; } } @media ( max-width: 599px ){ #nav { position: fixed; top: auto; bottom: 0; right: 0; width: 100%; } #nav h2 { display: none; } #nav ul { gap: 0; flex-direction: row; } #nav li { flex: 0 0 50%; } #nav li a { width: 100%; height: 60px; } #nav li.cadastro a { background: var(--gold) url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m11.25 6c.398 0 .75.352.75.75 0 .414-.336.75-.75.75-1.505 0-7.75 0-7.75 0v12h17v-8.749c0-.414.336-.75.75-.75s.75.336.75.75v9.249c0 .621-.522 1-1 1h-18c-.48 0-1-.379-1-1v-13c0-.481.38-1 1-1zm1.521 9.689 9.012-9.012c.133-.133.217-.329.217-.532 0-.179-.065-.363-.218-.515l-2.423-2.415c-.143-.143-.333-.215-.522-.215s-.378.072-.523.215l-9.027 8.996c-.442 1.371-1.158 3.586-1.264 3.952-.126.433.198.834.572.834.41 0 .696-.099 4.176-1.308zm-2.258-2.392 1.17 1.171c-.704.232-1.274.418-1.729.566zm.968-1.154 7.356-7.331 1.347 1.342-7.346 7.347z' fill-rule='nonzero' fill='white'/%3E%3C/svg%3E") no-repeat center / auto 50%; border-right: 1px solid #fff; } } /* #views */ #views { border-top: 8px solid var(--gold); border-bottom: 8px solid var(--gold); position: relative; } #views .slide { position: relative; } #views .slide::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba( 0 0 0 / .5 ); z-index: 1; } #views .slide .wrap { position: relative; z-index: 2; height: 80vh; min-height: 400px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 80px 20px; text-align: center; } #views .slide h2 { font-size: 2.5rem; text-transform: uppercase; font-weight: normal; color: #fff; text-shadow: 0 4px 6px rgba( 0 0 0 / .5 ); } #views .slide p { font-size: 1.25rem; max-width: 680px; color: #fff; margin-top: 20px; text-shadow: 0 4px 6px rgba( 0 0 0 / .5 ); } #views .slide p::after { content: ''; display: block; width: 40px; height: 0; border-top: 2px solid var(--gold); margin: 20px auto 0; } #views .slick-arrow { position: absolute; top: calc( 50% - 25px ); width: 50px; height: 50px; border-radius: 50%; text-indent: -999rem; z-index: 3; } #views .slick-arrow.slick-prev { left: 20px; background: var(--gold) url("data:image/svg+xml,%3Csvg width='8' height='13' viewBox='0 0 8 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292771 5.657L5.94977 -3.93831e-06L7.36377 1.414L2.41377 6.364L7.36377 11.314L5.94977 12.728L0.29277 7.071C0.1053 6.88347 -1.61561e-05 6.62916 -1.61329e-05 6.364C-1.61098e-05 6.09883 0.1053 5.84452 0.292771 5.657Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center; } #views .slick-arrow.slick-prev:hover { background: #fff url("data:image/svg+xml,%3Csvg width='8' height='13' viewBox='0 0 8 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292771 5.657L5.94977 -3.93831e-06L7.36377 1.414L2.41377 6.364L7.36377 11.314L5.94977 12.728L0.29277 7.071C0.1053 6.88347 -1.61561e-05 6.62916 -1.61329e-05 6.364C-1.61098e-05 6.09883 0.1053 5.84452 0.292771 5.657Z' fill='black'/%3E%3C/svg%3E%0A") no-repeat center; } #views .slick-arrow.slick-next { right: 20px; background: var(--gold) url("data:image/svg+xml,%3Csvg width='8' height='13' viewBox='0 0 8 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.071 7.071L1.414 12.728L0 11.314L4.95 6.364L0 1.414L1.414 0L7.071 5.657C7.25847 5.84453 7.36379 6.09884 7.36379 6.364C7.36379 6.62916 7.25847 6.88347 7.071 7.071Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center; } #views .slick-arrow.slick-next:hover { background: #fff url("data:image/svg+xml,%3Csvg width='8' height='13' viewBox='0 0 8 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.071 7.071L1.414 12.728L0 11.314L4.95 6.364L0 1.414L1.414 0L7.071 5.657C7.25847 5.84453 7.36379 6.09884 7.36379 6.364C7.36379 6.62916 7.25847 6.88347 7.071 7.071Z' fill='black'/%3E%3C/svg%3E%0A") no-repeat center; } #nasce { background: url("../img/ilha-de-luxo.webp") no-repeat center / cover; } #apice { background: url("../img/apice.webp") no-repeat center / cover; } @media ( max-width: 1199px ){ #nasce { background-image: url("../img/ilha-de-luxo-dt.webp"); } #apice { background-image: url("../img/apice-dt.webp"); } } @media ( max-width: 1199px ){ #nasce { background-image: url("../img/ilha-de-luxo-tb.webp"); } #apice { background-image: url("../img/apice-tb.webp"); } } @media ( max-width: 599px ){ #views .slide h2 { font-size: 2rem; } #views .slide p { font-size: 1rem; } #nasce { background-image: url("../img/ilha-de-luxo-mb.webp"); } #apice { background-image: url("../img/apice-mb.webp"); } } /* #place-vendome */ #place-vendome { border-bottom: 8px solid var(--gold); position: relative; background: url("../img/place-vendome.webp") no-repeat center / cover; } #place-vendome .wrap { position: relative; z-index: 2; height: 80vh; min-height: 600px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 80px 20px; text-align: center; } #place-vendome .box { background: linear-gradient(180deg, #82825C 0%, #505031 50%, #3D3D28 100%); padding: 40px 20px; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; max-width: 400px; } #place-vendome h2 { width: 140px; height: 150px; background: url(../img/logo-place-vendome.webp) no-repeat center; text-indent: -999rem; } #place-vendome h3 { font-size: 1.5rem; letter-spacing: 1px; text-transform: uppercase; color: #fff; margin-top: 40px; } #place-vendome p { color: #fff; font-size: 1.25rem; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; } #place-vendome h3 + p { margin-top: 40px; } #place-vendome p + p { color: var(--gold); } #place-vendome .box + p { margin-top: 20px; } #place-vendome .box + p a {} #place-vendome .box + p a:hover { background-color: var(--brown); color: var(--gold-l); border-color: var(--brown); } /* #la-reserve */ #la-reserve { position: relative; border-bottom: 8px solid var(--gold); } #la-reserve::before { content: ''; display: block; width: calc( 300px + var(--extra) ); height: 100%; position: absolute; top: 0; right: 0; background: url("../img/la-reserve.webp") no-repeat center / cover; z-index: 1; } #la-reserve .wrap { position: relative; z-index: 2; padding: 80px 20px; display: flex; align-items: center; justify-content: space-between; gap: 40px; } #la-reserve .intro { width: calc( 50% - 20px ); max-width: 480px; } #la-reserve .intro h2 { font-size: 2.5rem; text-transform: uppercase; font-weight: normal; color: var(--gold-d); } #la-reserve .intro h2 strong { color: var(--gold); } #la-reserve .intro h2 strong span { white-space: nowrap; } #la-reserve .intro h2::after { content: ""; display: block; width: 40px; height: 0; border-top: 2px solid var(--gold); margin-top: 20px; } #la-reserve p { color: var(--gold-d); margin-top: 20px; } #la-reserve p strong { display: block; } #la-reserve p .cta:hover { background: var(--brown); color: var(--gold-l); border-color: var(--brown); } #la-reserve .gallery { width: calc( 50% - 20px ); max-width: 580px; } #la-reserve .gallery .slick-list { border: 12px solid #fff; background: #fff; box-shadow: 4px 4px 6px rgba( 0 0 0 / .5 ); } #la-reserve .gallery .slick-slide img { display: block !important; } #la-reserve .gallery .slick-arrow { display: none !important; } #la-reserve .slick-dots { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; } #la-reserve .slick-dots button { appearance: none; width: 40px; height: 8px; background: var(--brown); text-indent: -999rem; } #la-reserve .slick-dots li.slick-active button { background: var(--gold); } @media ( max-width: 1239px ){ #la-reserve::before { width: 25%; } } @media ( max-width: 899px ){ #la-reserve::before { width: 100%; height: calc( 50vw + 80px ); max-height: 420px; top: auto; bottom: 0; } #la-reserve .wrap { flex-direction: column; text-align: center; } #la-reserve .intro, #la-reserve .gallery { width: 100%; max-width: none; } #la-reserve .gallery { max-width: 600px; } #la-reserve .intro h2 { margin: 0 auto; max-width: 640px; } #la-reserve .intro h2::after { margin: 20px auto 0; } #la-reserve p strong { display: inline-block; } } @media ( max-width: 599px ){ #la-reserve .intro h2 { font-size: 2rem; } } /* #montanhas * / #montanhas { border-bottom: 8px solid var(--gold); position: relative; } #montanhas .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden; } #montanhas .bg::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("../img/montanhas-5.webp") no-repeat top center / cover; z-index: 1; transition: transform .5s ease-out; } #montanhas:hover .bg::before { transform: scale( 1.1 ); } #montanhas .bg::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba( 0 0 0 / .25 ); z-index: 2; } #montanhas .wrap { position: relative; z-index: 2; height: 80vh; min-height: 400px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 80px 20px; text-align: center; } #montanhas h2 { font-size: 2.5rem; text-transform: uppercase; font-weight: normal; color: #fff; text-shadow: 0 4px 6px rgba( 0 0 0 / .5 ); max-width: 960px; } #montanhas p { font-size: 1.25rem; max-width: 600px; color: #fff; margin-top: 20px; text-shadow: 0 4px 6px rgba( 0 0 0 / .5 ); } #montanhas p::after { content: ''; display: block; width: 40px; height: 0; border-top: 2px solid var(--gold); margin: 20px auto 0; } @media ( max-width: 599px ){ #montanhas h2 { font-size: 2rem; } #montanhas p { font-size: 1rem; } } /* #caadastro */ #cadastro { background: var(--gray-d); padding: 80px 0px; } #cadastro h2 { font-weight: normal; text-align: center; font-size: 2rem; color: #fff; } #cadastro p { font-size: 1.5rem; color: var(--gold); margin-top: 20px; text-align: center; } #cadastro form { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 20px 0; width: calc( 100% + 20px ); } #cadastro .field-wrap { flex: 0 0 calc( 33.33% - 20px ); margin-right: 20px; } #cadastro .field-wrap label { color: #fff; font-size: .875rem; display: block; } #cadastro .field-wrap input { width: 100%; padding: 8px 0; background: transparent; border-bottom: 1px solid var(--gold); color: #fff; } #cadastro .field-wrap input::placeholder { color: rgba(255, 255, 255, 0.6); } #cadastro .field-wrap.field-pp {} #cadastro .field-wrap.field-pp label { display: flex; align-items: center; } #cadastro .field-wrap.field-pp label { display: flex; align-items: center; position: relative; gap: 8px; } #cadastro .field-wrap.field-pp label a { color: var(--gold); text-decoration: underline; } #cadastro .field-wrap.field-pp label a:hover { color: var(--gold-l); } #cadastro .field-wrap.field-pp label input { display: none; } #cadastro .field-wrap.field-pp label::before { content: ''; display: block; flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--gold); } #cadastro .field-wrap.field-pp label::after { content: ''; display: block; flex-shrink: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--gold); position: absolute; left: 4px; top: 4px; opacity: 0; transition: all .3s ease-out; } #cadastro .field-wrap.field-pp label:has(input:checked)::after { opacity: 1; } #cadastro .field-wrap.field-submit .submit-btn { background: var(--gold); color: var(--brown); text-transform: uppercase; border: 1px solid var(--gold); width: 100%; padding: 7px 19px; font-size: 1rem; line-height: 1.5; border-radius: 20px; opacity: .5; pointer-events: none; } #cadastro form:has(input[name="pp"]:checked) .field-wrap input.submit-btn { opacity: 1; pointer-events: initial; } #cadastro .field-wrap.field-submit .submit-btn:hover { background: transparent; color: var(--gold); } #cadastro .field-wrap.field-submit .submit-btn.sending { transition: none; pointer-events: none; background: var(--gold) url("data:image/svg+xml,%3Csvg width='38' height='38' viewBox='0 0 38 38' xmlns='http://www.w3.org/2000/svg' stroke='%23fff'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(1 1)' stroke-width='2'%3E%3Ccircle stroke-opacity='.5' cx='18' cy='18' r='18'/%3E%3Cpath d='M36 18c0-9.94-8.06-18-18-18'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 18 18' to='360 18 18' dur='1s' repeatCount='indefinite'/%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center / 20px 20px; color: transparent; } #cadastro .form-output:not( :empty ) { padding: 10.5px 20px; border-radius: 20px; color: #fff; text-align: center; margin-bottom: 20px; flex: 0 0 calc( 100% - 20px ); } #cadastro .form-output p { color: #fff; font-size: 1rem; margin-top: 0; } #cadastro .form-output.is-error { background-color: #f03; } #cadastro .form-output.is-success { background-color: #2E8B57; } @media ( min-width: 900px ){ #cadastro .field-wrap.field-pp { flex: 0 0 calc( 66.67% - 20px ); } } @media ( max-width: 899px ){ #cadastro h2 { font-size: 1.75rem; } #cadastro p { font-size: 1.25rem; } #cadastro .field-wrap { flex: 0 0 calc( 50% - 20px ); } #cadastro .field-wrap.field-nome { flex: 0 0 calc( 100% - 20px ); } } @media ( max-width: 599px ){ #cadastro h2 { font-size: 1.5rem; } #cadastro p { font-size: 1rem; } #cadastro .field-wrap { flex: 0 0 calc( 100% - 20px ); } } /* Footer */ #foot { padding: 60px 0px; } #foot figure { display: flex; flex-direction: column; padding-bottom: 40px; border-bottom: 1px solid var(--gold); } #foot img { order: 2; } #foot figcaption { font-size: .5rem; letter-spacing: 0.3px; text-transform: uppercase; color: var(--brown); margin-bottom: 8px; display: block; padding-left: 4px; } #foot p { font-size: .75rem; letter-spacing: 0.5px; margin-top: 40px; } @media ( max-width: 599px ){ #foot { padding: 40px 0 100px; } #foot figure { padding-bottom: 20px; } #foot p { margin-top: 20px; } }