@charset "UTF-8";

:root {
    --red: #EF2813;
    /*--red: #333334;*/
    --dark-grey: #333334;
    --dark-grey-70: #33333470;
    --dark-grey-80: #33333480;
    --dark-grey-90: #343333d6;
    --grey: #0000008c;/*#AAAAAA;*/
    --light-grey: #f3f3f3;
    --light-grey-2: #f9f9f9;
    --light-grey-text: #c6c6c6;
    --light-grey-text-2: #b9b9b9;
    --pink: #FCEBE9;
    --white-f: #7b7b7d;
    --bs-body-color: #000000e6;
}


@font-face {
    font-family: 'Inter';
    src: url("../fonts/Inter/Inter-VariableFont_slnt,wght.ttf");
    font-weight: normal;
    font-style: normal;
}





p{
    font-family: "Inter"!important;
}

a,h1,h2,h3,h4{
    font-family: "Inter"!important;
}
h1,h2,h3,h4{
    /* letter-spacing: -1px;*/
}

/*.dash::after{
    content: "-";
    width: 16px;
    background: inherit;
    height: 2px;
    position: absolute;
    /*margin-top: 16px;*/
    margin-left: 10px;
    font-size: inherit;
    transform: scaleX(1.9);

}*/

body, html {
    background-color: var(--light-grey);
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
a, a:hover, a:visited{
    text-decoration: none;
    color:unset;
}

.cursor{
    cursor: pointer;
}

.container-md {
    max-width: 1440px!important;
}

.section-header  {
    margin-top:2px;
}
.section-header h2 {
    font-size: 36px;
}
.section-header-title {
    background-position: center center;
    background-size: cover;
}
.section-header-title h1{
    font-size: 24px;
    line-height: 30px;
}
.section-header-title h3{
    font-size: 14px;
    line-height: 20px;
}
.section-header-title p{
    font-size: 18px;
    line-height: 27px;
}
.h-40{
    height: 170px;
}
/* COLORI */
.bg-grey{
    background-color: var(--grey)!important;
}
.bg-light-grey{
    background-color: var(--light-grey)!important;
}
.bg-light-grey-2{
    background-color: var(--light-grey-2)!important;
}
.bg-dark{
    background-color: var(--dark-grey)!important;
}
.bg-dark-70{
    background-color: var(--dark-grey-70)!important;
}
.bg-dark-80{
    background-color: var(--dark-grey-80)!important;
}
.bg-dark-90{
    background-color: var(--dark-grey-90)!important;
}
.color-light-grey{
    color: var(--light-grey-text)!important;
}
.color-grey{
    color: var(--grey)!important;
}
.color-red{
    color: var(--red)!important;
}
.color-white{
    color: #fff!important;
}
.color-dark-grey{
    color: var(--dark-grey)!important;
}

.border-grey{
    border-color: #f3f3f3!important;
}

.contact-form *{
    color: var(--grey)!important;
}
.contact-form button{
    color: var(--white)!important;
    background-color: var(--dark-grey)!important;
}
#contact-map iframe{
    pointer-events: none;
}

/* COLORI END */
#homeSlider, #homeSlider .carousel-item{
    height: 400px;
}
#homeSlider .carousel-item>.img{
    background-size: cover;
    background-position: center center;
}

#main-nav{

    background-color: white;
}
#main-nav a{
    font-size: 14px!important;
}

.last-col{
    /* margin-left: -12px!important;*/
}
.container-md{
    overflow: hidden;
    padding: 0;
}

.carousel-indicators.no-default {
    box-sizing: unset!important;
    flex: unset!important;
    width: unset!important;
    height: unset!important;
    text-indent: unset!important;
    background-color: unset!important;
    background-clip: unset!important;
    border: unset!important;
    border-top: unset!important;
    border-bottom: unset!important;
    opacity: unset!important;
    transition: opacity .6s ease;
}


.dots-button {
    background: transparent;
    border-radius: 10px!important;
    border: 1px solid #483a49!important;
    height: 6px!important;
    width: 6px!important;
    margin-right: 5px!important;
    overflow: hidden!important;
    padding: 0!important;
    box-sizing: unset!important;
    flex: unset!important;
    text-indent: unset!important;
    cursor: pointer;
    background-clip: unset!important;
}
.dots-button.active {
    background: var(--dark-grey)!important;

}
.card-body{
    background-color: white;

}

/* TRANSATIONS*/
.translate-element,.translate-container{
    transition:all .3s;
}
.translate-container:hover .translate-element{
    transform: translateY(-30px);
}
.translate-container:hover .read-more{
    opacity:1;

}
.read-more{
    transition: opacity 300ms ease;
    opacity:0;
    color: var(--light-grey-text-2);
    font-size: 13px;
    margin-top: 15px;

    text-decoration: none;
}
.read-more:hover{
    color: var(--red);
}

.cover-centered{
    background-position: center center;
    background-size: cover;
}
.card:hover .overlay-img{
    opacity:0.8;
}

.hidden{
    visibility: none;
    opacity: 0;
    height: 0;
    width: 0;
}

#vks-category-search .cancel{
    visibility: none;
    opacity:0;
}
#vks-category-search.active .cancel{
    visibility: visible;
    opacity:1;
}
.project.card {
    margin-left: -1px!important;
}
.project.card .img-card{
    height: 200px!important;

}
.project.card .img-card-image{
    height: 200px!important;
    background-position: center center;
    background-size: cover;
    width: 100%!important;
}
.project.card .overlay-img{
    height: 200px;
    width: 99.8%!important;
}

.project .h-fixed-100 {
    height: 192px!important;
}


.card .overlay-img{
    background: rgba(0, 0, 0, .2);
    display: block;
    height: 84%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity 300ms ease;
    width: 100%;
}
.img-card, .top-card{
    height: 321px;
}


.project h3{
    font-size: 17px;
    line-height: 23px;
}
.project h2{
    font-size: 17px;
    line-height: 23px;
}
.project p{
    font-size: 14px;
    line-height: 1.4;
}

@media only screen and (max-width: 412px) {
    .top-card, .bottom-card{
        height: 100%!important;
    }
    .section-header-title.h-fixed{
        height: 340px!important;
    }
    .dots-button {
        width:4px!important;
        height: 4px!important;
    }

    .section-header h2 {
        font-size: 26px;
    }
    .section-header-title h1{
        font-size: 20px;
        line-height: 26px;
    }
    .h-40{
        height: 150px;
    }

    .project h2{
        font-size: 14px;
        line-height: 19px;
        margin-top:0;
    }
    .project h3{
        font-size: 14px;
        margin-bottom:0;
        line-height: 23px;
    }
    .project p{
        font-size: 10px;

    }

}

.bottom-card{
    height: 159px;
}
.card{
    overflow: hidden;
}
.img-card-image{
    width: 101% !important;
    height: 101% !important;
    margin-left: -1px;
    margin-top: -1px;
    background-size: cover;
    background-position: center center;
}

.h-fixed {
    height: 480px;
    position: relative;
}
.h-fixed-2 {
    height: 400px;
    position: relative;
}
.h-fixed-100 {
    height: 142px;

}

.p-max{
    padding-top: 70px;
    padding-bottom: 70px;
    margin-bottom: 1px;
}


h2, h3 {
    font-size: 20px;
}
p {
    font-size:14px;
    line-height: 15px;
}

footer * {
    color: var(--white-f);
}

.news-text-container{
    bottom: 41px;
    left: 40px;
    position: absolute;
    top: auto;
}

.categories{
    font-size:13px;
    line-height: 19px;
}
.categories .active{
    font-weight: bold;

}
.categories .active::before{
    content: "> "

}
input.transparent-input{
    background-color:transparent !important;
    border:none !important;
    outline:0;
}

.service-icon{
    width: 24px;
    height: 24px;
}


@media (max-width: 767px) {
    .multislide .carousel-inner .carousel-item > div {
        display: none;
    }
    .multislide .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.multislide .carousel-inner .carousel-item.active,
.multislide .carousel-inner .carousel-item-next,
.multislide .carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {

    .multislide .carousel-inner .carousel-item-end.active,
    .multislide .carousel-inner .carousel-item-next {
        transform: translateX(25%);
    }

    .multislide .carousel-inner .carousel-item-start.active,
    .multislide .carousel-inner .carousel-item-prev {
        transform: translateX(-25%);
    }
}

.multislide .carousel-inner .carousel-item-end,
.multislide .carousel-inner .carousel-item-start {
    transform: translateX(0);
}
.fslightbox-slide-number-container{
    display:none!important;
}


.carousel-control-next, .carousel-control-prev {
    width: 6%!important;
}


.navbar-brand img{
    max-width: 273px!important;
}

.card-img.cover-slide {
    height: 300px;
    background-size: cover;
    background-position: center center;
}