@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600&family=Public+Sans:wght@100;200;300;400;500;600;700&display=swap');
.mt-3{margin-top: 10px}
.top-new-header{background-color: #F7F7F7;border-bottom: 1px solid #ECECEC;padding: 5px;font-family: 'Poppins',sans-serif;}
.new-top{display: flex;align-items: center;justify-content: space-between;}
.new-top .new-top-left{display: flex;align-items: center;}
.new-top .new-top-left a{color: #7D8C97;font-size: 14px}
.new-top .new-top-left a:hover{color: #041C2C;transition: color 0.3s;}
.new-top .new-top-left a i{font-size: 16px;margin-right: 5px}

.new-top-left .left-one{margin-right: calc(80px/2);}

.new-top .new-top-right{display: flex;align-items: center;}
.new-top .new-top-right a{color: #7D8C97;font-size: 14px}
.new-top .new-top-right a:hover{color: #041C2C;transition: color 0.3s;}
.new-top .new-top-right a i{font-size: 16px;margin-right: 5px}
.new-top-right .right-one a{margin-right: calc(10px/2);}
.new-top-right .right-one a i{font-size: 18px}
.new-top-right .right-two {margin-left: calc(50px/2);}

@media only screen and (max-width: 500px) {
	.left-two{display: none;}
	.right-one{display: none;}
}

.right-two ul {
    width: 130px;
    height: 40px;
    border: 1px solid #ccc;
    background: #fff;
}
.right-two ul li { padding: 5px 10px; z-index: 9999999; background: #ffffff;}
.right-two ul li:not(.init) {display: none;}
.right-two ul li:not(.init):hover, ul li.selected:not(.init) { background: #ffffff; }
.right-two li.init { cursor: pointer; }

.right-two ul li a{color: #7D8C97;font-size: 14px}
.right-two ul li a img{margin-right: 5px}

.new-product{border: 1px solid #ededed;margin-bottom: 10px;width: 100%}

.new-product .new-product-name{background: #f7f7f7;padding: 13px 15px 15px;border-top: 1px solid #ededed;text-align: center;font-size: 16px;width: 100%;display: flex;align-items: center;justify-content: center;min-height: 80px}
.new-product .new-product-name a{color: #222222}
.new-product .new-product-name a:hover{color: var(--renk)}

.new-product .imageBox {
  position: relative;
}

.new-product .imageBox .hoverImg {
  position: absolute;
  left: 0;
  top: 0;
  display: none;
}

.new-product .imageBox:hover .hoverImg {
  display: block;
}


/*Yeni slider seciton*/

.new-slider{position: relative;width: 100%;height: 70vh;border-bottom: 1px solid #ededed;}

.new-slider .bannerVideo{position: absolute;top: 0px;left: 0;width: 100%;height: 100%;}
.new-slider .bannerVideo video{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;opacity: 0}
.new-slider .bannerVideo video.active{opacity: 0.7}


.new-slider .bannerVideo img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;opacity: 0}
.new-slider .bannerVideo img.active{opacity: 0.7}

.new-slider .container .content{position: absolute;top:25%;color: #000}
.new-slider .container .content .bannerText{position: relative;max-width: 700px;}
.new-slider .container .content .bannerText div{display:none;transition: 0.5s ease-in-out;}
.new-slider .container .content .bannerText div.active{display:initial;}
.new-slider .container .content .bannerText div h3{font-size: 4em;line-height: 1em;font-weight: 700;text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);}
.new-slider .container .content .bannerText div p{font-size: 18px;margin: 20px 0;}
.new-slider .container .content .bannerText div a{padding: 10px}

.control{position: absolute;bottom: 0;right: 0;display: flex;}
.control li{width: 80px;height: 80px;display: flex;align-items: center;justify-content: center;background: #fff;cursor: pointer;}
.control li:hover{background: #f5f5f5}

@media only screen and (max-width: 400px) {
  .new-slider{height: 70vh;}
}

@media only screen and (min-width: 400px) and (max-width: 600px) {
  .new-slider{height: 60vh;}
}











.video-slider{position: relative;width: 100%;height: 70vh}
.video-slider video{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.video-slider .slider-image{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}

.video-slider .slide-navigation{position: absolute;bottom: 40px;left: 50%;transform: translateX(-50%);z-index: 100;display: flex;align-items: center;justify-content: center;}

.video-slider .slide-navigation li{list-style: none;cursor: pointer;margin: 0 10px;border-radius: 4px;background: #fff;padding: 3px;opacity: 0.7;transition: 0.5s}

.video-slider .slide-navigation li:hover{opacity: 1}

.video-slider .slide-navigation li img{width: 30px;transition: 0.5s}
.video-slider .slide-navigation li img:hover{width: 50px;}

@media only screen and (max-width: 500px) {
  .video-slider{position: relative;width: 100%;height: 50vh}
  .video-slider .slide-navigation li{margin: 0 5px;padding: 1px}
  .video-slider .slide-navigation li img{width: 30px;transition: 0.5s}
}