/* Theme Name: Minka Child Theme Theme URI: http://dsherpass.com Author: Brian Raw Author URI: http://instagram.com/brian.raw Description: Minka Theme Template: minka Version: 1.0.0 */ /*==================== GOOGLE FONTS ====================*/ /*==================== VARIABLES CSS ====================*/ :root { /*========== Colors ==========*/ /* hsl(333.33deg 86.54% 40.78%) */ --hue-color: 333.33; /* HSL color mode */ --first-color: hsl(var(--hue-color), 86%, 40%); --first-color-second: hsl(var(--hue-color), 86%, 40%); --second-color: hsl(48, 35%, 14%); --first-color-alt: hsl(var(--hue-color), 57%, 53%); --first-color-lighter: hsl(var(--hue-color), 92%, 85%); --title-color: hsl(var(--hue-color), 8%, 15%); --black-color: hsl(var(--hue-color), 0%, 0%); --text-color: hsl(var(--hue-color), 8%, 40%); --text-color-lighter: hsl(var(--hue-color), 8%, 99% ); --text-color-light: hsl(var(--hue-color), 8%, 65%); --input-color: hsl(var(--hue-color), 86%, 96%); --body-color: hsl(var(--hue-color), 60%, 99.75%); --container-color: #fff; --scroll-bar-color: hsl(var(--hue-color), 12%, 90%); --scroll-thumb-color: hsl(var(--hue-color), 12%, 80%); --section-color: hsl(var(--hue-color), 100%, 100%); /*========== Font and typography ==========*/ --body-font: 'Poppins', sans-serif; --big-font-size: 2rem; --h1-font-size: 1.5rem; --h2-font-size: 1.25rem; --h3-font-size: 1.125rem; --normal-font-size: .938rem; --small-font-size: .813rem; --smaller-font-size: .813rem; /*========== Font weight ==========*/ --font-medium: 500; --font-semi-bold: 600; /*========== Margenes Bottom ==========*/ /* .25rem = 4px, .5rem = 8px, .75rem = 12px ... */ --mb-0-25: .25rem; --mb-0-5: .5rem; --mb-0-75: .75rem; --mb-1: 1rem; --mb-1-5: 1.5rem; --mb-2: 2rem; --mb-2-5: 2.5rem; --mb-3: 3rem; /*========== z index ==========*/ --z-tooltip: 10; --z-fixed: 100; --z-modal: 1000; /*========== Menú ==========*/ --head-height: 95.51px; --nav-height: 59.51px; --menu-height: calc(var(--head-height) + var(--nav-height)); --animation-navigation: 0.6s cubic-bezier(.6, 0, .4, 1); --animation-navigation-fade: 0.3s ease-in-out; /*========== Animations ==========*/ --power1-in: linear(0, 0.0039, 0.0156, 0.0352, 0.0625, 0.0977, 0.1407, 0.1914, 0.2499, 0.3164, 0.3906 62.5%, 0.5625, 0.7656, 1); --power1-out: linear(0, 0.2342, 0.4374, 0.6093 37.49%, 0.6835, 0.7499, 0.8086, 0.8593, 0.9023, 0.9375, 0.9648, 0.9844, 0.9961, 1); --power1-in-out: linear(0, 0.0027, 0.0106 7.29%, 0.0425, 0.0957, 0.1701 29.16%, 0.2477, 0.3401 41.23%, 0.5982 55.18%, 0.7044 61.56%, 0.7987, 0.875 75%, 0.9297, 0.9687, 0.9922, 1); --power2-in: linear(0, 0.0014 11.11%, 0.0071 19.24%, 0.0188 26.6%, 0.037 33.33%, 0.0634 39.87%, 0.0978 46.07%, 0.1407 52.02%, 0.1925 57.74%, 0.2559 63.49%, 0.3295 69.07%, 0.4135 74.5%, 0.5083 79.81%, 0.6141 85%, 0.7312 90.09%, 1); --power2-out: linear(0, 0.2688 9.91%, 0.3859 15%, 0.4917 20.19%, 0.5865 25.5%, 0.6705 30.93%, 0.7441 36.51%, 0.8075 42.26%, 0.8593 47.98%, 0.9022 53.93%, 0.9366 60.13%, 0.963 66.67%, 0.9812 73.4%, 0.9929 80.76%, 0.9986 88.89%, 1); --power2-in-out: linear(0, 0.0036 9.62%, 0.0185 16.66%, 0.0489 23.03%, 0.0962 28.86%, 0.1705 34.93%, 0.269 40.66%, 0.3867 45.89%, 0.5833 52.95%, 0.683 57.05%, 0.7829 62.14%, 0.8621 67.46%, 0.8991 70.68%, 0.9299 74.03%, 0.9545 77.52%, 0.9735 81.21%, 0.9865 85%, 0.9949 89.15%, 1); --power3-in: linear(0, 0.0039 25%, 0.0117 32.89%, 0.0248 39.68%, 0.0457 46.22%, 0.0743 52.21%, 0.1113 57.77%, 0.1575 63%, 0.218 68.33%, 0.2901 73.39%, 0.3745 78.23%, 0.4718 82.88%, 0.5827 87.37%, 0.7074 91.71%, 0.8462 95.91%, 1); --power3-out: linear(0, 0.1538 4.09%, 0.2926 8.29%, 0.4173 12.63%, 0.5282 17.12%, 0.6255 21.77%, 0.7099 26.61%, 0.782 31.67%, 0.8425 37%, 0.8887 42.23%, 0.9257 47.79%, 0.9543 53.78%, 0.9752 60.32%, 0.9883 67.11%, 0.9961 75%, 1); --power3-in-out: linear(0, 0.0029 13.8%, 0.0184 21.9%, 0.0339 25.51%, 0.0551 28.81%, 0.0827 31.88%, 0.1168 34.76%, 0.1962 39.57%, 0.3005 44.02%, 0.4084 47.53%, 0.6242 53.45%, 0.7493 57.93%, 0.8495 62.97%, 0.8888 65.67%, 0.9213 68.51%, 0.9629 73.9%, 0.9876 80.16%, 0.998 87.5%, 1); --power4-in: linear(0, 0.0024 29.91%, 0.008 38.03%, 0.0179 44.72%, 0.035 51.16%, 0.0595 56.88%, 0.0922 62.08%, 0.1338 66.88%, 0.1914 71.85%, 0.262 76.5%, 0.3461 80.88%, 0.4447 85.04%, 0.5587 89.01%, 0.689 92.82%, 0.8359 96.48%, 1); --power4-out: linear(0, 0.1641 3.52%, 0.311 7.18%, 0.4413 10.99%, 0.5553 14.96%, 0.6539 19.12%, 0.738 23.5%, 0.8086 28.15%, 0.8662 33.12%, 0.9078 37.92%, 0.9405 43.12%, 0.965 48.84%, 0.9821 55.28%, 0.992 61.97%, 0.9976 70.09%, 1); --power4-in-out: linear(0, 0.0012 14.95%, 0.0089 22.36%, 0.0297 28.43%, 0.0668 33.43%, 0.0979 36.08%, 0.1363 38.55%, 0.2373 43.07%, 0.3675 47.01%, 0.5984 52.15%, 0.7121 55.23%, 0.8192 59.21%, 0.898 63.62%, 0.9297 66.23%, 0.9546 69.06%, 0.9733 72.17%, 0.9864 75.67%, 0.9982 83.73%, 1); --quad-in: linear(0, 0.0039, 0.0156, 0.0352, 0.0625, 0.0977, 0.1407, 0.1914, 0.2499, 0.3164, 0.3906 62.5%, 0.5625, 0.7656, 1); --quad-out: linear(0, 0.2342, 0.4374, 0.6093 37.49%, 0.6835, 0.7499, 0.8086, 0.8593, 0.9023, 0.9375, 0.9648, 0.9844, 0.9961, 1); --quad-in-out: linear(0, 0.0027, 0.0106 7.29%, 0.0425, 0.0957, 0.1701 29.16%, 0.2477, 0.3401 41.23%, 0.5982 55.18%, 0.7044 61.56%, 0.7987, 0.875 75%, 0.9297, 0.9687, 0.9922, 1); --expo-in: linear(0, 0.0036 31.98%, 0.0097 40.98%, 0.02 48.31%, 0.0373 55.17%, 0.0617 61.16%, 0.0942 66.5%, 0.1354, 0.1918 76.12%, 0.2606 80.46%, 0.3431 84.42%, 0.4399 88.04%, 0.5529 91.38%, 0.6832 94.47%, 0.8315 97.33%, 1); --expo-out: linear(0, 0.1685 2.67%, 0.3168 5.53%, 0.4471 8.62%, 0.5601 11.96%, 0.6569 15.58%, 0.7394 19.54%, 0.8082 23.88%, 0.8646 28.68%, 0.9058 33.5%, 0.9383 38.84%, 0.9627 44.83%, 0.98 51.69%, 0.9903 59.02%, 0.9964 68.02%, 1); --expo-in-out: linear(0, 0.0018 15.99%, 0.01 24.16%, 0.0309 30.58%, 0.0471 33.25%, 0.0678 35.66%, 0.0981 38.21%, 0.1356 40.51%, 0.2348 44.49%, 0.3643 47.7%, 0.6011 51.64%, 0.7153 54.1%, 0.8211 57.49%, 0.8981 61.52%, 0.9293 64.05%, 0.9538 66.88%, 0.9723 70.08%, 0.9853 73.76%, 0.9975 82.54%, 1); --circ-in: linear(-0, 0.0048 9.8%, 0.0192 19.5%, 0.043 29.02%, 0.0761 38.26%, 0.1181 47.13%, 0.1685 55.56%, 0.227 63.44%, 0.2929 70.71%, 0.3656 77.3%, 0.4445 83.15%, 0.5285 88.19%, 0.6173 92.39%, 0.7099 95.7%, 0.805 98.08%, 0.9021 99.52%, 1); --circ-out: linear(0, 0.0979 0.48%, 0.195 1.92%, 0.2901 4.3%, 0.3827 7.61%, 0.4715 11.81%, 0.5555 16.85%, 0.6344 22.7%, 0.7071 29.29%, 0.773 36.56%, 0.8315 44.44%, 0.8819 52.87%, 0.9239 61.74%, 0.957 70.98%, 0.9808 80.5%, 0.9952 90.2%, 1); --circ-in-out: linear(-0, 0.0033 5.75%, 0.0132 11.43%, 0.0296 16.95%, 0.0522 22.25%, 0.0808 27.25%, 0.1149 31.89%, 0.1542 36.11%, 0.1981 39.85%, 0.2779 44.79%, 0.3654 48.15%, 0.4422 49.66%, 0.5807 50.66%, 0.6769 53.24%, 0.7253 55.37%, 0.7714 58.01%, 0.8142 61.11%, 0.8536 64.65%, 0.9158 72.23%, 0.9619 80.87%, 0.9904 90.25%, 1); --sine-in: linear(0, 0.0035, 0.0141 10.7%, 0.0318 16.09%, 0.0566 21.51%, 0.0885 26.98%, 0.1278 32.53%, 0.2288 43.93%, 0.3563 55.48%, 0.5171 67.92%, 0.7139 81.53%, 1); --sine-out: linear(0, 0.2861 18.47%, 0.4829 32.08%, 0.6437 44.52%, 0.7712 56.07%, 0.8722 67.47%, 0.9115 73.02%, 0.9434 78.49%, 0.9682 83.91%, 0.9859 89.3%, 0.9965, 1); --sine-in-out: linear(0, 0.007 5.35%, 0.0282 10.75%, 0.0638 16.26%, 0.1144 21.96%, 0.1833 28.16%, 0.2717 34.9%, 0.6868 62.19%, 0.775 68.54%, 0.8457 74.3%, 0.9141 81.07%, 0.9621 87.52%, 0.9905 93.8%, 1); --back-in: linear(0, -0.0029 4.31%, -0.0119 9.02%, -0.0837 31.27%, -0.0954 36.64%, -0.0998 41.45%, -0.0951 47.03%, -0.079 52.25%, -0.051 57.19%, -0.0108 61.92%, 0.0515 67.19%, 0.1312 72.27%, 0.2286 77.18%, 0.3445 81.96%, 0.4792 86.62%, 0.633 91.17%, 0.8066 95.63%, 1); --back-out: linear(0, 0.1934 4.37%, 0.367 8.83%, 0.5208 13.38%, 0.6555 18.04%, 0.7714 22.82%, 0.8688 27.73%, 0.9485 32.81%, 1.0108 38.08%, 1.051 42.81%, 1.079 47.75%, 1.0951 52.97%, 1.0998 58.55%, 1.0954 63.36%, 1.0837 68.73%, 1.0119 90.98%, 1.0029 95.69%, 1); --back-in-out: linear(0, -0.0059 4.51%, -0.0418 15.63%, -0.0499 20.72%, -0.0476 23.51%, -0.0395 26.12%, -0.0255 28.59%, -0.0055 30.95%, 0.0281 33.76%, 0.0717 36.47%, 0.1901 41.63%, 0.344 46.32%, 0.6156 52.65%, 0.7495 56.35%, 0.8757 60.97%, 0.9663 65.85%, 1.0006 68.58%, 1.0256 71.43%, 1.0417 74.43%, 1.0493 77.65%, 1.0452 83.02%, 1.0077 94.8%, 1); --elastic-in: linear(0, 0.0019 13.34%, -0.0056 27.76%, -0.0012 31.86%, 0.0147 39.29%, 0.0161 42.46%, 0.0039 46.74%, -0.0416 54.3%, -0.046 57.29%, -0.0357, -0.0122 61.67%, 0.1176 69.29%, 0.1302 70.79%, 0.1306 72.16%, 0.1088 74.09%, 0.059 75.99%, -0.0317 78.19%, -0.3151 83.8%, -0.3643 85.52%, -0.3726, -0.3705 87.06%, -0.3463, -0.2959 89.3%, -0.1144 91.51%, 0.7822 97.9%, 1); --elastic-out: linear(0, 0.2178 2.1%, 1.1144 8.49%, 1.2959 10.7%, 1.3463 11.81%, 1.3705 12.94%, 1.3726, 1.3643 14.48%, 1.3151 16.2%, 1.0317 21.81%, 0.941 24.01%, 0.8912 25.91%, 0.8694 27.84%, 0.8698 29.21%, 0.8824 30.71%, 1.0122 38.33%, 1.0357, 1.046 42.71%, 1.0416 45.7%, 0.9961 53.26%, 0.9839 57.54%, 0.9853 60.71%, 1.0012 68.14%, 1.0056 72.24%, 0.9981 86.66%, 1); --elastic-in-out: linear(0, -0.0028 13.88%, 0.0081 21.23%, 0.002 23.37%, -0.0208 27.14%, -0.023 28.64%, -0.0178, -0.0061 30.83%, 0.0588 34.64%, 0.0651 35.39%, 0.0653 36.07%, 0.0514, 0.0184 38.3%, -0.1687 42.21%, -0.1857 43.04%, -0.181 43.8%, -0.1297 44.93%, -0.0201 46.08%, 1.0518 54.2%, 1.1471, 1.1853 56.48%, 1.1821 57.25%, 1.1573 58.11%, 0.9709 62%, 0.9458, 0.9347 63.92%, 0.9349 64.61%, 0.9412 65.36%, 1.0061 69.17%, 1.0178, 1.023 71.36%, 1.0208 72.86%, 0.998 76.63%, 0.9919 78.77%, 1.0028 86.12%, 1); --bounce-in: linear(0, 0.0117, 0.0156, 0.0117, 0, 0.0273, 0.0468, 0.0586, 0.0625, 0.0586, 0.0468, 0.0273, 0 27.27%, 0.1093, 0.1875 36.36%, 0.2148, 0.2343, 0.2461, 0.25, 0.2461, 0.2344, 0.2148 52.28%, 0.1875 54.55%, 0.1095, 0, 0.2341, 0.4375, 0.6092, 0.75, 0.8593, 0.9375 90.91%, 0.9648, 0.9843, 0.9961, 1); --bounce-out: linear(0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%, 0.1407, 0.25, 0.3908, 0.5625, 0.7654, 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657, 0.7539, 0.75, 0.7539, 0.7657, 0.7852, 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532, 0.9414, 0.9375, 0.9414, 0.9531, 0.9726, 1, 0.9883, 0.9844, 0.9883, 1); --bounce-in-out: linear(0, 0.0078, 0, 0.0235, 0.0313, 0.0235, 0.0001 13.63%, 0.0549 15.92%, 0.0938, 0.1172, 0.125, 0.1172, 0.0939 27.26%, 0.0554 29.51%, 0.0003 31.82%, 0.2192, 0.3751 40.91%, 0.4332, 0.4734 45.8%, 0.4947 48.12%, 0.5027 51.35%, 0.5153 53.19%, 0.5437, 0.5868 57.58%, 0.6579, 0.7504 62.87%, 0.9999 68.19%, 0.9453, 0.9061, 0.8828, 0.875, 0.8828, 0.9063, 0.9451 84.08%, 0.9999 86.37%, 0.9765, 0.9688, 0.9765, 1, 0.9922, 1); } } /* Font size for large devices */ @media screen and (min-width: 968px) { :root { --big-font-size: 3rem; --h1-font-size: 2.25rem; --h2-font-size: 1.5rem; --h3-font-size: 1.25rem; --normal-font-size: 1rem; --small-font-size: .875rem; --smaller-font-size: .813rem; } } /*========== Set Dark theme ==========*/ body.dark-theme { --first-color: hsl(var(--hue-color), 100%, 51%); --first-color-second: hsl(var(--hue-color), 30%, 8%); --title-color: hsl(var(--hue-color), 8%, 95%); --text-color: hsl(var(--hue-color), 8%, 75%); --input-color: hsl(var(--hue-color), 29%, 16%); --body-color: hsl(var(--hue-color), 28%, 12%); --container-color: hsl(var(--hue-color), 29%, 16%); --scroll-bar-color: hsl(var(--hue-color), 12%, 48%); --scroll-thumb-color: hsl(var(--hue-color), 12%, 36%); } section[data-theme-section="dark"] { background-color:var(--title-color); color:var(--text-color-light); } [data-theme-section="dark"] h1, [data-theme-section="dark"] h2, [data-theme-section="dark"] h3, [data-theme-section="dark"] h4, [data-theme-section="dark"] .h2 { color: var(--text-color-lighter); } [data-theme-section="dark"] .section__subtitle{ color:var(--first-color); } /*=============== BASE ===============*/ * { box-sizing:border-box; padding:0; margin:0; } html { scroll-behavior: smooth; } @media screen and (min-width: 968px) { html { scrollbar-gutter: stable; } } body, body.page { margin: 0; font-family: var(--body-font); font-size: var(--normal-font-size); background-color: var(--body-color); color: var(--text-color); overflow-x:hidden; } body.show__menu, body.modal-opened { overflow:hidden; } main { transition: transform .3s; margin-top: var(--menu-height); position:relative; } .header__empty main, main.page__cart, main.page__checkout, .home main{ margin-top:0; } main.page__home { margin-top: calc(-1 * var(--menu-height)); } main.body__show-menu { } body.body__show-menu { overflow: hidden; } h1,h2,h3,h4, .h2 { color: var(--title-color); font-weight: var(--font-semi-bold); /*font-family: var(--brand-font);*/ } .h2 { font-size:var(--h2-font-size); } ul { list-style: none; margin:0; } a { text-decoration: none; } img { max-width:100%; height:auto; } .texarea__wrap { padding: .75rem 1rem; border: 1px solid #eaeaea; border-radius: 0.5rem; } .textarea__label { font-size: var(--smaller-font-size); font-weight: 500; } .texarea__wrap:has(textarea:focus-visible) { outline: -webkit-focus-ring-color auto 1px; } .texarea__wrap:has(textarea:focus-visible) .textarea__label { color:var(--title-color); } textarea { resize:vertical; border: none; outline: none; padding: 0.25rem 0.5rem 0.5rem 0; font-size: var(--normal-font-size); font-family: var(--body-font); background-color: transparent; } figure { margin:0; } p, li { line-height:1.5; } strong { font-weight:500; } a, a:visited { color: var(--title-color); } select::-ms-expand { display: none; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-position: calc(100% - 0.5rem) center; background-size: 0.875rem; background-repeat: no-repeat; padding: 0.5rem; padding-right: 2rem; /* Ajusta el espacio para la flecha */ cursor: pointer; border-radius: 0.125rem; } select { background-image: url('data:image/svg+xml,'); } video { outline: none; background-color:var(--body-color); } video::-webkit-media-controls { opacity: 0; visibility:hidden; } video[autoplay] { display: block; cursor:pointer; } ul.list__icon li, .type__rock ul li, .toggle__content ul li, .workshop__target ul li { margin-left: 1.5rem; list-style-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDEyNS43NiAyMTguMDkiPjxkZWZzPjxzdHlsZT4uZHtmaWxsOiM3MDcwNzA7fTwvc3R5bGU+PC9kZWZzPjxnIGlkPSJhIi8+PGcgaWQ9ImIiPjxnIGlkPSJjIj48Zz48cGF0aCBjbGFzcz0iZCIgZD0iTTcwLjI5LDIxOC4wOWMtMTYuODYtNi43Mi0yNy4xOC0xNS45OC0zNC4wNy0yNy4yOS02LjA5LTEwLjAxLTEzLjk1LTE5LjU4LTIwLjg1LTI5LjQtMS4yMS0xLjcyLTIuNDUtMy43OC0yLjEtNS41Niw0Ljk4LTI1LjU2LDEwLjIyLTUxLjA5LDE1LjYyLTc3LjcyLDguNjYsNS4wMiwxNi4zOCw5LjQyLDIzLjg5LDEzLjk2LDEuMTIsLjY4LDEuNTcsMi4wMywxLjcyLDMuMTEsNS4zNyw0MC4zLDEwLjY3LDgwLjYsMTUuOTYsMTIwLjkxLC4wOCwuNi0uMSwxLjIyLS4xNywyWiIvPjxwYXRoIGNsYXNzPSJkIiBkPSJNMTI1LjQ4LDY4LjI3Yy0xNi4zNSw0Ny4xOC0zMi4zMyw5My4yNi00OC4zLDEzOS4zNGwtMS40OCwuMDJjLS42Mi00LjI1LTEuMjktOC41LTEuODYtMTIuNzUtNC4yOS0zMi4xNy04LjQ2LTY0LjM1LTEyLjk5LTk2LjUtLjU4LTQuMTQsMS4wOC02LjQsNi44OC04LjQ4LDE4LjktNi43NiwzNy40MS0xMy45Niw1Ny43NS0yMS42MloiLz48cGF0aCBjbGFzcz0iZCIgZD0iTTEyNS43Niw2My42OWMtMjEuNjgsOC4xNi00Mi44NywxNi4xNC02NS40NCwyNC42NCwuODYtMzAuMDEsMS43LTU5LjAxLDIuNTMtODguMDJsMS40OS0uM2MyMC4zNiwyMS4xMSw0MC43MSw0Mi4yMSw2MS40Miw2My42OVoiLz48cGF0aCBjbGFzcz0iZCIgZD0iTTI0Ljk1LDcwLjdjLTguNi00Ljk2LTE2LjQ0LTkuNDgtMjQuODItMTQuMzJDMTYuODIsMzkuNDMsMzMuMjksMjIuNjksNDkuNzcsNS45NmwxLjMyLC4zMWMtOC42LDIxLjIxLTE3LjIsNDIuNDItMjYuMTMsNjQuNDRaIi8+PHBhdGggY2xhc3M9ImQiIGQ9Ik01NS4wMywxMi4xNlY4Ni4xOGwtMi4xMywuNTljLTcuMDYtNC4wNS0xNC4yLTguMDUtMjEuMDktMTIuMjItLjk4LS41OS0xLjI3LTIuMTMtLjktMy4wNyw3LjkyLTE5LjcyLDE1Ljk5LTM5LjQxLDI0LjExLTU5LjMyWiIvPjxwYXRoIGNsYXNzPSJkIiBkPSJNMCw2Mi4yYzEuNTksLjQ0LDEuODYsLjQ3LDIuMDUsLjU3cTIxLjU0LDExLjQ3LDE3Ljg0LDI5LjIzYy0yLjk1LDE0LjM0LTUuNzksMjguNjktMTAuMzEsNDMuMDZDNi40MSwxMTAuOTIsMy4yMyw4Ni43OCwwLDYyLjJaIi8+PC9nPjwvZz48L2c+PC9zdmc+); } .parallax-- { overflow:hidden; width:100%; height:100%; } .parallax- { width:100%; height:100%; } /******* Inputs Type Google *******/ #frm-contact .form__div, #frm-claims .form__div, #commentform .form__div { position:relative; height:3rem; } #frm-contact .form__input, #frm-claims .form__input, #commentform .form__input { position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #eaeaea; border-radius:.5rem; outline:none; padding:0 1rem; background:none; z-index:1; font-size: var(--normal-font-size); font-family: var(--body-font); color: var(--title-color); } #frm-contact .form__label, #frm-claims .form__label, #commentform .form__label { position:absolute; left:1rem; top:1rem; padding:0 .25rem; background-color:#fff; -webkit-transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); font-size:var(--normal-font-size); line-height: 1; z-index: 2; pointer-events: none; } #frm-contact .form__input:focus + .form__label, #frm-claims .form__input:focus + .form__label, #commentform .form__input:focus + .form__label { top:-0.35rem; left:0.8rem; color:var(--title-color); font-size:var(--smaller-font-size); font-weight:500; z-index:10; pointer-events: auto; } #frm-contact .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label, #frm-claims .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label, #commentform .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label { top:-0.35rem; left:0.8rem; font-size:var(--smaller-font-size); font-weight:500; z-index:10; } #frm-contact .form__input:focus, #frm-claims .form__input:focus, #commentform .form__input:focus { outline: -webkit-focus-ring-color auto 1px; } /*Form Terms + check verify*/ .form__terms { display: flex; gap: 0.25rem; } .form__terms input { appearance: none; width:1rem; height:1rem; border:1px solid var(--text-color); border-radius:.25rem; display: flex; align-items: center; justify-content: center; cursor:pointer; background-color:#fff; -webkit-transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); margin-top: 0.25rem; } .form__terms input:checked { background-color:var(--first-color); border:1px solid var(--first-color); } .form__terms input:before { content:"✔"; color:#fff; font-size:.75rem; opacity:0; } .form__terms input:checked:before { opacity:1; } .form__terms a { color: var(--text-color); text-decoration: underline; transition:.3s ease; } .form__terms a:hover { color: var(--title-color); } .grecaptcha-badge { display: none!important; opacity: 0; } /******* Inputs Type Google *******/ .button.button_alt { border:2px solid; border-color:var(--title-color); background-color:var(--body-color); color:var(--title-color); opacity:.5; } .button.button_alt:hover { background-color:var(--title-color); border-color:var(--title-color); color:var(--body-color); opacity:1; } /*========== SCROLL BAR ==========*/ ::-webkit-scrollbar { width: 0.6rem; height: 0.6rem; background-color:var(--scroll-bar-color); border-radius: .5rem; } ::-webkit-scrollbar-thumb { background-color:var(--scroll-thumb-color); border-radius: .5rem; } ::-webkit-scrollbar-thumb:hover { background-color:var(--text-color-light); } .nav__menu::-webkit-scrollbar { width:.25rem; } /*==================== LAYOUT ====================*/ .container { max-width: 1200px; margin-left: var(--mb-1-5); margin-right: var(--mb-1-5); } .section { padding: 2rem 0 4rem; } .section__header h2 { font-size:var(--big-font-size); } .section__alt { padding:4rem 0; } .grid, .comment-respond, .comment-form { display: grid; gap: 1.5rem; } .flex { display:flex; gap:1.5rem; } .flex-col { display:flex; flex-direction:column; gap:1.5rem; } .button, .button:visited, input[type="button"], input[type="reset"], input[type="submit"] { color: var(--body-color); background-color: var(--title-color); padding: calc(1rem - 2px) 2rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 0.25rem; transition: all .3s ease-in-out; border:2px solid var(--title-color); font-weight: var(--font-medium); user-select: none; } .button__whith__icon { display: flex; align-items: center; position: relative; justify-content: flex-end; } .button__whith__icon .button { padding-right: calc(2rem + 20px); } .button__whith__icon .button__icon { position: absolute; fill: #fff; right: 1.5rem; pointer-events: none; transition: .3s ease; } .button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { color: var(--title-color); background-color: var(--body-color); border-color:var(--title-color); } .woocommerce-notices-wrapper .button, .woocommerce-notices-wrapper .button:visited { padding: 0; color: var(--title-color); background-color: transparent; width: fit-content; border: none; margin-bottom: 0.5rem; } .woocommerce-notices-wrapper .button:hover { text-decoration: underline; } /* For medium devices */ @media screen and (min-width: 568px) { } @media screen and (min-width: 767px) { .container { margin-left:auto; margin-right:auto; } .container__full { width: 80%; max-width: 960px; margin: auto; } body { margin:0; } .section { padding: 6rem 0 2rem; } .section__alt { padding:4rem 0; } .container { width: 80%; max-width: 1080px; } } /*========== Buttons ==========*/ .nav_btns { display: flex; align-items: center; } .button__whith__icon { display: flex; align-items: center; position: relative; justify-content: flex-end; } .button, button, input[type="button"], input[type="reset"], input[type="submit"] { background-color: var(--first-color); color: var(--body-color); padding: 0.75rem 2rem; cursor: pointer; font-weight: var(--font-medium); border: none; transition: .3s ease; font-family: var(--body-font); border-radius: 0.5rem; } .button__whith__icon .button { padding-right: calc(2rem + 20px); } .button__whith__icon .button__icon { position: absolute; fill: #fff; right: 1.5rem; pointer-events: none; transition: .3s ease; } .button:hover, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { background-color: var(--first-color); color:var(--title-color); } .button:hover + .button__icon, button:hover + .button__icon, input[type="button"]:hover + .button__icon, input[type="reset"]:hover + .button__icon, input[type="submit"]:hover + .button__icon { fill:var(--title-color); } /****** Fixed WhastApp ******/ .whatsapp__fixed { font-weight: 400; border-radius: 50%; background-color: var(--body-color); padding: 11px; line-height: 0; position: fixed; bottom: 20px; right: 20px; transition: all 300ms ease 0ms; box-shadow: 0 0 8px 0 #c2c2c2; align-items: center; display: flex; z-index:1; } .whatsapp__fixed, .whatsapp__fixed:visited, .whatsapp__fixed:hover { color: var(--first-color); } /*========= REUSABLE CSS CLASSES =========*/ .section__title {font-size: var(--h1-font-size);} .section__subtitle { display: block; font-size: var(--small-font-size); } .section__title, .section__subtitle { text-align: center; } .desktop {display:none;} @media screen and (min-width: 767px) { .mobile {display:none;} .desktop {display:initial;} } /*================== MENU ==================*/ /**** Global Header ****/ .site-header a, .site-header a:visited { display:inline-block; color:var(--title-color); } .site-header .head__list a { color:var(--first-color); } .dark .site-header a:hover, .black .site-header a:hover, .site-header a:hover, .site-header .current-menu-item a { color:var(--first-color); } .site-header .current-menu-item.mobile a { color:var(--title-color); text-decoration:underline; } .dark .site-header a, .black .site-header a { color: var(--text-color-light); } /* Show Menu */ .scroll-up.show-menu, .scroll-down.show-menu { top: var(--head-height); } .nav__menu::-webkit-scrollbar { height: 0; width:0; } /******* Menú Extras *******/ /***** SHOW MENU *****/ .show-menu main { transform: translateX(-100vw); overflow: hidden; width:100vw; } .show-menu .head { border-color: transparent; } .show-menu.dark .head, .show-menu.black .head{ background-color: rgba(255, 255, 255, 0.79); } .show-menu.dark .head__logo, .show-menu.black .head__logo { filter: brightness(0); } @media screen and (min-width: 767px) { .show-menu main { transform: translateX(0); transition:transform 0s; } .show-menu body { overflow-y: auto; } .show-menu.dark .head { background-color:var(--title-color); } .show-menu.black .head { background-color: var(--black-color); transition: none; } .show-menu.dark .nav, .show-menu.black .nav { border-top: 1px solid var(--second-color); border-bottom: 1px solid var(--second-color); } .show-menu.dark .head__logo, .show-menu.black .head__logo { filter: none; } } /***** SCROLL MENU *****/ .scroll-down .head { transform:translateY(-102%); } .scroll-up.light .header { box-shadow: 0 -1px 4px rgba(0, 0, 0, .15); } .scroll-up.dark .header, .scroll-up.black .header { box-shadow: 0 -1px 4px #f1f1f1; border-color: transparent; } .scroll-down.show-menu .head { transform:none; } @media screen and (min-width: 767px) { .scroll-down .head { transform:translateY(-102%); } .scroll-down .header { transform: none; } .scroll-up.dark .header, .scroll-up.black .header { box-shadow: 0 -1px 4px transparent; } } /***** THEME MENU *****/ .dark .header{ background-color:var(--title-color); } .black .header { background-color: var(--black-color); } @media screen and (min-width: 767px) { .black .nav { border-top: 1px solid var(--second-color); border-bottom: 1px solid var(--second-color); box-shadow: none; } .dark .nav { border-top: 1px solid var(--text-color); border-bottom: 1px solid var(--text-color); } } /*============ MENU HEAD ============*/ /*** Head Theme Dark/Black ***/ .dark .head, .dark .call__box { background-color:var(--title-color); } .black .head, .black .call__box { background-color: var(--black-color); } .dark .head__btn { border-color:var(--text-color-light); color:var(--text-color-light); } .black .head__btn { border-color:var(--text-color-light); color:var(--text-color-light); } .dark .head__logo, .black .head__logo { filter: none; } /*** Head Global***/ .head { position: sticky; top: 0; width:100%; z-index: 21; /*background-color: rgba(255, 255, 255, 0.79);*/ transition: transform 0.6s cubic-bezier(.6, 0, .4, 1), background-color var(--animation-navigation-fade), box-shadow var(--animation-navigation-fade); /*backdrop-filter: blur(3px);*/ } .head__btn {border-color: var(--title-color);} .head__btn:hover {border-color: var(--first-color);} .head__container { display: grid; grid-template-columns: repeat(2, auto); justify-content: space-between; gap: 1.5rem; padding: 0 1.125rem; max-width: 80rem; align-items:center; margin: 0 auto; } .head__logo { display: flex; margin: .5rem 0; transition: filter .3s ease; } .head__content { display: flex; gap: 0.5rem 1rem; justify-items: end; margin: 0.5rem 0; } /*--------- Head Top ---------*/ .head__top { display: flex; align-items: center; } .head__top a { padding: 0.5rem 14px; border: 2px solid var(--first-color); border-radius: 0.5rem; line-height: .8; font-weight: 600; font-size: 12px; transition: border-color.3s ease; color:var(--first-color); } .head__top a:hover { border-color:var(--first-color); } /*** Switcher Languages ***/ .wpml-ls-current-language {display:none;} .wpml-ls-current-language:has(.sub-menu) { position:relative; display:block; } .wpml-ls-current-language ul {margin-left:0;} .wpml-ls-current-language a { display: flex; gap: 0.325rem; align-items: center; justify-content:center; } .wpml-ls-current-language:has(.sub-menu)>a { padding-right: 1.5rem; position: relative; outline: none; --toggle-space: 0.75rem; } .wpml-ls-current-language:has(.sub-menu)>a:before, .wpml-ls-current-language:has(.sub-menu)>a:after { content: ""; background-color: currentColor; display: block; height: 2px; width: 6px; position: absolute; top: 50%; } .wpml-ls-current-language:has(.sub-menu)>a:before { right: calc(var(--toggle-space) + 3px); transform: translateY(-50%) rotate(45deg); } .wpml-ls-current-language:has(.sub-menu)>a:after { right: var(--toggle-space); transform: translateY(-50%) rotate(-45deg); } .wpml-ls-current-language .sub-menu { position: absolute; width: 100%; opacity:0; visibility:hidden; transition: all .3s ease; top: calc(100% + 0.5rem); } .wpml-ls-current-language.hover .sub-menu { opacity:1; visibility:visible; top: calc(100% + 0.125rem); } .black.show-menu .wpml-ls-current-language .sub-menu a, .wpml-ls-current-language .sub-menu a { border-color: var(--text-color-light); background-color:var(--body-color); } .wpml-ls-current-language .sub-menu a:hover { border-color: var(--first-color); } .black .wpml-ls-current-language .sub-menu a { background-color:var(--black-color); } .dark .wpml-ls-current-language .sub-menu a { background-color:var(--title-color); } /*** Burger Icon ***/ .nav-toggle { align-content: center; width: 2.5rem; aspect-ratio: 1; cursor: pointer; color: var(--title-color); --bar-height: 0.125rem; --bar-gap: 0.25rem; } body.show-menu.dark .nav-toggle, body.show-menu.black .nav-toggle { color: var(--title-color); } .dark .nav-toggle, .black .nav-toggle { color: var(--first-color); } .bar-icon { display:block; width: 2rem; height: var(--bar-height); margin: 0 auto; background: currentColor; transition: all .25s ease-out; } .nav-toggle .bar-mid {margin: var(--bar-gap) auto;} .nav-toggle:hover .bar-mid {margin: calc(var(--bar-gap) + var(--bar-height)) auto; } .nav-toggle.opened .bar-mid {margin: var(--bar-gap) auto; opacity:0;} .opened .bar-top {transform: translateY(calc(50% + calc(var(--bar-gap) + (var(--bar-height)/2)))) rotate(45deg);} .opened .bar-bot {transform: translateY(calc(-50% - calc(var(--bar-gap) + (var(--bar-height)/2)))) rotate(-45deg);} /*-------- Head Bottom --------*/ .head__actions { display: flex; align-items: center; gap: 2rem; } /*** Call Center ***/ .callcenter { position:relative; } .call__toggle { font-size: var(--small-font-size); padding: 0.5rem 0.75rem; display: flex; align-items: center; gap: 0.5rem; font-weight: initial; user-select: none; background-color: transparent; color: var(--text-color); border: 1px solid; cursor: pointer; } .call__toggle:hover { color:var(--first-color); border-color:var(--first-color); background-color:transparent; } .call__toggle:after { content:""; border:0.25rem solid; border-bottom-width: 0; border-right-color:transparent; border-left-color:transparent; margin-left: -0.25rem; } .call__box { position: absolute; top: calc(100% + 0.5rem); right: 0; background: var(--body-color); width: max-content; padding: 0.75rem; border: 1px solid var(--text-color-light); border-radius: 0.25rem; display: grid; gap: 0.5rem; visibility: hidden; opacity: 0; font-size: var(--small-font-size); transition: 0.35s cubic-bezier(.75, 0, .25, 1); transform: translateY(1rem); } .call__box.show-numbers { visibility:visible; opacity:1; transform: translateY(0); } .call__box a:hover { text-decoration:underline; } .contact__btn { font-size: var(--small-font-size); padding: 0.5rem 2rem; border: 2px solid; border-radius: 50px; user-select: none; transition: .3s ease; } /*-------- Head Desktop --------*/ @media screen and (min-width: 767px) { .head {top: calc(-1 * var(--menu-height)); } .head__list {display:flex;} .head__bottom { display: flex; column-gap: 3rem; margin-bottom: 0.25rem; align-items: center; } .head__content {display: grid;} } /*=========== MENU HEADER ===========*/ .header { position:sticky; width: 100%; top:var(--head-height); width:100%; /*background-color: rgba(255,255,255,0.79);*/ transition: transform 0.6s cubic-bezier(.6, 0, .4, 1), box-shadow 0.3s ease, background-color var(--animation-navigation-fade); /*backdrop-filter: blur(3px);*/ } /******** NAV ********/ .nav__menu { width: 100vw; padding-left: 0; position: fixed; height: calc(100vh - var(--head-height)); background-color:var(--body-color); overflow-y:auto; } .nav__list { display:grid; gap: 0.75rem 1.5rem; padding: 1rem .5rem; } .nav__list a, .nav__back { font-size:var(--small-font-size); font-weight: var(--font-semi-bold); padding: 1rem; width:100%; text-align:center; color:var(--title-color); transition: color .3s ease; } .black .site-header .nav__list a, .dark .site-header .nav__list a { color:var(--title-color); } .nav__list a:hover, .black .site-header .nav__list a:hover, .dark .site-header .nav__list a:hover { color:var(--first-color); text-decoration:underline; } body .site-header .nav__list .level-1.cta > a { background-color: var(--first-color); border-radius: 2rem; padding: 0.625rem 1.875rem; color: var(--title-color); border: 2px solid var(--first-color); transition: .3s ease; } body .site-header .nav__list .level-1.cta > a:hover { text-decoration:none; color:var(--first-color); background-color: transparent; } .nav__list li:has(.sub-menu) a { border-left: 3px solid var(--first-color); border-radius: 3px 0; border-bottom: solid 1px #f1f1f1; line-height: 1.5; text-align:initial; } .nav__list .level-1:has(.sub-menu) > a { text-transform: uppercase; position: relative; box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 2%); } .nav__list .sub-menu { margin:0; } .level-1 > .sub-menu { left:-100vw; position: absolute; top: 0; transition: left .3s ease-out; background-color: var(--body-color); z-index: 1; height: 100%; width:100%; overflow-y:auto; } .level-1.active > .sub-menu { left: 0; } .nav__back { position:relative; cursor:pointer; color: var(--text-color-light); } .nav__back:hover { color:var(--title-color); } .nav__list li .level-2 > a { text-align:center; text-transform:uppercase; border: 1px solid var(--first-color); border-left:none; border-right:none; } .level-2 > .sub-menu { display:grid; gap:0.75rem; padding: 1rem; } .level-3 > a { padding: .75rem; } /*** Nav Desktop ***/ @media screen and (min-width: 767px) { .header { z-index:20; position:sticky; top:0; } .nav__menu { /*border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1;*/ width: 100%; position: initial; height: auto; background-color: transparent; overflow-y:initial; } .nav__list { display:flex; flex-wrap: wrap; justify-content: center; padding: 0; align-items: center; } .nav__list .level-1 { position:relative; } .nav__list .level-1.menu-full-width { position:initial; } .site-header .nav__list .level-1 > a { padding:1.25rem 0.75rem; } .site-header .nav__list .level-1 > a:hover { text-decoration:none; } .site-header .nav__list .level-1:has(.sub-menu) > a { padding:1.25rem 2rem 1.25rem .75rem; border:none; margin-bottom: 0; pointer-events: auto; box-shadow: none; text-align: center; } .dark .site-header .nav__list .level-1 > a, .black .site-header .nav__list .level-1 > a { color: var(--text-color-light); } .dark .site-header .nav__list .level-1 > a:hover, .black .site-header .nav__list .level-1 > a:hover { color: var(--first-color); text-decoration:none; } .level-1 > .sub-menu { top:100%; left:0; width: auto; height:auto; display: flex; gap:1rem; padding: 1.25rem 1rem 1rem; visibility:hidden; opacity:0; box-shadow: 0 0 5px 0px rgb(0 0 0 / 24%); } .level-1:hover > .sub-menu { opacity:1; visibility:visible; transition: all .25s ease-in-out } .level-2 { min-width: 17.5rem; display: grid; gap: 1rem; align-content: start; } .nav__list li .level-2 > a { padding: 0; text-align: initial; border: none; } .level-2 > .sub-menu { padding: 0; } .level-3 > a { font-size: var(--smaller-font-size); padding: .5rem 1.25rem; } } /*** Menu Arrows ***/ .level-1:has(.sub-menu) > a:before, .level-1:has(.sub-menu) > a:after, .nav__back:after, .nav__back:before { content: ""; background-color: currentColor; display: block; height: 2px; width: 7px; position: absolute; top: 50%; transition: background-color .3s ease; } /*** First Level ***/ .level-1:has(.sub-menu) > a:before { right: 20px; transform: rotate(45deg) translateY(-6px); } .level-1:has(.sub-menu) > a:after { right: 16px; transform: rotate(-45deg); } /*** Submenu Title ***/ .nav__back:before, .nav__back:after { left:2rem; background-color:currentColor; } .nav__back:before { transform: rotate(-45deg) translateY(-3px); } .nav__back:after { transform: rotate(-135deg) translateY(-3px); } /*** Arrows Desktop ***/ @media screen and (min-width: 767px) { .level-1:has(.sub-menu) > a:before, .level-1:has(.sub-menu) > a:after { transition: right .3s ease, width .3s ease, transform .3s ease; } .level-1:has(.sub-menu) > a:before { right: 14px; transform: rotate(45deg); } .level-1:has(.sub-menu) > a:after { right: 10px; transform: rotate(-45deg); } .level-1:has(.sub-menu):hover > a:before, .level-1:has(.sub-menu):hover > a:after { width: 12px; right: 10px; } .level-1:has(.sub-menu):hover > a:before { transform: rotate(-45deg); } .level-1:has(.sub-menu):hover > a:after { transform: rotate(45deg); } /*** Bottom Indicator ***/ .level-1:has(.sub-menu):after { content: ""; display: block; background-color: transparent; height: 0.125rem; position: absolute; bottom: 0px; width: 100%; opacity:0; transition:opacity .3s ease; } .level-1:has(.sub-menu):hover:after { background-color: var(--first-color); opacity:1; } } /*==================== FOOTER ====================*/ /********* Prefooter *********/ /** Associates **/ .associates { display: flex; justify-content: center; align-items: center; gap: 3rem; flex-wrap: wrap; } .associates li { -webkit-filter: saturate(0) grayscale(1); filter: saturate(0) grayscale(1); opacity: 0.5; transition: all 0.4s ease; } .associates li:hover { -webkit-filter: saturate(1) grayscale(0); filter: saturate(1) grayscale(0); opacity:1; } /** Social **/ .prefooter { display: flex; justify-content: center; background-color: #fff; padding: 2rem 1rem; width: 100%; } /** Social **/ .footer__social { display: flex; gap: 1rem; align-items: center; padding: 2.25rem 1.25rem; width: fit-content; border-radius: 50px; border: 1px solid var(--title-color); flex-wrap: wrap; justify-content: center; text-align: center; } .footer__social--content ul { flex-wrap: wrap; justify-content: center; } /********* Main Footer *********/ footer { position:relative; z-index:1; } .footer__bg { border-top: 1px solid #eaeaea; padding-top: 4rem; background-color:#fff; } .footer__menu { grid-template-columns: repeat(auto-fill, minmax(min(50%, 17rem), 1fr)); column-gap: 3rem; row-gap: 3rem; padding: 4rem 0 5rem 0; } .footer__menu--group { row-gap: 3rem; align-content: start; } .footer__subtitle { margin-bottom: .75rem; font-size: var(--normal-font-size); text-transform: uppercase; font-weight: var(--font-semi-bold); color: var(--title-color); } .footer__content { display: flex; flex-direction: column; gap: 1rem; } .footer__content.payments__group { flex-direction:row; } .footer__content li { display: flex; font-size: var(--small-font-size); line-height: 1.4; } .footer__link { color: var(--text-color); transition: color .3s ease; display: grid; gap: 0.5rem; grid-template-columns: 16px 1fr; } .footer__link:visited { color: inherit; } a.footer__link:hover { color:var(--first-color); } .payment__icon { display: flex; align-items: center; } .payments__footer { display:flex; gap:.75rem; } .footer__copy { font-size: var(--smaller-font-size); text-align: center; color: var(--text-color); padding: 3rem 0 2rem 0; background-color: #fff; } @media screen and (min-width: 350px) { .footer__social { padding: 1.25rem 3.25rem; } } @media screen and (min-width: 767px) { .footer__container { padding:0 1rem; } } @media screen and (min-width: 1024px) { .footer__container { padding: 0; } } /*============== COMPONENTS ==============*/ /****** Social List ******/ .social__list { display:flex; gap:1rem; } .social__list li { display:grid; place-content:center; } .social__list .social__icon { display: grid; place-content: center; color:var(--title-color); } .social__list .social__icon:hover { color:var(--title-color); } .black .social__list .social__icon:hover { color:var(--text-color-light); } .social__icon svg, .social__icon svg path { transition: fill .3s ease-in-out; } .social__icon.fb:hover svg {fill: #2D88FF;} .social__icon.ig:hover svg {fill: url(#rg);} .social__icon.yt:hover svg {fill: #f00;} .social__icon.ta:hover svg {fill: #34E0A1;} .social__icon.wa:hover svg {fill: #42cba5;} .social__icon.tt:hover svg path.tt-r {fill: #fe2c55;} .social__icon.tt:hover svg path.tt-b {fill: #25f4ee;} .social__icon.tt:hover svg path.tt-0 {fill: #000;} /************************************************/ /*** PAGE TOUR ***/ /*** PAGE TOUR ***/ /*** PAGE TOUR ***/ /************************************************/ /*---------- ITINERARY TOUR ----------*/ .itinerary__media { position:sticky; top:0; } .itinerary__media img { object-position: 50% 50%; height: 100%; object-fit: cover; } #map { height:100%; } .map__destinations { position:absolute; top:5rem; left:5rem; padding:1.25rem; border-radius:0.75rem; background-color:rgba(0,0,0,.5); color:var(--section-color); box-shadow: 0 1px 2px rgba(60,64,67,0.3),0 2px 6px 2px rgba(60,64,67,0.15); } .map__destinations > h4 { margin:0; } .destinationName { cursor:pointer; width:fit-content; } .itinerary__content { margin-left:auto; } .itinerary { position:relative; margin: 0 1.5rem 0 4rem; } @media screen and (min-width: 767px) { .itinerary { margin: 0 5rem 0 7.5rem; } .itinerary__media { height:100dvh; } .itinerary__media img { max-height: 100dvh; } } .itinerary--wrap { display:grid; } .day__header--wrap:before { content: ""; display: block; width: 100%; height: 2.5rem; } .day { padding-bottom: 2.5rem; border-bottom: 1px dashed #eaeaea; position:relative; --side-distance: .75rem; } .day:last-child { border-bottom:0; } .day__side { position: absolute; top: 2.5rem; margin-bottom: 5.5rem; height: 100%; right: calc(100% + var(--side-distance)); } .day__number { position:relative; background-color: var(--section-color); } .day__number:before { content: ""; position: absolute; display: block; width: 1rem; height: 1rem; background: #000; border-radius: 50%; left: -83px; left: calc((var(--side-distance) * -1) - 27px); top: 1.5rem; z-index: 2; } @media screen and (min-width: 767px) { .day { --side-distance: 3.5rem; } .day__number:before { content: none; } .day__number { position: absolute; display: flex; flex-direction:column-reverse; gap: .25rem; left: calc((var(--side-distance) * -1) - 2.5rem); text-align: center; z-index:1; } .day__number .number { border-radius: 50%; aspect-ratio: 1; place-content: center; width: 2.5rem; background-color: var(--title-color); color: var(--body-color); } } .day__indicator { position: sticky; display: grid; text-align: center; gap: 0.25rem; margin: 0 0 7rem; top: 2.5rem; background-color:var(--section-color); z-index:1; } .day__indicator .number { border-radius: 50%; aspect-ratio: 1; place-content: center; width: 2.5rem; background-color: var(--title-color); color: var(--body-color); } .day__indicator .label { display:none; } @media screen and (min-width: 767px) { .day__indicator .number {display:grid;} .day__indicator .label {display:block;} } .day .notes { position:relative; border:1px solid #eaeaea; border-radius: .75rem; padding: 1.25rem; } .day:last-child .notes:before { content:none; } .day .notes p:last-child { margin-bottom:0; } .day:after { position: absolute; left: calc((var(--side-distance) * -1) - 1.25rem); content: ""; border: 1px dashed #eaeaea; display: block; width: 0; height: 100%; top: 4.5rem; } .day:last-child:after { height:0; } .day.active:last-child:after { height:4.5rem; } .count-1 .day.active:last-child:after { content:none; } .day:first-child .day__header--wrap:after { content: ""; position: absolute; top: 0; width: 1rem; height: 5rem; display: block; background: var(--section-color); z-index: 1; left: calc((var(--side-distance) * -1) - 27px); transition: background-color .3s ease; } .activity__gallery .gallery { display:flex; gap:0.75rem; } .activity__gallery .gallery a { display:grid; border-radius:0.5rem; overflow:hidden; } .activity__gallery .gallery a img { display:block; aspect-ratio:1; object-fit:cover; transition: transform .3s ease; } .activity__gallery .gallery.items-1 a img { aspect-ratio:initial; } .activity__gallery .gallery a:hover img { transform: scale(1.035); } .day__header--wrap { position: sticky; top: calc(var(--nav-height) - 1px) ; background-color: var(--section-color); z-index: 2; transition: background-color .3s ease, top 0.6s cubic-bezier(.6, 0, .4, 1); } .count-1 .day__header--wrap { position:initial; } @media screen and (min-width: 767px) { .day:first-child .day__header--wrap:after { height:2.5rem; } } .day__header { grid-template-columns: auto 3.5rem; align-items: center; position:relative; } .day__header .header__icon svg { margin-left: auto; display: flex } .itinerary__header { padding: 1.5rem 0; border-bottom: 1px dashed #eaeaea; display: flex; gap: 2.5rem; align-items: center; text-transform: uppercase; font-weight: var(--font-medium); font-size: var(--small-font-size); margin: 0 1.5rem; } @media screen and (min-width: 767px) { .itinerary__header { max-width: calc(450px - 3.5rem); margin:0 5rem 0 7.5rem; } } .itinerary__share { position: relative; } .itinerary__share .share__icon { display: grid; padding: .75rem; cursor:pointer; } .itinerary__share .share__box { position: absolute; top: 2.75rem; background-color: var(--section-color); border: 1px solid #eaeaea; border-radius: 0.35rem; z-index: 3; right: -1.5rem; display:none; width: 8.5rem; } .itinerary__share.show .share__box { display:block; } .itinerary__share .share__box ul { padding: 0; margin: 0; display: initial; } .itinerary__share .share__li { display: flex; width: 100%; border-bottom: 1px solid #eaeaea; } .itinerary__share .share__li:last-child { border-bottom: none; } .itinerary__share .share__li .share__link { display: grid; grid-template-columns: 1rem 1fr; gap: 0.5rem; text-transform: capitalize; text-decoration: none; color: var(--text-color); font-weight: initial; padding: 0.75rem 1.5rem 0.75rem 1.25rem; width: 100%; align-items: center; user-select: none; text-wrap: nowrap; cursor:pointer; font-size: var(--smaller-font-size); } .itinerary__share .share__li:first-child:before { content: ""; position: absolute; top: -11px; rotate: 90deg; right: 2.5rem; border-width: 10px 8px 0px 0px; border-color: #0f0; display: block; border-style: solid; border-top: 8px solid transparent; border-right: 8px solid var(--section-color); border-bottom: 8px solid transparent; filter: drop-shadow(-1px 0px 0px #eaeaea); /* border-right-color: #eaeaea; */ transition: .3s ease; } .itinerary__share .share__li:first-child:hover:before { border-right-color: #eaeaea; } .itinerary__share .share__li .share__link:hover { background-color:#eaeaea; transform: scale(1); } .itinerary__share .share__li svg { width: 1rem; height: 1rem; } .day:last-child .day__header:after { opacity:0; transition: opacity 0s ease .3s; } .active.day:last-child .day__header:after { opacity:1; transition: opacity 0s ease .1s; } .day__header h2 { margin:0; } .toggle__switch { cursor: pointer; position: relative; display: grid; width: fit-content; padding-bottom: 0.175rem; padding-right:1rem; --distance-arrow: 0px; user-select:none; opacity:.35; transition: opacity .3s ease; } .toggle__switch:hover { opacity:1; } .toggle__switch .hide { display:none; } .active .toggle__switch .show { display:none; } .active .toggle__switch .hide { display:block; } .toggle__switch:before, .toggle__switch:after { content: ""; background-color: currentColor; display: block; height: 1.5px; width: 5px; position: absolute; top: 50%; transition: all .3s ease; } .toggle__switch:before { right: calc(var(--distance-arrow) + 3px); transform: rotate(45deg); } .toggle__switch:after { right: var(--distance-arrow); transform: rotate(-45deg); } .active .toggle__switch:before {transform: rotate(-45deg);} .active .toggle__switch:after {transform: rotate(45deg);} .day__content { padding: 0; overflow-y: clip; transition: all .35s cubic-bezier(.75, 0, .25, 1); } .day__content h3 { margin:0; position:relative; transition: all .3s ease; } .day__content h3:before { content:""; display:block; width:.75rem; aspect-ratio:1; border:1px solid; border-radius:50%; position:absolute; top:0.5rem; right: calc(100% + var(--side-distance) + 0.875rem); background-color:var(--section-color); z-index:1; } .day__content p { margin-top: .325rem; color: var(--text-color); } @media screen and (min-width: 767px) { .itinerary--wrap { grid-template-columns:repeat(2, 1fr); } .itinerary { margin: 0 5rem 0 7.5rem; max-width: calc(450px - 3.5rem); } .map__destinations { display:none; } } /***************************/ .itinerary__content:before { content: ""; display: block; width: 100%; background-color: var(--body-color); height: var(--nav-height); position: sticky; top: 0; z-index: 1; transition: height 0.6s cubic-bezier(.6, 0, .4, 1) } .nav__list .level-1>a, .nav__list .level-1>a:visited { color:var(--first-color); } .slide__content { height:100%; } .day__content--wrap { display:grid; grid-template-rows:0fr; transition: grid-template-rows .5s ease; overflow:hidden; } .active .day__content--wrap { grid-template-rows:1fr; } .day__content { overflow:hidden; } /**********************************/ /**********************************/ /*List Card Tour*/ .products { margin:0; padding:0; list-style:none; display:grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 3rem 3.125rem; } .embla__config { --gap: 3.125rem; --count: 1; } .experience__gallery.embla__config { --count:1; --gap:0rem; } .embla { position:relative; overflow: hidden; height:100%; } .products.embla__container { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% / var(--count)) - ((var(--gap) * (var(--count) - 1)) / var(--count))); grid-column-gap: calc(var(--gap)); grid-template-columns: initial; } .embla__slide { } .embla__viewport { height: 100%; } @media (min-width: 650px) { .embla__config { --count: 2; } .embla.count-2:not(.embla--fade) .embla__button { opacity:0; visibility:hidden; pointer-events:none; } } @media (min-width: 1155px) { .embla__config { --count: 3; } .embla.count-3:not(.embla--fade) .embla__button { opacity:0; visibility:hidden; pointer-events:none; } } .products__upsells h2 { font-size:var(--h1-font-size); margin-bottom: 0; } .embla__button { position: absolute; top: 50%; transform:translateY(-50%); width: calc((100% / var(--count)) - ((var(--gap)*(var(--count) - 1)) / var(--count))); display: grid; align-content: center; pointer-events: none; } .embla:has(.products) .embla__button { top: 0; aspect-ratio: 4 / 5; transform:translateY(0); } .embla__button.btn__prev {left:0;justify-content: start;} .embla__button.btn__next {right:0;justify-content: end;} .embla__button.btn__prev button, .embla__button.btn__next button { transition: 0.4s cubic-bezier(.75, 0, .25, 1); } .embla__button.btn__prev button {transform-origin:left;} .embla__button.btn__next button {transform-origin:right;} .embla__button.btn__prev button[disabled], .embla__button.btn__next button[disabled] { scale:0; pointer-events: none; visibility: hidden; } .embla__button button { cursor: pointer; pointer-events: auto; width: 2.25rem; aspect-ratio: 1; border: 1.5px solid currentColor; display: grid; place-content: center; transition: .3s ease; border-radius: 50%; background-color: transparent; padding: 0; cursor: pointer; color: var(--text-color-light); transition: .3s ease; } .embla__button button:hover { color: var(--title-color); border-color: var(--title-color); } /*Gallery product*/ .experience__gallery .embla__button button { color:var(--body-color); } .experience__gallery .embla__button button:hover { color:var(--title-color); } .experience__gallery .embla__button { margin:0 .625rem; } /*Gallery product*/ .products .product { color:var(--text-color); display: grid; align-content: space-between; } .products .product:hover img { transform:scale(1.025); } .product .tour__data { /*padding:0 1rem;*/ } .product .woocommerce-loop-product__link { display:grid; gap:1.5rem; text-decoration:none; } .product .woocommerce-loop-product__title { margin:0; color:var(--body-color); font-size:var(--h3-font-size); text-wrap-style: balance; } .tour__action { padding: 1.5rem 1rem; display:flex; justify-content:space-between; gap:1.5rem; align-items: flex-end; } .tour__action a { text-decoration: none; padding: .5rem 1rem; height: fit-content; margin-top: auto; border-radius: 0.25rem; text-wrap: nowrap; } .tour__image { position:relative; display:block; overflow:hidden; border-radius: .5rem; box-shadow: rgba(112, 112, 112, .25) 0 5px 8px; aspect-ratio: 3 / 4; background-color: var(--title-color); } .tour__image img { display: block; aspect-ratio: 3/4; object-fit: cover; transition: .3s ease; user-select: none; } .tour__image .onsale { position: absolute; top: .75rem; left: -2rem; transform: rotate(-35deg); background-color: var(--title-color); color: var(--body-color); padding: .25rem; z-index: 1; line-height: 1.5; font-size: var(--small-font-size); width: 9rem; text-align: center; } /*Single product Page*/ .tour__hero { overflow:hidden; } @media screen and (min-width: 767px) { .tour__hero { display:grid; grid-template-columns:1fr 1fr; } .tour__hero .parallax-layer { transform: translate3d(0px, 0px, 0px)!important; } } .tour__summary h1 { text-wrap-style:balance; } .tour__image__single img { object-position: 50% 50%; max-height: 100dvh; height: 100%; object-fit: cover; display:block; } #primary img.img-id-992 { object-position: 50% 80%;} #primary img.img-id-1205 { object-position: 50% 70%;} #primary img.img-id-1203 { object-position: 50% 70%;} #primary img.img-id-1166 { object-position: 50% 57.5%;} .tour__summary .ppc-button-wrapper { max-width: 18rem; margin-top: 1.5rem; position: relative; z-index: 1; } .woocommerce-notices-wrapper { z-index: 99; position: absolute; top: 1.5rem; left: 1.5rem; width: calc(100% - 3rem); max-width:30rem; } .woocommerce-notices-wrapper .woocommerce-message { padding: 1rem 1.25rem .5rem 1.25rem; border-radius: .75rem; box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 12px 0px; background: var(--body-color); } .tab__content.terms strong { font-weight:700; } .tab__content a { color: var(--title-color); } .tab__content a:hover { text-decoration: underline; } .toggle__content { font-size:var(--small-font-size); } .toggle__content ul { padding: 0; margin: 0 0 0 1.5rem; } .toggle__content ul li { list-style: disc; margin-bottom: .25rem; } /*Reviews*/ .section__reviews .section__title { text-align: center; font-size: var(--big-font-size); } ul.embla__container { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% / var(--count)) - ((var(--gap)*(var(--count) - 1)) / var(--count))); grid-column-gap: calc(var(--gap)); grid-template-columns: initial; margin:0; padding:0; height:100%; } main { margin-top:0; background-color:var(--body-color); /*margin-top: calc(var(--menu-height) * -1);*/ } /*Single product Page*/ .tour__hero { overflow:hidden; } @media screen and (min-width: 767px) { .tour__hero { display:grid; grid-template-columns:1fr 1fr; } .tour__hero .parallax-layer { transform: translate3d(0px, 0px, 0px)!important; } } .tour__summary nav { margin-top:var(--menu-height); } .tour__summary h1 { text-wrap-style:balance; } .tour__image__single img { object-position: 50% 50%; max-height: 100svh; min-height: 100svh; height: 100%; object-fit: cover; display:block; } /****************************/ .site-header .social__list .social__icon { color: var(--text-color); } .site-header a.contact__btn { color:var(--first-color); } .price { width:fit-content; color:var(--title-color); flex-wrap:wrap; .amount { font-weight: bold; font-size:var(--h2-font-size); color:var(--title-color); } & del .amount { font-weight:initial; font-size:var(--small-font-size); color:var(--text-color); } & ins { background:none; display:block; } & del { text-decoration: none; margin-left: 0.25rem; } & del bdi { position:relative; display:inline-flex; } & del bdi:before { content: ""; width: calc(100% + .125rem); display: block; position: absolute; right: -0.0625rem; top: 50%; transform:translateY(-50%); border-bottom: 1px solid currentColor; } } @media screen and (min-width: 767px) { .menu-full-width.level-1:has(.sub-menu):after { width: calc(5ch + 2rem); } } .tour__summary { margin-top:var(--menu-height); } /********************************/ /********************************/ .section__reviews { margin-top:6rem; } .review { border-radius:.625rem; overflow:hidden; } .review picture { display:grid; position:relative; } .loaded picture { opacity:0; visibility:hidden; user-select:none; } .review__media { position:relative; cursor:pointer; user-select:none; } .review__media:hover .play-button-icon { opacity:1; } .review__media video { position: absolute; inset: 0; width: 100%; height: 100%; } /**/ .overlay { pointer-events: none; position: absolute; inset: 0%; pointer-events:none; } .play-button { z-index: 1; justify-content: center; align-items: center; display: flex; } .play-button-icon { /*-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--color--white); background-color: rgba(255,255,255,0.15);*/ border-radius: 100rem; justify-content: center; align-items: center; width: 3rem; height: 3rem; padding: 1rem; transition: all .45s cubic-bezier(.175,.885,.32,1.275); display: flex; transform: scale(1); opacity:.625; } .play .play-button-icon { transform: scale(0); opacity:0; } .svg-icon { width: 100%; height: 100%; color:rgba(255,255,255, 1); } /**********************************/ /*List Card Tour*/ .products { margin:0; padding:0; list-style:none; display:grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 3rem 2rem; } .embla__config { --gap: 1rem; --count: 1; } .embla { position:relative; overflow: hidden; height:100%; } .products.embla__container { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% / var(--count)) - ((var(--gap) * (var(--count) - 1)) / var(--count))); grid-column-gap: calc(var(--gap)); grid-template-columns: initial; } .embla__slide { } .embla__viewport { height: 100%; } @media (min-width: 650px) { .embla__config { --count: 2; } .embla.count-2:not(.embla--fade) .embla__button { opacity:0; visibility:hidden; pointer-events:none; } } @media (min-width: 1155px) { .embla__config { --count: 4; } .embla__config.section__reviews {--count:4.5;} .embla__config.section__tours {--count:3; --gap:1.75rem;} .embla.count-3:not(.embla--fade) .embla__button { opacity:0; visibility:hidden; pointer-events:none; } } .products__upsells h2 { font-size:var(--h1-font-size); margin-bottom: 0; } .embla__button { position: absolute; top: 50%; transform:translateY(-50%); width: calc((100% / var(--count)) - ((var(--gap)*(var(--count) - 1)) / var(--count))); display: grid; align-content: center; pointer-events: none; } .embla:has(.products) .embla__button { top: 0; aspect-ratio: 4 / 5; transform:translateY(0); } .embla__button.btn__prev {left:0;justify-content: start;} .embla__button.btn__next {right:0;justify-content: end;} .embla__button.btn__prev button, .embla__button.btn__next button { transition: 0.4s cubic-bezier(.75, 0, .25, 1); } .embla__button.btn__prev button {transform-origin:left;} .embla__button.btn__next button {transform-origin:right;} .embla__button.btn__prev button[disabled], .embla__button.btn__next button[disabled] { scale:0; pointer-events: none; visibility: hidden; } .embla__button button { cursor: pointer; pointer-events: auto; width: 2.25rem; aspect-ratio: 1; border: 1.5px solid currentColor; display: grid; place-content: center; transition: .3s ease; border-radius: 50%; background-color: transparent; padding: 0; cursor: pointer; color: var(--text-color-light); transition: .3s ease; } .embla__button button:hover { color: var(--title-color); border-color: var(--title-color); } /*Reviews*/ .section__reviews .section__title { text-align: center; font-size: var(--big-font-size); } .reviews { } ul.embla__container { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% / var(--count)) - ((var(--gap)*(var(--count) - 1)) / var(--count))); grid-column-gap: calc(var(--gap)); grid-template-columns: initial; margin:0; padding:0; height:100%; } /*************** Single Cart Section******************/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { background:transparent; border-radius:.25rem; } .ui-state-active, .ui-widget-content .ui-state-active { background-color:var(--title-color); } table.ui-datepicker-calendar tr { border-bottom:0; border-top:0; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: 1px solid #ededed; background: #ededed; font-weight: normal; color: #2b2b2b; } .ui-widget.ui-widget-content { border: none; box-shadow: 5px 5px 20px 5px rgba(0, 0, 0, 0.1); border-radius: 1rem; padding-bottom: .75rem; } .variations { margin:0; padding:0; } .variations .variation, .booking__date,.quantity, .photographer-option { position: relative; padding-left:0; margin-left:0; list-style:none; } .booking__date:after { position: absolute; top: 0; right: 10px; content: " "; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxNCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEuMyAxLjJIMTIuNzQ5OCIgc3Ryb2tlPSIjNEE0QTRBIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+CjxwYXRoIGQ9Ik0xLjMgNC4ySDEyLjc0OTgiIHN0cm9rZT0iIzRBNEE0QSIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIvPgo8cGF0aCBkPSJNMS4zIDcuMkgxMi43NDk4IiBzdHJva2U9IiM0QTRBNEEiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiLz4KPHBhdGggZD0iTTEuMzEyNSAxMC4ySDguNDc0MDYiIHN0cm9rZT0iIzRBNEE0QSIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIvPgo8L3N2Zz4K); background-position: center; background-repeat: no-repeat; width: 20px; height: 100%; filter:invert(1); pointer-events: none; } .variation .label, .booking__date .label, .quantity .label, .photographer-option .label { position: absolute; font-style: normal; font-weight: 700; font-size: 10px; line-height: 20px; color: var(--title-color); top: 8px; left: 16px; text-transform: uppercase; z-index:1; } .variation select, .booking__date input, .quantity input, .booking__quantity select, .photographer-option select { padding: 24px 16px 8px; border-radius: 8px; position: relative; border: 1px solid #dddddd; background-color: var(--body-color); width: 100%; color: var(--title-color); } .variation select, .booking__date input, .photographer-option select { cursor: pointer } .booking__date input::placeholder { color:var(--title-color); } .reset_variations { display: none!important } .booking__quantity input, .booking__quantity select, .photographer-option select { width: 100%; cursor: pointer } @media screen and (min-width: 450px) { .single__cart--wrap { grid-template-columns: 1fr 1fr; display:grid; gap:1.5rem; } .single__cart, .variations_form { max-width:18rem; } } /* form.single__cart .single_add_to_cart_button { grid-column: 1/3; } */ .product-type-variable .single__price { display:none; } .woocommerce-breadcrumb span.delimiter:last-child, .woocommerce-breadcrumb .last_item { display:none; } /*FlatPickr*/ .flatpickr-current-month .flatpickr-monthDropdown-months { text-transform:capitalize; } .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { height: 0; width: 0; visibility: hidden; } .flatpickr-calendar:before, .flatpickr-calendar:after { content:none; } .flatpickr-footer { text-align: left; margin-top: .5rem; color: var(--text-color-light); text-wrap: pretty; font-size: .675rem; line-height: 1.75; } .flatpickr-footer a { color: var(--text-color-light); transition: .3s ease; text-decoration:underline; } .flatpickr-footer a:hover { color: var(--title-color); } .flatpickr-current-month span.cur-month { text-transform:capitalize; } /*========= CONTACT PAGE =========*/ .title__page h1 { text-align: center; font-size: var(--h1-font-size); margin: 0 0 6rem 0; } .claims__book .title__page h1 { margin: 0 0 1rem 0; } .legal__info { font-size:var(--small-font-size); text-align:center; } .legal__info address { margin:0; font-style: normal; } .contact__text { margin: 0 8rem 4rem 0; } .contact__information { display: flex; margin-bottom: var(--mb-2-5); gap: 0.75rem; } .contact__title { font-weight: var(--font-medium); margin:0; } .contact__subtitle, .contact__subtitle a { font-size: var(--small-font-size); color: var(--text-color-light); transition: all .3s ease; white-space: nowrap; } .contact__subtitle:hover, .contact__subtitle a:hover { color:var(--first-color); } .social__contacts { display: flex; gap: 1rem; margin-top: 0.5rem; } /*inputs type Google*/ #frm-contact .form__div, #frm-claims .form__div, #commentform .form__div { position:relative; height:3rem; } #frm-contact .form__input, #frm-claims .form__input, #commentform .form__input { position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #eaeaea; border-radius:.5rem; outline:none; padding:0 1rem; background:none; z-index:1; font-size: var(--normal-font-size); font-family: var(--body-font); color: var(--title-color); } .form__div:has([data-datepicker]):before { position: absolute; top: 0; right: 10px; content: " "; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxNCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEuMyAxLjJIMTIuNzQ5OCIgc3Ryb2tlPSIjNEE0QTRBIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+CjxwYXRoIGQ9Ik0xLjMgNC4ySDEyLjc0OTgiIHN0cm9rZT0iIzRBNEE0QSIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIvPgo8cGF0aCBkPSJNMS4zIDcuMkgxMi43NDk4IiBzdHJva2U9IiM0QTRBNEEiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiLz4KPHBhdGggZD0iTTEuMzEyNSAxMC4ySDguNDc0MDYiIHN0cm9rZT0iIzRBNEE0QSIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIvPgo8L3N2Zz4K); background-position: center; background-repeat: no-repeat; width: 20px; height: 100%; filter: invert(1); } #frm-contact .form__label, #frm-claims .form__label, #commentform .form__label { position:absolute; left:1rem; top:1rem; padding:0 .25rem; background-color:var(--section-color); -webkit-transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .3s ease; transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .3s ease; font-size:var(--normal-font-size); line-height: 1; pointer-events: none; color:var(--text-color); z-index:1; } #frm-contact .form__input:focus + .form__label, #frm-claims .form__input:focus + .form__label, #commentform .form__input:focus + .form__label { top:-0.35rem; left:0.8rem; color:var(--title-color); font-size:var(--smaller-font-size); font-weight:600; z-index:1; pointer-events: auto; } #frm-contact .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label, #frm-claims .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label, #commentform .form__input:not(:placeholder-shown).form__input:not(:focus) + .form__label, #frm-contact .dropdown.visible .form__label, #frm-contact .dropdown.filled .form__label, #frm-contact .form__div.fill .form__label { top:-0.35rem; left:0.8rem; font-size:var(--smaller-font-size); font-weight:600; z-index:1; color:var(--title-color); } #frm-contact .form__input:focus, #frm-claims .form__input:focus, #commentform .form__input:focus { outline: -webkit-focus-ring-color auto 1px; } .input__date.select__date, .form__div select { cursor: pointer; } /*Form Terms + check verify*/ .form__terms { display: flex; gap: 0.25rem; } .form__terms input { appearance: none; width:1rem; height:1rem; border:1px solid var(--text-color); border-radius:.25rem; display: flex; align-items: center; justify-content: center; cursor:pointer; background-color:var(--section-color); -webkit-transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); transition: all .25s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1); margin-top: 0.25rem; } .form__terms input:checked { background-color:var(--first-color); border:1px solid var(--first-color); } .form__terms input:before { content:"✔"; color:var(--section-color); font-size:.75rem; opacity:0; } .form__terms input:checked:before { opacity:1; } .form__terms a { color: var(--text-color); text-decoration: underline; transition:.3s ease; } .form__terms a:hover { color: var(--title-color); } .grecaptcha-badge { display: none!important; opacity: 0; } @media screen and (min-width: 767px) { .contact__container { grid-template-columns: repeat(2, 1fr); } } @media screen and (min-width: 1024px){ .contact__inputs { grid-template-columns: repeat(2, 1fr); } }