.edubin-video-popup-wrapper {
position: relative;
display: inline-block;
} .edubin-video-popup-wrapper .video i {
width: 80px;
height: 80px;
line-height: 80px;
text-align: center;
font-size: 24px;
background-color: var(--edubin-primary-color, #ffbc00);
color: #07294d;
border-radius: 50%;
display: inline-block;
} .edubin-video-popup-wrapper a.play-icon-text {
color: #ecb101;
text-decoration: none;
font-weight: 600;
} .edubin-video-popup-wrapper .play-btn {
width: 82px;
height: 82px;
background: var(--edubin-primary-color, #ffbc00);
border-radius: 50%;
position: relative;
display: block;
}
.edubin-video-popup-wrapper .play-btn::after {
content: "";
position: absolute;
left: 52%;
top: 50%;
transform: translate(-50%, -50%);
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 18px solid #fff;
z-index: 1;
}
.edubin-video-popup-wrapper .play-btn::before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 50%;
border: 2px solid var(--edubin-primary-color, #ffbc00);
animation: pulsate1 2s infinite ease-out;
}
@keyframes pulsate1 {
0% { transform: scale(1); opacity: 0.8; }
100% { transform: scale(1.6); opacity: 0; }
} .edubin-video-popup-wrapper .video-play-button {
position: relative;
display: inline-block;
width: 80px;
height: 80px;
background: #fdbd00;
border-radius: 50%;
} .edubin-video-popup-wrapper .video-popup-5 .stroke-solid {
stroke-dasharray: 300;
stroke-dashoffset: 300;
transition: stroke-dashoffset 0.6s ease-in-out;
}
.edubin-video-popup-wrapper .video-popup-5 a:hover .stroke-solid {
stroke-dashoffset: 0;
} .edubin-video-popup,
.edubin-video-popup-round,
.edubin-video-popup-left {
position: relative;
max-width: 100%;
overflow: hidden;
}
.edubin-video-popup img,
.edubin-video-popup-round img,
.edubin-video-popup-left img {
width: 100%;
height: auto;
display: block;
border-radius: 6px;
}
.edubin-video-popup a.icon-video,
.edubin-video-popup-round a.icon-video,
.edubin-video-popup-left a.icon-video {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 65px;
height: 65px;
background: #ffffff;
color: #ecb101;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
transition: background 0.3s ease, color 0.3s ease;
}
.edubin-video-popup a.icon-video:hover,
.edubin-video-popup-round a.icon-video:hover,
.edubin-video-popup-left a.icon-video:hover {
background: #ecb101;
color: #ffffff !important;
}