/*ürün Grupları*/
.grupalan{position:relative; z-index:1;}
.grupbaslikalan{height:60px; position:relative; top:-145px;}
.grupbaslik{background:#1f1646; padding:0 25px; color:#fff; position:relative;}
.grupbaslik .baslik{color:#fff; margin-left:15px; font-weight:500; font-size:16px;}
.grupbaslik svg{width:20px;}

.grupyaz{background:#F1F1F1; position:relative; margin-top:-145px;}

.grupyaz .urungrupdiz{display:block; text-align:center; color:#444; border-right:1px solid rgba(0,0,0,0.1); padding:30px 0 40px 0;}
.grupyaz .urungrupdiz .baslik{display:block; padding:0 0 30px 0; font-size:25px;font-weight: 800;}
.grupyaz .urungrupdiz .say{display:block; font-size:50px; font-weight:700; line-height:50px;}
.grupyaz .urungrupdiz .sayyaz{display:block; font-size:20px; font-weight:400;}
.grupyaz .urungrupdiz .ikon{display:block; font-size:90px; transition:.2s;}
.grupyaz .urungrupdiz:hover .ikon{color:#03e9ca; transform:scale(1.1);}
.grupyaz .urungrupdiz:hover .baslik,.grupyaz .urungrupdiz:hover .say,.grupyaz .urungrupdiz:hover .sayyaz{color:#444;}

.urungrupoklar{margin-left:15px;}
.urungrupoklar button{background:none; border:none; color:#fff; transition:.2s;}
.urungrupoklar button:hover{color:#03e9ca;}
.urungrupoklar button.owl-next:hover{transform:translateX(5px);}
.urungrupoklar button.owl-prev:hover{transform:translateX(-5px);}

/*Arama*/
.aramaalan{background: #fff; width:100%; position:relative; top:-30px; z-index:2; padding:50px 0 100px 0;}
.aramaalan svg.gradientgb{width:45%; position:absolute; left:50%; transform:translateX(-50%); top:-100px; z-index:1;}
.aramaalan svg.gradientgb path{fill:url(#gradient)}
.aramaalan .container{position:relative; z-index:10;}
.aramaalan .arama{padding:100px 0;}
.aramaalan .sol{}
.aramaalan .sol .logo{width:185px;}
.aramaalan .sol .baslik{font-size:52px; line-height:87px; font-weight:700; color:#1f1646; letter-spacing:-2px; margin:25px 0;}
.aramaalan .sol .h-buton{margin-top:5px;}

.aramaalan .sag{}
.aramaalan .sag .baslik{font-size:16px; color:#fff;}

.aramaalan .sag .ara input{background:none; border:none; height:52px; font-size:22px; font-weight:300; padding:0 20px;}
.aramaalan .sag .ara .buton{color:#fff; background:#1f1646; font-size:24px; padding:0 25px; border-radius:10px;}
.aramaalan .sag .ara .buton:hover{background:#03e9ca;}
.aramaalan .sag .acikla{font-size:12px; color:#fff;}


.anahakk{}
.anahakk .kucukbaslik{font-size:24px; font-weight:700;}
.anahakk .baslik{font-size:52px; font-weight:700; color:#03e9ca; letter-spacing:-3px; line-height:58px;}
.anahakk .acikla{font-size:16px; font-weight:300; margin-top:45px;}
.anahakk .sag{text-align:center;}
.anahakk svg{width:50%;}
.anahakk svg path{fill:#03e9ca;}

/*Faaliyet Alanları*/
.faaliyetalan{background:#f1f1f1; padding:0px 0;}
.faaliyetalan .anabaslik{font-size: 62px;
    letter-spacing: -3px;
    font-weight: 700;
    color: #1f1646;
    line-height: 68px;
    margin: 15px 0;}
.faaliyetalan .anaacikla{font-size:16px;}
.faaliyetalan .faaliyetler{margin-top:40px;}
.faaliyetalan .faaliyetler .faaliyetdiz{padding:15px; background:#fff; transition:.3s; -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1); box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);}
.faaliyetalan .faaliyetler .faaliyetdiz:hover{background:#1f1646; color:#fff; transform:translateY(-15px)}
.faaliyetalan .faaliyetler .faaliyetdiz:hover .ikon i{transform:scale(1.2)}
.faaliyetalan .faaliyetler .faaliyetdiz .ikon{font-size:62px; color:#03e9ca;}
.faaliyetalan .faaliyetler .faaliyetdiz .ikon i{transition:.3s;}
.faaliyetalan .faaliyetler .faaliyetdiz .baslik{font-size:24px; letter-spacing:-1px; font-weight:300;}
.faaliyetalan .faaliyetler .faaliyetdiz .say{font-size:52px; line-height:57px; font-weight:700;}
.faaliyetalan .faaliyetler .faaliyetdiz .sayjson{font-size:52px; line-height:57px; font-weight:700;}
.faaliyetalan .faaliyetler .faaliyetdiz .acikla{font-size:16px; font-weight:500;}


/*Şubeler*/
.subeleralan{padding:70px 0;}
.subeleralan .logo img{width:135px;}
.subeleralan .baslik{font-size:62px; letter-spacing:-3px; font-weight:700; color:#1f1646; line-height:68px; margin:15px 0;}
.subeleralan .acikla{font-size:16px;}

/*Haberler*/
.haberalan{padding:70px 0;}
.haberalan .anabaslik{font-size:62px; letter-spacing:-3px; font-weight:700; color:#1f1646; line-height:68px; margin:0;}
.haberalan .haberler{margin-top:40px;}
.haberalan .haberler a{display:block;}
.haberalan .haberler a:hover{transform:translateY(-10px)}
.haberalan .haberler span{display:block;}
.haberalan .haberler .baslik{font-size:20px; font-weight:700; color:#444; margin:20px 0 10px 0;}
.haberalan .haberler .acikla{font-size:16px; font-weight:400; color:#444;}

/*Katalog*/
.katalogalan{padding:70px 0; background:#f1f1f1;}
.katalogalan .baslik{font-size:62px; letter-spacing:-3px; font-weight:700; color:#1f1646; line-height:68px; margin:15px 0;}
.katalogalan .acikla{font-size:16px;}
.katalogalan .katalogresim{position:relative;}
.katalogalan .katalogresim img{position:absolute; width:100%; left:50%; top:-50px; transform:translateX(-50%);}

/*Galeri*/
.galerialan{padding:70px 0 0 0;}
.galerialan .baslik{font-size:62px; letter-spacing:-3px; font-weight:700; color:#03e9ca; line-height:68px; margin:15px 0;}
.galerialan .galeriler{margin-top:40px;}
.galerialan .galeriler .galeridiz{display:block; height:400px; overflow:hidden;}
.galerialan .galeriler .galeridiz span{display:block; width:100%; height:100%; background-size:cover; transition:.4s; filter:grayscale(1)}
.galerialan .galeriler .galeridiz:hover span{transform:scale(1.2); filter:grayscale(0)}
.galerialan .galerilermobil{display:none;}
.galerialan .galerilermobil .galeridiz{display:block; height:400px; overflow:hidden;}
.galerialan .galerilermobil .galeridiz span{display:block; width:100%; height:100%; background-size:cover; transition:.4s; filter:grayscale(1)}
.galerialan .galerilermobil .galeridiz:hover span{transform:scale(1.2); filter:grayscale(0)}


/*Laptop*/
@media (max-width: 1460px) {
.aramaalan .sol .baslik{font-size:42px; line-height:77px;}
.anahakk .baslik{font-size:38px; line-height:42px;}
.faaliyetalan .anabaslik, .subeleralan .baslik, .katalogalan .baslik, .galerialan .baslik, .haberalan .anabaslik{font-size:52px; line-height:58px; letter-spacing:-2px;}
.faaliyetalan .faaliyetler .faaliyetdiz .baslik{font-size:20px;}
}

/*Tablet*/
@media (max-width: 1150px) {
    .aramaalan .sol .baslik{font-size:52px; line-height:57px;}
    .galerialan .galeriler{display:none;}
    .galerialan .galerilermobil{display:block;}
    .faaliyetalan .anabaslik, .subeleralan .baslik, .katalogalan .baslik, .galerialan .baslik, .haberalan .anabaslik{font-size:42px; line-height:48px; letter-spacing:-2px;}
}

/*Mobil*/
@media (max-width: 968px) {
    .aramaalan .sol .baslik{font-size:44px; line-height:44px;}
    .aramaalan .sag .baslik{font-size:16px; margin:25px 0;}
    .aramaalan .sag .ara input{font-size:14px;}
    .aramaalan svg.gradientgb{display:none;}
    .aramaalan .arama{padding:50px 0;}
    .anahakk .baslik{font-size:32px; line-height:37px; letter-spacing:-1px;}
    .anahakk .kucukbaslik{font-size:16px;}
    .anahakk .acikla{margin-top:25px;}
    .anahakk .sag svg{display:none;}
    .katalogalan .katalogresim{display:none;}
}

.product-finder-btn{align-items:center;-webkit-appearance:none;background:#03e9ca;border:none;border-radius:0;border-top-left-radius:0px;border-top-right-radius:0px;bottom:0;box-shadow:-3px -1px 8px 0 rgba(0,0,0,.3);cursor:pointer;display:flex;flex-flow:row;height:60px;justify-content:space-between;overflow:hidden;position:fixed;right:calc(50% - 120px);width:240px;z-index:300}@media screen and (min-width:991px)
    {.product-finder-btn{bottom:auto;right:0;top:50%;transform:rotate(-90deg) translate(60px,120px);transform-origin:bottom}}
    .product-finder-btn__text{color:#000;display:block;font-family: 'Titillium Web', sans-serif;font-size:16px;font-style:normal;font-weight:600;padding-left:25px;text-transform:uppercase}
    .product-finder-btn__icon{display:block;height:100%;position:relative;width:60px}
    .product-finder-btn__icon:before{background:#a5a8b5;border-radius:50%;content:"";height:200px;left:0;position:absolute;top:0;transform:translateY(-56px);width:200px}
    .product-finder-btn__icon .grid-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}


.video-play-button {
  position: absolute;
  z-index: 10;
  top: 65%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  /* background: #fa183d; */
  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: #1f1646;
  border-radius: 50%;
  -webkit-animation: pulse-border 1500ms ease-out infinite;
          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: #1f1646;
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: #1f1646;
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 32px solid #fff;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
}

@-webkit-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;
  }
}

@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-overlay {
  position: fixed;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0;
  transition: all ease 500ms;
}

.video-overlay.open {
  position: fixed;
  z-index: 1000;
  opacity: 1;
}

.video-overlay-close {
  position: absolute;
  z-index: 1000;
  top: 15px;
  right: 20px;
  font-size: 36px;
  line-height: 1;
  font-weight: 400;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  transition: all 200ms;
}

.video-overlay-close:hover {
  color: #fa183d;
}

.video-overlay iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  /* width: 90%; */
  /* height: auto; */
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.75);
}