/**
 # ------------------------------------------------------------------------
 * HYPER YOUTUBE PLAYLIST
 # ------------------------------------------------------------------------
 * @package      mod_hyper_youtube_playlist
 * @version      1.0
 * @created      September 2015
 * @author       PHP Design
 * @email        contact@php-design.com
 * @websites     http://php-design.com
 * @copyright    Copyright (C) 2015 PHP Design. All rights reserved.
 * @license      GNU General Public License version 2, or later
 # ------------------------------------------------------------------------
**/

.responsive.modhytplaylist{
	width: 100%;
	margin-left:auto;
	margin-right:auto;
}

.responsive .sliderwrapper{
	height: 100%;
	position: relative;
	overflow: hidden;
	padding: 1%;
}

.responsive.modhytplaylist .sliderwrapper{
	padding-bottom: 56.25%;
}

.responsive .sliderwrapper .contentdiv{
	visibility: hidden;
	position: absolute;
	left: 0;
	top: 0;
	width: 96%; 
	padding: 1%;
	margin:1%;
	filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
	filter:0;
}

.responsive .hytp-videoWrapper {
	position: relative;
	padding-bottom: 56.25%;
	height: 0; overflow: hidden;
}

.responsive .hytp-videoWrapper iframe,
.responsive .hytp-videoWrapper object,
.responsive .hytp-videoWrapper embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
	
.responsive .paginationhytplay{
	width: 100%;
	padding-top:5px;
	margin-top: 5px;
}

.responsive .paginationhytplay a img,
.responsive .paginationhytplay a:visited img{
	text-decoration: none;
	margin-bottom: 5px;
}

.responsive .paginationhytplay a:hover img, 
.responsive .paginationhytplay a.selected img{
	text-decoration: none;
}

.responsive .paginationhytplay-inner a img,
.responsive .paginationhytplay-inner img{
	padding:1%;
}

@media screen and (max-width: 377px){
	.responsive .paginationhytplay-inner a img,
	.responsive .paginationhytplay-inner img{
		width:46%!important;
	}
}