@import"https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}.noto-sans{font-family:Noto Sans,sans-serif;font-optical-sizing:auto;font-style:normal}html,body{background-attachment:fixed;font-family:Noto Sans,sans-serif;line-height:1.5;color-scheme:light dark;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}video{position:fixed;top:0;left:0;width:100%;height:100%;object-fit:cover}section.background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}section.third{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;z-index:1}section.background div.container{height:100vh;display:flex;justify-content:center;align-items:center;color:#041cf955}section.third div.container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);height:100vh;width:100%;max-width:2000px;display:flex;justify-content:center;align-items:center}.container{width:100%;height:100vh;max-width:1440px;margin-right:auto;margin-left:auto;align-items:center;border-radius:50px}.back{position:absolute;width:60%;height:100%;max-height:1000px;right:0;top:50%;transform:translateY(-50%);margin-top:auto;margin-bottom:auto;z-index:1;filter:blur(0px)}.front{position:absolute;width:40%;max-width:700px;display:flex;flex-direction:column;justify-content:center;align-items:center;top:50%;left:7%;transform:translateY(-50%);z-index:2}.carousel{position:relative;width:clamp(25rem,80%,32rem);margin-left:auto;margin-right:auto;display:flex;justify-content:center;gap:2.5rem}.small-product img{width:clamp(4rem,4.5vw,5rem);height:auto;display:inline-block;margin:auto}h1{font-size:3.2em;line-height:1.1;font-family:Noto Sans,sans-serif}.front h1{text-align:center;margin-bottom:1.8rem;color:#fff;font-family:Noto Sans,sans-serif}.front .tag{font-size:clamp(1rem,2.7vw,1.7em);font-weight:600;line-height:1.2;font-family:Noto Sans,sans-serif}.tag{text-align:center;margin-top:0;margin-bottom:1.5em;background-color:brown;padding:3px 30px 6px;font-family:Noto Sans,sans-serif}h4{font-size:2.2em;font-weight:600;margin-bottom:0;margin-top:0;text-align:center;font-family:Noto Sans,sans-serif}.detail{display:flex;align-items:center}.detail h4{margin-top:1rem;font-size:1.5rem}p{font-size:1.4em;font-weight:500;line-height:1.5;font-family:Noto Sans,sans-serif}.image-sequence{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;height:100vh;max-width:1200px;max-height:900px;object-fit:contain;overflow:visible}.brush{display:none}div.four .tag{background-color:#d0eb58;color:#471502}div.six .tag{background-color:#f2d33b;color:#000}div.eight .tag{background-color:#40e0d0;color:#312e6b}div.ten .tag{background-color:#ff0;color:#dc143c}div.four h4{color:#fff}div.six h4{color:#000}div.eight h4{color:#361565}div.ten h4{color:#b01364}.front.eight .buttons button{color:#7b47c4;border-color:#7b47c4}.front.ten .buttons button{color:#d92e75;border-color:#ff79b7}.blackback-one,.blackback-two,.blackback-three,.blackback-four{display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:0}.click-to-learn{font-size:.8rem;font-weight:400;margin-top:.5rem;margin-bottom:-1.3rem;text-align:center;font-family:Noto Sans,sans-serif;position:relative;width:fit-content;padding:3px 12px;border-radius:.3rem;opacity:0;animation:fadeInOut 7s ease-in-out infinite}.click-to-learn.four{background-color:#33edd7b3;color:#471502}.click-to-learn.six{background-color:#2aff9c99;color:#000}.click-to-learn.eight{background-color:#1a009c12;color:#1c0070}.click-to-learn.ten{background-color:#ffffff4d;color:#000}@keyframes fadeInOut{0%{opacity:0}20%{opacity:0}35%{opacity:1}50%{opacity:1}65%{opacity:0}to{opacity:0}}.category-nav{position:fixed;top:20px;left:20px;z-index:1000;display:flex;flex-direction:column;gap:10px}.burger-button{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;width:30px;height:24px;padding:0;transition:transform .3s ease}.burger-line{width:100%;height:3px;background-color:#fff;transition:all .3s ease;transform-origin:center}.burger-button.open .burger-line:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.burger-button.open .burger-line:nth-child(2){opacity:0}.burger-button.open .burger-line:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}.nav-menu{display:flex;flex-direction:column;gap:10px;max-height:0;overflow:hidden;transition:max-height .5s ease,opacity .5s ease;opacity:0;margin-top:10px}.nav-menu.open{max-height:200px;opacity:1}.nav-link{background-color:#000000b3;color:#fff;padding:10px 20px;text-decoration:none;border-radius:5px;font-family:Noto Sans,sans-serif;font-size:1rem;transition:background-color .3s ease;display:block}.nav-link:hover{background-color:#000000e6}@media (max-width: 1024px){section.third div.container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);height:100vh;width:100%;display:flex;justify-content:center;align-items:center}.back{position:absolute;width:100%;height:50vh;right:0;top:0;transform:none;z-index:1}.front{position:fixed;width:100%;bottom:clamp(5rem,5%,5rem);left:50%;transform:translate(-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;box-sizing:border-box}.carousel{position:relative;width:clamp(20rem,80%,40rem);margin-left:auto;margin-right:auto;display:flex;justify-content:center;gap:clamp(1.5rem,6vw,3rem)}.image-sequence{position:fixed;top:0;left:0;transform:none;width:100vw;height:50vh;object-fit:contain;overflow:visible;z-index:0}.front h1{font-size:clamp(2rem,8vw,2.7rem)}.front .tag{font-size:clamp(1rem,5vw,1.7rem);font-weight:600;line-height:1.2;font-family:Noto Sans,sans-serif}.tag{text-align:center;margin-top:-15px;margin-bottom:1.5em;background-color:brown;padding:3px 15px 6px;font-family:Noto Sans,sans-serif}.small-product img{width:clamp(3rem,13vw,4.5rem);height:auto;display:inline-block;margin:auto}.detail h4{margin-top:1rem;font-size:1.2rem}.brush{display:block;position:fixed;width:320px;transform:translateY(-11rem) translate(-10px);z-index:-1}div.four .tag{background-color:#d0eb58;color:#471502}div.six .tag{background-color:#f2d33b;color:#000}div.eight .tag{background-color:#40e0d0;color:#312e6b}div.ten .tag{background-color:#ff0;color:#dc143c}div.four h4,div.six h4{color:#000}div.eight h4{color:#00008b}div.ten h4{color:#8b0000}}.slogan{position:absolute;display:flex;height:auto;margin:0;flex-direction:column;flex-flow:row-reverse;align-items:right;width:45%;max-width:100%;top:30%;left:0;z-index:2}.anim-slogan{position:relative;margin-top:2rem;gap:10px}@keyframes slogan-sequence{0%{opacity:0;transform:translateY(20px)}20%,80%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}.slogan-one,.slogan-two,.slogan-three,.slogan-four{opacity:0;width:100%;position:absolute;text-align:center}.slogan-two{animation:slogan-sequence 2s ease-in-out forwards;animation-delay:2.5s}.slogan-three{animation:slogan-sequence 2s ease-in-out forwards;animation-delay:4.5s}.slogan-four{animation:slogan-sequence 2s ease-in-out forwards;animation-delay:6.5s}.slogan h1{margin:0;text-align:center;font-family:Noto Sans,sans-serif;font-size:clamp(1rem,3vw,3.5rem);font-weight:500;color:#0cffe0}.slogan-two h1,.slogan-three h1,.slogan-four h1{text-align:center}section.loading{background-color:#c6680a;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;margin:0;padding:0;position:fixed;top:0;left:0;z-index:9999}.logos{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:500px;height:500px}@keyframes rotating-rings{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.logos{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:500px;height:500px;display:grid;place-items:center;pointer-events:none}.logos>img{position:absolute;width:85%;transform-origin:center center;will-change:transform;backface-visibility:hidden}.logos>:nth-child(6){position:absolute;width:120%;top:50%;left:50%;transform:translate(-50%,-50%)}.logos>:nth-child(1){animation:rotating-rings 60s linear infinite}.logos>:nth-child(2){animation:rotating-rings 30s linear infinite}.logos>:nth-child(3){animation:rotating-rings 20s linear infinite}.logos>:nth-child(4){animation:rotating-rings 15s linear infinite}.logos>:nth-child(5){animation:rotating-rings 6s linear infinite}.loading-text{position:fixed;font-family:Noto Sans,sans-serif;font-size:3rem;font-weight:600;color:#640d0d;letter-spacing:.04em;text-align:center;bottom:clamp(1rem,15%,25rem);left:50%;transform:translate(-50%);margin-top:0}.loading-text .dots{display:inline-block;animation:dotAnimation 1.5s infinite}@keyframes dotAnimation{0%{opacity:0}33%{opacity:1}66%{opacity:1}to{opacity:0}}@media (max-width: 1024px){.slogan{width:100%;display:flex;flex-direction:column;justify-content:center;top:50%;align-items:center;position:absolute}.slogan h1{font-size:clamp(1rem,8vw,3.5rem)}.hero-logo{width:clamp(200px,70%,500px);display:block;position:absolute;left:50%;transform:translate(-50%,10%)}.anim-slogan{position:relative;margin-top:2rem;gap:10px;width:100%;text-align:center;display:flex;justify-content:center;padding-top:150px}.slogan-one,.slogan-two,.slogan-three,.slogan-four{position:fixed;bottom:clamp(1rem,15%,25rem);text-align:center;width:auto}.logos{width:60%;height:auto}.loading-text{position:fixed;text-align:center;bottom:clamp(1rem,15%,25rem);left:50%;transform:translate(-50%);font-size:clamp(.5rem,8vw,3rem);margin-top:0}}.detail{display:flex;flex-direction:column;justify-content:space-between;height:4rem;margin-top:.8rem;margin-bottom:.6rem}.title-price{text-align:center;margin-top:15px}.price,.title{margin:0}.buttons{margin-top:15px;display:flex;justify-content:space-evenly;width:22rem;margin-left:auto;margin-right:auto}button{text-align:center;justify-content:center;width:150px;height:40px;color:#fff;border:solid .5px white;font-size:1.2em;font-weight:600;border-radius:12px;font-style:unset;background-color:transparent;cursor:pointer}button:hover{background-color:#fff3}@keyframes regEase{0%{transform:scale(1)}to{transform:scale(1.2)}}a.active{animation:regEase .4s ease-in-out forwards}.popup{display:none;position:absolute;width:30rem;height:45rem;max-width:530px;flex-direction:column;justify-content:center;align-items:center;top:50%;left:0;transform:translateY(-50%);margin-left:35px;z-index:2;background:red;border-radius:25px}.popup button{position:absolute;display:flex;flex-direction:row;align-items:center;padding:13px 18px;width:auto;top:-3.5rem;left:0rem;border:none;cursor:pointer;font-size:1.5rem;font-weight:500;letter-spacing:.05rem;z-index:3;background-color:#380d8f66}.popup button img{width:1.8rem;height:1.2rem;margin-right:1rem}.large-product{position:absolute;left:100%;bottom:-5%;transform:translateY(0) translate(-55%);width:180px;height:auto;z-index:2;animation:slideIn .8s ease-out forwards}@keyframes slideIn{0%{left:85%;opacity:0}to{left:100%;opacity:1}}.large-product-mask{position:relative;overflow:hidden;width:180px;height:auto;display:flex;justify-content:center;align-items:center}.popup-content{position:absolute;display:flex;width:100%;height:100%;padding:3rem 2rem 3rem 3rem;flex-direction:column;justify-content:flex-start;align-items:flex-start;border-radius:25px;background-color:#fff}h2.product-name{margin:0;color:#000;text-align:left;font-size:2.1rem;line-height:2.7rem}a.buy-button{display:inline-block;text-decoration:none;color:#fff;background-color:#000;padding:10px 20px;border-radius:12px;font-weight:700;margin:25px 0 15px;align-self:flex-start}@keyframes moveUp{0%{opacity:0;transform:scaleY(1.25) translateY(4rem)}to{opacity:1;transform:scaleY(1) translateY(0)}}div.popup p{opacity:0;margin:10px 0;width:80%;height:23rem;color:#000;overflow:auto;box-sizing:border-box;font-size:1.1rem;font-weight:400;line-height:rem;scrollbar-width:none;-ms-overflow-style:none;animation:moveUp 1s ease-out forwards;animation-delay:.3s}.div.popup p::-webkit-scrollbar{display:none}.spfs{margin:10px 0;display:flex;width:100%}.spf{width:60px;height:60px;background-color:#ff8514;color:#fff;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-right:10px;line-height:1.1rem}.spf h5{margin:0;padding:0;width:100%;text-align:center;font-size:1.1rem}@media (max-width: 1024px){.popup{width:75%;max-width:22rem;height:75%;margin-left:25px}.large-product{width:140px}.popup-content{padding:2rem}h2.product-name{font-size:1.5rem;line-height:2rem}div.popup p{font-size:.9rem;line-height:1.4rem}}section.background .container.eleven{position:absolute;top:1000vh;height:100vh;width:100%}section.third .container.eleven{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);height:100vh;width:100%;max-width:2000px;display:flex;opacity:0;pointer-events:none;flex-direction:column;box-sizing:border-box;color:#73430e;background-color:#deb382}.social-media,.sitemap,.logo-copyright{display:block;width:100%;text-align:center;padding:20px}.cabana-logo-sun{width:15rem;height:auto;margin-right:10px}.logo-copyright{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.logo-copyright-images{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;width:30%;gap:20px;margin-bottom:30px}.logo-copyright img{height:30px;width:auto;flex:1;max-width:150px;object-fit:contain}.logo-copyright p{font-size:.9rem;font-weight:400}.logo-copyright a{color:inherit;text-decoration:none}.logo-copyright a:hover{opacity:.8}.logo-copyright a:visited{color:inherit}.social-icons{display:flex;gap:15px;margin-top:15px}.social-icons a{color:#73430e;text-decoration:none;transition:color .3s ease}.social-icons a:hover{color:#5a2a0a}.sitemap{padding-bottom:0}.sitemap ul{list-style:none;padding:20px;display:inline-block;vertical-align:top;text-align:left;font-size:.9rem;line-height:190%}.sitemap li{margin:5px 0}.sitemap a{color:#73430e;text-decoration:none;transition:color .3s ease}.sitemap a:hover{color:#5a2a0a}.sitemap .sitemap-link{color:#73430e;text-decoration:none;display:block;padding:8px 0}.sitemap .sitemap-link:hover{color:#5a2a0a;text-decoration:underline}.footer-logo{width:100px;height:auto;margin-bottom:10px}.footer-divider{width:70%;max-width:340px;border:none;border-top:2px solid #73430E;margin:0 auto 10px;opacity:.5}.container.eleven .sitemap .nav-link{color:#73430e;background:transparent;text-decoration:none;padding:6px 0;display:block}
