/**
 * @version		1.5.0
 * @package		JoomlaXTC YouTube Playlist Wall for Joomla 3.x
 * @author		JoomlaXTC http://www.joomlaxtc.com
 * @copyright	Copyright (C) 2015 Monev Software LLC. All rights reserved.
 * @license		http://www.joomlaxtc.com/license JoomlaXTC Proprietary Use License
 */
.ytcwall_tmp1_playerWrap {
	position: relative;
	height: 0;
	padding-bottom: 56.25%; /* 16:9 */
	margin-bottom:25px;
	max-width:98%;width:98%;
   border: 10px solid #fff;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   background: #000;
}
.ytcwall_tmp1_playerWrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.ytpw_prev {
	cursor:pointer;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 20px 10px 0;
	border-color: transparent #1590c3 transparent transparent;
	display:inline-block;
	margin-right:6px;
}

.ytpw_next {
	cursor:pointer;
	display:inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 20px;
	border-color: transparent transparent transparent #1590c3;
}

.ytpw_prev.ytpw_disabled {
	cursor:default;
	border-color: transparent #d6d6d6 transparent transparent;
}
.ytpw_next.ytpw_disabled {
	cursor:default;
	border-color: transparent transparent transparent #d6d6d6;
}


/* GRID CSS STYLES */
.ytcwall_tmp1_gridWrap .gridImage img {
	display:block;
	max-width:100%;
	width:100%;
}

.ytcwall_tmp1_gridWrap p {}

.ytpw_video {
	cursor:pointer;
}

.ytpw_video.ytpw_empty {
	cursor:default;
}

/* FLEX GRID LAYOUT */
.ytpw_row {
	display: flex;
	display: -webkit-flex; /* Safari */
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
}

.ytpw_video {
	flex: 1;
	-webkit-flex: 1; /* Safari 6.1+ */
    -ms-flex: 1; /* IE 10 */ 
}

/* With Gutters */
.ytpw_row {
 	margin: -1em 0 0 -1em;
}
.ytpw_row > .ytpw_video {
	padding: 1em 0 0 1em;
}

/* Scroller */
#scrollbar { width: 200px; height: 200px; overflow-y: auto;}
#scrollbar::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
#scrollbar::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 5px;
}
#scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(255,255,255,0.5);
    border-radius: 5px;
}

/* CUSTOM TEMPLATE STYLING */

.jxtc_ytcwall_tmp1 {
   max-width:94%;width:94%;
   margin-bottom:10px;
   border: 10px solid #fff;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   background: #000;
}
.jxtc_ytcwall_tmp1 .mask {
   max-width:100%;width:100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
  
.jxtc_ytcwall_tmp1 img {
   display: block;
   position: relative;
   max-width:100%;width:100%;}


.jxtc_ytcwall_tmp1 p {
 text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   padding:10px;
   background: rgba(0, 0, 0, 0.8);
   margin:0!important;
   font-size:16px!important;
}


.jxtc_ytcwall_tmp1 .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
   padding: 10% 0%;
   max-height:100%;min-height:1%;height:100%;
}

.jxtc_ytcwall_tmp1 p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}

.jxtc_ytcwall_tmp1:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

.jxtc_ytcwall_tmp1:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.jxtc_ytcwall_tmp1:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}

/* RESPONSIVE FLEX GRID BREAKPOINTS */
@media (max-width: 768px) {
.ytcwall_tmp1_playerWrap,.jxtc_ytcwall_tmp1 {
   border: 0px solid #fff;
}
	
.ytpw_row {
  	margin:0em;
}
.ytpw_video.firstcol,.ytpw_video.centercol,.ytpw_video.lastcol {
	flex: 0 0 100%;  
	-webkit-flex: 0 0 100%; /* Safari 6.1+ */
    -ms-flex: 10 0 100%; /* IE 10 */ 
	padding:0em;
	 
}
.jxtc_ytcwall_tmp1 .mask {
   max-width:100%;min-width:1%;width:100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
    opacity: 1!important;
	
}
.jxtc_ytcwall_tmp1 p {
    -webkit-transform: translateY(0px)!important;
   -moz-transform: translateY(0px)!important;
   -o-transform: translateY(0px)!important;
   -ms-transform: translateY(0px)!important;
   transform: translateY(0px)!important;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
   filter: alpha(opacity=1);
    opacity: 1!important;
}
.jxtc_ytcwall_tmp1 {
   max-width:100%;width:100%;
}
}