/*------------------------------------------------------------------//
//      RESPONSIVE SYSTEM                                           //
//------------------------------------------------------------------*/
@media screen and (min-width: 1601px) {
  /* PC 1600+ PC XLarge */
  .menuAc {
    display: none !important;
  }
  #mobile-menu, .menuKapa{
    display: none !important;
  }
}
@media screen and (max-width: 1600px) and (min-width: 1440px) {
  /* PC 1400+ ~ 1600 PC Large */
  .menuAc {
    display: none !important;
  }
    main .contactPage .map iframe{
    height: 500px;
  }
  #mobile-menu, .menuKapa{
    display: none !important;
  }
}
@media screen and (max-width: 1439px) and (min-width: 1200px) {
  /* PC 1200+ ~ 1440 Laptop  */
  .menuAc {
    display: none !important;
  }
  main.videos .page figure a .title{
    font-size: 13px !important;
        padding: 9px 12px !important;
  }
  main .contactPage .map #map {
    height: 420px;
  }
  main .contactPage .contact .item{
    margin-bottom: 0px !important;
    margin-top: 10px;
  }
  main .contactPage .social-accounts h1{
    margin:20px 0px !important;
  }
  main .contactPage .social-accounts a{
    font-size:18px !important;
    width:40px !important;
  }
  main.contact .pageIn .text .social-accounts .realself a{
    margin-left: -6px !important;
  }
  #mobile-menu, .menuKapa{
    display: none !important;
  }
    main .contactPage .col-md-6:nth-child(1) {
      padding:20px !important;
    }
    main .pageIn .text{
      height:auto !important;
    }

    main .pageIn .text .in .content{
      height:30vh !important;
    }
}

@media screen and (min-width: 1200px) {
    #mobile-menu, .menuKapa{
    display: none !important;
  }
  .gallery .owl-stage .owl-item:nth-child(6) figure {
    background-position: inherit !important;
  }
}
@media screen and (max-width: 1199px) and (min-width: 992px) {
  /* PC 993+ ~ 1200 PC Medium */
  .menuAc {
    display: none !important;
  }
    main aside nav.menu {
    display: none !important;
  }

  main aside .language {
    display: none !important;
  }

    main .contactPage .map iframe{
    height: 400px;
  }
  main .contactPage .contact .item{
    margin-bottom: 0px !important;
    margin-top: 10px;
  }
  main .contactPage .social-accounts h1{
    margin:20px 0px !important;
  }
  main .contactPage .social-accounts a{
    font-size:18px !important;
    width:40px !important;
  }
    header .menuOpen.active span{
    -webkit-transform: rotate(0deg) !important;
    -moz-transform: rotate(0deg) !important;
    -ms-transform: rotate(0deg) !important;
    -o-transform: rotate(0deg) !important;
    transform: rotate(0deg) !important; 
    opacity: 1 !important;
    top: auto !important;
    
  }

  main.active:before{
    display: none;
  }

  header .menuOpen.active span:nth-child(2) {
    display: block !important;
    margin-top: 10px !important;
  }

  main.contact .pageIn .text .item .info a {font-size: 11px !important;}
  main.contact .pageIn .text h1 {font-size: 20px !important;}
}
@media screen and (max-width: 991px) and (min-width: 768px) {
  /* TABLET 768+ ~ 960 */
  .mobileClear,
  .menuAc,
  .mContact {
    display: block;
  }
  main .pageIn .text {
    width: 95%;
    right: 2.5%;
  }
  .sliderWrapper video{
    width: 150% !important;
  }

      main{
    overflow-y: scroll !important;
    background-position: 20% center;
  }

  main.videos .page{
    height:auto !important;
  }

  main.videos .page figure img{
    position:relative !important;
  }

  main.videos .owl-dots{
    display:none;
  }

  main.videos .page figure{
    width: 50% !important;
    position:relative !important;
    left:0px !important;
    top:0px !important;
    height: auto !important;
    overflow: inherit !important;
  }

  .videos .owl-nav{
    position:relative;

  }

  .videos .owl-nav .owl-next{
    float:none;
    margin:1px 3px !important;
  }

  .videos .owl-nav .owl-prev{
    float:none;
    margin:1px 3px !important;
  }

    main aside nav.menu{
    height:40vh !important;
  }
  
  header .menuOpen.active span{
    -webkit-transform: rotate(0deg) !important;
    -moz-transform: rotate(0deg) !important;
    -ms-transform: rotate(0deg) !important;
    -o-transform: rotate(0deg) !important;
    transform: rotate(0deg) !important; 
    opacity: 1 !important;
    top: auto !important;
    
  }

  main.active:before{
    display: none;
  }

  header .menuOpen.active span:nth-child(2) {
    display: block !important;
    margin-top: 10px !important;
  }
  main.contact .pageIn .text .item .info a {font-size: 11px !important;}
  main.contact .pageIn .text h1 {font-size: 20px !important;}
}
@media screen and (max-width: 767px) and (min-width: 640px) {
  /* TABLET 640+ ~ 768 */
  .mobileClear,
  .menuAc,
  .mContact {
    display: block;
  }

  main .pageIn .text .in .content {height: 35vh;}

  .video-responsive video {
    object-fit: none !important;
    right: -100px;
    transform: scale(4.1) !important;
    -webkit-transform: scale(2.1) !important;
    -moz-transform: scale(4.1) !important;
    -o-transform: scale(4.1) !important;
    transform-origin: top !important;
    position: relative !important;
  }

  main aside.sidebar{
    display: none !important;
  }

  main .pageIn .text {
    width: 95%;
    right: 2.5%;
    height: 72vh;
    padding: 30px !important;
  }
  main .logo {
    width: 300px;
    margin-left: -150px;
    bottom: 10%;
  }
    .sliderWrapper video{
    width: 150% !important;
  }

    main{
    overflow-y: scroll !important;
  }

  .video-responsive canvas{
    position: relative;
    object-fit: cover;
    right: -100px;
    transform: scale(4.1) !important;
    -webkit-transform: scale(2.1) !important;
    -moz-transform: scale(4.1) !important;
    -o-transform: scale(4.1) !important;
    transform-origin: top !important;
    position: relative;
    right: -100px;
  }

  main aside.sidebar{
    position:fixed;
    display: none;
  }

  main aside nav.menu{
    height:40vh !important;
    margin-top:30px !important;
  }

  main.videos .page{
    height:auto !important;
  }

  main.videos .page figure img{
    position:relative !important;
  }

  main.videos .owl-dots{
    display:none;
  }

  main.videos .page figure{
    width: 50% !important;
    position:relative !important;
    left:0px !important;
    top:0px !important;
    height: auto !important;
    overflow: inherit !important;
  }

  .videos .owl-nav{
    position:relative;

  }

  .videos .owl-nav .owl-next{
    float:none;
    margin:1px 3px !important;
  }

  .videos .owl-nav .owl-prev{
    float:none;
    margin:1px 3px !important;
  }
  .logos {width: 100%;right: 0;bottom: 8%;}
  .logos a {width: 40px;margin: 0 5px;}
  main.contact .pageIn .text h1 {font-size: 17px !important;}
  main .contactPage .social-accounts a {width: 37px; height: 37px; margin: 3px;}
  main .contactPage .contact .item .info p {font-size: 12px;}
  main .contactPage .contact .item .info a {font-size: 12px;}
  main .contactPage .contact .item {margin-top: 0;margin-bottom: 0 !important;}
  main .contactPage .map #map {display:  none;}
  main .contactPage .social-accounts a {width: 20px !important;margin-left: 10px !important;top: 5px !important;}
  main .contactPage .social-accounts .realself a {width: 100px !important;}
  main .contactPage .social-accounts .realself {margin-left: 0 !important;position: relative;}
  main .contactPage .social-accounts h1 {margin-top: 25px;}
  main .contactPage {width: 90%; padding: 25% 0; margin: 0 auto; float: none !important; left: 5%;}

    header .menuOpen.active span{
      -webkit-transform: rotate(0deg) !important;
      -moz-transform: rotate(0deg) !important;
      -ms-transform: rotate(0deg) !important;
      -o-transform: rotate(0deg) !important;
      transform: rotate(0deg) !important; 
      opacity: 1 !important;
      top: auto !important;
      
    }
  
    main.active:before{
      display: none;
    }
  
    header .menuOpen.active span{
      -webkit-transform: rotate(0deg) !important;
      -moz-transform: rotate(0deg) !important;
      -ms-transform: rotate(0deg) !important;
      -o-transform: rotate(0deg) !important;
      transform: rotate(0deg) !important;  
    }
}
@media screen and (max-width: 639px) and (min-width: 480px) {
  /* MOBILE 480+ ~ 640 */
  .mobileClear,
  .menuAc,
  .mContact {
    display: block;
  }
  main .pageIn .text .in .content {height: 35vh;}

  header {
    padding: 30px 20px;
  }
  main .pageIn .text {
    width: 95%;
    right: 2.5%;
    padding: 25px !important;
  }
   main aside.sidebar{
    display: none !important;
  }
  main .logo {
    width: 300px;
    margin-left: -150px;
    bottom: 10%;
  }
    .sliderWrapper video{
    width: 200% !important;
  }
  main .whoMePage .col-lg-3{
    width: 50% !important;
  }
  main aside.sidebar.active{
    display:none;
  }

  header .menuOpen.active span{
    -webkit-transform: rotate(0deg) !important;
    -moz-transform: rotate(0deg) !important;
    -ms-transform: rotate(0deg) !important;
    -o-transform: rotate(0deg) !important;
    transform: rotate(0deg) !important; 
    opacity: 1 !important;
    top: auto !important;
    
  }

  main.active:before{
    display: none;
  }

  main aside nav.menu{
    height:40vh !important;
  }

  main.videos .page{
    height:auto !important;
  }

  main.videos .page figure img{
    position:relative !important;
  }

  main.videos .owl-dots{
    display:none;
  }

  main.videos .page figure{
    width:100% !important;
    position:relative !important;
    left:0px !important;
    top:0px !important;
    height: auto !important;
    overflow: inherit !important;
  }

  .videos .owl-nav{
    position:relative;

  }

  .videos .owl-nav .owl-next{
    float:none;
    margin:1px 3px !important;
  }

  .videos .owl-nav .owl-prev{
    float:none;
    margin:1px 3px !important;
  }
  .logos {width: 100%;right: 0;bottom: 8%;}
  .logos a {width: 40px;margin: 0 5px;}
  main.contact .pageIn .text h1 {font-size: 17px !important;}
  main .contactPage .social-accounts a {width: 37px; height: 37px; margin: 3px;}
  main .contactPage .contact .item .info p {font-size: 12px;}
  main .contactPage .contact .item .info a {font-size: 12px;}
  main .contactPage .contact .item {margin-top: 0;margin-bottom: 0 !important;}
  main .contactPage .map #map {display:  none;}
  main .contactPage .social-accounts a {width: 16px !important;font-size: 17px !important;margin-left: 0px !important;margin-right: 9px !important;}
  main .contactPage .social-accounts .realself a {width: 75px !important;position: relative;top: 7px !important;}
  main .contactPage .social-accounts .realself {margin-left: 0 !important;}
  main .contactPage .social-accounts h1 {margin-top: 25px;}
  main .contactPage {width: 90%; padding: 25% 0; margin: 0 auto; float: none !important; left: 5%;}

      .video-responsive canvas {
      transform: scale(4.1) !important;
      -webkit-transform: scale(4.1) !important;
      -moz-transform: scale(4.1) !important;
      -o-transform: scale(4.1) !important;
      transform-origin: top !important;
      position: relative;
      right: -100px;
    }

    .video-responsive{
      position: absolute;
    }

    main.guncel-konular:after {
      bottom: 5%;
      right: 50%;
      transform: translateX(50%);
    }
}
@media screen and (max-width: 479px) and (min-width: 320px) {
  
.video-responsive {
  position: absolute !important;
}

main .pageIn .text .in .content {height: 30vh;}

.video-responsive video {
  object-fit: cover;
  /* right: -100px !important; */
  position: relative;
  /* transform: scale(4.1) !important; */
  /* -webkit-transform: scale(4.1) !important; */
  -moz-transform: scale(4.1) !important;
  -o-transform: scale(4.1) !important;
  /* transform-origin: top !important; */
  position: relative;
  /* right: -100px; */
  height: 100%;
}
main.estetik-uygulama:after{
  bottom: 8% !important;
  right: 50%;
  transform: translateX(50%);
}

.video-responsive canvas {
  position: relative;
  /* object-fit: cover; */
  /* right: -100px; */
  /* transform: scale(4.1) !important; */
  /* -webkit-transform: scale(4.1) !important; */
  -moz-transform: scale(4.1) !important;
  -o-transform: scale(4.1) !important;
  /* transform-origin: top !important; */
  /* position: relative; */
  /* right: -100px; */
  height: 100%;
  width: 100%;
}
  /* MOBILE 320+ ~ 480 */
  .mobileClear,
  .menuAc,
  .mContact {
    display: block;
  }
  main .pageIn {
    padding-top: 10%;
  }
  header {
    padding: 30px 20px;
  }
   main aside.sidebar{
    display: none !important;
  }
  main .pageIn .text {
    width: 95%;
    right: 2.5%;
    padding: 25px;
    height: 50% !important;
  }
  main .pageIn .text .in h1 {
    font-size: 22px;
  }
  main .pageIn .text .in p {
    font-size: 12px;
  }
  main.estetik-uygulama:after{
    bottom: 6.5% !important;
    right: 50%;
    transform: translateX(50%);
  }
  main .logo {
    width: 300px;
    margin-left: -150px;
    bottom: 10%;
  }
  header .menuOpen {
    margin-top: 15px;
  }
  main aside.sidebar.active {
    display: none !important;
  }

  main aside.sidebar {
    display: none !important;
  }

  header .menuOpen.active span{
    -webkit-transform: rotate(0deg) !important;
    -moz-transform: rotate(0deg) !important;
    -ms-transform: rotate(0deg) !important;
    -o-transform: rotate(0deg) !important;
    transform: rotate(0deg) !important; 
    opacity: 1 !important;
    top: auto !important;
    
  }

  main .pageIn .text {
    transform: translateY(-55%);
  }

  main.active:before{
    display: none;
  }

  header .menuOpen.active span{
    -webkit-transform: rotate(0deg) !important;
    -moz-transform: rotate(0deg) !important;
    -ms-transform: rotate(0deg) !important;
    -o-transform: rotate(0deg) !important;
    transform: rotate(0deg) !important;  
  }

  main aside.sidebar nav.menu ul li a {
    padding-right: 0;
    font-size: 13px;
  }
  .sliderWrapper video{
    width: 280% !important;
  }

  main .whoMePage .col-lg-3{
    width: 50% !important;
  }

  main{
    overflow-y: scrool !important;
  }

  main.videos{
    overflow:inherit !important;
    height:auto !important;
    position: relative !important;
  }

  main.videos .page{
    height:auto !important;
  }

  main.videos .page figure img{
    position:relative !important;
  }

  main.videos .owl-dots{
    display:none;
  }

  main.videos .page figure{
    width:100% !important;
    position:relative !important;
    left:0px !important;
    top:0px !important;
    height: auto !important;
    overflow: inherit !important;
  }

  .videos .owl-nav{
    position: relative;
    top: 0 !important;
    /* top: 100% !important; */
    z-index: 999999999;
  }

  .videos .owl-nav .owl-next{
    float:none;
    margin:1px 3px !important;
  }

  .videos .owl-nav .owl-prev{
    float:none;
    margin:1px 3px !important;
    z-index: 999999;
  }
  main.guncel-konular:after {
    bottom: 5%;
    right: 50%;
    transform: translateX(50%);
  }

  .logos {width: 95%;right: 2.5%;bottom: 18%;margin-right: 0px;padding: 7px;}
  .logos a {width: 32px;margin: 0px 7px;}
  main.contact .pageIn .text h1 {font-size: 17px !important;margin-bottom: 15px;}
  main .contactPage .social-accounts a {width: 37px; height: 37px; margin: 3px;}
  main .contactPage .contact .item .info p {font-size: 12px;}
  main .contactPage .contact .item .info a {font-size: 12px;}
  main .contactPage .contact .item {margin-top: 0;margin-bottom: 0 !important;}
  main .contactPage .map #map {display:  none;}
  main .contactPage .social-accounts a {width: 18px !important;font-size: 16px !important;}
  main.contact .pageIn .text .social-accounts .realself a{width: 64px !important;top: 8px !important;}
  main .contactPage .social-accounts .realself a {width: 100px !important;}
  main .contactPage .social-accounts .realself {margin-left: 0 !important;}
  main .contactPage .social-accounts h1 {margin-top: 15px;margin-bottom: 0 !important;}
  main .contactPage {width: 90%; padding: 25% 0; margin: 0 auto; float: none !important; left: 5%;}
  .contactPage .text{margin-top: 20px !important;}
  .contactPage .col-md-6{padding:30px 20px !important;}
  main.contact .map{display:none;}
}