@mixin apply_transition($transition-property, $transition-duration, $transition-timing) {
  transition-property: $transition-property;transition-duration: $transition-duration;-moz-transition-property:$transition-property;-moz-transition-duration: $transition-duration;-webkit-transition-property:$transition-property;-webkit-transition-duration: $transition-duration;-o-transition-property:$transition-property;-o-transition-duration: $transition-duration;-ms-transition-property:$transition-property;
  -ms-transition-duration: $transition-duration;-ms-transition-timing-function:$transition-timing;

  @if $transition-timing == ease-out-quart {
    -webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
    -o-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
    transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
  } @else {
    -webkit-transition-timing-function:$transition-timing;
    -moz-transition-timing-function:$transition-timing;
    -o-transition-timing-function:$transition-timing;
    transition-timing-function: $transition-timing;
  }
}
@mixin boxsizing() {
  -moz-box-sizing:    border-box;   -webkit-box-sizing: border-box;    box-sizing:        border-box;
}

.zoomvideoplayer{
  position: relative;
  width: 100%;
  height: 300px;

  line-height: 1;
  overflow: hidden;

  opacity: 0;

  background-color: #222;

  $transition-property: opacity;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;

  @include apply_transition($transition-property, $transition-duration, $transition-timing);

  @include boxsizing();
  *{
    @include boxsizing();

  }
  object{
    outline: 0;
  }
  .menu-feed-thumbnail,.menu-feed-html,.menu-feed-title,.menu-feed-description{
    display: none;
  }

  .feed-dzszvp{
    display: none;
  }

  .cover-image, .media-image{
    position: absolute;
    top:0; left:0;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;

    background-color: #222;
  }

  .cover-play-btn{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);

    opacity: 0.5;


    $transition-property: opacity;
    $transition-duration: 0.5s;
    $transition-timing: ease-out;

    @include apply_transition($transition-property, $transition-duration, $transition-timing);

    cursor: pointer;

  }
  .cover-play-btn:hover{
    opacity: 1;
  }

  .video-overlay{                /*----  preview image  ----*/
    position:absolute;
    cursor:pointer;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
  }


  .controls-con{
    .play-btn,.pause-btn, .fullscreen-btn, .vol-btn--icon, .vol-bar-con, .scrubbar, .hd-btn, .download-btn, .social-btn, .embed-btn, .mute-btn, .unmute-btn, .btn-info{
      cursor: pointer;
    }

    > span{
      font-size: 12px;
      line-height: 1.7;
      position: absolute;
    }


    $transition-property: opacity,visibility;
    $transition-duration: 0.3s;
    $transition-timing: ease-out-quart;

    .play-btn, .pause-btn, .curr-time-holder, .total-time-holder, .mute-btn, .unmute-btn {
      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
    .play-btn, .pause-btn, .mute-btn.active, .unmute-btn.active {
      visibility: visible;
      opacity: 1;
    }

    .pause-btn, .unmute-btn, .mute-btn{
      visibility: hidden;
      opacity: 0;
    }

    .curr-time-holder, .total-time-holder{

      visibility: hidden;
      opacity: 0;
      pointer-events: none;
    }
    .curr-time-holder.ready, .total-time-holder.ready{

      visibility: visible;
      opacity: 1;
    }
    .total-time-holder.ready{

      visibility: visible;
      opacity: 0.5;
    }


  }

  .scrubbar-box, .scrubbar-box-prog{
    visibility: hidden;
  }

  .the-media-con{
    > video{
      width: 100%;
      height: 100%;

      //       object-fit: fill;
    }
  }
  $transition-property: visibility,opacity;
  $transition-duration: 0.5s;
  $transition-timing: ease-out-quart;

  div.zoomvideoplayer-hd,div.zoomvideoplayer-is-ad{
    position: absolute; top:0; left:0;
    width: 100%; height: 100%;

    visibility: hidden; opacity: 0;

    pointer-events:none;

    object{
      display: none;
    }

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
  }



  $transition-property: visibility,opacity;
  $transition-duration: 1s;
  $transition-timing: ease-out-quart;
  .social-container{
    position: absolute;top:0;left:0;
    width: 100%; height: 100%;

    visibility: hidden;
    opacity: 0;

    overflow: hidden;
    @include apply_transition($transition-property, $transition-duration, $transition-timing);

    .social-container--bg{

      position: absolute;top:0;left:0;
      width: 100%; height: 100%; background-color: rgba(50,50,50,0.8);
    }
    $transition-property: all;
    $transition-duration: 1s;
    $transition-timing: ease-out-quart;
    .social-container--separator{
      position: absolute;
      height: 1px;
      width: 120%;
      left: -10%;
      background-color: rgba(255,255,255,0.2);
      -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
      -ms-transform: rotate(0deg); /* Chrome, Safari, Opera */
      transform: rotate(0deg);
      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
    .social-container--room{
      position: relative;
      > span{

        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
      }
    }
  }
  .social-container.active{

    visibility: visible;
    opacity: 1;

    .social-container--separator {
      -webkit-transform: rotate(2.5deg); /* Chrome, Safari, Opera */
      -ms-transform: rotate(2.5deg); /* Chrome, Safari, Opera */
      transform: rotate(2.5deg);
    }
  }


  $transition-property: all;
  $transition-duration: 0.3s;
  $transition-timing: ease-out-quart;
  .play-btn-for-skin-pro{

    .play-btn-fig{
      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
  }


  $transition-property: all;
  $transition-duration: 0.7s;
  $transition-timing: ease-out-quart;


  .play-btn-for-skin-avanti path,.pause-btn-for-skin-avanti path, .mute-btn-for-skin-avanti path, .unmute-btn-for-skin-avanti path{

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
  }

  .dzstag-tobe {
    display: none;
  }

  .dzstag{
    position: absolute;
    top:0;
    left:0;
    opacity:0;
    visibility: hidden;
    @include apply_transition($transition-property, $transition-duration, $transition-timing);



    .tag-box{ border: 1px dashed #555; width:50px; height:50px;

      a{ width:100%; height:100%; content: ","; display: block;
      }
    }

    .tag-content{ position:absolute; right:0; background: #555; color: #eee; display: inline-block; padding:1px 5px;
    }
  }

  .dzstag.active{ opacity:1; visibility: visible;
  }


  .dzstag.full-tag{
    width:100%;
    height:100%;
  }


  .info-window{
    position: absolute;
    top:0; left:0;

    width: 100%;
    height:100%;

    display: none;

    $transition-property: opacity;
    $transition-duration: 0.7s;
    $transition-timing: ease-out-quart;
//    @include apply_transition($transition-property, $transition-duration, $transition-timing);

    .canvas-bg{

      width: 100%;
      height:100%;

      filter: blur(20px);
      -webkit-filter: blur(20px);
    }



    .center-it{

      width: 100%;
      position: absolute;
      top:50%; left:0%;

      transform: translate(0%,-50%);


    }
  }

  .dzszvp-hero-text{
    text-align: center;
    font-size: 30px;
    line-height: 1.5;
    color: #eee;
  }
  .dzszvp-hero-button-con{
    margin-top: 25px;
    text-align: center;
  }
  .dzszvp-hero-button{
    display: inline-block ;
    padding: 15px 30px;
    font-size: 30px;

    text-align: center;

    background-color: #00529B;
    color: #fff;

    border-radius: 10px;
  }

  .info-window.active{
    display: block;
  }

  &.disable-fullscreen{
    .fullscreen-btn{
      display: none!important;
    }
  }
  &.disable-volume{
    .vol-btn{
      display: none!important;
    }
  }
  &.disable-hd{
    .hd-btn{
      display: none!important;
    }
  }
  &.disable-download{
    .download-btn{
      display: none!important;
    }
  }
  &.disable-social{
    .social-btn{
      display: none!important;
    }
  }
  &.disable-embed{
    .embed-btn{
      display: none!important;
    }
  }
  &.disable-scrubbar{
    .scrubbar{
      display: none!important;
    }
  }
}


.dzszvp-subhero-text{
  text-align: center;
  font-size: 20px;
  line-height: 1.5;
  color: #eee;

  margin-bottom: 20px;
}
.dzszvp-hero-button-con{
  margin-top: 25px;
  text-align: center;
}

form.email-form{
  > *{
    vertical-align: top;
  }
}

.zoomvideoplayer[data-ad_link]{
  cursor: pointer;
}

.bg-element-translucent-dark{

  position: absolute;
  top:0; left:0;

  width: 100%;
  height:100%;

  background-color: rgba(0,0,0,0.65);
}

.css-center-it{

  width: 100%;
  position: absolute;
  top:50%; left:0%;

  transform: translate(0%,-50%);


}
.info-window--back-btn{
  position: absolute;
  bottom: 15px;
  left: 15px;
  cursor: pointer;

  padding: 10px 12px;
  line-height: 1;
  background-color: #555;
  color: #cccccc;
}

.blur-it{

  filter: blur(20px);
  -webkit-filter: blur(20px);
}
.zoomvideoplayer.animate-height{

  $transition-property: opacity,height;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;

  @include apply_transition($transition-property, $transition-duration, $transition-timing);
}

.zoomvideoplayer-con-laptop{
  background-image: url(img/mb-body.png);
  background-size: contain;
  background-position: center center;
  .zoomvideoplayer{
    width: 61%;
    height: 71%;
    left: 19.5%;
    top: 10.9%;
  }
}


.dzszvp-email-input{
  display: inline-block;
  width: 250px;
  margin-right: 15px;

  padding: 20px;
  line-height: 1;
  vertical-align: top;
  font-size: 21px;
  border-radius: 10px;
  border: 0;
}


.zoomvideoplayer.is-fullscreen{
  width: 100%!important;
  height: 100%!important;
  top: 0!important;
  left: 0!important;
}

.zoomvideoplayer.is-ie8, .zoomvideoplayer.is-ie9 {
  div.zoomvideoplayer-hd, div.zoomvideoplayer-is-ad {

    display: none;
  }
  div.zoomvideoplayer-hd.active, div.zoomvideoplayer-is-ad.active {

    display: block;
  }
}

body div.zoomvideoplayer-hd.active,body div.zoomvideoplayer-is-ad.active{

  visibility: visible; opacity: 1;
  object{
    display: block;
  }

  pointer-events:auto;
}

.skipad-con{

  position: absolute;
  bottom: 35px;
  right: 25px;
  padding: 10px;
  line-height: 1;
  color: #ffffff;


  background-color: rgba(50,50,50,0.9);

  &.skipable{

    background-color: rgba(255,255,255,0.9);
  }


  .skipad {
    color: #222;
    cursor: pointer;
    opacity: 0.7;

    text-transform: uppercase;
  }
}
.zoomvideoplayer.zoomvideoplayer-is-ad{
  .play-btn, span.pause-btn, .scrubbar, .embed-btn, .download-btn, .fullscreen-btn, .video-overlay{
    opacity: 0.5;

  }


}
.zoomvideoplayer.zoomvideoplayer-is-ad.enable-play-btn-temporary-for-mobile{
  .play-btn, span.pause-btn{
    opacity: 1;
    pointer-events: auto;
  }
}

.zoomvideoplayer.under-480{
  .hide-under-480{
    display: none;
  }
}
.zoomvideoplayer.under-320{
  .hide-under-320{
    display: none;
  }
}
.zoomvideoplayer.is-pseudo-fullscreen{
  position: fixed;
  top:0; left:0;
  width: 100%;
  height: 100%;
  z-index: 9500;
}
.zoomvideoplayer.dzszvp-inited{
  opacity: 1;
}

.zoomvideoplayer.dzszvp-readyall{

  opacity: 1;
  .scrubbar-box, .scrubbar-box-prog{
    visibility: visible;
  }
}



.zoomvideoplayer.playing{

  .play-btn{

    visibility: hidden;
    opacity: 0;
  }
  .pause-btn{
    visibility: visible;
    opacity: 1;
  }
}




.zoomvideoplayer.skin-default{
  font-family: "Open Sans", arial, sans-serif;
  font-size: 12px;
  line-height: 1.1;
  .controls-con{

    $transition-property: fill;
    $transition-duration: 0.3s;
    $transition-timing: ease-out;
    .play-btn path,.pause-btn rect, .vol-btn--icon polygon, .hd-btn--icon path, .download-btn--icon rect, .social-btn--icon path, .embed-btn--icon path,.btn-info path{

      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
    .play-btn:hover path,.pause-btn:hover rect, .vol-btn--icon:hover polygon, .hd-btn:hover .hd-btn--icon path, .download-btn:hover .download-btn--icon rect, .social-btn:hover .social-btn--icon path, .embed-btn:hover .embed-btn--icon path, .btn-info:hover path{
      fill: #e4c000;
    }

    .controls-bg{
      width: 100%;
      height: 30px;
      position: absolute;
      bottom: 0;
      left:0;

      background-color: rgba(50,50,50,0.5);
    }


    $transition-property: fill;
    $transition-duration: 0.3s;
    $transition-timing: ease-out;
    .fullscreen-btn rect{

      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
    .fullscreen-btn:hover rect{
      fill: #e4c000;
    }



  }

  .controls-con.enable-auto-hide{

    $transition-property: all;
    $transition-duration: 0.7s;
    $transition-timing: ease-out-quart;

    .play-btn,.pause-btn,.fullscreen-btn,.vol-btn,.hd-btn,.download-btn,.social-btn,.embed-btn,.scrubbar,.controls-bg{

      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }

    $transition-property: opacity;
    $transition-duration: 0.75s;
    $transition-timing: ease-out;
    .scrubbar-box-prog{

      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }

    $transition-property: all;
    $transition-duration: 0.5s;
    $transition-timing: ease-out;
    .controls-bg{
      @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
  }
  .controls-con.enable-auto-hide.mouse-is-out{

    .play-btn,.pause-btn,.fullscreen-btn,.vol-btn,.hd-btn,.download-btn,.social-btn,.embed-btn,.scrubbar,.controls-bg{
      transform: translateY(30px);
    }
    .scrubbar-box-prog{
      opacity: 0;
    }
    .controls-bg{
      opacity: 0;
    }
  }

  .btn-info{
    background-color: transparent;
  }


  .controls-con{
    .cover-play-btn{

      cursor: pointer;
      box-shadow: 0 0 3px 0 rgba(0,0,0,0.5);
      border-radius: 50%;
      opacity:.5;visibility: visible;
      $transition-property: opacity,visibility;
      $transition-duration: 0.5s;
      $transition-timing: ease-out;
        @include apply_transition($transition-property, $transition-duration, $transition-timing);
    }
  }
}

.cover-play-btn{
  cursor: pointer;
}
.zoomvideoplayer.skin-default.playing{
  .controls-con{
    .cover-play-btn{

      opacity:0;visibility: hidden;
    }
  }
}

.btn-info.btn-info-for-skin-default{

  background-color: transparent;

}




.play-btn.play-btn-for-skin-default{
  position: absolute;
  left: 14px;
  bottom: 4px;
}
.pause-btn.pause-btn-for-skin-default{
  position: absolute;
  left: 14px;
  bottom: 4px;
}

.fullscreen-btn.fullscreen-btn-for-skin-default{

  position: absolute;
  right: 14px;
  bottom: 4px;
}



.vol-btn.vol-btn-for-skin-default{

  width: 60px;
  height: 12px;

  position: absolute;
  right: 40px;
  bottom: 4px;

  .vol-bar-con{
    .vol-bar-bg{
      width: 100%;
      height: 100%;
      background-color: rgba(50,50,50,0.7);
      position: absolute;top : 0; left:0;
    }
    .vol-bar-active{
      width: 30%;
      height: 100%;
      background-color: #E4C000;
      position: absolute;top : 0; left:0;
    }
  }
}



.scrubbar.scrubbar-for-skin-default,.scrubbar.scrubbar-for-skin-pro{
  margin-right: 10px;

  .scrubbar-bg{

    background-color: rgba(50,50,50,0.7);
  }
  .scrubbar-buffered{

    background-color: rgba(228,228,228,0.3);
  }
  .scrubbar-prog, .scrubbar-admark{
    background-color: #E4C000;
  }

  .scrubbar-admark{
    opacity: 0.5;
  }

  .scrubbar-box{
    position: absolute;;
  }
  .scrubbar-box-prog, .scrubbar-box{
    font-family: "Open Sans", arial, sans-serif;
    font-weight: 300;
    font-size: 10px;
    position: absolute;;
    left: -25px;

    line-height: 1.5;


    background: #fafafa;
    color: #66645f;
    border: 1px solid rgba(0,0,0,0.2);
    width:50px;
    bottom:19px;
    height:auto;
    opacity:0.9;
    text-align: center;

    pointer-events:none;

  }
  .scrubbar-box:empty,.scrubbar-box-prog:empty{
    display: none;
  }
  .scrubbar-box-prog:before{
    content: "";


    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;

    border-top: 6px solid #fafafa;

    position: absolute;
    left: 50%;
    top: 100%;
    margin-left: -6px;
  }

  .scrubbar-box{
    margin-left: -20px;
    width:40px;

    line-height: 1.6;
    font-size: 9px;



    background: #444;
    color: #898680;
    border: 1px solid rgba(0,0,0,0.2);

  }
  .scrubbar-box.has-image{
    width: 64px;
    margin-left: -32px;

    img.instant-preview-img{
      max-width: 100%;
    }
  }
  .scrubbar-box:before{
    content: "";


    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;

    border-top: 5px solid #444;

    position: absolute;
    left: 50%;
    top: 100%;
    margin-left: -6px;
  }
}

.scrubbar.scrubbar-for-skin-pro{

  .scrubbar-prog, .scrubbar-admark{
    background-color: #965b5b;
  }
}

.hd-btn.hd-btn-for-skin-default{


  $transition-property: all;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;
  $w : 60px;
  $color_aux : #444;
  .hd-btn--options{
    width: $w;
    height: auto;
    background-color: $color_aux;
    position: absolute;
    left: 50%;
    margin-left: -$w/2;
    bottom: 20px;

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
    transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
  }
  .hd-btn--options:before{

    content: "";
    position: absolute;
    width: 100%;
    height: 10px;
    top: 100%;
    left:0;
  }
  .hd-btn--options:after{

    content: "";
    position: absolute;
    top: 100%;
    left:50%;
    margin-left: -7px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;

    border-top: 6px solid $color_aux;
  }



  ul.hd-options{
    list-style: none;
    margin:5px 0;
    padding: 0;
    li{
      display: block;
      text-align: center;
      color: #999;
    }
    li.active{
      color: #e4c000;
    }
  }
}


.hd-btn.hd-btn-for-skin-default.ready:hover{

  .hd-btn--options{

    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
  }
}

a.download-btn{
  line-height: 1.7;
}
.download-btn.download-btn-for-skin-default{


  display: inline-block;
  $transition-property: all;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;
  $w : 160px;
  $color_aux : #444;

  .download-btn--sidenote{
    width: $w;
    height: auto;
    background-color: $color_aux;
    position: absolute;
    left: 50%;
    margin-left: -$w/2;
    bottom: 20px;
    padding: 10px;

    color: #999;

    text-align: center;
    font-size: 12px;

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
    transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
  }
  .download-btn--sidenote:before{

    content: "";
    position: absolute;
    width: 100%;
    height: 10px;
    top: 100%;
    left:0;
  }
  .download-btn--sidenote:after{

    content: "";
    position: absolute;
    top: 100%;
    left:50%;
    margin-left: -7px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;

    border-top: 6px solid $color_aux;
  }


}


.download-btn.download-btn-for-skin-default:hover{

  .download-btn--sidenote{

    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
  }
}
.embed-btn.embed-btn-for-skin-default{


  $transition-property: all;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;
  $w : 160px;
  $color_aux : #444;

  .embed-btn--sidenote{
    width: $w;
    height: auto;
    background-color: $color_aux;
    position: absolute;
    left: 50%;
    margin-left: -$w/2;
    bottom: 20px;
    padding: 10px;

    color: #999;

    text-align: center;
    font-size: 12px;

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
    transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);

    textarea{
      width: 100%;
      resize: none;
      background: transparent;
      border: 1px solid rgba(255,255,255,0.1);
      color: #999;
      padding: 10px;
    }
  }
  .embed-btn--sidenote:before{

    content: "";
    position: absolute;
    width: 100%;
    height: 10px;
    top: 100%;
    left:0;
  }
  .embed-btn--sidenote:after{

    content: "";
    position: absolute;
    top: 100%;
    left:50%;
    margin-left: -7px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;

    border-top: 6px solid $color_aux;
  }


}


.embed-btn.embed-btn-for-skin-default:hover{

  .embed-btn--sidenote{

    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
  }
}

.social-btn.social-btn-for-skin-default{
  ul.social-btn--options{
    display: none;
    li{
    }
  }
}

/* skin-pro BEGIN */.zoomvideoplayer.skin-pro .controls-bg{ background-color:rgba(50, 50, 50, 0.8);} .zoomvideoplayer.skin-pro .play-btn.play-btn-for-skin-pro .play-btn-fig{ border-left-color:#eeeeee!important;} .zoomvideoplayer.skin-pro .play-btn.play-btn-for-skin-pro:hover .play-btn-fig{ border-left-color:#965b5b!important;} .zoomvideoplayer.skin-pro .curr-time-holder.curr-time-holder-for-skin-pro { color:#eee!important;}  .zoomvideoplayer.skin-pro .total-time-holder.total-time-holder-for-skin-pro { color:#eee!important;} .zoomvideoplayer.skin-pro .pause-btn.pause-btn-for-skin-pro *[class^="pause-btn-fig-"]{ background-color:#eeeeee!important;} .zoomvideoplayer.skin-pro .pause-btn.pause-btn-for-skin-pro:hover *[class^="pause-btn-fig-"]{ background-color:#965b5b!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro .fullscreen-btn-fig-1,.zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro .fullscreen-btn-fig-3{ border-left-color:#eeeeee!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro .fullscreen-btn-fig-2{ border-right-color:#eee!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro .fullscreen-btn-fig-4{ border-bottom-color:#eee!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro .fullscreen-btn-fig-circ{ background-color:#eee!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro:hover .fullscreen-btn-fig-1,.zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro:hover .fullscreen-btn-fig-3{ border-left-color:#965b5b!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro:hover .fullscreen-btn-fig-2{ border-right-color:#965b5b!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro:hover .fullscreen-btn-fig-4{ border-bottom-color:#965b5b!important;} .zoomvideoplayer.skin-pro .fullscreen-btn.fullscreen-btn-for-skin-pro:hover .fullscreen-btn-fig-circ{ background-color:#965b5b!important;} /* skin-pro END */

/* skin-avanti BEGIN */.zoomvideoplayer.skin-avanti .controls-bg{ background-color:rgba(50, 50, 50, 0.7);} .zoomvideoplayer.skin-avanti .play-btn.play-btn-for-skin-avanti path{ fill:#D2D6DB;} .zoomvideoplayer.skin-avanti .play-btn.play-btn-for-skin-avanti:hover path{ fill:#59c8ef;} .zoomvideoplayer.skin-avanti .pause-btn.pause-btn-for-skin-avanti:hover path{ fill:#59c8ef;} .zoomvideoplayer.skin-avanti .mute-btn.mute-btn-for-skin-avanti.active:hover path{ fill:#59c8ef;} .zoomvideoplayer.skin-avanti .unmute-btn.unmute-btn-for-skin-avanti:hover path{ fill:#59c8ef;} .zoomvideoplayer.skin-avanti .scrubbar.scrubbar-for-skin-pro .scrubbar-prog{ background-color:#59c8ef;}
 /* skin-avanti END */







/* ---- videogallery styling -- */


.zoomvideogallery{
  position:relative;
  @include boxsizing();
  *{
    @include boxsizing();
  }
  .media-con-clip{
    height: 300px;
    overflow:hidden;
    position: relative;
    .media-con{
      position: absolute;
      left: 0; top:0;
      width: 100%; height: 100%;

      $transition-property: visibility,opacity;
      $transition-duration: 0.3s;
      $transition-timing: ease-out;
      .zoomvideoplayer{
        position: absolute;
        top:100%;
        left:0;
        opacity:0;
        visibility: hidden;
        @include apply_transition($transition-property, $transition-duration, $transition-timing);
      }
      .zoomvideoplayer.active{
        opacity:1;
        visibility: visible;
        top:0;
      }
    }
  }
  .menu-con-clip{
    overflow: hidden;
    .menu-con{
      position:relative;

      .gallery-menu-item{
        cursor:pointer;
      }

      .gallery-menu-item:after{
        content: "";
        display:block;
        clear:both;
      }
    }
  }
}
.zoomvideogallery:after{
  content: "";
  display:block;
  clear:both;
}


.zoomvideogallery.menu-right{
  .menu-con-clip{

    max-height: 100%;
    float:right;
  }
  .media-con-clip{
  }
}

.zoomvideogallery.skin-default{
  $transition-property: background;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;
  .gallery-menu-item{
    background-color: #332f2f;
    color: #EEEEEE;
    padding: 15px;
    @include apply_transition($transition-property, $transition-duration, $transition-timing);
    .menu-item-thumb{
      float:left; width: 70px; height:70px;
      backround-size: cover;
      background-position: center center;
      margin-right: 10px;

    }
    .menu-item-desc{
      overflow: hidden;

    }
  }
  .gallery-menu-item.active,.gallery-menu-item:hover{
    background-color: #443f3f;
  }
}