.app{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;min-height:50vh;background:linear-gradient(to bottom,#fff,#e6e6e6);padding:20px;gap:20px;align-content:flex-start}.app-header{display:flex;flex-direction:column;background-image:linear-gradient(#000000b3,#000000b3),url(/assets/flixter_background-ilyY3g1r.jpeg);height:100%;background-position:center;background-repeat:no-repeat;background-size:cover;position:relative;letter-spacing:7px;padding:100px;text-align:center;font-size:26px;font-family:Times New Roman,Times,serif;border-radius:5px;text-shadow:rgba(255,162,0,.9) 0px 0px 39px}#description{color:#fff;font-size:20px;letter-spacing:normal}.search-container{display:flex;justify-content:center;text-align:center;padding:20px;margin:20px}.search-input{width:-webkit-fill-available}.movie-list{display:grid;justify-content:space-evenly;grid-template-columns:auto auto auto auto;gap:30px}.nav-bar{display:flex;align-items:center;justify-content:center}.nav-bar-item{text-align:center;font-family:Times New Roman,Times,serif;padding:20px;margin:20px}.search-input{border-radius:50px;padding:20px;text-align:left;width:100%}.dark-mode{background-color:#121212;color:#fff}.dark-mode select{background-color:#333;color:#fff;border:1px solid #444444}.dark-mode button{background-color:#444;color:#fff;border:1px solid #555555;padding:10px;cursor:pointer}.dark-mode button:hover{background-color:#555}.dark-mode .movie-card{background-color:#222;color:#fff;border:1px solid #333333;padding:20px;margin-top:20px}@media screen and (max-width: 1370px){.movie-list{grid-template-columns:auto auto auto}}@media screen and (max-width: 1030px){.movie-list{grid-template-columns:auto auto}}@media screen and (max-width: 670px){.movie-list{grid-template-columns:auto}.nav-bar{flex-direction:column;justify-content:space-around}}.card{box-shadow:0 4px 8px #0003;transition:.3s;width:300px;border-radius:5px;padding:10px;background:linear-gradient(to bottom,#f9f9f9,#f0f0f0);margin-bottom:20px;overflow:hidden;font-family:Times New Roman,Times,serif}.card img{width:100%;height:auto;object-fit:cover;border-top-left-radius:5px;border-top-right-radius:5px}.card:hover{box-shadow:0 8px 16px #0006}.card h2,.card h4,.card p{color:#555}.modal{font-family:Times New Roman,Times,serif;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#fff;padding:20px;border-radius:5px;position:relative;max-width:500px;width:90%}.modal-header{display:flex;justify-content:flex-end}.modal-body{margin-top:20px}.app{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;background:linear-gradient(to bottom,#fff,#e6e6e6);padding:20px;gap:20px;align-content:flex-start}h1{width:100%;text-align:center;color:#fff;margin-bottom:20px}#load-more-btn{margin:0 auto;display:block;background-color:#444;color:#fff;border:1px solid #555555;padding:10px;cursor:pointer}#load-more-btn:hover{background-color:#555}.app-footer{margin-top:20px;display:flex;background-color:#292a2b;padding:20px;text-align:center;font-size:26px;font-family:Arial,Helvetica,sans-serif;box-shadow:0 4px 6px #0000001a}#about{color:#fff;text-align:left;font-size:small}body{margin:0;font-family:Arial,sans-serif;background-color:#f4f4f4}button{background-color:#282c34;color:#fff;cursor:pointer;font-size:16px;font-weight:700;transition:background-color .3s ease}button:hover{background-color:#777;color:#fff}