: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: cubic-bezier(0.295, 1.650, 0.000, 0.855); /*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;
    font-size: 1.25rem;
}

[data-band-center]:before {
    bottom: 0;
    height: 100%;
    text-align: center;
}

[data-band-top]:before {
    bottom: 0;
    height: calc(100% - 20px);
    text-align: end;
}

.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;
    font-size: 1.25rem;
}

.check-up-band span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    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-3Mr7EZj.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-Jg90UW_.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);
}

.select-menu[data-band] {
    padding-right: 80px;
}

.select-menu[data-band]:before {
    font-size: 1.1rem;
}

.input-select.active > .select-menu-icon {
    transform: rotate(90deg);
}

.checkbox-item [type='checkbox'] {
    display: block;
    width: 25px;
    min-width: 25px;
    height: 25px;
    height: 25px;
    position: relative;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

.checkbox-item [type='checkbox']:before,
.checkbox-item [type='checkbox']:after {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.checkbox-item [type='checkbox']:before {
    border: 1px solid var(--denipol-darkblue);
    box-sizing: border-box;
    transition: 250ms background-color ease-out;
    border-radius: 3px;
}

.checkbox-item [type='checkbox']:checked:before {
    background-color: var(--denipol-darkblue);
}

.checkbox-item [type='checkbox']:after {
    background-image: url("../img/icon/tick-q8dhnCi.svg");
    background-repeat: no-repeat;
    background-size: 66%;
    background-position: center;
    transform: scale(0);
    transition: 500ms transform 100ms;
    transition-timing-function: var(--ease-elastic);
}

.checkbox-item [type='checkbox']:checked:after {
    transform: scale(1);
}

.clr-field {
    display: block !important;
}

.select2-container .select2-selection--single .select2-selection__clear {
    font-size: .6em !important;
}

.select2-container--bootstrap5 .select2-selection__clear {
    background-color: #78829D !important;
}

.list-content-not-found-text,
.content-not-found-text {
    width: 100%;
    font-size: 1.5rem;
    padding: 200px 0;
    text-align: center;
    opacity: .5
}

.input-select .select-menu:has(> .list-content-not-found-text),
.input-select.active .select-menu:has(> .list-content-not-found-text) {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.list-content-not-found-text {
    padding: 0;
    display: block;
    position: static;
    font-size: 1.25rem;
}

.inspect:after {
    content: "İnceleyin";
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    padding: 20px;
    align-items: end;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: 300ms all;
    background-image: url("../img/denipol-logo-small-Cky3JrE.png");
    background-repeat: no-repeat;
    background-size: min(90%, 180px);
    background-position: center;
    box-sizing: border-box;
    transition-timing-function: var(--ease-circ);
    color: #fff;
}

a:hover .inspect:after,
.inspect:hover:after {
    pointer-events: all;
    opacity: 1;
    background-color: rgba(5, 59, 98, 0.8);
}


/*------------------------------------*\
  # 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%);
}

p > img {
    object-fit: cover;
}


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

.section-intro-wrapper,
.section-intro-detail-wrapper {
    padding-top: 0;
}

.section-intro {
    position: relative;
}

.section-intro .secondary-side {
    padding-right: 40px;
}

.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);
    font-size: 1.1rem;
}

.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: 40px;
    font-weight: 400;
    font-size: .9rem;
    padding: 0 0 0 40px;
    display: flex;
    flex-wrap: wrap;
}

.intro-container .breadcrumb,
.container .breadcrumb {
    padding: 0;
}

.breadcrumb a {
    display: inline-block;
    color: #C4C4C4;
}

.breadcrumb a:hover {
    color: var(--denipol-turquoise);
    transition: 250ms color;
}

.breadcrumb > *:last-child {
    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;
    margin-right: 10px;
}

.section-intro .intro-route-link svg {
    overflow: visible;
}

.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: #E10E35 !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: 60px;
}

.section-intro-detail .primary-side .content {
    min-height: 600px;
    overflow-x: hidden;
}

.section-intro-detail .primary-side:has(.stain-item) {
    padding-bottom: 90px;
}

.section-intro-detail .secondary-side {
    width: 500px;
    display: flex;
    flex-direction: column;
}

.intro-detail-img {
    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;
}

.stain-item {
    padding: 20px 40px;
    font-size: 1.25rem;
    font-weight: bold;
}

.section-intro-detail .stain-item {
    position: absolute;
    right: 0;
    bottom: 0;
    color: #fff;
}

/* Intro Container */

.section-intro:has(.intro-container) .primary-side {
    width: 70%;
}

.section-intro:has(.intro-container) .secondary-side {
    width: 30%;
    min-width: 400px;
}

.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;
    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: 100%;
    display: flex;
    flex-direction: column;
}

.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: 20px;
    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);
}

.intro-img-buttons img {
    height: 50%;
    max-height: 30px;
    object-fit: contain;
}

.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;
    padding: 10px 0 0;
    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-_IaMfRJ.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;
}


/*------------------------------------*\
  # DIALOGMODAL
\*------------------------------------*/

.dialogmodal-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .25);
    z-index: 125;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dialogmodal {
    min-width: 500px;
    padding: 30px;
    border-radius: 0.625rem;
    text-align: center;
    background-color: #fff;
    box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f1f4;
}

.dialogmodal h2 {
    margin-bottom: 20px;
}

.dialogmodal .button-container {
    display: flex;
    gap: 10px;
    margin: auto;
}


/*------------------------------------*\
  # 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;
    max-width: 100vw;
    max-height: calc(100dvh - var(--header-width));
    height: fit-content;
    overflow-y: auto;
    overflow-x: clip;
}

.appointment-modal-content,
.e-results-modal-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.e-results-modal {
    height: 650px;
}

.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,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MC45MTEiIGhlaWdodD0iNzAuOTExIiB2aWV3Qm94PSIxNjcuNzUxIDgwMSA3MC45MTEgNzAuOTExIj48ZyBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNmZmZmZmZmZiIgZD0iTTIzOC42NjIgODM2LjQ1NmMwIDE5LjU4My0xNS44NzMgMzUuNDU2LTM1LjQ1NSAzNS40NTUtMTkuNTg0IDAtMzUuNDU2LTE1Ljg3Mi0zNS40NTYtMzUuNDU1QzE2Ny43NSA4MTYuODczIDE4My42MjMgODAxIDIwMy4yMDcgODAxYzE5LjU4MiAwIDM1LjQ1NSAxNS44NzQgMzUuNDU1IDM1LjQ1NiIvPjxwYXRoIGZpbGw9IiNFNURDREUiIGQ9Ik0yMzguNjYyIDgzNi40NTZjMC00LjIxNi0uNzQtOC4yNi0yLjA5LTEyLjAxLS4wMjUtLjAyMy0uMDQ0LS4wNTEtLjA3MS0uMDcxLS4wNi0uMDgyLTEwLjQyLTEwLjQ0My0xMC41MDItMTAuNTAyYS45NC45NCAwIDAgMC0uNzYyLS40MDZoLTQ0LjA2MmEuOTYuOTYgMCAwIDAtLjk1Ny45NTh2NDQuMDYxYS45NC45NCAwIDAgMCAuNDA1Ljc2MnEuMDkuMTIxLjIxLjIxYy4wNi4wODIgMTAuMjEgMTAuMjMzIDEwLjI5MyAxMC4yOTIuMDIuMDI4LjA0OS4wNDcuMDcxLjA3MmEzNS40IDM1LjQgMCAwIDAgMTIuMDEgMi4wOWMxOS41ODIgMCAzNS40NTUtMTUuODczIDM1LjQ1NS0zNS40NTYiLz48ZyAgZmlsbD0iIzA1M0I2MiIgPjxwYXRoIGQ9Ik0yMjUuMjM3IDgxMy40NjdoLTQ0LjA2MmEuOTYuOTYgMCAwIDAtLjk1Ny45NTh2NDQuMDYxYzAgLjUzLjQyOC45NTguOTU3Ljk1OGg0NC4wNjJjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di00NC4wNjFhLjk2Ljk2IDAgMCAwLS45NTgtLjk1OG0tLjk1OCA0NC4wNjFoLTQyLjE0NnYtNDIuMTQ1aDQyLjE0NnoiLz48cGF0aCBkPSJNMTg4LjgzOCA4NTEuNzgxaDkuNTc5Yy41MyAwIC45NTgtLjQyOS45NTgtLjk1OHYtOS41NzhoOC42MnY5LjU3OGMwIC41My40MjkuOTU4Ljk1OC45NThoOC42MjFjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di0yOC43MzdvhLjk2Ljk2IDAgMCAwLS45NTgtLjk1OGgtOC42MmEuOTYuOTYgMCAwIDAtLjk1OS45NTh2OS41NzhoLTguNjJ2LTkuNTc4YS45Ni45NiAwIDAgMC0uOTU4LS45NThoLTkuNTc5YS45Ni45NiAwIDAgMC0uOTU4Ljk1OHYyOC43MzVjMCAuNTMuNDI5Ljk1OC45NTguOTU4bS45NTgtMjguNzM2aDcuNjYzdjkuNThjMCAuNTI4LjQyOC45NTcuOTU4Ljk1N2gxMC41MzZjLjUzIDAgLjk1OC0uNDI5Ljk1OC0uOTU4di05LjU3OWg2LjcwNXYyNi44MmgtNi43MDV2LTkuNTc4YS45Ni45NiAwIDAgMC0uOTU4LS45NThoLTEwLjUzNmEuOTYuOTYgMCAwIDAtLjk1OC45NTh2OS41NzhoLTcuNjYzeiIvPjwvZz48L2c+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");
}

.e-results-modal .inputs {
    display: flex;
    flex-direction: column;
}

.appointment-modal-container .band-item:before,
.e-results-modal-container .band-item:before {
    content: "";
    position: absolute;
    transform-origin: center top;
    background-color: var(--denipol-red);
    top: 0;
    width: 80px;
    height: 100px;
    background-size: 60px;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.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-container {
    margin-bottom: 20px;
    transition: 250ms filter, opacity;
}

.appointment-modal .input-select-container.disabled {
    filter: grayscale(.5) brightness(.8);
    opacity: .4;
    pointer-events: none;
}

.appointment-modal .input-select {
    width: 100%;
    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-Jg90UW_.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;
    place-content: start;
    transition-duration: 500ms;
    transition-property: height, padding;
    transition-timing-function: var(--ease-circ);
    overflow: hidden;
}

.appointment-time-selector.active {
    height: fit-content;
    min-height: 60px;
    width: 100%;
    padding: 10px;
}

.appointment-time-selector span {
    text-align: center;
}

.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: 100%;
    position: relative;
    display: none;
    transform: translateY(-50%);
}

.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;
    transition: 500ms transform, 500ms display ease allow-discrete, 500ms width;
    opacity: 1;
}

.choosen-doctor-img {
    position: absolute;
    border-radius: 100%;
    width: 50%;
    min-width: 225px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background-color: var(--denipol-foreground);
    border: 3px solid #fff;
    top: -60px;
    right: 30px;
    transform: translate(50%);
    padding: 20px 20px 0;
    z-index: 10;
    box-shadow: inset 0 0 100px -90px black;
    opacity: 0;
    transition: 250ms ease-out;
    pointer-events: none;
}

.choosen-doctor-img img {
    max-width: unset;
    width: 200px;
    object-fit: cover;
    object-position: top;
}

.appointment-modal-wrapper.active .appointment-modal-container:has(.choosen-doctor-preview-container.active) .choosen-doctor-img {
    opacity: 1;
    pointer-events: all;
}

.appointment-modal-wrapper.active-p .choosen-doctor-img {
    right: 0;
}

.choosen-doctor-info {
    padding-bottom: 20px;
    padding-left: 20px;
    cursor: pointer;
}

.choosen-doctor-info:before {
    width: 30px !important;
    height: 30px !important;
    top: 20px !important;
    left: -20px !important;
    transform: translateY(-50%) rotate(-270deg) !important;
    transition-duration: 300ms;
    transition-property: transform;
    transition-timing-function: var(--ease-elastic);
}

.choosen-doctor-info:hover:before {
    transform-origin: center !important;
    transform: translateY(-50%) rotate(-270deg) scale(1.15) !important;
}

.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-wrapper {
    pointer-events: none;
}

.appointment-personal-info-modal-wrapper:has(.appointment-personal-info-modal.active) {
    pointer-events: all;
}

.appointment-personal-info-modal {
    background-color: #fff;
    height: fit-content;
    place-self: end;
    display: flex;
    bottom: 0;
    flex-direction: column;
    padding: 40px;
    border-left: 1px solid #ECECEC;
    transition: 500ms transform;
    transition-timing-function: var(--ease-circ);
    transform: translateX(-100%);
    opacity: 0;
    max-height: calc(100dvh - var(--header-width) - 160px);
    overflow: auto;
}

.appointment-personal-info-modal.loading:before {
    height: 100vh !important;
}

.appointment-personal-info-modal.active {
    transform: none;
    opacity: 1;
}

.appointment-modal-wrapper:not(.active) .appointment-personal-info-modal.active {
    transform: translateX(-200%);
    opacity: 0;
}

.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, .birth-input-wrapper),
.appointment-personal-info-modal .birth-input,
.e-results-modal .inputs > *:not(label, .birth-input-wrapper) {
    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;
    font-weight: 500;
    width: 100%;
}

.e-results-modal .inputs label {
    display: block;
    font-size: .9rem;
    color: var(--denipol-red);
}

.appointment-personal-info-modal {
    max-width: 450px;
}

.appointment-modal-wrapper label {
    font-size: .8rem !important;
    display: flex;
    gap: 10px;
}

.appointment-personal-info-modal input::placeholder,
.appointment-personal-info-modal .input-select .selected:not([data-key]) {
    color: rgba(5, 59, 98, 0.75);
}

.appointment-modal-wrapper .cancel-appointment-button {
    margin-bottom: 0 !important;
}

.appointment-modal-wrapper .cancel-appointment-button,
.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-modal-wrapper .cancel-appointment-button span,
.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;
    width: calc(100% - 40px);
    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,
.appointment-code-container:before {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 40px;
    height: 40px;
}

.appointment-code-container:after {
    border-radius: 5px;
    border: 2px solid #fff;
    transform: translateY(-50%);
    transition: 250ms background-color ease-out;
}

.appointment-code-container.active:after {
    background-color: #fff;
}

.appointment-code-container:before {
    background-image: url("../img/icon/tick-q8dhnCi.svg");
    background-repeat: no-repeat;
    background-size: 66%;
    background-position: center;
    transform: scale(0) translateY(-50%);
    transition: 500ms transform 100ms;
    transition-timing-function: var(--ease-elastic);
    filter: brightness(0) saturate(100%) invert(15%) sepia(48%) saturate(2863%) hue-rotate(186deg) brightness(93%) contrast(96%);
    z-index: 1;
}

.appointment-code-container.active:before {
    transform: scale(1) translateY(-50%);
}

.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,
.air-datepicker-cell.-selected-,
.air-datepicker-cell.-selected-.-focus- {
    color: #fff !important;
    background-color: var(--denipol-red) !important;
}

.jsCalendar tbody td {
    color: #fff !important;
}

.jsCalendar tbody td.jsCalendar-unselectable,
.air-datepicker-cell.-disabled- {
    color: rgb(177, 177, 177, .75) !important;
}

.jsCalendar tbody td:not(.jsCalendar-unselectable):hover,
.air-datepicker-cell.-focus-,
.air-datepicker-nav--title:hover,
.air-datepicker-nav--action:hover {
    background-color: var(--denipol-darkblue-hover) !important;
}

.jsCalendar tbody td.jsCalendar-current:hover,
.air-datepicker-cell.-selected-:hover {
    background-color: var(--denipol-red-hover) !important;
}


/* Air Datepicker */

.birth-input-wrapper {
    position: relative;
}

.birth-input:focus ~ .air-datepicker-wrapper > .air-datepicker.-inline-,
.birth-input ~ .air-datepicker-wrapper:has(:focus) > .air-datepicker.-inline-,
.birth-input ~ .air-datepicker-wrapper:has(:active) > .air-datepicker.-inline-,
.birth-input ~ .air-datepicker-wrapper:has(:hover) > .air-datepicker.-inline- {
    pointer-events: all !important;
    opacity: 1 !important;
}

.air-datepicker-wrapper {
    position: absolute !important;
    bottom: 90% !important;
}

.air-datepicker {
    min-width: min(350px, 80vw) !important;
    min-height: min(350px, 80vw) !important;
    font-size: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background: var(--denipol-darkblue) !important;
    border-radius: 0 !important;
    color: #fff !important;
    width: fit-content !important;
    height: fit-content !important;
    border: none !important;
}

.appointment-personal-info-modal .air-datepicker.-inline- {
    min-width: 325px !important;
    min-height: 325px !important;
    pointer-events: none !important;
    opacity: 0 !important;
    position: fixed !important;
    transform: translateY(-100%) !important;
    padding-right: 60px !important;
}

.air-datepicker * {
    border-radius: 0 !important;
}

.air-datepicker-nav {
    border: none;
}

.air-datepicker-cell:not(.appointment-personal-info-modal .air-datepicker-cell) {
    margin: 5px
}

.air-datepicker-cell {
    font-size: 12px !important;
    padding: 10px !important;
    font-family: Raleway !important;
}

.air-datepicker-body--cells.-days- {
    grid-auto-rows: unset !important;
}

.air-datepicker-cell.-day-,
.air-datepicker-body--day-name {
    border-radius: 100% !important;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
    height: 36px !important;
    width: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-transform: unset !important;
}

.air-datepicker-cell.-current-,
.air-datepicker-body--day-name {
    color: #fff !important;
}


/* Datepicker */

.jsCalendar-wrapper {
    width: fit-content !important;
}

.jsCalendar-datepicker-wrappper {
    background-color: var(--denipol-foreground-secondary) !important;
    box-shadow: 0 3px 10px 0 rgba(0, 0, 0, .25) !important;
    transform: translateY(-100px) !important;
    transition-duration: 250ms, 250ms !important;
    transition-property: opacity, transform, display !important;
    transition-timing-function: ease-out, var(--ease-circ) !important;
    transition-behavior: allow-discrete !important;
    opacity: 0 !important;
    top: 0;
}

.jsCalendar-datepicker-wrappper[data-band] {
    padding-right: 60px !important;
    transform: translateX(-30px) translateY(-100px) !important;
}

.jsCalendar-datepicker-wrappper[style*="display: block"] {
    transform: translateY(0) !important;
    opacity: 1 !important;
}

.jsCalendar-datepicker-wrappper[style*="display: block"][data-band] {
    transform: translateX(-30px) translateY(0) !important;
}

@starting-style{
    .jsCalendar-datepicker-wrappper[style*='display: block'] {
        transform: translateY(-100px) !important;
        opacity: 0 !important;
    }

    .jsCalendar-datepicker-wrappper[style*="display: block"][data-band] {
        transform: translateX(-30px) translateY(-100px) !important;
        opacity: 0 !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 > *.disabled {
    background-color: var(--denipol-turquoise) !important;
    pointer-events: none !important;
    transform: scale(.95) !important;
    filter: grayscale(.9) brightness(.9) !important;
}

.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-Jg90UW_.svg");
    overflow: visible;
}

.slider-navigator > .next-button:before {
    background-image: url("../img/icon/arrow-right-LJL8N26.svg");
    overflow: visible;
}


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

.hospital-icon {
    position: relative;
    display: flex;
}

.hospital-icon:before {
    display: block;
    position: absolute;
    pointer-events: none;
    /*content: "";*/
    bottom: 0;
    right: 0;
    width: 10%;
    max-width: 100px;
    min-width: 75px;
    height: 10%;
    max-height: 100px;
    min-height: 75px;
    z-index: 1;
    background-image: url("../img/icon/healthcare-hospital-HUdyTwl.svg");
    background-size: contain;
    background-position: 100% 0;
    background-repeat: no-repeat;
}

.hospital-icon.left:before {
    background-image: url("../img/icon/healthcare-hospital-light-l4L8AYz.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);
    word-break: break-word;
    max-width: 60vw;
}

.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 {
    width: 100%;
}

.embla__viewport {
    overflow: hidden;
}

.embla__container {
    display: flex;
    touch-action: pan-y pinch-zoom;
}


/*------------------------------------*\
  # 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: 2px;
    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-Jg90UW_.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/m3MydnTbtOKIjtz6dvhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+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-q8dhnCi.svg") !important;
    background-color: var(--denipol-turquoise) !important;
}


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

.list,
.section-content ul,
p ul,
body > ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.list li:before,
.section-content ul li:before,
p ul li:before,
body > ul 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);
    width: 425px;
    max-width: calc(100vw - var(--header-width) * 2);
    border-bottom: 1px solid var(--denipol-gray);
    font-size: .9rem;
    color: var(--denipol-darkblue);
    padding-bottom: 10px;
    line-height: 1;
    display: flex;
    align-items: end;
}

.header-search-wrapper .select-menu {
    margin-top: 10px;
}

.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;
    padding-left: 20px;
    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,
.contact-form button,
.appointment-modal-wrapper .button,
.appointment-modal-wrapper .cancel-appointment-button,
.e-results-modal .button,
.sidebar-item,
.submit-button {
    transition: 250ms background-color;
}

.slider-navigator > *,
.intro-route-link svg,
body > .media a img,
.footer-media a img,
.header-menu-button .icon,
.intro-img-buttons a img,
.header-right-button img,
.carousel-slider-back-container,
.appointment-modal-wrapper .button span,
.appointment-modal-wrapper .cancel-appointment-button span,
.e-results-modal .button span,
.contact-form button span,
.dsg-button img,
.list-item-buttons > * {
    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,
.header-menu-button:hover .icon,
.intro-img-buttons a:hover img,
.header-right-button:hover img,
.dsg-button:hover img,
.list-item-buttons > *:hover {
    transform: scale(1.15);
}

body > .media a:hover img,
.footer-media a:hover img {
    transform: scale(1.1);
}

.appointment-modal-wrapper .button:hover span,
.appointment-modal-wrapper .cancel-appointment-button:hover span,
.e-results-modal .button:hover span,
.section-contact button:hover span,
.contact-form button:hover span {
    transform: scale(1.05);
}

.slider-navigator > *:active,
.intro-route-link:active svg,
body > .media a:active img,
.footer-media a:active img,
.header-menu-button:active .icon,
.intro-img-buttons a:active img,
.header-right-button:active img,
.appointment-modal-wrapper .button:active span,
.appointment-modal-wrapper .cancel-appointment-button:active span,
.e-results-modal .button:active span,
.section-contact button:active span,
.contact-form button:active span,
.dsg-button:active img,
.list-item-buttons > *:active {
    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,
.contact-form button:hover,
.appointment-modal-wrapper .button:hover,
.e-results-modal .button:hover,
.appointment-modal-wrapper .cancel-appointment-button:hover,
.submit-button:hover {
    background-color: var(--denipol-red-hover) !important;
}

.sidebar-item:hover {
    background-color: var(--denipol-foreground-secondary-hover) !important;
}

.footer-department li:hover a {
    color: var(--denipol-blue-hover);
}

.attachment-link:hover {
    color: var(--denipol-darkblue-hover);
}

.footer-router > ul li:hover a {
    color: var(--denipol-lightblue-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 .sub-menu li,
.text-container-link,
.intro-attachment-link span,
.attachment-link 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,
.ce-popover-item .ce-popover-item__title,
.sidebar-sub-menu li a {
    position: relative;
    display: block;
    transition-duration: 500ms;
    transition-property: transform, background-color, padding, margin;
    transition-timing-function: var(--ease-elastic);
}

.footer-router > ul li:has(a):hover,
.footer-department li:hover,
.header-menu-item.active .sub-menu li:hover,
.text-container-link:hover,
.intro-attachment-link:hover span,
.attachment-link:hover span,
.blog-item-wrapper:hover .more span,
.section-treatment-methods .text-title span,
.select-menu li:hover span,
.partner-item-wrapper:hover span,
.header-search-wrapper li a:hover,
.ce-popover-item:hover .ce-popover-item__title,
.sidebar-sub-menu li:hover a {
    transform: translateX(20px);
}

.footer-router > ul li:has(a):hover:before,
.footer-department li:hover:before,
.header-menu-item.active .sub-menu li:hover:before,
.text-container-link:hover:before,
.intro-attachment-link:hover span:before,
.attachment-link:hover span:before,
.blog-item-wrapper:hover .more span:before,
.section-treatment-methods .text-title span:before,
.select-menu li:hover span:before,
.partner-item-wrapper:hover span:before,
.header-search-wrapper li a:hover:before,
.ce-popover-item:hover .ce-popover-item__title:before,
.sidebar-sub-menu li:hover a:before,
.choosen-doctor-info:before {
    content: "";
    position: absolute;
    display: block;
    top: 50%;
    left: -20px;
    width: 20px;
    height: 20px;
    background-image: url("../img/icon/chevron-down-7XKWpX3.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 100ms !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;
}


/* Loading */

@keyframes loading {
    from {
        transform: translateX(-200%) rotate(15deg);
    }
    to {
        transform: translateX(800%) rotate(15deg);
    }
}

.loading {
    position: relative;
    overflow: hidden;
}

.loading:after {
    content: "";
    position: absolute;
    width: 20%;
    height: 400%;
    left: 0;
    top: -150%;
    background-image: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, .50) 50%, transparent 100%);
    animation: loading 1.25s infinite;
    z-index: 2;
}

.loading:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, .25);
    z-index: 1
}

@keyframes loading-content {
    0% {
        opacity: .75;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: .75;
    }
}

.loading-content {
    background-color: lightgray !important;
    color: lightgray !important;
    border-radius: 7px !important;
    animation: loading-content 1.5s ease-in-out infinite !important;
    text-decoration-color: lightgray !important;
}