.hap-compact-1{
	position: relative;
	width: 60px;
	height:60px;
}
.hap-compact-1 .hap-btn{
    display: none;
    height:100%;
}
.hap-compact-1 .hap-contr-btn{
    width: 60px;
    height:60px;
    position: relative;
    cursor: pointer;
    background: #607D8B;
    border-radius: 100%;
}
.hap-compact-1 .hap-contr-btn svg{
    color:#fff;
}
@media (hover: hover) {
    .hap-compact-1 .hap-btn:hover svg,
    .hap-compact-1 .hap-contr-btn:hover > svg,
    .hap-compact-1 .hap-contr-btn-hover svg{
        color:#ffeb3b;
    } 
}
.hap-compact-1 .hap-contr-btn svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 22px;
    fill:currentColor;
    transition: color .1s ease-out;
}

.hap-compact-2{
	position: relative;
	background: #795548;
	width: 200px;
	height: 60px;
	border-radius: 8px;
}
.hap-compact-2 .hap-btn{
    display: none;
    height:100%;
}
.hap-compact-2 .hap-contr-btn{
    width: 50px;
    height:60px;
    position: relative;
    cursor: pointer;
    float: left;
}
.hap-compact-2 .hap-contr-btn svg{
    color:#ddd;
}
@media (hover: hover) {
    .hap-compact-2 .hap-btn:hover svg,
    .hap-compact-2 .hap-contr-btn:hover > svg,
    .hap-compact-2 .hap-contr-btn-hover svg{
        color:#fff;
    } 
}
.hap-compact-2 .hap-contr-btn svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 17px;
    fill:currentColor;
    transition: color .1s ease-out;
}

.hap-compact-2 .hap-playback-toggle svg{
	height: 22px;
}

.hap-compact .hap-volume-wrap{
	position:relative;
	width: 50px;
    height:60px;
    float: left;
}
.hap-compact .hap-volume-seekbar{
	position:absolute;
	left: 9px;
    top: -122px;
    width: 30px;
    height: 120px;
	cursor: pointer;
	touch-action: none;
	background: #795548;
	visibility: hidden;
}
.hap-compact .hap-volume-bg-hit{
    position: absolute;
    left: 0;
    width: 100%;
    bottom: -3px;
    height: 5px;
    background: rgba(0,0,0,0);
}
.hap-compact .hap-volume-bg{
	position:absolute;
	top:15px;
	left:13px;
	width:5px;
	height:90px;
	background:#ccc;
}
.hap-compact .hap-volume-level{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	background:#ff5722;
	transition: height 0.3s ease-in-out; 
}
.hap-compact .hap-volume-wrap:hover .hap-volume-seekbar{
	visibility: visible;
}





.hap-epic{
	position:relative;
    background: #fff;
    padding: 40px 40px 30px 40px;
}
.hap-epic .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-epic .hap-player-wrap{
	position:relative;
	width: 100%;
	/*height: 300px;*/
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
.hap-epic .hap-player-holder{
	position: relative;
	width: 300px;
}
.hap-epic .hap-btn{
	display: none;
	height:100%;
}

.hap-epic .hap-player-controls-right{
	display: flex;
	flex-direction: row;
	margin-right: 20px;
}
.hap-epic .hap-contr-btn{
	position: relative;
	width:40px;
	height:50px;
}



.hap-epic .hap-contr-btn svg{
	color:#777;
}
@media (hover: hover) {
	.hap-epic .hap-btn:hover svg,
	.hap-epic .hap-contr-btn:hover > svg,
	.hap-epic .hap-contr-btn-hover svg{
		color:#C90032;
	} 
}
.hap-epic .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 20px;
	fill:currentColor;
	transition: color .1s ease-out;
}


.hap-epic .hap-player-thumb-wrapper{
	position:relative;
	overflow:hidden;
	width: 100%;
    height: 300px;
}
.hap-epic .hap-player-thumb{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}






.hap-epic .hap-seekbar {
    position: relative;
    height: 50px;
    margin: 15px 20px;
    cursor: pointer;
    touch-action: none;

    display: flex;
    align-items: center;
    justify-content: center;
}

.hap-epic .hap-seekbar-wave,
.hap-epic .hap-seekbar-wave-progress{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.hap-epic .hap-seekbar-wave-progress{
    width: 0;
}


.hap-epic .hap-media-time-ad{
	display: none;
    position: absolute;
    top: 0;
    left:0;
    width: 100%;
    line-height: 50px;
    font-size: 14px;
    height: 100%;
    text-align: center;
    background: #ffffffd1;
}
.hap-epic .hap-media-time-ad{
	color:#c90032 !important;
}



.hap-epic .hap-player-controls{
	display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
}


.hap-epic .hap-player-controls-left{
	display: flex;
	flex-direction: row;
	align-items: center;
}



.hap-epic .hap-controls{
	position: relative;
	width:150px;
	height:50px;
}
.hap-epic .hap-prev-toggle{
	width: 50px;
}
.hap-epic .hap-playback-toggle{
	width: 50px;
}
.hap-epic .hap-playback-toggle svg{
	width:50px;
	height: 36px;
}
.hap-epic .hap-next-toggle{
	width: 50px;
}

.hap-epic .hap-volume-wrap{
	position: relative;
	margin-left:30px;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
}
.hap-epic .hap-volume-toggle{
	position:relative;
	width:40px;
	height:50px;
}
.hap-epic .hap-volume-toggle svg{
	height: 30px;
}
.hap-epic .hap-volume-seekbar{
	position: relative;
	margin-left: 10px;
	width:200px;
	height:25px;
	cursor: pointer;
	touch-action: none;
}
.hap-epic .hap-volume-bg{
	position:absolute;
	top:11px;
	left:10px;
	width:180px;
	height:4px;
}
.hap-epic .hap-volume-bg{
	background:#ddd;
}
.hap-epic .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
}
.hap-epic .hap-volume-level{
	background:#C90032;
}

.hap-epic .hap-random-toggle svg{
	height: 23px;
}
.hap-epic .hap-share-toggle svg{
	height: 28px;
}


.hap-epic .hap-playlist-main-title{
	margin-left: 20px;
    font-size: 36px;
    color: #111;
    display: none;
}
.hap-epic .hap-playlist-main-description{
    margin-left: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.3px;
    color: #C90032;
    display: none;
}







#hap-playlist-list{
	display:none;
}
.hap-epic .hap-playlist-holder{
	position: relative;
    top: 0;
    height: 100%;
    overflow: hidden;
    flex: 1;
}
.hap-epic .hap-playlist-inner{
	padding: 20px;
    position: relative;
    max-height: 250px;
    box-sizing:border-box;
}
.hap-epic .hap-playlist-item-content {
	color:#222;
}
.hap-epic .hap-playlist-item-selected .hap-playlist-title-wrap{
	color:#C90032;
}

.hap-epic .hap-playlist-duration{
	font-size: 12px;
}
.hap-epic .hap-playlist-date{
	font-size: 11px;
	color: #666;
}


.hap-epic .hap-playlist-icon svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 18px;
	fill:currentColor;
	transition: color .1s ease-out;
	color: #C90032;
}

/*
.hap-epic .hap-playlist-item-selected .hap-download svg,
.hap-epic .hap-playlist-item-selected .hap-link svg{
	color: #fff!important;
}
.hap-epic .hap-download:hover svg,
.hap-epic .hap-link:hover svg{
	color:#C90032;
}*/

.hap-epic .hap-playlist-filter-msg span{
	color: #C90032;
}
.hap-epic .hap-bottom-bar{
	position:relative;
	top:0;
	height:34px;
	width:100%;
	overflow:hidden;
}
.hap-epic .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	top:50%;
	margin:-9px 0 0 20px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#000 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline:none;
	font-size: 16px;
}

.hap-epic .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0;
	width:34px;
	height:100%;
	text-align: center;
	float: left;
}

.hap-epic .hap-bottom-bar-controls{
	position: absolute;
    right: 25px;
    height: 100%;
}

.hap-epic .hap-bottom-bar-controls .hap-contr-btn{
	position:relative;
	width:25px;
	height:34px;
	margin-left: 10px;
	float: left;
}
.hap-epic .hap-range-toggle svg{
	height:26px;
}


.hap-epic .hap-playback-rate-holder,
.hap-epic .hap-embed-holder,
.hap-epic .hap-share-holder,
.hap-epic .hap-range-holder{
    background: #fff; 
    border: 1px solid #ddd;
    box-shadow: rgba(135, 135, 135, 0.32) 0px 0px 11px;
}


/* redirect */
.hap-epic .hap-redirect-login-data{
	background: #fff; 
}
.hap-epic .hap-redirect-login-holder-inner{
	background: #ffffff9c;
}
.hap-epic .hap-redirect-login-btn{
	background: #C90032;
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
}
.hap-epic .hap-redirect-login-header{
  	color: #333;	
}
.hap-epic .hap-redirect-login-title{
    color: #ccc;
}

/*pwd */
.hap-epic .hap-pwd-title{
	color: #222;
}
.hap-epic .hap-pwd-confirm{
	background: #f3f3f3;
    color: #656565;
}



/* embed */
.hap-epic .hap-embed-field-wrap-selected{
    background: #C90032;
    color: #fff;
}
.hap-epic .hap-embed-title{
	color: #222;
}
.hap-epic .hap-share-copy,
.hap-epic .hap-embed-copy{
	background: #f3f3f3;
    color: #656565;
}



.hap-epic .hap-share-holder-inner{
	height: 50px;
}


/* dialog */

.hap-epic .hap-dialog{
    box-shadow: rgba(135, 135, 135, 0.32) 0px 0px 11px;
}
.hap-epic .hap-dialog-header{
	background: #777;
}
.hap-epic .hap-dialog .hap-dialog-close svg {
    color: #fff!important;
}

/* range */

.hap-epic .hap-range-bg{
	top:14px;
	height:4px;
}

.hap-epic .hap-range-handle-a-hit{
	border-bottom-color:#666;
}
@media (hover: hover) {
	.hap-epic .hap-range-handle-a-hit:hover{
		border-bottom-color:#C90032;
	}
}
.hap-epic .hap-range-handle-b-hit{
	border-top-color:#666;
}
@media (hover: hover) {
	.hap-epic .hap-range-handle-b-hit:hover{
		border-top-color:#C90032;
	}
}

.hap-epic .hap-range-min-time,
.hap-epic .hap-range-max-time{
	color: #333;
}
.hap-epic .hap-range-bg{
	background:#ddd;
}
.hap-epic .hap-range-level{
	background:#C90032;
}


/* playback rate */

.hap-epic .hap-playback-rate-bg{
	height: 4px;
	top:13px;
}

.hap-epic .hap-playback-rate-bg{
	background:#ddd;
}
.hap-epic .hap-playback-rate-level{
	background:#C90032;
}
.hap-epic .hap-playback-rate-drag{
    position: relative;
	top:-9px;
    width: 21px;
    height: 21px;
	border-radius: 100%;
	background:#C90032;
	-webkit-transform: scale( 0.5 );
    transform: scale( 0.5 );
	-webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
   	box-sizing: border-box;    
   	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
    float: right;
 	margin-right: -9px;
}
.hap-epic .hap-playback-rate-drag:hover,
.hap-epic .hap-playback-rate-drag:active {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.hap-epic .hap-tooltip{
	background:#C90032;
	color:#fff!important;
	box-shadow: 1px 1px 8px #6060606b;
}

.hap-epic .hap-preloader {
    background-color: #C90032;
}


/* statistics */

.hap-epic .hap-stats svg{
	color:#777;
}
@media (hover: hover) {
	.hap-epic .hap-playlist-item .hap-play-count:hover > svg,
	.hap-epic .hap-playlist-item .hap-like-count:hover > svg,
	.hap-epic .hap-playlist-item .hap-download-count:hover > svg{
		color:#C90032!important;
	} 

}

.hap-epic .hap-stats span{
	color:#666;
}



/* lyrics popup */

.hap-epic .hap-dialog{
	background-color: #fff;
}

.hap-epic.hap-breakpoint-800 .hap-player-outer,
.hap-epic.hap-breakpoint-800 .hap-player-wrap{
	height: auto;
	flex-direction:column;
}
.hap-epic.hap-breakpoint-800 .hap-player-holder{
	width: 100%;
}
.hap-epic.hap-breakpoint-800 .hap-player-thumb-wrapper{
	height: 300px;
	width: 300px;
	margin: 0 auto;
}
.hap-epic.hap-breakpoint-800 .hap-playlist-holder{
	flex:none;
}
.hap-epic.hap-breakpoint-800 .hap-player-controls{
	flex-direction: column;
}






.hap-epic-mini{
 	background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
}


.hap-epic-mini .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-epic-mini .hap-player-wrap{
	
}
.hap-epic-mini .hap-player-holder{
	position:relative;
	width: 100%;
	height: 150px;
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
.hap-epic-mini .hap-btn{
	display: none;
	height:100%;
}

.hap-epic-mini .hap-player-controls-right{
	display: flex;
	flex-direction: row;
	margin-right: 20px;
}
.hap-epic-mini .hap-contr-btn{
	position: relative;
	width:40px;
	height:50px;
}



.hap-epic-mini .hap-contr-btn svg{
	color:#777;
}
@media (hover: hover) {
	.hap-epic-mini .hap-btn:hover svg,
	.hap-epic-mini .hap-contr-btn:hover > svg,
	.hap-epic-mini .hap-contr-btn-hover svg{
		color:#00bcd4;
	} 
}
.hap-epic-mini .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 20px;
	fill:currentColor;
	transition: color .1s ease-out;
}

.hap-epic-mini .hap-player-left{
	width: 150px;
	height: 100%;
}

.hap-epic-mini .hap-player-thumb-wrapper{
	position:relative;
	overflow:hidden;
	width: 100%;
    height: 100%;
}
.hap-epic-mini .hap-player-thumb{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}

.hap-epic-mini .hap-player-right{
	height: 100%;
	display: flex;
	flex-direction: column;
	flex:1;
	justify-content: center;
}

.hap-epic-mini .hap-info{
	margin: 10px;
    text-align: center;
    color: #00bcd4;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}


.hap-epic-mini .hap-seekbar {
    position: relative;
    height: 50px;
    margin: 0 40px;
    cursor: pointer;
    touch-action: none;
}
.hap-epic-mini .hap-seekbar-wave,
.hap-epic-mini .hap-seekbar-wave-progress{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.hap-epic-mini .hap-seekbar-wave-progress{
    width: 0;
}




.hap-epic-mini .hap-media-time-current{
	position:absolute;
	left:0;
	bottom: 0;
	text-align: center;
	margin:0!important;
	padding: 2px 4px;
	font-size:11px!important;
	pointer-events:none;
	width:auto;
	color: #fff !important;
    background: #00bcd4;
}
.hap-epic-mini .hap-media-time-total{
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: center;
    margin: 0!important;
    padding: 2px 4px;
    font-size: 11px!important;
    pointer-events: none;
    width: auto;
    color: #fff !important;
    background: #777;

}



.hap-epic-mini .hap-player-controls{
	display: flex;
    height: 50px;
    width: 165px;
    justify-content: space-between;
    margin: 0 auto;
}


.hap-epic-mini .hap-player-controls-left{
	display: flex;
	flex-direction: row;
}



.hap-epic-mini .hap-controls{
	position: relative;
	width:150px;
	height:50px;
}
.hap-epic-mini .hap-prev-toggle{
	width: 50px;
}
.hap-epic-mini .hap-playback-toggle{
	width: 50px;
}
.hap-epic-mini .hap-playback-toggle svg{
	width:50px;
	height:50px;
	height: 26px;
}
.hap-epic-mini .hap-next-toggle{
	width: 50px;
}

.hap-epic-mini .hap-volume-wrap{
	position: relative;
	margin-left:30px;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
}
.hap-epic-mini .hap-volume-toggle{
	position:relative;
	width:40px;
	height:50px;
}
.hap-epic-mini .hap-volume-toggle svg{
	height: 30px;
}
.hap-epic-mini .hap-volume-seekbar{
	position: relative;
	margin-left: 10px;
	width:200px;
	height:25px;
	cursor: pointer;
	touch-action: none;
}
.hap-epic-mini .hap-volume-bg{
	position:absolute;
	top:11px;
	left:10px;
	width:180px;
	height:4px;
}
.hap-epic-mini .hap-volume-bg{
	background:#ddd;
}
.hap-epic-mini .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
}
.hap-epic-mini .hap-volume-level{
	background:#00bcd4;
}

.hap-epic-mini .hap-random-toggle svg{
	height: 23px;
}
.hap-epic-mini .hap-share-toggle svg{
	height: 28px;
}
.hap-epic-mini .hap-share-close svg{
	height: 16px;
}








#hap-playlist-list{
	display:none;
}

.hap-fixed{
	position:fixed;
	width:100%;
	max-width: none;
	bottom:-500px;
	left:0;
	line-height:normal!important;
	z-index:999999;
	display: none;
	margin: 0;
	transition: bottom 0.5s ease-out;
	max-width: none!important;
}
.hap-fixed .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-fixed .hap-player-holder{
	position: relative;
	left:0;
	background:#27363b;
	width: 100%;
    float: left;
    height: 60px;
}

.hap-fixed .hap-btn{
	display: none;
	height:100%;
}
.hap-fixed .hap-contr-btn{
	/*width: 25px;
	height: 100%;
	position: relative;
	cursor: pointer;*/
}
.hap-fixed .hap-contr-btn svg{
	color:#eee;
}
@media (hover: hover) {
	.hap-fixed .hap-btn:hover svg,
	.hap-fixed .hap-contr-btn:hover > svg,
	.hap-fixed .hap-contr-btn-hover svg{
		color:#ffa48f;
	} 
}
.hap-fixed .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 15px;
	fill:currentColor;
	transition: color .3s ease-out;
}

.hap-fixed .hap-range-toggle svg{
	height:19px;
}
.hap-fixed .hap-volume-toggle svg{
	height:20px;
}


.hap-fixed .hap-playback-toggle-ex{
	position: absolute;
	width:30px;
	height:30px;
	top:-34px;
	right:35px;
	background-color: #27363b;
	border-top: 1px solid #444;
	border-left: 1px solid #444;
	border-right: 1px solid #444;
	cursor: pointer;
	z-index: 2;
	display: none;
}
.hap-fixed .hap-player-toggle-ex{
	position: absolute;
	width:30px;
	height:30px;
	top:-34px;
	right:0px;
	background-color: #27363b;
	border-top: 1px solid #444;
	border-left: 1px solid #444;
	border-right: 1px solid #444;
	cursor: pointer;
	z-index: 2;
}
.hap-fixed .hap-btn-player-toggle{
	transition: transform 0.3s ease-out;
	height: 100%;
}
.hap-fixed .hap-btn-player-toggle svg{
	height: 18px;
}
.hap-fixed .hap-btn-player-toggle-rotate{
	transform: rotate(180deg);
}

.hap-fixed .hap-right-controls{
	position: relative;
	float: right;
	height: 25px;
	top:17px;
    display: flex;
    margin-right: 15px;
}
.hap-fixed .hap-right-controls .hap-contr-btn{
	float: left;
	margin-left: 10px;
	width: 25px;
	position: relative;
}

.hap-fixed .hap-playlist-bar-controls-right{
	position: relative;
	float: right;
	height: 100%;
    display: flex;
    margin-right: 15px;
}
.hap-fixed .hap-playlist-bar-controls-right .hap-contr-btn{
	float: left;
	margin-left: 10px;
	height: 100%;
	width: 25px;
	position: relative;
}

.hap-fixed .hap-left-controls{
	position: relative;
}

.hap-fixed .hap-player-thumb{
	position: relative;
	width:60px;
	height:60px;
	float: left;
	overflow: hidden;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-fixed .hap-info{
	width: calc(50% - 135px);
    float: left;
    height: 60px;
    flex-direction: column;
    overflow: hidden;
    justify-content: center; 
    display: flex;
}
.hap-fixed .hap-player-title{
	font-size:15px;
	color:#fff;
	margin-left: 10px;
	margin-bottom: 5px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.hap-fixed .hap-player-artist{
	font-size:13px;
	color:#ffa48f;
	margin-left: 10px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.hap-fixed .hap-center-controls{
	position: absolute;
	display: inline-block;
	height: 30px;
	top:15px;
    left: 50%;
    transform: translateX(-50%);
}
.hap-fixed .hap-prev-toggle{
	position:relative;
	left:0px;
	top:2px;
	width:25px;
	height:25px;
	float:left;
	margin-right:20px;
}
.hap-fixed .hap-playback-toggle{
	position:relative;
	top:0px;
	width:30px;
	height:30px;
	float:left;
	margin-right:20px;
}
.hap-fixed .hap-playback-toggle svg{
	height:25px;
}
.hap-fixed .hap-next-toggle{
	position:relative;
	top:2px;
	width:25px;
	height:25px;
	float:left;
}

.hap-fixed .hap-volume-toggle{
	position:relative;
	width:25px;
	height:25px;
	float:right;
	cursor: pointer;
}
.hap-fixed .hap-volume-seekbar{
	position:relative;
	left:0px;
	top:5px;
	width:100px;
	height:16px;
	float:right;
	cursor: pointer;
	touch-action: none;
}
.hap-fixed .hap-volume-bg{
	position:absolute;
	top:6px;
	left:10px;
	width:80px;
	height:3px;
	background:#ccc;
}
.hap-fixed .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	background:#ffa48f;
	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
}

.hap-fixed .hap-seekbar{
	position:absolute;
	top:-14px;
	left:0px;
	width: 100%;
	height:20px;
	cursor: pointer;
	touch-action: none;
	z-index: 1;
}
.hap-fixed .hap-progress-bg{
	position:relative;
	background:#ccc;
	width:100%;
	top:11px;
	height:3px;
}
.hap-fixed .hap-load-level{
	position:absolute;
	background:#ccc;
	top:0;
	height:100%;
}
.hap-fixed .hap-progress-level{
	position:absolute;
	background:#ffa48f;
	top:0;
	height:100%;
}
.hap-fixed .hap-ad-progress-level{
	background: #ffeb3b;
}
.hap-fixed .hap-media-time-ad{
	position: absolute;
    background: #e91e63;
    color: #ffffff;
    bottom: 9px;
    padding: 3px;
    left: 0;
    font-size: 13px;
    display: none;
}






#hap-playlist-list{
	display:none;
}
.hap-fixed .hap-playlist-holder{
	position:relative;
	width:100%;
	background:rgb(39 54 59);
	overflow:hidden;
	height: 280px;
	border-top: 2px solid #444;
}
.hap-fixed .hap-playlist-inner{
	margin:20px 20px 10px 20px;
	max-height: 210px;
	position: relative;
	height: 100%;
}
.hap-fixed .hap-playlist-item{
	font-size:15px;
 	padding: 4px;
 	margin-bottom: 5px;
 	transition: background-color 0.3s ease-out;
}
.hap-fixed .hap-playlist-item:last-child{
 	margin-bottom: 0;
}
.hap-fixed .hap-playlist-item-content {
	color:#aaa;
}
.hap-fixed .hap-playlist-thumb{
	height:40px;
	width: 40px;
	border:1px solid #aaa;
	margin-right: 10px;
}
.hap-fixed .hap-thumbimg{
	-webkit-backface-visibility: hidden;
	filter: grayscale(100%);
}
@media (hover: hover) {
	.hap-fixed .hap-playlist-item:hover .hap-playlist-thumb img{
		filter: grayscale(0%);
	}
}

.hap-fixed .hap-playlist-item-selected{
	background: #ddd;
}
.hap-fixed .hap-playlist-item-selected .hap-playlist-title-wrap{
	color:#fff;
}

.hap-fixed .hap-playlist-description{
	font-size: 13px;
}
.hap-fixed .hap-playlist-description{
	color: #555;
}

.hap-fixed .hap-playlist-duration{
	font-size: 12px;
}
.hap-fixed .hap-playlist-duration{
	color: #ccc;
}
.hap-fixed .hap-playlist-date{
	font-size: 11px;
}
.hap-fixed .hap-playlist-date{
	color: #787878;
}
.hap-fixed .hap-playlist-icons{
	margin-right: 20px;
}



.hap-fixed .hap-download svg, 
.hap-fixed .hap-link svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 16px;
    fill: currentColor;
    transition: color .1s ease-out;
}
.hap-fixed .hap-download svg, 
.hap-fixed .hap-link svg {
    color: #666;
}
@media (hover: hover) {
	.hap-fixed .hap-download:hover svg, 
	.hap-fixed .hap-link:hover svg {
	    color: #fff;
	}
}


.hap-fixed .hap-playlist-filter-msg span{
	color: #fff;
}

.hap-fixed .hap-playlist-bar{
	position:relative;
	top:0px;
	clear:both;
	height:40px;
	width:100%;
	overflow:hidden;
}
.hap-fixed .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	top:50%;
	margin:-9px 0 0 20px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#333 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline: none;
}

.hap-fixed .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0px;
	width:25px;
	height:100%;
	text-align: center;
	float: left;
}
.hap-fixed .hap-sort-alpha svg{
	height: 17px;
}

/* dialog */

.hap-fixed .hap-dialog-header{
	background: #27363b;
}


/* range */

.hap-fixed .hap-range-bg{
	top:14px;
	height:3px;
}


.hap-fixed .hap-range-handle-a-hit{
	border-bottom-color:#ccc;
}
@media (hover: hover) {
	.hap-fixed .hap-range-handle-a-hit:hover{
		border-bottom-color:#ffa48f;
	}
}
.hap-fixed .hap-range-handle-b-hit{
	border-top-color:#ccc;
}
@media (hover: hover) {
	.hap-fixed .hap-range-handle-b-hit:hover{
		border-top-color:#ffa48f;
	}
}

.hap-fixed .hap-range-min-time,
.hap-fixed .hap-range-max-time{
	color: #999;
}

.hap-fixed .hap-range-bg{
	background:#ccc;
}
.hap-fixed .hap-range-level{
	background:#ffa48f;
}

/* playback rate */

.hap-fixed .hap-playback-rate-min,
.hap-fixed .hap-playback-rate-max{
	color: #aaa;
}

.hap-fixed .hap-playback-rate-bg{
	height: 3px;
	top:13px;
}

.hap-fixed .hap-range-holder,
.hap-fixed .hap-playback-rate-holder,
.hap-fixed .hap-embed-holder,
.hap-fixed .hap-share-holder{
	background: #27363b; 
	border: 1px solid #444;
	box-shadow: 1px 1px 6px rgba(40,40,40,0.3);
}

/* redirect */
.hap-fixed .hap-redirect-login-data{
	background: #27363b; 
}
.hap-fixed .hap-redirect-login-holder{
	position: fixed;
}
.hap-fixed .hap-redirect-login-holder-inner{
	background: #0000006b;
}
.hap-fixed .hap-redirect-login-btn{
	background: #ffa48f;
    color: #fff;
    padding: 5px 10px;
    border-radius: 2px;
}
.hap-fixed .hap-redirect-login-header{
  	color: #fff;	
}
.hap-fixed .hap-redirect-login-title{
    color: #ccc;
}




/* pwd */
.hap-fixed .hap-pwd-title{
	color: #666;
}
.hap-fixed .hap-pwd-close svg{
	color: #666;
}


/* embed */
.hap-fixed .hap-embed-field-wrap-selected{
    background: #ddd;
    color: #fff;
}



.hap-fixed .hap-playback-rate-bg{
	background:#ccc;
}
.hap-fixed .hap-playback-rate-level,
.hap-fixed .hap-playback-rate-drag{
	background:#ffa48f;
}

.hap-fixed .hap-tooltip{
	background:#ffa48f;
	color:#fff;
}
.hap-fixed .hap-preloader {
    background-color: #ffa48f;
}

/* lyrics popup */

.hap-fixed .hap-dialog-content{
	background-color: #ddd;
}

/* stats */

.hap-fixed .hap-stat-icon{
	transition: color 0.3s ease-out;
}

.hap-fixed .hap-stat-icon{
	color:#777;
}
@media (hover: hover) {
	.hap-fixed .hap-stat-icon:hover{
		color:#fff;
	}
}


.hap-fixed .hap-playlist-item-selected .hap-playlist-duration{
	color: #aaa;
}


/* breakpoints */

.hap-fixed.hap-breakpoint-650 .hap-player-holder {
    height: 120px;
}
.hap-fixed.hap-breakpoint-650 .hap-left-controls{
    overflow: hidden;
    width:100%;
}
.hap-fixed.hap-breakpoint-650 .hap-info{
	width: calc(100% - 60px);
}
.hap-fixed.hap-breakpoint-650 .hap-center-controls{
	left:15px;
	top:75px;
	transform: none;
}
.hap-fixed.hap-breakpoint-650 .hap-right-controls {
    clear:left;
}
.hap-fixed.hap-breakpoint-650 .hap-search-filter{
	display: none;
	display: none;
	display: none;
}






.hap-fixed2{
	position:fixed;
	width:100%;
	max-width: none;
	bottom:0;
	left:0;
	line-height:normal!important;
	z-index:999999;
	display: none;
	margin: 0;
	transition: bottom 0.5s ease-out;
	max-width: none!important;
}
.hap-fixed2 .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-fixed2 .hap-player-holder{
	position: fixed;
    height: 60px;
    left: 0;
    bottom: -60px;
    background: #fafafa;
    width: 100%;
    box-shadow: 0px -2px 3px #999;
    transition: bottom 0.5s ease-out;
}

.hap-fixed2 .hap-btn{
	display: none;
	height:100%;
}
.hap-fixed2 .hap-contr-btn svg{
	color:#5a5a5a;
}
@media (hover: hover) {
	.hap-fixed2 .hap-btn:hover svg,
	.hap-fixed2 .hap-contr-btn:hover > svg,
	.hap-fixed2 .hap-contr-btn-hover svg{
		color:#ff7e00 !important;
	} 
}
.hap-fixed2 .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 19px;
	fill:currentColor;
	transition: color .3s ease-out;
}
.hap-fixed2 .hap-range-toggle svg{
	height: 24px;
}

.hap-fixed2 .hap-playback-toggle-ex{
	position: absolute;
	width:30px;
	height:30px;
	bottom:0;
	right:35px;
	box-shadow: 0px 0px 3px #999;
	background-color: #5a5a5a;
	cursor: pointer;
	z-index: 2;
}
.hap-fixed2 .hap-player-toggle-ex{
	position: absolute;
	width:30px;
	height:30px;
	bottom:0;
	right:0px;
	box-shadow: 0px 0px 3px #999;
	background-color: #5a5a5a;
	cursor: pointer;
	z-index: 2;
}
.hap-fixed2 .hap-btn-player-toggle{
	transition: transform 0.3s ease-out;
	height: 100%;
}
.hap-fixed2 .hap-btn-player-toggle svg{
	height: 18px;
}
.hap-fixed2 .hap-btn-player-toggle-rotate{
	transform: rotate(180deg);
}

.hap-fixed2 .hap-playback-toggle-ex svg,
.hap-fixed2 .hap-player-toggle-ex svg{
	color: #fff!important;
}
.hap-fixed2 .hap-ex-controls{
	position: absolute;
    bottom: 62px;
    right: 0;
    width: 70px;
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease-out;
}
.hap-fixed2 .hap-ex-controls-shown{
	height: 34px;
}


.hap-fixed2 .hap-right-controls{
	position: absolute;
	right: 20px;
	height: 40px;
	top:10px;
    display: flex;
}
.hap-fixed2 .hap-right-controls .hap-contr-btn{
	margin-left: 10px;
	width: 25px;
	height: 40px;
	position: relative;
}

.hap-fixed2 .hap-playlist-bar-controls-right{
	position: relative;
	float: right;
	height: 100%;
    display: flex;
    margin-right: 15px;
}
.hap-fixed2 .hap-playlist-bar-controls-right .hap-contr-btn{
	float: left;
	margin-left: 10px;
	height: 100%;
	width: 25px;
	position: relative;
}

.hap-fixed2 .hap-left-controls{
	position: relative;
}

.hap-fixed2 .hap-player-thumb{
	position: relative;
	width:60px;
	height:60px;
	float: left;
	overflow: hidden;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-fixed2 .hap-info{
	width: calc(50% - 135px);
    float: left;
    height: 60px;
    flex-direction: column;
    overflow: hidden;
    justify-content: center; 
    display: flex;
}
.hap-fixed2 .hap-player-title{
	font-size:17px;
	color:#111;
	margin-left: 10px;
	margin-bottom: 1px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.hap-fixed2 .hap-player-artist{
	font-size:13px;
	color:#ff7e00;
	margin-left: 10px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.hap-fixed2 .hap-center-controls{
	position: absolute;
	top:10px;
	left:50%;
	height: 40px;
	transform: translateX(-50%);
	 display: flex;
    flex-direction: row;
}

.hap-fixed2 .hap-center-controls .hap-contr-btn{
	position: relative;
	display: inline-block;
	height: 40px;
	width: 40px;
	top:0;
    left: 0;
    margin-right: 5px;
    margin-left: 5px;
}

.hap-fixed2 .hap-volume-toggle{
	position:relative;
	width:25px;
	height:25px;
	float:right;
	cursor: pointer;
}
.hap-fixed2 .hap-volume-seekbar{
	position:relative;
	left:0px;
	top:0;
	width:100px;
	height:100%;
	float:right;
	cursor: pointer;
	touch-action: none;
}
.hap-fixed2 .hap-volume-bg{
	position:absolute;
	top:18px;
	left:10px;
	width:80px;
	height:3px;
	background:#ccc;
}
.hap-fixed2 .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	background:#ff7e00;
	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
}

.hap-fixed2 .hap-seekbar{
	position:absolute;
	top:-11px;
	left:60px;
	right: 0;
	height:20px;
	cursor: pointer;
	touch-action: none;
	z-index: 1;
}
.hap-fixed2 .hap-progress-bg{
	position:relative;
	background:#ccc;
	width:100%;
	top:11px;
	height:3px;
}
.hap-fixed2 .hap-load-level{
	position:absolute;
	background:#ccc;
	top:0;
	height:100%;
}
.hap-fixed2 .hap-progress-level{
	position:absolute;
	background:#ff7e00;
	top:0;
	height:100%;
}
.hap-fixed2 .hap-ad-progress-level{
	background: #ffeb3b;
}
.hap-fixed2 .hap-media-time-ad{
	position: absolute;
    background: #e91e63;
    color: #ffffff;
    bottom: 61px;
    padding: 3px;
    left: 0;
    font-size: 13px;
    display: none;
}


#hap-playlist-list{
	display:none;
}
.hap-fixed2 .hap-playlist-holder{
	position: absolute;
    bottom: -500px;
    left: 0px;
    width: 100%;
    height: 310px;
    background: #ededed;
    transition: bottom 0.5s ease-out;
}
.hap-fixed2 .hap-playlist-inner{
	margin:10px 20px 10px 20px;
	position: relative;
}
.hap-fixed2 .hap-playlist-content{
    display: flex;
    flex-direction: row;
    margin-bottom: 20px; 
}

.hap-fixed2 .hap-playlist-item{
	position: relative;
 	width: 170px;
    height: 220px;
    background: #fafafa;
    margin-right: 10px;
    box-shadow: 1px 1px 2px #999;
    overflow: hidden;
    flex-shrink: 0;
    cursor: pointer;
    padding: 10px;
    box-sizing: border-box;

    transition: background-color 0.3s ease-out;

}
.hap-fixed2 .hap-playlist-item:last-child{
 	margin-bottom: 0;
}
.hap-fixed2 .hap-playlist-item-content {
	color:#ccc;
}
.hap-fixed2 .hap-playlist-thumb{
	width: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    height: 150px;
    overflow: hidden;
}
.hap-fixed2 .hap-thumbimg{
    min-width: 100%;
    object-fit: cover;
    min-height: 100%;
    display: block;
}
.hap-fixed2 .hap-playlist-info{
	font-size: 15px;
}

.hap-fixed2 .hap-playlist-item-selected{
	background: #ff7e00;
}
.hap-fixed2 .hap-playlist-item-selected .hap-playlist-title-wrap{
	color: #fff;
}

.hap-fixed2 .hap-playlist-description{
	font-size: 13px;
}
.hap-fixed2 .hap-playlist-description{
	color: #555;
}

.hap-fixed2 .hap-playlist-duration{
	font-size: 12px;
}
.hap-fixed2 .hap-playlist-duration{
	color: #ccc;
}
.hap-fixed2 .hap-playlist-date{
	font-size: 11px;
}
.hap-fixed2 .hap-playlist-date{
	color: #787878;
}
.hap-fixed2 .hap-playlist-icons{
    position: absolute;
    top: 132px;
    display: flex;
    flex-direction: revert;
    right: 10px;
    align-items: center;
    opacity: 0;
}
.hap-fixed2 .hap-playlist-item-selected .hap-playlist-icons{
	opacity: 1;
}
@media (hover: hover) {
	.hap-fixed2 .hap-playlist-item:hover .hap-playlist-icons{
		opacity: 1;
	}
}
.hap-fixed2 .hap-playlist-icons .hap-playlist-icon{
	width: 30px;
}


.hap-fixed2 .hap-download, 
.hap-fixed2 .hap-link{
	color:#fff!important;
}
.hap-fixed2 .hap-download svg, 
.hap-fixed2 .hap-link svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 15px;
    fill: currentColor;
    transition: color .1s ease-out;
}
@media (hover: hover) {
	.hap-fixed2 .hap-download:hover svg,
	.hap-fixed2 .hap-link:hover svg{
		color:#ff7e00!important;
	}
}

.hap-fixed2 .hap-playlist-filter-msg span{
	color: #fff;
	font-size: 20px;
}

.hap-fixed2 .hap-playlist-bar{
	position:relative;
	top:0px;
	height:40px;
	width:100%;
	overflow:hidden;
}
.hap-fixed2 .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	top:50%;
	margin:-9px 0 0 20px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#333 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline: none;
}

.hap-fixed2 .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0px;
	width:25px;
	height:100%;
	text-align: center;
	float: left;
}
.hap-fixed2 .hap-sort-alpha svg{
	height: 17px;
}

/* dialog */

.hap-fixed2 .hap-dialog-header{
	background: #333;
}
.hap-fixed2 .hap-dialog .hap-dialog-close svg {
    color: #fff!important;
}

/* range */

.hap-fixed2 .hap-range-bg{
	top:14px;
	height:3px;
}

.hap-fixed2 .hap-range-handle-a-hit{
	border-bottom-color:#5a5a5a;
}
@media (hover: hover) {
	.hap-fixed2 .hap-range-handle-a-hit:hover{
		border-bottom-color:#ff7e00;
	}
}
.hap-fixed2 .hap-range-handle-b-hit{
	border-top-color:#5a5a5a;
}
@media (hover: hover) {
	.hap-fixed2 .hap-range-handle-b-hit:hover{
		border-top-color:#ff7e00;
	}
}

.hap-fixed2 .hap-range-min-time,
.hap-fixed2 .hap-range-max-time{
	color: #999;
}

.hap-fixed2 .hap-range-bg{
	background:#ccc;
}
.hap-fixed2 .hap-range-level{
	background:#ff7e00;
}

/* playback rate */

.hap-fixed2 .hap-playback-rate-min,
.hap-fixed2 .hap-playback-rate-max{
	color: #aaa;
}

.hap-fixed2 .hap-playback-rate-bg{
	height: 3px;
	top:13px;
}

.hap-fixed2 .hap-range-holder,
.hap-fixed2 .hap-playback-rate-holder,
.hap-fixed2 .hap-embed-holder,
.hap-fixed2 .hap-share-holder{
	background: #fafafa;
    box-shadow: 0px 0px 5px #99999954;
}

/* redirect */
.hap-fixed2 .hap-redirect-login-data{
	background: #27363b; 
}
.hap-fixed2 .hap-redirect-login-holder{
	position: fixed;
}
.hap-fixed2 .hap-redirect-login-holder-inner{
	background: #fafafac7;
}
.hap-fixed2 .hap-redirect-login-btn{
	background: #5a5a5a;
    color: #fff;
    padding: 5px 10px;
}
.hap-fixed2 .hap-redirect-login-header{
  	color: #fff;	
}
.hap-fixed2 .hap-redirect-login-title{
    color: #ccc;
}





/* pwd */
.hap-fixed2 .hap-pwd-title{
	color: #666;
}


/* embed */

.hap-fixed2 .hap-embed-title{
	color: #333;
}

.hap-fixed2 .hap-embed-field-wrap-selected{
    background: #ff7e00;
    color: #fff;
}

.hap-fixed2 .hap-share-copy, .hap-fixed2 .hap-embed-copy{
    background: #5a5a5a;
    color: #fff;
}



.hap-fixed2 .hap-playback-rate-bg{
	background:#ccc;
}
.hap-fixed2 .hap-playback-rate-level,
.hap-fixed2 .hap-playback-rate-drag{
	background:#ff7e00;
}

.hap-fixed2 .hap-tooltip{
	background:#ff7e00;
	color:#fff;
}
.hap-fixed2 .hap-preloader {
    background-color: #ff7e00;
}

/* lyrics popup */

.hap-fixed2 .hap-dialog-content{
	background-color: #f7f7f7;
}

/* stats */

.hap-fixed2 .hap-stats{
	min-width: auto;
}

.hap-fixed2 .hap-stat-icon{
	transition: color 0.3s ease-out;
	filter: drop-shadow( 0px 0px 1px rgba(0, 0, 0, .5));
}

.hap-fixed2 .hap-stat-icon{
	color:#eee;
}
@media (hover: hover) {
	.hap-fixed2 .hap-stat-icon:hover{
		color:#ff7e00;
	}
}

.hap-fixed2 .hap-playlist-item-selected .hap-playlist-duration{
	color: #aaa;
}


/* breakpoints */

.hap-fixed2.hap-breakpoint-900 .hap-player-holder {
    height: 100px;
}
.hap-fixed2.hap-breakpoint-900.hap-is-playlist-opened .hap-playlist-holder{
	bottom:100px!important;
}
.hap-fixed2.hap-breakpoint-900:not(.hap-is-playlist-opened) .hap-playlist-holder{
	bottom:60px;
}
.hap-fixed2.hap-breakpoint-900 .hap-left-controls{
    overflow: hidden;
    width:100%;
}
.hap-fixed2.hap-breakpoint-900 .hap-info{
	width: calc(100% - 60px);
}
.hap-fixed2.hap-breakpoint-900 .hap-center-controls{
	top:60px;
}
.hap-fixed2.hap-breakpoint-900 .hap-search-filter{
	width: 70px!important;
}
.hap-fixed2.hap-breakpoint-900 .hap-volume-seekbar{
	display: none;
}






/* ############################################ */
/* grid */
/* ############################################ */


.hap-grid .hap-playlist-item{
    position: relative;
    overflow: hidden;
    font-size: 16px;
    padding: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    box-shadow: 0px -1px 12px #2f2f2f30;
}

/* grid */

.hap-grid .hap-playlist-content{
	display: grid;
    grid-gap: 1rem;
    justify-items: center;
}
@media (min-width: 600px) {
    .hap-grid .hap-playlist-content{
        grid-template-columns: repeat(2, 1fr); 
 	}
}
@media (min-width: 900px) {
	.hap-grid .hap-playlist-content{ 
    	grid-template-columns: repeat(3, 1fr); 
    }
}
@media (min-width: 1200px) {
	.hap-grid .hap-playlist-content{ 
    	grid-template-columns: repeat(4, 1fr); 
    }
}

.hap-grid .hap-playlist-item-wrap,
.hap-grid .hap-playlist-item-content,
.hap-grid .hap-playlist-thumb{
    height: 100%;
}

.hap-grid .hap-playlist-item-content{
	display: block;
	margin: 0;
	position: relative;
}
.hap-grid .hap-playlist-thumb{
    position:relative;
    top:0px;
    left:0px;
    width: 100%;
    flex-shrink: 0;
    overflow:hidden;
    display: block;
    transition: opacity 300ms ease-out; 
}
.hap-grid .hap-thumbimg{
    position:relative;
    display: block;
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    opacity: 0;
}
.hap-grid .hap-playlist-thumb-style{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.hap-grid .hap-playlist-thumb-style{
	background-image: url(//gamedaybeats.com/wp-content/plugins/apmap/source/data/misc/play.png);
  	background-repeat: no-repeat;
  	background-position: center;
  	transition: opacity .2s ease-in; 
  	opacity: 0;
}
.hap-grid .hap-playlist-thumb-style-pause{
    background-image: url(//gamedaybeats.com/wp-content/plugins/apmap/source/data/misc/pause.png)!important;
}
.hap-grid .hap-playlist-item-selected .hap-playlist-thumb-style{
    opacity: 1;
}
@media (hover: hover) {
    .hap-grid .hap-playlist-thumb:hover .hap-playlist-thumb-style{
        opacity: 1;
    }
}
.hap-grid .hap-playlist-item-selected .hap-thumbimg{
    transform: scale(1.1);
    transition: all .2s ease-in; 
    filter: brightness(70%);
}

.hap-grid.hap-info-dot .hap-playlist-title-wrap{
    position: absolute;
    top: 10px;
    right: 0;
    box-sizing: border-box;
    display: inline-block;
    color: #555;
    background: #fffffff2;
    text-align: right;
    padding: 10px;
    text-transform: uppercase;
}

.hap-grid.hap-info-dot .hap-playlist-description {
    display: none;
}

.hap-grid .hap-playlist-title-wrap{
	display: flex;
    flex-direction: column;
}
.hap-grid .hap-playlist-title{
	font-size: 16px;
}

/*search*/
.hap-grid .hap-playlist-filter-msg{
    position: relative;
    text-align: center;
    margin: 50px;
    display:none;
}
.hap-grid .hap-playlist-filter-msg span{
    position: relative;
	font-size: 16px;
}
.hap-grid .hap-playlist-bar{
	position:relative;
	top:0;
	height:40px;
	width:100%;
	display: flex;
    align-items: center;
    overflow: hidden;
    justify-content: center;
    margin-bottom: 10px;
}
.hap-grid .hap-search-filter{
	position:relative;
	width:200px!important;
	height:23px!important;
	margin:0!important;
	padding:0!important;
	border-top:0!important;
	border-left:0!important;
	border-right:0!important;
	border-bottom: 1px solid #ccc!important;
	box-shadow:none!important; 
	line-height:1!important; 
	outline:none!important; 
	font-size: 13px;
	text-align: center;
	background: none;
}
.hap-grid .hap-search-filter::placeholder { 
	color: inherit!important;
}

.hap-grid .hap-tooltip{
    background:#666;
    color:#fff!important;
    box-shadow: 1px 1px 5px #99999973;
}

.hap-grid .hap-playlist-icons{
    bottom: 10px;
    height: 40px;
    position: absolute;
    background: #fffffff2;
    left: 0;
    transition: right .2s ease-out;
}
.hap-grid .hap-playlist-icon{
    width: 40px;
    margin: 0;
}
.hap-grid .hap-playlist-icon svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 15px;
    fill:currentColor;
    transition: color .3s ease-out;
    opacity: 0.9;
}
.hap-grid .hap-download svg, 
.hap-grid .hap-link svg {
    color: #666;
}
@media (hover: hover) {
    .hap-grid .hap-download:hover svg, 
    .hap-grid .hap-link:hover svg {
        color: #d5362b;
    }
}



.hap-grid .hap-stat-icon svg{
    color: #555;
}




/* redirect */
.hap-grid .hap-redirect-login-data{
    background: #fff; 
}
.hap-grid .hap-redirect-login-holder-inner{
    background: #ffffff9c;
}
.hap-grid .hap-redirect-login-btn{
    background: #C90032;
    color: #fff;
    padding: 5px 10px;
    border-radius: 1px;
}
.hap-grid .hap-redirect-login-header{
    color: #333;    
}
.hap-grid .hap-redirect-login-title{
    color: #ccc;
}


/*pwd */
.hap-grid .hap-pwd-title{
    color: #333;
}
.hap-grid .hap-pwd-confirm{
    background: #f3f3f3;
    color: #656565;
}
.hap-grid .hap-pwd-close svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 20px;
    fill:currentColor;
    transition: color .1s ease-out;
    color: #555;
}
.hap-metalic .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
    box-shadow: 1px 1px 3px #333;
}
.hap-metalic .hap-player-image{
	position:absolute;
	width:100%;
	height: 100%;
	top:0;
	left:0;
	background-repeat:no-repeat;
	background-position:center center;
	background-attachment: fixed;
	background-size: cover;
	transition: background 1.5s linear;
}

.hap-metalic .hap-player-bg{
	position:absolute;
	width:100%;
	height: 100%;
	top:0;
	left:0;
	background: rgba(30,30,30,0.9); 
}
.hap-metalic .hap-player-outer{
	position:relative;
	height: 350px;
	width: 100%;
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
.hap-metalic .hap-player-holder{
	position:relative;
	padding: 30px 30px 10px 30px;
	box-sizing:border-box;
}
.hap-metalic .hap-player-thumb-wrapper{
	position:relative;
	overflow:hidden;
	height: 250px;
	width: 250px;
}
.hap-metalic .hap-player-thumb{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}

.hap-metalic .hap-btn{
	display: none;
	height:100%;
}
.hap-metalic .hap-contr-btn{
	position: relative;
    width: 30px;
    height: 100%;
    float: left;
}
/*  svg icons */
.hap-metalic .hap-contr-btn svg{
	color:#fff;
}
@media (hover: hover) {
	.hap-metalic .hap-btn:hover svg,
	.hap-metalic .hap-contr-btn:hover > svg,
	.hap-metalic .hap-contr-btn-hover svg{
		color:#3FBAF3!important;
	} 
}
.hap-metalic .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 18px;
	fill:currentColor;
	transition: color .1s ease-out;
}

.hap-metalic .hap-player-controls{
	margin-top:10px;
	overflow: hidden;
}

.hap-metalic .hap-seekbar{
	position:relative;
	height:20px;
	cursor: pointer;
	touch-action: none;
	overflow: hidden;
}
.hap-metalic .hap-progress-bg{
	position:relative;
	background:#888;
	width:100%;
	top:5px;
	height:2px;
}
.hap-metalic .hap-load-level{
	position:absolute;
	background:#888;
	top:0;
	height:100%;
}
.hap-metalic .hap-progress-level{
	position:absolute;
	background:#fff;
	top:0;
	height:100%;
}

.hap-metalic .hap-controls{
	position: relative;
	height:30px;
}
.hap-metalic .hap-prev-toggle,
.hap-metalic .hap-playback-toggle,
.hap-metalic .hap-next-toggle{
	position: relative;
	width:30px;
	height:30px;
	margin-right: 10px;
	float: left;
}
.hap-metalic .hap-playback-toggle svg{
	height: 26px;
}
.hap-metalic .hap-volume-toggle svg{
	height: 24px;
}
.hap-metalic .hap-range-toggle svg{
	height: 22px;
}

.hap-metalic .hap-volume-wrapper{
	position: relative;
	width:110px;
	height:30px;
	float: right;
}
.hap-metalic .hap-volume-toggle{
	position: relative;
	width:30px;	
	height:30px;
	cursor: pointer;
}
.hap-metalic .hap-volume-seekbar{
	position: absolute;
	left:30px;
	top:5px;
	width:80px;
	height:20px;
	cursor: pointer;
	touch-action: none;
}
.hap-metalic .hap-volume-bg{
	position:absolute;
	top:9px;
	left:10px;
	width:60px;
	height:2px;
	background:#ddd;
}
.hap-metalic .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	background:#3FBAF3;
}

.hap-metalic .hap-share-toggle{
	position: relative;
	width:30px;
	height:30px;
	margin-left: 5px;
	float: right;
}
.hap-metalic .hap-share-item{
	width: 40px;
	min-height: 30px;
}

#hap-playlist-list{
	display:none;
}
.hap-metalic .hap-playlist-holder{
	position:relative;
	top:0;
	height: 100%;
	overflow:hidden;
	flex:1;
}
.hap-metalic .hap-playlist-inner{
	margin: 30px 10px 30px 10px;
    position: relative;
    height: calc(100% - 100px);
    padding-right: 15px;
}
.hap-metalic .hap-playlist-item-content {
	color:#999;
}
.hap-metalic .hap-playlist-duration{
	font-size: 12px;
}
.hap-metalic .hap-playlist-date{
	font-size: 11px;
	color: #666;
}
.hap-metalic .hap-playlist-item-selected .hap-playlist-title-wrap{
	color:#fff;
}

.hap-metalic .hap-download, .hap-metalic .hap-link{
	color:#999!important;
}
/* svg icons */
.hap-metalic .hap-download svg,
.hap-metalic .hap-link svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 14px;
	fill:currentColor;
	transition: color .1s ease-out;
}
@media (hover: hover) {
	.hap-metalic .hap-download:hover svg, 
	.hap-metalic .hap-link:hover svg{
		color:#fff!important;
	}
}

.hap-metalic .hap-playlist-filter-msg span{
	color: #3FBAF3;
}
.hap-metalic .hap-bottom-bar{
	position:relative;
	top:0;
	overflow:hidden;
	margin: 0 10px;
	display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}
.hap-metalic .hap-bottom-bar-search-wrap{
    display: flex;
    align-items: center;
    flex-direction: row;
}
.hap-metalic .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#000 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline:none;
	font-size: 15px;
}

.hap-metalic .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0;
	width:25px;
	height: 34px;
	text-align: center;
	float: left;
}
.hap-metalic .hap-bottom-bar-controls{
	position: relative;
    margin-right: 10px;
    height: 100%;
    margin-left: auto;
}

.hap-metalic .hap-bottom-bar-controls .hap-contr-btn{
	position:relative;
	width:25px;
	height:34px;
	margin-left: 10px;
	float: left;
}

.hap-metalic .hap-playback-rate-holder,
.hap-metalic .hap-share-holder,
.hap-metalic .hap-embed-holder,
.hap-metalic .hap-range-holder{
    background: #222;
    border: 1px solid #41414194;
}


/* redirect */
.hap-metalic .hap-redirect-login-data{
	background: #1b1b1b; 
}
.hap-metalic .hap-redirect-login-holder-inner{
	background: #00000066;
}
.hap-metalic .hap-redirect-login-btn{
	background: #3FBAF3;
    color: #fff;
    padding: 5px 10px;
    border-radius: 2px;
}
.hap-metalic .hap-redirect-login-header{
  	color: #fff;	
}
.hap-metalic .hap-redirect-login-title{
    color: #ccc;
}



/* pwd */
.hap-metalic .hap-pwd-title{
	color: #666;
}
.hap-metalic .hap-pwd-close svg{
	color: #666;
}

/* embed */
.hap-metalic .hap-embed-field-wrap-selected{
    background: #2196F3;
    color: #fff;
}



/* dialog */

.hap-metalic .hap-dialog{
    box-shadow: 1px 1px 3px #333;
}
.hap-metalic .hap-dialog-header{
	background: #333;
}
.hap-metalic .hap-dialog .hap-dialog-close svg {
    color: #fff;
}

/* range */

.hap-metalic .hap-range-bg{
	top:15px;
	height:2px;
}

.hap-metalic .hap-range-handle-a-hit{
	border-bottom-color:#666;
}
@media (hover: hover) {
	.hap-metalic .hap-range-handle-a-hit:hover{
		border-bottom-color:#3FBAF3;
	}
}
.hap-metalic .hap-range-handle-b-hit{
	border-top-color:#666;
}
@media (hover: hover) {
	.hap-metalic .hap-range-handle-b-hit:hover{
		border-top-color:#3FBAF3;
	}
}

.hap-metalic .hap-playback-rate-min,
.hap-metalic .hap-playback-rate-max{
	color: #999;
}

.hap-metalic .hap-range-min-time,
.hap-metalic .hap-range-max-time{
	color: #999;
}

.hap-metalic .hap-range-bg{
	background:#ddd;
}
.hap-metalic .hap-range-level{
	background:#3FBAF3;
}

/* playback rate */

.hap-metalic .hap-playback-rate-bg{
	height: 2px;
	top:15px;
}
.hap-metalic .hap-playback-rate-bg{
	background:#ddd;
}
.hap-metalic .hap-playback-rate-level{
	background:#3FBAF3;
}

.hap-metalic .hap-tooltip{
	background:#333;
	border:1px solid #666;
	color:#fff!important;
}

.hap-metalic .hap-preloader {
    background-color: #fff;
}

/* lyrics popup */

.hap-metalic .hap-dialog{
	background-color: #222;
}
.hap-metalic .hap-lyrics-item {
    color: #999;
}


/* statistics */

.hap-metalic .hap-stats svg{
	color:#666;
}
@media (hover: hover) {
	.hap-metalic .hap-play-count:hover > svg,
	.hap-metalic .hap-like-count:hover > svg,
	.hap-metalic .hap-download-count:hover > svg{
		color:#2196F3;
	} 
}
.hap-metalic .hap-stats span{
	color:#666;
}


.hap-metalic.hap-breakpoint-800 .hap-player-outer{
	height: auto;
	flex-direction:column;
}
.hap-metalic.hap-breakpoint-800 .hap-player-thumb-wrapper{
	height: 200px;
    width: 200px;
    margin: 0 auto;
}
.hap-metalic.hap-breakpoint-800 .hap-playlist-holder{
	margin: 0 30px;
}
.hap-metalic.hap-breakpoint-800 .hap-playlist-inner{
	margin: 20px 0;
	min-height: 150px;
	max-height: 250px;
}
.hap-metalic.hap-breakpoint-800 .hap-bottom-bar{
	margin: 10px 0;
	flex-direction: column;
}
.hap-metalic.hap-breakpoint-800 .hap-bottom-bar-controls{
	margin-right: 0;
	margin-left: 0;
}







.hap-modern .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
    box-shadow: 1px 1px 75px #111;
}
.hap-modern .hap-player-wrap{
	position:relative;
	background: #fff;
	width: 100%;
	height: 300px;
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
.hap-modern .hap-player-holder{
	position: relative;
	width: 300px;
}
.hap-modern .hap-btn{
	display: none;
	height:100%;
}
.hap-modern .hap-contr-btn svg{
	color:#777;
}
@media (hover: hover) {
	.hap-modern .hap-btn:hover svg,
	.hap-modern .hap-contr-btn:hover > svg,
	.hap-modern .hap-contr-btn-hover svg{
		color:#3FBAF3!important;
	} 
}
.hap-modern .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 20px;
	fill:currentColor;
	transition: color .1s ease-out;
}
.hap-modern .hap-loop-toggle svg{
	height: 23px;
}
.hap-modern .hap-range-toggle svg{
	height: 25px;
}
.hap-modern .hap-volume-toggle svg{
	height: 26px;
}


.hap-modern .hap-player-thumb-wrapper{
	position:relative;
	overflow:hidden;
	width: 100%;
    height: 300px;
}
.hap-modern .hap-player-thumb{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}

.hap-modern .hap-circle-player{
	position: absolute;
	top:50%;
	left:50%;
	height: 160px;
	width: 160px;
	border-radius: 100%;
    transform: translate(-50%, -50%);	
    transition: opacity 0.3s ease-in-out;
    opacity: 1;
}
.hap-modern .hap-load-canvas,
.hap-modern .hap-progress-canvas{
	position:absolute;
	display: block;
	cursor: pointer;
	touch-action: none;
}
.hap-modern .hap-load-canvas{
	opacity:0.3;
}
.hap-modern .hap-progress-blocker{
	position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background: red;
    top:30px;
	left:30px;
    opacity:0;
}
.hap-modern .hap-playback-toggle{
	position:absolute;
	top:0px;
	width:34px;
	height:34px;
	left:50%;
	top:50%;
	margin-top: -17px;
	margin-left: -17px;
}
.hap-modern .hap-playback-toggle svg{
	height: 36px;
}

.hap-modern .hap-volume-wrapper{
	position:absolute;
	width:34px;
	height:34px;
	left: 10px;
	bottom: 5px;
}
.hap-modern .hap-volume-toggle{
	position:relative;
	width:34px;
	height:100%;
}
.hap-modern .hap-volume-toggle svg{
	color: #fff!important;
	filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}
.hap-modern .hap-volume-seekbar{
	position:absolute;
	left:34px;
	top:0;
	width:140px;
	height:100%;
	cursor: pointer;
	touch-action: none;
	background: #fff; 
	visibility: hidden;
}
.hap-modern .hap-volume-wrapper:hover .hap-volume-seekbar{
	visibility: visible;
}
.hap-modern .hap-volume-bg{
	position:absolute;
	top:14px;
	left:20px;
	width:100px;
	height:5px;
	background:#777;
	border-radius: 1px;
}
.hap-modern .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	background:#eee;
	border-radius: 1px;
}


#hap-playlist-list{
	display:none;
}
.hap-modern .hap-playlist-holder{
	position: relative;
    top: 0;
    height: 100%;
    overflow: hidden;
    flex: 1;
}
.hap-modern .hap-playlist-inner{
	margin: 20px;
    position: relative;
    height: calc(100% - 74px);
    box-sizing: border-box;
}
.hap-modern .hap-playlist-item-wrap{
	margin-right: 20px;
}

.hap-modern .hap-playlist-item-content {
	color:#222;
}
.hap-modern .hap-playlist-item-selected{
	background: #3FBAF3;
}
.hap-modern .hap-playlist-item-selected .hap-playlist-title-wrap{
	color:#fff;
}

.hap-modern .hap-playlist-duration{
	font-size: 12px;
}
.hap-modern .hap-playlist-date{
	font-size: 11px;
	color: #666;
}

.hap-modern .hap-download svg,
.hap-modern .hap-link svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 16px;
	fill:currentColor;
	transition: color .1s ease-out;
	color: #555;
}
.hap-modern .hap-playlist-item-selected .hap-download svg,
.hap-modern .hap-playlist-item-selected .hap-link svg{
	color: #fff;
}
@media (hover: hover) {
	.hap-modern .hap-download:hover svg,
	.hap-modern .hap-link:hover svg{
		color:#3FBAF3;
	}
}

.hap-modern .hap-playlist-filter-msg span{
	color: #3FBAF3;
}
.hap-modern .hap-bottom-bar{
	position:relative;
	top:0;
	width:100%;
	overflow:hidden;display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}
.hap-modern .hap-bottom-bar-search-wrap{
    display: flex;
    align-items: center;
    flex-direction: row;
    margin-left: 20px;
}
.hap-modern .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#000 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline:none;
	font-size: 16px;
}

.hap-modern .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0;
	width:34px;
	height:100%;
	text-align: center;
	float: left;
}

.hap-modern .hap-bottom-bar-controls{
	position: relative;
    margin-right: 25px;
    margin-left: auto;
}

.hap-modern .hap-bottom-bar-controls .hap-contr-btn{
	position:relative;
	width:25px;
	height:34px;
	margin-left: 10px;
	float: left;
}

.hap-modern .hap-playback-rate-holder,
.hap-modern .hap-embed-holder,
.hap-modern .hap-share-holder,
.hap-modern .hap-range-holder{
    background: #fff; 
    border: 1px solid #ddd;
    box-shadow: rgba(135, 135, 135, 0.32) 0px 0px 11px;
}


/* redirect */
.hap-modern .hap-redirect-login-data{
	background: #fff; 
}
.hap-modern .hap-redirect-login-holder-inner{
	background: #ffffff9c;
}
.hap-modern .hap-redirect-login-btn{
	background: #3FBAF3;
    color: #fff;
    padding: 5px 10px;
    border-radius: 1px;
}
.hap-modern .hap-redirect-login-header{
  	color: #333;	
}
.hap-modern .hap-redirect-login-title{
    color: #ccc;
}




/* embed */
.hap-modern .hap-embed-field-wrap-selected{
    background: #3FBAF3;
    color: #fff;
}
.hap-modern .hap-embed-title{
	color: #222;
}
.hap-modern .hap-share-copy,
.hap-modern .hap-embed-copy{
	background: #f3f3f3;
    color: #656565;
}



.hap-modern .hap-range-holder{
    background: #fff; 
	background: #fff; 
	border: 1px solid #ddd;
}

/* dialog */

.hap-modern .hap-dialog{
    box-shadow: rgba(135, 135, 135, 0.32) 0px 0px 11px;
}
.hap-modern .hap-dialog-header{
	background: #777;
}
.hap-modern .hap-dialog .hap-dialog-close svg {
    color: #fff!important;
}

/* range */

.hap-modern .hap-range-bg{
	top:14px;
	height:4px;
}

.hap-modern .hap-range-handle-a-hit{
	border-bottom-color:#666;
}
@media (hover: hover) {
	.hap-modern .hap-range-handle-a-hit:hover{
		border-bottom-color:#3FBAF3;
	}
}
.hap-modern .hap-range-handle-b-hit{
	border-top-color:#666;
}
@media (hover: hover) {
	.hap-modern .hap-range-handle-b-hit:hover{
		border-top-color:#3FBAF3;
	}
}

.hap-modern .hap-range-min-time,
.hap-modern .hap-range-max-time{
	color: #333;
}
.hap-modern .hap-range-bg{
	background:#ddd;
}
.hap-modern .hap-range-level{
	background:#3FBAF3;
}


/* playback rate */

.hap-modern .hap-playback-rate-bg{
	height: 4px;
	top:13px;
}

.hap-modern .hap-playback-rate-bg{
	background:#ddd;
}
.hap-modern .hap-playback-rate-level{
	background:#3FBAF3;
}
.hap-modern .hap-playback-rate-drag{
    position: relative;
	top:-9px;
    width: 21px;
    height: 21px;
	border-radius: 100%;
	background:#3FBAF3;
	-webkit-transform: scale( 0.5 );
    transform: scale( 0.5 );
	-webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
   	box-sizing: border-box;    
   	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
    float: right;
 	margin-right: -9px;
}
.hap-modern .hap-playback-rate-drag:hover,
.hap-modern .hap-playback-rate-drag:active {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.hap-modern .hap-tooltip{
	background:#3FBAF3;
	color:#fff!important;
	box-shadow: 1px 1px 8px #333;
}

.hap-modern .hap-preloader {
    background-color: #3FBAF3;
}


/* statistics */

.hap-modern .hap-stats svg{
	color:#777;
}
@media (hover: hover) {
	.hap-modern .hap-playlist-item:not(.hap-playlist-item-selected) .hap-play-count:hover > svg,
	.hap-modern .hap-playlist-item:not(.hap-playlist-item-selected) .hap-like-count:hover > svg,
	.hap-modern .hap-playlist-item:not(.hap-playlist-item-selected) .hap-download-count:hover > svg{
		color:#3FBAF3!important;
	} 
	.hap-modern .hap-playlist-item-selected .hap-play-count:hover > svg,
	.hap-modern .hap-playlist-item-selected .hap-like-count:hover > svg,
	.hap-modern .hap-playlist-item-selected .hap-download-count:hover > svg{
		color:#fff;
	} 
}

.hap-modern .hap-stats span{
	color:#666;
}



/* lyrics popup */

.hap-modern .hap-dialog{
	background-color: #fff;
}

.hap-modern.hap-breakpoint-800 .hap-player-outer,
.hap-modern.hap-breakpoint-800 .hap-player-wrap{
	height: auto;
	flex-direction:column;
}
.hap-modern.hap-breakpoint-800 .hap-player-holder{
	width: 100%;
}
.hap-modern.hap-breakpoint-800 .hap-player-thumb-wrapper{
	height: auto;
	padding-top: 100%;
}
.hap-modern.hap-breakpoint-800 .hap-playlist-inner{
	min-height: 150px;
	max-height: 250px;
}
.hap-modern.hap-breakpoint-800 .hap-playlist-holder{
	height: 300px;
}
.hap-modern.hap-breakpoint-800 .hap-bottom-bar{
	margin: 10px 0;
	flex-direction: column;
}
.hap-modern.hap-breakpoint-800 .hap-bottom-bar-controls{
	margin-right: 0;
	margin-top: 10px;
	margin-left: 0;

}


.hap-poster{
	position:relative;
	margin:0 auto;
    box-shadow: 1px 1px 75px #111;
    display:none;
}
.hap-poster .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-poster .hap-player-thumb{
	position: relative;
	background-position: 50% 50%;
    background-size: cover;
    padding-top: 100%;
    /*padding-top: 56%;*/
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-poster .hap-player-holder{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
}

.hap-poster .hap-btn{
	display: none;
	height:100%;
}
.hap-poster .hap-contr-btn svg{
	color:#ddd;
	filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}
@media (hover: hover) {
	.hap-poster .hap-btn:hover svg,
	.hap-poster .hap-contr-btn:hover > svg,
	.hap-poster .hap-contr-btn-hover svg{
		color:#fff!important;
	} 
}
.hap-poster .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 18px;
	fill:currentColor;
	transition: color .1s ease-out;
}

.hap-poster .hap-info{
	margin-top:20px;
	margin-left:30px;
	margin-right:200px;
}
.hap-poster .hap-player-title{
	font-size:22px;
	color:#fff;
	margin:0!important;
}
.hap-poster .hap-player-artist{
	font-size:18px;
	color:#ccc;
	margin:0!important;
}

.hap-poster .hap-share-toggle{
	position:absolute;
	top:30px;
	width:25px;
	height:25px;
	right:27px;
}

.hap-poster .hap-player-controls{
	position: absolute;
	height: 30px;
	bottom: 60px;
	left:30px;
}
.hap-poster .hap-prev-toggle{
	position:relative;
	left:0px;
	top:2px;
	width:25px;
	height:25px;
	float:left;
	margin-right:20px;
}
.hap-poster .hap-playback-toggle{
	position:relative;
	top:0px;
	width:30px;
	height:30px;
	float:left;
	margin-right:20px;
}
.hap-poster .hap-playback-toggle svg{
	height:30px;
}
.hap-poster .hap-next-toggle{
	position:relative;
	top:2px;
	width:25px;
	height:25px;
	float:left;
	margin-right:20px;
}

.hap-poster .hap-volume-wrapper{
	position:relative;
	top:2px;
	width:25px;
	height:25px;
	float:left;
}
.hap-poster .hap-volume-seekbar{
	position:relative;
	left:25px;
	top:3px;
	width:100px;
	height:18px;
	float:left;
	cursor: pointer;
	touch-action: none;
	background: rgba(0,0,0,0.01);
}
.hap-poster .hap-volume-bg{
	position:absolute;
	top:8px;
	left:10px;
	width:80px;
	height:3px;
	background:#ccc;
}
.hap-poster .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	background:#D1C1FA;
}

.hap-poster .hap-seekbar{
	position:absolute;
	bottom:30px;
	left:36px;
	right:36px;
	height:20px;
	cursor: pointer;
	touch-action: none;
}
.hap-poster .hap-progress-bg{
	position:relative;
	background:#ccc;
	width:100%;
	top:11px;
	height:2px;
}
.hap-poster .hap-load-level{
	position:absolute;
	background:#ccc;
	top:0;
	height:100%;
}
.hap-poster .hap-progress-level{
	position:absolute;
	background:#D1C1FA;
	top:0;
	height:100%;
}

#hap-playlist-list{
	display:none;
}
.hap-poster .hap-share-holder{
    background: #333; 
    box-shadow: rgba(135, 135, 135, 0.32) 0px 0px 11px;
}

/* redirect */
.hap-poster .hap-redirect-login-data{
	background: #fff; 
}
.hap-poster .hap-redirect-login-holder-inner{
	background: #ffffff9c;
}
.hap-poster .hap-redirect-login-btn{
	background: #D1C1FA;
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
}
.hap-poster .hap-redirect-login-header{
  	color: #333;	
}
.hap-poster .hap-redirect-login-title{
    color: #ccc;
}





/* pwd */
.hap-poster .hap-pwd-title{
	color: #666;
}
.hap-poster .hap-pwd-close svg{
    filter: none;
    color: #666;
}

.hap-poster .hap-tooltip{
	background:#D1C1FA;
	color:#fff!important;
	box-shadow: 1px 1px 8px #111;
}

.hap-poster .hap-preloader {
    background-color: #fff;
}



.hap-poster .hap-embed-field-wrap-selected{
    background: #ddd;
    color: #fff;
}
.hap-tiny1{
    position: relative;
    height:26px;
    width: 60px;
    display:inline-block;
}
.hap-tiny2{
    position: relative;
    height:26px;
    width: 120px;
    display:inline-block;
}
.hap-tiny3{
    position: relative;
    height:26px;
    width: 210px;
    display:inline-block;
}


.hap-tiny .hap-player-holder{
	display: flex;
	flex-direction:row;
	position:relative;
	height: 100%;
}
.hap-tiny.hap-tiny-dark .hap-player-holder {
	background: rgb(76,76,76); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	box-shadow: 1px 1px 15px #222;
}
.hap-tiny.hap-tiny-light .hap-player-holder {
	background-image: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
    background-image: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background-image: -o-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background-image: -ms-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background-image: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    box-shadow: 1px 1px 1px #ddd;
}

.hap-tiny .hap-btn{
	display: none;
	height:100%;
}
.hap-tiny .hap-contr-btn{
	box-sizing: border-box;  
	position:relative;
	width:30px;	
	height:100%;
	border-right: 1px solid #555;    
}
.hap-tiny.hap-tiny-dark .hap-contr-btn svg{
	color:#ccc;
}
@media (hover: hover) {
	.hap-tiny.hap-tiny-dark .hap-btn:hover svg,
	.hap-tiny.hap-tiny-dark .hap-contr-btn:hover > svg,
	.hap-tiny.hap-tiny-dark .hap-contr-btn-hover svg{
		color:#fff!important;
	} 
}
.hap-tiny.hap-tiny-light .hap-contr-btn svg{
	color:#666;
}
@media (hover: hover) {
	.hap-tiny.hap-tiny-light .hap-btn:hover svg,
	.hap-tiny.hap-tiny-light .hap-contr-btn:hover > svg,
	.hap-tiny.hap-tiny-light .hap-contr-btn-hover svg{
		color:#fff!important;
	} 
}
.hap-tiny .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 13px;
	fill:currentColor;
	transition: color .1s ease-out;
}

.hap-tiny .hap-volume-wrapper{
	position:relative;
	width:30px;	
	height:100%;
}
.hap-tiny .hap-volume-toggle{
	border-right:none!important; 
}
.hap-tiny .hap-volume-wrapper:hover .hap-volume-seekbar{
	visibility: visible;
}
.hap-tiny .hap-volume-seekbar{
	position:absolute;
	box-sizing: border-box;
	top:-80px;
	left:0;
	width:30px;
	height:80px;
	visibility: hidden;
	cursor: pointer;
	touch-action: none;
}
.hap-tiny.hap-tiny-dark .hap-volume-seekbar{
	background: rgb(125,126,125); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.hap-tiny.hap-tiny-light .hap-volume-seekbar{
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    border: 1px solid #cbcbcb;
}
.hap-tiny .hap-volume-bg{
	position:absolute;
	width:3px;
	height:60px;
	left:13px;
	bottom:10px;
}
.hap-tiny.hap-tiny-dark .hap-volume-bg{
	background:#888;
}
.hap-tiny.hap-tiny-light .hap-volume-bg{
	background:#888;
}
.hap-tiny .hap-volume-level{
	position:absolute;
	width:100%;
	height:30px;
	left:0;
	bottom:0;
}
.hap-tiny.hap-tiny-dark .hap-volume-level{
	background:#fff;
}
.hap-tiny.hap-tiny-light .hap-volume-level{
	background:#fff;
}

.hap-tiny .hap-seekbar{
	position:relative;
	height:100%;
	width: 150px;
	touch-action: none;
	cursor: pointer;
}
.hap-tiny .hap-progress-bg{
	position:absolute;
	height:3px;
	top:12px;
	left:10px;
	right:10px;
}
.hap-tiny.hap-tiny-dark .hap-progress-bg{
	background:#666;
}
.hap-tiny.hap-tiny-light .hap-progress-bg{
	background:#666;
}
.hap-tiny .hap-load-level{
	position:absolute;
	height:100%;
	top:0;
	left:0;
	right:0;
}
.hap-tiny.hap-tiny-dark .hap-load-level{
	background:#888;
}
.hap-tiny.hap-tiny-light .hap-load-level{
	background:#888;
}
.hap-tiny .hap-progress-level{
	position:absolute;
	height:100%;
	top:0;
	left:0;
	right:0;
}
.hap-tiny.hap-tiny-dark .hap-progress-level{
	background:#fff;
}
.hap-tiny.hap-tiny-light .hap-progress-level{
	background:#fff;
}

.hap-tiny .hap-tooltip{
	position:absolute;
	text-align:center;
	z-index:10000;
	pointer-events:none;
	display:none;
	font-size:12px!important;
	padding:2px 5px !important;
	line-height:20px !important;
	white-space:nowrap;
}
.hap-tiny.hap-tiny-dark .hap-tooltip{
	background: #333;
	border:1px solid #444;
	box-shadow: 1px 1px 3px #111;
	color:#fff!important;
}
.hap-tiny.hap-tiny-light .hap-tooltip{
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	box-shadow: 1px 1px 1px #ddd;
	color:#666!important;
	border:1px solid #ccc;
}


.hap-wave{
	position:relative;
    padding: 40px 40px 30px 40px;
    background: #333;
}
.hap-wave .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-wave .hap-player-wrap{
	position:relative;
	width: 100%;
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
.hap-wave .hap-player-holder{
	position: relative;
	width: 100%;
}
.hap-wave .hap-player-holder-top{
	display: flex;
    flex-direction: row;
    justify-content: space-between; 
}
.hap-wave .hap-player-holder-top-left{
	display: flex;
    flex-direction: row;
    align-items: center;
}

.hap-wave .hap-player-info{
	display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 10px;	
}

.hap-wave .hap-player-artist {
    font-size: 13px;
    color: #bbb;
}
.hap-wave .hap-player-title {
    color: #ccc;
    font-size: 16px;
}

.hap-wave .hap-time-wrap{
	display: flex;
    flex-direction: row;
    justify-content: space-between; 
    margin-top: 3px;
}
.hap-wave .hap-media-time-current{
    color: #fff;
    font-size: 13px;
}
.hap-wave .hap-media-time-total{
    color: #fff;
    font-size: 13px;
}




.hap-wave .hap-btn{
	display: none;
	height:100%;
}

.hap-wave .hap-player-controls-right{
	display: flex;
	flex-direction: row;
	margin-right: 10px;
}
.hap-wave .hap-contr-btn{
	position: relative;
	width:40px;
	height:40px;
}



.hap-wave .hap-contr-btn svg{
	color:#fff;
}
@media (hover: hover) {
	.hap-wave .hap-btn:hover svg,
	.hap-wave .hap-contr-btn:hover > svg,
	.hap-wave .hap-contr-btn-hover svg{
		color:#ffd454;
	} 
}
.hap-wave .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 16px;
	fill:currentColor;
	transition: color .1s ease-out;
}

.hap-wave .hap-player-thumb-wrapper{
	position: relative;
    overflow: hidden;
    border-radius: 100%;
    width: 140px;
    height: 140px;
    flex-shrink: 0;
}
.hap-wave .hap-player-thumb{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}




.hap-wave .hap-waveform-wrap {
	position: relative;
    margin-top: 20px;
    height: 50px;
    overflow: hidden;
}

.hap-wave .hap-waveform-loader {
	margin-bottom: 28px;
}
.hap-wave .hap-waveform-loader div{
	color: #ffd454;
}


.hap-wave .hap-seekbar {
    position: relative;
    height: 100px;
    cursor: pointer;
    touch-action: none;

    display: flex;
    align-items: center;
    justify-content: center;
}

.hap-wave .hap-seekbar-wave,
.hap-wave .hap-seekbar-wave-progress{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.hap-wave .hap-seekbar-wave-progress{
    width: 0;
}


.hap-wave .hap-media-time-ad{
	display: none;
    position: absolute;
    top: 0;
    left:0;
    width: 100%;
    line-height: 50px;
    font-size: 14px;
    height: 100%;
    text-align: center;
    color: #ffffff !important;
    background: #000000a1;
}



.hap-wave .hap-player-controls{
	display: flex;
    justify-content: space-between;
}


.hap-wave .hap-player-controls-left{
	display: flex;
	flex-direction: row;
}


.hap-wave .hap-playback-toggle svg{
	height: 36px!important;
}

.hap-wave .hap-controls{
	position: relative;
	width:150px;
	height:50px;
}

.hap-wave .hap-playback-toggle{
	width: 50px;
	height: 50px;
}
.hap-wave .hap-playback-toggle svg{
	width:50px;
	height:50px;
	height: 26px;
}


.hap-wave .hap-volume-wrap{
	position: relative;
	margin-left:30px;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
}
.hap-wave .hap-volume-toggle{
	position:relative;
	width:40px;
	height:50px;
	cursor: pointer;
}
.hap-wave .hap-volume-toggle svg{
	height: 30px;
}
.hap-wave .hap-volume-seekbar{
	position: relative;
	width:120px;
	height:25px;
	cursor: pointer;
	touch-action: none;
}
.hap-wave .hap-volume-bg{
	position:absolute;
	top:11px;
	left:10px;
	width:100px;
	height:4px;
}
.hap-wave .hap-volume-bg{
	background:#bbb;
}
.hap-wave .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	height:100%;
}
.hap-wave .hap-volume-level{
	background:#fff;
}





#hap-playlist-list{
	display:none;
}
.hap-wave .hap-playlist-holder{
	position: relative;
    top: 0;
    overflow: hidden;
    flex: 1;
}
.hap-wave .hap-playlist-inner{
	margin: 20px 0 20px 20px;
    position: relative;
    max-height: 190px;
    box-sizing:border-box;
    min-height: 120px;
}
.hap-wave .hap-playlist-item{
    margin-right: 20px;
}

.hap-wave .hap-playlist-item-content {
	color:#fff;
}
.hap-wave .hap-playlist-item-selected .hap-playlist-title-wrap{
	color:#ffd454;
}

.hap-wave .hap-playlist-title-wrap {
    font-size: 0.9em;
}


.hap-wave .hap-playlist-duration{
	font-size: 12px;
}
.hap-wave .hap-playlist-date{
	font-size: 11px;
	color: #666;
}

.hap-wave .hap-playlist-icon{
	font-size: 16px;
}
.hap-wave .hap-playlist-icon svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 16px;
	fill:currentColor;
	transition: color .1s ease-out;
	color: #999;
}

@media (hover: hover){
	.hap-wave .hap-playlist-icon:hover svg{
		color:#fff;
	}
}

.hap-wave .hap-playlist-filter-msg span{
	color: #fff;
}
.hap-wave .hap-bottom-bar{
	position:relative;
	top:0;
	width:100%;
	display: flex;
    flex-direction: row;
    justify-content: space-between; 
    border-top: 1px solid #232323;
    align-items: center;
}
.hap-wave .hap-filter-wrap{
	display: flex;
    flex-direction: row;
    align-items: center;
}
.hap-wave .hap-search-filter{
	position:relative;
	width:125px!important;
	height:18px!important;
	padding:0 2px!important;
	border:0!important;
	-moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
	border-radius:0 !important;
	background:#ddd !important;
	color:#000 !important;
	box-shadow:none!important; 
	line-height:1!important; 
	float: left;
	outline:none;
	font-size: 16px;
}

.hap-wave .hap-sort-alpha{
	position:relative;
	left:5px;
	top:0;
	width:34px;
	height:100%;
	text-align: center;
	float: left;
}

.hap-wave .hap-bottom-bar-controls{
	position: absolute;
    right: 25px;
    height: 100%;
}

.hap-wave .hap-bottom-bar-controls .hap-contr-btn{
	position:relative;
	width:25px;
	height:34px;
	margin-left: 10px;
	float: left;
}

.hap-wave .hap-range-toggle svg{
	height:21px;
}

.hap-wave .hap-playback-rate-holder,
.hap-wave .hap-range-holder{
	color: #fff;
}

.hap-wave .hap-playback-rate-holder,
.hap-wave .hap-embed-holder,
.hap-wave .hap-share-holder,
.hap-wave .hap-range-holder{
    background: #333;
    box-shadow: rgb(21 21 21 / 16%) 0px 0px 11px;
}

/*pwd */
.hap-wave .hap-pwd-title{
	color: #222;
}
.hap-wave .hap-pwd-confirm{
	background: #f3f3f3;
    color: #656565;
}



/* embed */
.hap-wave .hap-embed-field-wrap-selected{
    background: #ffd454;
    color: #fff;
}
.hap-wave .hap-embed-title{
	color: #fff;
}
.hap-wave .hap-share-copy,
.hap-wave .hap-embed-copy{
	background: #f3f3f3;
    color: #656565;
}



.hap-wave .hap-share-holder-inner{
	height: 50px;
}


/* dialog */

.hap-wave .hap-dialog-close svg{
	/*color: #fff!important;*/
}
.hap-wave .hap-lyrics-item {
    color: #999;
}
.hap-wave .hap-dialog{
	background-color: #333;
	box-shadow: rgb(0 0 0 / 32%) 0px 0px 11px;
}
.hap-wave .hap-dialog-header {
    background: #444;
}
.hap-wave .hap-lyrics-item-active {
    background: #ffd454;
}
@media (hover: hover){
	.hap-wave .hap-lyrics-item:hover {
	    background: #ffd454;
	}
}


/* redirect */
.hap-wave .hap-redirect-login-data{
	background: #333; 
}
.hap-wave .hap-redirect-login-holder-inner{
	background: #00000066;
}
.hap-wave .hap-redirect-login-btn{
	background: #ffd454;
    color: #fff;
    padding: 5px 10px;
    border-radius: 1px;
}
.hap-wave .hap-redirect-login-header{
  	color: #fff;	
  	font-size: 22px;
}
.hap-wave .hap-redirect-login-title{
    color: #ccc;
}




/* range */

.hap-wave .hap-range-bg{
	top:14px;
	height:4px;
}

.hap-wave .hap-range-handle-a-hit{
	border-bottom-color:#666;
}
@media (hover: hover) {
	.hap-wave .hap-range-handle-a-hit:hover{
		border-bottom-color:#ffd454;
	}
}
.hap-wave .hap-range-handle-b-hit{
	border-top-color:#666;
}
@media (hover: hover) {
	.hap-wave .hap-range-handle-b-hit:hover{
		border-top-color:#ffd454;
	}
}

.hap-wave .hap-range-bg{
	background:#ddd;
}
.hap-wave .hap-range-level{
	background:#ffd454;
}


/* playback rate */

.hap-wave .hap-playback-rate-bg{
	height: 4px;
	top:13px;
}

.hap-wave .hap-playback-rate-bg{
	background:#ddd;
}
.hap-wave .hap-playback-rate-level{
	background:#ffd454;
}
.hap-wave .hap-playback-rate-drag{
    position: relative;
	top:-9px;
    width: 21px;
    height: 21px;
	border-radius: 100%;
	background:#ffd454;
	-webkit-transform: scale( 0.5 );
    transform: scale( 0.5 );
	-webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
   	box-sizing: border-box;    
   	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
    float: right;
 	margin-right: -9px;
}
.hap-wave .hap-playback-rate-drag:hover,
.hap-wave .hap-playback-rate-drag:active {
    -webkit-transform: scale(1);
    transform: scale(1);
}



.hap-wave .hap-tooltip{
	background:#222;
	color:#fff!important;
}

.hap-wave .hap-preloader {
    background-color: #ffd454;
}


/* statistics */

.hap-wave .hap-stats svg{
	color:#777;
}
@media (hover: hover) {
	/*.hap-wave .hap-playlist-item:not(.hap-playlist-item-selected) .hap-play-count:hover > svg,
	.hap-wave .hap-playlist-item:not(.hap-playlist-item-selected) .hap-like-count:hover > svg,
	.hap-wave .hap-playlist-item:not(.hap-playlist-item-selected) .hap-download-count:hover > svg{
		color:#ffd454!important;
	} */
	.hap-wave .hap-playlist-item-selected .hap-play-count:hover > svg,
	.hap-wave .hap-playlist-item-selected .hap-like-count:hover > svg,
	.hap-wave .hap-playlist-item-selected .hap-download-count:hover > svg{
		color:#fff;
	} 
}

.hap-wave .hap-stats span{
	color:#666;
}









.hap-wave.hap-breakpoint-800 .hap-player-wrap{
	flex-direction:column;
}
.hap-wave.hap-breakpoint-800 .hap-player-thumb-wrapper{
	height: 200px;
	width: 200px;
	margin: 0 auto;
}
.hap-wave.hap-breakpoint-800 .hap-bottom-bar{
	flex-direction: column;
	border-top: 0;
}
.hap-wave.hap-breakpoint-800 .hap-player-controls-right{
	margin-right: 0;
    margin-top: 10px;
}
.hap-wave.hap-breakpoint-500 .hap-volume-seekbar{
	display: none;
}







.hap-widget{
	position: relative;
	max-width:200px;
	margin: 0 auto;
    display: none;
}
.hap-widget .hap-player-outer{
	transition: opacity 0.3s ease-in-out;
    opacity: 0;
    box-shadow: 1px 1px 5px #333;
    overflow: hidden;
}
.hap-widget .hap-player-thumb{
    position: relative;
    padding-top: 100%;
    background-position: 50% 50%;
    background-size: cover;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}
.hap-widget .hap-player-holder{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
}

.hap-widget .hap-btn{
	display: none;
	height:100%;
}
.hap-widget .hap-contr-btn svg{
	color:#fff;
	filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}
@media (hover: hover) {
	.hap-widget .hap-btn:hover svg,
	.hap-widget .hap-contr-btn:hover > svg,
	.hap-widget .hap-contr-btn-hover svg{
		color:#CFE8D2!important;
	}
}

.hap-widget .hap-contr-btn svg{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	fill:currentColor;
	transition: color .1s ease-out;
}
.hap-widget .hap-prev-toggle svg,
.hap-widget .hap-next-toggle svg{
	height: 22px;
}
.hap-widget .hap-playback-toggle svg{
	height: 35px;
}

.hap-widget .hap-info{
	position: relative;
	width: 100%;
	text-align: center;
	margin-top: 5px;
	text-shadow: 1px 1px #333;
}
.hap-widget .hap-player-title{
	color:#fff;
	font-size:16px;
	text-align: center;
	margin:0 5px 3px 5px;
	padding:0;
	font-weight: 600;
}
.hap-widget .hap-player-artist{
	color:#fff;
	font-size:13px;
	font-style: italic;
	margin:0;
	padding:0;
	text-align: center;
}

.hap-widget .hap-player-controls{
	position: absolute;
	width:150px;
	height:50px;
	top:50%;
	left:50%;
	margin-left: -75px;
	margin-top: -25px;
}
.hap-widget .hap-prev-toggle{
	position: relative;
	width:50px;
	height:50px;
	float:left;
}
.hap-widget .hap-playback-toggle{
	position: relative;
	width:50px;
	height:50px;
	float:left;
}
.hap-widget .hap-playback-toggle i{
	font-size: 36px!important;
}
.hap-widget .hap-next-toggle{
	position: relative;
	width:50px;
	height:50px;
	float:left;
}

.hap-widget .hap-volume-seekbar{
	position: absolute;
	bottom:30px;
	left:50%;
	width:100px;
	height:30px;
	margin-left: -50px;
	cursor: pointer;
	touch-action: none;
}
.hap-widget .hap-volume-bg{
	position:absolute;
	top:14px;
	left:50%;
	margin-left: -50px;
	width:100px;
	height:2px;
	background:#999;
}
.hap-widget .hap-volume-level{
	position:absolute;
	top:0;
	left:0;
	width:0px;
	height:100%;
	background:#fff;
	-webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
    border-radius: 10px;
    -moz-box-shadow: 1px 1px 5px #333;
	-webkit-box-shadow: 1px 1px 5px #333;
    box-shadow: 1px 1px 5px #333;
}
.hap-widget .hap-volume-drag{
	position: relative;
	top: 50%;
    margin-top: -9px;
    width: 18px;
    height: 18px;
	border-radius: 100%;
	background:#fff;
	/*pointer-events:none;*/
   	box-sizing: border-box; 
	-webkit-transform: scale( 0.5 );
    transform: scale( 0.5 );
    box-shadow: 1px 1px 5px #333;
    float: right;
 	margin-right: -10px;
}
.hap-widget .hap-volume-drag:hover,
.hap-widget .hap-volume-drag:active {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; 
}

.hap-widget .hap-seekbar{
	position:absolute;
	bottom:0;
	left:0px;
	width:100%;
	height:12px;
	cursor: pointer;
	touch-action: none;
}
.hap-widget .hap-progress-bg{
	position:absolute;
	background:#999;
	width:100%;
	bottom: 0px;
	height:6px;
}
.hap-widget .hap-load-level{
	position:absolute;
	background:#bbb;
	top:0;
	height:100%;
}
.hap-widget .hap-progress-level{
	position:absolute;
	background:#fff;
	top:0;
	height:100%;
}

#hap-playlist-list{
	display:none;
}

.hap-widget .hap-tooltip{
	background:#B1C2BE;
	color:#fff!important;
	box-shadow: 1px 1px 5px #333;
}

.hap-widget .hap-preloader {
    background-color: #fff;
}
#cookie-law-info-bar {
	font-size: 15px;
	margin: 0 auto;
	padding: 12px 10px;
	position: absolute;
	text-align: center;
	box-sizing: border-box;
	width:100%;
	z-index: 9999;
	/* box-shadow:rgba(0,0,0,.5) 0px 5px 50px; */
	display: none;
	left:0px;
	font-weight:300;
	box-shadow: 0 -1px 10px 0 rgba(172, 171, 171, 0.3);
}
#cookie-law-info-again {
	font-size: 10pt;
	margin: 0;
	padding:5px 10px;
	text-align: center;
	z-index: 9999;
	cursor: pointer;
	box-shadow: #161616 2px 2px 5px 2px;
}
#cookie-law-info-bar span {
	vertical-align: middle;
}

/** Buttons (http://papermashup.com/demos/css-buttons) */
.cli-plugin-button, .cli-plugin-button:visited {
	display: inline-block;
	padding: 9px 12px;
	color: #fff;
	text-decoration: none;
	position: relative;
	cursor: pointer;
	margin-left: 5px;
	text-decoration: none;
}
.cli-plugin-main-link {
	margin-left:0px;
	font-weight: 550; text-decoration: underline;
}
.cli-plugin-button:hover {
	background-color: #111;
	color: #fff;
	text-decoration: none;
}
.small.cli-plugin-button, .small.cli-plugin-button:visited {
	font-size: 11px;
}
.cli-plugin-button, .cli-plugin-button:visited,
	.medium.cli-plugin-button, .medium.cli-plugin-button:visited {
	font-size: 13px;
	font-weight: 400;
	line-height: 1;
}
.large.cli-plugin-button, .large.cli-plugin-button:visited {
	font-size: 14px;
	padding: 8px 14px 9px;
}
.super.cli-plugin-button, .super.cli-plugin-button:visited {
	font-size: 34px;
	padding: 8px 14px 9px;
}
.pink.cli-plugin-button, .magenta.cli-plugin-button:visited {
	background-color: #e22092;
}
.pink.cli-plugin-button:hover {
	background-color: #c81e82;
}
.green.cli-plugin-button, .green.cli-plugin-button:visited {
	background-color: #91bd09;
}
.green.cli-plugin-button:hover {
	background-color: #749a02;
}
.red.cli-plugin-button, .red.cli-plugin-button:visited {
	background-color: #e62727;
}
.red.cli-plugin-button:hover {
	background-color: #cf2525;
}
.orange.cli-plugin-button, .orange.cli-plugin-button:visited {
	background-color: #ff5c00;
}
.orange.cli-plugin-button:hover {
	background-color: #d45500;
}
.blue.cli-plugin-button, .blue.cli-plugin-button:visited {
	background-color: #2981e4;
}
.blue.cli-plugin-button:hover {
	background-color: #2575cf;
}
.yellow.cli-plugin-button, .yellow.cli-plugin-button:visited {
	background-color: #ffb515;
}
.yellow.cli-plugin-button:hover {
	background-color: #fc9200;
}
.cli-plugin-button{ margin-top:5px; }
.cli-bar-popup{
	-moz-background-clip: padding;
	-webkit-background-clip: padding;
	background-clip: padding-box;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	border-radius:30px;
	padding:20px;
}
.cli-powered_by_p{width:100% !important; display:block !important; color:#333; clear:both; font-style:italic !important; font-size:12px !important; margin-top:15px !important; }
.cli-powered_by_a{color:#333; font-weight:600 !important; font-size:12px !important;}

/**
 * Added extra space between each cookie bar action elements @since 1.8.9
 */
.cli-plugin-main-link.cli-plugin-button {
	text-decoration: none;
}
.cli-plugin-main-link.cli-plugin-button {
	margin-left: 5px;
}
.gdpr-container-fluid {
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
.gdpr-row {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}
.gdpr-col-4 {
	-ms-flex: 0 0 33.333333%;
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
}
.gdpr-col-8 {
	-ms-flex: 0 0 66.666667%;
	flex: 0 0 66.666667%;
	max-width: 66.666667%;
}
.gdpr-align-items-stretch {
	-ms-flex-align: stretch!important;
	align-items: stretch!important;
}
.gdpr-d-flex {
	display: -ms-flexbox!important;
	display: flex!important;
}
.gdpr-px-0 {
	padding-left: 0;
	padding-right: 0;
}
.modal-backdrop.show {
	opacity: .8;
}
.modal-open {
	overflow: hidden
}

.modal-open .gdpr-modal {
	overflow-x: hidden;
	overflow-y: auto
}

.gdpr-modal.fade .gdpr-modal-dialog {
	transition: -webkit-transform .3s ease-out;
	transition: transform .3s ease-out;
	transition: transform .3s ease-out,-webkit-transform .3s ease-out;
	-webkit-transform: translate(0,-25%);
	transform: translate(0,-25%)
}

.gdpr-modal.show .gdpr-modal-dialog {
	-webkit-transform: translate(0,0);
	transform: translate(0,0)
}

.modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1039;
	background-color: #000
}

.modal-backdrop.fade {
	opacity: 0
}

.modal-backdrop.show {
	opacity: .5
}

.gdpr-modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1050;
	display: none;
	overflow: hidden;
	outline: 0
}
.gdpr-modal a {
	text-decoration: none;
}
.gdpr-modal .gdpr-modal-dialog {
	position: relative;
	width: auto;
	margin: .5rem;
	pointer-events: none;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: left;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	min-height: calc(100% - (.5rem * 2))
}
@media (min-width: 576px) {
	.gdpr-modal .gdpr-modal-dialog {
		max-width:500px;
		margin: 1.75rem auto;
		min-height: calc(100% - (1.75rem * 2));
	}
}
@media (min-width: 992px) {
	.gdpr-modal .gdpr-modal-dialog {
		max-width: 900px;
	}
}
.gdpr-modal-content {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 100%;
	pointer-events: auto;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid rgba(0,0,0,.2);
	border-radius: .3rem;
	outline: 0
}
.gdpr-modal .row {
	margin: 0 -15px;
}
.gdpr-modal .modal-body {
	padding: 0;
	position: relative;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}
.gdpr-modal .close {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 1;
	padding: 0;
	background-color: transparent;
	border: 0;
	-webkit-appearance: none;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	color: #000;
	text-shadow: 0 1px 0 #fff;
}
.gdpr-modal .close:focus {
	outline: 0;
}
.gdpr-switch {
	display: inline-block;
	position: relative;
	min-height: 1px;
	padding-left: 70px;
	font-size: 14px;
}
.gdpr-switch input[type="checkbox"] {
	display:none;
}
.gdpr-switch .gdpr-slider {
	background-color: #e3e1e8;
	height: 24px;
	width: 50px;
	bottom: 0;
	cursor: pointer;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transition: .4s;
}
.gdpr-switch .gdpr-slider:before {
	background-color: #fff;
	bottom: 2px;
	content: "";
	height: 20px;
	left: 2px;
	position: absolute;
	transition: .4s;
	width: 20px;
}
.gdpr-switch input:checked + .gdpr-slider {
	background-color:rgb(99, 179, 95);
}
.gdpr-switch input:checked + .gdpr-slider:before {
	transform: translateX(26px);
}
.gdpr-switch .gdpr-slider {
	border-radius: 34px;
}
.gdpr-switch .gdpr-slider:before {
	border-radius: 50%;
}
.gdpr-tab-content>.gdpr-tab-pane {
	display: none;
}
.gdpr-tab-content>.active {
	display: block;
}
.gdpr-fade {
	transition: opacity .15s linear;
}
.gdpr-nav-pills {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
	-ms-flex-direction: column !important;
	flex-direction: column !important;
	align-items: stretch !important;
	-ms-align-items: stretch !important;
}
.nav.gdpr-nav-pills, .gdpr-tab-content {
	width: 100%;
	padding: 30px;
}
.nav.gdpr-nav-pills {
	background: #f3f3f3;
}
.nav.gdpr-nav-pills .gdpr-nav-link {
	border: 1px solid #0070ad;
	margin-bottom: 10px;
	color: #0070ad;
	font-size: 14px;
	display: block;
	padding: .5rem 1rem;
	border-radius: .25rem;
}
.nav.gdpr-nav-pills .gdpr-nav-link.active, .nav.gdpr-nav-pills .show>.gdpr-nav-link {
	background-color: #0070ad;
	border: 1px solid #0070ad;
}
.nav.gdpr-nav-pills .gdpr-nav-link.active {
	color: #ffffff;
}
.gdpr-tab-content .gdpr-button-wrapper {
	padding-top: 30px;
	margin-top: 30px;
	border-top: 1px solid #d6d6d6;
}
.gdpr-tab-content .gdpr-button-wrapper .btn-gdpr {
	background-color: #0070ad;
	border-color: #0070ad;
	color: #ffffff;
	font-size: 14px;
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.gdpr-tab-content p {
	color: #343438;
	font-size: 14px;
	margin-top: 0;
}
.gdpr-tab-content h4 {
	font-size: 20px;
	margin-bottom: .5rem;
	margin-top: 0;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
}


.cli-container-fluid {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
.cli-row {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}
.cli-col-4 {
	-ms-flex: 0 0 33.333333%;
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
}
.cli-col-8 {
	-ms-flex: 0 0 66.666667%;
	flex: 0 0 66.666667%;
	max-width: 66.666667%;
}
.cli-align-items-stretch {
	-ms-flex-align: stretch!important;
	align-items: stretch!important;
}
.cli-d-flex {
	display: -ms-flexbox!important;
	display: flex!important;
}
.cli-px-0 {
	padding-left: 0;
	padding-right: 0;
}
.cli-btn {
	cursor: pointer;
	font-size: 14px;
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: .5rem 1.25rem;
	line-height: 1;
	border-radius: .25rem;
	transition: all .15s ease-in-out;
}
.cli-btn:hover {
  opacity: .8;
}
.cli-read-more-link {
	cursor: pointer;
	font-size: 15px;
	font-weight: 500;
	text-decoration: underline;
}
.cli-btn:focus {
	outline: 0;
}
.cli-modal-backdrop.cli-show {
  opacity: .8;
}
.cli-modal-open {
  overflow: hidden
}
.cli-barmodal-open {
  overflow: hidden
}
.cli-modal-open .cli-modal {
	overflow-x: hidden;
	overflow-y: auto
}
.cli-modal.cli-fade .cli-modal-dialog {
	transition: -webkit-transform .3s ease-out;
	transition: transform .3s ease-out;
	transition: transform .3s ease-out,-webkit-transform .3s ease-out;
	-webkit-transform: translate(0,-25%);
	transform: translate(0,-25%)
}
.cli-modal.cli-show .cli-modal-dialog {
	-webkit-transform: translate(0,0);
	transform: translate(0,0)
}
.cli-modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1040;
	background-color: #000;
	display: none;
}
.cli-modal-backdrop.cli-fade {
  opacity: 0
}
.cli-modal-backdrop.cli-show {
	opacity: .5;
	display: block;
}
.cli-modal.cli-show {
	display: block;
}
.cli-modal a {
	text-decoration: none;
}
.cli-modal .cli-modal-dialog {
	position: relative;
	width: auto;
	margin: .5rem;
	pointer-events: none;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: left;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	min-height: calc(100% - (.5rem * 2))
}
@media (min-width: 576px) {
	.cli-modal .cli-modal-dialog {
		max-width:500px;
		margin: 1.75rem auto;
		min-height: calc(100% - (1.75rem * 2))
	}
}
@media (min-width: 992px) {
	.cli-modal .cli-modal-dialog {
		max-width: 900px;
	}
}
.cli-modal-content {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 100%;
	pointer-events: auto;
	background-color: #fff;
	background-clip: padding-box;
	border-radius: .3rem;
	outline: 0
}
.cli-modal .row {
	margin: 0 -15px;
}
.cli-modal .modal-body {
	padding: 0;
	position: relative;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}
.cli-modal .cli-modal-close {
	position: absolute;
	right: 10px;
	top: 10px;
	z-index: 1;
	padding: 0;
	background-color: transparent !important;
	border: 0;
	-webkit-appearance: none;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	color: #000;
	text-shadow: 0 1px 0 #fff;
}
.cli-modal .cli-modal-close:focus {
	outline: 0;
}
.cli-switch {
	display: inline-block;
	position: relative;
	min-height: 1px;
	padding-left: 70px;
	font-size: 14px;
}
.cli-switch input[type="checkbox"] {
	display:none;
}
.cli-switch .cli-slider {
	background-color: #e3e1e8;
	height: 24px;
	width: 50px;
	bottom: 0;
	cursor: pointer;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transition: .4s;
}
.cli-switch .cli-slider:before {
	background-color: #fff;
	bottom: 2px;
	content: "";
	height: 20px;
	left: 2px;
	position: absolute;
	transition: .4s;
	width: 20px;
}
.cli-switch input:checked + .cli-slider {
	background-color: #00acad
}
.cli-switch input:checked + .cli-slider:before {
	transform: translateX(26px);
}
.cli-switch .cli-slider {
	border-radius: 34px;
}
.cli-switch .cli-slider:before {
	border-radius: 50%;
}
.cli-tab-content {
background: #ffffff;
}
.cli-tab-content>.cli-active {
	display: block;
}
.cli-fade {
	transition: opacity .15s linear;
}
.cli-nav-pills {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
	-ms-flex-direction: column;
	flex-direction: column;
}
.cli-nav-pills, .cli-tab-content {
	width: 100%;
	padding: 30px;
}
@media (max-width: 767px) {
	.cli-nav-pills, .cli-tab-content {
	padding: 30px 10px;
	}
}
.cli-nav-pills {
	background: #f3f3f3;
}
.cli-nav-pills .cli-nav-link {
	border: 1px solid #00acad;
	margin-bottom: 10px;
	color: #00acad;
	font-size: 14px;
	display: block;
	padding: .5rem 1rem;
	border-radius: .25rem;
	cursor: pointer
}
.cli-nav-pills .cli-nav-link.cli-active, .cli-nav-pills .cli-show>.cli-nav-link {
	background-color: #00acad;
	border: 1px solid #00acad;
}
.cli-nav-pills .cli-nav-link.cli-active {
	color: #ffffff;
}
.cli-tab-content .cli-button-wrapper {
	padding-top: 30px;
	margin-top: 30px;
	border-top: 1px solid #d6d6d6;
}
.cli-tab-content p {
	color: #343438;
	font-size: 14px;
	margin-top: 0;
}
.cli-tab-content h4 {
	font-size: 20px;
	margin-bottom: 1.5rem;
	margin-top: 0;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
}
/* Settings Popup */
.cli-container-fluid {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
.cli-row {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}
.cli-col-4 {
	-ms-flex: 0 0 33.333333%;
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
}
.cli-col-8 {
	-ms-flex: 0 0 66.666667%;
	flex: 0 0 66.666667%;
	max-width: 66.666667%;
	flex-direction: column;
}
.cli-align-items-stretch {
	-ms-flex-align: stretch!important;
	align-items: stretch!important;
}
.cli-d-flex {
	display: -ms-flexbox!important;
	display: flex!important;
}
.cli-px-0 {
	padding-left: 0;
	padding-right: 0;
}
.cli-btn {
	cursor: pointer;
	font-size: 14px;
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: .5rem 1.25rem;
	line-height: 1;
	border-radius: .25rem;
	transition: all .15s ease-in-out;
}
.cli-btn:hover {
  opacity: .8;
}
.cli-read-more-link {
	cursor: pointer;
	font-size: 15px;
	font-weight: 500;
	text-decoration: underline;
}
.cli-btn:focus {
	outline: 0;
}
.cli-modal-backdrop.cli-show {
  opacity: .8;
}
.cli-modal-open {
  overflow: hidden
}
.cli-barmodal-open {
  overflow: hidden
}
.cli-modal-open .cli-modal {
	overflow-x: hidden;
	overflow-y: auto
}
.cli-modal.cli-fade .cli-modal-dialog {
	transition: -webkit-transform .3s ease-out;
	transition: transform .3s ease-out;
	transition: transform .3s ease-out,-webkit-transform .3s ease-out;
	-webkit-transform: translate(0,-25%);
	transform: translate(0,-25%)
}
.cli-modal.cli-show .cli-modal-dialog {
	-webkit-transform: translate(0,0);
	transform: translate(0,0)
}
.cli-modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1040;
	background-color: #000;
	-webkit-transform:scale(0);
	transform:scale(0);
	transition: opacity ease-in-out 0.5s;
}
.cli-modal-backdrop.cli-fade {
  opacity: 0;

}
.cli-modal-backdrop.cli-show {
	opacity: .5;
  -webkit-transform:scale(1);
  transform:scale(1);
}
.cli-modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 99999;
	transform: scale(0);
	overflow: hidden;
	outline: 0;
	display: none;
}
.cli-modal a {
	text-decoration: none;
}
.cli-modal .cli-modal-dialog {
	position: relative;
	width: auto;
	margin: .5rem;
	pointer-events: none;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: left;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	min-height: calc(100% - (.5rem * 2))
}
@media (min-width: 576px) {
	.cli-modal .cli-modal-dialog {
		max-width:500px;
		margin: 1.75rem auto;
		min-height: calc(100% - (1.75rem * 2))
	}
}
.cli-modal-content {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 100%;
	pointer-events: auto;
	background-color: #fff;
	background-clip: padding-box;
	border-radius: .2rem;
	box-sizing: border-box;
	outline: 0
}
.cli-modal .row {
	margin: 0 -15px;
}
.cli-modal .modal-body {
	padding: 0;
	position: relative;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}
.cli-modal .cli-modal-close:focus {
	outline: 0;
}
.cli-switch {
	display: inline-block;
	position: relative;
	min-height: 1px;
	padding-left: 38px;
	font-size: 14px;
}
.cli-switch input[type="checkbox"] {
	display:none;
}
.cli-switch .cli-slider {
	background-color: #e3e1e8;
	height: 20px;
	width: 38px;
	bottom: 0;
	cursor: pointer;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transition: .4s;
}
.cli-switch .cli-slider:before {
	background-color: #fff;
	bottom: 2px;
	content: "";
	height: 15px;
	left: 3px;
	position: absolute;
	transition: .4s;
	width: 15px;
}
.cli-switch input:checked + .cli-slider {
	background-color: #61a229;
}
.cli-switch input:checked + .cli-slider:before {
	transform: translateX(18px);
}
.cli-switch .cli-slider {
	border-radius: 34px;
	font-size:0;
}
.cli-switch .cli-slider:before {
	border-radius: 50%;
}
.cli-tab-content {
background: #ffffff;
}
.cli-nav-pills {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
	-ms-flex-direction: column;
	flex-direction: column;
}
.cli-nav-pills, .cli-tab-content {
	width: 100%;
	padding:5px 30px 5px 5px;
	box-sizing: border-box;
}
@media (max-width: 767px) {
	.cli-nav-pills, .cli-tab-content {
	padding: 30px 10px;
	}
}
.cli-nav-pills {
	background: #fff;
}
.cli-nav-pills .cli-nav-link {
	border: 1px solid #cccccc;
	margin-bottom: 10px;
	color:#2a2a2a;
	font-size: 14px;
	display: block;
	padding: .5rem 1rem;
	border-radius: .25rem;
	cursor: pointer
}
.cli-nav-pills .cli-nav-link.cli-active, .cli-nav-pills .cli-show>.cli-nav-link {
	background-color: #f6f6f9;
	border: 1px solid #cccccc;
}
.cli-nav-pills .cli-nav-link.cli-active {
	color:#2a2a2a;
}
.cli-tab-content .cli-button-wrapper {
	padding-top: 30px;
	margin-top: 30px;
	border-top: 1px solid #d6d6d6;
}
.cli-tab-content p {
	color: #343438;
	font-size: 14px;
	margin-top: 0;
}
.cli-tab-content h4 {
	font-size: 20px;
	margin-bottom: 1.5rem;
	margin-top: 0;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
}
/* Cookie Settings In Bar */
#cookie-law-info-bar .cli-nav-pills,#cookie-law-info-bar .cli-tab-content,#cookie-law-info-bar .cli-nav-pills .cli-show>.cli-nav-link,#cookie-law-info-bar a.cli-nav-link.cli-active{
	background: transparent;
}

#cookie-law-info-bar .cli-nav-pills .cli-nav-link.cli-active,#cookie-law-info-bar  .cli-nav-link,#cookie-law-info-bar .cli-tab-container p,#cookie-law-info-bar span.cli-necessary-caption,#cookie-law-info-bar .cli-switch .cli-slider:after
{
color:inherit;
}
#cookie-law-info-bar .cli-tab-header a:before
{
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
}
#cookie-law-info-bar .cli-row
{
	margin-top:20px;
}
#cookie-law-info-bar .cli-col-4
{
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	width: auto;
	max-width: none;
}
#cookie-law-info-bar .cli-col-8
{
	flex-basis: 0;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
}
.cli-wrapper {
	max-width: 90%;
	float: none;
	margin: 0 auto;
}
#cookie-law-info-bar .cli-tab-content h4
{
	margin-bottom:0.5rem;
}
#cookie-law-info-bar .cli-nav-pills .cli-nav-link
{
	padding: .2rem 0.5rem;
}
#cookie-law-info-bar .cli-tab-container
{
	display:none;
	text-align:left;
}

/* Popup Footer Styles */
.cli-tab-footer .cli-btn {
	background-color: #00acad;
	padding: 10px 15px;
	text-decoration:none;
}
.cli-tab-footer .wt-cli-privacy-accept-btn {
	background-color: #61a229;
	color: #ffffff;
	border-radius: 0;
}

.cli-tab-footer {
	width:100%;
	text-align:right;
	padding: 20px 0;
}
/* version 2.0 */
.cli-col-12
{
	width:100%;
}
.cli-tab-header
{
	display: flex;
	justify-content: space-between;
}
.cli-tab-header a:before {
	width: 10px;
	height: 2px;
	left: 0;
	top: calc(50% - 1px);
}
.cli-tab-header a:after {
	width: 2px;
	height: 10px;
	left: 4px;
	top: calc(50% - 5px);
	-webkit-transform: none;
	transform: none;
}
.cli-tab-header a:before {
	width: 7px;
	height: 7px;
	border-right: 1px solid #4a6e78;
	border-bottom: 1px solid #4a6e78;
	content: " ";
	transform: rotate(-45deg);
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	margin-right:10px;
}
.cli-tab-header a.cli-nav-link  {
	position: relative;
	display: flex;
	align-items: center;
	font-size:14px;
	color:#000;
	text-transform: capitalize;

}
.cli-tab-header.cli-tab-active .cli-nav-link:before
{
	transform: rotate(45deg);
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
.cli-tab-header {
	border-radius: 5px;
	padding: 12px 15px;
	cursor: pointer;
	transition: background-color 0.2s ease-out 0.3s, color 0.2s ease-out 0s;
	background-color:#f2f2f2;
}
.cli-modal .cli-modal-close {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
	-webkit-appearance: none;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 50%;
	padding: 10px;
	background: transparent;
	border:none;
	min-width: 40px;
}
.cli-tab-container h4,.cli-tab-container h1 {
	font-family: inherit;
	font-size: 16px;
	margin-bottom: 15px;
	margin:10px 0;
}
#cliSettingsPopup .cli-tab-section-container {
	padding-top: 12px;
}
.cli-tab-container p ,.cli-privacy-content-text{
	font-size: 14px;
	line-height: 1.4;
	margin-top: 0;
	padding: 0;
	color: #000;
}
.wt-cli-privacy
{
	display:none;
}
.cli-tab-content
{
	display:none;
}
.cli-tab-section .cli-tab-content
{
	padding: 10px 20px 5px 20px;
}
.cli-tab-section
{
	margin-top:5px;
}
@media (min-width: 992px) {
	.cli-modal .cli-modal-dialog {
		max-width: 645px;
	}
}
.cli-switch .cli-slider:after{
	content: attr(data-cli-disable);
	position: absolute;
	right: 50px;
	color: #000;
	font-size:12px;
	text-align:right;
	min-width: 80px;
}
.cli-switch input:checked + .cli-slider:after
{
	content: attr(data-cli-enable);
}
.cli-privacy-overview:not(.cli-collapsed) .cli-privacy-content {
	max-height: 60px;
	transition: max-height 0.15s ease-out;
	overflow: hidden;
}
a.cli-privacy-readmore {
	font-size: 12px;
	margin-top: 12px;
	display: inline-block;
	padding-bottom: 0;
	cursor: pointer;
	color:#000;
	text-decoration: underline;
}
.cli-modal-footer {
	position: relative;
}
a.cli-privacy-readmore:before {
	content: attr(data-readmore-text);
}
.cli-collapsed a.cli-privacy-readmore:before {
	content: attr(data-readless-text);
}

.cli-collapsed .cli-privacy-content
{
	transition: max-height 0.25s ease-in;

}
.cli-privacy-content p
{
	margin-bottom:0;
}
.cli-modal-close svg {
	fill: #000;
}
span.cli-necessary-caption {
	color: #000;
	font-size: 12px;
}
.cli-tab-section.cli-privacy-tab {
	display: none;
}
#cookie-law-info-bar .cli-tab-section.cli-privacy-tab {
	display: block;
}
#cookie-law-info-bar .cli-privacy-overview {
	display: none;
}
.cli-tab-container .cli-row
{
	max-height: 500px;
	overflow-y: auto;
}
.cli-modal.cli-blowup.cli-out {
	z-index: -1;
}
.cli-modal.cli-blowup {
	z-index: 999999;
	transform: scale(1);

  }
  .cli-modal.cli-blowup .cli-modal-dialog {
	animation: blowUpModal 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
  }
  .cli-modal.cli-blowup.cli-out .cli-modal-dialog
  {
	animation: blowUpModalTwo 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
  }
  @keyframes blowUpContent {
	0% {
	  transform: scale(1);
	  opacity: 1;
	}
	99.9% {
	  transform: scale(2);
	  opacity: 0;
	}
	100% {
	  transform: scale(0);
	}
  }
  @keyframes blowUpContentTwo {
	0% {
	  transform: scale(2);
	  opacity: 0;
	}
	100% {
	  transform: scale(1);
	  opacity: 1;
	}
  }
  @keyframes blowUpModal {
	0% {
	  transform: scale(0);
	}
	100% {
	  transform: scale(1);
	}
  }
  @keyframes blowUpModalTwo {
	0% {
	  transform: scale(1);
	  opacity: 1;
	}
	50% {
		transform: scale(0.5);
		opacity: 0;
	  }
	100% {
	  transform: scale(0);
	  opacity: 0;
	}
  }
  .cli-tab-section .cookielawinfo-row-cat-table td, .cli-tab-section .cookielawinfo-row-cat-table th {
	font-size: 12px;
}
.cli_settings_button
{
	cursor: pointer;
}
/* Accessibility Fix */
.wt-cli-sr-only
{
	display: none;
	font-size:16px;
}
/* Changes for CCPA
Version : 1.8.9
*/
a.wt-cli-element.cli_cookie_close_button {
	text-decoration: none;
	color: #333333;
	font-size: 22px;
	line-height: 22px;
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: 5px;
}
/* GDPR Bar Version 2 */
.cli-bar-container{
	float: none;
	margin: 0 auto;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
.cli-bar-btn_container {
	margin-left: 20px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	flex-wrap: nowrap;
}
.cli-style-v2 a
{
	cursor: pointer;
}
.cli-bar-btn_container a {
	white-space: nowrap;
}
.cli-style-v2 .cli-plugin-main-link
{
	font-weight:inherit;
}
.cli-style-v2
{
	font-size: 11pt;
	line-height: 18px;
	font-weight:normal;
}
#cookie-law-info-bar[data-cli-type="widget"] .cli-bar-container,#cookie-law-info-bar[data-cli-type="popup"] .cli-bar-container{
	display: block;
}
.cli-style-v2 .cli-bar-message {
	width: 70%;
	text-align: left;
}
#cookie-law-info-bar[data-cli-type="widget"] .cli-bar-message,#cookie-law-info-bar[data-cli-type="popup"] .cli-bar-message
{
	width:100%;
}
#cookie-law-info-bar[data-cli-type="widget"] .cli-style-v2 .cli-bar-btn_container {
	margin-top:8px;
	margin-left: 0px;
	flex-wrap: wrap;
}
/* #cookie-law-info-bar[data-cli-type="widget"] .cli-style-v2 .cli-bar-message {
	text-align: center;
} */
#cookie-law-info-bar[data-cli-type="popup"] .cli-style-v2 .cli-bar-btn_container {
	margin-top:8px;
	margin-left: 0px;
}
#cookie-law-info-bar[data-cli-style="cli-style-v2"] .cli_messagebar_head{
	text-align: left;
	/* padding-left: 15px; */
	margin-bottom: 5px;
	margin-top: 0px;
	font-size: 16px;
}
/* #cookie-law-info-bar[data-cli-type="widget"] .cli-bar-container.cli-style-v2 {
	padding-left: 0px;
	padding-right: 0px;
} */

.cli-style-v2 .cli-bar-message .wt-cli-ccpa-element,.cli-style-v2 .cli-bar-message .wt-cli-ccpa-checkbox {
	margin-top: 5px;
}
.cli-style-v2 .cli-bar-btn_container .cli_action_button ,
.cli-style-v2 .cli-bar-btn_container .cli-plugin-main-link,
.cli-style-v2 .cli-bar-btn_container .cli_settings_button
{
	margin-left: 5px;
}
.wt-cli-ccpa-checkbox label {
	font-size: inherit;
	cursor: pointer;
	margin: 0px 0px 0px 5px;
}
/* .cli-bar-container.cli-style-v2 {
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 2px;
	padding-bottom: 2px;
} */
#cookie-law-info-bar[data-cli-style="cli-style-v2"]
{
	padding: 14px 25px;
}
#cookie-law-info-bar[data-cli-style="cli-style-v2"][data-cli-type="widget"]
{
	padding:32px 30px;
}
#cookie-law-info-bar[data-cli-style="cli-style-v2"][data-cli-type="popup"] {
	padding: 32px 45px;
}
.cli-style-v2 .cli-plugin-main-link:not(.cli-plugin-button), .cli-style-v2 .cli_settings_button:not(.cli-plugin-button),.cli-style-v2 .cli_action_button:not(.cli-plugin-button){
	text-decoration: underline;
}
.cli-style-v2 .cli-bar-btn_container .cli-plugin-button {
	margin-top: 5px;
	margin-bottom: 5px;
}
a.wt-cli-ccpa-opt-out {
	white-space: nowrap;
	text-decoration: underline;
}
.wt-cli-necessary-checkbox {
	display: none !important;
}
@media (max-width: 985px) {
	.cli-style-v2 .cli-bar-message
	{
		width:100%;
	}
	.cli-style-v2.cli-bar-container
	{
		justify-content:left;
		flex-wrap: wrap;
	}
	.cli-style-v2 .cli-bar-btn_container {
		margin-left:0px;
		margin-top: 10px;
	}
	#cookie-law-info-bar[data-cli-style="cli-style-v2"],#cookie-law-info-bar[data-cli-style="cli-style-v2"][data-cli-type="widget"],#cookie-law-info-bar[data-cli-style="cli-style-v2"][data-cli-type="popup"]
	{
		padding: 25px 25px;
	}
}
/* Settings popup footer section */
.wt-cli-ckyes-brand-logo {
	display: flex;
	align-items: center;
	font-size: 9px;
	color: #111111;
	font-weight: normal;
}
.wt-cli-ckyes-brand-logo img{
	width: 65px;
	margin-left: 2px;
}
.wt-cli-privacy-overview-actions {
	padding-bottom:0;
}
@media only screen and (max-width: 479px) and (min-width: 320px){

	.cli-style-v2 .cli-bar-btn_container {
		flex-wrap: wrap;
	}
}
/* Fix: HTML validation error due to the enclosing of <p> tags on category description */
.wt-cli-cookie-description {
	font-size: 14px;
	line-height: 1.4;
	margin-top: 0;
	padding: 0;
	color: #000;
}
.search-results .blog-post-item.type-product {
    max-width: 800px;
}
.search-results .blog-post-item.type-product .blog-post-content:not(.blog-details-content) .post-text {
    margin: 0 0;
}
.search-results .blog-post-item.type-product .blog-post-content .post-text p {
    margin: 0 0;
}
.search-results .blog-post-item.type-product .blog-post-content .title {
    margin-bottom: 15px;
}