@import url('https://fonts.cdnfonts.com/css/unbounded');
@import url('https://fonts.cdnfonts.com/css/inter');


html{

}
body{  
    font-family: 'unbounded', sans-serif;  
    margin: 0 auto;
}


.navbar-nav{
/*     gap: 25px; */
}


card-body{
	font-size: 14px;
}

.card-team{
	display: flex;
    flex-direction: column;
    align-items: center;
}

.card-team .img-cyrcle{
	border-radius: 50% !important;
     height: 11rem; /*210px */
    width: 11rem;
    
    background-position: 50% 50%;
    margin: 0 auto;
    border: 7px solid;
	border-color: #5bba47;
	
    object-fit: cover;
    display: block;
    vertical-align: middle;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;	
}

.card-team p{
	font-size: 14px;
}

.navbar-nav .nav-item .nav-link{
    color:#fff;
	font-size: 13px;
}

.navbar-nav .nav-item{
    opacity: 1;
    transition: opacity 1s ease-in-out;
	padding: 10px;
}

.active, .navbar-nav .nav-item:hover{
    background-color: #fff;
    cursor: pointer;
    opacity: 1;
}
.navbar-nav .nav-item:hover > a{
    color:#000;
}
.active, .navbar-nav .nav-link:focus{
	color:#000!important;
}

#navbarNavDropdown{
    height: 77px;
    background-color: #5bba47f7 !important;
}



  #navbarNavDropdown ul, #navbarNavDropdown ul li{
    height: inherit;
  }

/* Стили для слайдера на всю ширину */
.carousel {
    width: 100%;
    margin: 0;
    padding: 0;
}

.carousel-inner, .carousel-item {
    width: 100%;
    height: 60vh; /* Высота относительно высоты экрана */
    min-height: 300px; /* Минимальная высота для маленьких экранов */
    max-height: 600px; /* Максимальная высота для больших экранов */
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Изображение заполняет контейнер, сохраняя пропорции */
}

/* Адаптивность слайдера */
@media (max-width: 768px) {
    .carousel-inner, .carousel-item {
        height: 40vh; /* Уменьшаем высоту на планшетах */
        min-height: 250px;
    }
    #navbarNavDropdown{
        height: auto!important;
    }
}

@media (max-width: 576px) {
    .carousel-inner, .carousel-item {
        height: 30vh; /* Еще меньше на мобильных */
        min-height: 200px;
    }
}

/* Стили для навигации */
.navbar-brand img {
    width: 100%;
    max-width: 150px; /* Настройте под ваш логотип */
    height: auto;
}

/* Секция "Что мы делаем" */
.what-we-do {
    background-color: #f5f5f5;
    padding: 50px 0;
    background-image: linear-gradient(0deg, rgba(43, 37, 60, 0.4), rgba(43, 37, 60, 0.4)), url(/assets/img/bg-wh.jpeg);
    background-position: 50% 100%; 
    object-fit: cover;
    background-size: cover;           
}

.what-we-do .card {
    border: none;
    text-align: center;
}

.what-we-do .card .card-title{
	font-size: 1.1rem!important;
}

/* Секция "Наши проекты" */
.projects {
    padding: 50px 0;
}

.projects .row {
    margin: 0;
}

.projects img {
    width: 100%;
    height: 200px;
/* 	height: auto; */
    object-fit: cover;
}

/* Секция "Награды" */
.awards {
    background-color: #f5f5f5;
    padding: 50px 0;
}

/* Секция "Наша команда" */
.team {
    padding: 50px 0;
}

.team img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 50%;
}

/* Секция "Связаться с нами" */
.contact {
    background-image: linear-gradient(0deg, rgba(43, 37, 60, 0.85), rgba(43, 37, 60, 0.85)), url(/assets/img/bg-footer.jpg);
    background-position: 50% 50%;
    object-fit: cover;
    background-size: cover;                
    color: white;
    padding: 50px 0;
}

.contact .btn {
    background-color: #ffc107;
    border: none;
}

.contact a{
	color:#fff;
}

.full-width-stripe {
    width: 100%;
    position: absolute;
    left: 50%;
    /* top: 50%; */
    transform: translate(-50%, -50%);
    height: 410px;
    background-color: #5bba47;
    text-align: center;
    margin-top: 310px;
}

/* slider */

.fullwidth-slider {
width: 100%;
height: auto; /* на всю высоту окна, можно изменить */
position: relative;
}

.swiper-slide {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}

.slide-img img {
width: 100%;
height: auto;
object-fit: cover; /* обрезает красиво по размеру */
}

.top-fixed{
    position: fixed;
    top: 0px;
    z-index: 9;
    background-color: #F5F4F0;
}

/* .navbar-light .navbar-nav .nav-link:focus{
	color: #fff!important;
} */

.swiper-button-next, .swiper-button-prev {
	color:#fff!important;
}

@media (min-width: 992px) {


    #navbarNavDropdown::before {
        content: "";
        position: absolute;
        left: 173px;
        width: 100px;
        height: 77px;
        background: white;
        z-index: 1;
        clip-path: polygon(0 100%, 0 0, 100% 100%);
      }
    
      #navbarNavDropdown::after {
        content: "";
        position: absolute;
        right: 6px;
        width: 100px;
        height: 77px;
        background: white;
        z-index: 1;
        clip-path: polygon(0 0, 100% 0, 100% 100%);
      }    
}

@media (max-width: 992px) {
    #navbarNavDropdown {
        /* height: auto !important; */
        /* border-radius: 10px; */
		
        position: fixed;        
        top: 0;        
        overflow-y: scroll;
        height: 100% !important;
        transition: right 0.2s;
        width: 60%;
        right: -60%;
    }
	#navbarNavDropdown ul li {
		height:auto!important;
	}
	.collapse.show {
		right: 0 !important;
	}
	.navbar-nav .nav-item:hover {
		background-color: transparent !important;
	}
	
	.navbar-light .navbar-toggler {
		border-color:transparent;
	}
	

    .active{
        width: 90%;
		border-radius: 5px;
        padding: 0px !important;
    }
    .active a{
        width: 100%;
        text-align: center;		
    }
    .navbar-nav{
        padding-top: 20px;
        padding-bottom: 20px;
    }
	.navbar-nav .nav-item {
		padding: 0px !important;
	}
	.projects img {
		width: 100%;
	    height: 200px!important;
		height: auto;
		object-fit: cover;
	}	
	
/* 	.what-we-do .card .card-title {
		font-size: 0.8rem !important;
	}	 */
}

.wp-video {
    width: 100% !important;
    height: auto !important;
}

.wp-video video {
    width: 100% !important;
    height: auto !important;
    display: block;
}