body {
    margin: 0px;
    font-family: "Trade Gothic Bold Condensed 20", Arial, Helvetica, sans-serif;
}

.grid-item {
	margin: 20px;
}

.grid-container {
    display: grid;
}

.grid-container#basic-layout {
	grid-template-columns: 20vw auto 20vw;
}



.grid-container#basic-layout > .middle {
	background-color: rgb(78, 78, 78);
	overflow: hidden;
}

a {
	color: yellow;
}

#reviews {
    grid-template-columns: 1fr 1fr 1fr;
}

#text-data {
  grid-area: 1 / 2 / 10 / 2;
}

.grid-container-vertical {
    display: grid;
    grid-template-columns: auto;
	backdrop-filter: brightness(1.5);
	margin: 1vh;
}

.grid-container-vertical > .grid-item {
	margin: 3px;
	padding: 5px;
}

#movies {
    display: grid;
    grid-template-columns: auto auto auto;
}


@media all and (max-width: 2000px) {
	#movies {
		display: inline;
	}
}

.grid-container div {
    //padding: 1vh;
    text-align: center;
}

body {
    background-color: rgb(0, 0, 0);
    color: white;
	margin: 0 50px;
}

nav a {
    color: white;
    text-decoration: none;
    padding: 1vw;
}

nav a:hover {
    background-color: purple;
}

img {
    margin: 1.2vw;
    width: 15vw;
    aspect-ratio: .7;
}

.left img {
    border-radius: 2vh;
}

nav {
    margin: 2vh;
	margin-bottom: 3vh;
    position: relative;
    top: 0;
    left: 0;
    background-color: Black;
    font-size: 15px;
    text-align: center;
}

table, th, td {
	border: 1px solid black;
	border-color: white;
	margin-left:auto;
	margin-right:auto;
	border-collapse: collapse;
}

th, td {
	padding: 5px;
}

//span {
//	white-space: pre-line;
//}

footer {
	position: relative;
	left: 0;
	bottom: 0;
	width: 100%;
	background-color: Black;
	color: white;
	text-align: center;
}

#open {
	color: yellow;
}

#carousel {
	aspect-ratio: 11;
	background-color: blue;
	display: flex;
	width: 130vw;
	padding: 1vh;
	position: relative;
	left: -30vw;
}

@keyframes slide {
	0% {-webkit-transform: translateX(0vw);}
	100% {-webkit-transform: translateX(115vw);}
}

#carousel > div {
	background: red;
	animation-name: slide;
	position: absolute;
	display: inline-block;
	animation-duration: 17.6s;
	aspect-ratio: .7;
	height: calc(100% - 2vh);
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	animation-direction: reverse;
	left: 8vw;
}

#carousel > div > img {
	width: 80% !important;
    margin-left: 0px;
    margin-right: 0px;
}

#search {
	margin-bottom: 1vh;
}

#carousel > div:nth-child(11) {animation-delay: -1.6s;}
#carousel > div:nth-child(10) {animation-delay: -3.2s;}
#carousel > div:nth-child(9) {animation-delay: -4.8s;}
#carousel > div:nth-child(8) {animation-delay: -6.4s;}
#carousel > div:nth-child(7) {animation-delay: -8s;}
#carousel > div:nth-child(6) {animation-delay: -9.6s;}
#carousel > div:nth-child(5) {animation-delay: -11.2s;}
#carousel > div:nth-child(4) {animation-delay: -12.8s;}
#carousel > div:nth-child(3) {animation-delay: -14.4s;}
#carousel > div:nth-child(2) {animation-delay: -16s;}
#carousel > div:nth-child(1) {animation-delay: -17.6s;}

@media all and (max-width: 944px) {
	#basic-layout > .grid-item.left, #basic-layout > .grid-item.right {
		display: none;
	}
	.grid-container#basic-layout {
		grid-template-columns: auto;
	}
	img {
		width: 47vw!important;
	}
	#reviews {
		display: inline;
	}
}

.search_word {
	color: green;
	background-color: yellow;
}

