body{
margin:0;
padding:0;
background:#111;
color:#fff;
font-family:Arial,sans-serif;
}

.header{
background:#000;
padding:15px;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:10px;
}

.logo{
font-size:24px;
font-weight:bold;
}

.header a{
color:#fff;
text-decoration:none;
margin:5px;
}

.search-form input{
padding:10px;
width:220px;
}

.search-form button{
padding:10px;
cursor:pointer;
}

.container{
padding:20px;
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
gap:15px;
}

.card{
background:#1b1b1b;
padding:10px;
border-radius:10px;
text-align:center;
}

.card img{
width:100%;
height:auto;
border-radius:10px;
}

.poster{
max-width:300px;
width:100%;
border-radius:10px;
}

.textarea-box{
width:100%;
background:#000;
color:#00ff00;
padding:10px;
margin-top:20px;
margin-bottom:20px;
}

.player-box{
height:300px;
background:#000;
border:2px dashed #444;
margin-bottom:20px;
}

.pagination{
margin-top:20px;
}

.pagination a{
background:#222;
padding:10px;
display:inline-block;
margin-right:10px;
color:#fff;
text-decoration:none;
}

.footer{
padding:20px;
text-align:center;
background:#000;
margin-top:30px;
}

iframe{
max-width:100%;
margin:5px;
border:none;
}

@media(max-width:768px){

.grid{
grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
}

.search-form input{
width:100%;
}

}