:root{
	/* Colors */
	--denipol-red: #E10E35;
	--denipol-red-hover: #f23054;
	--denipol-gray: #D9D9D9;
	--denipol-blue: #466E8B;
	--denipol-blue-hover: #5989ab;
	--denipol-darkblue: #053B62;
	--denipol-darkblue-hover: #0f4c78;
	--denipol-lightblue: #C0D9EB;
	--denipol-lightblue-hover: #e7f0f7;
	--denipol-turquoise: #2B8189;
	--denipol-turquoise-hover: #37a6b0;
	--denipol-foreground: #E4F2F2;
	--denipol-foreground-secondary: #F5FAFA;
	--denipol-foreground-secondary-hover: #e4f2f1;


	/* Easings */
	--ease-elastic: linear(0, 0.029 1.6%, 0.123 3.5%, 0.651 10.6%, 0.862 14.1%, 1.002 17.7%, 1.046 19.6%, 1.074 21.6%, 1.087 23.9%, 1.086 26.6%, 1.014 38.5%, 0.994 46.3%, 1);
	--ease-overshoot: linear(0, 0.402 7.4%, 0.711 15.3%, 0.929 23.7%, 1.008 28.2%, 1.067 33%, 1.099 36.9%, 1.12 41%, 1.13 45.4%, 1.13 50.1%, 1.111 58.5%, 1.019 83.2%, 1.004 91.3%, 1);
	--ease-circ: cubic-bezier(0.85, 0.09, 0.15, 0.91);
	--ease-anticipate: cubic-bezier(0.8, -0.4, 0.5, 1);

	/* Variables */
	--header-width: 110px
}
.main, footer{
	max-width: 2560px;
	margin: 0 auto;
}
.main:not(:has(.section-intro-wrapper)){
	padding-top: var(--header-width);
}
.foreground{
	background-color: var(--denipol-foreground);
}
.foreground-secondary{
	background-color: var(--denipol-foreground-secondary)
}
.denipol-darkblue{
	background-color: var(--denipol-darkblue);
}
.denipol-red{
	background-color: var(--denipol-red);
}
.section-wrapper{
	padding: 40px 0;
	color: var(--denipol-darkblue);
}
.padded{
	padding: 40px;
}
.pad-right{
	padding-right: var(--header-width);
}
.pad-left{
	padding-left: var(--header-width);
}
.margin-right{
	margin-right: var(--header-width);
}
.margin-left{
	margin-left: var(--header-width);
}
.vertical-text{
	writing-mode: vertical-lr;
	transform: scale(-1, -1);
}
.align-center,
.align-center-center{
	align-items: center;
}
.justify-center,
.align-center-center{
	justify-content: center;
}
.small-title{
	font-weight: 500;
	font-size: 1.25rem;
	margin-bottom: 20px;
}
[data-band]{
	position: relative;
}
[data-band]:after,
.band-item{
	content: "";
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	box-sizing: border-box;
	color: #fff;
	font-weight: bold;
	white-space: nowrap;
	word-spacing: 5px;
	padding: 20px 0 0;
	width: 60px;
	height: 100%;
	right: 0;
	top: 0;
	background-color: var(--denipol-red);
}
[data-band-center]:after{
	justify-content: center;
	padding: 0;
}
[data-band]:before{
	content: attr(data-band);
	writing-mode: vertical-lr;
	transform: scale(-1, -1) translateX(-50%);
	margin-top: auto;
	position: absolute;
	display: block;
	color: #fff;
	font-weight: bold;
	white-space: nowrap;
	word-spacing: 5px;
	z-index: 1;
	right: 30px;
	bottom: 20px;
	line-height: 20px;
}
[data-band-center]:before{
	bottom: 0;
	height: 100%;
	text-align: center;
}
.check-up-band{
	position: absolute;
	display: flex;
	flex-direction: column;
	align-items: center;
	right: 0;
	top: 0;
	width: 60px;
	height: 100%;
	background-color: var(--denipol-red);
	padding: 20px;
}
.check-up-band span{
	margin: 20px 0;
	color: white;
}
.check-up-band:before{
	content: "";
	display: block;
	width: 100%;
	min-width: 25px;
	max-width: 30px;
	aspect-ratio: 1 / 1;
	background-image: url("../img/icon/phone.svg");
	background-size: contain;
	background-position: center;
}
.input-select:has(> .select-menu-icon){
	display: flex;
}
.select-menu-icon{
	margin-left: auto;
	width: 20px;
	height: 20px;
	background-image: url('../img/icon/arrow-left.svg');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	transform: rotate(-90deg);
	display: block;
    filter: brightness(0) saturate(100%) invert(15%) sepia(48%) saturate(2863%) hue-rotate(186deg) brightness(93%) contrast(96%);
	transition: 500ms transform;
	transition-timing-function: var(--ease-elastic);
}
.input-select.active > .select-menu-icon{
	transform: rotate(90deg);
}



/*------------------------------------*\
  # SECTION
\*------------------------------------*/

.sided-section{
	display: flex;
}
.sided-section .primary-side{
	width: 60%;
}
.sided-section .secondary-side{
	width: 40%;
}
.section-intro-detail .secondary-side > *:first-child{
	margin-top: 0;
	margin-bottom: 0;
	font-size: 1.5rem;
}
.main > .section-wrapper:first-of-type{
	padding-top: 0;
}
body > .logo{
	position: absolute;
	display: block;
	left: var(--header-width);
	padding-left: 40px;
	top: calc(var(--header-width) / 2);
	transform: translateY(-50%) !important;
	z-index: 1;
}
body > .media{
	position: absolute;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: var(--header-width);
	margin: auto;
	height: 100%;
	pointer-events: none;
	top: 0;
	left: 0;
}
body > .media a{
	pointer-events: all;
}
body > .media img{
	filter: brightness(0) saturate(100%) invert(98%) sepia(1%) saturate(416%) hue-rotate(170deg) brightness(107%) contrast(70%);
}



/*------------------------------------*\
  # INTRO
\*------------------------------------*/

.section-intro-wrapper,
.section-intro-detail-wrapper{
	padding-top: 0;
}
.section-intro{
	position: relative;
	gap: 40px;
	min-height: 750px;
}
.section-intro:has(.intro-router):after{
	content: "";
	position: absolute;
	display: block;
	bottom: var(--header-width);
	left: 0;
	width: 100%;
}
.section-intro .text-side{
	padding-top: var(--header-width);
}
.denipol-logo{
	font-family: Archivo;
	letter-spacing: -1px;
	color: var(--denipol-turquoise);	
}
.denipol-logo span{
	color: var(--denipol-turquoise);
}
.denipol-logo .private{
	font-weight: 900;
	display: block;
	font-size: 12px;
	line-height: 1;
}
.denipol-logo .registered{
	font-size: 10px;
}
.logo-title{
	font-size: 2rem;
	line-height: 1;
}
.breadcrumb{
	margin-bottom: 60px;
	font-size: .9rem;
	padding: 0 0 0 40px;
}
.intro-container .breadcrumb,
.container .breadcrumb{
	padding: 0;
}
.breadcrumb a{
	color: #C4C4C4;
}
.breadcrumb a:hover{
	color: var(--denipol-turquoise);
	transition: 250ms color;
}
.breadcrumb span{
	color: var(--denipol-turquoise);
}
.section-intro .intro-router{
	position: relative;
	height: var(--header-width);
	align-items: center;
	justify-content: space-between;
}
.section-intro .intro-route-link{
	color: var(--denipol-darkblue);
	font-weight: bold;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: .9rem;
}
.section-intro .intro-route-link svg path[fill="#053b62"],
.section-intro .intro-route-link svg path[fill="#789fb0"]{
	transition: 250ms fill;
}
.section-intro .intro-route-link:hover svg path[fill="#053b62"]{
	fill: #E34137 !important;
}
.section-intro .intro-route-link:hover svg path[fill="#789fb0"]{
	fill: #fd778b !important;
}


/* Intro Detail */

.section-intro-detail .breadcrumb{
	padding-top: 0;
}
.section-intro-detail .primary-side{
	width: 100%;
	padding-left: 80px;
}
.section-intro-detail .secondary-side{
	width: 500px;
	display: flex;
	flex-direction: column;
}
.intro-detail-img{
	margin-top: auto;
	width: 100%;
	aspect-ratio: 6 / 10;
	position: relative;
	margin-top: 40px;
}
.intro-detail-img img{
	position: relative;
	z-index: 1;
	object-position: bottom center;
	width: 120%;
	max-width: unset;
	height: 100%;
	object-fit: cover;
}
.section-intro-detail .stain-item{
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 20px 40px;
	font-size: 1.25rem;
	font-weight: bold;
	color: #fff;
}

/* Intro Container */

.section-intro:has(.intro-container) .primary-side{
	width: 70%;
}
.section-intro:has(.intro-container) .secondary-side{
	width: 30%;
}
.section-intro:has(.intro-container){
	gap: 0;
}
.intro-container{
	position: relative;
	z-index: 1;
	background-color: var(--denipol-foreground);
	padding: 20px 40px;
	min-width: 125%;
	height: 100%;
}


/* Intro Img */

.section-intro .intro-img > img{
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.intro-img{
	position: relative;
	width: 100%;
	height: 100%;
}
.intro-img video{
	width: 100%;
	object-fit: cover;
	pointer-events: none;
	height: 700px;
	min-height: 100%;
}
.intro-img .embla,
.intro-img .embla__viewport,
.intro-img .embla__container{
	height: 100%;
}
.intro-img:has(.intro-img-logos),
.intro-img:has(.intro-img-attachment){
	height: fit-content;
}
.intro-img-buttons{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}
.intro-img-buttons a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--header-width);
	height: var(--header-width);
	padding: 35px;
	pointer-events: all;
}
.intro-img-buttons .call-button{
	background-color: #789FB0
}
.intro-img-buttons .call-button:hover{
	background-color: #98b6c3;
}
.intro-img-buttons .location-button{
	background-color: var(--denipol-darkblue)
}
.intro-img-buttons .dsg-button-wrapper{
	position: absolute;
	bottom: 0;
	right: 0;
	width: var(--header-width);
	height: var(--header-width);
}
.dsg-button,
.intro-img-buttons .dsg-button{
	width: var(--header-width);
	height: var(--header-width);
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(255, 255, 255, .6);
	padding: 10px;
}
.intro-img-logos{
	display: flex;
	justify-content: center;
	gap: 20px;
}
.intro-img-logos img{
	max-height: 110px;
	max-width: 210px;
	object-fit: contain;
}
.intro-container:has(.intro-attachment-link){
	display: flex;
	flex-direction: column;
}
.intro-attachment-link,
.attachment-link{
	margin-top: auto;
	color: var(--denipol-darkblue);
	font-weight: bold;
	padding: 10px 0;
	font-size: 1.1rem;
}
.section-intro:has(.intro-attachment-link) .img-side{
	margin-bottom: 110px;
}
.intro-attachment-link:after,
.attachment-link:after{
	content: "";
	position: absolute;
	left: 100%;
	bottom: 0;
	display: block;
	width: 180px;
	min-width: 180px;
	height: 110px;
	background-color: var(--denipol-red);
	background-image: url('../img/icon/pdf.svg');
	background-repeat: no-repeat;
	background-size: 70px;
	background-position: center;
	transition-duration: 250ms, 500ms;
	transition-property: background-color, background-size;
	transition-timing-function: ease-out, var(--ease-elastic);
}
.intro-attachment-link:hover:after,
.attachment-link:hover:after{
	background-size: 80px;
	background-color: var(--denipol-red-hover);
}
.intro-attachment-link span,
.attachmen-link span{
	position: relative;
	z-index: 1;
	display: inline-block !important;
}
.intro-attachment-link:before,
.attachment-link:before{
	content: "";
	position: absolute;
	right: -40px;
	bottom: 25px;
	display: block;
	width: 200px;
	height: 110px;
	z-index: 1;
	border-bottom: 2px solid var(--denipol-darkblue);
	transition-duration: 500ms;
	transition-property: right, width;
	transition-timing-function: var(--ease-elastic);
}
.intro-attachment-link:hover:before,
.attachment-link:hover span:after{
	width: 160px;
}



/*------------------------------------*\
  # APPOINTMENT & E-RESULTS MODALS
\*------------------------------------*/

.appointment-modal-wrapper,
.e-results-modal-wrapper{
	position: fixed;
	left: var(--header-width);
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(5, 59, 98, 0.75);
	z-index: 90;
    display: flex;
    align-items: end;
	opacity: 0;
	pointer-events: none;
	transition-duration: 250ms;
	transition-property: opacity;
}
.appointment-modal-wrapper.active,
.appointment-modal-wrapper.active-p,
.e-results-modal-wrapper.active{
	opacity: 1;
	pointer-events: all;
}
.appointment-modal-container,
.e-results-modal-container{
	width: fit-content;
	color: var(--denipol-darkblue);
	transform: translateX(calc(-100% - var(--header-width)));
	transition-duration: 500ms;
	transition-property: transform;
	transition-timing-function: var(--ease-circ);
	z-index: 1;
	position: relative;
}
.appointment-modal-wrapper.active .appointment-modal-container,
.e-results-modal-wrapper.active .e-results-modal-container{
	transform: translateX(0);
}
@starting-style{
	.appointment-modal-wrapper.active .appointment-modal-container,
	.e-results-modal-wrapper.active .e-results-modal-container{
		opacity: 0;
		transform: translateX(calc(-100% - var(--header-width)));
	}
}
.appointment-modal,
.e-results-modal{
	background-color: #fff;
	padding: 40px;
	width: 450px;
	min-height: 70vh;
	max-height: 100vh;
	display: flex;
	flex-direction: column;
}
.e-results-modal{
	justify-content: space-between;
}
.appointment-modal-container .band-item,
.e-results-modal-container .band-item{
	position: absolute;
	right: unset;
	top: unset;
	bottom: 0;
	height: calc(100% - 50px);
	justify-content: center;
	align-items: center;
	display: flex;
	flex-direction: column;
	padding-bottom: 20px;
	font-size: 1.3rem;
	width: 80px;
	z-index: -2;
	white-space: nowrap;
	overflow: hidden;
}
.appointment-modal-container .band-item span,
.e-results-modal-container .band-item span{
	margin-top: auto;
}
.appointment-modal-wrapper:has(.appointment-personal-info-modal.active) .band-item{
	height: 0 !important;
	padding: 0 !important;
}
.appointment-modal-wrapper:has(.appointment-personal-info-modal.active) .appointment-modal-container .band-item:before{
	opacity: 0;
}
.appointment-modal-container .band-item:before{
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MC45MTEiIGhlaWdodD0iNzAuOTExIiB2aWV3Qm94PSIxNjcuNzUxIDgwMSA3MC45MTEgNzAuOTExIj48ZyBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNmZmZmZmZmZiIgZD0iTTIzOC42NjIgODM2LjQ1NmMwIDE5LjU4My0xNS44NzMgMzUuNDU2LTM1LjQ1NSAzNS40NTUtMTkuNTg0IDAtMzUuNDU2LTE1Ljg3Mi0zNS40NTYtMzUuNDU1QzE2Ny43NSA4MTYuODczIDE4My42MjMgODAxIDIwMy4yMDcgODAxYzE5LjU4MiAwIDM1LjQ1NSAxNS44NzQgMzUuNDU1IDM1LjQ1NiIvPjxwYXRoIGZpbGw9IiNFNURDREUiIGQ9Ik0yMzguNjYyIDgzNi40NTZjMC00LjIxNi0uNzQtOC4yNi0yLjA5LTEyLjAxLS4wMjUtLjAyMy0uMDQ0LS4wNTEtLjA3MS0uMDcxLS4wNi0uMDgyLTEwLjQyLTEwLjQ0My0xMC41MDItMTAuNTAyYS45NC45NCAwIDAgMC0uNzYyLS40MDZoLTQ0LjA2MmEuOTYuOTYgMCAwIDAtLjk1Ny45NTh2NDQuMDYxYS45NC45NCAwIDAgMCAuNDA1Ljc2MnEuMDkuMTIxLjIxLjIxYy4wNi4wODIgMTAuMjEgMTAuMjMzIDEwLjI5MyAxMC4yOTIuMDIuMDI4LjA0OS4wNDcuMDcxLjA3MmEzNS40IDM1LjQgMCAwIDAgMTIuMDEgMi4wOWMxOS41ODIgMCAzNS40NTUtMTUuODczIDM1LjQ1NS0zNS40NTYiLz48ZyAgZmlsbD0iIzA1M0I2MiIgPjxwYXRoIGQ9Ik0yMjUuMjM3IDgxMy40NjdoLTQ0LjA2MmEuOTYuOTYgMCAwIDAtLjk1Ny45NTh2NDQuMDYxYzAgLjUzLjQyOC45NTguOTU3Ljk1OGg0NC4wNjJjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di00NC4wNjFhLjk2Ljk2IDAgMCAwLS45NTgtLjk1OG0tLjk1OCA0NC4wNjFoLTQyLjE0NnYtNDIuMTQ1aDQyLjE0NnoiLz48cGF0aCBkPSJNMTg4LjgzOCA4NTEuNzgxaDkuNTc5Yy41MyAwIC45NTgtLjQyOS45NTgtLjk1OHYtOS41NzhoOC42MnY5LjU3OGMwIC41My40MjkuOTU4Ljk1OC45NThoOC42MjFjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di0yOC43MzVhLjk2Ljk2IDAgMCAwLS45NTgtLjk1OGgtOC42MmEuOTYuOTYgMCAwIDAtLjk1OS45NTh2OS41NzhoLTguNjJ2LTkuNTc4YS45Ni45NiAwIDAgMC0uOTU4LS45NThoLTkuNTc5YS45Ni45NiAwIDAgMC0uOTU4Ljk1OHYyOC43MzVjMCAuNTMuNDI5Ljk1OC45NTguOTU4bS45NTgtMjguNzM2aDcuNjYzdjkuNThjMCAuNTI4LjQyOC45NTcuOTU4Ljk1N2gxMC41MzZjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di05LjU3OWg2LjcwNXYyNi44MmgtNi43MDV2LTkuNTc4YS45Ni45NiAwIDAgMC0uOTU4LS45NThoLTEwLjUzNmEuOTYuOTYgMCAwIDAtLjk1OC45NTh2OS41NzhoLTcuNjYzeiIvPjwvZz48L2c+PC9zdmc+");
}
.e-results-modal-container .band-item:before{
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2270.911%22%20height%3D%2270.911%22%20viewBox%3D%22413.012%20801%2070.911%2070.911%22%3E%3Cg%20fill-rule%3D%22evenodd%22%3E%3Cpath%20fill%3D%22%23ffffffff%22%20d%3D%22M413.012%20836.456c0%2019.583%2015.873%2035.456%2035.455%2035.455%2019.584%200%2035.456-15.872%2035.456-35.455.002-19.583-15.872-35.456-35.456-35.456-19.582%200-35.455%2015.874-35.455%2035.456%22%2F%3E%3Cpath%20fill%3D%22%23E5DCDE%22%20d%3D%22M483.923%20836.456c0-2.07-.187-4.093-.527-6.066-.036-.037-.068-.079-.111-.11-.061-.082-14.413-14.433-14.493-14.494a1.1%201.1%200%200%200-.87-.451h-7.33c-.03-.027-.067-.042-.098-.066-.062-.08-4.961-4.98-5.041-5.041a1.1%201.1%200%200%200-.871-.452h-12.228c-.614%200-1.112.498-1.112%201.112v3.335h-1.76a1.57%201.57%200%200%200-1.497%201.112h-8.97c-.614%200-1.112.497-1.112%201.111v45.576c0%20.362.184.668.451.871.061.08%206.01%206.03%206.091%206.091.022.029.051.05.075.075a35.3%2035.3%200%200%200%2013.948%202.852c19.583%200%2035.455-15.872%2035.455-35.455%22%2F%3E%3Cpath%20fill%3D%22%23053B62%22%20d%3D%22M467.921%20815.335h-8.995a1.665%201.665%200%200%200-1.565-1.112h-1.667v-3.335c0-.613-.498-1.111-1.112-1.111h-12.228c-.614%200-1.112.497-1.112%201.111v3.335h-1.76a1.57%201.57%200%200%200-1.497%201.112h-8.97c-.614%200-1.112.498-1.112%201.112v45.576c0%20.614.498%201.112%201.112%201.112h38.906c.614%200%201.112-.498%201.112-1.112v-45.576c0-.615-.498-1.112-1.112-1.112m-33.348%2026.027%201.737-1.737%201.655%204.964c.157.469.618.794%201.097.758a1.11%201.11%200%200%200%201.036-.84l2.2-8.802%202.157%209.57a1.11%201.11%200%200%200%201.074.867c.55.032.968-.346%201.09-.847l1.304-5.324%202.246%208.982a1.112%201.112%200%200%200%202.157%200l2.605-10.424%201.991%203.982c.377.753%201.612.753%201.99%200l1.316-2.635%202.135%203.557v13.031h-27.79zm27.79-2.25-1.27-2.117a1.09%201.09%200%200%200-.996-.538c-.405.015-.77.25-.951.613l-1.23%202.458-2.34-4.681a1.112%201.112%200%200%200-2.073.227l-2.256%209.026-2.256-9.026a1.11%201.11%200%200%200-1.079-.842h-.002c-.51.001-.955.35-1.077.847l-1.248%205.095-2.146-9.521a1.11%201.11%200%200%200-1.072-.867%201.1%201.1%200%200%200-1.091.842l-2.409%209.636-1.016-3.049a1.112%201.112%200%200%200-1.84-.434l-1.438%201.437v-16.213h3.335c0%20.613.497%201.111%201.111%201.111h18.898c.614%200%201.112-.497%201.112-1.111h3.335zM443.466%20812h10.004v2.223h-10.004zm-2.224%204.447h15.563v4.446h-16.674v-4.446zm25.568%2044.464h-36.684v-43.353h7.782v2.223h-4.447c-.614%200-1.112.498-1.112%201.112v36.683c0%20.614.498%201.112%201.112%201.112h30.014c.613%200%201.111-.498%201.111-1.112v-36.683c0-.614-.497-1.112-1.111-1.112h-4.447v-2.223h7.782z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.appointment-modal-container .band-item:before,
.e-results-modal-container .band-item:before {
	content: "";
    position: absolute;
    transform-origin: center top;
	top: 20px;
	width: 60px;
	height: 60px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
    z-index: -1;
	margin: 0 10px;
}
.appointment-modal-container .band-item:before,
.e-results-modal-container .band-item:before,
.band-item{
	transition-duration: 500ms, 250ms;
	transition-delay: 0, 0, 250ms, 0;
	transition-property: height, padding, left, opacity;
	transition-timing-function: var(--ease-circ);
}
.appointment-modal-wrapper.active .band-item,
.e-results-modal-wrapper.active .band-item{
	left: 100%;
}
@starting-style{
	.appointment-modal-wrapper.active .appointment-modal-container .band-item:before,
	.appointment-modal-wrapper.active .band-item,
	.e-results-modal-wrapper.active .e-results-modal-container .band-item:before,
	.e-results-modal-wrapper.active .band-item{
		left: 0;
	}
}
.appointment-modal .input-select{
	width: 100%;
	margin-bottom: 20px;
	padding: 20px;
	background-color: var(--denipol-foreground);
	position: relative;
	transition-duration: 250ms;
	transition-property: transform, display;
	transition-behavior: allow-discrete;
	transition-timing-function: var(--ease-circ);
}
.appointment-modal .input-select .selected:not([data-key]){
	filter: grayscale(.5);
	opacity: .5;
}
.appointment-modal .input-select:after,
.appointment-personal-info-modal .input-select:after,
.input-select.arrow:after{
	content: "";
	display: block;
	position: absolute;
	width: 20px;
	height: 20px;
	background-image: url('../img/icon/arrow-left.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	top: 50%;
	right: 20px;
	transform-origin: center;
	filter: brightness(0) saturate(100%) invert(15%) sepia(48%) saturate(2863%) hue-rotate(186deg) brightness(93%) contrast(96%);
	transform: translateY(-50%) rotate(-90deg);
	transition: 500ms transform;
	transition-timing-function: var(--ease-elastic);
}
.appointment-modal .input-select.active:after,
.appointment-personal-info-modal .input-select.active:after,
.input-select.active.arrow:after{
	transform: translateY(-50%) rotate(90deg);
}
.appointment-modal .select-menu{
	padding-right: 80px;
}

.appointment-time-container-top{
	font-size: .9rem;
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}
.appointment-time-selector{
	background-color: var(--denipol-foreground);
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 5px;
	height: 0;
	padding: 0;
	transition-duration: 500ms;
	transition-property: height, padding;
	transition-timing-function: var(--ease-circ);
	overflow: hidden;
}
.appointment-time-selector.active{
	height: 235px;
	width: 360px;
	max-height: fit-content;
	padding: 10px;
}
.appointment-time-item{
	width: calc(25% - 30px / 4);
	height: 35px;
	padding: 3px 0;
	text-align: center;
	border: 1px solid var(--denipol-darkblue);
	transition: 250ms;
	cursor: pointer;
}
.appointment-time-item.disabled{
	display: none;
}
.appointment-time-item:hover,
.appointment-time-item.active{
	background-color: var(--denipol-red);
	border-color: var(--denipol-red) !important;
	color: #fff;
}
.appointment-date-indicator > *{
	display: block;
}
.appointment-date-indicator .date{
	color: var(--denipol-red);
}

/* Step 2 */

.appointment-modal:has(.choosen-doctor-preview-container.active) .input-select{
	transform: translate(-520px);
	display: none;
}
@keyframes choosen-doctor-preview-containerAnim{
	0%{display: none;transform: translateY(-50%);opacity: 0;}
	50%{display: none;transform: translateY(-50%);opacity: 0;}
	51%{display: block;transform: translateY(-50%);opacity: 0;}
	100%{display: block;transform: translateY(0%);opacity: 1;}
}
.choosen-doctor-preview-container{
	top: 0;
	left: 0;
	width: calc(100% + 80px);
	position: relative;
	display: none;
	transform: translateY(-50%);
	transition: 500ms transform, 500ms display ease allow-discrete, 500ms width;
}
.appointment-modal-wrapper.active-p .choosen-doctor-preview-container{
	width: 100%;
}
.choosen-doctor-preview-container.active{
	display: block;
	transform: translateY(0%);
	animation: 500ms choosen-doctor-preview-containerAnim;
	animation-timing-function: ease-out;
}
.choosen-doctor-img{
	position: absolute;
	border-radius: 100%;
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	background-color: var(--denipol-foreground);
	border: 5px solid #fff;
	top: -100px;
	right: -50px;
	padding: 20px 20px 0;
	transition: 500ms right;
}
.appointment-modal-wrapper.active-p .choosen-doctor-img{
	right: 0;
}
.choosen-doctor-info{
	width: 50%;
	padding-bottom: 20px;
}
.choosen-doctor-name{
	font-size: 1.5rem;
	line-height: 1;
	font-weight: bold;
	display: block;
	margin-bottom: 10px;
}
.choosen-doctor-department{
	color: var(--denipol-red);
}

.appointment-personal-info-modal{
    background-color: #fff;
    height: fit-content;
    place-self: end;
    display: flex;
    flex-direction: column;
    padding: 40px;
    border-left: 1px solid #ECECEC;
    transition: 500ms transform;
	transition-timing-function: var(--ease-circ);
    transform: translateX(-100%);
	opacity: 0;
}
.appointment-personal-info-modal.active{
    transform: translateX(0%);
	opacity: 1;
}
.appointment-personal-info-modal{
    position: relative;
}
.appointment-personal-info-modal .title,
.e-results-modal .title{
    color: var(--denipol-red);
	font-weight: 600;
    margin-bottom: 20px;
}
.appointment-personal-info-modal .selected{
    font-size: 1.1rem;
	color: var(--denipol-darkblue);
}
.appointment-personal-info-modal > *:not(.title, .button),
.e-results-modal .inputs > *:not(label){
    background-color: transparent;
    outline: none;
    border: none;
    border-bottom: 1px solid var(--denipol-foreground);
    font-size: 1.1rem;
	color: var(--denipol-darkblue);
	font-family: Raleway;
    padding: 10px 0 5px;
    margin: 10px 0;
}
.e-results-modal .inputs label{
	display: block;
	font-size: .9rem;
	color: var(--denipol-red);
}
.appointment-personal-info-modal input::placeholder{
    color: var(--denipol-darkblue)
}
.appointment-personal-info-modal .button,
.e-results-modal .button{
    background-color: var(--denipol-red);
    padding: 10px 60px;
    color: #fff;
    font-weight: bold;
    font-size: 1.25rem;
	text-align: center;
    margin-top: 20px;
	cursor: pointer;
}
.appointment-personal-info-modal .button span,
.e-results-modal .button span{
	display: block;
}

/* Appointment Result Modal */

@keyframes appointment-result-modalAnim{
	0%{opacity: 0;transform: translate(-50%, -50%) scale(.8);}
	100%{opacity: 1;transform: translate(-50%, -50%) scale(1);}

}
.appointment-result-modal{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 40px;
    max-width: 450px;
    color: var(--denipol-darkblue);
	animation: 1000ms appointment-result-modalAnim;
	animation-timing-function: var(--ease-elastic);
}
.appointment-code-container{
    margin-top: 20px;
    padding: 20px 60px;
    background-color: var(--denipol-red);
    color: #fff;
    text-align: center;
    line-height: 1;
    position: relative;
}
.appointment-code-container:after{
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 5px;
    border: 2px solid #fff;
}
.appointment-code{
    display: block;
    font-size: 1.5rem;
    font-weight: bold;
}



/*------------------------------------*\
  # CALENDAR
\*------------------------------------*/

.jsCalendar table{
	background-color: transparent !important;
	border: none !important;
	color: #fff !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	font-family: Raleway !important;
}
.jsCalendar-title-name{
	color: var(--denipol-darkblue) !important;
	font-size: 1.5rem !important;
	font-weight: bold !important;
}
.jsCalendar-week-days{
	padding: 10px 10px 10px 10px !important;
	display: block !important;
}
.jsCalendar-week-days th{
	font-weight: 600 !important;
}
.jsCalendar tbody{
	padding: 0 10px 10px 10px !important;
}
.jsCalendar tbody td{
	font-weight: 400 !important;
}
.jsCalendar table tbody,
.jsCalendar-week-days{
	background-color: var(--denipol-darkblue);
}
.jsCalendar tbody td.jsCalendar-current{
	background-color: var(--denipol-red) !important;
}
.jsCalendar tbody td.jsCalendar-next, .jsCalendar tbody td.jsCalendar-previous, .jsCalendar tbody td.jsCalendar-unselectable{
	color: #b1b1b1 !important;
}
.jsCalendar tbody td:hover{
	background-color: var(--denipol-darkblue-hover) !important;
}
.jsCalendar tbody td.jsCalendar-current:hover{
	background-color: var(--denipol-red-hover) !important;
}


/*------------------------------------*\
  # ATTACHMENT LINKS
\*------------------------------------*/

.attachment-link{
	display: block;
	position: relative;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
}
.attachment-link:after{
	position: static;
}
.attachment-link:before{
	bottom: 25px;
	left: unset;
	right: 150px;
}
.attachment-link:hover:before{
	width: 160px;
}



/*------------------------------------*\
  # SLIDER NAVIGATOR
\*------------------------------------*/

.slider-navigator{
	display: flex;
	justify-content: center;
	gap: 20px;
}
.slider-navigator > *{
	position: relative;
	background-color: var(--denipol-turquoise);
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
}
.slider-navigator > *:before{
	content: "";
	display: block;
	position: absolute;
	top: 15%;
	left: 15%;
	width: 70%;
	height: 70%;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
.slider-navigator > .prev-button:before{
	background-image: url("../img/icon/arrow-left.svg");
	overflow: visible;
}
.slider-navigator > .next-button:before{
	background-image: url("../img/icon/arrow-right.svg");
	overflow: visible;
}



/*------------------------------------*\
  # HOSPITAL ICONS
\*------------------------------------*/

.hospital-icon{
	position: relative;
	display: block;
}
.hospital-icon:before{
	display: block;
	position: absolute;
	content: "";
	bottom: 0;
	right: 0;
	width: 100px;
	height: 100px;
	z-index: 1;
	background-image: url("../img/icon/healthcare-hospital.svg");
	background-size: contain;
	background-position: 100% 0;
	background-repeat: no-repeat;
}
.hospital-icon.left:before{
	background-image: url("../img/icon/healthcare-hospital-light.svg");
	right: unset;
	left: 0;
	background-position: 100% 100%;
}



/*------------------------------------*\
  # TEXT CONTAINER
\*------------------------------------*/

.text-title,
.text-title-small{
	font-weight: bold;
	text-align: start;
	display: block;
	font-size: 2.5rem;
	line-height: 1;
	height: fit-content;
	margin-bottom: 25px;
}
.text-title-small{
	font-size: 1.75rem;
}
.text-container{
	color: var(--denipol-darkblue);
	max-width: 60vw;
	font-weight: 400;
}
.text-container h2{
	font-weight: 500;
}
.text-container-link{
	display: block;
	margin-top: 20px;
	font-weight: bold;
	font-size: 1.1rem;
	color: inherit;
}
.text-container .text-container-link:hover,
.intro-attachment-link:hover span{
	color: var(--denipol-darkblue-hover);
}
.text-container.light .text-container-link:hover{
	color: #ddd;
}



/*------------------------------------*\
  # EMBLA CAROUSEL
\*------------------------------------*/

.embla__viewport {
	overflow: hidden;
}
.embla__container {
	display: flex;
	touch-action: pan-y pinch-zoom;
}
.embla__slide {
	flex: 0 0 fit-content;
	min-width: 0;
}



/*------------------------------------*\
  # CAROUSEL SLIDER
\*------------------------------------*/

.secton-carousel-slider{
	user-select: none;
}
.carousel-slider-top{
	display: flex;
	justify-content: space-between;
	padding: 20px
}
.carousel-slider-top span{
	color: var(--denipol-red);
}
.carousel-slider-back-container{
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: underline;
	color: var(--denipol-darkblue);
	text-decoration-color: var(--denipol-darkblue);
	text-underline-offset: 5px;
	font-weight: bold;
}
.carousel-slider-back-container:hover{
	color: var(--denipol-darkblue-hover);
}
.carousel-slider-back-container:hover .back-button{
	transform: translateX(-5px) scale(1.025);
	background-color: var(--denipol-darkblue);
	filter: none;
}
.carousel-slider-back-container .back-button{
	background-image: url("../img/icon/arrow-left.svg");
	background-size: 80%;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 100%;
	width: 26px;
	height: 26px;
	border: 2px solid var(--denipol-darkblue);
	filter: brightness(0) saturate(100%) invert(15%) sepia(48%) saturate(2863%) hue-rotate(186deg) brightness(93%) contrast(96%);
	transition: 500ms;
	transition-property: transform, background-color;
	transition-timing-function: var(--ease-elastic);
	transform-origin: center;
	cursor: pointer;
}



/*------------------------------------*\
  # TOAST MESSAGES
\*------------------------------------*/

#toast-container > div{
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 20px 20px 20px 50px !important;
    font-weight: bold !important;
    font-family: Raleway !important;
}
#toast-container > div.toast-error{
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=') !important;
    background-color: var(--denipol-red) !important;
}
#toast-container > div.toast-success{
	background-image: url('../img/icon/tick.svg') !important;
    background-color: var(--denipol-turquoise) !important;
}



/*------------------------------------*\
  # LISTS
\*------------------------------------*/

.list{
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.list li:before{
	content: "";
	display: inline-block;
	background-color: var(--denipol-red);
	width: 7px;
	height: 7px;
	border: 3px solid #EDB5BA;
	border-radius: 100%;
	margin-right: 10px;
}



/*------------------------------------*\
  # HEADER SEARCH
\*------------------------------------*/

.header-search-wrapper{
    position: absolute;
    top: 0;
    right: var(--header-width);
    height: var(--header-width);
    place-content: end;
    width: fit-content;
    min-width: 400px;
    border-bottom: 1px solid var(--denipol-gray);
	font-size: .9rem;
	color: var(--denipol-darkblue);
	padding-bottom: 10px;
	line-height: 1;
}
.header-search-wrapper .input-select{
	width: 100%;
}
.header-search-wrapper li{
	padding: 0 !important;
}
.header-search-wrapper a{
	color: var(--denipol-darkblue);
}
.header-search-wrapper li:hover a{
	color: var(--denipol-darkblue-hover);
}
.header-search-wrapper .selected{
    padding-right: 60px;
	display: flex;
	justify-content: end;
}
.header-search-wrapper .select-menu{
    z-index: 102;
}



/*------------------------------------*\
  # GENERAL ANIMATIONS
\*------------------------------------*/

.header-menu-button,
.intro-img-buttons a,
.header-right-button,
.stain-item,
form button,
.appointment-modal-wrapper .button,
.e-results-modal .button
{
	transition: 250ms background-color;
}

.slider-navigator > *,
.intro-route-link svg,
body > .media a,
.footer-media a,
.header-menu-button .icon,
.intro-img-buttons a img,
.header-right-button img,
.carousel-slider-back-container,
.appointment-modal-wrapper .button span,
.e-results-modal .button span,
form button span,
.dsg-button img
{
	transition-duration: 300ms;
	transition-property: transform, background-color, border;
	transition-timing-function: var(--ease-elastic);
	cursor: pointer;
}

.slider-navigator > *:hover,
.intro-route-link:hover svg,
body > .media a:hover,
.footer-media a:hover,
.header-menu-button:hover .icon,
.intro-img-buttons a:hover img,
.header-right-button:hover img,
.dsg-button:hover img
{
	transform: scale(1.15);
}
.appointment-modal-wrapper .button:hover span,
.e-results-modal .button:hover span,
.section-contact button:hover span,
form button:hover span{
	transform: scale(1.05);
}
.slider-navigator > *:active,
.intro-route-link:active svg,
body > .media a:active,
.footer-media a:active,
.header-menu-button:active .icon,
.intro-img-buttons a:active img,
.header-right-button:active img,
.appointment-modal-wrapper .button:active span,
.e-results-modal .button:active span,
.section-contact button:active span,
form button:active span,
.dsg-button:active img
{
	transform: scale(.95);
}



/* Colors */

.intro-img-buttons .location-button:hover,
.intro-img-buttons .location-button:hover,
.stain-item.denipol-darkblue:hover{
	background-color: var(--denipol-darkblue-hover);
}
.slider-navigator > *:hover{
	background-color: var(--denipol-turquoise-hover);
}
.header-menu-button:hover,
.attachment-link:hover:after,
.stain-item.denipol-red:hover,
form button:hover,
.appointment-modal-wrapper .button:hover,
.e-results-modal .button:hover{
	background-color: var(--denipol-red-hover);
}
.attachment-link:hover{
	color: var(--denipol-darkblue-hover);
}
.footer-router > ul li:hover a{
	color: var(--denipol-lightblue-hover);
}
.footer-department li:hover a{
	color: var(--denipol-blue-hover);
}


/* Other */

@keyframes indentAnim{
	0%{left: -40px;width: 0;opacity: .5;}
	100%{left: -20px;width: 20px;opacity: 1;}
}

.footer-router > ul li:has(a),
.footer-department li,
.footer-info-container li a,
.header-menu-item.active .sub-menu a,
.text-container-link,
.intro-attachment-link span,
.attachment-link span,
.doctor-item-wrapper .more span,
.blog-item-wrapper .more span,
.section-treatment-methods .text-title span,
.select-menu li span,
.partner-item-wrapper span,
.header-search-wrapper li a{
	position: relative;
	display: block;
	transition: 500ms all;
	transition-timing-function: var(--ease-elastic);
}
.footer-router > ul li:has(a):hover,
.footer-department li:hover,
.header-menu-item.active .sub-menu a:hover,
.text-container-link:hover,
.intro-attachment-link:hover span,
.attachment-link:hover span,
.doctor-item-wrapper:hover .more span,
.blog-item-wrapper:hover .more span,
.section-treatment-methods .text-title:hover span,
.select-menu li:hover span,
.partner-item-wrapper:hover span,
.header-search-wrapper li a:hover{
	transform: translateX(20px);
}
.footer-router > ul li:has(a):hover:before,
.footer-department li:hover:before,
.header-menu-item.active .sub-menu a:hover:before,
.text-container-link:hover:before,
.intro-attachment-link:hover span:before,
.attachment-link:hover span:before,
.doctor-item-wrapper:hover .more span:before,
.blog-item-wrapper:hover .more span:before,
.section-treatment-methods .text-title:hover span:before,
.select-menu li:hover span:before,
.partner-item-wrapper:hover span:before,
.header-search-wrapper li a:hover:before{
	content: "";
	position: absolute;
	display: block;
	top: 50%;
	left: -20px;
	width: 20px;
	height: 20px;
	background-image: url('../img/icon/chevron-down.svg');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	transform-origin: center;
	transform: translateY(-50%) rotate(-90deg);
	animation: indentAnim 500ms;
	animation-timing-function: var(--ease-elastic);
}
.footer-router > ul li:has(a):hover:before,
.text-container.light .text-container-link:hover:before,
.section-carousel-slider .more span:before{
	filter: brightness(0%) invert(100%);
}



/* Img Load */
.img-load{
	height: 0;
	overflow: hidden;
	transition: 250ms all !important;
}
.img-load.aos-animate{
	height: 100%;
	transition: 750ms all !important;
	transition-timing-function: var(--ease-circ) !important;
}
.img-load img{
	width: 100%;
	max-height: unset !important;
	object-fit: cover;
	object-position: center;
}



/* Stains */

.stain-red,
.stain-blue{
	position: relative;
}

.stain-red:before,
.stain-blue:before{
	content: "";
	position: absolute;
	width: 100px;
	height: 40px;
}
.stain-red:before{
	background-color: var(--denipol-red);
}
.stain-blue:before{
	background-color: var(--denipol-blue);
}
.stain-small{
	width: 60px;
}
.stain-top:before{
	top: 0;
}
.stain-bottom:before{
	bottom: 0;
}
.stain-left:before{
	left: 0;
}
.stain-right:before{
	right: 0;
}