
/* Movie Box ------------------------------------------------------------------- */

    .mvbox {
        background: #111111;
        margin: 0 auto;
        text-align: center;
        box-sizing: border-box;
        border: solid 5px #fff;
        line-height: 0;
    }
    
    .mvbox .autoFrame {
        position: relative !important;
        height: 0 !important;
        padding-top: 56.25% !important;
        overflow: hidden !important;
        z-index: 10;
    }
    
    .mvbox .autoFrame iframe {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
    
    .mvbox .movieWrapper {
        position: relative;
    }
    
    .mvbox .movieWrapper .cover {
        background: transparent;
        width: 100%;
        height: 110%;
        position: absolute;
        z-index: 15;
    }
    
    .mvbox .movieWrapper .iconWrapper {
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -40px;
        margin-top: -28px;
        z-index: 20;
    }
    
    .mvbox .movieWrapper .iconWrapper .icon {
        cursor: pointer;
        z-index: 100;
        position: relative;
    }
    
    .mvbox .movieWrapper .iconWrapper .circleBlock {
        position: absolute;
        top: -20px;
    }
    
    .mvbox .movieWrapper .iconWrapper .circleBlock div {
        background: #FF0000;
        width: 100px;
        height: 100px;
        border-radius: 100px;
        position: absolute;
        top: 0;
        left: -10px;
    }

@media screen and (max-width: 767px) {

	/* Movie Box ------------------------------------------------------------------- */

	.mvbox {
		width: 100%;
		margin: 0 auto;
		padding-left: 0 !important;
		padding-right: 0 !important;
	    border: none;
	}
    
	.mvbox .movieWrapper .iconWrapper {
		left: 33%;
		top: 30%;
		margin-left: 0;
		margin-top: 0;
		z-index: 20;
	}
    
	.mvbox .movieWrapper .iconWrapper .icon {
		width: 60%;
		display: none;
	}
    
	.mvbox .movieWrapper .iconWrapper .circleBlock {
		top: -10px;
	}
    
	.mvbox .movieWrapper .iconWrapper .circleBlock div {
		width: 100px;
		height: 100px;
		border-radius: 100px;
		top: 50%;
		left: 50%;
	}

	.mvbox .movieWrapper .cover {
		display: none;
	}

	.mvbox .movieWrapper .autoFrame {
		width: 100%;
		margin: 0 auto;
	}
	.mvbox .iamTitle {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

}
