/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jul 13, 2020, 5:26:38 PM
    Author     : wh
*/
/* -------------------------------------------------------------
  Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library
  By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets

  List of CSS3 Sass Mixins File to be @imported and @included as you need

  The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER
  ENDING css files

  note: All CSS3 Properties are being supported by Safari 5
  more info: http://www.findmebyip.com/litmus/#css3-properties

------------------------------------------------------------- */
/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jun 24, 2016, 2:45:23 PM
    Author     : wh
*/
/*
@import 'https://fonts.googleapis.com/css?family=Source+Sans+Pro:200, 200i, 300,300i,400,400i,600,600i,700,700i';

$apg_body_font: 'Source Sans Pro', sans-serif;

$apg_gold:#D29F13;

$apg_body_color:#404041;

$apg_blue: #6BA4B8;

$apg_green : #789D4A;

$apg_orange: #DC6B2F;

$apg_light_blue:rgb(159,	193,	207);

*/
.testimonial-player {
  width: 100%;
  background-color: #6BA4B8;
  padding: 3%;
  color: #fff;
}
.testimonial-player h4 {
  margin-top: 0;
  font-weight: 300;
  font-size: 2.6rem;
  line-height: 1;
  margin-bottom: 1rem;
  padding-right: 10%;
  color: #fff;
}
.testimonial-player .player-description {
  font-size: 1;
  line-height: 1.2;
}
.testimonial-player .player-header {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* TWEENER - IE 10 */
  display: -webkit-flex; /* NEW - Chrome */
  display: flex;
}
.testimonial-player .player-header-buttons {
  flex-basis: 20px;
}
.testimonial-player .player-header-content {
  flex-basis: calc(100% - 20px);
  padding-right: 50px;
}
.testimonial-player .testimonial-grid {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* TWEENER - IE 10 */
  display: -webkit-flex; /* NEW - Chrome */
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
}
.testimonial-player.columns-3 .testimonial-item {
  flex-basis: calc(33.33% - 4px);
}
.testimonial-player .testimonial-item {
  flex-basis: calc(25% - 4px);
  position: relative;
  margin-bottom: 14px;
  margin-right: 4px;
}
.testimonial-player .testimonial-item p {
  display: none;
}
.testimonial-player .testimonial-item .item-wrapper {
  position: relative;
}
.testimonial-player .testimonial-item .image-wrapper {
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  padding-bottom: 56%;
}
.testimonial-player .testimonial-item .audio-toggle {
  position: absolute;
  bottom: 0;
  right: 10px;
  width: 15px;
  height: 15px;
  margin-bottom: 0;
  display: none;
}
.testimonial-player .testimonial-item .audio-toggle:after {
  display: none;
}
.testimonial-player .testimonial-item.active {
  outline: 4px solid #fff;
  background-color: #fff;
}
.testimonial-player .testimonial-item.active .audio-toggle {
  display: block;
}
.testimonial-player .testimonial-item.active .caption {
  background-color: #fff;
}
.testimonial-player .caption {
  color: #000;
  font-size: 0.75rem;
  padding: 5px 5px;
  padding-bottom: 1rem;
  bottom: 0;
  line-height: 1.2;
}
.testimonial-player .caption .name {
  font-weight: 600;
}
.testimonial-player .caption p {
  display: none;
}
.testimonial-player .testimonial-grid-holder {
  position: relative;
}
.testimonial-player .testimonial-video-holder {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  pointer-events: none;
}
.testimonial-player .video-wrapper {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
  margin: 0;
  -webkit-transform: scale(0.245);
  -khtml-transform: scale(0.245);
  -moz-transform: scale(0.245);
  -ms-transform: scale(0.245);
  -o-transform: scale(0.245);
  transform: scale(0.245);
  transform-origin: left top;
  outline: 12px solid #fff;
  animation: zoomout 0.4s;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-opacity: 0;
  -khtml-opacity: 0;
  -moz-opacity: 0;
  -ms-opacity: 0;
  -o-opacity: 0;
  opacity: 0;
}
.testimonial-player .video-wrapper .caption {
  -webkit-transform: scale(4.06);
  -khtml-transform: scale(4.06);
  -moz-transform: scale(4.06);
  -ms-transform: scale(4.06);
  -o-transform: scale(4.06);
  transform: scale(4.06);
  transform-origin: left bottom;
  width: 12.5%;
}
.testimonial-player .video-wrapper[data-pos="0"] {
  left: 0px;
  top: 0px;
}
.testimonial-player .video-wrapper[data-pos="1"] {
  left: 269.5px;
  top: 0px;
}
.testimonial-player .video-wrapper[data-pos="2"] {
  left: 539px;
  top: 0px;
}
.testimonial-player .video-wrapper[data-pos="3"] {
  left: 808.5px;
  top: 0px;
}
.testimonial-player .video-wrapper[data-pos="4"] {
  left: 0px;
  top: 154px;
}
.testimonial-player .video-wrapper[data-pos="5"] {
  left: 269.5px;
  top: 154px;
}
.testimonial-player .video-wrapper[data-pos="6"] {
  left: 539px;
  top: 154px;
}
.testimonial-player .video-wrapper[data-pos="7"] {
  left: 808.5px;
  top: 154px;
}
.testimonial-player .video-wrapper[data-pos="8"] {
  left: 0px;
  top: 308px;
}
.testimonial-player .video-wrapper[data-pos="9"] {
  left: 269.5px;
  top: 308px;
}
.testimonial-player .video-wrapper[data-pos="10"] {
  left: 539px;
  top: 308px;
}
.testimonial-player .video-wrapper[data-pos="11"] {
  left: 808.5px;
  top: 308px;
}
.testimonial-player .video-wrapper[data-pos="12"] {
  left: 0px;
  top: 462px;
}
.testimonial-player .video-wrapper[data-pos="13"] {
  left: 269.5px;
  top: 462px;
}
.testimonial-player .video-wrapper[data-pos="14"] {
  left: 539px;
  top: 462px;
}
.testimonial-player .video-wrapper[data-pos="15"] {
  left: 808.5px;
  top: 462px;
}
.testimonial-player.display-video .video-wrapper {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-opacity: 1;
  -khtml-opacity: 1;
  -moz-opacity: 1;
  -ms-opacity: 1;
  -o-opacity: 1;
  opacity: 1;
}
.testimonial-player .testimonial-video-holder .caption {
  display: none;
}

@keyframes zoomin {
  0% {
    -webkit-transform: scale(0.245);
    -khtml-transform: scale(0.245);
    -moz-transform: scale(0.245);
    -ms-transform: scale(0.245);
    -o-transform: scale(0.245);
    transform: scale(0.245);
  }
  100% {
    -webkit-transform: scale(1);
    -khtml-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    left: 0;
    top: 0;
  }
}
@keyframes zoomout {
  0% {
    -webkit-transform: scale(1);
    -khtml-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    left: 0;
    top: 0;
    filter: alpha(opacity=100);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-opacity: 1;
    -khtml-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
    -o-opacity: 1;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0.245);
    -khtml-transform: scale(0.245);
    -moz-transform: scale(0.245);
    -ms-transform: scale(0.245);
    -o-transform: scale(0.245);
    transform: scale(0.245);
    filter: alpha(opacity=0);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-opacity: 0;
    -khtml-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
    -o-opacity: 0;
    opacity: 0;
  }
}
.audio-toggle {
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 24.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 17.4 13.9' enable-background='new 0 0 17.4 13.9' xml:space='preserve'%3E%3Cg%3E%3Cpolygon fill='%23FFFFFF' points='0,3.8 0,10.1 3.4,10.1 7.1,13.9 7.2,0 3.4,3.8 '/%3E%3C/g%3E%3Cg%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='0.6834' stroke-miterlimit='10' d='M7.2,1.4'/%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' d='M11.1,3'/%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' d='M11.9,11.8c1.2-1.2,2-3,2-4.9s-0.8-3.6-2-4.9'/%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' d='M9.6,4.5c0.6,0.6,1,1.5,1,2.4s-0.4,1.8-1,2.4'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  padding-top: 20px;
  margin-bottom: 20px;
}

.muted .audio-toggle {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 17.4 13.9' enable-background='new 0 0 17.4 13.9' xml:space='preserve'%3E%3Cg%3E%3Cpolygon fill='%23FFFFFF' points='0,3.8 0,10.1 3.4,10.1 7.1,13.9 7.2,0 3.4,3.8 '/%3E%3Cpolygon fill='%23FFFFFF' points='14.3,7.7 12,10 11.1,9.1 13.4,6.8 11.1,4.6 12,3.7 14.3,5.9 16.5,3.7 17.4,4.6 15.2,6.8 17.4,9.1 16.5,10 '/%3E%3C/g%3E%3C/svg%3E%0A");
}
.muted .audio-toggle:after {
  content: "MUTED";
  font-size: 0.5rem;
  position: absolute;
}

.testimonial-player.large-player .testimonial-grid {
  width: 28%;
  order: 2;
  max-height: 494px;
  overflow: hidden;
  overflow-y: scroll;
  padding: 4px;
  margin-right: -26px;
  display: block;
  -webkit-overflow-scrolling: touch;
  padding-right: 16px;
  margin-top: -3px;
}
.testimonial-player.large-player .testimonial-item {
  flex-basis: calc(100% - 16px);
}
.testimonial-player.large-player .testimonial-video-holder {
  width: 72%;
  position: static;
  pointer-events: all;
}
.testimonial-player.large-player .video-wrapper {
  width: 100%;
  padding-top: 56.25%;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-opacity: 1;
  -khtml-opacity: 1;
  -moz-opacity: 1;
  -ms-opacity: 1;
  -o-opacity: 1;
  opacity: 1;
  outline: none;
  animation: zoomin 0.4s forwards;
}
.testimonial-player.large-player .testimonial-video-holder .caption {
  padding: 10px;
  font-size: 1rem;
  width: 100%;
  margin-top: 1px;
  position: static;
  display: block;
}
.testimonial-player.large-player .testimonial-grid-holder {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* TWEENER - IE 10 */
  display: -webkit-flex; /* NEW - Chrome */
  display: flex;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
}
.testimonial-player.large-player .large-toggle {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 17.4 13.9' enable-background='new 0 0 17.4 13.9' xml:space='preserve'%3E%3Crect fill='%23FFFFFF' width='8.1' height='4.8'/%3E%3Crect x='9.4' fill='%23FFFFFF' width='8.1' height='4.8'/%3E%3Crect y='6.2' fill='%23FFFFFF' width='8.1' height='4.8'/%3E%3Crect x='9.4' y='6.2' fill='%23FFFFFF' width='8.1' height='4.8'/%3E%3C/svg%3E%0A");
  width: 20px;
  height: 20px;
  margin-top: 10px;
  background-repeat: no-repeat;
}

@media screen and (max-width: 1000px) {
  .testimonial-player {
    padding: 4% 0;
  }
  .testimonial-player .player-header {
    padding: 4%;
  }
  .testimonial-player h4 {
    font-size: 1.4rem;
  }
  .testimonial-player .testimonial-video-holder {
    margin-bottom: 30px;
  }
  .testimonial-player .testimonial-grid {
    display: block;
    white-space: nowrap;
    overflow: scroll;
    padding-bottom: 20px;
    padding-left: 4%;
    padding-top: 10px;
  }
  .testimonial-player .testimonial-item {
    display: inline-block;
    width: 45%;
    vertical-align: top;
  }
  .testimonial-player .testimonial-grid-holder {
    flex-direction: column;
    overflow: hidden;
  }
  .testimonial-player.large-player .testimonial-video-holder {
    width: 100%;
  }
  .testimonial-player.large-player .testimonial-grid {
    width: 100%;
    overflow-x: scroll;
    padding-left: 4%;
  }
  .testimonial-player .caption {
    white-space: normal;
  }
}/*# sourceMappingURL=video-grid.css.map */