:root {
	background: #181825;
	text: #cdd6f4;
}
* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
body {
	color: white;
	bgcolor: var(background);
	margin: 0;
	max-width: 100vw;
	margin-left:auto;
	margin-right:auto;
	cursor: url("/resources/cursor.gif"), auto;
}
.video-container {
            display: grid;
	    padding: 15px;
            grid-template-columns: repeat(1fr);
            gap: 16px;   			/* Paddining between the videos' frames */
            max-width: 100vw;
            margin: 0 auto;
}
@media only screen and (min-width: 1000px) {
	.video-container {
		max-width: 1500px;
	}
}
.video-card {
            background-color: #1e1e2e;
            overflow: hidden;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	    max-width: 100%;
            transition: transform 0.3s ease;
    	    border-radius: 18px;
      border: 3px solid #f2cdcd;
}
.video-card:hover {
            transform: translateY(-5px);
}
.video-player {
    width: 100%;
    align: center;
    border-radius: 18px;
    object-fit: cover;
    padding: 10px; /* Padding between the video player and it's frame */
}
.video-info {
    padding: 7px;
}
.location {
	color: #f5c2e7;
	text-align:center;
}
.description {
	text-align: center;
	color:#b4befe;
}
a {
	text-decoration:none;
}
a:link {
	color:#cba6b7;
}
a:visited {
	color:#cba6b7;
}
a:hover {
	color: #cdd6f4;
	background:#cba6f7;
	cursor: none;
}
a:active{
	color:#a6e3a1;
}
