.vidBox {
    border: 1px solid #ddd;
    border-top: 3px solid #058e02;
    padding: 30px 20px;
    margin-top: 20px;
}

.vidBox .vidUl li {
    width: 25%;
    padding: 0 12px;
    box-sizing: border-box;
    float: left;
    text-align: center;
}

.vidBox .vidUl li .video {
    border: 1px solid #ddd;
    padding: 10px
}

.vidBox .vidUl li .video iframe {
    width: 100% !important;
    height: 150px !important;
}

.vidBox .vidUl li video {
    width: 100%;
}

.vidBox .vidUl li p {
    background: #f2f2f2;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vidBox .vidUl li p b {
    font-weight: 500;
}

@media all and (min-width: 1024px) and (max-width: 1540px) {
    .vidBox .vidUl li {
        width: 25%;
    }
    .vidBox .vidUl li p {
        padding: 0 5px;
    }
    .vidBox {
        padding: 20px 10px;
    }
}



@media all and (min-width: 0) and (max-width: 767px) {
    .vidBox {
        border-top: 2px solid #058e02;
        padding: 20px 0px;
        margin: 20px 10px 0;
    }
    .vidBox .vidUl li {
        width: 50%;
        padding: 0 10px;
    }
    .vidBox .vidUl li .video {
        padding: 5px
    }
    .vidBox .vidUl li .video iframe {
        height: 120px;
    }
    .vidBox .vidUl li p {
        line-height: 32px;
    }
}