.home_hero_section video{height: 100dvh; width: 100%; object-fit: cover; opacity: .4; position: relative; z-index: 0}
.home_hero_section .hero_text h1{color: #fff; text-transform: uppercase; font-weight: 800}
.home_hero_section .hero_text h6{color: #fff; font-size:24px; font-weight: 300; margin-top: 16px}
.about{text-align: center;}
.about p{text-align: left;}
.home_hero_section{background: #000000; display:flex;position: relative; justify-content: center;align-items: center;}
.home_hero_section .hero_text{position: absolute;  z-index: 1}
.home_hero_section .scroll-down{position: absolute; z-index: 1; bottom: 40px; display: block;width: 100%;right: initial;text-align: center;max-width: 50px;}

/*Portfolio slider*/
.portfolio-slider video{height: 90dvh;width: 100%;object-fit: cover;opacity: 0.5;}
.portfolio-slider img{height: 90dvh;width: 100%;object-fit: cover;opacity: 0.5;}
.portfolio-slider .sliderContainer{position: relative;}
.portfolio-slider .slider{width: 100%}
.portfolio-slider .slick-slide{color: white;padding:0;font-size: 0px;text-align: center;background: #000}
.portfolio-slider .slick-prev:before,.slick-next:before{color: black}
.portfolio-slider .slick-dots{bottom: -30px}
.portfolio-slider .progressBarContainer{position: absolute;bottom: 20px;width:100%; display: flex; gap: 16px; padding:24px 40px}
.portfolio-slider .progressBarContainer h3{font-size: 12px; text-transform: uppercase; color: #ffffff;line-height: normal;padding: 26px 0 6px 0;transition: ease-in-out all 0.3s; text-align: left; font-weight: 400}
.portfolio-slider .progressBarContainer div{display: block;width: 25%;padding: 0;cursor: pointer;}
.portfolio-slider .progressBarContainer div:last-child{margin-right: 0}
.progressBarContainer div span.progressBar{width: 100%;height: 4px;background-color: rgba(255, 255, 255, 0.4);display: block}
.portfolio-slider .progressBarContainer div span.progressBar .inProgress{background-color: rgba(255, 255, 255, 1);width: 0%;height: 4px}
.portfolio-slider .item{display: flex !important; position: relative  !important;justify-content: left !important; align-items: center  !important;}
.portfolio-slider .item .hero_text{position: absolute; z-index: 1; text-align: left; width: 50%; left: 40px}
.portfolio-slider .item .hero_text h4{ text-align: left; font-weight: 500}
.portfolio-slider .item .hero_text .jobs{display: flex; margin-top: 8px}
.portfolio-slider .item .hero_text .jobs h6{font-size: 16px; font-weight: 400; padding-right: 24px; margin-bottom: 24px}
.portfolio-slider .progressBarContainer div:hover h3{padding: 16px 0 16px 0;}

/*Portfolio slider*/

.services-slider .item{position: relative; display: block; transition: ease-in-out all 0.4s; overflow: hidden;}
.services-slider .item:hover .overlay .btn{opacity: 1}
.services-slider .item:hover .overlay{bottom: 0px}
.services-slider .item:hover img{scale:1.1}
.services-slider .item img{ transition: ease-in-out all 0.4s;}
.services-slider .item .overlay{position: absolute; z-index: 1; padding: 132px 32px 32px 32px; color: white; bottom: -20px;transition: ease-in-out all 0.4s;    width: 100%; background: #000000;
background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.02) 60%);
background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.02) 60%);
background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.02) 60%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=0);}
.services-slider .item .overlay h6{padding-bottom: 8px; text-align: left}
.services-slider .item .overlay .btn{ opacity: 0; transition: ease-in-out all 0.4s;color: white; padding-left: 4px; display: flex; font-size: 16px; }
.services-slider .item .overlay .btn img{ margin-left: 6px;}
/*.services-slider .slick-slide{width: 540px !important}*/

.seven-years-slider .item{background: black; color: #fff;display: flex !important;    align-items: center;justify-content: space-around; padding: 0 48px; height: 600px; overflow: hidden;}
.seven-years-slider .item.harman video{width:600px }
.seven-years-slider .item.cgh video{width:400px }
.seven-years-slider .item.phoenix video{width:700px }
.seven-years-slider .item h6{font-size: 24px;text-align: left}
.seven-years-slider .item p{text-align: left}
.seven-years-slider .item h4{text-align: left}






@media only screen and (min-width: 320px) and (max-width: 900px){

.home_hero_section .hero_text h1{font-size: 40px; line-height: 40px; text-align: center;}
.home_hero_section .hero_text h6{font-size: 14px; margin-top: 4px; text-align: center}
.home_hero_section video{height: 100dvh;}
.home_hero_section .scroll-down {width: 100%; right: initial; text-align: center;}
.seven-years-slider .item{flex-direction: column;justify-content: flex-start;padding: 48px 20px; text-align: center;    height: 450px;}
.seven-years-slider .item.harman video {width: 360px;margin-top: -49px;z-index: 0;}
.seven-years-slider .item.phoenix video {width: 460px;margin-top: 0px;}
.seven-years-slider .item.cgh video {width: 260px;padding-top: 15px;}
.seven-years .slick-slide {padding: 0 1px;}
.seven-years-slider .item h4 {text-align: center;}
.seven-years-slider .item p {text-align: center;}
.seven-years-slider .item h6 {font-size: 14px;text-align: center;}
.seven-years-slider .item .video{height: 350px;        display: flex;  align-items: center;}
.seven-years-slider .item .data{height: 350px;display: flex;  align-items: center;flex-direction: column; z-index: 1}
.portfolio-slider video, .portfolio-slider img { height: 70dvh;}
.portfolio-slider .item .hero_text {width: 70%;}
.portfolio-slider .item .hero_text .jobs {display: none;}
.portfolio-slider .item .hero_text h4 {padding-bottom:24px }
.portfolio-slider .progressBarContainer h3 {font-size: 10px;}
.CTA h1{text-align: center;}
.CTA .title{padding-bottom: 20px;}
.CTA .cta-link{padding-bottom: 30px;}
.portfolio-slider .progressBarContainer {gap: 8px}
.services-slider .item .overlay {padding: 11px 15px;bottom: 0px;}
.services-slider .item .overlay .btn{display: none}
.services-slider .item .overlay h6 {font-size: 18px;font-weight: 500;}
.CTA{display: none}
.services-home-slider{padding-bottom: 0}
}

@media only screen and (min-width: 700px) and (max-width: 900px){
.services-home-slider { padding-bottom: 50px;}
.home_hero_section video {height: 60dvh;}
.portfolio-slider video, .portfolio-slider img {height: 55dvh;}
}




@media (width >= 2560px) {
    .home_hero_section video {height: 60dvh;}
    .portfolio-slider video, .portfolio-slider img{height: 55dvh;}
}


   @media (max-width: 767px) {
    .services-slider {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0px;
    }

    .services-slider > * {
        width: 100% !important;
        margin: 0 !important;
    }
}
