/* === MULISH === */
@font-face {
    font-family: 'Mulish';
    src: url('/fonts/mulish/Mulish.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Mulish';
    src: url('/fonts/mulish/Mulish-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}

/* === INTER === */
@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-ThinItalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-ExtraLight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-ExtraLightItalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('fonts/inter/Inter-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Italic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-SemiBoldItalic.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-ExtraBold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-ExtraBoldItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/inter/Inter-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

body{
    font-family: 'Inter', sans-serif;
    /* font-family: 'Mulish', sans-serif; */
}

html, body{
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
}

main{
    flex: 1 1 auto;
}

footer{
     flex: 0 0 auto;
}

section{
    display: flex;
    justify-content: center;
}

.section{
    margin-top: 45px;
}

.sectionPage{
    margin-top: 20px;
}

.breadcrumbs{
    display: flex;
    gap: 5px;
    margin-bottom: 10px;
}

.breadcrumbs a, .breadcrumbs p{
    font-size: 14px;
    font-weight: unset;
}

.breadcrumbs a{
    color: #1B3A3F;
}

.breadcrumbs a::after{
    content: url("data:image/svg+xml,%3Csvg width='10px' height='10px' viewBox='0 0 6 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.707537 0.707042C0.430821 0.983104 0.430821 1.43098 0.707537 1.70737L3.78976 4.49987L0.707537 7.29238C0.430821 7.56877 0.430821 8.01632 0.707537 8.29269C0.984253 8.56908 1.43247 8.56908 1.70919 8.29269L5.2949 5.04431C5.44441 4.8948 5.51035 4.69566 5.49803 4.49986C5.51035 4.3044 5.44441 4.10492 5.2949 3.95542L1.70919 0.707029C1.43247 0.43098 0.984265 0.43098 0.707537 0.707042Z' fill='%2325433C'/%3E%3C/svg%3E");
    margin-left: 5px;
}

.breadcrumbs p{
    color: #999;
}

.breadcrumbs::-webkit-scrollbar { width: 3px; height: 3px;}
.breadcrumbs::-webkit-scrollbar-track {  background-color: #fff;}
.breadcrumbs::-webkit-scrollbar-track-piece { background-color: none;}
.breadcrumbs::-webkit-scrollbar-thumb { background: #1B3A3F; border-radius: 20px;}

@media(min-width: 320px) and (max-width: 550px){
    .breadcrumbs{
        width: 100%;
        overflow: hidden;
        overflow-x: auto;
        white-space: nowrap;
        padding: 10px 0;
    }
}

/* btn */

.btnContainerCenter{
    display: flex;
    justify-content: center;
    margin-top: 45px;
}

.btn{
    text-align: center;
    display: inline-block;
    padding: 14px 28px;
    font-size: 14px;
    border-radius: 100px;
    transition: .4s;
}

.btnMain{
    background: #25433C;
    border: 1px solid #25433C;
    color: #fff;
}

.btnMain:hover{
    background: none;
    color: #25433C;
}

.btnSecond{
    background: #FFFFFF;
    border: 1px solid #FFFFFF;
    color: #242726;
}

.btnSecond:hover{
    background: none;
    color: #FFFFFF;
}

.btnOutline{
    border: 1px solid #1B3A3F;
    color: #1B3A3F;
}

.btnOutline:hover{
    background: #1B3A3F;
    color: #fff;
}

.sectionTitleContent{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.sectionTitle{
    font-family: 'Mulish', sans-serif;
    font-weight: 900;
    font-size: 40px;
    white-space: nowrap;
    color: #25433C;
}

.sectionTitleWhite{
    color: #fff;
}

.sectionDotted {
    height: 2px;
    background-image: repeating-linear-gradient(
        to right,
        #6B8A7A,
        #6B8A7A 2px,
        transparent 2px,
        transparent 8px
    );
    width: 100%;
    margin-top: 8px;
}

.sectionDottedWhite{
    background-image: repeating-linear-gradient(
        to right,
        #F0E8E3,
        #F0E8E3 2px,
        transparent 2px,
        transparent 8px
    );
}

.swiperBtnContainer {
	display: flex;
    align-items: center;
	gap: 10px;
	margin-top: 10px;
}

.sliderBtnGreen {
    border-radius: 50%;
    width: 46px;
    height: 46px;
    border: 1px solid #6B8A7A;
    transition: .4s;
}

.sliderBtnGreen:hover {
	background-color: #f2f2f2;
}

.sliderBtnWhite{
    border-radius: 50%;
    width: 46px;
    height: 46px;
    border: 1px solid #fff;
    transition: .4s;
}

.sliderBtnWhite:hover{
    background: #60806f;
}

@media(min-width: 320px) and (max-width: 720px){
    .sectionTitleContent{
        flex-wrap: wrap;
        gap: 10px;
    }

    .sectionDotted{
        width: 100%;
    }

    .sectionTitle{
        text-align: left;
        font-size: 20px;
        width: 100%;
    }

    .swiperBtnContainer{
        width: 100%;
        display: flex;
    }

    .sliderBtnGreen {
        width: 40px;
        height: 40px;
    }

}

@media(min-width: 550px) and (max-width: 920px){
    .sectionTitle{
        font-size: 32px;
        white-space: wrap;
    }
}

::-webkit-scrollbar { width: 8px; height: 8px;}
::-webkit-scrollbar-track {  background-color: #fff;}
::-webkit-scrollbar-track-piece { background-color: none;}
::-webkit-scrollbar-thumb { background: #1B3A3F; border-radius: 20px;}