@import url("https://use.typekit.net/hwt1gmq.css");



:root {

    --basicColor1: #F1F1F1;

    --basicColor2: #63ae4b;

    --basicWhite: #ffff;

    --basicBlack: #000000;

    --basicColorLight: #cccccc;

    --smallRadius: 10px;

    --mediumRadius: 20px;

    --basicRadius: 30px;

    --defaultSpacing: 2rem;

    font-size: 20px;

}



body *, body {

    font-family: "Poppins", sans-serif;

    margin: 0;

    box-sizing: border-box;

}



body {

    max-width: 1920px;

    margin: 0 auto;

    -webkit-box-shadow: 0px 0px 42px 44px rgba(0, 0, 0, 0.09);

    box-shadow: 0px 0px 42px 44px rgba(0, 0, 0, 0.09);

}



a {

    text-decoration: none;

    font-size: 1em;

    font-weight: 400;

}



p {

    line-height: 1.2em;

    font-weight: 400;

}



p, a, span, li {

    font-size: .75em;

}



p a {

    font-weight: 300;

}



.bigSpacing {

    padding: calc(var(--defaultSpacing) * 2)

}



.bigSpacingSide {

    padding: 0 calc(var(--defaultSpacing) * 2)

}



.bigSpacingTopBottom {

    padding: calc(var(--defaultSpacing) * 2) 0

}



.mediumSpacing {

    padding: calc(var(--defaultSpacing)) calc(var(--defaultSpacing) * 2)

}





.smallUniformSpacing {

    max-width: 1200px;

    margin: 0 auto;

}



.uniformSpacing {

    max-width: 1500px;

    margin: 0 auto;

}



.bigUniformSpacing {

    max-width: 1800px;

    margin: 0 auto;



}



.bigUniformSpacing {

    max-width: 1920px;

    margin: 0 auto;

}



.smallWidthText {

    width: 60% !important

}



.mediumWidthText {

    width: 75% !important

}





.marginCenter {

    margin: 0 auto;

}



h1, h2, h3, h4, h5, h6 {

    line-height: 1.3;

    font-weight: 400;

}



p, span {

    font-weight: 300;

}



.black {

    font-weight: 900;

}



.bold {

    font-weight: 700;

}



.semiBold, .semiBold * {

    font-weight: 600;

}



.regular {

    font-weight: 400;

}



.medium {

    font-weight: 500;

}



.light {

    font-weight: 300;

}



.extraLight {

    font-weight: 200;

}



.size45 {

    font-size: 2.25em;

}



.size30 {

    font-size: 1.5em;

}



.size25 {

    font-size: 1.25em;

}



.size20 {

    font-size: 1em;

}



.size15 {

    font-size: 0.75em;

}





.upper {

    text-transform: uppercase;

}



.taj {

    text-align: justify;

}



.tac {

    text-align: center;

}



.tar {

    text-align: right;

}



.relative {

    position: relative

}



.bgImg {

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

}



.afterFilter, .afterFilter * {

    position: relative;

    z-index: 50;

}



.afterFilter:after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 30;

    background-color: black;

    opacity: .4;

}



.afterFilter.radius:after {

    border-radius: var(--basicRadius);

}



.radius {

    border-radius: var(--basicRadius);

}



.mediumRadius {

    border-radius: var(--mediumRadius);

}



.smallRadius {

    border-radius: var(--smallRadius);

}



.activeLink {

    position: relative;

}



ul:not(.rightMenu) li:not(.externalLink) .activeLink:after {

    content: " ";

    position: absolute;

    background-color: var(--basicBlack);

    width: .25em;

    height: .25em;

    border-radius: 100%;

    bottom: -.25em;

    left: 50%;

    transform: translateY(-50%);

}





.bgGrey {

    background-color: var(--basicColor1);

}



.colorWhite, .colorWhite * {

    color: var(--basicWhite);

}



.bgWhite {

    background-color: var(--basicWhite);

}



.fillWhite * {

    fill: var(--basicWhite);

}



.colorBlack, .colorBlack * {

    color: var(--basicBlack);

}



.bgBlack {

    background-color: var(--basicBlack);

}



b {

    font-weight: 600;

}



.fillBlack * {

    fill: var(--basicBlack);

}



.introText {

    display: flex;

    flex-direction: column;

    gap: 1.5em;

    width: 100%;

}



.introText div {

    display: flex;

    flex-direction: column;

    gap: 1em;

}



.w100 {

    width: 100% !important;

}



.mainLink {

    display: flex;

    border-radius: var(--basicRadius);

    width: fit-content;

    align-items: center;

    padding: 0.67em 1.67em;

    border: 1px solid black;

    transition: ease all .3s;

    color: var(--basicBlack);

    font-size: .75em;

}



.mainLink.whiteLink {

    border: 1px solid var(--basicWhite);

    color: var(--basicWhite);

}



.mainLink:hover {

    border: 1px solid var(--basicColor2);

    color: var(--basicColor2);



}



.center {

    display: flex;

    justify-content: center;

    align-items: center;

}





/* START SLIDER */

.slider {

    max-width: 1920px;

    margin: 0 auto;

    position: relative;

}



.sliderWrapper {

    width: 410px;

    display: flex;

    transition: transform 1s ease-in-out;

    gap: 2em;

}



.sliderWrapper::-webkit-scrollbar {

    display: none; /* Chrome/Safari */

}



.sliderSlide {

    width: 410px;

    flex: 0 0 auto;

    box-sizing: border-box;

}



.horizontalScroll {

    overflow: hidden;

}



.sliderArrow svg{

    width: 4em;

    height: 4em;

    position: absolute;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

    cursor: pointer;

}



.sliderArrow.sliderRightArrow svg{

    left: initial;

    right: 0;

}



.sliderArrow path {

    fill: #CCCCCC;

}



/* END SLIDER */





/* START hero */

.hero {

    background-position: bottom;

    height: 80vh;

}



/* END hero */



/* START subHero */



.subHero .uniformSpacing {

    display: flex;

    gap: 3em;

    align-items: center;

}



.subHero .uniformSpacing .contact {

    display: flex;

    flex-direction: column;

    justify-content: center;

    gap: .5em;

    min-width: fit-content;

}



.subHero .uniformSpacing .contact > div {

    display: flex;

    align-items: center;

    gap: .5em;

}



.subHero .uniformSpacing .contact > div svg {

    width: .75em;

    height: .75em;

}



.subHero .uniformSpacing .introText {

    border-left: 1px solid var(--basicColor1);

    padding: 2em 0 2em 2.5em;

}



/* END subHero */





@media screen and (max-width: 1200px) {

    :root {

        font-size: 18px;

    }



    .size40 {

        font-size: 1.5em;

    }



    .size30 {

        font-size: 1.2em;

    }



    .smallWidthText {

        width: 75% !important

    }



}





@media screen and (max-width: 800px) {

    :root {

        font-size: 18px;

    }



    .bigSpacing {

        padding: calc(var(--defaultSpacing) * 1.5)

    }



    .bigSpacingSide {

        padding: 0 calc(var(--defaultSpacing) * 1.5)

    }



    .bigSpacingTopBottom {

        padding: calc(var(--defaultSpacing) * 1.5) 0

    }



    .size40 {

        font-size: 1.7em;

    }



    .size25 {

        font-size: 1.15em;

    }



    .subHero .uniformSpacing{

        flex-direction: column;

        align-items: flex-start;

    }



    .subHero .uniformSpacing .introText{

        border-top: 1px solid var(--basicColor1);

        border-left: none;

        padding-left: 0;

    }



}



@media screen and (max-width: 700px) {

    .modal-content {

        height: 60vh;

        padding: 1em;

        width: 90%;

    }



    :root {

        font-size: 16px;

    }



    .size40 {

        font-size: 1.4em;

    }



    .bigSpacing {

        padding: var(--defaultSpacing)

    }



    .bigSpacingSide {

        padding: 0 var(--defaultSpacing)

    }



    .bigSpacingTopBottom {

        padding: var(--defaultSpacing) 0;

    }



    .size40 {

        font-size: 1.5em;

    }



    .smallWidthText {

        width: 100% !important

    }



    .mediumWidthText {

        width: 100% !important

    }



    .hero {

        background-position: bottom;

        height: 60vh;

    }

}



@media screen and (max-width: 650px) {

    ul:not(.rightMenu) li:not(.externalLink) .activeLink:after {

        bottom: -.5em;

    }

}