﻿.homeTopArea{ width:100%; font-size:0; position:relative }
.homeTopArea img{ width:100%; height:auto; position:absolute; top:50%; left:0; transform:translateY(-50%)  }
.owl-carousel.cihazlar { width:100%; height:100%; }
.owl-carousel.cihazlar .item { position:relative}
.owl-carousel.cihazlar .owl-item img{ width:100%; height:auto; position:absolute; top:50%; transform:translateY(-50%)}
.owl-carousel.cihazlar .owl-dots{ position:absolute; left:2%; bottom:5%;}

.cihazlar-area { float:none; position:relative; width:100%;}
.cihazlar-area .cihazlar-menu, .cihazlar-area .slider-area {float:left; position:relative}
.cihazlar-area .cihazlar-menu{ width:25%; background:#1b2429; padding:0 55px 0 80px }
.cihazlar-area .slider-area {width:75%}
.cihazlar-menu, .bottom-right, .slider-area { height:610px}
.cihaz-slider .title {width:33.3%; background:#f5f5f5; position:relative}
.cihaz-slider .title div { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:15px; color:#626262; line-height:20px; width:100%; padding: 0 30px}
.cihaz-slider .title div h3 { margin:0 0 30px 0; font-size:24px; color:#0971ce; line-height:normal; letter-spacing:-1px}
.cihaz-slider { width:100%; font-size:15px; height:100%;background:#37474f; opacity:0; position:absolute; top:0; right:0}
.cihaz-slider.current{ opacity:1; z-index:3;}
.cihaz-slider .title {width:33.4%; background:#f5f5f5; position:relative; opacity:0;-webkit-transition: all .5s;-moz-transition: all .5s; -o-transition: all .2s; transition: all .5s }
.cihaz-slider.current .title {opacity:1;}
.cihaz-slider .title div { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:15px; color:#626262; line-height:20px}
.cihaz-slider .title div h3 { margin:0 0 30px 0; font-size:24px; color:#0971ce; line-height:normal}

#exLink {display:none;}
#tab-1284 #exLink, #tab-465 #exLink {display:block; position:relative; padding-left:15px; font-size:15px; color:#0971ce; text-decoration:underline; font-weight:bold;}

#tab-1284 #exLink img, 
#tab-465 #exLink img {position:absolute; left:0; top:8px; -ms-transform: rotate(270deg); -webkit-transform: rotate(270deg); transform: rotate(270deg);}

.cihazlar-area h3{ font-size:25px; font-weight:700; color:#fff; margin:105px 0 55px }
.cihazlar-area h3 span{ font-size:38px; font-weight:700; color:#c0ca33;font-family: 'Kalam', cursive; width:100%; clear:both;display:block;    line-height: 43px;  }
.cihazlar-area .menu-area  { width:100%; display:block; margin-bottom:105px}
.cihazlar-area .menu-area  span  {  font-size:15px; font-weight:500; clear:both; display:inline-block;color:#fff; padding:13px 43px 13px 43px; margin:1px 0;-webkit-border-radius: 25px;-moz-border-radius: 25px; border-radius:25px; position:relative; cursor:pointer;letter-spacing: -0.2px;}
.cihazlar-area .menu-area  span:after  { width:5px; height:5px; border-radius:50%;-webkit-border-radius: 50%;-moz-border-radius: 50%; position:absolute; top:18px; left:19px; background:#fff; content:"" }
.cihazlar-area .menu-area  span:hover:after, .cihazlar-area .menu-area span.select:after  {  background:#1b2429; font-weight:700;}
.cihazlar-area .menu-area  span:hover, .cihazlar-area .menu-area span.select   {  background:#fff; color:#1b2429;  }
.owl-carousel.urun-slide, .cihazlar-area .slider-area .title { float:left; height:100%}
.owl-carousel.urun-slide { width:66.7%;    float: none;    position: absolute;    right: 0;}
.owl-carousel.urun-slide .owl-item .urun-slide-img { width:100%;  height:61%; position:relative }
.owl-carousel.urun-slide.c-457 .owl-item .urun-slide-img, .owl-carousel.urun-slide.c-1281 .owl-item .urun-slide-img  {  height:42%; }
.owl-carousel.urun-slide.c-464 .owl-item .urun-slide-img, .owl-carousel.urun-slide.c-1283 .owl-item .urun-slide-img  {  height:45%; }
.owl-carousel.urun-slide .owl-item .urun-slide-img img { height:auto; width:auto; max-height:85%; position:absolute; max-width:86%; bottom:0; left:50%; transform:translateX(-50%); position:absolute  }
.owl-carousel.urun-slide.c-457 .owl-item .urun-slide-img img, .owl-carousel.urun-slide.c-1281 .owl-item .urun-slide-img img { max-height:94%; }
.owl-carousel.urun-slide .owl-item .grad-button {  position:relative; width:100%; max-width:100% }
.owl-carousel.urun-slide .item{ position:relative; padding:0 40px}
.owl-carousel.urun-slide .owl-item.active .item:after{position:absolute; height:100%; width:1px; top:0; left:-1px; background:#d6d6d6; content:""}
.owl-carousel.urun-slide .owl-item ul { width:100%; height: 25%;    /*padding-top: 15px;*/  padding-top: 20px;   }
.owl-carousel.urun-slide .owl-item ul li { float:left; font-size:11px; color:#263339; margin:2px 0; position:relative }
.owl-carousel.urun-slide .owl-item ul li.first { font-size:15px; font-weight:700; margin-bottom:15px; width:100%; clear:both; float:none }


.owl-carousel.urun-slide .owl-item ul li:nth-child(2n+2) { width:100%; clear:both}
.owl-carousel.urun-slide .owl-item ul li:nth-child(2n+1) { padding-left:0px}
.owl-carousel.urun-slide .owl-item ul li:nth-child(2n+1):after { position:absolute; left:0px; top:0; content:":"}
      .owl-carousel.urun-slide .owl-item ul li.palmiye:nth-child(2n+2) {  width: 50%;   clear: both;}
        .owl-carousel.urun-slide .owl-item ul li.palmiye:nth-child(2n+1) {   padding-left: 5px;}
.owl-carousel.urun-slide .owl-item ul li.first:after{ display:none; }
.owl-carousel.urun-slide .owl-item ul li.first{ padding-left:0}
.owl-carousel.urun-slide, .owl-carousel.urun-slide .owl-stage, .owl-carousel.urun-slide .owl-item, .owl-carousel.urun-slide .item  { height:100%}
.owl-carousel.urun-slide .owl-stage-outer { height:81%; background:#ffffff}
.owl-carousel.urun-slide .owl-nav, .owl-carousel.urun-slide .owl-dots{ position:absolute; bottom:44px; right:10%; margin:0; padding:0}
.owl-carousel.urun-slide .owl-dots{left:10%; right:auto}
.owl-theme.urun-slide.arrow1.light .owl-nav .owl-next { margin-left:60px}

.bottomc-area { width:100%; background:#007cc4 }
.bottomc-area .left, .bottomc-area .right { width:50%; float:left; position:relative}
.bottomc-area .left img { width:100%; display:block }

.leftLinkContent{ position:absolute; top:0; left:0; padding:70px 0 0 70px;}
.leftLinkContent h3{ font-size:25px; font-weight:700; color:#0971ce; margin:5px 0 25px }
.leftLinkContent h3 span{ font-size:38px; font-weight:700; color:#263339;font-family: 'Kalam', cursive; width:100%; clear:both;display:block;  line-height: 43px;  margin:-10px 0 0 20px }

.leftLinkContent span.txt{ color:#263339; font-size:16px; display:block; max-width:400px; margin-bottom:35px;}

.bottomc-area .right { padding:90px 75px 0}
.bottomc-area .right h3 { font-size:24px; font-weight:700; color:#00e5ff; margin-bottom:40px}
.bottomc-area .right .slide-left, .bottomc-area .right .slide-right {  width:50%; float:left; position:relative; }
.bottomc-area .right .slide-left a { color:#fff}
.bottomc-area .right .slide-left h4 { font-size:24px; line-height:32px; font-weight:700;color:#fff; letter-spacing:-1px }
.bottomc-area .right .slide-left p { font-size:16px; line-height:21px; font-weight:400; margin:20px 0 35px }
.bottomc-area .right .slide-left span { display:block; font-size:11px; line-height:16px; font-weight:400; }
.bottomc-area .right .slide-right img { width:auto; max-width:100%; display:block; margin:0 auto }
.owl-carousel.cihazlar-bottom .owl-dots {    left: 0;    bottom: -70px;}
.cihazlar-menu-mobil { display:none}

.mobile-show {display: none;}
    .mobile-hide {display: block;}


@media screen and (max-width:1680px) 
{
.cihazlar-area {   margin-top: -35px;}
.cihazlar-area .cihazlar-menu { padding:0 50px}
.bottomc-area .right {    padding: 64px 75px 0;}
    .homeTopArea img { top:0; transform:none}
}

@media screen and (max-width:1560px) 
{
    .homeTopArea img {
        top: 50%;
        transform: translateY(-50%);
    }
.cihazlar-area .cihazlar-menu { padding:0 20px}
.cihazlar-area h3 {    margin: 70px 0 35px;}
.cihazlar-area .menu-area {    margin-bottom: 70px;}
.bottomc-area .right {    padding: 30px 25px 0;}
.bottomc-area .right h3 {margin-bottom: 20px;    font-size: 18px;}
.bottomc-area .right .slide-left p {margin: 20px 0 20px;    font-size: 14px; line-height:18px}
.bottomc-area .right .slide-left h4{font-size: 17px;line-height: 22px;}
.owl-carousel.cihazlar-bottom .owl-dots {    bottom: -40px;}
.cihaz-slider .title div { padding:  0 35px}
.leftLinkContent{ padding:35px 0 0 35px;}
.owl-carousel.urun-slide .item{ padding:0 20px}
.cihazlar-area {   margin-top:auto;}

}
@media screen and (max-width:1024px) 
{
.homeTopArea { height:auto !important}
.homeTopArea img { position:relative; top:auto; left:auto; transform:none}
.cihazlar-area .cihazlar-menu { width:33%}
.cihazlar-area .slider-area { width:67%}
.owl-carousel.urun-slide, .cihazlar-area .slider-area .title {display:none}
.owl-carousel.urun-slide { width:100%}
.bottomc-area .right .slide-left p {    margin: 5px 0;}
.bottomc-area .right h3 {margin-bottom: 5px;}
.bottomc-area .right .slide-left h4 { font-size:15px}
.leftLinkContent { width:60%}
.owl-carousel.urun-slide .owl-item ul { width:82%; margin:auto}
.owl-carousel.urun-slide .owl-item ul li.palmiye:nth-child(2n+2) { width:40%}
#tab-457 .owl-carousel.urun-slide .owl-item ul li.palmiye:nth-child(2n+2), #tab-1281 .owl-carousel.urun-slide .owl-item ul li.palmiye:nth-child(2n+2) { width:50%}
#tab-457 .owl-carousel.urun-slide .owl-item ul, #tab-1281 .owl-carousel.urun-slide .owl-item ul { width:80%; }
}
@media screen and (max-width:768px) 
{

    .mobile-show {display: block;}
    .mobile-hide {display: none;}


.cihazlar-area .cihazlar-menu { width:100%}
.cihazlar-area .slider-area { width:100%}

.cihazlar-menu-mobil{color:#0971ce;border:1px solid #fff; background:#fff; -webkit-border-radius: 50px;-moz-border-radius: 50px;border-radius: 50px;width:100%; max-width:300px; margin:0 auto;text-align:left;font-size: 13px;font-weight:bold;padding-left:22px;height:44px;line-height:44px;position:relative;cursor:pointer; display:block}
.cihazlar-menu-mobil.active::after{background:url(../images/otogazTvArrowActive.png) no-repeat;}
.cihazlar-menu-mobil::after{ content:''; width:18px; height:10px; position:absolute; right:20px; top:50%; margin-top:-4.5px; background:url(../images/selectpng-h.png) no-repeat; }

.cihazlar-area .menu-area { position:absolute; left:50%; transform:translateX(-50%); width:100%; max-width:300px; margin-bottom:0; background:#fff; text-align:left; display:none;  }
.cihazlar-area .menu-area li { padding:10px; border-bottom:1px solid #1b2429 }
.cihazlar-area .menu-area  span  {  font-size:13px; font-weight:500; clear:both; display:inline-block;color:#70797e; padding:0; margin:0;-webkit-border-radius: 0;-moz-border-radius: 0; border-radius:0; letter-spacing: 0px;   }
.cihazlar-area .menu-area  span:after  { display:none }
.cihazlar-area .menu-area  span:hover:after, .cihazlar-area .menu-area span.select:after  {  display:none}
.cihazlar-area .menu-area  span:hover, .cihazlar-area .menu-area span.select   {  background:none; color:#1b2429;  }
.cihazlar-area .cihazlar-menu { padding:20px; text-align:center;height:auto !important;    z-index: 2;}
.cihazlar-area h3 span { color:#f8ba0c}
.cihazlar-area h3 {    margin: 0px 0 15px;}
.cihazlar-area .cihazlar-menu { background:#0971ce}
.bottomc-area .left, .bottomc-area .right { width:100%; float:none}

.bottomc-area .right h3 { font-size:22px}
.bottomc-area .right .slide-left h4 {    font-size: 18px;    padding: 20px 0;}
.bottomc-area .right .slide-left p{    font-size: 18px;    padding: 5px 0;}
.leftLinkContent span.txt {font-size:18px}
.owl-carousel.urun-slide .owl-item ul { width:34%; margin:auto}
#tab-457 .owl-carousel.urun-slide .owl-item ul, #tab-1281 .owl-carousel.urun-slide .owl-item ul { width:43%; }
} 

@media screen and (max-width:600px) 
{

.leftLinkContent h3 { font-size:18px; margin: 5px 0 10px;}
.bottomc-area .right h3 { font-size:14px}
.bottomc-area .right .slide-left h4 {    font-size: 12px; line-height:normal;    padding: 5px 0;}
 .bottomc-area .right .slide-left h4 br {display:none}
.bottomc-area .right .slide-left p{    font-size: 12px;    padding: 5px 0; line-height:normal}
.bottomc-area .right .slide-left span { line-height:normal}
.leftLinkContent span.txt {font-size:12px; margin-bottom:10px}
.grad-button.green { padding:10px; font-size:12px;    max-width: 90%;}
.bottomc-area .right { padding:10px; height:auto !important}
.leftLinkContent {padding: 10px 0 0 10px;}
.owl-carousel.urun-slide .owl-item ul { width:73%;}
#tab-457 .owl-carousel.urun-slide .owl-item ul, #tab-1281 .owl-carousel.urun-slide .owl-item ul  {width:83%}
} 

@media screen and (max-width:320px) 
{
    .leftLinkContent { width:55%}
    .leftLinkContent h3 {font-size:14px}
    .leftLinkContent h3 span {font-size:28px}
    .owl-carousel.urun-slide .owl-item ul { width:90%;}
    #tab-457 .owl-carousel.urun-slide .owl-item ul, #tab-1281 .owl-carousel.urun-slide .owl-item ul {width:91%}
} 