/* Start:/bitrix/templates/main/components/bitrix/photo/portfolio_new/bitrix/photo.sections.top/.default/style.css?175969900810301*/
.tabs {
    position: relative;

  }
	.slide-inner-wrapper-img .swiper-lazy-preloader{
		border: 4px solid #f0f0f0;
		border-top-color: transparent;
	}
.slide-inner-wrapper-img img[data-src] {
	/*display:none;*/
}
  .slider-portfolio_top-content{
    display: none;
  }
  .tabs input[name=tab-control] {
    display: none;
  }
  .tabs ul {
    list-style-type: none;
    padding-left: 0;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
  }
  .tabs ul li {
    box-sizing: border-box;
    flex: 1;
    width: 25%;
    padding: 0 10px;
    text-align: center;
    margin-bottom: 10px;
  }
  .tabs ul li label br {
    display: none;
  }
  .tabs .content {
    margin-top: 30px;
  }
  .tabs .content section {
    display: none;
    -webkit-animation-name: content;
    animation-name: content;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    line-height: 1.4;
  }
  .tabs input[name="tab-control"]:nth-of-type(1):checked ~ ul > li:nth-child(1),
  .tabs input[name="tab-control"]:nth-of-type(2):checked ~ ul > li:nth-child(2),
  .tabs input[name="tab-control"]:nth-of-type(3):checked ~ ul > li:nth-child(3),
  .tabs input[name="tab-control"]:nth-of-type(4):checked ~ ul > li:nth-child(4),
  .tabs input[name="tab-control"]:nth-of-type(5):checked ~ ul > li:nth-child(5),
  .tabs input[name="tab-control"]:nth-of-type(6):checked ~ ul > li:nth-child(6),
  .tabs input[name="tab-control"]:nth-of-type(7):checked ~ ul > li:nth-child(7),
  .tabs input[name="tab-control"]:nth-of-type(8):checked ~ ul > li:nth-child(8),
  .tabs input[name="tab-control"]:nth-of-type(9):checked ~ ul > li:nth-child(9),
  .tabs input[name="tab-control"]:nth-of-type(10):checked ~ ul > li:nth-child(10),
  .tabs input[name="tab-control"]:nth-of-type(11):checked ~ ul > li:nth-child(11),
  .tabs input[name="tab-control"]:nth-of-type(12):checked ~ ul > li:nth-child(12),
  .tabs input[name="tab-control"]:nth-of-type(13):checked ~ ul > li:nth-child(13),
  .tabs input[name="tab-control"]:nth-of-type(14):checked ~ ul > li:nth-child(14),
  .tabs input[name="tab-control"]:nth-of-type(15):checked ~ ul > li:nth-child(15),
  .tabs input[name="tab-control"]:nth-of-type(16):checked ~ ul > li:nth-child(16),
  .tabs input[name="tab-control"]:nth-of-type(17):checked ~ ul > li:nth-child(17) {
    cursor: default;
    color: #FFFFFF;
    background: #282a2f;
    border-color: #282a2f;
  }
  .tabs input[name=tab-control]:nth-of-type(1):checked ~ .content > section:nth-child(1),
  .tabs input[name=tab-control]:nth-of-type(2):checked ~ .content > section:nth-child(2),
  .tabs input[name=tab-control]:nth-of-type(3):checked ~ .content > section:nth-child(3),
  .tabs input[name=tab-control]:nth-of-type(4):checked ~ .content > section:nth-child(4),
  .tabs input[name=tab-control]:nth-of-type(5):checked ~ .content > section:nth-child(5),
  .tabs input[name=tab-control]:nth-of-type(6):checked ~ .content > section:nth-child(6),
  .tabs input[name=tab-control]:nth-of-type(7):checked ~ .content > section:nth-child(7),
  .tabs input[name=tab-control]:nth-of-type(8):checked ~ .content > section:nth-child(8),
  .tabs input[name=tab-control]:nth-of-type(9):checked ~ .content > section:nth-child(9),
  .tabs input[name=tab-control]:nth-of-type(10):checked ~ .content > section:nth-child(10),
  .tabs input[name=tab-control]:nth-of-type(11):checked ~ .content > section:nth-child(11),
  .tabs input[name=tab-control]:nth-of-type(12):checked ~ .content > section:nth-child(12),
  .tabs input[name=tab-control]:nth-of-type(13):checked ~ .content > section:nth-child(13),
  .tabs input[name=tab-control]:nth-of-type(14):checked ~ .content > section:nth-child(14),
  .tabs input[name=tab-control]:nth-of-type(15):checked ~ .content > section:nth-child(15),
  .tabs input[name=tab-control]:nth-of-type(16):checked ~ .content > section:nth-child(16),
  .tabs input[name=tab-control]:nth-of-type(17):checked ~ .content > section:nth-child(16) {
    display: block;
  }
  @-webkit-keyframes content {
    from {
      opacity: 0;
      transform: translateY(5%);
    }
    to {
      opacity: 1;
      transform: translateY(0%);
    }
  }
  @keyframes content {
    from {
      opacity: 0;
      transform: translateY(5%);
    }
    to {
      opacity: 1;
      transform: translateY(0%);
    }
  }
  .tabs ul {
    display: flex;
    margin-top: 4.942%;
    margin-bottom: 3.53%;
    gap: 20px;
  }
  .tabs ul li {
    border: 1px dashed #999;
    width: 100%;
    text-align: center;
    height: 75px;
    line-height: 75px;
    max-width: 267px;
    /*margin-right: 36px;*/
    cursor: pointer;
    transition: .3s;
  }
  .tabs ul li label {
    font-weight: 400;
    font-size: 1.25rem;
    transition: .3s;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0 20px;
  }
  .tabs ul li:hover, .tabs ul li.active {
    background: #282a2f;
    border-color: #282a2f;
  }
  .tabs ul li:hover label, .tabs ul.active a {
    color: #fff;
  }
.slide-overlay-text_title{
		margin-bottom: 0 !important;
	}
	.slide-overlay-text_more {
		margin-top: 2px !important;
	}
.slide-overlay-text {
  		padding: 2px 12px 7px !important;
		z-index: 101 !important;
	}
.slider-portfolio_all-photo {
    /*display: flex !important;*/
}
.slide-overlay-text_hide-text{text-align:left!important;}
.slide-overlay-text_title{font-size:18px!important;}

.slider-portfolio_container{
margin-bottom:20px;
}

@media (max-width: 1024px) {
	.fancybox-enabled body {
		overflow: auto !important;
	}
}

@media (max-width: 768px) {
    .slide-overlay-text_title{font-size:14px!important;}
	.slider-portfolio_container{padding:0 20% 0 0 !important;}
	.slider-portfolio_slide{max-width: 320px!important;margin-right: 1% !important;}
	.slider-portfolio_all-photo{
		right:20px!important;
	}
	.slide-overlay-text_hide-text{
		max-height: 130px;
		overflow-y: auto !important;
	}
	.slide-inner{
		width:100% !important;
    	position: relative;
	}
	.slider-portfolio_top-content{
        display: block;
    }
    .tabs .content section{
        display:block !important;
    }
    .tabs ul{
        display: none;
    }
	.swiper-pagination{
		display: none;
	}
	.slide-overlay-text_title{
		margin-bottom: 0px !important;
	}
	.slide-overlay-text_more {
		margin-top: 2px !important;
	}
	.slider-portfolio_top-content {
		margin-top: 0px !important;
	}
	.swiper-wrapper .swiper-slide img {
    	height: 240px;
	}
	.slider-portfolio_link{
		cursor: auto;
	}
	.slide-overlay-text {
  		padding: 2px 12px 7px !important;
		z-index: 101 !important;
	}

}


/* Вывод видео */
.video__image {
        display: inline-block;
        position: relative;
        cursor: pointer
    }

    .video__image img {
        vertical-align: middle;
        border-radius: 12px
    }
.video__image {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9; /* Стандартное соотношение для видео */
    overflow: hidden;
}

.video__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
    .video-preview {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        background-color: rgba(0,0,0,0.3);
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 12px
    }

    .video-preview__circle {
        width: 66px;
        height: 66px;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: rgba(0,0,0,0.5) 0 4px 20px 0.5px;
        background-color: rgba(255,255,255,0.8);
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        transition: 0.3s;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s
    }

    .video-preview:hover .video-preview__circle {
        background-color: #fff;
        transform: scale(1.05,1.05);
        -webkit-transform: scale(1.05,1.05);
        -moz-transform: scale(1.05,1.05);
        -ms-transform: scale(1.05,1.05);
        -o-transform: scale(1.05,1.05)
    }

    @media (max-width: 767px) {
        .video-preview__circle {
            width: 46px;
            height: 46px
        }

        .fancybox-slide {
            padding: 0
        }
    }

    .video-play-button {
        position: absolute;
        z-index: 10;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        box-sizing: content-box;
        display: block;
        width: 32px;
        height: 44px;
        border-radius: 50%;
        padding: 18px 20px 18px 28px
    }

    .video-play-button:before {
        content: "";
        position: absolute;
        z-index: 0;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        display: block;
        width: 80px;
        height: 80px;
        background: #d1cece;
        border-radius: 50%;
        animation: pulse-border 1500ms ease-out infinite
    }

    .video-play-button:after {
        content: "";
        position: absolute;
        z-index: 1;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        display: block;
        width: 80px;
        height: 80px;
        background: #393C42;
        border-radius: 50%;
        transition: all 200ms
    }

    .video-play-button:hover:after {
        background-color: #e6e6e6
    }

    @keyframes pulse-border {
        0% {
            transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
            opacity: 1
        }

        100% {
            transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
            opacity: 0
        }
    }

    .video-preview__triagle {
        border: 15px solid transparent;
        border-left: 25px solid #fff;
        position: relative;
        z-index: 11;
        left: 9px
    }
/* End */
/* /bitrix/templates/main/components/bitrix/photo/portfolio_new/bitrix/photo.sections.top/.default/style.css?175969900810301 */