.header_top_custom {
padding: 8px 15px;
text-align: center;
color: #fff;
background-color: #0a482f;
}
.header_top_custom strong {
color: #f29c9f;
}
.header_top_custom p {
margin: 0 !important;
}
.sticky-button {
opacity: 0;
visibility: hidden;
position: fixed;
display: flex;
align-items: center;
bottom: 18px;
right: 20px;
padding: 8px 20px 8px 15px;
font-family: 'Markazi Text', sans-serif;
font-size: 24px;
color: #fff;
background-color: #f29c9f;
box-shadow: rgba(0, 0, 0, 0.3) 0px 3px 15px;
transition: all .2s ease;
}
.sticky-button.visible {
opacity: 1;
visibility: visible;
}
.sticky-button .sticky-button__icon {
display: inline-block;
padding-right: 15px;
line-height: 26px;
font-size: 18px;
mask-image: url(https://teebox.nl/wp-content/uploads/2025/01/X-white.svg);
mask-size: contain;
mask-position: left center;
mask-repeat: no-repeat;
width: 20px;
height: 20px;
background-color: #0a482f;
}
.sticky-button .sticky-button__text {
padding-left: 15px;
line-height: 30px;
border-left: 1px dashed #fff;
}
.sticky-button:hover {
background-color: #0a482f;
}
.sticky-button:hover .sticky-button__icon {
background-color: #fff;
}
.hero-video {
position: relative;
width: 100%;
height: 100vh;
}
.hero-video .hero__video {
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.hero__video video {
display: block;
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
}
.hero-video .hero__video.hero__video--desktop {
display: none;
}
.hero-video .hero__video.hero__video--mobile {
display: block;
}
.hero-video .grid_section {
position: absolute;
top: 50%;
left: 0;
width: 100%;
color: #fff;
}
.hero-video .grid_section h1,
.hero-video .grid_section h2,
.hero-video .grid_section h3 {
line-height: 0.95;
}
.hero-video .grid_section * {
color: #fff;
}
@media (min-width: 992px) {
.hero-video .hero__video.hero__video--desktop {
display: block;
}
.hero-video .hero__video.hero__video--mobile {
display: none;
}
}
@media (max-width: 992px) {
.hero-video {
max-height: calc(100vh - 100px);
}
.hero-video .grid_section {
transform: translateY(-50%);
}
}
@media (max-width: 575px) {
.hero-video .grid_section h1 {
font-size: 44px !important;
}
.hero-video .grid_section h1 span[style*="font-size: 60px"] {
font-size: 42px !important;
}
.hero-video .grid_section h1 span[style*="font-size: 40px"] {
font-size: 30px !important;
}
.hero-video .section_inner {
width: 340px !important;
}
}