.mgPopup .video {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
}

.videos a { text-decoration: none; }

.videos.indexlist {
    padding: 40px ;
    background-color: #f3f0f0;
    border-radius: 20px;
}

@media all and ( max-width: 1024px) {
    .videos { padding: 20px; }
}

@media all and ( max-width: 960px) {
    .videos { border-radius: 0; }
}

.videos picture {
    position: relative;
    cursor: pointer;
}

.videos picture a.mgPlayVideo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60px;
    height: 60px;
/*    line-height: 60px;
    border: 2px solid #FFF;
    border-radius: 50%;
    color: #FFF;
    background-color: rgba(255,255,255,0.4);
    font-size: 24px;
    text-align: center;*/
}

.videos picture a.mgPlayVideo img {
    width: 60px;
    height: 60px;
}

/*.videos picture:hover a.mgPlayVideo {
    background-color: rgba(255,255,255,0.6);
}
*/
.videos .video,
.videos .video iframe {
    width: 100%;
    height: 100%;
}

.videos .video { box-sizing: border-box; }

.videos .video iframe { overflow: hidden; }

@media all and (min-width: 641px) and (max-width: 960px) {
    .videos .video,
    .mgPopup .video { padding: 20px; }
}

@media all and (min-width: 961px) {
    .videos .video,
    .mgPopup .video { padding: 60px; }
}