/*Theme name: Trueheat_2025
Author: Ludek Pasecky, ludek.pasecky@gmail.cz, +420602775598
*/

:root {
 	--white: #FFFFFF;
 	--white_1: #F6F6F6;
 	--white_2: #E7E8ED;
	--red: #C01717;
	--blue: #0065AD;
	--yellow: #ECBF00;
	--black: #000000;
	--color_1: #888FA1;
	--color_2: #747D94;
	--grad_1: linear-gradient(135deg, var(--white_1), var(--white_2));
	--grad_2: linear-gradient(135deg, var(--white_2), var(--white_1));
	--grad_3: linear-gradient(90deg, var(--white_2), var(--white_1));
	--btn_1: 0.2vw 0.2vw 0.2vw #9e9e9e36, -0.05vw -0.05vw 0.3vw #ffffff, inset 0vw 0vw 0vw #ffffff, inset 0vw 0vw 0vw #9e9e9e36;
	--btn_1b: 0.4vw 0.4vw 0.4vw #9e9e9e36, -0.1vw -0.1vw 0.6vw #ffffff, inset 0vw 0vw 0vw #ffffff, inset 0vw 0vw 0vw #9e9e9e36;
	--btn_1c: 0.3vw 0.3vw 0.3vw #9e9e9e36, -0.075vw -0.075vw 0.45vw #ffffff, inset 0vw 0vw 0vw #ffffff, inset 0vw 0vw 0vw #9e9e9e36;
	--btn_2: 0vw 0vw 0vw #9e9e9e36, 0vw 0vw 0vw #ffffff, inset -0.05vw -0.05vw 0.3vw #ffffff, inset 0.2vw 0.2vw 0.2vw #9e9e9e36;
	--img_shadow: drop-shadow(0.2vw 0.3vw 0.50vw #00000030);
	--main_logo: url("images/logo_tomton_full_white.svg");
	--mobile_logo: url("images/logo_tomton_white.svg");
	--white_logo: url("images/logo_tomton_white.svg");
/*	--toogle_grad: linear-gradient(135deg, #3d3d3d, #0e0e0e);
	--toogle_btn: 0vw 0vw 0vw #00000063, 0vw 0vw 0vw #3f3f3f, inset -0.05vw -0.05vw 0.3vw #3f3f3f, inset 0.2vw 0.2vw 0.2vw #00000063;*/
}

@font-face {font-family: mon_bold; src: url("fonts/Montserrat-Bold.woff");}
@font-face {font-family: mon_regular; src: url("fonts/Montserrat-Regular.woff");}
@font-face {font-family: redhat_black; src: url("fonts/RedHat-Black.woff");}

b {font-family: mon_bold; font-weight: normal;}
p {font-family: mon_regular; font-weight: normal;}
a {color: inherit; text-decoration: none;}
.mobile_menu a {text-decoration: underline;}

* {transition: box-shadow 0s ease/* !important*/;}
	
html {
	touch-action: manipulation;
	-webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
}

.white_txt {color: var(--white);}
.red_txt {color: var(--red);}
.blue_txt {color: var(--blue);}
.yellow_txt {color: var(--yellow);}
.common_txt {color: var(--color_2);}

.red {background-color: var(--red);}
.blue {background-color: var(--blue);}
.yellow {background-color: var(--yellow);}

.reveal{
	opacity: 0;
	transition: 0.5s all ease;
}

.reveal.active{
	opacity: 1;
	transition: 0.5s all ease;
}

.active.from_right {
	animation: from_right 0.5s ease-in;
}

.active.from_left {
	animation: from_left 0.5s ease-in;
}

.active.from_bottom {
	animation: from_bottom 0.5s ease-in;
}

@keyframes from_right {
  0%	{transform: translateX(5vw); opacity: 0;}
  100%	{transform: translateX(0); opacity: 1;}
}

@keyframes from_left {
  0%	{transform: translateX(-5vw); opacity: 0;}
  100%	{transform: translateX(0); opacity: 1;}
}

@keyframes from_bottom {
  0%	{transform: translateY(3vw); opacity: 0;}
  100%	{transform: translateY(0); opacity: 1;}
}

input.fit-the-fullspace {
    display: none;
}



@media only screen and (min-width: 300px) {

html, body {width: 100%; height: 100%; margin: 0; padding: 0; border: 0; min-width: 300px; background-color: var(--white_1); display: block;}
	
html {scroll-behavior: smooth; scroll-padding-top: 2.5vw;}
	
.mobile {display: none;}
.desktop {display: block;}
.container {width: 100%; height: 100%;}
	
	
	
/*---------------HIDDEN GUIDE---------------*/
	
.guide_box {
	position: absolute;
	z-index: 1000;
    width: 100%;
	height: 1.5vw;
    top: 0;
	left: 0;
	transition: 0.1s ease;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 0 5vw;
	gap: 3.75vw;
	border-bottom: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 0%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
    line-height: 1.5vw;
    font-size: 0.75vw;
    text-align: center;
    color: white;
    font-family: mon_regular;
}
	
.guide_subbox {
	position: relative;
	display: flex;
	flex-direction: row;
	gap: 2.25vw;
}

.guide_btn {
	position: relative;
    transition: 0.1s ease;
    line-height: 1.5vw;
    font-size: 0.75vw;
    text-align: center;
    color: white;
    font-family: mon_regular;
	opacity: 0.5;
}
	
.guide_btn:hover {
	opacity: 1;
}
	
	
	
/*---------------LANDING MAINS---------------*/
	
.main_bg {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	/*--background-image: url("https://www.tomton.cz/wp-content/themes/tomton_2023/images/th_img_bg.jpg");--*/
	background-size: cover;
	background-color: forestgreen;
	background-position: top center;
	/*--filter: brightness(0.65);--*/
	filter: brightness(1);
}	
	
.back_up {
	position: fixed;
	z-index: 1000;
	height: 2vw;
	width: 2vw;
	bottom: 2vw;
	right: 2vw;
	border-radius: 0.4vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.85vw;
	text-align: center;
	line-height: 2vw;
	color: var(--color_1);
	font-family: mon_regular;
	opacity: 0;
}
	
.back_up:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.back_up_icon {
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: url("images/arrow_up_white.svg");
	background-repeat: no-repeat;
	background-position: center 0.55vw;
    background-size: 60%;
	opacity: 0.5;
}
	
.back_up:hover .back_up_icon {
	opacity: 1;
}
	
.landing {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 44vw;
	max-height: 56vw;
	top: 0;
	left: 0;
}	
	
.top_line {
	position: absolute;
	top: 1.5vw;
	left: 0;
	width: 100%;
	height: 5vw;
	z-index: 100;
}

.top_logo {
	position: absolute;
    top: 1.5vw;
    left: 5vw;
    width: 15vw;
    height: 4vw;
    background-image: var(--main_logo);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center left;
}	
	
.menu_ham {
	position: absolute;
	width: 3vw;
	height: 3vw;
	top: 1vw;
	right: 5vw;
	border-radius: 0.6vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	cursor: pointer;
	padding: unset;
	margin: unset;
}
	
.dark_mode_1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_cart.svg");
	background-size: 75%;
	background-position: center center;
	background-repeat: no-repeat;
	top: 0;
	opacity: 0.5;
}	
	
.menu_ham:hover .dark_mode_1 {
	opacity: 1;
}
	
.menu_ham:hover {
/*	box-shadow: var(--toogle_btn);*/
/*	box-shadow: var(--btn_2);*/
/*	background-image: var(--toogle_grad);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.lang_icon {
	position: relative;
	float: left;
	margin-left: 1vw;
	height: 2vw;
	width: 2vw;
	border-radius: 0.4vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.85vw;
	text-align: center;
	line-height: 2vw;
	color: var(--white);
	font-family: mon_regular
}
	
.lang_icon:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.lang_line {
	position: relative;
	float: right;
	right: 10vw;
	top: 1.5vw;
}
	
.menu_line {
	position: relative;
	float: right;
	right: 10.75vw;
	top: 1.5vw;
}
	
.menu-item {
	position: relative;
	float: left;
	margin: 0 0.25vw;
	padding: 0 1.25vw;
	font-size: 0.95vw;
	text-align: center;
	line-height: 2vw;
	height: 2vw;
	color: var(--white);
	font-family: mon_regular;
/*	transition: 0.1s ease;*/
	cursor: pointer;
	border-radius: 0.4vw;
	border: solid rgba(255, 255, 255, 0%) 0.075vw;
	background-color: rgba(255, 255, 255, 0%);
	backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
}
	
.menu-item:hover {
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	background-color: rgba(255, 255, 255, 10%);
}
	
	
	
	
/*---------------LANDING TITLE & CIRCLES---------------*/
	
.title_box {
	position: absolute;
	bottom: calc(5vw + 10vw + 5vw);
	left: 5vw;
	width: calc(100% - 10vw);
	height: calc(100% - 5vw - 14vw - 5vw - 5.5vw);
	z-index: 0;
}	
	
.title_center {
    position: absolute;
    left: 50%;
    top: 47.5%;
    transform: translateX(-50%) translateY(-50%);
	pointer-events: none;
}
	
.truheat_logo {
	position: absolute; 
	width: 100%;
	height: 5vw;
	top: 0.75vw;
	background-image: url("images/truheat_logo.svg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: contain;
}
	
.title_box h1 {
	position: relative; 
	text-align: center;
	font-size: 5vw;
	line-height: 5vw;
	color: var(--white);
	font-family: redhat_black;
	font-weight: normal;
	margin: 0;
	margin-bottom: 9vw;
	letter-spacing: 0.1vw;
	opacity: 1;
}
	
.title_box h2 {
	position: relative; 
	text-align: center;
	font-size: 1.7vw;
	line-height: 2vw;
	color: var(--white);
	font-family: mon_regular;
	font-weight: normal;
	margin: 0;
	letter-spacing: 0.1vw;
}
	
.circle_out {
	position: absolute;
	height: 24vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2)*/;
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_in {
	position: absolute;
	height: 18vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_out_2 {
	position: absolute;
	height: 43vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_in_2 {
	position: absolute;
	height: 39vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}

.circle_out_3 {
	position: absolute;
	height: 67vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_in_3 {
	position: absolute;
	height: 65vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_out_4 {
	position: absolute;
	height: 96.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_in_4 {
	position: absolute;
	height: 95.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	border: solid rgba(255, 255, 255, 17.5%) 0.075vw;
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}
	
.circle_finger {
	position: absolute;
	height: 5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	cursor: pointer;
}
	
.circle_finger:hover {
/*	box-shadow: var(--btn_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
	
.circle_out_a {
	position: absolute;
	height: 24vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2)*/;
	box-shadow: var(--btn_2);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_in_a {
	position: absolute;
	height: 18vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_1);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_out_a_2 {
	position: absolute;
	height: 43vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_2);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_in_a_2 {
	position: absolute;
	height: 39vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_1);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}

.circle_out_a_3 {
	position: absolute;
	height: 67vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_2);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_in_a_3 {
	position: absolute;
	height: 65vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_1);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_out_a_4 {
	position: absolute;
	height: 96.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_2);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}
	
.circle_in_a_4 {
	position: absolute;
	height: 95.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
	box-shadow: var(--btn_1);
	transition: 0.1s ease;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
}

	
	
	
/*---------------LANDING CARDS---------------*/
	
.divider {
	position: absolute;
	bottom: 5vw;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 20vw);
	height: 12vw;
	display: flex;
	justify-content: space-between;
}
	
.landing_card {
	position: relative;
	width: calc((100% - 10vw) / 3);
	height: 100%;
	min-height: 11vw;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
}

.card_text {
	position: absolute;
	bottom: 1vw;
	left: 1.6vw;
	width: 9.5vw;
	height: 3.5vw;
	font-size: 0.75vw;
	text-align: left;
	line-height: 1.25vw;
	font-family: mon_regular;
	visibility: hidden;
	color: transparent;
	transition: 0.1s ease-in-out;
	transition-delay: 0s;
	opacity: 0;
}	
	
.landing_card:hover .card_text {
	color: var(--white);
	visibility: visible;
	transition-delay: 0.1s;
	bottom: 1.7vw;
	opacity: 1;
}
	
.card_icons {
	position: absolute;
	bottom: 1.6vw;
	left: 1.6vw;
	height: 2vw;
/*	transition: 0.1s ease;*/
	visibility: visible;
	transition-delay: 0.1s;
}	
	
.landing_card:hover .card_icons {
	visibility: hidden;
	transition-delay: 0s;
}
	
.card_icon {
	position: relative;
	float: left;
	margin-right: 1vw;
	height: 2vw;
	width: 2vw;
	border-radius: 0.4vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.icon_tru_1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_1.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_tru_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_2.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_tru_3 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_3.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_aer_1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_7.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_aer_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_8.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_aer_3 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_9.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_rek_1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_4.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_rek_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_5.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.icon_rek_3 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/icon_6.svg");
	background-position: center center;
	background-size: 70%;
	background-repeat: no-repeat;
	opacity: 0.5;
}
	
.card_btn {
	position: absolute;
	bottom: 1.6vw;
	left: 1.6vw;
	width: 7vw;
	height: 2vw;
	border-radius: 0.4vw;
	transition: 0.1s ease;
	cursor: pointer;
	background-image: unset;
	font-size: 0.95vw;
	text-align: center;
	line-height: 2vw;
	color: white;
	font-family: mon_regular;
	visibility: visible;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.card_btn:hover {
    background-color: rgba(0, 0, 0, 10%);
}
	
.card_header {
	position: absolute;
	left: 1.6vw;
	top: 1.2vw;
	width: 10vw;
	line-height: 1.5vw;
	font-size: 1.25vw;
	text-align: left;
	font-family: mon_bold;
	font-weight: normal;
	transition: 0.1s ease;
}	
	
.card_img_a {
	position: absolute;
	height: calc(100% + 2vw);
    width: 9vw;
    top: -2.25vw;
    right: 1.5vw;
	background-image: url("images/th_r2.png");
	background-repeat: no-repeat;
	background-size: 165%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}	
		
.card_img_b {
	position: absolute;
	height: calc(100% + 3vw);
	width: 10vw;
    top: -2.5vw;
    right: 1.5vw;
	background-image: url("images/th_r4.png");
	background-repeat: no-repeat;
	background-size: 145%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}
	
.card_img_c {
	position: absolute;
	height: calc(100% + 2vw);
	width: 13.5vw;
    top: -2.25vw;
    right: 0.5vw;
    background-image: url(images/th_r1.png);
    background-repeat: no-repeat;
    background-size: 110%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}
	
.card_img_1 {
	position: absolute;
    height: calc(100% - 2vw);
    width: calc(50% - 2.25vw);
    top: 1vw;
    right: 1vw;
    border-radius: 0.75vw;
    overflow: hidden;
    background-image: url(http://www.tomton.cz/wp-content/uploads/2025/05/th_img_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: -6.75vw center;
}	
		
.card_img_2 {
	position: absolute;
    height: calc(100% - 2vw);
    width: calc(50% - 2.25vw);
    top: 1vw;
    right: 1vw;
    border-radius: 0.75vw;
    overflow: hidden;
    background-image: url(https://www.tomton.cz/wp-content/uploads/2025/05/screen.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: -3.75vw center;
}
	
.card_img_3 {
	position: absolute;
    height: calc(100% - 2vw);
    width: calc(50% - 2.25vw);
    top: 1vw;
    right: 1vw;
    border-radius: 0.75vw;
    overflow: hidden;
    background-image: url(http://www.tomton.cz/wp-content/uploads/2025/05/reku_bg.webp);
    background-repeat: no-repeat;
	background-size: 23vw;
    background-position: -14.5vw center;
}
	
.card_img_4 {
    position: absolute;
    height: calc(100% - 2vw);
    width: calc(50% - 2.25vw);
    top: 1vw;
    right: 1vw;
    border-radius: 0.75vw;
    overflow: hidden;
    background-image: url(https://www.tomton.cz/wp-content/uploads/2025/05/tzb_bg-1.webp);
    background-repeat: no-repeat;
    background-size: 28vw;
    background-position: -13vw center;
}
	

	
/*---------------LANDING FINGERS---------------*/
	
.finger {
	position: relative;
	width: 100%;
	height: 100%;
	background-image: url("images/tri_white.svg");
	background-position: center center;
	background-size: 40%;
	background-repeat: no-repeat;
	opacity: 0.5;
	transition: 0.1s ease;
}
	
.finger:hover {
	opacity: 1;
	background-image: url("images/tri_white.svg");
}
	
.finger_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/tri_color.svg");
	background-position: center center;
	background-size: 40%;
	background-repeat: no-repeat;
	opacity: 0.1;
	filter: brightness(0);
	transition: 0.1s ease;
}
	
.finger_2:hover {
	opacity: 1;
	filter: brightness(1);
	background-image: url("images/tri_color.svg");
}
	
	
	
/*-----STORY TIMELINE-----*/
	
.box_title {
	position: relative;
	color: white;
	font-family: mon_bold;
	font-size: 2.5vw;
	text-align: center;
	padding-top: 3.75vw;
	margin-bottom: 2.5vw;
}
	
.photocatalysis_box {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	padding: 0 12.5vw;
	margin-bottom: 10vw;
}
	
.video_box {
	position: relative;
	width: calc((100% - 15vw) / 2);
	margin: 2vw 0 3.25vw;
	aspect-ratio: 16 / 9;
	border-radius: 0.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: hidden;
}
	
video#top-video {
    position: absolute;
    width: calc(100% - 0vw);
    height: calc(100% - 0vw);
    object-fit: cover;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
/*	border-radius: 0.8vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;*/
}
	
.catalysis_box {
	position: relative;
	width: 100%;
	padding: 3.25vw 3.75vw;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: hidden;
	box-sizing: border-box;
}
	
.catalysis_header {
	position: relative;
	color: white;
	font-family: mon_bold;
	font-size: 2.5vw;
    line-height: 2.5vw;
    margin-bottom: 1.25vw;
}
	
.catalysis_text {
    position: relative;
    text-align: left;
    font-size: 1.15vw;
    line-height: 1.75vw;
    color: white;
    font-family: mon_regular;
    overflow: hidden;
}
	
.btn_catalysis {
	position: relative;
    height: 3vw;
	width: 11vw;
    color: white;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    line-height: 3vw;
	text-align: center;
    border-radius: 0.6vw;
    font-size: 1.25vw;
    font-family: 'mon_regular';
}
	
.btn_catalysis:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
video#photocatalysis-video {
	position: absolute;
    width: calc(100% - 0vw);
    height: calc(100% - 0vw);
    object-fit: cover;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
	filter: brightness(1.5) saturate(1.25);
}

	
	
/*-----STORY TIMELINE-----*/
	
.sub_header h2 {
	position: relative; 
	text-align: center;
	width: 100%;
	font-size: 3.25vw;
	line-height: 3.5vw;
	color: var(--white);
	font-family: mon_bold;
	font-weight: normal;
	margin: 0;
	margin-bottom: 3.5vw;
	margin-top: 7vw;
}	
	
.time_line {
	position: absolute;
	width: 1vw;
	left: 50%;
	top: -3%;
	transform: translateX(-50%);
	height: 106%;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
/*    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);*/
}
	
.side_boxes {
	position: absolute;
	margin-top: 35vw;
	width: 100%;
	overflow: hidden;
	height: 100vw
}
	
.side_box_left {
	position: absolute;
	left: -25%;
	width: 30%;
	height: 100vw;
}
	
.side_box_right {
	position: absolute;
	right: -25%;
	width: 30%;
	height: 100vw;
}
	
.story_blok {
    position: relative;
    margin-bottom: 10vw;
	margin-top: 8vw;
}
	
.blok {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 25vw);
	height: 17.5vw;
	margin-top: 7.5vw;
	margin-bottom: 0vw;
}
	
.blok_1	{
	position: absolute;
	left: 0;
	width: calc(50% - 5vw);
	height: 17.5vw;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
	background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	overflow: hidden;
}
	
.blok_2	{
	position: absolute;
	right: 0;
	width: calc(50% - 5vw);
	height: 17.5vw;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
	background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	transition: 0.1s ease;
	overflow: hidden;
}
	
.date_point {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: 4vw;
	height: 4vw;
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.blok_1_text {
    position: absolute;
    right: -5vw;
    width: calc(50%);
    height: 15vw;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: left;
}	
	
.blok_2_text {
    position: absolute;
    left: -5vw;
    width: calc(50%);
    height: 15vw;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: right;
}	
	
.box_date {
	position: relative;
	font-family: mon_bold;
	font-size: 4vw;
	line-height: 5.5vw;
	color: var(--black);
}
	
.box_header {
	position: relative;
	font-family: mon_bold;
	font-size: 2.5vw;
    line-height: 2.5vw;
    margin-top: 1.25vw;
    margin-bottom: 1.25vw;
}
	
.box_text {
	position: relative;
    font-size: 1.15vw;
    line-height: 1.75vw;
    color: var(--white);
    font-family: mon_regular;
}
	
.btn_box {
	position: absolute;
	bottom: 1.5vw;
	width: 100%;
	height: 2vw;
}
	
.btn_right {
	position: relative;
	width: 10vw;
	height: 2vw;
	float: left;
	margin-right: 2vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
	color: var(--white);
	font-family: mon_regular;
	border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_left {
	position: relative;
	width: 10vw;
	height: 2vw;
	float: right;
	margin-left: 2vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
	color: var(--white);
	font-family: mon_regular;
	border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_right:hover, .btn_left:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.inner_pic {
	position: absolute;
	width: calc(100% - 1.2vw);
	height: calc(100% - 1.2vw);
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border-radius: 1.15vw;
	/*border: solid 0.05vw var(--color_1);*/
/*	background-color: var(--color_1);*/
	overflow: hidden;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
}
	
video#screenshot_C {
    position: absolute;
    width: calc(100% - 0vw);
    height: calc(100% - 0vw);
    object-fit: cover;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
	
	
	
/*-----MODELS----*/
	
.divider_models {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 20vw);
	display: flex;
	justify-content: center;
	margin-bottom: 5vw;
	gap: 5vw;
}
	
.divider_models + .divider_models {
    margin-bottom: 10vw;
}
	
.model_box {
	position: relative;
    width: calc((100% - 10vw) / 3);
    height: 100%;
}

.model_name {
	position: relative;
	font-size: 2.5vw;
	line-height: 2.5vw;
	text-align: center;
	font-family: mon_bold;
	color: var(--white);
	margin-top: 1.25vw;
    margin-bottom: 0.75vw;
}
	
.model_subname {
	position: relative;
	font-size: 1.15vw;
    line-height: 1.5vw;
	text-align: center;
    font-family: mon_regular;
	color: var(--white);
    margin-bottom: 2.5vw;
}
	
.model_pic {
	position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
	display: block;
}
	
.model_pic:hover {
    background-color: rgba(255, 255, 255, 10%);
}
	
.model_pic:hover .model_pic_1 {
    transform: rotate(-1deg) scale(105%);
}
	
.model_pic:hover .model_pic_2, .model_pic:hover .model_pic_3, .model_pic:hover .model_pic_4, .model_pic:hover .model_pic_5 {
    transform: scale(105%);
}
	
.model_pic_1 {
	position: absolute;
    top: -2vw;
    width: 100%;
    height: calc(100% + 4vw);
    background-image: url("images/th_r1a.png");
    background-position: center center;
    background-size: 95%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transform: rotate(-1deg);
	transition: 0.15s ease;
}
	
.model_pic_2 {
	position: absolute;
    top: -2vw;
    width: 100%;
    height: calc(100% + 4vw);
    background-image: url("images/th_r2.png");
    background-position: center center;
    background-size: 87%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transition: 0.15s ease;
}
	
.model_pic_3 {
	position: absolute;
    top: -2vw;
    width: 100%;
    height: calc(100% + 4vw);
    background-image: url("images/th_r3.png");
    background-position: center center;
    background-size: 90%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transition: 0.15s ease;
}
	
.model_pic_4 {
	position: absolute;
    top: -2vw;
    width: 100%;
    height: calc(100% + 4vw);
    background-image: url("images/th_r4.png");
    background-position: center center;
    background-size: 87%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transition: 0.15s ease;
}
	
.model_pic_5 {
	position: absolute;
    top: -2vw;
    width: 100%;
    height: calc(100% + 4vw);
    background-image: url("images/th_r5.png");
    background-position: center center;
    background-size: 87%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transition: 0.15s ease;
}
	
.model_perex {
	position: relative;
	color: var(--white);
	font-family: mon_regular;
    font-size: 0.9vw;
    line-height: 1.75vw;
	margin-top: 3vw;
    margin-bottom: 1.5vw;
	text-align: center;
}

.btn_model_box {
	position: relative;
	width: 100%;
	height: 2vw;
	left: 50%;
	transform: translateX(-50%);
	margin-bottom: 2.25vw;
	display: flex;
	gap: 1.25vw;
	justify-content: center;
}
	
.btn_model {
	position: relative;
	width: 10vw;
	height: 2vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
	color: var(--white);
	font-family: mon_regular;
	border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_model:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.model_sub {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	color: var(--white);
	font-family: mon_bold;
    font-size: 0.9vw;
    line-height: 1.5vw;
	margin-top: 0vw;
    margin-bottom: 0vw;
	text-align: center;
}

.model_spec {
	position: relative;
	color: var(--white);
	font-family: mon_regular;
    font-size: 0.9vw;
    line-height: 1.5vw;
	text-align: center;
	text-decoration: underline;
	display: block;
}
	
.model_colors ul {
    margin: 0.5vw 0 1.5vw 0;
    padding: 0;
	text-align: center;
}
	
.model_colors li {
    display: inline;
    line-height: 1.25;
    margin: calc(var(--gap) / 4);
}
	
.model_colors i {
	--size: 1vw;
    border-radius: 50%;
    display: inline-block;
    height: var(--size);
    position: relative;
    width: var(--size);
    margin-right: 0.125vw;
	margin-left: 0.125vw;
}
	
.model_colors span {
	display: none;
}
	
.model_text table {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	color: var(--white);
	font-family: mon_bold;
    font-size: 0.9vw;
    line-height: 1.5vw;
	margin-top: 2vw;
    margin-bottom: 1.5vw;
}
	
.model_text .td_left {
	text-align: right;
	font-family: mon_regular;
	padding-right: 1vw;
	padding-left: 1vw;
}
	
.model_extra {
	position: relative;
/*	left: 50%;
	transform: translateX(-50%);*/
	color: var(--white);
	font-family: mon_regular;
    font-size: 0.9vw;
    line-height: 1.5vw;
	text-align: center;
	margin-top: -1.5vw;
    margin-bottom: 1.5vw;
}
	
	
	
/*-----NEWS-----*/	
	
.news_blok {
    position: relative;
    padding: 0 15vw 7.5vw;
	margin: 0 0 10vw 0;
    display: flex;
    gap: 2.5vw;
    flex-wrap: wrap;
    justify-content: space-between;
	min-height: 11vw;
}
	
	
	
.news_box {
    position: relative;
    width: calc((100% - 20vw) / 3);
    aspect-ratio: 3 / 4;
	transition: 0.1s ease;
	padding: 1.5vw;
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.news_box:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
.news_category {
    position: absolute;
    height: 1.5vw;
    padding: 0 1.5vw;
    top: 2.5vw;
    z-index: 100;
    color: white;
    left: 0.75vw;
    line-height: 1.5vw;
	border-radius: 0.25vw;
	font-size: 0.95vw;
    font-family: mon_bold;
}
	
.news_category.cat-news_tzb {
	background-color: var(--green);
}

.news_category.cat-news_rekuperace {
	background-color: var(--yellow);
}
	
.news_category.cat-news_aerconiq {
	background-color: var(--blue);
}

.news_category.cat-news_trueheat {
	background-color: var(--red);
}
	
.news_photo {
    position: relative;
    border-radius: 0.75vw;
    overflow: hidden;
	aspect-ratio: 1.5;
}
	
.news_photo img {
    display: block;
}
	
.news_date {
    position: relative;
    margin: 1vw 0 0.25vw 0;
    font-size: 0.95vw;
    text-align: left;
    line-height: 2vw;
    height: 2vw;
    color: white;
    font-family: mon_regular;
    transition: 0.1s ease;
    cursor: pointer;
}
	
.news_title {
    position: relative;
    line-height: 1.5vw;
    font-size: 1.2vw;
    text-align: left;
	color: white;
    font-family: mon_bold;
    font-weight: normal;
}
	
a.cta_secondary {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 3vw;
	color: white;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    line-height: 3vw;
    padding: 0 2.5vw;
    border-radius: 0.6vw;
    font-size: 1.25vw;
    font-family: 'mon_regular';
}
	
a.cta_secondary:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
	
	
/*-----ADDITIONAL BOXES----*/
	
.box_smaller {
	position: relative;
	width: calc(100% - 30vw);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: space-between;
}
	
.box_left {
	position: relative;
    width: calc((100% - 5vw) / 2);
    height: 15vw;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: right;
}
	
.box_right {
	position: relative;
    width: calc((100% - 5vw) / 2);
    height: 15vw;
/*	left: 2.5vw;*/
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: left;
}

.box_left_logo {
	position: relative;
    width: calc((100% - 5vw) / 2);
    height: 15vw;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
    align-content: space-between;
}
	
.test_entity {
	position: relative;
    width: calc((100% - 2.5vw) / 2);
    height: calc((100% - 2.5vw) / 2);
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
	
.test_entity:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
.logo_tuv {
	background-image: url("images/Logo_tuv.svg");
}
	
.logo_iso {
	background-image: url("images/Logo_iso.svg");
}
	
.logo_szu {
	background-image: url("images/Logo_szu.svg");
	background-size: 45%;
}
	
.logo_cvut {
	background-image: url("images/Logo_cvut.svg");
}
	
.logo_ips {
	background-image: url("images/Logo_ips.svg");
}
	
	
	
/*-----CONTACT FORM----*/
	
.box_right_logo {
	position: relative;
    width: calc((100% - 5vw) / 2);
    height: unset;
/*    border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);*/
    transition: 0.1s ease;
/*    overflow: hidden;*/
	text-align: left;
/*	padding: 1.5vw 2.5vw;*/
}
	
.wpcf7 {
    position: relative;
	height: 100%;
/*    top: 1vw;
	height: 13vw;*/
}
	
.screen-reader-response {
    display: none;
}
	
form.wpcf7-form.init p {
	padding: 0 0 0.75vw 0;
	margin: 0;
	position: relative;
    float: left;
}
	
input.wpcf7-form-control, textarea.wpcf7-form-control {
	position: relative;
    width: 30vw;
    height: 2vw;
    transition: 0.1s ease;
    font-size: 0.95vw;
    text-align: center;
    line-height: 1.5vw;
    color: var(--white);
    font-family: mon_regular;
    border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	padding: 0;
}
	
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color: var(--white) !important;
}
	
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 30vw;
    position: relative;
    right: 0vw;
    top: 0vw;
    height: 6vw;
    padding: 0vw 0 0 0;
    line-height: 2vw;
}
	
.form_note {
    position: relative;
	text-align: left;
    font-size: 1.15vw;
    line-height: 1.5vw;
    color: var(--white);
    font-family: mon_regular;
	margin: 0;
    margin-top: 1.25vw;
    margin-bottom: 1.25vw;
}
	
.wpcf7 p {
	font-size: 1vw;
	line-height: 1.5vw;
	color: red;
	margin: 0;
	text-align: center;
	width: 30vw;
	margin-bottom: 1vw;
}
	
.wpcf7-response-output {
	font-size: 1vw;
	line-height: 1vw;
	color: red;
	text-align: center;
	font-family: mon_regular;
	width: 30vw;
	margin-bottom: 1vw;
}
	
input.wpcf7-submit {
	position: relative;
    left: 0vw;
    bottom: 0vw;
	float: left;
    width: 8vw;
    height: 2vw;
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 0.95vw;
    text-align: center;
    text-align-last: center;
    line-height: 0vw;
    color: var(--white);
    font-family: mon_regular;
    border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
	

	


/*-----CONTACTS LIST----*/
	
.contact_blok {
    position: relative;
	min-height: calc(20vw - 5vw);
    margin-bottom: 5vw;
	width: calc(100% - 20vw - 5vw);
	left: 50%;
	transform: translateX(-50%);
	border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	padding: 2.5vw;
	display: flex;
	justify-content: space-between;
}

.cont_box {
	position: relative;
	min-height: 15vw;
	width: calc((100% - 5vw) / 3);
}
	
.cont_name {
	position: relative;
	font-family: mon_bold;
	font-weight: normal;
    font-size: 1.75vw;
    line-height: 1.85vw;
    margin-bottom: 2vw;
	transition: 0.1s ease;
}
	
.cont_text {
    font-size: 0.93vw;
    text-align: left;
    line-height: 1.25vw;
    font-family: mon_regular;
}
	
.cont_map {
    width: 100%;
	height: 8vw;
	top: -0.5vw;
	border-radius: 0.4vw;
	overflow: hidden;
	position: relative;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
}
	
.btn_footer {
	position: absolute;
	width: 8vw;
	height: 2vw;
	left: 0;
	bottom: 0;
	margin-right: 2vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
	color: var(--white);
    font-family: mon_regular;
    border-radius: 0.4vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_footer:hover {
background-color: rgba(255, 255, 255, 10%);
}

.btn_social_box {
	position: absolute;
	bottom: 0;
}	
	
.btn_social {
	position: relative;
	float: left;
	width: 2vw;
	height: 2vw;
	left: 0;
	bottom: 0;
	margin-right: 1vw;
	border-radius: 0.4vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_social:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.facebook {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_facebook_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.instagram {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_instagram_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.youtube {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_youtube_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.linkedin {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_linkedin_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.btn_social:hover .facebook, .btn_social:hover .instagram, .btn_social:hover .youtube, .btn_social:hover .linkedin {
	opacity: 1;
}
	
	
/*-----FOOTER----*/	
	
.spacer {
	position: relative;
    width: 100%;
    min-height: 5vw;
    padding-bottom: 5vw;
    color: white;
    font-size: 0.93vw;
    text-align: center;
    line-height: 1.5vw;
    font-family: mon_regular;
    text-decoration: underline;	
}
	
	
/*-----FOOTER----*/	
	
.footer_blok {
	position: relative;
	height: 5vw;
	width: calc(100% - 20vw);
	left: 50%;
	transform: translateX(-50%);
}
	
.footer_box {
	position: absolute;
    margin-top: 100vw;
    width: 100%;
    overflow: hidden;
    height: 100vw;
	top: 240vw;
}
	
iframe {
	opacity: 0.75;
	filter: grayscale(1);
}
	
iframe:hover {
	opacity: 1;
	filter: grayscale(1);
}
	
	
	
/*-----PUBLICITA-----*/

.publicita {
	position: absolute;
	width: 100%;
	height: 12vw;
	z-index: 100;
	background-color: white;
	border-top: solid 0.1vw rgb(189,167,73);
}

.publicita_loga {
	position: absolute;
	width: 55%;
	height: 10vw;
	left: 5vw;
	top: 1vw;
	background-image: url("https://www.cubespa.cz/wp-content/uploads/2023/11/publicita.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center left;
}

.publicita_text {
	position: absolute;
	width: 30%;
	height: 5vw;
	right: 5vw;
	top: 3.5vw;
	text-align: left;
	font-family: din_regular;
    font-size: 1vw;
    line-height: 1.5vw;
    color: black;
}

	
	
/*-----SINLE & PAGE-----*/

.single_page {
	position: relative;
	width: 100%;
	padding: 7.5vw 10vw 5vw 10vw;
	box-sizing: border-box;
}
	
.single_zone {
	position: relative;
	width: 100%;
	height: 50vw;
	transition: 0.25s ease;
	background-color: var(--light);
}	
	
.single_content_box {	
	position: sticky;
    width: calc(100% - 35vw);
    left: 0;
    display: flex;
    flex-direction: column;
	min-height: 50vw;
	border-radius: 1.2vw;
	padding: 2.5vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	box-sizing: border-box;
	margin-top: 2.5vw;
	color: white;
}	
	
.single_content_box p {	
	font-size: 1.15vw;
	line-height: 2vw;
	margin: 0;
}	
	
.single_content_box h2 {
    font-size: 1.75vw;
    line-height: 2vw;
    font-family: 'mon_bold';
    margin: 2.5vw 0 1.5vw;
    padding: 0;
}
	
.single_content_box h5 {
    font-size: 1.25vw;
    line-height: 2vw;
    font-family: 'mon_bold';
    margin: 2.5vw 0 0.5vw;
    padding: 0;
}
	
	
.single_pic_box {
	position: sticky;
    width: 30vw;
	top: 2.5vw;
	right: 5vw;
	float: right;
	padding-bottom: 5vw;
}		
	
.single_photo {
	position: relative;
	width: 100%;
	height: 22.5vw;
	transition: 0.25s ease;
}	
	
.single_pic_bg {
	position: absolute;
	width: 100%;
	height: 17.5vw;
	top: 50%;
	transform: translateY(-50%);
	transition: 0.25s ease;
	border-radius: 1.2vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}	
	
.single_pic {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	filter: var(--img_shadow);
}
	
.single_gallery {
	position: relative;
	width: 100%;
	margin-top: 1.25vw;
	transition: 0.25s ease;
	padding: 1vw;
	display: flex;
	gap: 1vw;
	border-radius: 1.2vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
}	
	
.single_item {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--black)
}	
	
.gallery-item {
  	position: relative;
	width: calc((100% - 3vw) / 4);
	aspect-ratio: 4 / 3;
	border-radius: 0.6vw;
	background-color: rgba(255, 255, 255, 25%);
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
	overflow: hidden;
}
.gallery-item img {
  	width: 100%;
	height: 100%;
	object-fit: cover;
  	display: block;
}
.gallery-item .overlay {
  	position: absolute;
  	top: 0; left: 0;
  	width: 100%; height: 100%;
  	background: rgba(0, 0, 0, 0.5);
  	color: white;
	font-family: mon_bold;
  	font-size: 1.5vw;
  	display: flex;
  	align-items: center;
  	justify-content: center;
}
	
.single_pic_box a.cta_secondary {
	width: 50%;
	padding: 0;
	text-align: center;
	left: 0;
	transform: unset;
}
	
.single_pic_box a.cta_more {
	width: 50%;
	padding: 0;
	text-align: center;
	right: 0;
	position: absolute;
    bottom: 0;
    height: 3vw;
    color: white;
    line-height: 3vw;
    padding: 0 2.5vw;
    font-size: 1.25vw;
    font-family: 'mon_regular';
	box-sizing: border-box;
	text-decoration: underline;
	opacity: 0.5;
}
	
.single_pic_box a.cta_more:hover {
	opacity: 1;
}
	
	
/* Zabrání probliknutí bílé mezi obrázky v Lightbox2 */
.lb-image {
  background-color: transparent !important;
  transition: none !important;
}

.lb-outerContainer {
  background-color: transparent !important;
}

.lb-loader,
.lb-overlay {
  background-color: rgba(0, 0, 0, 0.8) !important;
}

span.lb-number {
    font-size: 1vw !important;
    font-family: 'mon_regular';
}
	
/*-----FONT STYLING-----*/
	
h1.desktop {
    padding: 0;
    margin: 0;
    font-family: 'mon_bold';
    font-size: 2.5vw;
    line-height: 2.5vw;
}

.color_box {
	position: relative;
	width: 100%;
	margin: 0 0 0 0;
	display: flex;
	gap: 1.25vw;
	justify-content: left;
	flex-wrap: wrap;
}
	
.color_box * {
	box-sizing: border-box;
}
	
.color_item {
	position: relative;
	width: calc((100% - 2.5vw) / 3);
	height: 3.75vw;
	display: flex;
	gap: 1.25vw;
	justify-content: space-between;
	align-items: center;
}
	
.color_sample {
	position: relative;
	width: 3.75vw;
	height: 3.75vw;
	border-radius: calc(0.6vw);
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
	overflow: hidden;
}
	
.color_name {
    position: relative;
    width: calc(100% - 1.25vw - 3.75vw);
	color: white;
	font-family: mon_regular;
	font-size: 1vw;
	line-height: 1.15vw;
}
	
.color_note {
    position: relative;
    width: calc(100%);
	color: white;
	font-family: mon_regular;
	font-size: 1vw;
	line-height: 1.15vw;
}
	
.var_box {
	position: relative;
	width: 100%;
	height: 10vw;
}
	


	
}	
	


@keyframes from_left {
  0%   {transform: translateX(-20%);}
  100%  {transform: translateX(0);}
}

@keyframes from_right {
  0%   {transform: translateX(20%);}
  100%  {transform: translateX(0);}
}

@keyframes cta_guide {
  	0%	{width: 1.5vw;}
	60%	{width: 1.5vw;}
	80%	{width: 2.5vw;}	
  	100%{width: 1.5vw;}
}



@media only screen and (max-width: 599.5px) {
	
html, body {width: 100%; height: 100%; margin: 0; padding: 0; border: 0; min-width: 300px; background-color: var(--white_1); display: block;}
	
html {scroll-behavior: smooth; scroll-padding-top: 10vw;}
	
* {box-sizing: border-box;}
	
.mobile {display: block;}
.desktop {display: none;}
	
.back_up {
    position: fixed;
    z-index: 1000;
    height: 10vw;
    width: 10vw;
    bottom: 10vw;
    right: 2.5vw;
    border-radius: calc(0.6vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 0.85vw;
    text-align: center;
    line-height: 2vw;
    color: var(--color_1);
    font-family: mon_regular;
    opacity: 0;
}
	
.back_up_icon {
    width: 100%;
    height: 100%;
    position: absolute;
    background-image: url(images/arrow_up_white.svg);
    background-repeat: no-repeat;
    background-position: center 2.75vw;
    background-size: 60%;
    opacity: 0.5;
}
	
/*-----HAMBURGER MENU-----*/	
	
.mobile_menu {
	position: fixed;
    width: calc(100%);
	top: 0vw;
	left: 100%;
	height: calc(100%);
    background-color: rgba(0, 0, 0, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease;
	z-index: 101;
	padding: 15vw 7.5vw 0 7.5vw;
    color: white;
    text-align: left;
    line-height: 2.25vw;
    font-family: roboto_regular;
    font-size: 1.5vw;
}
	
.mobile_menu .top_line {
	position: absolute;
}

input[type="checkbox"] {
	display: none;
}
	
label {
	position: fixed;
    width: 10vw;
    height: 10vw;
    top: 2.5vw;
    right: 2.5vw;
    border-radius: calc(0.6vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
	background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    cursor: pointer;
	z-index: 1000;
}

label:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
	
.menu {position: absolute; height: 10vw; width: 10vw; z-index: 3;}
		
.bar_1 {position: absolute; background-color: white; width: 50%; height: 0.5vw; left: 50%; top: 30%; transform: translateX(-50%) translateY(-50%); z-index: 4; transition: 0.3s ease;}
.bar_2 {position: absolute; background-color: white; width: 50%; height: 0.5vw; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 4; transition: 0.3s ease;}
.bar_3 {position: absolute; background-color: white; width: 50%; height: 0.5vw; left: 50%; top: 70%; transform: translateX(-50%) translateY(-50%); z-index: 4; transition: 0.3s ease;}
	
input[type="checkbox"]:checked ~ .mobile_menu {transform: translateX(-100%);}	
input[type="checkbox"]:checked ~ label .bar_1 {width: 65%; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(0px) rotateZ(45deg); -moz-transform: translateX(-50%) translateY(0px) rotateZ(45deg); -ms-transform: translateX(-50%) translateY(0px) rotateZ(45deg); -o-transform: translateX(-50%) translateY(0px) rotateZ(45deg); transform: translateX(-50%) translateY(0px) rotateZ(45deg);}
input[type="checkbox"]:checked ~ label .bar_2 {width: 0%;}
input[type="checkbox"]:checked ~ label .bar_3 {width: 65%; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(0px) rotateZ(-45deg); -moz-transform: translateX(-50%) translateY(0px) rotateZ(-45deg); -ms-transform: translateX(-50%) translateY(0px) rotateZ(-45deg); -o-transform: translateX(-50%) translateY(0px) rotateZ(-45deg); transform: translateX(-50%) translateY(0px) rotateZ(-45deg);}
	

/*---------------LANDING MAINS---------------*/
	
.main_bg {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-image: url("https://www.tomton.cz/wp-content/themes/tomton_2023/images/th_img_bg.jpg");
	background-size: cover;
	background-color: black;
	background-position: top center;
	filter: brightness(0.85);
}	
	
.landing {
	position: relative;
	width: 100%;
	height: 315vw;
	min-height: unset;
	max-height: unset;
	top: 0;
	left: 0;
	margin-bottom: 0vw;
}	
	
.top_line {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 15vw;
	z-index: 100;
}

.top_logo {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 7.5vw;
	width: 45vw;
	height: 6vw;
	background-image: var(--white_logo);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center left;
}	
	
.menu_ham {
	position: absolute;
	width: 10vw;
	height: 10vw;
	top: 2.5vw;
	right: 7.5vw;
	border-radius: calc(0.6vw * 3.43);
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	cursor: pointer;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.menu_ham:hover {
/*	box-shadow: var(--btn_2);*/
}
	
.lang_icon {
    position: absolute;
    width: 10vw;
    height: 10vw;
    top: 2.5vw;
    right: 20vw;
    border-radius: calc(0.4vw * 3.43);
    /* background-image: var(--grad_2); */
    /* box-shadow: var(--btn_1); */
    transition: 0.1s ease;
    cursor: pointer;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
	background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    text-align: center;
    color: var(--white);
    font-family: mon_regular;
	line-height: 9.75vw;
	font-size: 4vw;
	padding: unset;
	margin: unset;
}
	
.menu_ham {
    position: absolute;
    width: 10vw;
    height: 10vw;
    top: 2.5vw;
    right: 15vw;
    border-radius: calc(0.6vw * 3.43);
    /* background-image: var(--grad_2); */
    /* box-shadow: var(--btn_1); */
    transition: 0.1s ease;
    cursor: pointer;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.lang_icon:hover {
	box-shadow: var(--btn_2);
	color: var(--color_2);
}
	
.lang_line {
	position: relative;
	float: right;
	right: 10vw;
	top: 1.5vw;
}
	
.menu_line {
	position: relative;
	float: right;
	right: 10.75vw;
	top: 1.5vw;
}
	
.menu-item {
	position: relative;
    float: unset;
    margin: 0;
    padding: 0;
    font-size: 6vw;
    text-align: left;
    line-height: 12vw;
    height: 12vw;
    color: white;
    font-family: mon_regular;
    transition: 0.1s ease;
    cursor: pointer;
    text-decoration: none;
	border-radius: unset;
    border: unset;
    background-color: unset;
    backdrop-filter: unset;
    -webkit-backdrop-filter: unset;
}
	
.mobile_menu a {
	text-decoration: none;
}
	
.menu-item:hover {
	font-family: mon_bold;
	border: unset;
    background-color: unset;
    backdrop-filter: unset;
    -webkit-backdrop-filter: unset;
}
	
.menu_subitems {
    position: relative;
    margin-top: 10vw;
    font-size: 4vw;
    line-height: 4vw;
    font-family: mon_bold;
    margin-bottom: 2.5vw;
}
	
.menu-item-small {
    position: relative;
    font-size: 4vw;
    line-height: 10vw;
    font-family: mon_regular;
	transition: 0.1s ease;
}
	
.menu-item-small:hover {
    position: relative;
    font-size: 4vw;
    line-height: 10vw;
    font-family: mon_bold;
}
	
	
	
/*---------------LANDING TITLE & CIRCLES---------------*/
	
/*.title_box {
	position: absolute;
	bottom: calc(5vw + 10vw + 5vw);
	left: 0vw;
	width: 100%;
	height: calc(100% - 5vw - 14vw - 5vw - 5.5vw);
	z-index: 0;
	overflow: hidden;
}	*/
	
.title_box {
	position: absolute;
	top: 0;
	left: 0vw;
	width: 100%;
	height: 160vw;
	z-index: 0;
	overflow: hidden;
}	
	
.title_center {
    position: absolute;
    left: 50%;
    top: 48%;
    transform: translateX(-50%) translateY(-50%);
	pointer-events: none;
	width: 75%;
}
	
.truheat_logo {
	position: absolute; 
	width: 100%;
	height: 10vw;
	top: 5vw;
	background-image: url("images/truheat_logo.svg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: contain;
}
	
.title_box h1 {
	position: relative; 
	text-align: center;
	font-size: 13vw;
	line-height: 20vw;
	color: var(--white);
	font-family: redhat_black;
	font-weight: normal;
	margin: 0;
	margin-bottom: 55vw;
	opacity: 1;
}
	
.title_box h2 {
	position: relative; 
	text-align: center;
	font-size: 6.5vw;
	line-height: 7.5vw;
	color: var(--white);
	font-family: mon_regular;
	font-weight: normal;
	margin: 0;
}
	
.circle_out {
	position: absolute;
	height: 64vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2)*/;
/*	box-shadow: var(--btn_2);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_in {
	position: absolute;
	height: 52vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_out_2 {
	position: absolute;
	height: 83vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_2);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_in_2 {
	position: absolute;
	height: 77vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}

.circle_out_3 {
	position: absolute;
	height: 107vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_2);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_in_3 {
	position: absolute;
	height: 103vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_out_4 {
	position: absolute;
	height: 136.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_2);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_in_4 {
	position: absolute;
	height: 132.5vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border: solid rgba(255, 255, 255, 17.5%) 0.125vw;
}
	
.circle_finger {
	position: absolute;
	height: 35vw;
	aspect-ratio: 1 / 1;
	border-radius: 100vw;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	transition: 0.1s ease;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	cursor: pointer;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.circle_finger:hover {
	box-shadow: var(--btn_2);
}
	
	
	
/*---------------LANDING CARDS---------------*/
	
.divider {
	position: absolute;
	top: 140vw;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 10vw);
	height: unset;
	display: block;
}
	
.landing_card {
	position: relative;
	width: 100%;
	height: 47.5vw;
	border-radius: 4vw;
/*	background-image: var(--grad_2);
	box-shadow:  var(--btn_1c);*/
	transition: 0.1s ease;
/*	overflow: hidden;*/
	margin-bottom: 12.5vw;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.card_btn {
	position: absolute;
    bottom: 6vw;
    left: 6vw;
    width: 35vw;
    height: 8vw;
    border-radius: 2vw;
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 4vw;
    text-align: center;
    line-height: 8vw;
    font-family: mon_regular;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    visibility: visible;
}
	
.card_btn:hover {
	background-color: rgba(0, 0, 0, 10%);
}
	
.card_header {
	position: absolute;
	left: 6.5vw;
	top: 6vw;
	line-height: 6.5vw;
	font-size: 6vw;
	text-align: left;
	font-family: mon_bold;
	font-weight: normal;
	transition: 0.1s ease;
	width: 50%;
}	
	
.card_img_a {
	position: absolute;
	height: calc(100% + 10vw);
    width: 45vw;
    top: -10vw;
    right: -0.5vw;
    background-image: url(images/th_r2.png);
    background-repeat: no-repeat;
    background-size: 140%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}	
		
.card_img_b {
	position: absolute;
	height: calc(100% + 3vw);
	width: 40vw;
    top: -5vw;
    right: 2vw;
	background-image: url("images/th_r4.png");
	background-repeat: no-repeat;
	background-size: 145%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}
	
.card_img_c {
	position: absolute;
	height: calc(100% + 2vw);
	width: 48vw;
    top: -5vw;
    right: 0vw;
    background-image: url(images/th_r1.png);
    background-repeat: no-repeat;
    background-size: 120%;
	background-position: center center;
	transition: 0.1s ease;
	filter: var(--img_shadow);
}
	
.card_img_1 {
        position: absolute;
        height: calc(100% - 10vw);
        width: calc(50% - 10vw);
        top: 5vw;
        right: 5vw;
        border-radius: 2vw;
        overflow: hidden;
        background-image: url(http://www.tomton.cz/wp-content/uploads/2025/05/th_img_bg.webp);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: -32vw center;
    }
	
.card_img_2 {
        position: absolute;
        height: calc(100% - 10vw);
        width: calc(50% - 10vw);
        top: 5vw;
        right: 5vw;
        border-radius: 2vw;
        overflow: hidden;
        background-image: url(https://www.tomton.cz/wp-content/uploads/2025/05/screen.webp);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: -18vw center;
    }

.card_img_3 {
        position: absolute;
        height: calc(100% - 10vw);
        width: calc(50% - 10vw);
        top: 5vw;
        right: 5vw;
        border-radius: 2vw;
        overflow: hidden;
        background-image: url(http://www.tomton.cz/wp-content/uploads/2025/05/reku_bg.webp);
        background-repeat: no-repeat;
        background-size: 95vw;
        background-position: -58.5vw center;
    }
	
.card_img_4 {
        position: absolute;
        height: calc(100% - 10vw);
        width: calc(50% - 10vw);
        top: 5vw;
        right: 5vw;
        border-radius: 2vw;
        overflow: hidden;
        background-image: url(https://www.tomton.cz/wp-content/uploads/2025/05/tzb_bg-1.webp);
        background-repeat: no-repeat;
        background-size: 100vw;
        background-position: -6vw center;
    }

	
	
/*---------------LANDING FINGERS---------------*/
	
.finger {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/tri_white.svg");
	background-position: center center;
	background-size: 45%;
	background-repeat: no-repeat;
/*	mix-blend-mode: multiply;*/
	opacity: 0.5;
	transition: 0.1s ease;
}
	
.finger:hover {
	opacity: 1;
	background-image: url("images/tri_white.svg");
}
	
.finger_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("images/tri_color.svg");
	background-position: center center;
	background-size: 40%;
	background-repeat: no-repeat;
/*	mix-blend-mode: multiply;*/
	opacity: 0.1;
	filter: brightness(0);
	transition: 0.1s ease;
}
	
.finger_2:hover {
	opacity: 1;
	filter: brightness(1);
	background-image: url("images/tri_color.svg");
}
	
	
	
/*-----HAMBURGER MENU-----*/	
	
/*.mobile_menu {
	position: fixed;
    width: calc(50% - 10vw);
	top: 0vw;
	left: 100%;
	height: calc(100% - 10vw);
	background-color: rgba(0, 0, 0, 35%); 
	backdrop-filter: blur(10px); 
	-webkit-backdrop-filter: blur(10px);
	box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease;
	z-index: 1;
	padding: 10vw 5vw 0 5vw;
    color: white;
    text-align: left;
    line-height: 2.25vw;
    font-family: roboto_regular;
    font-size: 1.5vw;
}

input[type="checkbox"] {
	display: none;
}
	
label {
	position: absolute;
    top: 2.5vw;
    right: 2.85vw;
    height: 4vw;
    width: 4vw;
	border-radius: 10vw;
	border: 0.15vw solid goldenrod;
	transition: 0.2s ease;
    margin: 0;
    cursor: pointer;
    z-index: 10;
}
	
	
.menu {position: absolute; height: 4vw; width: 4vw; z-index: 3;}
		
.bar_1 {position: absolute; background: goldenrod; width: 50%; height: 0.2vw; right: 25%; top: 2.5vw; z-index: 4; transition: 0.3s ease; border-top: 0.1vw solid gold;}
.bar_2 {position: absolute; background: goldenrod; width: 50%; height: 0.2vw; right: 25%; top: 50%; transform: translateY(-50%); z-index: 4; transition: 0.3s ease; border-top: 0.1vw solid gold;}
.bar_3 {position: absolute; background: goldenrod; width: 50%; height: 0.2vw; right: 25%; bottom: 2.5vw; z-index: 4; transition: 0.3s ease; border-top: 0.1vw solid gold;}
	
input[type="checkbox"]:checked ~ .mobile_menu {transform: translateX(-100%);}	
input[type="checkbox"]:checked ~ label .bar_1 {width: 65%; top: 1.85vw; right: 0.7vw; -webkit-transform: translateY(0px) rotateZ(45deg); -moz-transform: translateY(0px) rotateZ(45deg); -ms-transform: translateY(0px) rotateZ(45deg); -o-transform: translateY(0px) rotateZ(45deg); transform: translateY(0px) rotateZ(45deg);}
input[type="checkbox"]:checked ~ label .bar_2 {width: 0%;}
input[type="checkbox"]:checked ~ label .bar_3 {width: 65%; bottom: 1.85vw; right: 0.7vw; -webkit-transform: translateY(0px) rotateZ(-45deg); -moz-transform: translateY(0px) rotateZ(-45deg); -ms-transform: translateY(0px) rotateZ(-45deg); -o-transform: translateY(0px) rotateZ(-45deg); transform: translateY(0px) rotateZ(-45deg);}*/
	

	
/*-----PHOTOVATALYSIS-----*/
	
.box_title {
	position: relative;
	color: white;
	font-family: mon_bold;
	font-size: 2.5vw;
	text-align: center;
	padding-top: 3.75vw;
	margin-bottom: 2.5vw;
}
	
.photocatalysis_box {
	position: relative;
	width: calc(100%);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	padding: 0 5vw;
}
	
.video_box {
	position: relative;
	left: 0vw;
/*	transform: translateX(-50%);*/
	width: calc(100%);
	aspect-ratio: 16 / 9;
	border-radius: calc(0.8vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: visible;
	margin: 10vw 0;
}
	
video#top-video {
    position: absolute;
    width: calc(100% - 0vw);
    height: calc(100% - 0vw);
    object-fit: cover;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
/*	border-radius: 0.8vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;*/
	border-radius: calc(0.8vw * 3.43);
    overflow: hidden;
}
	
.catalysis_box {
	position: relative;
	right: 0vw;
/*	transform: translateX(-50%);*/
	width: 100%;
	height: 112.50vw;
	border-radius: calc(1.6vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
	background-image: url("http://www.tomton.cz/wp-content/uploads/2025/05/truheat_all_in_new.webp");
	background-position: top center;
	background-size: cover;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: hidden;
	padding: 6vw 6.5vw;
}
	
.catalysis_header {
	position: relative;
	color: white;
	font-family: mon_bold;
	top: unset;
    left: unset;
	font-size: 7vw;
	line-height: 9.5vw;
	text-align: left;
	margin-bottom: 2.5vw;
}
	
.catalysis_text {
    position: relative;
    left: unset;
    bottom: unset;
	top: unset;
    width: 52%;
    height: unset;
    text-align: left;
    font-size: 5vw;
    line-height: 6.5vw;
    color: var(--white);
    font-family: mon_regular;
    overflow: visible;
}
	
.btn_catalysis {
	position: absolute;
    bottom: 6vw;
    left: 6vw;
    width: 35vw;
    height: 8vw;
    border-radius: 2vw;
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 4vw;
    text-align: center;
    line-height: 8vw;
    font-family: mon_regular;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    visibility: visible;
	background-color: rgba(255, 255, 255, 25%);
}
	
.btn_catalysis:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
video#photocatalysis-video {
	position: absolute;
    width: calc(100% - 0vw);
    height: 150vw;
	transform: unset;
    object-fit: cover;
    left: 0;
    top: 0;
	filter: brightness(1.5) saturate(1.25);
	border-radius: calc(1.6vw * 3.43);
    overflow: hidden;
}

	
	
/*-----STORY TIMELINE-----*/
	
.sub_header h2 {
	position: relative; 
	text-align: center;
	width: 80%;
	left: 50%;
	transform: translateX(-50%);
	font-size: 8vw;
	line-height: 9.5vw;
	color: var(--white);
	font-family: mon_bold;
	font-weight: normal;
	margin: 0;
	margin-bottom: 6.5vw;
	margin-top: 20vw;
}	
	
.time_line {
	position: absolute;
	width: 3vw;
	left: 10vw;
	top: 0;
	height: 100%;
	border-radius: 4vw;
/*	background-image: var(--grad_3);
	box-shadow:  var(--btn_2);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.side_boxes {
	position: absolute;
	margin-top: 35vw;
	width: 100%;
	overflow: hidden;
	height: 100vw
}
	
.side_box_left {
	position: absolute;
	left: -25%;
	width: 30%;
	height: 100vw;
}
	
.side_box_right {
	position: absolute;
	right: -25%;
	width: 30%;
	height: 100vw;
}
	
.story_blok {
    position: relative;
    margin-bottom: 10vw;
	margin-top: 10vw;
}
	
.blok	{
	position: relative;
	left: 20vw;
	transform: unset;
	width: calc(100% - 30vw);
	height: unset;
	margin-top: 10vw;
	margin-bottom: 0vw;
}
	
.blok_1	{
	position: relative;
	left: 0;
	width: 100%;
	height: 40vw;
	border-radius: 4vw;
/*	background-image: var(--grad_2);*/
	box-shadow:  var(--btn_2);
	transition: 0.1s ease;
	margin-bottom: 5vw;
	transform: unset;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.blok_2	{
	position: relative;
	left: 0;
	width: 100%;
	height: 40vw;
	border-radius: 4vw;
	background-image: unset;
	box-shadow:  var(--btn_2);
	transition: 0.1s ease;
	margin-bottom: 5vw;
	transform: unset;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.date_point {
	position: absolute;
	left: -15vw;
    top: 46.5vw;
    transform: translateX(0) translateY(0);
	width: 10vw;
	height: 10vw;
	border-radius: 8vw;
/*	background-image: var(--grad_3);
    box-shadow: var(--btn_2);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.blok_1_text {
	position: relative;
	left: 1.5vw;
    width: calc(100% - 3vw);
    height: unset;
	margin: 0;
	transform: unset;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: left;
	margin-bottom: 15vw;
}	
	
.blok_2_text {
	position: relative;
	left: 1.5vw;
    width: calc(100% - 0vw);
    height: unset;
	margin: 0;
	transform: unset;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: left;
	margin-bottom: 15vw;
}	
	
.box_date {
	position: relative;
	font-family: mon_bold;
	font-size: 9vw;
	line-height: 12vw;
	color: var(--black);
}
	
.box_header {
	position: relative;
    font-family: mon_bold;
    font-size: 5.5vw;
    line-height: 8vw;
    margin-bottom: 1vw;
    text-align: left;
	margin-top: 7.5vw;
	text-align-last: left;
}
	
.box_left .box_header {
	position: relative;
    font-family: mon_bold;
    font-size: 6vw;
    line-height: 8vw;
    margin-bottom: 1vw;
    text-align: left;
	margin-top: 0vw;
	text-align-last: left;
}
	
.box_text {
	position: relative;
    font-size: 3.5vw;
    line-height: 5.5vw;
    color: var(--white);
    font-family: mon_regular;
    text-align: left;
	text-align-last: left;
}
	
.btn_box {
	position: relative;
	bottom: 0;
	width: 100%;
	height: 8vw;
	margin-top: 5vw;
}
	
.btn_right {
	position: relative;
	width: 35vw;
	height: 8vw;
	float: left;
	margin-right: 2vw;
	border-radius: calc(0.4vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 3.5vw;
	text-align: center;
	text-align-last: center;
	line-height: 8vw;
/*	color: var(--color_1);*/
	font-family: mon_regular;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.btn_left {
	position: relative;
	width: 35vw;
	height: 8vw;
	float: left;
	margin-right: 2.5vw;
	margin-left: 0;
	border-radius: calc(0.4vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 3.5vw;
	text-align: center;
	text-align-last: center;
	line-height: 8vw;
/*	color: var(--color_1);*/
	font-family: mon_regular;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.btn_right:hover, .btn_left:hover {
/*	box-shadow: var(--btn_2);*/
	color: var(--white);
}
	
.box_smaller .btn_left {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: 35vw;
	height: 8vw;
	float: left;
	margin-right: 2.5vw;
	margin-left: 0;
	border-radius: calc(0.4vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 3.5vw;
	text-align: center;
	text-align-last: center;
	line-height: 8vw;
/*	color: var(--color_1);*/
	font-family: mon_regular;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
}
	
.inner_pic {
	position: absolute;
	width: calc(100% - 3vw);
	height: calc(100% - 3vw);
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	border-radius: 3vw;
	/*border: solid 0.05vw var(--color_1);*/
/*	background-color: var(--color_1);*/
	overflow: hidden;
}
	
.red_dot {
	position: absolute;
	width: 18vw;
	height: 12vw;
	left: 4.5vw;
	top: 4vw;
	background-image: url("images/red_dot_logo.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left top;
	z-index: 2;
}
	
	
	
/*-----MODELS----*/
	
.divider_models {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 20vw);
	display: flex;
	flex-direction: column;
    gap: 15vw;
	margin-bottom: 10vw;
}
	
.model_box {
	position: relative;
    width: 100%;
    height: 100%;
}

.model_name {
	position: relative;
	font-size: 10vw;
	line-height: 12vw;
	text-align: center;
	font-family: mon_bold;
	color: var(--white);
	margin-top: 2.5vw;
    margin-bottom: 0vw;
}
	
.model_subname {
	position: relative;
	font-size: 4.5vw;
    line-height: 7.5vw;
	text-align: center;
    font-family: mon_regular;
	color: var(--white);
    margin-bottom: 8vw;
}
	
.model_pic {
	position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
}
	
.model_pic_1 {
	position: absolute;
	top: -7.5vw;
    width: 100%;
    height: calc(100% + 15vw);
    background-image: url("images/th_r1a.png");
    background-position: center center;
    background-size: 100%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
	transform: rotate(-1deg);
}
	
.model_pic_2 {
	position: absolute;
	top: -7.5vw;
    width: 100%;
    height: calc(100% + 15vw);
    background-image: url("images/th_r2.png");
    background-position: center center;
    background-size: 88%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
}
	
.model_pic_3 {
	position: absolute;
	top: -7.5vw;
    width: 100%;
    height: calc(100% + 15vw);
    background-image: url("images/th_r3.png");
    background-position: center center;
    background-size: 92%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
}
	
.model_pic_4 {
	position: absolute;
	top: -7.5vw;
    width: 100%;
    height: calc(100% + 15vw);
    background-image: url("images/th_r4.png");
    background-position: center center;
    background-size: 88%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
}
	
.model_pic_5 {
	position: absolute;
	top: -7.5vw;
    width: 100%;
    height: calc(100% + 15vw);
    background-image: url("images/th_r5.png");
    background-position: center center;
    background-size: 88%;
	background-repeat: no-repeat;
	filter: var(--img_shadow);
}
	
.model_perex {
	position: relative;
    color: var(--white);
    font-family: mon_regular;
    font-size: 3.5vw;
    line-height: 5.5vw;
    margin-top: 8vw;
    margin-bottom: 5.5vw;
    text-align: center;
}
	
.btn_model_box {
	position: relative;
	width: 100%;
	height: 8vw;
	left: 50%;
	transform: translateX(-50%);
	margin-bottom: 7.5vw;
	display: flex;
	gap: 5vw;
	justify-content: center;
}
	
.btn_model {
	position: relative;
	width: 37.5vw;
	height: 8vw;
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 3.5vw;
	text-align: center;
	text-align-last: center;
	line-height: 8vw;
	color: var(--white);
	font-family: mon_regular;
	border-radius: calc(0.4vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}
	
.btn_model:hover {
/*	box-shadow: var(--btn_2);
	color: var(--color_2);*/
	background-color: rgba(255, 255, 255, 10%);
}
	
.model_sub {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	color: var(--white);
	font-family: mon_bold;
        font-size: 4.5vw;
        line-height: 7.5vw;
	margin-top: 0vw;
    margin-bottom: 0vw;
	text-align: center;
}

.model_spec {
	position: relative;
	color: var(--white);
	font-family: mon_regular;
    font-size: 3.5vw;
    line-height: 5.5vw;
	text-align: center;
	text-decoration: underline;
	display: block;
}
	
.model_colors ul {
    margin: 2vw 0 6vw 0;
    padding: 0;
	text-align: center;
}
	
.model_colors li {
    display: inline;
    line-height: 5vw;
    margin: calc(var(--gap) / 4);
}
	
.model_colors i {
--size: 5vw;
        border-radius: 50%;
        display: inline-block;
        height: var(--size);
        position: relative;
        width: var(--size);
        margin-right: 0.5vw;
        margin-left: 0.5vw;
}
	
.model_colors span {
	display: none;
}
		
.model_text table {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	color: var(--white);
	font-family: mon_bold;
    font-size: calc(0.9vw * 3.43);
    line-height: calc(1.5vw * 3.43);
	margin-top: 7.5vw;
    margin-bottom: 1.5vw;
}
	
.model_text .td_left {
	text-align: right;
	font-family: mon_regular;
	padding-right: 4vw;
	padding-left: 4vw;
}
	
.model_extra {
	position: relative;
/*	left: 50%;
	transform: translateX(-50%);*/
	color: var(--white);
	font-family: mon_regular;
    font-size: calc(0.9vw * 3.43);
    line-height: calc(1.5vw * 3.43);
	text-align: center;
}
	
/*-----NEWS----*/
	
.news_blok {
	position: relative;
    padding: 0 5vw 25vw;
    margin: 0 0 25vw 0;
    display: flex;
    gap: 10vw;
    flex-wrap: wrap;
    justify-content: space-between;
}

.news_blok .landing_card {
	height: 55vw;
	margin-bottom: unset;
}
	
.news_blok .card_btn {
	width: 38vw;
}
	
.news_box {
    position: relative;
    width: calc(100%);
    aspect-ratio: 3 / 4;
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	transition: 0.1s ease;
	padding: 5vw;
}
	
.news_box:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
.news_category {
    position: absolute;
    height: 7.5vw;
    padding: 0 5vw;
    top: 8.75vw;
    z-index: 100;
    color: white;
    left: 2.5vw;
    line-height: 7.5vw;
	border-radius: 1vw;
	font-size: 4vw;
    font-family: mon_bold;
}
	
.news_category.cat-news_tzb {
	background-color: var(--green);
}

.news_category.cat-news_rekuperace {
	background-color: var(--yellow);
}
	
.news_category.cat-news_aerconiq {
	background-color: var(--blue);
}

.news_category.cat-news_trueheat {
	background-color: var(--red);
}
	
.news_photo {
    position: relative;
    border-radius: 3vw;
    overflow: hidden;
	aspect-ratio: 1.5;
}
	
.news_photo img {
    display: block;
}
	
.news_date {
    position: relative;
    margin: 5vw 0 2.5vw 0;
    font-size: 4vw;
    text-align: left;
    line-height: 5vw;
    height: 5vw;
	padding: 0 2.5vw;
    color: white;
    font-family: mon_regular;
    transition: 0.1s ease;
    cursor: pointer;
}
	
.news_title {
    position: relative;
    line-height: 7.5vw;
    font-size: 6vw;
	padding: 0 2.5vw;
    text-align: left;
	color: white;
    font-family: mon_bold;
    font-weight: normal;
}
	
a.cta_secondary {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 10vw;
    line-height: 10vw;
    padding: 0 8vw;
    border-radius: 2vw;
    font-size: 4vw;
    font-family: 'mon_regular';
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
	
	

/*-----ADDITIONAL BOXES----*/
	
.box_smaller {
	position: relative;
	width: calc(100% - 20vw);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
    flex-direction: column;
    gap: 2.5vw;
}
	
.box_left {
	position: relative;
    width: 100%;
    height: 50vw;
    transition: 0.1s ease;
	text-align: justify;
	text-align-last: right;
}
	
.box_right {
	position: relative;
    width: 100%;
    height: 50vw;
/*	left: 2.5vw;*/
    transition: 0.1s ease;
	text-align: center;
	text-align-last: center;
}
	
.box_right .box_header, .box_right .box_text, .box_left .box_header, .box_left .box_text {
	text-align: center;
	text-align-last: center;
}
	
.box_right .btn_right {
	left: 50%;
	transform: translateX(-50%);
	margin-right: 0;
}

.box_left_logo {
	position: relative;
    width: 100%;
    height: 40vw;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
    align-content: space-between;
}
	
.test_entity {
	position: relative;
    width: calc((100% - 5vw) / 2);
    height: calc((100% - 5vw) / 2);
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
    transition: 0.1s ease;
    overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
	
.test_entity:hover {
	background-color: rgba(255, 255, 255, 10%);
}
	
.logo_tuv {
	background-image: url("images/Logo_tuv.svg");
}
	
.logo_iso {
	background-image: url("images/Logo_iso.svg");
}
	
.logo_szu {
	background-image: url("images/Logo_szu.svg");
	background-size: 45%;
}
	
.logo_cvut {
	background-image: url("images/Logo_cvut.svg");
}
	
.logo_ips {
	background-image: url("images/Logo_ips.svg");
}

	

/*-----PEOPLE LIST----*/
	
.people_blok {
    position: relative;
	height: unset;
    margin-bottom: 10vw;
	width: calc(100% - 20vw);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
    justify-content: space-between;
	flex-direction: column;
}
	
.people_card {
	position: relative;
	width: calc(100% - 12vw);
    height: calc(80vw - 12vw);
	border-radius: calc(1.6vw * 3.43);
	background-image: var(--grad_2);
	box-shadow:  var(--btn_1c);
	transition: 0.1s ease;
	overflow: hidden;
	padding: 6vw 6vw;
	margin: 2vw 0 8vw;
}
	
.people_card:hover, .people_card:active {
	box-shadow: var(--btn_2);
}
	
.people_img_1 {
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0;
	right: 0;
	transition: 0.3s ease;
	background-image: url("images/jan-konde.webp");
	background-position: bottom right;
	background-size: contain;
	background-repeat: no-repeat;
	transform: translateX(8vw) translateY(3vw);
}	
	
.people_img_2 {
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0;
	right: 0;
	transition: 0.3s ease;
	background-image: url("images/rudolf-kalisek.webp");
	background-position: bottom right;
	background-size: contain;
	background-repeat: no-repeat;
	transform: translateX(13vw) translateY(0vw);
}	
	
.people_img_3 {
	position: absolute;
    width: 100%;
    height: 100%;
    bottom: -1vw;
    right: 0;
    transition: 0.3s ease;
    background-image: url("images/ondrej-bitomsky.webp");
    background-position: top right;
    background-size: 105%;
	background-repeat: no-repeat;
	transform: translateX(15vw) translateY(2vw);
}
	
.people_card:hover .people_img_1 , .people_card:active .people_img_1 {
	transform: translateX(23.5vw) translateY(3vw);
}	
	
.people_card:hover .people_img_2 , .people_card:active .people_img_2 {
	transform: translateX(25.5vw) translateY(0vw);
}	
	
.people_card:hover .people_img_3 , .people_card:active .people_img_3 {
	transform: translateX(23vw) translateY(2vw);
}
	
.people_name {
	position: relative;
	font-family: mon_bold;
	font-weight: normal;
    font-size: 6vw;
    line-height: 7vw;
    margin-bottom: 2vw;
	transition: 0.1s ease;
}
	
.people_position {
	position: relative;
	font-family: mon_regular;
    font-size: 3.5vw;
    line-height: 3.5vw;
    margin-bottom: 2vw;
}
	
.people_text {
	position: absolute;
	bottom: 0vw;
	left: 6vw;
	width: 37vw;
	font-size:3vw;
	text-align: left;
	line-height: 4.5vw;
	font-family: mon_regular;
	visibility: hidden;
	color: transparent;
	transition: 0.1s ease-in-out;
	transition-delay: 0s;
	opacity: 0;
}	
	
.people_card:hover .people_text {
	color: var(--color_2);
	visibility: visible;
	transition-delay: 0.1s;
	bottom: 19vw;
	opacity: 1;
}
	
.people_btn_box {
    position: absolute;
    width: calc(100% - 12vw);
    height: 8vw;
    bottom: 6vw;
    left: 6vw;
}
	
.name_btn_1 {
	position: relative;
	float: left;
	bottom: 0vw;
	left: 0vw;
	margin-right: 4vw;
	width: 8vw;
	height: 8vw;
	border-radius: calc(0.6vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	background-image: unset;
	font-size: 0.95vw;
	text-align: center;
	line-height: 2vw;
	color: transparent;
	font-family: mon_regular;
	visibility: hidden;
	overflow: hidden;
}
		
.name_btn_1:hover {
	width: calc(100% - 8vw - 4vw);
}

.name_btn_2 {
	position: relative;
	float: left;
	bottom: 0vw;
	left: 0vw;
	width: 8vw;
	height: 8vw;
	border-radius: calc(0.6vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	background-image: unset;
	font-size: 0.95vw;
	text-align: center;
	line-height: 2vw;
	color: transparent;
	font-family: mon_regular;
	visibility: hidden;
	overflow: hidden;
}
	
	
.name_btn_2:hover {
	width: calc(100% - 8vw - 4vw);
}
	
.people_card:hover .name_btn_1, .people_card:hover .name_btn_2 {
	background-image: var(--grad_2);
	box-shadow:  var(--btn_1);
	color: var(--color_1);
	visibility: visible;
}
	
.people_card:hover .name_btn_1:hover, .people_card:hover .name_btn_2:hover {
	box-shadow: var(--btn_2);
	color: var(--color_2);
}
	
.icon_phone {
	width: 8vw;
	height: 8vw;
	position: absolute;
	background-image: url("images/icon_phone.svg");
	background-repeat: no-repeat;
	background-position: center center;
    background-size: 70%;
	opacity: 0.5;
}
	
.phone {
	height: 8vw;
	line-height: 8vw;
	font-family: mon_regular;
    font-size: 4vw;
	position: absolute;
	left: 8vw;
	text-align: left;
	opacity: 0.5;
}
	
.icon_mail {
	width: 8vw;
	height: 8vw;
	position: absolute;
	background-image: url("images/icon_mail.svg");
	background-repeat: no-repeat;
	background-position: center center;
    background-size: 70%;
	opacity: 0.5;
}
	

	
/*-----CONTACT FORM----*/
	
.box_right_logo {
	position: relative;
    width: 100%;
    min-height: 15vw;
/*    border-radius: 1.6vw;
    border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);*/
    transition: 0.1s ease;
/*    overflow: hidden;*/
	text-align: center;
/*	padding: 1.5vw 2.5vw;*/
	height: unset;
}
	
.wpcf7 {
    position: relative;
	height: 100%;
/*    top: 1vw;
	height: 13vw;*/
}
	
.wpcf7 label {
        position: relative;
        width: unset;
        height: unset;
        top: unset;
        right: unset;
        border-radius: unset;
        border: unset;
        background-color: unset;
        backdrop-filter: unset;
        -webkit-backdrop-filter: unset;
        box-shadow: unset;
        transition: unset;
        cursor: unset;
        z-index: unset;
    }
	
.wpcf7 p {
	font-size: 3.5vw;
	line-height: 5.5vw;
	color: red;
	margin: 0;
	width: 100%;
}
	
.wpcf7-response-output {
	font-size: 3.5vw;
	line-height: 5.5vw;
	color: red;
	text-align: center;
	font-family: mon_regular;
	width: 100%;
}
	
.screen-reader-response {
    display: none;
}
	
form.wpcf7-form.init p {
	padding: 0 0 0 0;
	margin: 0;
	position: relative;
    float: left;
	width: 100%;
}
	
input.wpcf7-form-control, textarea.wpcf7-form-control {
    width: 100%;
    height: 10vw;
    transition: 0.1s ease;
    font-size: 4vw;
    text-align: center;
    line-height: 5.5vw;
    color: var(--white);
    font-family: mon_regular;
    border-radius: calc(0.4vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	margin-top: 5vw;
	padding: 0;
	position: relative;
}
	
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color: var(--white) !important;
}
	
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 100%;
    position: relative;
    right: unset;
    top: unset;
    min-height: 30vw;
    padding: 0 0 0 0;
    line-height: 10vw;
}
	
.form_note {
    position: relative;
	text-align: center;
    font-size: 5.5vw;
    line-height: 7.5vw;
    color: var(--white);
    font-family: mon_bold;
	margin: 0;
}
	
input.wpcf7-submit {
	float: unset;
	position: relative;
	margin-top: 5vw;
/*    left: 50%;
	transform: translateX(-50%);*/
    bottom: 0vw;
    width: 35vw;
    height: 8vw;
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 3.5vw;
    text-align: center;
    text-align-last: center;
    line-height: 8vw;
    color: var(--white);
    font-family: mon_regular;
    border-radius: calc(0.4vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
/*    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);*/
}
	

	
/*-----CONTACTS LIST----*/
	
.contact_blok {
    position: relative;
	min-height: calc(20vw - 12vw);
    margin-bottom: 5vw;
	width: calc(100% - 10vw);
	left: 50%;
	transform: translateX(-50%);
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 25%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	padding: 6vw;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	text-align: center !important;
}

.cont_box {
	position: relative;
	min-height: 15vw;
	width: calc((100%));
	margin-bottom: 10vw;
}
	
.cont_name {
	position: relative;
	font-family: mon_bold;
	font-weight: normal;
    font-size: 5vw;
    line-height: 6vw;
    margin-bottom: 5vw;
	transition: 0.1s ease;
}
	
.cont_text {
    font-size: 3.5vw;
    text-align: center !important;
    line-height: 4vw;
    font-family: mon_regular;
}
	
.cont_map {
    width: 100%;
	height: 70vw;
	top: 0vw;
	border-radius: calc(0.6vw * 3.43);
	overflow: hidden;
	position: relative;
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.btn_footer {
    position: relative;
    width: 30vw;
    height: 8vw;
    float: left;
    margin-top: 8vw;
    margin-right: 2vw;
    border-radius: calc(0.6vw * 3.43);
    transition: 0.1s ease;
    cursor: pointer;
    font-size: 3.5vw;
    text-align: center;
    text-align-last: center;
    line-height: 8vw;
    /* color: var(--color_1); */
    font-family: mon_regular;
    /* background-image: var(--grad_2); */
/*    box-shadow: var(--btn_1);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
	left: 50%;
	transform: translateX(-50%);
}
	
.btn_footer:hover {
/*	box-shadow: var(--btn_2);*/
	color: var(--white);
}
	
.btn_social_box {
    position: relative;
    width: 100%;
    height: 12vw;
    float: left;
	margin-top: 8vw;
    margin-right: 0vw;
	display: flex;
    justify-content: center;
    gap: 5vw;
}	
	
.btn_social {
	position: relative;
	float: left;
	width: 12vw;
	height: 12vw;
	left: 0;
	bottom: 0;
	margin-right: 0vw;
	border-radius: calc(0.6vw * 3.43);
	transition: 0.1s ease;
	cursor: pointer;
	font-size: 0.95vw;
	text-align: center;
	text-align-last: center;
	line-height: 2vw;
/*	color: var(--color_1);*/
	font-family: mon_regular;
/*	background-image: var(--grad_2);*/
/*	box-shadow: var(--btn_1);*/
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
}
	
.btn_social:hover {
/*	box-shadow: var(--btn_2);*/
	color: var(--color_2);
}
	
.facebook {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_facebook_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.instagram {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_instagram_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.youtube {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_youtube_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.linkedin {
	position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("images/social_linkedin_white.svg");
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
	
.spacer {
	box-sizing: border-box;
	position: relative;
    width: 100%;
    min-height: 10vw;
    padding: 10vw 10vw 15vw;
    color: white;
	font-size: 3.5vw;
    text-align: center !important;
    line-height: 5vw;
    font-family: mon_regular;
    text-decoration: underline;	
}
	
	
/*-----FOOTER----*/	
	
.footer_blok {
	position: relative;
	height: 5vw;
	width: calc(100% - 20vw);
	left: 50%;
	transform: translateX(-50%);
}
	
.footer_box {
	position: absolute;
    margin-top: 100vw;
    width: 100%;
    overflow: hidden;
    height: 100vw;
	top: 240vw;
}
	
	
	
/*-----SINLE & PAGE-----*/

.single_page {
	position: relative;
	width: 100%;
	padding: 20vw 10vw 5vw 10vw;
	box-sizing: border-box;
}
	
.single_page h1.mobile {
    position: relative;
    color: white;
    font-family: 'mon_bold';
    font-size: 10vw;
    line-height: 10vw;
    text-align: center;
    margin: 5vw 0 5vw;
}
	
.single_zone {
	position: relative;
	width: 100%;
	height: 50vw;
	transition: 0.25s ease;
	background-color: var(--light);
}	
	
.single_content_box {	
	position: relative;
    width: calc(100% + 10vw);
    left: -5vw;
    display: flex;
    flex-direction: column;
	min-height: 50vw;
	border-radius: 4vw;
	padding: 7.5vw 5vw;
	border: solid rgba(255, 255, 255, 35%) 0.075vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
	box-sizing: border-box;
	margin-top: 10vw;
	color: white;
}	
	
.single_content_box p {	
	font-size: 4vw;
	line-height: 6vw;
	margin: 0;
}	
	
.single_content_box h2 {
    font-size: 6vw;
    line-height: 7vw;
    font-family: 'mon_bold';
    margin: 0vw 0 5vw;
    padding: 0;
}
	
.single_content_box h5 {
    font-size: 4.5vw;
    line-height: 5.5vw;
    font-family: 'mon_bold';
    margin: 10vw 0 5vw;
    padding: 0;
}
	
	
.single_pic_box {
	position: relative;
    width: 100%;
	top: 0vw;
	right: unset;
	left: 0;
	float: unset;
	padding-bottom: 10vw;
}		
	
.single_photo {
	position: relative;
	width: 100%;
	height: 70vw;
	transition: 0.25s ease;
}	
	
.single_pic_bg {
	position: absolute;
	width: calc(100% + 10vw);
	height: 47.5vw;
	top: 50%;
	left: -5vw;
	transform: translateY(-50%);
	transition: 0.25s ease;
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
}	
	
.single_pic {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	filter: var(--img_shadow);
}
	
.single_gallery {
	position: relative;
	width: calc(100% + 10vw);
	left: -5vw;
	margin-top: 0vw;
	margin-bottom: 10vw;
	transition: 0.25s ease;
	padding: 2.5vw;
	display: flex;
	gap: 2.5vw;
	border-radius: 4vw;
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
    background-color: rgba(255, 255, 255, 10%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1vw 2vw rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
}	
	
.single_item {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	background-color: var(--black)
}	
	
.gallery-item {
  	position: relative;
	width: calc((100% - 3vw) / 4);
	aspect-ratio: 4 / 3;
	border-radius: 2vw;
	background-color: rgba(255, 255, 255, 25%);
	border: solid rgba(255, 255, 255, 35%) 0.25vw;
	overflow: hidden;
}
.gallery-item img {
  	width: 100%;
	height: 100%;
	object-fit: cover;
  	display: block;
}
.gallery-item .overlay {
  	position: absolute;
  	top: 0; left: 0;
  	width: 100%; height: 100%;
  	background: rgba(0, 0, 0, 0.5);
  	color: white;
	font-family: mon_bold;
  	font-size: 5vw;
  	display: flex;
  	align-items: center;
  	justify-content: center;
}
	
.single_pic_box a.cta_secondary {
	width: 50%;
	padding: 0;
	text-align: center;
	left: 0;
	transform: unset;
}
	
.single_pic_box a.cta_more {
	width: 50%;
	padding: 0;
	text-align: center;
	right: 0;
	position: absolute;
    bottom: 0;
    height: 10vw;
    color: white;
    line-height: 10vw;
    font-size: 4vw;
    font-family: 'mon_regular';
	box-sizing: border-box;
	text-decoration: underline;
	opacity: 0.5;
}
	
.single_pic_box a.cta_more:hover {
	opacity: 1;
}
	
	
/* Zabrání probliknutí bílé mezi obrázky v Lightbox2 */
.lb-image {
  background-color: transparent !important;
  transition: none !important;
}

.lb-outerContainer {
  background-color: transparent !important;
}

.lb-loader,
.lb-overlay {
  background-color: rgba(0, 0, 0, 0.8) !important;
}

span.lb-number {
    font-size: 1vw !important;
    font-family: 'mon_regular';
}
	
/*-----FONT STYLING-----*/
	
h1.desktop {
    padding: 0;
    margin: 0;
    font-family: 'mon_bold';
    font-size: 2.5vw;
    line-height: 2.5vw;
}
	
.color_box {
	position: relative;
	width: 100%;
	margin: 0 0 0 0;
	display: flex;
	gap: 5vw;
	justify-content: left;
	flex-wrap: wrap;
}
	
.color_box * {
	box-sizing: border-box;
}
	
.color_item {
	position: relative;
	width: calc((100% - 5vw) / 2);
	height: 10vw;
	display: flex;
	gap: 3.75vw;
	justify-content: space-between;
	align-items: center;
}
	
.color_sample {
	position: relative;
	width: 10vw;
	height: 10vw;
	border-radius: calc(0.6vw * 3.43);
    border: solid rgba(255, 255, 255, 35%) 0.25vw;
	overflow: hidden;
}
	
.color_name {
    position: relative;
    width: calc(100% - 10vw - 3.75vw);
	color: white;
	font-family: mon_regular;
	font-size: 3vw;
	line-height: 3.25vw;
}
	
.color_note {
    position: relative;
    width: calc(100%);
	color: white;
	font-family: mon_regular;
	font-size: 3vw;
	line-height: 3.5vw;
}
	
.var_box {
	position: relative;
	width: 100%;
	height: 25vw;
}	


	
}	
	}
}	
	


@keyframes jump_1 {
  0%   {bottom: 15vw;}
  50%  {bottom: 13vw;}
  100%  {bottom: 15vw;}
}