/* ==================== 
1. resets & defaults
2. base styles
3. layout
4. components
5. content by pages
==================== */


:root{
	--font-family: '63Fonts', sans-serif;
	--bs-font-sans-serif: var(--font-family);

	--bs-body-bg: #fff;
	--bs-body-bg-rgb: 255, 255, 255;

	--bs-body-color: #10102D;
	--bs-secondary-color: #626f86;
	--bs-tertiary-color: #B3C0D0;

    --bs-heading-color: #10102D;

	--bs-primary-rgb: 235,204,207;
	--bs-primary: #EBCCCF;
	/*--bs-primary-dark: #122148;*/

    --bs-secondary-rgb: 235,204,207;
    --bs-secondary: rgba(var(--bs-secondary-rgb),0.2);

	--bs-success-rgb: 34,77,68;
	--bs-success: #224d44;

	--bs-danger-rgb: 174,42,25;
	--bs-danger: #ae2a19;

    --bs-info-rgb: 235,204,207;
    --bs-info: #EBCCCF;

    --bs-light-rgb: 241,242,244;
	--bs-light: #f1f2f4;
    /*--bs-light-subtle-rgb: 247,248,249;*/
    --bs-light-bg-subtle: #f7f8f9;

	--bs-dark-rgb: 16,16,45;
	--bs-dark: #10102D;


	--btn-primary: #10102D;
	--btn-primary-hover: #14145A;
	--btn-primary-active: #1C1C80;

	--btn-secondary: rgba(var(--bs-primary-rgb), 0.3);
	--btn-secondary-hover: rgba(var(--bs-primary-rgb), 0.5);
	--btn-secondary-active: rgba(var(--bs-primary-rgb), 0.7);

    --btn-info: #DDDDEC;
    --btn-info-hover: #C6C6DF;
    --btn-info-active: #B0B0D3;

	--btn-default-color: #10102D;
	--btn-disabled-color: #C6C6C6;
	--btn-disabled-bg: #F6F6F6;

	--bs-border-color: #091e4224;
	--bs-border-color-translucent: rgba(9, 30, 66, 0.14);

    --bs-link-color-rgb: 16,16,45;
    --bs-link-color: #10102D;

	--app-sidebar-color: #10102D;


	--app-header-height: 64px;

	--content-px: 16px;

    --section-px: 0;
	--section-py: 3rem;

	--container-size-1: 400px;
	--container-size-2: 640px;
	--container-size-3: 860px;
	--container-size-4: 1200px;
	--container-size-5: 1340px;
	--container-size-6: 1920px;


    --fs-display1: 4.5rem;
    --fs-display2: 4rem;
    --fs-display3: 3.5rem;
    --fs-display4: 3rem;
    --fs-display5: 2.25rem;
    --fs-display6: 2rem;

    --fs-h1: 2rem;
    --fs-h2: 1.75rem;
    --fs-h3: 1.5rem;
    --fs-h4: 1.375rem;
    --fs-h5: 1.25rem;
    --fs-h6: 1.125rem;

	--fs-text: var(--fs-text3);
	--fs-text1: 1.25rem;
	--fs-text2: 1.125rem;
	--fs-text3: 1rem;
	--fs-text4: 14px;
	--fs-text5: 13px;
	--fs-text6: 12px;

    --icon-size-2xs: 14px;
    --icon-size-xs: 16px;
    --icon-size-sm: 18px;
    --icon-size-md: 20px;
    --icon-size-lg: 24px;
    --icon-size-xl: 32px;
    --icon-size-2xl: 36px;
    --icon-size-3xl: 48px;


    --form-element-size-1: 34px;
    --form-element-size-2: 40px;
    --form-element-size-3: 48px;
    --form-element-size-4: 56px;

    --form-control-height: var(--form-element-size-4);
    --form-control-px: 1rem;
    --form-control-py: .375rem;

    --bs-form-invalid-color: var(--bs-danger);
    --bs-form-invalid-border-color: #e34935;

    --bs-border-radius: var(--border-radius-md);
    --border-radius-sm: 0.25rem;
    --border-radius-md: 0.5rem;
    --border-radius-lg: 0.75rem;
}

@media (min-width: 576px) {
	:root{
		--app-header-height: 76px;

		--content-px: 24px;
	}
}
@media (min-width: 992px) {
    :root{
        --fs-display1: 5rem;
        --fs-display2: 4.5rem;
        --fs-display3: 4rem;
        --fs-display4: 3.5rem;
        --fs-display5: 3rem;
        --fs-display6: 2.5rem;

        --fs-h1: 2.5rem;
        --fs-h2: 2rem;
        --fs-h3: 1.75rem;
        --fs-h4: 1.5rem;
    }
}
@media (min-width: 1200px) {
	:root{
		--app-header-height: 92px;

		--section-py: 3.5rem;
	}
}
@media (min-width: 1400px) {
	:root{
		--section-py: 5rem;
	}
}
@media (min-width: 1920px) {
	:root{
		--content-px: 168px;
	}
}



/* ==================== 1. resets & defaults ==================== */
html,body,
h1,h2,h3,h4,h5,h6,
ul,ol,p,figure,
form,fieldset,input,textarea{
	margin: 0;
	padding: 0;
}

header,nav,main,article,section,aside,footer,figure{
	display: block;
}

*{box-sizing: border-box; -webkit-tap-highlight-color: transparent;}

/* ----- */

html,body{
	width: 100%;
	height: 100%;
}

nav ul,.nav ul{list-style: none;}
a img,fieldset{border:0;}

.logo img{display: block;}
.img-container img,
.thumb img,
figure img{
	display: block;
	max-width: 100%;
}

button,
input[type=button],
input[type=submit]{
	cursor: pointer;
	outline: none !important;
}

a,a:hover,a:focus{text-decoration: none;}
a.is-active{cursor: default;}

.cursor-pointer{cursor: pointer !important;}

.disabled{opacity: 0.5; pointer-events: none;}
.disabled-click{pointer-events: none;}

/* ----- */

.no-scroll,
.no-scroll body{
	height: 100% !important;
	overflow: hidden;
}

.item-fade{opacity: 0; visibility: hidden; -webkit-transition: opacity 0.3s linear; transition: opacity 0.3s linear; z-index: -1;}
.item-fade.fade-in{opacity: 1; visibility: visible; z-index: 1;}

/* ----- */

.text-nocase{text-transform: none !important;}

.highlight {background-color: #ffff00;}

b{font-weight: 500}
strong{font-weight: 700}

/* ----- */

body{
	background: #fff;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;

	color: var(--bs-body-color);
	font-size: 14px;
}



/* ==================== 2. base styles ==================== */


/* ----------- fonts ----------- */
body,input,textarea,button{
	font-family: var(--font-family);
}
.text-uppercase{
	font-feature-settings: "case" on;
}
/* ----------- /fonts ----------- */


/* ----------- container ----------- */
.container,
.container-xxs,
.container-xs,
.container-sm,
.container-md,
.container-lg,
.container-fluid{
	width: 100%;
	padding-left: var(--content-px);
	padding-right: var(--content-px);
	margin: 0 auto;
}

.container .container-xxs,
.container .container-xs,
.container .container-sm,
.container .container-md,
.container .container-lg{
	padding-left: 0;
	padding-right: 0;
}

.container,
.container-xl,
.t63-section[data-content-size="xl"] .container{
    max-width: var(--container-size-6);
}
.container .container-xl{
    max-width: var(--container-size-6);
}

.container-xxs,
.t63-section[data-content-size="xxs"] .container{
    max-width: calc(var(--container-size-1) + var(--content-px) * 2);
}
.container .container-xxs{
    max-width: var(--container-size-1);
}

.container-xs,
.t63-section[data-content-size="xs"] .container{
    max-width: calc(var(--container-size-2) + var(--content-px) * 2);
}
.container .container-xs{
    max-width: var(--container-size-2);
}

.container-sm,
.t63-section[data-content-size="sm"] .container{
    max-width: calc(var(--container-size-3) + var(--content-px) * 2);
}
.container .container-sm{
    max-width: var(--container-size-3);
}

.container-md,
.t63-section[data-content-size="md"] .container{
    max-width: calc(var(--container-size-4) + var(--content-px) * 2);
}
.container .container-md{
    max-width: var(--container-size-4);
}

.container-lg,
.t63-section[data-content-size="lg"] .container{
    max-width: calc(var(--container-size-5) + var(--content-px) * 2);
}
.container .container-lg{
    max-width: var(--container-size-5);
}

.container-fluid,
.t63-section[data-content-size="fluid"] .container{
    max-width: 100%;
}
/* ----------- /container ----------- */


/* ----------- row ----------- */
.grid-items-stretch > div{
    display: flex;
    flex-direction: column;
}
.grid-items-stretch > div > *{
    flex-grow: 1;
}
/* ----------- /row ----------- */


/* ----------- spacing ----------- */
.pt-6, .py-6, .p-6{
    padding-top: 4rem !important;
}
.pb-6, .py-6, .p-6{
    padding-bottom: 4rem !important;
}
.ps-6, .px-6, .p-6{
    padding-left: 4rem !important;
}
.pe-6, .px-6, .p-6{
    padding-right: 4rem !important;
}

.pt-7, .py-7, .p-7{
    padding-top: 5rem !important;
}
.pb-7, .py-7, .p-7{
    padding-bottom: 5rem !important;
}
.ps-7, .px-7, .p-7{
    padding-left: 5rem !important;
}
.pe-7, .px-7, .p-7{
    padding-right: 5rem !important;
}

/* margin */
.mt-6, .my-6, .m-6{
    margin-top: 4rem !important;
}
.mb-6, .my-6, .m-6{
    margin-bottom: 4rem !important;
}

.mt-7, .my-7, .m-7{
    margin-top: 5rem !important;
}
.mb-7, .my-7, .m-7{
    margin-bottom: 5rem !important;
}

@media (min-width: 576px) {
    .pt-sm-6, .py-sm-6, .p-sm-6{
        padding-top: 4rem !important;
    }
    .pb-sm-6, .py-sm-6, .p-sm-6{
        padding-bottom: 4rem !important;
    }
    .ps-sm-6, .px-sm-6, .p-sm-6{
        padding-left: 4rem !important;
    }
    .pe-sm-6, .px-sm-6, .p-sm-6{
        padding-right: 4rem !important;
    }

    .pt-sm-7, .py-sm-7, .p-sm-7{
        padding-top: 5rem !important;
    }
    .pb-sm-7, .py-sm-7, .p-sm-7{
        padding-bottom: 5rem !important;
    }
    .ps-sm-7, .px-sm-7, .p-sm-7{
        padding-left: 5rem !important;
    }
    .pe-sm-7, .px-sm-7, .p-sm-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-sm-6, .my-sm-6, .m-sm-6{
        margin-top: 4rem !important;
    }
    .mb-sm-6, .my-sm-6, .m-sm-6{
        margin-bottom: 4rem !important;
    }

    .mt-sm-7, .my-sm-7, .m-sm-7{
        margin-top: 5rem !important;
    }
    .mb-sm-7, .my-sm-7, .m-sm-7{
        margin-bottom: 5rem !important;
    }
}
@media (min-width: 768px) {
    .pt-md-6, .py-md-6, .p-md-6{
        padding-top: 4rem !important;
    }
    .pb-md-6, .py-md-6, .p-md-6{
        padding-bottom: 4rem !important;
    }
    .ps-md-6, .px-md-6, .p-md-6{
        padding-left: 4rem !important;
    }
    .pe-md-6, .px-md-6, .p-md-6{
        padding-right: 4rem !important;
    }

    .pt-md-7, .py-md-7, .p-md-7{
        padding-top: 5rem !important;
    }
    .pb-md-7, .py-md-7, .p-md-7{
        padding-bottom: 5rem !important;
    }
    .ps-md-7, .px-md-7, .p-md-7{
        padding-left: 5rem !important;
    }
    .pe-md-7, .px-md-7, .p-md-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-md-6, .my-md-6, .m-md-6{
        margin-top: 4rem !important;
    }
    .mb-md-6, .my-md-6, .m-md-6{
        margin-bottom: 4rem !important;
    }

    .mt-md-7, .my-md-7, .m-md-7{
        margin-top: 5rem !important;
    }
    .mb-md-7, .my-md-7, .m-md-7{
        margin-bottom: 5rem !important;
    }
}
@media (min-width: 992px) {
    .pt-lg-6, .py-lg-6, .p-lg-6{
        padding-top: 4rem !important;
    }
    .pb-lg-6, .py-lg-6, .p-lg-6{
        padding-bottom: 4rem !important;
    }
    .ps-lg-6, .px-lg-6, .p-lg-6{
        padding-left: 4rem !important;
    }
    .pe-lg-6, .px-lg-6, .p-lg-6{
        padding-right: 4rem !important;
    }

    .pt-lg-7, .py-lg-7, .p-lg-7{
        padding-top: 5rem !important;
    }
    .pb-lg-7, .py-lg-7, .p-lg-7{
        padding-bottom: 5rem !important;
    }
    .ps-lg-7, .px-lg-7, .p-lg-7{
        padding-left: 5rem !important;
    }
    .pe-lg-7, .px-lg-7, .p-lg-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-lg-6, .my-lg-6, .m-lg-6{
        margin-top: 4rem !important;
    }
    .mb-lg-6, .my-lg-6, .m-lg-6{
        margin-bottom: 4rem !important;
    }

    .mt-lg-7, .my-lg-7, .m-lg-7{
        margin-top: 5rem !important;
    }
    .mb-lg-7, .my-lg-7, .m-lg-7{
        margin-bottom: 5rem !important;
    }
}
@media (min-width: 1200px) {
    .pt-xl-6, .py-xl-6, .p-xl-6{
        padding-top: 4rem !important;
    }
    .pb-xl-6, .py-xl-6, .p-xl-6{
        padding-bottom: 4rem !important;
    }
    .ps-xl-6, .px-xl-6, .p-xl-6{
        padding-left: 4rem !important;
    }
    .pe-xl-6, .px-xl-6, .p-xl-6{
        padding-right: 4rem !important;
    }

    .pt-xl-7, .py-xl-7, .p-xl-7{
        padding-top: 5rem !important;
    }
    .pb-xl-7, .py-xl-7, .p-xl-7{
        padding-bottom: 5rem !important;
    }
    .ps-xl-7, .px-xl-7, .p-xl-7{
        padding-left: 5rem !important;
    }
    .pe-xl-7, .px-xl-7, .p-xl-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-xl-6, .my-xl-6, .m-xl-6{
        margin-top: 4rem !important;
    }
    .mb-xl-6, .my-xl-6, .m-xl-6{
        margin-bottom: 4rem !important;
    }

    .mt-xl-7, .my-xl-7, .m-xl-7{
        margin-top: 5rem !important;
    }
    .mb-xl-7, .my-xl-7, .m-xl-7{
        margin-bottom: 5rem !important;
    }
}
@media (min-width: 1400px) {
    .pt-xxl-6, .py-xxl-6, .p-xxl-6{
        padding-top: 4rem !important;
    }
    .pb-xxl-6, .py-xxl-6, .p-xxl-6{
        padding-bottom: 4rem !important;
    }
    .ps-xxl-6, .px-xxl-6, .p-xxl-6{
        padding-left: 4rem !important;
    }
    .pe-xxl-6, .px-xxl-6, .p-xxl-6{
        padding-right: 4rem !important;
    }

    .pt-xxl-7, .py-xxl-7, .p-xxl-7{
        padding-top: 5rem !important;
    }
    .pb-xxl-7, .py-xxl-7, .p-xxl-7{
        padding-bottom: 5rem !important;
    }
    .ps-xxl-7, .px-xxl-7, .p-xxl-7{
        padding-left: 5rem !important;
    }
    .pe-xxl-7, .px-xxl-7, .p-xxl-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-xxl-6, .my-xxl-6, .m-xxl-6{
        margin-top: 4rem !important;
    }
    .mb-xxl-6, .my-xxl-6, .m-xxl-6{
        margin-bottom: 4rem !important;
    }

    .mt-xxl-7, .my-xxl-7, .m-xxl-7{
        margin-top: 5rem !important;
    }
    .mb-xxl-7, .my-xxl-7, .m-xxl-7{
        margin-bottom: 5rem !important;
    }
}
@media (min-width: 1920px) {
    .pt-3xl-6, .py-3xl-6, .p-3xl-6{
        padding-top: 4rem !important;
    }
    .pb-3xl-6, .py-3xl-6, .p-3xl-6{
        padding-bottom: 4rem !important;
    }
    .ps-3xl-6, .px-3xl-6, .p-3xl-6{
        padding-left: 4rem !important;
    }
    .pe-3xl-6, .px-3xl-6, .p-3xl-6{
        padding-right: 4rem !important;
    }

    .pt-3xl-7, .py-3xl-7, .p-3xl-7{
        padding-top: 5rem !important;
    }
    .pb-3xl-7, .py-3xl-7, .p-3xl-7{
        padding-bottom: 5rem !important;
    }
    .ps-3xl-7, .px-3xl-7, .p-3xl-7{
        padding-left: 5rem !important;
    }
    .pe-3xl-7, .px-3xl-7, .p-3xl-7{
        padding-right: 5rem !important;
    }

    /* margin */
    .mt-3xl-6, .my-3xl-6, .m-3xl-6{
        margin-top: 4rem !important;
    }
    .mb-3xl-6, .my-3xl-6, .m-3xl-6{
        margin-bottom: 4rem !important;
    }

    .mt-3xl-7, .my-3xl-7, .m-3xl-7{
        margin-top: 5rem !important;
    }
    .mb-3xl-7, .my-3xl-7, .m-3xl-7{
        margin-bottom: 5rem !important;
    }
}
/* ----------- /spacing ----------- */


/* ----------- icons ----------- */
.i-xs{
    width: var(--icon-size-xs) !important;
}
.i-sm{
    width: var(--icon-size-sm) !important;
}
.i-md{
    width: var(--icon-size-md) !important;
}
.i-lg{
    width: var(--icon-size-lg) !important;
}
.i-xl{
    width: var(--icon-size-xl) !important;
}
.i-2xl{
    width: var(--icon-size-2xl) !important;
}
.i-3xl{
    width: var(--icon-size-3xl) !important;
}
/* ----------- /icons ----------- */


/* ----------- rotate ----------- */
.r-0::before{
	transform: rotate(0deg);
}
.r-45::before{
	transform: rotate(45deg);
}
.r-90::before{
	transform: rotate(90deg);
}
.r-180::before{
	transform: rotate(180deg);
}
.r-270::before{
	transform: rotate(270deg);
}
.r-360::before{
	transform: rotate(360deg);
}
/* ----------- /rotate ----------- */


/* ----------- colors ----------- */
.text-white{
	color: #fff !important;
}


.text-secondary{
    color: var(--bs-secondary-color) !important;
}
.text-muted {
    color: rgba(var(--bs-black-rgb),0.4) !important;
}

.bg-secondary{
    --bs-bg-opacity: 0.2;
}


hr{
	border-top-color: var(--bs-border-color);
	opacity: 1;
}

.border-hover{
    transition: border-color 0.2s cubic-bezier(.4,0,.2,1);
}
.border-hover:hover{
    border-color: #000 !important;
}
/* ----------- /colors ----------- */


/* ----------- multiline truncate ----------- */
.line-clamp-1,
.line-clamp-2,
.line-clamp-3,
.line-clamp-4,
.line-clamp-5{
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}
.line-clamp-1{
    -webkit-line-clamp:1;
}
.line-clamp-2{
    -webkit-line-clamp: 2;
}
.line-clamp-3{
    -webkit-line-clamp: 3;
}
.line-clamp-4{
    -webkit-line-clamp: 4;
}
.line-clamp-5{
    -webkit-line-clamp: 5;
}
/* ----------- /multiline truncate ----------- */


/* ==================== 3. layout ==================== */


.app{
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 100%;
	padding-top: var(--app-header-height);
}

/* logo */
.app-logo-wrap{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 118px;
	height: 100%;
	background-color: var(--bs-dark);
}
.app-logo-wrap img{
	display: block;
	width: 100%;
	max-width: 72px;
}

/* lang */
.app-lang-wrap{
	font-feature-settings: "case" on;
	text-transform: uppercase;
}
.app-lang-wrap .btn[data-bs-toggle="dropdown"]{
	--bs-btn-padding-x: 0.75rem;
	--bs-btn-padding-y: 0.5rem;
}
.app-lang-wrap .dropdown-menu{
	min-width: 70px;
}

@media (min-width: 576px) {
	.app-logo-wrap{
		width: 140px;
	}
	.app-logo-wrap img{
		max-width: 90px;
	}
}
@media (min-width: 1200px) {
	.app-logo-wrap{
		width: 168px;
	}
	.app-logo-wrap img{
		max-width: 101px;
	}
}


/* ---------- header ---------- */
.app-header{
	width: 100%;
	height: var(--app-header-height);
	background-color: #fff;
	padding-right: 1.5rem;

	position: fixed;
	top: 0;
	left: 0;
	z-index: 300;
}

.app-header{
	display: flex;
	justify-content: space-between;
}
.app-header > div{
	display: flex;
	align-items: center;
}

.app-header .btn{
	--bs-btn-padding-x: 1.25rem;
	--bs-btn-padding-y: 0.375rem;
	--btn-size: var(--form-element-size-2);
	--bs-btn-font-size: 14px;
}

/* hamburger */
.app-header .btn-hamburger{
	background-color: transparent;
	border: none;
	padding: 0;
}

/* --- left --- */
.app-header .col-left{
	gap: 2.25rem;
}

/* nav */
.app-header .nav{
	transition: opacity 0.15s ease-in-out;
}
.app-header .nav > ul{
	list-style: none;
	display: flex;
	gap: 5px;
}
.app-header .nav .btn{
	--bs-btn-padding-x: 10px;
	--bs-btn-color: var(--btn-default-color);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: var(--btn-default-color);
	--bs-btn-hover-bg: var(--btn-secondary);
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: var(--btn-default-color);
	--bs-btn-active-bg: var(--btn-secondary-hover);
	--bs-btn-active-border-color: transparent;
	--bs-btn-disabled-color: var(--btn-disabled-color);
	--bs-btn-disabled-bg: var(--btn-disabled-bg);
	--bs-btn-disabled-border-color: var(--btn-disabled-bg);
}

/* --- right --- */
.app-header .col-right{
	gap: 1rem;
}

/* search */
.app-header .search-wrap{
	position: relative;
}
.app-header .search-wrap .btn{
	padding: 0;
}
.app-header .search-container{
	--search-container-width: 440px;

	width: 0;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	top: -8px;
	right: 0;

	transition: width 0.5s cubic-bezier(.4,0,.2,1), opacity 0.5s cubic-bezier(.4,0,.2,1);
}
.app-header .search-container .search-box{
	width: var(--search-container-width);
}
.app-header .search-container .search-box label{
	font-size: 14px;
}

.app-search-is-visible .app-header .nav{
	opacity: 0;
}
.app-search-is-visible .app-header .search-container{
	width: var(--search-container-width);
	opacity: 1;
}

.app-header .search-results-wrap{
	width: auto;
	border-radius: 0;
	margin: 10px 4px 4px;
	position: relative;
	top: 0;
}


@media (min-width: 992px) {

}
@media (min-width: 1200px) {
    .app-header .col-right .btn-hamburger{
        display: none !important;
    }

	.app-header {
		padding-right: 2rem;
	}

    .app-header .search-container{
        --search-container-width: 500px
    }
}

@media (max-width: 1199px) {
	.app-header .col-left .nav,
    .app-header .col-left .btn-hamburger{
		display: none !important;
	}
}
@media (max-width: 991px) {
	.app-header .col-left .nav,
	.app-header .app-lang-wrap,
    .app-header .search-wrap,
    .app-header .order-btn{
		display: none !important;
	}
}
/* ---------- /header ---------- */


/* ---------- sidebar ---------- */
.app-sidebar-modal .modal-dialog{
	--bs-modal-width: 100%;
	--modal-padding-x: 1rem;
	--modal-padding-y: 1.5rem;
	--bs-modal-margin: 0;
	--bs-modal-border-radius: 0;

	--modal-dialog-translateX: 100%;

	display: flex;
	height: 100%;
}
.app-sidebar-modal.modal .modal-dialog{
	margin-right: 0;
}
.app-sidebar-modal.modal.fade .modal-dialog{
	transition: transform .4s cubic-bezier(.4,0,.2,1);
	transform: translate(var(--modal-dialog-translateX), 0);
}
.app-sidebar-modal.modal.show .modal-dialog{
	transform: translateX(0);
}

.app-sidebar-modal .modal-content{
	border: none;
	padding: 0 var(--modal-padding-x) var(--modal-padding-y);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.app-sidebar-modal .modal-header,
.app-sidebar-modal .modal-body,
.app-sidebar-modal .modal-footer{
	border: none;
	padding: 0;
}

/* head */
.app-sidebar-modal .modal-header,
.app-sidebar-modal .logo-wrap{
	height: var(--app-header-height);
}
.app-sidebar-modal .modal-header{
	justify-content: flex-end;
	gap: 0.5rem;
}
.app-sidebar-modal .app-logo-wrap {
	height: var(--app-header-height);
	position: absolute;
	top: 0;
	left: 0;
}
.modal.app-sidebar-modal .modal-header .modal-close-btn{
	margin: auto 0;
}
.modal.app-sidebar-modal .modal-header .modal-close-btn img{
	width: 24px;
}

/* body */
.modal.app-sidebar-modal .modal-body{
	padding-top: 1.5rem;
	padding-bottom: 2rem;
}

.app-sidebar-modal .search-container .search-box:after{
    content: "";
    width: 40px;
    height: 100%;
    background: url(../../images/icons/magnifying_glass.svg) center no-repeat;
    background-size: 20px auto;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}
body:not(.app-search-is-open) .app-sidebar-modal .search-container .search-box .btn,
.app-search-is-open .app-sidebar-modal .search-container .search-box:after{
    display: none;
}
.app-sidebar-modal .search-container .search-results-wrap .scrollable-container{
    max-height: calc(100vh - var(--app-header-height) - 180px);
}

.app-sidebar-modal nav button{
	background-color: transparent;
	border: none;
	padding: 0;
}
.app-sidebar-modal nav a,
.app-sidebar-modal nav button{
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	border-bottom: 1px solid var(--bs-border-color);
	padding: 8px 0;
	opacity: 0.8;

	color: var(--app-sidebar-color);
	font-size: 18px;
	font-weight: 300;
	text-align: left;

	transition: opacity .3s cubic-bezier(.4,0,.2,1), padding .3s cubic-bezier(.4,0,.2,1);
}

.app-sidebar-modal nav .i-plus{
	flex-shrink: 0;
	width: 18px;
	fill: var(--app-sidebar-color);
}
.app-sidebar-modal nav .i-plus path:last-child{
	transition: opacity .3s linear;
}
.app-sidebar-modal nav li.is-open .i-plus path:last-child{
	opacity: 0;
}

.app-sidebar-modal nav li li a{
	justify-content: space-between;
	font-size: 12px;
	font-weight: 400;
}
.app-sidebar-modal nav li li a img{
	flex-shrink: 0;
	width: 16px;
}

.app-sidebar-modal nav a:hover,
.app-sidebar-modal nav button:hover{
	opacity: 1;
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

.app-sidebar-modal nav li ul{
	opacity: 0;
	transition: opacity .3s linear;
}
.app-sidebar-modal nav li.is-open ul{
	opacity: 1;
}

/* foo */
.app-sidebar-modal .modal-footer{
	--bs-modal-footer-gap: 0;
	display: block;
}
.app-sidebar-modal .modal-footer ul{
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;

	color: var(--app-sidebar-color);
	font-size: 1rem;
	line-height: 1.25;
}
.app-sidebar-modal .modal-footer li{
	display: flex;
}
.app-sidebar-modal .modal-footer li a{
	color: inherit;
}
.app-sidebar-modal .modal-footer li a:hover{
	text-decoration: underline;
}
.app-sidebar-modal .modal-footer li img{
	width: var(--icon-size-lg);
	margin-right: 0.5rem;
}
.app-sidebar-modal .modal-footer hr{
	margin: 1.5rem 0;
}
.app-sidebar-modal .social-media-btn-row > div{
	display: flex;
}
.app-sidebar-modal .social-media-btn-row img{
	display: block;
	width: 19px;
}


/* show animation */
.app-sidebar-modal nav > ul > li,
.app-sidebar-modal .modal-footer{
	transition: opacity 0.5s cubic-bezier(.4,0,.2,1) 0.4s, transform 0.5s cubic-bezier(.4,0,.2,1) 0.4s;
}
.app-sidebar-modal:not(.show) nav > ul > li{
	opacity: 0;
	transform: translateY(1.25rem);
}
.app-sidebar-modal:not(.show) .modal-footer{
	opacity: 0;
	transform: translateX(-1.25rem);
}

@media (min-width: 768px) {
	.app-sidebar-modal .modal-dialog{
		--bs-modal-width: 60%;
	}
}
@media (min-width: 992px) {
	.app-sidebar-modal .modal-dialog{
		--bs-modal-width: 42%;
	}
}
@media (min-width: 1248px) {
	.app-sidebar-modal .modal-dialog{
		--modal-padding-x: 1.25rem;
		--modal-padding-y: 3rem;

		--modal-dialog-translateX: -100%;
	}

	.app-sidebar-modal.modal .modal-dialog{
		margin-left: 0;
	}
}
@media (min-width: 1440px) {
	.app-sidebar-modal .modal-dialog{
		--modal-padding-x: 5rem;
		--modal-padding-y: 2.5rem;
	}
}
@media (min-width: 1920px) {
	.app-sidebar-modal .modal-dialog{
		--bs-modal-width: 33.333333%;
	}
}
/* ---------- /sidebar ---------- */


/* ---------- page ---------- */
.app-page{
	flex-grow: 1;
	width: 100%;
	position: relative;
}

/* --- page-head --- */
.page-head{
    --page-head-py: 2.5rem;
    position: relative;
}
.page-head .container{
    padding-top: var(--page-head-py);
    padding-bottom: var(--page-head-py);
}

.page-head .text-wrap{
    max-width: 920px;
}

@media (min-width: 768px) {
    .page-head {
        --page-head-py: 4rem;
    }
}
@media (min-width: 992px) {
    .page-head {
        --page-head-py: 4.5rem;
    }
}
@media (min-width: 1200px) {
    .page-head {
        --page-head-py: 5rem;
    }
}

/* image & info wrap */
.page-head > .img-wrap{
    width: 100%;
    overflow: hidden;
}
.page-head > .img-wrap img{
    display: block;
    width: 100%;
    aspect-ratio: 1920 / 500;
    object-fit: cover;
}

.page-head > .img-wrap + .info-wrap{
    --page-head-py: 2.5rem;

    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
}
.page-head > .img-wrap + .info-wrap .container{
    margin: auto;
}

.page-head > .img-wrap + .info-wrap .container{
    display: flex;
    flex-direction: column;
    gap: var(--gap);
}

.page-head > .img-wrap + .info-wrap{
    --i-wrap-size: 56px;
    --title-size: 2.5rem;
    --text-size: 1rem;

    --gap: 0.75rem;
}

.page-head > .img-wrap + .info-wrap .title{
    font-size: var(--title-size);
    line-height: 1;
}
.page-head > .img-wrap + .info-wrap .text-wrap{
    font-size: var(--text-size);
}

.page-head > .img-wrap + .info-wrap .i-wrap{
    display: flex;
    width: var(--i-wrap-size);
    height: var(--i-wrap-size);
    background-color: var(--bs-dark);
    border-radius: calc(var(--i-wrap-size) / 4.8);
}
.page-head > .img-wrap + .info-wrap .i-wrap svg{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.page-head > .img-wrap + .info-wrap .i-wrap svg *{
    fill: #fff;
}

@media (min-width: 992px) {
    .page-head > .img-wrap img{
        aspect-ratio: 1920 / 500;
    }

    .page-head > .img-wrap + .info-wrap{
        --page-head-py: 1.5rem;

        position: absolute;
        top: 0;
        left: 0;
    }
}

@media (max-width: 991px) {
    .page-head > .img-wrap,
    .page-head > .img-wrap img{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
    .page-head > .img-wrap + .info-wrap .text-wrap{
        display: none;
    }
}

/* responsive sizes */
.page-head .info-wrap.responsive-sizes{
    --i-wrap-size: clamp(48px, 7vw, 152px);
    --title-size: clamp(22px, 2.15vw, 48px);
    --text-size: clamp(13px, 1vw, 16px);

    --gap: clamp(12px, 1.15vw, 20px);
}

/* 2col */
.page-head-2col{
    --min-height: 450px;
    --col-gap: 0rem;
    --img-width: 300px;
    --fs-title: 2rem;

    display: flex;
    flex-direction: column;
    gap: var(--col-gap);
}
.page-head-2col .img-col{
    display: flex;
    justify-content: center;
    align-items: flex-end;
    min-height: var(--min-height);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='378' height='420' fill='none' viewBox='0 0 378 420'%3E%3Cg clip-path='url(%23a)' opacity='.4'%3E%3Cg opacity='.42'%3E%3Cmask id='b' width='175' height='1058' x='-145' y='-603' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M29.152-602.09H-144.93V454.224H29.152z'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath fill='%232558A8' d='M29.16-602.09H-2.827S-171.119 126.968-141.414 427.813c0 0 4.678 21.365 5.341 26.411h79.956s-31.986-237.668 0-549.474c22.26-217.003 82.626-450.736 85.296-506.84'/%3E%3C/g%3E%3C/g%3E%3Cg opacity='.42'%3E%3Cmask id='c' width='175' height='1057' x='58' y='-94' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M232.336-93.487H58.234V962.826h174.102z'/%3E%3C/mask%3E%3Cg mask='url(%23c)'%3E%3Cpath fill='%232558A8' d='M58.234 962.826h31.987S258.513 233.768 228.808-67.077c0 0-4.678-21.365-5.322-26.41h-79.955s31.986 237.668 0 549.473c-22.26 217.003-82.626 450.736-85.297 506.84'/%3E%3C/g%3E%3C/g%3E%3Cg opacity='.15'%3E%3Cmask id='d' width='164' height='1058' x='192' y='-109' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M355.355-108.045H192.656V948.269h162.699z'/%3E%3C/mask%3E%3Cg mask='url(%23d)'%3E%3Cpath fill='%232558A8' d='M192.656 948.269h29.433s-5.321-290.489 58.632-594.183c63.972-303.693 74.634-356.514 74.634-462.131H198.679z'/%3E%3C/g%3E%3C/g%3E%3Cg opacity='.15'%3E%3Cmask id='e' width='164' height='1057' x='293' y='-616' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M456.183-615.826H293.484V440.487h162.699z'/%3E%3C/mask%3E%3Cg mask='url(%23e)'%3E%3Cpath fill='%232558A8' d='M293.484 440.487h29.433s-5.321-290.488 58.632-594.182c63.972-303.694 74.634-356.514 74.634-462.131H299.507z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h378v420H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.page-head-2col .img-col figure{
    max-width: var(--img-width);
}
.page-head-2col .img-col figure img{
    width: 100%;
    height: auto;
}

.page-head-2col .info-col{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
.page-head-2col .info-col .title{
    font-size: var(--fs-title);
}
.page-head-2col .info-col .text,
.page-head-2col .info-col .text-wrap{
    color: var(--bs-secondary-color);
    margin-top: 1rem;
}
.page-head-2col .info-col .btn{
    margin-top: 2rem;
}

@media (min-width: 992px) {
    .page-head-2col{
        --img-width: 350px;

        flex-direction: row-reverse;
    }
    .page-head-2col > div{
        width: calc(50% - var(--col-gap) * 0.5);
    }
}
@media (min-width: 1200px) {
    .page-head-2col{
        --fs-title: 2.5rem;
        --col-gap: 4rem;
    }
    .page-head-2col .info-col .btn{
        margin-top: 3rem;
    }
}
@media (min-width: 1400px) {
    .page-head-2col{
        --col-gap: 215px;
    }
}


/* --- section --- */
.section{
    width: 100%;
	padding: var(--section-py) var(--section-px);
    overflow-x: hidden;
}
.section-head{
    max-width: 1584px;
    margin-bottom: 1.5rem;
}
.section.container{
    --section-px: var(--content-px)
}

/* --- article --- */
.media-cover-wrap{
    border-radius: var(--bs-border-radius);
}
.media-cover-wrap img,
.media-cover-wrap video{
    object-fit: cover;
}

.media-cover-wrap.img-ratio{
    --bs-aspect-ratio: 34%;
}
.media-cover-wrap.video-ratio{
    --bs-aspect-ratio: 50%;
}
/* ---------- /page ---------- */


/* ---------- footer ---------- */
.app-footer{
	flex-shrink: 0;
	background-color: var(--bs-dark);

	color: #fff;
	font-size: 14px;
}
.app-footer a{
	color: inherit;
	transition: opacity 0.15s ease-in-out;
}
.app-footer a:hover{
	color: #C3DBF6;
	text-decoration: underline;
}

.app-footer .main-wrap{
	display: flex;
	gap: 1.5rem;
	padding: 2.5rem 0 2rem;
}
.app-footer .main-wrap > div{
	flex-grow: 1;
}

.app-footer .logo{
    display: block;
    max-width: 102px;
	margin-bottom: 1.5rem;
}

.app-footer .social-media-btn-row{
	--bs-gutter-x: 1.5rem;
}
.app-footer .social-media-btn-row > div{
    display: flex;
}
.app-footer .social-media-btn-row img{
    display: block;
    width: 19px;
}

.app-footer .main-wrap .title{
    color: #fff;
	font-size: 1.125rem;
	font-weight: 700;
	margin-bottom: 1rem;
}
.app-footer .main-wrap ul{
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;

    font-size: 1rem;
}

.app-footer .nav-wrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
    border-top: 1px solid #4A6192;
    padding: 1.5rem 0;
}
.app-footer .nav-wrap a{
    color: #C3DBF6;
}


/* bottom bar */
.app-footer .bottom-bar{
	background-color: #0C2246;
    font-size: 13px;
}
.app-footer .bottom-bar .container{
	display: flex;
	align-items: center;
	gap: 12px;
}

.app-footer .createdby{
	display: flex;
	align-items: center;
}
.app-footer .createdby > span{
	margin-right: 10px;
}
.app-footer .createdby img{
	display: block;
	height: 13px;
}

@media (min-width: 576px) {
	.app-footer .bottom-bar .container{
		justify-content: space-between;
		min-height: 52px;
	}
}
@media (min-width: 992px) {
	.app-footer .main-wrap .col-left{
		flex-shrink: 0;
		min-width: 200px;
		max-width: 300px;
	}
	.app-footer .logo{
		margin-bottom: 2.5rem;
	}
	.app-footer .social-media-btn-row{
		--bs-gutter-x: 1rem;
	}
}

@media (max-width: 991px) {
	.app-footer .main-wrap{
		flex-direction: column;
	}
	.app-footer .main-wrap .col-left{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}
@media (max-width: 575px) {
	.app-footer .bottom-bar .container{
		flex-direction: column;
		padding-top: 16px;
		padding-bottom: 16px;
	}
}
/* ---------- /footer ---------- */


/* ---------- floating container ---------- */
.app-floating-container{
    width: 90%;
    background-color: #fff;
    border: 1px solid var(--bs-dark);
    border-radius: 0.5rem;
    padding: 1rem;
    position: fixed;
    bottom: 0.5rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 500;
}
.app-floating-container .row{
    --bs-gutter-x: 0.75rem;
    --bs-gutter-y: 0.75rem;
    align-items: center;
}
@media (min-width: 360px) {
    .app-floating-container {
        width: 75%;
    }
}
@media (min-width: 1400px) {
    .app-floating-container {
        width: 50%;
    }
}
/* ---------- /floating container ---------- */



/* ==================== 4. components ==================== */


/* ----------- hamburger ----------- */
.hamburger,
.hamburger span,
.hamburger span::before,
.hamburger span::after{
	width: 18px;
}

.hamburger{
	flex-shrink: 0;
	display: block;
	height: 14px;
	background-color: transparent;
	border: 0;
	padding: 0;
	overflow: visible;
	position: relative;
	z-index: 50;
}
.hamburger:before{
	content: "";
	position: absolute;
	top: -12px;
	bottom: -12px;
	left: -12px;
	right: -12px;
}

.hamburger span,
.hamburger span::before,
.hamburger span::after {
	display: block;
	height: 1px;
	background-color: #000;
	position: absolute;
	transition: transform 0.15s ease;
}
.hamburger span{
	top: 0;
}
.hamburger span::before,
.hamburger span::after {
	content: "";
	display: block;
}
.hamburger span::before {
	width: 100%;
	top: 6px;
	transition-property: transform, opacity;
}
.hamburger span::after {
	top: 12px;
}

.hamburger.is-active span,
.nav-is-open .hamburger span{
	transform: translate3d(-1px, 7px, 0) rotate(45deg);
}
.hamburger.is-active span::before,
.nav-is-open .hamburger span::before {
	transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
	opacity: 0;
}
.hamburger.is-active span::after,
.nav-is-open .hamburger span::after {
	transform: translate3d(0, -12px, 0) rotate(-90deg);
}
.hamburger.is-active span,
.hamburger.is-active span::before,
.hamburger.is-active span::after,
.nav-is-open .hamburger span,
.nav-is-open .hamburger span::before,
.nav-is-open .hamburger span::after{
	width: 21px;
}
/* ----------- /hamburger ----------- */


/* ---------- title,text ---------- */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.title,
.display-title{
	display: block;
    color: var(--bs-heading-color);
	font-weight: 400;
    margin-bottom: 0;
}

.title *{
	font-weight: inherit;
	line-height: inherit;
}

.title:not(.slide-title):not(.full-featured) *:not(.h1):not(.h2):not(.h3):not(.h4):not(.h5):not(.h6):not([class*="display-"]) {
	font-size: inherit;
}

.title a{
	color: inherit;
}

h1{
	font-size: var(--fs-h1);
}
h2{
	font-size: var(--fs-h2);
}
h3{
	font-size: var(--fs-h3);
}
h4{
	font-size: var(--fs-h4);
}
h5{
	font-size: var(--fs-h5);
}
h6{
	font-size: var(--fs-h6);
}

.h1{
	font-size: var(--fs-h1) !important;
}
.h2{
	font-size: var(--fs-h2) !important;
}
.h3{
	font-size: var(--fs-h3) !important;
}
.h4{
	font-size: var(--fs-h4) !important;
}
.h5{
	font-size: var(--fs-h5) !important;
}
.h6{
	font-size: var(--fs-h6) !important;
}

.display-1{
	font-size: var(--fs-display1) !important;
}
.display-2{
	font-size: var(--fs-display2) !important;
}
.display-3{
	font-size: var(--fs-display3) !important;
}
.display-4{
	font-size: var(--fs-display4) !important;
}
.display-5{
	font-size: var(--fs-display5) !important;
}
.display-6{
	font-size: var(--fs-display6) !important;
}

.display-title{
	font-size: var(--fs-display5);
	font-weight: 300;
	line-height: 1.165;
}

.bg-dark .title,
.bg-dark .display-title,
.bg-dark .text,
.bg-dark .text-wrap{
	color: #fff;
}

.text,
.text-wrap{
	color: #000;
	font-size: var(--fs-text);
	font-weight: 400;
}

.fs-1{
	font-size: var(--fs-text1) !important;
}
.fs-2{
	font-size: var(--fs-text2) !important;
}
.fs-3{
	font-size: var(--fs-text3) !important;
}
.fs-4{
	font-size: var(--fs-text4) !important;
}
.fs-5{
	font-size: var(--fs-text5) !important;
}
.fs-6{
	font-size: var(--fs-text6) !important;
}

html{
	font-size: 14px;
}

@media (min-width: 768px){
	html{
		font-size: 16px;
	}
}

.text-wrap:before,
.text-wrap:after {
	display: table;
	content: " ";
}
.text-wrap:after{
	clear:both;
}

.text-wrap > *{margin-bottom:1.5rem;}
.text-wrap > *:last-child{margin-bottom:0;}
.text-wrap ul,.text-wrap ol{padding-left:20px;}
.text-wrap li + li,.text-wrap li ul,.text-wrap li ol{margin-top:4px;}

.text-wrap img{
	max-width: 100%;
	height: auto;
	border-radius: var(--border-radius-lg);
	margin-bottom: 5px;
}
.text-wrap img[style*="float: left"]{
	margin-right: 15px;
}
.text-wrap img[style*="float: right"]{
	margin-left: 15px;
}

.text-wrap hr{
	margin: 35px 0;
}
.text-wrap hr + img,
.text-wrap hr + * img{
	margin-top: 8px;
}

.link,
.link:hover,
.text-wrap a:not(.btn),
.text-wrap a:not(.btn):hover{
	color: #1818BF;
}
.link,
.text-wrap a:not(.btn){
	text-decoration: underline;
}
.link:hover,
.text-wrap a:not(.btn):hover{
	text-decoration: none;
}

button.link{
	background: none;
	border: 0;
	padding: 0;
}

.text-wrap audio,
.text-wrap video{
	display: block;
	width: 100%;
	outline: none;
}
.text-wrap video{
	height: auto;
}

.text-wrap iframe{
	display: block;
	max-width: 100%;
}

.text-wrap table {
	width: 100%;
	border: 1px solid #dee2e6;
	color: inherit;
}
.text-wrap table th,
.text-wrap table td {
	border: 1px solid #dee2e6;
	padding: 0.75rem;
	vertical-align: top;
}
.text-wrap table thead th {
	border-bottom: 2px solid #dee2e6;
	vertical-align: bottom;
}
.text-wrap table tbody + tbody {
	border-top: 2px solid #dee2e6;
}

.text-wrap .table-plain {
	border: 0;
}
.text-wrap .table-plain th,
.text-wrap .table-plain td {
	border: 0;
	border-top: 1px solid #dee2e6;
}
/* ---------- /title,text ---------- */


/* ---------- buttons ---------- */
.btn{
	--bs-btn-padding-x: 1.5rem;
	--bs-btn-padding-y: 0.5rem;
	--bs-btn-font-family: var(--font-family);
	--bs-btn-font-size: 1rem;
	--bs-btn-font-weight: 400;
	--bs-btn-line-height: 1.5;
	--bs-btn-border-radius: 0.375rem;
	--bs-btn-box-shadow: none;
	--bs-btn-disabled-opacity: 1;
    --bs-btn-active-border-color: transparent;
	--bs-btn-focus-box-shadow: none;
	--bs-btn-color: var(--btn-default-color);

	--btn-size: var(--form-element-size-3);

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: var(--btn-size);
	min-height: var(--btn-size);
}
/*.btn:active {
	box-shadow: var(--bs-btn-focus-box-shadow);
}*/

.btn-sm{
	--bs-btn-padding-x: 1rem;
	--bs-btn-padding-y: 0.375rem;
	--btn-size: var(--form-element-size-2);
	--bs-btn-font-size: 14px;
}
.btn-lg{
	--bs-btn-padding-x: 1.5rem;
	--bs-btn-padding-y: 0.75rem;
	--btn-size: var(--form-element-size-4);
}


/* white */
.btn-white{
	background-color: rgba(255,255,255,0.5);
	border-color: rgba(255,255,255,0.5);
}
.btn-white:hover{
	background-color: rgba(255,255,255,0.7);
}
.btn.btn-outline-white{
	border-color: #fff;
	color: #fff !important;
}
.btn.btn-outline-white:hover{
	background-color: #fff;
	border-color: #fff;
}

/* primary */
.btn-primary {
	--bs-btn-color: var(--bs-primary);
	--bs-btn-bg: var(--btn-primary);
	--bs-btn-border-color: var(--btn-primary);
	--bs-btn-hover-color: var(--bs-primary);
	--bs-btn-hover-bg: var(--btn-primary-hover);
	--bs-btn-hover-border-color: var(--btn-primary-hover);
	--bs-btn-active-color: var(--bs-primary);
	--bs-btn-active-bg: var(--btn-primary-active);
	--bs-btn-active-border-color: var(--btn-primary-active);
	--bs-btn-disabled-color: var(--btn-disabled-color);
	--bs-btn-disabled-bg: var(--btn-disabled-bg);
	--bs-btn-disabled-border-color: var(--btn-disabled-bg);
}
/*.btn-outline-primary{
	--bs-btn-color: var(--btn-primary);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: var(--btn-primary);
	--bs-btn-hover-color: var(--btn-primary);
	--bs-btn-hover-bg: rgba(var(--bs-primary-rgb),0.05);
	--bs-btn-hover-border-color: var(--btn-primary-hover);
	--bs-btn-active-color: var(--btn-primary);
	--bs-btn-active-bg: rgba(var(--bs-primary-rgb),0.09);
	--bs-btn-active-border-color: var(--btn-primary-active);
	--bs-btn-disabled-color: var(--btn-disabled-color);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--btn-disabled-bg);
}*/

/* secondary */
.btn-secondary {
	--bs-btn-color: var(--btn-default-color);
	--bs-btn-bg: var(--btn-secondary);
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: var(--btn-default-color);
	--bs-btn-hover-bg: var(--btn-secondary-hover);
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: var(--btn-default-color);
	--bs-btn-active-bg: var(--btn-secondary-active);
	--bs-btn-active-border-color: transparent;
	--bs-btn-disabled-color: var(--btn-disabled-color);
	--bs-btn-disabled-bg: var(--btn-disabled-bg);
	--bs-btn-disabled-border-color: var(--btn-disabled-bg);
}
/*.btn-outline-secondary{
	--bs-btn-color: var(--btn-default-color);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: var(--btn-secondary);
	--bs-btn-hover-color: var(--btn-default-color);
	--bs-btn-hover-bg: rgba(var(--bs-secondary-rgb),0.75);
	--bs-btn-hover-border-color: var(--btn-secondary-hover);
	--bs-btn-active-color: var(--btn-default-color);
	--bs-btn-active-bg: rgba(var(--bs-secondary-rgb),0.9);
	--bs-btn-active-border-color: var(--btn-secondary-active);
	--bs-btn-disabled-color: var(--btn-disabled-color);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--btn-disabled-bg);
}*/

/* info */
.btn-info {
    --bs-btn-color: var(--btn-default-color);
    --bs-btn-bg: var(--btn-info);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--btn-default-color);
    --bs-btn-hover-bg: var(--btn-info-hover);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: var(--btn-default-color);
    --bs-btn-active-bg: var(--btn-info-active);
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: var(--btn-disabled-color);
    --bs-btn-disabled-bg: var(--btn-disabled-bg);
    --bs-btn-disabled-border-color: var(--btn-disabled-bg);
}


/* is loading */
.btn.is-loading{
	background-image: url("../../images/icons/spinner_notch.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 24px auto;
	pointer-events: none;
}
.btn.is-loading > *{
	opacity: 0;
}

/* btn-row */
/*.app-page .btn-row{
	margin: 20px 0;
}
.app-page .btn-row:last-child{
	margin-bottom: 0;
}
.app-page .btn-row > div{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	padding-left: -6px;
	padding-right: -6px;
}
.app-page .btn-row > div .btn{
	margin: 6px;
}*/
/* ---------- /buttons ---------- */


/* ---------- pagination ---------- */
.pagination{
    --bs-pagination-padding-x: 0.25rem;
    --bs-pagination-padding-y: 0.25rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--btn-default-color);
    --bs-pagination-bg: transparent;
    --bs-pagination-border-width: 0;
    --bs-pagination-border-color: transparent;
    --bs-pagination-border-radius: var(--border-radius-sm);
    --bs-pagination-hover-color: var(--btn-default-color);
    --bs-pagination-hover-bg: #ECECF5;
    --bs-pagination-hover-border-color: var(--btn-primary);
    --bs-pagination-focus-color: var(--btn-default-color);
    --bs-pagination-focus-bg: transparent;
    --bs-pagination-focus-box-shadow: none;
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: var(--btn-primary);
    --bs-pagination-active-border-color: var(--btn-primary);
    --bs-pagination-disabled-color: var(--btn-disabled-color);
    --bs-pagination-disabled-bg: var(--btn-disabled-bg);
    --bs-pagination-disabled-border-color: var(--btn-disabled-bg);

    --pagination-item-size: var(--form-element-size-2);

    justify-content: center;
    gap: 0.5rem;
    margin: 3rem 0;
}
.pagination .page-item{
    flex-shrink: 0;
}
.pagination .page-link{
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: var(--pagination-item-size);
    height: var(--pagination-item-size);
    border-radius: var(--bs-pagination-border-radius);
}
/* ---------- /pagination ---------- */


/* ---------- form ---------- */
.form-group{
    margin-bottom: 1.25rem;
}

.form-label{
    display: block;
    margin-bottom: 8px;

    color: var(--bs-body-color);
    font-size: 1rem;
    font-weight: 400;
}

.form-control,
.form-select,
.virtual-select .vscomp-toggle-button{
    height: var(--form-control-height);
    border-radius: var(--bs-border-radius);
    padding: var(--form-control-py) var(--form-control-px);

    font-family: var(--font-family);
    font-size: 1rem;
}

.form-control,
.form-control:focus,
.form-select,
.form-select:focus,
.virtual-select .vscomp-toggle-button,
.desktop .virtual-select .vscomp-wrapper:hover .vscomp-toggle-button,
.virtual-select .vscomp-wrapper.focused .vscomp-toggle-button,
.virtual-select.pop-comp-active .vscomp-wrapper:focus .vscomp-toggle-button{
    box-shadow: none !important;

    color: var(--bs-body-color);
    caret-color: var(--bs-dark);
}

.form-control:focus,
.form-select:focus,
.virtual-select .vscomp-wrapper.focused .vscomp-toggle-button,
.virtual-select.pop-comp-active .vscomp-wrapper:focus .vscomp-toggle-button{
    border-color: var(--bs-dark);
}

.form-select{
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

textarea.form-control{
    --form-control-height: auto;
}

.form-control::placeholder{
    color: var(--bs-secondary-color);
}

.form-control.border-b,
.form-select.border-b{
    background-color: transparent;
    border-width: 0 0 1px;
    border-radius: 0;
}
.form-control.border-b:focus,
.form-select.border-b:focus{
    background-color: #fff;
}

/* floating label */
.form-floating{
    --label-start-height: 100%;
    --label-end-height: 52%;
}
.form-floating>.form-select,
.form-floating>.form-control{
    height: var(--form-control-height);
    min-height: var(--form-control-height);
    padding-left: var(--form-control-px);
}
.form-floating>label{
    display: flex;
    align-items: center;
    height: var(--label-start-height);
    padding: 0 var(--form-control-px);

    color: var(--bs-secondary-color);
    font-size: 1rem;

    transition: height .15s cubic-bezier(0,0,.2,1), font-size .15s cubic-bezier(0,0,.2,1);
}
.form-floating>.form-control-plaintext:focus,
.form-floating>.form-control-plaintext:not(:placeholder-shown),
.form-floating>.form-control:focus,
.form-floating>.form-control:not(:placeholder-shown) {
    padding-top: 1.375rem;
    padding-bottom: .375rem;
}
.form-floating>.form-control-plaintext~label,
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label {
    height: var(--label-end-height);
    transform: none;
    font-size: 12px;
}

.form-floating > i,
.form-floating > .btn{
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
}

.form-floating > i img,
.form-floating .btn img{
    width: 20px;
}

.form-floating > i{
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--form-element-size-2);
}

.form-floating .btn{
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    --btn-size: var(--form-element-size-2);

}

.form-floating > i ~ input,
.form-floating .btn ~ input{
    padding-right: var(--form-element-size-2);
}

.form-floating textarea~label{
    --label-start-height: 56px;
    --label-end-height: 26px;

    background-color: transparent;
    border-radius: var(--bs-border-radius);
    top: 0;
    left: 0;
    right: 0;
}
.form-floating textarea~label::after,
.form-floating>textarea:focus~label::after,
.form-floating>textarea:not(:placeholder-shown)~label::after{
    height: var(--label-end-height);
    border: 0;
    top: 0;
}
.modal .form-floating textarea.border-b~label::after{
    background-color: var(--bs-modal-bg);
}
.modal .form-floating>textarea.border-b:focus~label::after{
    background-color: #fff;
}

/* checkbox, radio */
.form-check{
    display: inline-flex;
    align-items: flex-start;
    gap: 8px;
    min-height: 1.25rem;
    padding: 0;
    margin: 4px 0;

    color: #000;
    font-size: 1rem;
    line-height: 1.25;
}
.form-check input,
.form-check .form-check-input{
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: -50px center;
    background-size: 1rem auto;
    border-color: var(--bs-border-color);
    margin: 0;
}
.form-check-input:active {
    filter: none;
}
.form-check-input:focus{
    box-shadow: none;
}
.form-check input[type="checkbox"]{
    background-image: url(../../images/icons/tick_white.svg);
    border-radius: .125rem;
}
.form-check input[type="radio"]{
    background-image: url(../../images/icons/radio.svg);
    border-radius: 50%;
}

.form-check input:checked{
    background-position: center;
    border-color: var(--bs-dark);
}
.form-check input[type="checkbox"]:checked{
    background-color: var(--bs-dark);
}
.form-check input[type="radio"]{
    background-color: transparent;
}

/* toggler */
.form-toggler{
	display: inline-flex;
	position: relative;
	overflow: hidden;
	margin: 0;
}
.form-toggler input{
	opacity: 0;
	position: absolute;
	left: -100%;
}
.form-toggler > i{
	flex-shrink: 0;
	display: flex;
	width: 56px;
	height: 32px;
	background-color: #D4D7D9;
	border-radius: 16px;
	position: relative;
	padding: 4px;
}
.form-toggler > i::before{
	content: "";
	display: block;
	width: 24px;
	height: 24px;
	background-color: #fff;
	border-radius: 50%;
	position: relative;
}
.form-toggler > i,
.form-toggler > i::before{
	transition: all 0.3s ease;
}
.form-toggler input:checked + i{
	background-color: var(--bs-dark);
}
.form-toggler input:checked + i::before{
	transform: translateX(24px);
}

.form-toggler > i + span{
	margin: auto 0 auto 12px;
	font-size: 14px;
}
.form-group .form-toggler{
	margin: 9px 0;
}

/* datalist */
.datalist-dropdown{
    position: relative;
}
.datalist-dropdown .form-floating > div{
    display: flex;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}
.datalist-dropdown .btn{
    --btn-size: var(--form-element-size-1);
}
.datalist-dropdown .btn-clear{
    display: none;
}
.datalist-dropdown .btn-clear img{
    width: 14px;
}
.datalist-dropdown.option-is-selected .btn-clear{
    display: block;
}
.datalist-dropdown.option-is-selected .form-floating label{
    color: var(--bs-heading-color);
}

.datalist-dropdown .i-toggle{
    transition: transform 0.15s cubic-bezier(0,0,.2,1);
}
.datalist-dropdown.is-open .i-toggle{
    transform: rotate(180deg);
}

.datalist-dropdown .datalist{
    --bs-dropdown-font-size: 1rem;

    width: 100%;
    margin-top: 10px;
}
/*.datalist-dropdown .datalist > div{
    max-height: 200px;
}*/


/* uploader */
.file-uploader{
    border-bottom: 1px solid var(--bs-border-color);
    padding: 0 1rem 1rem;
    position: relative;
}
.file-uploader > label{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding-top: 1rem;
    position: relative;
    overflow: hidden;
    cursor: pointer;

    font-size: 14px;
}
.file-uploader > label input{
    opacity: 0;
    position: absolute;
    left: -100%;
}
.file-uploader .files-list-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}
.file-uploader .files-list-item:last-child{
    margin-bottom: 0;
}
.file-uploader .files-list-item .btn{
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    --btn-size: auto;

    flex-shrink: 0;
    border: 0;
}
.file-uploader .files-list-item .btn img{
    width: 24px;
}


/* error */
.error-text,
.global-error-text,
.invalid-feedback{
    color: var(--bs-form-invalid-color);
    font-size: 14px;
    line-height: 1.25;
}

.error-text,
.invalid-feedback{
    padding: 0 1rem;
}

.error-text {
    display: none;
}
.global-error-text {
    display: block;
    margin-bottom: 20px;
    text-align: center;
}

.has-error .form-control:not(:focus),
.has-error .form-select:not(:focus){
    border-color: var(--bs-form-invalid-border-color);
}
.has-error .error-text,
.has-error .invalid-feedback{
    display: block;
}

.form-control.is-invalid,
.form-select.is-invalid{
    box-shadow: none !important;
}
/* ---------- /form ---------- */


/* ---------- bg-img ---------- */
.bg-img{
	display: block;
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
.bg-img:not(.ratio)::before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.bg-img--cover{
	background-size: cover;
}
.bg-img--contain{
	background-size: contain;
}
.bg-img.fit-container{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
/* ---------- /bg-img ---------- */


/* ---------- ratio, fit ---------- */
.ratio{
    display: block;
    overflow: hidden;
}
.ratio img,
.ratio video,
.object-fit-cover{
	object-fit: cover;
}
.object-fit-contain{
	object-fit: contain;
}
/* ---------- /ratio, fit ---------- */


/* ---------- scroll ---------- */
/*.os-scrollbar.os-scrollbar-vertical{
	width: 14px !important;
	padding: 8px 4px !important;
}
.os-scrollbar-handle{
	background-color: #D3D3D3 !important;
	border-radius: 4px !important;
}

.desktop .scrollable-container{
	overflow: hidden !important;
}
.mobile .scrollable-container,
.tablet .scrollable-container{
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}

.horizontal-scrollable-container{
	width: 100%;
	overflow: auto;
}*/

.scrollable-container{
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.app-page ::-webkit-scrollbar,
.modal ::-webkit-scrollbar{
    width: 6px;
    height: 6px;
}
.app-page ::-webkit-scrollbar-track,
.modal ::-webkit-scrollbar-track{
    background-color: #f4f4f4;
    border-radius: 99px;
    opacity: .1;
}
.app-page ::-webkit-scrollbar-thumb,
.modal ::-webkit-scrollbar-thumb{
    background: #a4a3a3;
    border-radius: 10px;
}
/* ---------- /scroll ---------- */


/* ---------- item with icon ---------- */
.item-with-icon{
    --iwi-gap: 0.75rem;
    --iwi-color: var(--bs-body-color);
    --iwi-fs: 1rem;
    --iwi-icon-size: 24px;

    display: flex;
    align-items: center;
    gap: var(--iwi-gap);

    color: var(--iwi-color);
    font-size: var(--iwi-fs);
}
.item-with-icon img,
.item-with-icon svg{
    flex-shrink: 0;
    width: var(--iwi-icon-size);
}
.item-with-icon svg{
    height: auto;
}
.item-with-icon svg *{
    fill: var(--iwi-color);
}

.item-with-icon.size-lg{
    --iwi-gap: 12px;
    --iwi-fs: 18px;
    --iwi-icon-size: 24px;

    font-weight: 300;
    line-height: 1.275;
}

@media (min-width: 768px) {
    .item-with-icon.size-lg{
        --iwi-fs: 1.25rem;
    }
}
@media (min-width: 1200px) {
    .item-with-icon.size-lg{
        --iwi-gap: 1rem;
        --iwi-fs: 1.375rem;
        --iwi-icon-size: 32px;
    }
}
/* ---------- /item with icon ---------- */


/* ---------- dropdown ---------- */
.btn[data-bs-toggle="dropdown"]{
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.btn[data-bs-toggle="dropdown"]::after{
    flex-shrink: 0;
    content: "";
    width: 15px;
    height: 15px;
    background: url(../../images/icons/chevron.svg) center no-repeat;
    background-size: 100% auto;
    transition: transform 0.15s cubic-bezier(0,0,.2,1);
}
.btn[data-bs-toggle="dropdown"][aria-expanded="true"]::after{
    transform: rotate(180deg);
}

.dropdown-menu{
    --bs-dropdown-spacer: 0;
    --bs-dropdown-bg: #fff;
    --bs-dropdown-border-color: #DCDFE4;
    --bs-dropdown-border-radius: 6px;
    --bs-dropdown-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
    --bs-dropdown-padding-x: 0.5rem;
    --bs-dropdown-padding-y: 0.5rem;

    --bs-dropdown-item-border-radius: var(--border-radius-sm);
    --bs-dropdown-link-color: var(--btn-default-color);
    --bs-dropdown-link-hover-color: var(--btn-default-color);
    --bs-dropdown-link-hover-bg: var(--btn-secondary);
    --bs-dropdown-link-active-color: var(--btn-default-color);
    --bs-dropdown-link-active-bg: var(--btn-secondary-active);
    --bs-dropdown-item-padding-x: 8px;
    --bs-dropdown-item-padding-y: 6px;
    --bs-dropdown-font-size: 14px;
}
.dropdown-menu ul{
    list-style: none;
}
.dropdown-menu .dropdown-item{
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/*.dropdown-menu.show {
    display: none;
}*/

.dropdown-menu .not-found{
    padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
    color: var(--bs-dropdown-link-color);
    font-size: var(--bs-dropdown-font-size);
}
.dropdown-menu.scrollable-container{
    max-height: 200px;
    padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
}
/* ---------- /dropdown ---------- */


/* ---------- search ---------- */
.search-container,
.search-container .search-box{
	position: relative;
}
/*.search-container .search-box .btn{
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    --btn-size: var(--form-element-size-2);

    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}*/
.search-container.search-is-loading .search-box .btn{
	background-image: url("../../images/icons/spinner_notch.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 24px auto;
	pointer-events: none;
}
.search-container.search-is-loading .search-box .btn > *{
	opacity: 0;
}

.search-container .search-box label{
    max-width: calc(100% - 40px);
    padding-right: 0;
}

.search-results-wrap{
	display: none;
	width: 100%;
	background-color: #fff;
    border-radius: var(--bs-border-radius);
	box-shadow: 0 1px 2px 0 #172b4d0d, 0 0 0 4px #97abd42b;
	margin-top: 10px;
	overflow: hidden;

	position: absolute;
	top: 100%;
	left: 0;
    z-index: 550;
}
.search-results-wrap .scrollable-container{
	max-height: 500px;
	padding: 1.5rem 1rem 1.5rem 1.5rem;
}

.search-results-wrap section + section{
	margin-top: 2rem;
}
.search-results-wrap section > .title{
	margin-bottom: 1rem;
	font-size: 1.125rem;
}

.search-results-item{
	display: flex;
	align-items: center;
	background-color: transparent;
	gap: 0.5rem;
	border-radius: 1rem;
	padding: 1rem 1.25rem;
	transition: background-color 0.5s cubic-bezier(.4,0,.2,1);
}
.search-results-item > div{
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.search-results-item .title{
	color: var(--bs-heading-color);
	font-size: 1.125rem;
}
.search-results-item .text{
	color: var(--bs-secondary-color);
	font-size: 1rem;
}
.search-results-item .i-arrow{
	flex-shrink: 0;
	width: var(--icon-size-md);
	margin-left: auto;
}
.search-results-item .i-wrap{
	display: flex;
	width: 48px;
	height: 48px;
	background-color: var(--bs-dark);
    border-radius: var(--bs-border-radius);
	margin-right: 0.5rem;
}
.search-results-item .i-wrap svg{
	display: block;
	width: 100%;
	height: 100%;
}
.search-results-item .i-wrap svg *{
	fill: #fff;
}

.search-results-item:hover{
	background-color: var(--bs-secondary);
}
/* ---------- search ---------- */


/* ---------- slider ---------- */
.swiper .swiper-slide{
    display: flex;
    flex-direction: column;
    height: auto;
}
.swiper-slide > *{
    flex-grow: 1;
}

.swiper-btn{
    --swiper-btn-size: 48px;
    --swiper-btn-icon-size: 24px;

    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--swiper-btn-size);
    height: var(--swiper-btn-size);
}
.swiper-btn img,
.swiper-btn svg{
    width: var(--swiper-btn-icon-size);
}
.swiper-btn svg{
    height: auto;
}

.swiper .swiper-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
}
.swiper .swiper-btn-prev{
    left: 0;
}
.swiper .swiper-btn-next{
    right: 0;
}

.swiper-button-disabled{
    opacity: .5;
    pointer-events: none;
}

.swiper.carousel{
    --slide-width-sm: 258px;
    --slide-width-md: 266px;
    --slide-width-lg: 70vw;

    --slide-width: var(--slide-width-md);

    overflow: visible;
}
.carousel .swiper-slide{
    width: var(--slide-width);
}
.carousel.items-size-sm .swiper-slide{
    --slide-width: var(--slide-width-sm);
}
.carousel.items-size-lg .swiper-slide{
    --slide-width: var(--slide-width-lg);
}

.carousel-items-stretch .swiper-slide{
    display: flex;
    flex-direction: column;
}
.carousel-items-stretch .swiper-slide > *{
    flex-grow: 1;
}

@media (min-width: 576px) {
    .swiper.carousel {
        --slide-width-sm: 300px;
        --slide-width-md: 378px;
        --slide-width-lg: 402px;
    }
}


/* --- gallery --- */
.swiper.img-carousel{
    --swiper-spacing-left: 0px;
    --bs-aspect-ratio: 60.5%;

    padding-left: var(--swiper-spacing-left);
}

.img-carousel .swiper-btn{
    --swiper-btn-size: 80px;
    --swiper-btn-icon-size: 80px;
}
.img-carousel .swiper-btn svg *{
    stroke: #fff;
}
.img-carousel .swiper-button-disabled{
    opacity: 1;
}
.img-carousel .swiper-button-disabled svg *{
    stroke: #000;
}

.img-carousel .swiper-slide{
    display: block;
}
.img-carousel .swiper-slide figure{
    border-radius: var(--bs-border-radius);
}

@media (min-width: 992px) {
    .swiper.img-carousel{
        --bs-aspect-ratio: 59.41%;
    }
}
@media (min-width: 1200px) {
    .swiper.img-carousel{
        --swiper-spacing-left: 168px;
    }
    .img-carousel .swiper-btn-prev{
        left: calc( (var(--swiper-spacing-left) - var(--swiper-btn-size)) * 0.5);
    }
}
@media (min-width: 1400px) {
    .swiper.img-carousel{
        --swiper-spacing-left: 302px;
    }
}


/* --- animated size --- */
.swiper.carousel.items-scale-animation{
    height: var(--swiper-slide-height, 528px);
}
.swiper.carousel.items-scale-animation .swiper-slide:first-child{
    margin-left: var(--swiper-translate-x, 0);
}
.swiper.carousel.items-scale-animation .swiper-wrapper{
    --swiper-wrapper-transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 0.6s !important;
}
.swiper.carousel.items-scale-animation.transition-duration-0 .swiper-wrapper{
    transition-duration: 0s !important;
}
.swiper.carousel.items-scale-animation .swiper-slide{
    transition: width 0.6s cubic-bezier(.4,0,.2,1) !important;
}

.swiper.carousel.items-scale-animation .swiper-slide.swiper-slide-active{
    width: calc(var(--slide-width) * 2);
}

.swiper.carousel.items-scale-animation .swiper-slide .hide-on-animation{
    transition: opacity 0.3s cubic-bezier(.4,0,.2,1) .3s;
}
.swiper.carousel.items-scale-animation .swiper-slide.swiper-slide-active .hide-on-animation{
    opacity: 0;
    transition-delay: 0s;
}
/* ---------- /slider ---------- */


/* ---------- card ---------- */
/*.card {
    background-color: #f1f1f2;
    border: 0;
    border-radius: 16px;
}

.card-body {
    padding: 20px;
}

.card-section {
    border-bottom: 1px solid rgba(0,0,0,.1);
    padding: 20px;
}
.card-section:last-child {
    border-bottom: 0;
}

.card-section-title {
    font-size: 26px;
    margin-bottom: 10px;
}
.card-section-title:last-child {
    margin-bottom: 0;
}*/
/* ---------- /card ---------- */


/* ---------- tabs ---------- */
ul.nav-tabs,
.nav-tabs ul{
    list-style: none;
}
ul.nav-tabs,
.nav-tabs > ul{
    display: flex;
}

.nav-tabs{
    --bs-nav-tabs-link-hover-border-color: transparent;
    --bs-nav-tabs-link-active-color: var(--bs-heading-color);
    --bs-nav-tabs-link-active-bg: transparent;
    --bs-nav-tabs-link-active-border-color: transparent;

    --bs-nav-link-color: var(--bs-heading-color);
    --bs-nav-link-padding-x: 1.5rem;
    --bs-nav-link-padding-y: 0.75rem;
    --bs-nav-link-font-size: 1rem;
    --bs-nav-link-font-weight: 400;
}

.nav-tabs li{
    padding-right: 1rem;
}

.nav-tabs .nav-link{
    border: none;
    position: relative;
    cursor: pointer;
}
.nav-tabs .nav-link::after{
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--bs-dark);
    position: absolute;
    bottom: 0;
    left: 0;

    transition: transform 0.15s cubic-bezier(.4,0,.2,1);
    transform: scaleX(0);
}
.nav-tabs .nav-link:hover::after,
.nav-tabs .nav-link.active::after{
    transform: scaleX(1);
}
.tab-content{
    --tab-content-px: 1rem;
    --tab-content-py: 2.5rem;

    background-color: var(--bs-light-bg-subtle);
    padding: var(--tab-content-py) var(--tab-content-px);
}

/* slider */
.nav-tabs .swiper{
    width: 100%;
    overflow: visible;
}
.nav-tabs .swiper-slide{
    width: auto;
}

@media (min-width: 768px) {
    .tab-content{
        --tab-content-px: 1.5rem;
        --tab-content-py: 3.5rem;
    }
}
@media (min-width: 992px) {
    .tab-content{
        --tab-content-px: 4rem;
        --tab-content-py: 4rem;
    }
}
/* ---------- /tabs ---------- */


/* ---------- modal ---------- */
.modal-backdrop{
	--bs-backdrop-bg: #44546f;
	--bs-backdrop-opacity: 0.7;
}
.modal{
	--bs-modal-bg: #f7f8f9;
}
.modal-dialog{
	--bs-modal-width: 500px;
	--modal-padding-x: 24px;
	--modal-padding-y: 24px;
}
.modal-sm{
	--bs-modal-width: 300px;
}
.modal-lg{
	--bs-modal-width: 816px;
}
.modal-xl{
	--bs-modal-width: 1076px;
}

/*.overlay-modal::before{
    content: "";
    width: 100vw;
    height: 100vh;
    background-color: var(--bs-backdrop-bg);
    opacity: var(--bs-backdrop-opacity);
    position: fixed;
    top: 0;
    left: 0;
}*/
.modal.show ~ .modal.show{
    --bs-modal-zindex: 1060;
}
.modal.show ~ .modal.show ~ .modal-backdrop:last-child{
    --bs-backdrop-zindex: 1058;
}

.modal-dialog-scrollable .modal-body{
    margin-right: 1rem;
    /*margin: 0 1rem 0.375rem 0;*/
}
/*.modal-dialog-scrollable ::-webkit-scrollbar{
    width:6px;
    height:6px;
}
.modal-dialog-scrollable ::-webkit-scrollbar-track{
    background-color: #f4f4f4;
    border-radius:99px;
    opacity:.1;
}
.modal-dialog-scrollable ::-webkit-scrollbar-thumb{
    background: #a4a3a3;
    border-radius:10px;
}*/

.modal .modal-close-btn{
	background-color: transparent;
	border: 0;
	padding: 0;
	margin-left: auto;
}
.modal-content > .modal-close-btn{
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
}
.modal .modal-header .modal-close-btn{
	align-self: flex-start;
	margin-top: 2px;
}
.modal .modal-close-btn img{
	width: 24px;
}

.modal-header{
	--bs-modal-header-padding: var(--modal-padding-x);
	padding-bottom: 24px;
	border: none;
}
.modal-body{
	--bs-modal-padding: var(--modal-padding-x);

	font-size: var(--fs-text);
}
.modal-header + .modal-body{
	padding-top: 0;
}

.modal-title{
	color: var(--bs-heading-color);
	font-size: var(--fs-h4);
	line-height: 1.4;
}

.modal-body-2col{
    --modal-padding-x: 0.75rem;
}
.modal-body-2col .img-col{
    --bs-aspect-ratio: 54%;
}
.modal-body-2col .info-col{
    padding-top: 2rem;
    padding-bottom: 1rem;
}

@media (min-width: 992px) {
    .modal-body-2col{
        --modal-padding-x: 0;

        display: flex;
        align-items: stretch;
        overflow-y: hidden !important;
    }
    .modal-body-2col .img-col{
        --bs-aspect-ratio: 0;
        flex-shrink: 0;
        width: 50%;
        display: flex;
    }
    .modal-body-2col .info-col{
        flex-grow: 1;
        padding: 2rem;
        overflow-y: auto;
    }
}
@media (min-width: 1200px) {
    .modal-body-2col .info-col{
        padding: 2.5rem;
    }
}
@media (min-width: 1400px) {
    .modal-body-2col .info-col{
        padding: 3rem;
    }
}
/* ---------- /modal ---------- */


/* ---------- section 2col wit image ---------- */
.section-2col-with-img{
    --section-py: 0;
    --section-min-height: auto;
    --info-col-px: 2.5rem;
    --info-col-py: 2.5rem;
    --img-col-ratio: 96.25%;
}

.section-2col-with-img .info-col{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--section-min-height);
    background-color: var(--bs-secondary);
    padding: var(--info-col-py) var(--info-col-px);
}
.section-2col-with-img .info-col > div{
    width: 100%;
    max-width: 688px;
}
.section-2col-with-img .info-col .title{
    margin-bottom: 2rem;
    font-size: 2rem;
    font-weight: 300;
}
.section-2col-with-img .info-col .text-wrap{
    font-size: 14px;
}

.section-2col-with-img .img-col{
    --bs-aspect-ratio: var(--img-col-ratio);

    position: relative;
}
.section-2col-with-img .img-col img{
    object-fit: cover;
}

@media (min-width: 480px) {
    .section-2col-with-img{
        --img-col-ratio: 83.3%;
    }
}
@media (min-width: 760px) {
    .section-2col-with-img{
        --info-col-px: 4.5rem;
        --img-col-ratio: 71%;
    }
}
@media (min-width: 992px) {
    .section-2col-with-img{
        --section-min-height: 836px;
        --img-col-ratio: 0;
    }

    .section-2col-with-img .img-col > figure{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
}
@media (min-width: 1200px) {
    .section-2col-with-img{
        --section-min-height: 894px;
    }
    .section-2col-with-img .info-col .title{
        margin-bottom: 3rem;

        font-size: 2.5rem;
    }
}

@media (min-width: 1400px) {
    .section-2col-with-img .info-col .title{
        margin-bottom: 5rem;
    }
    .section-2col-with-img .info-col .text-wrap{
        column-count: 2;
        column-gap: 1.75rem;
    }
}
@media (min-width: 1600px) {
    .section-2col-with-img .info-col .text-wrap{
        column-gap: 3rem;
    }
}
/* ---------- /section 2col wit image ---------- */


/* ---------- grid ---------- */
.grid{
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 2.5rem;
}

.grid-item-ratio-1{
    --img-aspect-ratio: 58.75%;
}
.grid-item-ratio-2{
    --img-aspect-ratio: 92.595%;
}
.grid-item-ratio-3{
    --img-aspect-ratio: 112%;
}
.grid-item-ratio-4{
    --img-aspect-ratio: 133.7%;
}

.grid-item{
    display: flex;
    flex-direction: column;
}
.grid-item > figure{
    --bs-aspect-ratio: var(--img-aspect-ratio, 58.75%);
    border-radius: var(--bs-border-radius);
}

.grid-item figure.hover-scale img{
    transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}
.grid-item figure.hover-scale:hover img{
    transform: scale(1.1);
}

.grid-item .info-wrap{
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 1rem;

    color: var(--bs-secondary-color);
    font-size: 14px;
}

.grid-item .title{
    font-size: 1.25rem;
    font-weight: 400;
}
.grid-item .display-title{
    font-size: 1.375rem;
    font-weight: 300;
}

.grid-item .text{
    color: var(--bs-heading-color);
    font-size: 14px;
    line-height: 1.5;
}
.grid-item .fs-lg{
    font-size: 1.125rem;
    line-height: 1.35;
}

.grid-item .item-with-icon{
    --iwi-color: #000;
    --iwi-fs: 1rem;

    margin-top: 0.75rem;
}

.grid-items-stretch .grid-item .info-wrap,
.carousel-items-stretch .grid-item .info-wrap{
    flex-grow: 1;
}

@media (min-width: 768px) {
    .grid-item .title{
        font-size: 1.375rem;
    }
    .grid-item .display-title{
        font-size: 1.5rem;
    }
    .grid-item .fs-lg{
        font-size: 1.25rem;
    }
}
@media (min-width: 992px) {
    .grid-item .text{
        font-size: 1rem;
    }
}
@media (min-width: 1200px) {
    .grid-item .title{
        font-size: 1.5rem;
    }
    .grid-item .display-title{
        font-size: 1.75rem;
    }
    .grid-item .fs-lg{
        font-size: 1.375rem;
    }
}
/* ---------- /grid ---------- */


/* ---------- services ---------- */

/* --- list --- */
.services-list-item,
.services-list-item > div{
    display: flex;
    align-items: center;
}

.services-list-item{
    --service-item-px: 1rem;
    --service-item-py: 1.5rem;
    --i-wrap-size: 48px;
    --fs-title: 1.5rem;

    gap: 0.5rem;
    border-bottom: 1px solid var(--bs-border-color);
    padding: var(--service-item-py) var(--service-item-px);
}

.services-list-item > div{
    gap: 0.5rem;
}

.services-list-item .title{
    color: var(--bs-heading-color);
    font-size: var(--fs-title);
    font-weight: 300;
}

.services-list-item .i-wrap{
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--i-wrap-size);
    height: var(--i-wrap-size);
    position: relative;
}

.services-list-item .i-service{
    background-color: var(--bs-dark);
    border-radius: 10px;
}
.services-list-item .i-service svg{
    width: var(--i-wrap-size);
    height: var(--i-wrap-size);
}
.services-list-item .i-service svg *{
    fill: var(--bs-primary);
}

.services-list-item .i-arrow{
    background-color: var(--bs-secondary);
    border-radius: 50%;
    margin-left: auto;
}
.services-list-item .i-arrow svg{
    width: var(--icon-size-lg);
}
.services-list-item .i-arrow svg > *{
    fill: var(--bs-dark);
}

/* hover */
.desktop .services-list-item > div,
.desktop .services-list-item .i-arrow{
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(0,0,.2,1);
}
.desktop .services-list-item > div{
    transition-property: transform;
}
.desktop .services-list-item .i-arrow{
    transition-property: transform, background-color;
}

.desktop .services-list-item:hover > div{
    transform: translateX(-1rem);
}
.desktop .services-list-item:hover .i-arrow{
    background-color: var(--bs-primary);
    transform: translateX(1rem);
}

@media (min-width: 768px) {
    .services-list-item{
        --service-item-py: 2.5rem;
        --fs-title: 1.75rem;

        gap: 1rem;
    }

    .services-list-item > div{
        gap: 1.25rem;
    }
}
@media (min-width: 1200px) {
    .services-grid{
        --bs-gutter-x: 2.5rem;
    }

    .services-list-item{
        --service-item-py: 3rem;
        --fs-title: 2rem;
    }

    .services-list-item > div{
        gap: 1.5rem;
    }
}

@media (max-width: 767px) {
    .services-list-item > div{
        flex-direction: column;
        align-items: flex-start;
    }
    .services-list-item .i-arrow{
        display: none;
    }
}

/* --- section --- */
.services-list-animated-item{
    border-bottom: 1px solid var(--bs-border-color);
}
.services-list-animated-item:hover{
    border-color: #fff;
}
.services-list-animated-item .services-list-item{
    --service-item-px: var(--content-px);
    --service-item-py: 1.5rem;

    border: none;
    margin: 0 calc(-1 * var(--content-px));
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.services-list-animated-item:last-child{
    border-bottom: none;
}

.desktop .services-list-animated-item .services-list-item > div,
.desktop .services-list-animated-item .services-list-item .i-arrow{
    transform: none;
}

.desktop .services-list-animated-item .services-list-item .title,
.desktop .services-list-animated-item .services-list-item::after,
.desktop .services-list-animated-item .services-list-item .i-service,
.desktop .services-list-animated-item .services-list-item .i-service svg *{
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(0,0,.2,1);
}

.services-list-animated-item .services-list-item .title{
    font-weight: 400;
    transition-property: color;
}
.desktop .services-list-animated-item .services-list-item:hover .title{
    color: #fff;
}

.desktop .services-list-animated-item .services-list-item .i-service{
    transition-property: background-color;
}
.desktop .services-list-animated-item .services-list-item .i-service svg *{
    transition-property: fill;
}
.desktop .services-list-animated-item .services-list-item:hover .i-service{
    background-color: var(--bs-primary);
}
.desktop .services-list-animated-item .services-list-item:hover .i-service svg *{
    fill: var(--bs-dark);
}

.desktop .services-list-animated-item .services-list-item::after{
    --translate-x: 50%;
    --translate-y: -50%;
    --scale-x: 0;
    --scale-y: 0;

    content: "";
    width: 1920px;
    height: 1920px;
    background-color: var(--bs-dark);
    border-radius: 50%;

    position: absolute;
    top: 50%;
    right: calc(var(--content-px) + 28px);
    z-index: -1;

    transition-property: transform, background-color;
    transform: translate(var(--translate-x), var(--translate-y)) scaleX(var(--scale-x)) scaleY(var(--scale-y));
}
.desktop .services-list-animated-item .services-list-item:hover::after{
    --scale-x: 2;
    --scale-y: 2;
}

@media (min-width: 992px) {
    .services-list-animated-item .services-list-item {
        --i-wrap-size: 56px;
    }
}
/* ---------- /services ---------- */


/* ---------- map ---------- */
.map-container{
    --map-aspect-ratio: 126%;

    background: #f9f9f9 url(../../images/icons/spinner_notch.svg) center no-repeat;
    background-size: 28px auto;
    position: relative;
    overflow: hidden;
}
.map-container::before{
    content: "";
    display: block;
    padding-top: var(--map-aspect-ratio);
}
.map-container > *{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

@media (min-width: 576px) {
    .map-container {
        --map-aspect-ratio: 84%;
    }
}
@media (min-width: 768px) {
    .map-container {
        --map-aspect-ratio: 44%;
    }
}
@media (min-width: 1200px) {
    .map-container {
        --map-aspect-ratio: 32%;
    }
}
/* ---------- /map ---------- */



/* ==================== 5. content by pages ==================== */


/* ---------- home ---------- */
.section-intro{
	--container-px: 0;
	--content-p: 1.25rem;
	--content-container-height: 452px;

	padding-bottom: 0;
    overflow: visible;
}
.section-intro .container{
	max-width: 100%;
	padding-left: var(--container-px);
	padding-right: var(--container-px);
	position: relative;
}

.section-intro .content-container{
	display: flex;
	flex-direction: column;
	height: var(--content-container-height);
	padding: var(--content-p);

	position: relative;
	z-index: 2;
}
.section-intro .video-container,
.section-intro .video-container::after{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.section-intro video{
	object-fit: cover;
}
.section-intro .video-container::after{
	content: "";
	background: linear-gradient(0deg, #0000001a, #0000001a), linear-gradient(247deg, transparent 60.35%, rgba(0, 0, 0, .6));
	z-index: 2;
}

.section-intro .info-wrap{
	padding: 0 2rem;
	color: #fff;
	font-size: var(--fs-text);
}
.section-intro .info-wrap > .display-title{
	color: inherit;
}

.section-intro .search-container{
	--search-box-height: 90px;
	--search-box-border-radius: 48px;

	margin-top: 3.5rem;
}
.section-intro .search-box{
	display: flex;
	gap: 0.25rem;
	height: var(--search-box-height);
	background-color: #fff;
	border: 1px solid var(--bs-border-color);
	border-radius: var(--search-box-border-radius);
	padding: 1rem;
	z-index: 2;
}
.section-intro .search-box > img{
	flex-shrink: 0;
	width: 25px;
	margin: auto 0.5rem;
}

.section-intro .search-box .form-floating{
	flex-grow: 1;
}
.section-intro .search-box .form-control,
.section-intro .search-box .form-floating > label{
	padding-left: 0;
	padding-right: 0;
}
.section-intro .search-box .form-control{
	border: none;
	height: 100%;
	padding-bottom: 0;
}

.section-intro .search-box > .btn{
	--bs-btn-padding-x: 0;
	--bs-btn-padding-y: 0;
	--bs-btn-border-radius: 50%;
	--btn-size: 56px;

	flex-shrink: 0;
	background-color: var(--btn-primary);
	border-color: var(--btn-primary);
}
.section-intro .search-box > .btn svg{
	fill: #fff;
}
.section-intro .search-container.search-is-loading .search-box .btn{
	background-image: url("../../images/icons/spinner_notch_white.svg");
}
.section-intro .search-results-wrap{
	border: 1px solid var(--bs-border-color);
	border-radius: var(--search-box-border-radius) var(--search-box-border-radius) 1.5rem 1.5rem;
	box-shadow: none;
	padding-top: var(--search-box-height);
	margin: 0;
	top: 0;
}

.home-search-is-open .section-intro .search-box{
    z-index: 555;
}

@media (min-width: 992px) {
	.section-intro{
		--container-px: 26px;
		--content-p: 2.5rem;
		--content-container-height: 549px;
	}
	.section-intro .container::before{
		content: "";
		width: 100%;
		height: 80%;
		background-color: var(--bs-primary);
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: -1;
	}

	.section-intro  .info-wrap{
		width: 60%;
		padding: 0 2.5rem;
	}

	.section-intro .search-results-wrap section > .title {
		font-size: 1.25rem;
	}
	.section-intro .search-results-item .title {
		font-size: 1.375rem;
		line-height: 1.165;
	}
}
@media (min-width: 1200px) {
	.section-intro{
		--container-px: 26px;
		--content-p: 5rem;
		--content-container-height: 802px;
	}
	.section-intro .container::before{
		height: 50%;
	}

	.section-intro .search-results-wrap .scrollable-container{
		padding-left: 2rem;
	}
	.section-intro .search-results-wrap section > .title {
		font-size: 1.375rem;
	}
	.section-intro .search-results-item .title {
		font-size: 1.5rem;
	}
}
@media (min-width: 1400px) {
	.section-intro{
		--container-px: 168px;
	}
	.section-intro > .container{
		padding-right: 0;
	}
	.section-intro .container::before{
		height: 100%;
	}

	.section-intro .search-container{
		max-width: 865px;
	}

	.section-intro .social-media-wrap{
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 1.5rem;
		width: var(--container-px);
		background-color: var(--bs-primary);
		padding-top: 2rem;
		position: absolute;
		top: 0;
		left: 0;
	}
	.section-intro .social-media-wrap::before{
		content: "";
		width: 100%;
		height: var(--section-py);
		background-color: var(--bs-primary);
		position: absolute;
		bottom: 100%;
		left: 0;
	}
	.section-intro .social-media-wrap a{
		position: relative;
	}
	.section-intro .social-media-wrap img{
		width: 20px;
	}
	.section-intro .social-media-wrap [data-tooltip]::before{
		content: attr(data-tooltip);

		opacity: 0;
		padding-bottom: 8px;

		position: absolute;
		bottom: 100%;
		left: 50%;
		transform: translateX(-50%);

		transition: opacity 0.3s cubic-bezier(.4,0,.2,1);

		color: var(--bs-heading-color);
		font-size: 1rem;
		white-space: nowrap;
	}
	.section-intro .social-media-wrap [data-tooltip]:hover::before{
		opacity: 1;
	}
}

@media (max-width: 1399px) {
	.section-intro .social-media-wrap{
		display: none;
	}
}
@media (max-width: 991px) {
	.section-intro{
		--section-py: 0;
	}
	.section-intro .info-wrap{
		display: none;
	}
}

/* doctors */
.section-doctors-intro{
    --container-px: 26px;

    background-color: var(--bs-primary);
}
.section-doctors-intro .container{
    max-width: 100%;
    padding: 0 var(--container-px);
}

@media (min-width: 992px) {

}
@media (min-width: 1400px) {
    .section-doctors-intro .container{
        padding-left: 168px;
    }
}
/* ---------- /home ---------- */


/* ---------- news ---------- */

/* --- list */
.news-list-container{
    --col-gap: 3rem;

    display: flex;
    gap: var(--col-gap);
}

.news-list-container .img-col{
    flex-shrink: 0;
    width: 484px;
}
.news-list-container .img-col figure{
    --bs-aspect-ratio: 90.91%;

    border-radius: var(--bs-border-radius);
}

.news-list-container .info-col{
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.news-list-container .info-col .item{
    --py: 2rem;
    --gap: 1rem;
    --fs-title: 1.25rem;

    flex-grow: 1;
    display: flex;
    gap: var(--gap);
    border-bottom: 1px solid var(--bs-border-color);
    padding: var(--py) 0;
    overflow: hidden;
    position: relative;

    color: var(--bs-secondary-color);
    font-size: 14px;
}
.news-list-container .info-col .item:first-child{
    padding-top: 0;
}

.news-list-container .info-col .item .title{
    font-size: var(--fs-title);
}
.news-list-container .info-col .item .date{
    flex-shrink: 0;
}

/* --- */
.desktop .news-list-container .info-col .item{
    transition: border-bottom-color 0.2s cubic-bezier(.4,0,.2,1);
}
.desktop .news-list-container .info-col .item.active{
    border-bottom-color: #000;
}
.desktop .news-list-container .img-col img{
    opacity: 0;
    transition: opacity 0.2s cubic-bezier(.4,0,.2,1);
}
.desktop .news-list-container .img-col img.active{
    opacity: 1;
}


@media (min-width: 768px) {
    .news-list-container .info-col .item{
        --py: 2.5rem;
        --gap: 1.5rem;
        --fs-title: 1.375rem;

        align-items: center;
    }
    .news-list-container .info-col .item .date{
        margin-left: auto;
    }
}
@media (min-width: 1200px) {
    .news-list-container .info-col .item{
        --fs-title: 1.5rem;
    }

    .news-list-container .info-col .item .title{
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }
}
@media (min-width: 1400px) {
    .news-list-container{
        --col-gap: 6.5rem;
    }
}

@media (max-width: 1199px) {
    .news-list-container .img-col{
        display: none;
    }
}
@media (max-width: 767px) {
    .news-list-container .info-col .item{
        flex-direction: column;
    }
}


/* --- page --- */
.news-page-container{
    --container-pt: 1.25rem;
    --container-pb: 3.5rem;
    --col-gap: 2.5rem;
    --col-title-fs: 1.5rem;
    --col-title-mb: 2rem;

    display: flex;
    gap: var(--col-gap);
    padding-top: var(--container-pt);
    padding-bottom: var(--container-pb);
}
.news-page-container > div{
    width: calc(50% - var(--col-gap) * 0.5);
}

.news-page-container .img-col figure{
    --bs-aspect-ratio: 93%;

    border-radius: var(--bs-border-radius);
}
.news-page-container .img-col figure.position-sticky{
    top: calc(var(--app-header-height) + var(--container-pt));
}

.news-page-container .info-col > .title{
    margin-bottom: var(--col-title-mb);

    font-size: var(--col-title-fs);
    font-weight: 300;
}

.news-page-container .info-col .item{
    --py: 1.5rem;
    --gap: 1rem;
    --fs-title: 1.375rem;

    display: flex;
    flex-direction: column;
    gap: var(--gap);
    padding: var(--py) 0;

    color: #000;
    font-size: 14px;
}

.news-page-container .info-col .item .title{
    font-size: var(--fs-title);
    font-weight: 300;
}

/* --- */
.desktop .news-page-container .img-col img,
.desktop .news-page-container .info-col .item{
    transition: opacity 0.2s cubic-bezier(.4,0,.2,1);
}
.desktop .news-page-container .img-col img{
    opacity: 0;
}
.desktop .news-page-container .info-col .item{
    opacity: 0.25;
}

.desktop .news-page-container .img-col img.active,
/*.desktop .news-page-container .info-col .item:hover,*/
.desktop .news-page-container .info-col .item.active{
    opacity: 1;
}

@media (min-width: 768px) {
    .news-page-container{
        --container-pt: 2rem;
        --container-pb: 4.5rem;
        --col-title-fs: 1.75rem;
        --col-title-mb: 3rem;
    }

    .news-page-container .info-col .item{
        --gap: 1.5rem;
    }
}
@media (min-width: 1200px) {
    .news-page-container{
        --container-pt: 2.5rem;
        --container-pb: 5rem;
        --col-gap: 3.5rem;
        --col-title-fs: 2rem;
        --col-title-mb: 3.5rem;
    }

    .news-page-container .info-col .item{
        --py: 2rem;
        --fs-title: 1.75rem;
    }
}

@media (max-width: 767px) {
    .news-page-container .img-col{
        display: none !important;
    }
}
/* ---------- /news ---------- */


/* ---------- contact ---------- */
.page-contact{
    --content-py: 3rem;
    --row-gutter-x: 2.5rem;
    --info-col-gap: 1.125rem;
    --main-img-aspect-ratio: 60%;

    --font-size-lg: 18px;
}
.page-contact .main-container{
    padding-top: var(--content-py);
    padding-bottom: var(--content-py);
}
.page-contact .main-container > .row{
    --bs-gutter-x: 0;
    gap: var(--row-gutter-x);
}
.page-contact .main-container .col-img{
    --bs-aspect-ratio: var(--main-img-aspect-ratio);
}
.page-contact .main-container .col-info,
.page-contact .main-container .info-section{
    display: flex;
    flex-direction: column;
    gap: var(--info-col-gap);
}

.page-contact .col-info .fs-lg{
    font-size: var(--font-size-lg);
}
.page-contact .col-info .item-with-icon{
    --iwi-fs: var(--font-size-lg);
}

html:not([lang="ka"]){
    .page-contact .main-contact-info-wrap{
        order: 3;
        margin: 0.75rem 0;
    }
    .page-contact .main-contact-info-wrap .mail-wrap{
        display: none;
    }
}

@media (min-width: 768px) {
    .page-contact{
        --row-gutter-x: 3.5rem;
        --info-col-gap: 2rem;
        --font-size-lg: 1.25rem;
    }
}
@media (min-width: 992px) {
    .page-contact{
        --row-gutter-x: 2.5rem;
        --main-img-aspect-ratio: 104.725%;
    }
}
@media (min-width: 1200px) {
    .page-contact{
        --font-size-lg: 1.375rem;
    }
}
@media (min-width: 1400px) {
    .page-contact{
        --content-py: 4rem;
        --row-gutter-x: 5rem;
    }
}
/* ---------- /contact ---------- */


/* ---------- section ---------- */
/* ---------- /section ---------- */