/* slider container */

.gxys-slider{
width:100%;
position:relative;
padding:20px 0;
}


/* video card */

.gxys-video{
position:relative;
cursor:pointer;
overflow:hidden;
border-radius:10px;
}

.gxys-video img{
width:100%;
display:block;
border-radius:10px;
transition:transform 0.3s ease;
}

.gxys-video:hover img{
transform:scale(1.05);
}


/* play button */

.gxys-play{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
font-size:40px;
background:rgba(0,0,0,0.6);
color:#fff;
padding:10px 15px;
border-radius:50%;
pointer-events:none;
}


/* title */

.gxys-title{
text-align:center;
margin-top:10px;
font-size:14px;
font-weight:500;
line-height:1.4;
}


/* navigation arrows */

.gxys-prev,
.gxys-next{
background:rgba(0,0,0,0.6);
width:45px;
height:45px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
position:absolute;
top:45%;
z-index:10;
cursor:pointer;
}


/* arrow icon */

.gxys-prev::after,
.gxys-next::after{
color:#ffffff;
font-size:20px;
font-weight:bold;
}


/* arrow positions */

.gxys-prev{
left:5px;
}

.gxys-next{
right:5px;
}


/* hover */

.gxys-prev:hover,
.gxys-next:hover{
background:#000;
}


/* pagination dots */

.gxys-pagination{
text-align:center;
margin-top:10px;
}

.gxys-pagination .swiper-pagination-bullet{
background:#ccc;
opacity:1;
margin:0 4px;
}

.gxys-pagination .swiper-pagination-bullet-active{
background:#000;
}


/* modal background */

.gxys-modal{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.85);
z-index:9999;
}


/* modal content */

.gxys-modal-content{
width:90%;
max-width:900px;
margin:8% auto;
position:relative;
}


/* iframe */

.gxys-modal iframe{
width:100%;
height:500px;
border-radius:8px;
}


/* close button */

.gxys-close{
position:absolute;
top:-40px;
right:0;
font-size:32px;
color:#fff;
cursor:pointer;
}


/* responsive */

@media(max-width:768px){

.gxys-title{
font-size:13px;
}

.gxys-prev,
.gxys-next{
width:40px;
height:40px;
}

.gxys-modal iframe{
height:300px;
}

}