.yotu-video-thumb-wrp{display:-webkit-flex;display:flex;width:100%;position:relative}
.yotu-video-thumb-wrp::before{position:absolute;content:""}
.yotu-video-thumb-wrp::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);background:url(../images/square-play.png) no-repeat 50% 50%;
width:18%;height:0;padding-top:75%;background-size:contain;zoom:0;filter:alpha(opacity=0);opacity:0;-webkit-transition:opacity 150ms ease-in-out;-moz-transition:opacity 150ms ease-in-out;
-ms-transition:opacity 150ms ease-in-out;-o-transition:opacity 150ms ease-in-out;transition:opacity 150ms ease-in-out}
a:hover .yotu-video-thumb-wrp::after,a:hover .yotu-video-thumb-wrp::before{zoom:1;filter:alpha(opacity=100);opacity:1;z-index:10}
#yotu-player-modal{ 
	width: 100%;
	border: none!important;
	padding: 0;
	margin: 0;
}

.modal-open {
    overflow: hidden
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    outline: 0
}

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

.modal-dialog {
    position: relative;
    width: auto;
    margin: .5rem;
    pointer-events: none
}

.modal.fade .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%)
}

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

.modal-dialog-centered {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - (.5rem * 2))
}

.modal-content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -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
}

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

.modal-backdrop.fade {
    opacity: 0
}

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

.modal-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: .3rem;
    border-top-right-radius: .3rem
}

.modal-header .close {
    padding: 1rem;
    margin: -1rem -1rem -1rem auto
}

.modal-title {
    margin-bottom: 0;
    line-height: 1.5
}

.modal-body {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem
}

.modal-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #e9ecef
}

.modal-footer>:not(:first-child) {
    margin-left: .25rem
}

.modal-footer>:not(:last-child) {
    margin-right: .25rem
}

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}
.view_on_video .modal-content{ background:none; border:none; overflow:visible; }
.view_on_video .modal-body{ padding:0; }
.view_on_video .close{ width:30px; height:30px; border:1px solid #fff; color:#fff; text-align:center; line-height:27px; background:none; border-radius:50%; position:absolute; right:-15px; top:-15px; z-index:2; }
#page .videobox h3{ font-size:12px; color:#6D6F72; margin:0; padding:13px 12px 37px 12px; text-align:center; line-height:16px; }
.videobox a{ background:#fff; box-shadow:0 0 9px rgba(0,0,0,0.11); display:block; margin:0 0 40px 0; }
.videobox a img{ border-radius:5px; }
.modal.view_on_video{ max-height:100%; transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); }

@media (min-width:1025px) {
.view_on_video .close:hover{ background:none; }
}
@media (max-width:991px) {
.view_on_video iframe{ height:400px; }
}
@media (max-width:767px) {
.view_on_video iframe{ height:300px; }
}

@media (min-width:576px) {
    .modal-dialog {
        max-width: 500px;
        margin: 1.75rem auto
    }
    .modal-dialog-centered {
        min-height: calc(100% - (1.75rem * 2))
    }
    .modal-sm {
        max-width: 300px
    }
}

@media (min-width:992px) {
    .modal-lg {
        max-width: 800px
    }
}