.video-js .vjs-trailer {
	z-index:999998;
	cursor:pointer;
	position:absolute;
	max-width:320px;
	min-width:180px;
	opacity:0;
	width:33%;
	right:0;
	padding:0;
	color:#ffffff;
	min-height:100px;
	background:#000;
	-webkit-transition: bottom 0.3s;
    transition: bottom 0.3s;
}
.video-js .vjs-trailer-wide {
	width:45%;
}
.video-js .vjs-trail-trans {
	bottom: 60px;
}
.vjs-1600 .vjs-trail-trans {
	bottom: 130px;
}

.vjs-user-inactive.vjs-playing .vjs-trailer{
	bottom:0;
}

.video-js .vjs-trailer .vjs-vid-title {
	color: #fff;
    text-shadow: 1px 1px 1px #000;
    position: absolute;
    overflow: hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	padding:0 8px;
    top: 0;
    left: 0;
    width: 100%;
    height: 35px;
    text-align: left;
    font-style: italic;
    font-family: serif;
    font-size: 16px;
    line-height: 35px;
    background: linear-gradient(to top,transparent 0,rgba(0,0,0,.24) 39%,rgba(0,0,0,.48) 95%,rgba(0,0,0,.64) 100%);
}
.vjs-trailer-close {
	position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(0,0,0,.7);
    text-align: center;
    height: 25px;
    width: 25px;
    line-height: 21px;
    font-size: 15px;
    font-family: monospace;
    cursor: pointer;
	color:white;
	font-style:normal;
	opacity:0;
	-webkit-border-radius:50%;
	border-radius:50%;
}
.vjs-trailer-close svg {
	fill:white;
}

.vjs-trailer:hover .vjs-trailer-close {
	opacity:1;
}
.vjs-trailer-hidden {
	display:none;
}
.video-js .vjs-trailer  .vjs-watch-now {
	position: absolute;
	text-shadow: 1px 1px 1px #000;
	font-size: 1.1em;
	font-style:italic;
	right:10px;
	bottom:10px;
	background:#cc0000;
	padding:4px 5px;
	font-size:14px;
	text-decoration:none;
	color:#fff;
	outline:none;
}
.video-js .vjs-trailer .trailer-video-el {
	position:relative;
	color:#fff;
	text-decoration:none;
}
.video-js .vjs-trailer .trailer-video-el video {
	width:100%;
}
@media screen and (max-width: 480px) {
	.video-js .vjs-trailer {
		width:45%;
	}
}