*{margin:0;padding:0;box-sizing:border-box}body{font-family:"montserrat",sans-serif;background-color:#223343}header{padding:50px 15px}header h1{font-size:48px;font-weight:500;margin-bottom:50px}header h1,header p{color:#fff;text-align:center}header p{font-size:24px;width:800px;margin:0 auto;font-style:italic}@media (max-width:850px){header p{width:100%;padding:0 30px}}main{width:100%;max-width:960px;margin:0 auto}section{padding:15px 30px}.searchbox{display:block;width:100%;padding:15px;border:none;outline:none;background:none;background-color:#eee;color:#53565a;font-size:20px;font-weight:300;transition:.4s ease-out}.searchbox:focus{box-shadow:0 0 8px 3px #4484c4}.results{margin:-30px 30px 0;padding:15px 0 0;border:1px solid #eee;border-top:none}.results .result{width:100%;padding:15px;border-bottom:1px solid #eee;cursor:pointer}.results .result .title{color:#eee;font-size:20px}.results .result:hover{background-color:#eee}.results .result:hover .title{color:#000}.section-title{color:#fff;text-align:left;font-size:35px}.section-description{color:#fff;font-size:20px;line-height:1.2;margin:20px 0}.movies{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;margin:50px 0}.movies:after{content:"";flex:0 0 31%}.movies .recommendation{width:calc(33.33333% - 20px);margin-bottom:40px;cursor:pointer}.movies .recommendation .bottom-container{padding:15px;background-color:#717994}.movies .recommendation .title{color:#fff;margin:0}.movies .recommendation img{width:100%;height:400px;display:block}.highlight{color:#5497d2;font-style:italic}.movies .recommendation{position:relative}.movies .recommendation.null-poster{display:none}.movies .recommendation .overlay-container{position:absolute;top:0;bottom:0;left:0;right:0;background-color:rgba(18,31,75,.98);justify-content:center;align-items:center;padding:30px;display:flex;opacity:0;transition:all .2s ease-out}.movies .recommendation:hover .overlay-container{opacity:1;transition:all .2s ease-out}.movies .recommendation .overlay-container .title{font-size:30px;text-align:center}@media (max-width:900px){.movies .recommendation img{height:auto}}@media (max-width:700px){.movies .recommendation{width:calc(50% - 10px);margin-bottom:20px}}@media (max-width:450px){.movies{margin:30px 0}.movies .recommendation{width:100%;margin-bottom:20px}}.popup{display:flex;align-items:center;justify-content:center;position:fixed;background-color:#121f4b}.popup,.popup .overlay{top:0;bottom:0;left:0;right:0}.popup .overlay{position:absolute;background-color:rgba(0,0,0,.85);z-index:100}.popup .popup-contents{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;width:1000px;z-index:200}.popup .popup-contents .left{width:30%}.popup .popup-contents .left .image-container img{width:100%;height:auto}.popup .popup-contents .right{width:70%;padding-left:40px}.popup .popup-contents .right .title{color:#fff;font-size:48px}.popup .popup-contents .right .description{color:#fff;margin-top:30px;font-size:18px;line-height:1.4;margin-bottom:30px}.popup .popup-contents .right .link{margin-top:30px}.popup .popup-contents .right .link a{display:inline-block;padding:15px 30px;background-color:#223343;color:#fff;text-decoration:none}.popup .close{position:absolute;top:30px;right:30px;font-size:40px;color:#fff;cursor:pointer}.popup .right .rating,.popup .right .release{color:#fff;font-size:20px;margin-bottom:15px}.popup .right .rating span,.popup .right .release span{display:inline-block;margin-left:10px}@media (max-width:1050px){.popup .popup-contents{width:100%;padding:50px}}@media (max-width:900px){.popup .popup-contents .left{display:none}.popup .popup-contents .right{width:100%;padding-left:0}}@media (max-width:600px){.popup .popup-contents .right .title{font-size:30px}.popup .popup-contents .right .description{height:100px;overflow-y:scroll}}section.movie-details{margin:30px 0;display:flex;flex-direction:row}section.movie-details .poster{width:30%}section.movie-details .poster img{width:100%;height:auto}section.movie-details .details{width:70%;padding-left:30px}section.movie-details .details .title{color:#eee;font-size:40px;margin-bottom:30px}section.movie-details .details .plot{color:#fff;font-size:18px;line-height:1.2;margin-bottom:30px}section.movie-details .details .genre,section.movie-details .details .rating,section.movie-details .details .runtime{color:#fff;font-size:20px;margin-bottom:15px}section.movie-details .details .genre span,section.movie-details .details .rating span,section.movie-details .details .runtime span{display:inline-block;margin-left:10px}@media (max-width:450px){section.movie-details{flex-direction:column}section.movie-details .poster{width:100%;margin-bottom:20px;text-align:center}section.movie-details .poster img{width:200px;height:auto}section.movie-details .details{width:100%;padding:0}}
/*# sourceMappingURL=main.437b2971.chunk.css.map */