*{box-sizing:border-box}body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{width:100%;min-height:100vh;background-color:#1a191f}.container{margin:auto;min-height:100%;max-width:1300px}li{list-style-type:none}.Nav{background-color:#1a191f;position:fixed;top:0;z-index:2;height:90px;width:100%;color:#969696;box-shadow:0 2px 3px .5px #161515}.logo{font-size:1.8rem;font-weight:700;letter-spacing:4px;margin-right:30px;min-height:100%}.highlight{color:#ffdc2e}.nav-bar{display:flex;justify-content:space-around;width:400px;margin-left:auto}.nav-bar div{padding:0 10px}.burger{display:none;cursor:pointer;margin-left:auto}.burger div{width:25px;height:3px;background-color:#969696;transition:all .3s ease;margin:5px 5px 5px auto}@media screen and (max-width: 1360px){.container{max-width:940px}.nav-bar{width:40%}}@media screen and (max-width: 980px){.container{max-width:680px}.nav-bar{width:60%}}@media screen and (max-width: 680px){body{overflow-x:hidden}.container{padding:0 10px}.burger{display:block}.nav-bar{position:absolute;right:0px;height:92vh;top:8vh;background-color:#1a191f;display:flex;flex-direction:column;align-items:center;width:50%;transform:translate(100%);transition:transform .3s ease-in}}@keyframes navLinkFade{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}.toggle .line1{transform:rotate(-45deg) translate(-3px,3px)}.toggle .line2{display:none}.toggle .line3{transform:rotate(45deg) translate(-3px,-3px)}#nav-active{transform:translate(0)}.Home{margin-top:90px;min-width:100%;border-bottom:1px solid rgba(0,0,0,.5);background:url(/assets/movieseat.8d8cc867.jpg) center center / cover no-repeat}.darken{width:100%;background-color:#0009;min-height:150px;position:absolute;z-index:0}.home-title{color:#9e9e9e;font-size:2.7rem;position:absolute;z-index:1}.home-lists li.active,.home-lists li.active:hover{color:#ffdc2e;border-bottom:2.5px solid rgb(255,220,46)}.home-lists li:hover{color:#ffdc2e}.home-lists{margin-bottom:0;margin-top:auto}.home-lists li{display:inline-block;cursor:pointer;text-transform:uppercase;font-size:1.1rem;color:#bebebe;margin-right:25px;padding-bottom:10px}.home-sort{background-color:#1a191f;padding-top:15px;border-bottom:.5px solid rgb(66,66,66)}.Movie{display:flex;flex-direction:column;width:16%;max-height:400px;align-items:flex-start;margin-right:5%;color:#f5f5f5;font-size:1.1rem;box-sizing:border-box;border:1px solid rgba(0,0,0,.3);box-shadow:2px 2px 3px 2px #00000080;padding:10px;margin-bottom:30px;border-radius:10px}.Movie:hover{cursor:pointer;background-color:#202020}.title{margin:10px auto;min-width:100%;max-height:200px;overflow:scroll;overflow-x:hidden;text-align:center}.title::-webkit-scrollbar{display:none}.rating{margin:7px;display:flex;justify-content:center;align-items:center;width:33px;height:33px;position:absolute;background-color:#000;border-radius:100%;text-align:center}.green{border:2px solid green}.amber{border:2px solid #FFBF00}.Movie:nth-child(5n){margin-right:0}.Movie img{width:100%;min-height:80%}@media screen and (max-width: 1360px){.Movie:nth-child(5n){margin-right:5.33333%}.Movie:nth-child(4n){margin-right:0}.Movie{min-width:21%;margin-right:5.333333%;max-height:360px}}@media screen and (max-width: 980px){.Movie{max-height:330px}}@media screen and (max-width: 680px){.Movie:nth-child(5n){margin-right:5%}.Movie:nth-child(4n){margin-right:5%}.Movie:nth-child(2n){margin-right:0}.Movie{width:45%;margin-right:5%}}.MovieInfo{position:fixed;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:700px;height:550px;background-color:#222;padding:20px;border-radius:10px;cursor:auto}.movie-detail-title{margin-bottom:20px;overflow-y:scroll;width:70vw;max-height:42px}.hide-background{position:fixed;left:0px;top:0px;z-index:2;margin:0;width:100%;height:100vh;background-color:#000;opacity:.5;cursor:auto}.movie-info{display:grid;grid-template-columns:1.1fr 2fr;height:430px}.movie-info img{height:100%}.info-section{padding:10px 20px;display:flex;flex-direction:column;justify-content:space-around}.info-title{font-weight:700}.info{margin-left:5px;font-weight:lighter}.info-header{display:flex}.lines{display:flex;flex-direction:column;height:20px;justify-content:space-around;margin-left:auto;width:30px;cursor:pointer}.line{width:25px;height:4px;background-color:#fff}.line-1{transform:rotate(45deg) translate(6px,1px)}.line-2{transform:rotate(-45deg) translate(6px,-1px)}::-webkit-scrollbar{width:2px}::-webkit-scrollbar-thumb{background:rgb(0,0,0)}::-webkit-scrollbar-track{background:rgb(34,34,34)}@media screen and (max-width: 1000px){.MovieInfo{width:600px}}@media screen and (max-width:840px){.MovieInfo{height:500px;min-width:200px;font-size:16px}.movie-info{display:flex;flex-direction:column;overflow-y:scroll;font-size:10px}.info-section{margin-top:5px;margin-bottom:2px}.info-section div{margin:3px 0}}@media screen and (max-width: 680px){.MovieInfo{max-width:75%}}.Catalog{margin-top:90px;min-height:150px;background:url(/assets/movieseat.8d8cc867.jpg) center center / cover no-repeat}.sort{background-color:#1a191f}.catalog-sort{padding:15px 0;border-bottom:.5px solid rgb(66,66,66);display:flex;align-items:flex-end;width:100%}.catalog-sort div{margin-right:30px}.section-title{margin-bottom:10px;font-size:.8rem;color:#9e9e9e;text-transform:uppercase}.genres{display:flex;flex-direction:column;color:#fff}.genres select{width:100px;background-color:#1a191f;color:#fff;outline:none;border:none}.search-field{width:220px;height:35px;display:flex;padding:5px 15px;background-color:#313131;align-self:center;border-radius:7px;margin-left:50%;transform:translate(-50%)}.search-field:hover{border:1px solid yellow}.search-button{border:none;font-size:20px;position:relative;right:0;padding-top:4px;background-color:transparent;cursor:pointer;outline:none}.search-button:hover{color:gray}.search-field input{width:100%;height:100%;display:inline-block;border:none;outline:none;background-color:transparent}.Pagination{display:flex;justify-content:center;font-size:2rem;background-color:#1a191f;padding-bottom:30px;color:#a3a2a2}.Pagination div{margin:0 5px}.number{font-size:1.7rem;position:relative;top:.2rem;padding:0 10px}.arrow{font-weight:700}.arrow:hover{transform:scale(1.2);cursor:pointer;color:#fff}.arrow_two{font-size:1.8rem;position:relative;top:.15rem}.arrow_two:hover{transform:scale(1.2);cursor:pointer;color:#fff}