@font-face {
font-family: "Mont";
src: url(https://akal.life/wp-content/themes/bananadesign-child/fonts/Mont-Regular.woff2) format("woff2"),
url(https://akal.life/wp-content/themes/bananadesign-child/fonts/Mont-Regular.woff) format("woff");
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: "Mont";
src: url(https://akal.life/wp-content/themes/bananadesign-child/fonts/Mont-Bold.woff2) format("woff2"),
url(https://akal.life/wp-content/themes/bananadesign-child/fonts/Mont-Bold.woff2) format("woff");
font-weight: 600;
font-style: normal;
}
:root {
--primary-color: #b825da;
--secondary-color: #601f70;
--text-color: #565656;
--body-bg: #fbf4e9;
--white: #fff;
--main-font: "Mont";
--alternative-font: ;
--header-height: 0; --main-transition: 0.8s cubic-bezier(0.83, 0, 0.17, 1);
--cubic-bezier: cubic-bezier(0.83, 0, 0.17, 1);
--xxl: clamp(40px, 8.4rem, 84px);
--xl: clamp(25px, 6.4rem, 64px);
--lg: clamp(18px, 4.8rem, 48px);
--md: clamp(18px, 3.6rem, 36px);
--sm: clamp(13px, calc(1.1rem + 7px), 18px);
}
@media (max-width: 550px) {
:root {
--xl: 5rem;
}
}
*,
*::before,
*::after {
box-sizing: border-box;
min-width: 0;
}
html {
-webkit-text-size-adjust: none; text-size-adjust: none; font-size: calc(100vw / 1920 * 10);
scrollbar-color: var(--secondary-color) #fff; scrollbar-width: thin;
}
::selection {
background: var(--secondary-color);
color: var(--white);
}
@media (max-width: 1400px) {
html {
font-size: calc(100vw / 1400 * 10);
}
}
@media (max-width: 767px) {
html {
font-size: calc(100vw / 767 * 10);
}
}
@media (max-width: 550px) {
html {
font-size: calc(100vw / 550 * 10);
}
}
body {
margin: 0;
display: block;
font-size: clamp(14px, 1.8rem, 18px);
background-color: var(--body-bg);
font-family: var(--main-font);
scrollbar-track-color: var(--scrollbarBG);
scrollbar-thumb-color: var(--thumbBG);
visibility: hidden;
}
body::-webkit-scrollbar-track {
background: var(--scrollbarBG);
}
body::-webkit-scrollbar-thumb {
background-color: var(--thumbBG);
border-radius: 6px;
border: 3px solid var(--scrollbarBG);
}
img {
display: block;
max-width: 100%;
}
ol,
ul {
padding-left: 0;
margin: 0;
}
li::marker {
font-size: 0;
color: var(--primary-color);
}
a {
text-decoration: none;
color: inherit;
}
:focus:not(:focus-visible) {
outline: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
display: block;
line-height: 1.2;
}
p {
margin: 0;
display: block;
line-height: 1.4;
} .main-color {
color: var(--primary-color);
}
.secondary-color {
color: var(--secondary-color);
}
.text-color {
color: var(--text-color);
}
.white {
color: var(--white);
}
.main-font {
font-family: var(--main-font);
}
.alternative-font {
font-family: var(--alternative-font);
}
.xxl {
font-size: var(--xxl);
}
.xl {
font-size: var(--xl);
}
.lg {
font-size: var(--lg);
}
.md {
font-size: var(--md);
}
.sm {
font-size: var(--sm);
}
.easing {
transition: var(--main-transition);
}
.cubic-bezier {
transition-property: var(--cubic-bezier);
}
.relative {
position: relative;
}
.absolute {
position: absolute;
}
.fixed {
position: fixed;
}
.sticky {
position: sticky;
}
.hidden {
overflow: hidden;
}
.visible {
overflow: visible;
}
.flex {
display: flex;
}
.inline-flex {
display: inline-flex;
}
.flex-column {
flex-direction: column;
}
.wrap {
flex-wrap: wrap;
}
.nowrap {
flex-wrap: nowrap;
}
.block {
display: block;
}
.none {
display: none;
}
.inline-block {
display: inline-block;
}
.text-center {
text-align: center;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.w-100 {
width: 100%;
}
.w-50 {
width: 50%;
}
.w-20 {
width: 20%;
}
.cursor-pointer {
cursor: pointer;
}
.align-center {
align-items: center;
}
.align-start {
align-items: start;
}
.align-end {
align-items: end;
}
.justify-center {
justify-content: center;
}
.justify-end {
justify-content: end;
}
.justify-start {
justify-content: start;
}
.justify-space-between {
justify-content: space-between;
}
.vertical-middle {
vertical-align: middle;
}
.radious-50 {
border-radius: 50%;
}
.radious-0 {
border-radius: 0;
}
.pointer-none {
pointer-events: none;
}
.pointer-all {
pointer-events: all;
}
.text-uppercase {
text-transform: uppercase;
}
.text-lowercase {
text-transform: lowercase;
}
.radius {
border-radius: 30px;
}
section > .background,
.background img {
height: 100%;
width: 100%;
object-fit: cover;
} .line-animation {
opacity: 0;
}
.fade-in {
opacity: 0;
}
.img-animation {
transform: scale(1.3);
opacity: 0;
} .social-holder,
.social-holder path,
.social-holder circle {
transition: 0.5s ease;
}
.social-holder:hover circle {
fill: var(--primary-color);
}
footer .social-holder:hover circle {
fill: #fdb924;
}
.social-holder:hover {
background-color: var(--secondary-color);
}
.social-holder:hover .icon {
transform: translateY(-100%);
}
.social-holder .hidden-icon {
transform: translateY(100%);
}
.social-holder:hover .hidden-icon {
transform: translateY(0%);
} .asset-holder {
--shape-width: clamp(50px, 11.3rem, 113px);
width: var(--shape-width);
right: clamp(40px, 8rem, 80px);
top: 0%;
}
.asset-holder:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) scale(1.6) rotate(0deg);
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/04/text-purple.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
animation: rotateAsset 15s linear infinite;
will-change: transform;
}
@keyframes rotateAsset {
0% {
transform: translate(-50%, -50%) scale(1.6) rotate(0deg);
}
100% {
transform: translate(-50%, -50%) scale(1.6) rotate(360deg);
}
}
@media (max-width: 550px) {
.asset-holder {
--shape-width: 7rem;
}
} .profile-section {
padding-top: clamp(120px, 12rem, 120px);
}
.profile-section:before {
content: "";
position: absolute;
left: -13%;
top: clamp(50px, 10rem, 100px);
width: 13%;
height: 100%;
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/03/akal-vertiacl.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: top left;
pointer-events: none;
transition: 1.5s var(--cubic-bezier);
}
.profile-section.active:before {
left: 0%;
}
.profile-section .description b {
display: block;
margin-bottom: 10px;
color: var(--secondary-color);
font-weight: 300;
}
.profile-section .title {
margin-bottom: clamp(20px, 4rem, 40px);
}
.profile-section .heading1 {
margin-bottom: clamp(15px, 3rem, 30px);
}
.profile-section .main-btn {
margin-top: clamp(15px, 3rem, 30px);
}
.profile-section .quote-holder {
margin-top: clamp(60px, 12rem, 120px);
margin-bottom: clamp(60px, 12rem, 120px);
}
.profile-section img {
border-radius: 30px;
}
@media (min-width: 992px) {
.profile-section .row1 :is(.column1, .column2) {
padding-left: clamp(30px, 12.5rem, 125px);
}
.profile-section .row1 .column2 {
padding-right: clamp(30px, 12.5rem, 125px);
}
}
@media (max-width: 1400px) and (min-width: 992px) {
.profile-section:before {
display: none;
}
.profile-section .row1 :is(.column1, .column2) {
padding-left: clamp(30px, 8.5rem, 125px);
}
.profile-section .row1 .column2 {
padding-right: clamp(30px, 8.5rem, 125px);
}
}
@media (max-width: 991px) {
.profile-section .row1 {
display: block;
max-width: 560px;
margin: 0 auto;
}
.profile-section .row1 :is(.column1, .column2) {
width: 100%;
}
.profile-section .row1 .column2 {
margin-top: 5rem;
}
}
@media (max-width: 550px) {
.profile-section:before {
display: none;
}
.profile-section {
padding-top: clamp(50px, 10rem, 100px);
}
}
.container {
max-width: clamp(1400px, 146rem, 1460px);
width: 100%;
padding-left: clamp(15px, 3rem, 30px);
padding-right: clamp(15px, 3rem, 30px);
margin: 0 auto;
position: relative;
}
.header-container {
padding-left: 30px;
padding-right: 30px;
max-width: clamp(0rem, calc(168rem + 30px), 1900px);
width: 100%;
margin: 0 auto;
}
.full-height {
height: 100vh;
height: 100dvh;
}
@media (max-width: 550px) {
.header-container {
padding-left: 3rem;
padding-right: 3rem;
}
.container {
padding-left: 3rem;
padding-right: 3rem;
}
}
.fw-100 {
font-weight: 100;
}
.fw-200 {
font-weight: 200;
}
.fw-300 {
font-weight: 300;
}
.fw-400 {
font-weight: 400;
}
.fw-500 {
font-weight: 500;
}
.fw-600 {
font-weight: 600;
}
.fw-700 {
font-weight: 700;
}
.fw-800 {
font-weight: 800;
}
.fw-900 {
font-weight: 900;
}
.z--1 {
z-index: -1;
}
.z-0 {
z-index: 0;
}
.z-1 {
z-index: 1;
}
.z-2 {
z-index: 2;
}
.z-3 {
z-index: 3;
}
.z-4 {
z-index: 4;
}
.z-5 {
z-index: 5;
}
.z-6 {
z-index: 6;
}
.z-7 {
z-index: 7;
}
.z-8 {
z-index: 8;
}
.z-9 {
z-index: 9;
}
.z-10 {
z-index: 10;
}
.z-top {
z-index: 99999;
}
@media (max-width: 991px) {
.mobile-hidden {
display: none;
}
}
@media (min-width: 992px) {
.mobile-only {
display: none;
}
}
.title {
position: relative;
display: inline-block;
padding: 0 clamp(5px, 2rem, 20px);
font-size: var(--sm);
font-weight: 300;
color: var(--secondary-color);
text-align: center;
}
.title.title-light {
color: var(--body-bg);
}
.title:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: clamp(8px, 1.2rem, 12px);
height: clamp(15px, 3rem, 30px);
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/03/title-left-shape.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.title.title-light:before {
background-image: url(//akal.life/wp-content/uploads/2024/03/title-shape-left-white.svg);
}
.title:after {
content: "";
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: clamp(8px, 1.2rem, 12px);
height: clamp(15px, 3rem, 30px);
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/03/title-right-shape.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.title.title-light:after {
background-image: url(//akal.life/wp-content/uploads/2024/03/title-shape-right-white.svg);
}
.main-btn {
position: relative;
display: inline-block;
border: 2px solid var(--secondary-color);
background-color: transparent;
font-size: var(--sm);
color: var(--secondary-color);
border-radius: clamp(50px, 10rem, 100px);
padding: clamp(9px, 1.5rem, 15px) clamp(25px, 4rem, 40px);
transition: 0.5s ease;
line-height: 1.4;
font-weight: 300;
}
.main-btn.light-btn {
border-color: var(--white);
color: var(--white);
}
.main-btn:hover {
background-color: var(--primary-color);
border-color: var(--primary-color);
color: var(--white);
transform: scaleX(1.02);
transition: transform 0.4s cubic-bezier(0.34, 4.56, 0.64, 1);
}
.main-btn.light-btn:hover {
background-color: var(--white);
border-color: var(--white);
color: var(--primary-color);
}
.main-btn .mask-text {
transition: transform 0.5s ease;
}
.main-btn:hover .mask-text {
transform: translateY(-120%);
}
.main-btn .mask-text:after {
content: attr(data-text);
display: block;
position: absolute;
top: 120%;
left: 0;
}
.breadcrumb {
padding-top: clamp(10px, 2rem, 20px);
padding-bottom: clamp(10px, 2rem, 20px);
border-bottom: 1px solid var(--text-color);
}
#breadcrumbs {
color: #7e7a76;
font-size: clamp(12px, 1.4rem, 14px);
}
#breadcrumbs a {
transition: 0.5s;
color: #7e7a76;
}
#breadcrumbs a:hover {
color: var(--primary-color);
}
#breadcrumbs span.breadcrumb_last {
color: var(--secondary-color);
font-weight: 300;
font-family: var(--main-font);
}
#breadcrumbs .arrow-holder {
width: clamp(25px, 5rem, 50px);
height: clamp(25px, 5rem, 50px);
background-color: var(--white);
transition: 0.5s;
border-radius: 50%;
margin-right: clamp(15px, 3rem, 30px);
}
#breadcrumbs .arrow-holder:hover {
transform: scale(1.1);
background-color: var(--primary-color);
}
#breadcrumbs .arrow-holder :is(.hidden-arrow, .arrow) {
transition: 0.5s ease;
position: absolute;
left: 50%;
top: 50%;
}
#breadcrumbs .arrow-holder .hidden-arrow {
opacity: 0;
transform: translateX(100%);
}
#breadcrumbs .arrow-holder:hover .arrow {
transform: translateX(-100%);
opacity: 0;
}
#breadcrumbs .arrow-holder:hover .hidden-arrow {
transform: translateX(0%);
opacity: 1;
}
#breadcrumbs .arrow-holder svg {
width: 100%;
height: 100%;
}
@media (max-width: 550px) {
#breadcrumbs .arrow-holder {
margin-right: 5px;
min-width: 40px;
min-height: 40px;
}
} .prefooter {
background-color: var(--white);
}
.prefooter .container {
padding-top: clamp(55px, 11.9rem, 119px);
padding-bottom: clamp(55px, 11.9rem, 119px);
}
.prefooter .title {
margin-bottom: clamp(20px, 4rem, 40px);
}
.prefooter .description {
margin: clamp(15px, 3rem, 30px) 0;
}
.prefooter .container {
max-width: clamp(500px, 112.2rem, 1122px);
}
.prefooter .call-btn:after {
content: ">";
font-size: inherit;
color: inherit;
font-weight: inherit;
transition: 0.5s ease;
margin-left: clamp(5px, 1rem, 10px);
}
.prefooter .call-btn:hover:after {
transform: translateX(clamp(2px, 0.5rem, 5px));
}
.prefooter .buttons-holder {
margin-top: clamp(20px, 4rem, 40px);
}
@media (min-width: 551px) {
.prefooter .main-btn {
margin-right: clamp(5px, 1.5rem, 15px);
}
.prefooter .call-btn {
margin-left: clamp(5px, 1.5rem, 15px);
}
}
@media (max-width: 550px) {
.prefooter br {
display: none;
}
.prefooter .buttons-holder,
.prefooter .buttons-holder a {
display: block;
text-align: center;
}
.prefooter .buttons-holder .main-btn {
margin-bottom: 3rem;
}
} footer {
width: 100%;
background-color: var(--primary-color);
padding-top: clamp(0rem, 17.3rem, 173px);
}
footer .row2:before {
content: "";
position: absolute;
left: 50%;
bottom: -120%;
transform: translateX(-50%);
width: 65vw;
height: 0%;
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/03/akal-bg.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
z-index: -1;
pointer-events: none;
transition: 2s var(--cubic-bezier);
}
footer .row2.active:before {
bottom: 0%;
height: 120%;
}
form {
position: relative;
z-index: 2;
}
form br {
display: none;
}
.wpcf7-spinner {
display: none;
}
.wpcf7-list-item {
margin-left: 0;
margin-top: 1rem;
}
.wpcf7-list-item > label {
display: flex;
align-items: center;
}
.wpcf7-form-control-wrap[data-name="Email"] {
width: 74%;
display: block;
float: left;
}
.wpcf7 input[type="email"],
.wpcf7 input.wpcf7-validates-as-required,
.wpcf7-select,
.wpcf7 textarea {
height: clamp(0rem, 6.5rem, 65px);
padding: clamp(0rem, 1rem, 10px) clamp(0rem, 3rem, 30px);
font-size: 14px;
border-radius: 300px;
border: 2px solid #fff3;
background-color: transparent;
color: #fff;
font-family: var(--main-font);
font-weight: 300;
width: calc(100% - 1rem);
transition: 0.5s ease;
}
.wpcf7 input[type="email"]:focus {
border-color: var(--white);
}
.wpcf7-submit {
height: clamp(0rem, 6.5rem, 65px);
padding: clamp(0rem, 1rem, 10px) clamp(0rem, 3rem, 30px);
font-size: var(--sm);
border-radius: 300px;
border: 2px solid #fff;
background-color: transparent;
color: #fff;
font-family: var(--main-font);
font-weight: 300;
cursor: pointer;
transition: 0.5s;
}
.wpcf7-submit:not(:disabled):hover {
border-color: var(--primary-color);
background-color: var(--primary-color);
color: var(--white);
}
footer .wpcf7-submit:not(:disabled):hover {
border-color: var(--white);
background-color: var(--white);
color: var(--primary-color);
}
.wpcf7 input[type="email"]:focus {
outline: none;
}
.wpcf7 input[type="email"]::placeholder {
font-size: var(--sm);
color: #fff3;
font-family: var(--main-font);
font-weight: 300;
}
.wpcf7-list-item-label {
font-size: 12px;
line-height: 1.2;
color: var(--white);
font-weight: 300;
font-family: var(--main-font);
}
.wpcf7-list-item-label a {
text-decoration: underline;
color: var(--white);
}
.wpcf7-list-item label input {
background-color: transparent;
border: 1px solid var(--white);
border-radius: 50%;
outline: none;
cursor: pointer;
min-width: clamp(7px, 2rem, 20px);
min-height: clamp(7px, 2rem, 20px);
accent-color: var(--secondary-color);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0 8px 0 0;
}
.wpcf7-list-item label input[type="checkbox"]:checked { background-image: url(//akal.life/wp-content/uploads/2024/04/form-checkbox.svg);
background-size: clamp(15px, 3rem, 30px);
background-repeat: no-repeat;
background-position: center center;
}
.wpcf7-not-valid-tip {
color: var(--white);
font-size: 14px;
margin-top: 1.5rem;
font-weight: 300;
font-family: var(--main-font);
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border: 0px;
padding: 0px;
margin: 0px;
font-size: var(--sm);
font-weight: 300;
color: var(--white);
font-family: var(--main-font);
margin-top: clamp(0rem, 3rem, 30px);
text-decoration: underline;
}
footer .row1 .heading1 {
max-width: clamp(0rem, 48rem, 480px);
}
footer .row1 .heading2 {
max-width: clamp(0rem, 52rem, 520px);
margin-bottom: clamp(0rem, 1.2rem, 12px);
}
footer .row1 .row-title {
margin-bottom: clamp(0rem, 2.4rem, 24px);
}
footer .row2 {
padding-bottom: clamp(0rem, 13.2rem, 132px);
z-index: 2;
}
footer .row2 .row-title {
margin-bottom: clamp(0rem, 2rem, 20px);
}
footer .row1 {
margin-bottom: clamp(0rem, 10rem, 100px);
} footer .footer-menu-list li a {
color: var(--white);
font-size: var(--sm);
font-weight: 300;
font-size: 14px;
font-family: var(--main-font);
max-width: 250px;
display: inline-block;
position: relative;
}
footer .footer-menu-list li a:before {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 0%;
height: 1px;
display: block;
background-color: var(--white);
transition: var(--main-transition);
}
footer .footer-menu-list li a:hover:before {
width: 100%;
right: auto;
left: 0;
}
footer .column4 p,
footer .column4 a {
font-size: 14px;
display: block;
margin-bottom: 0.5rem;
max-width: 250px;
color: var(--white);
font-weight: 300;
display: inline-block;
}
footer .row3 {
padding-top: clamp(0rem, 3.9rem, 39px);
padding-bottom: clamp(0rem, 3.9rem, 39px);
background-color: var(--primary-color);
}
footer .row3:before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0;
width: calc(100% - 6rem);
height: 1px;
display: block;
background-color: var(--white);
}
.social-holder {
background-color: var(--white);
width: clamp(0rem, 4.6rem, 46px);
height: clamp(0rem, 4.6rem, 46px);
}
.social-holder:not(:last-child) {
margin-right: clamp(0rem, 2rem, 20px);
}
footer .backtotop {
font-size: 14px;
}
footer .backtotop:after {
content: "";
position: relative;
width: 17.4px;
height: 17.4px;
display: block;
background-image: url(//akal.life/wp-content/uploads/2024/03/BackToTop.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
margin-left: 10px;
}
footer .row3 .column3 :is(span, a) {
font-size: 14px;
}
footer .row3 .column3 > span {
max-width: 260px;
text-align: right;
}
footer .wpcf7 input[type="email"] {
width: 65%;
}
@media (min-width: 1401px) {
footer .row1 .column2 {
padding-left: clamp(5rem, 15rem, 150px);
}
}
@media (max-width: 1400px) {
footer {
padding-top: 17.3rem;
}
footer .row3:before {
max-width: 100%;
}
}
@media (max-width: 991px) {
footer .row2 {
flex-wrap: wrap;
}
footer .row2 .row-column {
flex-basis: 50%;
margin-bottom: 5rem;
}
}
@media (max-width: 767px) {
footer {
padding-top: 10rem;
}
footer .row1 {
display: block;
}
footer .row1 .column1 {
margin-bottom: 10rem;
}
footer .row2 {
padding-bottom: 4rem;
}
footer .row3 {
flex-wrap: wrap;
}
footer .row3 .column1 {
flex-basis: 50%;
order: 2;
}
footer .row3 .column2 {
flex-basis: 100%;
order: 1;
margin-bottom: 3rem;
}
footer .row3 .column3 {
flex-basis: 50%;
order: 3;
}
footer .social-holder:not(:last-child) {
margin-right: 1rem;
}
.wpcf7-form-control-wrap[data-name="Email"] {
width: 68%;
}
}
@media (max-width: 550px) {
footer {
padding-top: 10rem;
}
footer .row2 .row-column {
flex-basis: 100%;
margin-bottom: 5rem;
}
footer .row3:before {
max-width: 47.5rem;
}
footer .row3 :is(.column1, .column2, .column3) {
flex-basis: 100%;
justify-content: start;
}
footer .row3 .column3 > span {
text-align: left;
}
footer .backtotop {
justify-content: start;
}
footer .row3 .column1 {
margin-bottom: 3rem;
}
footer .backtotop {
width: max-content;
}
footer .wpcf7 input[type="email"] {
width: 65%;
}
} header .toolbar {
background-color: var(--primary-color);
padding-top: clamp(0rem, 1rem, 10px);
padding-bottom: clamp(0rem, 1rem, 10px);
}
header {
background-color: #fefcf9;
transition: var(--main-transition);
}
body.scroll-down header {
transform: translateY(-100%);
}
body.scroll-up header {
transform: translateY(0%);
}
.header-holder {
padding-top: clamp(0rem, 1.5rem, 15px);
padding-bottom: clamp(0rem, 1.5rem, 15px);
}
.burger-icon {
width: clamp(0rem, 6rem, 60px);
height: clamp(0rem, 6rem, 60px);
border-radius: clamp(0rem, 1.5rem, 15px);
background-color: var(--primary-color);
}
.burger-icon img {
width: clamp(0rem, 3.1rem, 31px);
}
.burger-menu span {
margin-right: clamp(0rem, 1rem, 10px);
}
header .logo {
width: clamp(0rem, 11.8rem, 118px);
}
header .header-holder :is(.column1, .column2, .column3) {
width: 33.333%;
}
header .header-menu-list li:not(:last-child) {
margin-right: clamp(0rem, 2rem, 20px);
}
header .header-menu-list li a {
color: var(--secondary-color);
font-size: var(--sm);
transition: 0.5s ease;
}
header .header-menu-list li a:hover {
color: var(--primary-color);
}
.burger-menu:hover img {
transform: rotate(90deg);
}
header .toolbar span {
font-size: clamp(12px, 1.4rem, 14px);
}
header .toolbar .column1 span:before {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 0%;
height: 1px;
display: block;
background-color: var(--white);
transition: var(--main-transition);
}
header .toolbar .column1 a:hover span:before {
width: 100%;
right: auto;
left: 0;
}
header .toolbar .column1 a:not(:last-child) {
margin-right: clamp(0rem, 2rem, 20px);
}
header .toolbar :is(.column1, .column3) {
width: 25%;
}
header .toolbar .column2 {
width: 50%;
}
body ul li a[aria-current="page"] {
color: var(--primary-color) !important;
}
body footer ul li a[aria-current="page"] {
color: var(--white) !important;
font-weight: 600;
}
@media (max-width: 1400px) and (min-width: 992px) {
header .header-holder :is(.column1, .column3) {
width: 40%;
}
header .header-holder .column2 {
width: 20%;
}
}
@media (max-width: 991px) {
header .toolbar .column2 {
width: 100%;
}
header .toolbar .column3 {
width: 25%;
}
header .header-holder .column2 {
justify-content: start;
}
}
@media (max-width: 550px) {
header .toolbar span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} .fullscreen-menu {
left: 0;
top: 0;
background-color: var(--body-bg);
padding-top: clamp(0rem, 5rem, 50px);
opacity: 0;
pointer-events: none;
scrollbar-width: none;
}
.fullscreen-menu::-webkit-scrollbar {
display: none;
}
.fullscreen-menu .row1 {
padding-bottom: clamp(0rem, 10rem, 100px);
}
.fullscreen-menu .row1 :is(.column1, .column2, .column3) {
width: 33.333%;
}
.fullscreen-menu .row2 ul li {
border-bottom: 1px solid #0002;
padding-bottom: clamp(0rem, 2.5rem, 25px);
margin-bottom: clamp(0rem, 2rem, 20px);
}
.fullscreen-menu .row2 ul.sub-menu li {
border-bottom: 0;
padding-bottom: 0;
margin-bottom: 0;
margin-top: clamp(0rem, 1rem, 10px);
}
.fullscreen-menu .row2 .fullscreen-menu-list a {
font-size: var(--md);
font-family: var(--main-font);
font-weight: 300;
color: var(--secondary-color);
transition: 0.5s ease;
}
.fullscreen-menu .row2 .fullscreen-menu-list a:hover {
color: var(--primary-color);
}
.fullscreen-menu .row2 .sub-menu li:not(:last-child) a {
margin-right: clamp(0rem, 4.7rem, 47px);
}
.fullscreen-menu .row2 .sub-menu li a {
font-size: var(--sm);
font-family: var(--main-font);
color: #565656;
transition: 0.5s ease;
}
.fullscreen-menu .row2 .sub-menu li a:hover {
color: var(--primary-color);
} .fullscreen-menu .row2 .fullscreen-menu-list.inline-menu {
border-bottom: 1px solid #0002;
}
.fullscreen-menu .row2 .fullscreen-menu-list.inline-menu li {
border: 0px;
padding-bottom: 0px;
}
.fullscreen-menu .row2 .column1 {
width: 70%;
padding-right: clamp(0rem, 14rem, 140px);
}
.fullscreen-menu .row2 .column2 {
width: 30%;
}
.fullscreen-menu .profile-name {
border-bottom: 1px solid #0002;
margin-top: clamp(0rem, 6.4rem, 64px);
padding-bottom: clamp(0rem, 2.5rem, 25px);
}
.fullscreen-menu .profile-name img {
margin-bottom: clamp(0rem, -1.8rem, -18px);
width: clamp(18px, 8rem, 80px);
}
.fullscreen-menu .profile-name:hover img {
transform: rotate(45deg);
}
.fullscreen-menu .profile-link {
font-size: clamp(23px, 4.6rem, 46px);
line-height: 1.2;
}
.image-wrapper {
border-radius: clamp(0rem, 4rem, 40px);
}
.fullscreen-menu .menu-shape {
width: 100vw;
transform: scale(2.5);
transition-timing-function: var(--cubic-bezier) !important;
height: 100%;
object-fit: cover;
will-change: transform;
} @media (max-height: 100vh) {
.fullscreen-menu {
overflow-y: scroll;
overflow-x: hidden;
padding-bottom: 5rem;
scrollbar-width: 0;
}
.fullscreen-menu::-webkit-scrollbar {
width: 0px;
}
}
@media (min-width: 992px) {
.fullscreen-menu .row2 .sub-menu {
display: flex;
flex-wrap: wrap;
}
}
@media (max-width: 991px) {
.fullscreen-menu .row1 .column2 {
justify-content: start;
}
.fullscreen-menu .row2 {
display: block;
}
.fullscreen-menu .row2 .row-column {
width: 100%;
}
.fullscreen-menu .row2 .column1 {
padding-right: 0;
margin-bottom: 8rem;
}
.fullscreen-menu {
overflow-y: scroll;
overflow-x: hidden;
padding-bottom: 5rem;
}
.fullscreen-menu .row3 .column1 {
margin: 3.5rem 0;
}
.fullscreen-menu .row3 .column1 .telephone {
margin-right: 2.5rem;
}
.fullscreen-menu :is(.row2, .row3) {
max-width: 551px;
}
.fullscreen-menu .row2 {
margin-top: 0;
}
}
@media (max-width: 550px) {
.fullscreen-menu .burger-menu span {
font-size: 14px;
}
.fullscreen-menu .logo {
width: 95px;
}
.fullscreen-menu .row2 .fullscreen-menu-list.inline-menu {
display: block;
}
} body .cky-notice * {
font-family: var(--main-font);
}
body .cky-notice-btn-wrapper .cky-btn,
body .cky-prefrence-btn-wrapper .cky-btn {
border-radius: 300px;
}
body .cky-btn-revisit-wrapper {
background-color: var(--primary-color) !important;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
p a,
li a {
color: inherit;
}