*{padding:0;margin:0;box-sizing:border-box}:root{--primary: #032541;--secondary: #21d07a;--color: #fff}:before,:after{box-sizing:border-box}ul{list-style:none;padding:0;margin:0}.btn{background-color:var(--secondary);color:var(--primary);padding:10px 15px;border-radius:5px;text-transform:uppercase;font-weight:700;border:none;display:inline-block;font-size:1rem;transition:all .3s ease;line-height:1.1}.btn:hover{background-color:#1aa762;opacity:1;cursor:pointer}.btn:disabled{pointer-events:none;opacity:.5}input:focus{outline:none}body{font-family:sans-serif}.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width: 768px){.container{width:750px}}@media (min-width: 992px){.container{width:970px}}@media (min-width: 1200px){.container{width:1170px}}.header{background-color:var(--primary);padding:10px 0}.container{display:flex;justify-content:space-between;align-items:center}.header a{color:var(--color);font-size:1.25rem;text-decoration:none;cursor:pointer;transition:all .3s ease}.header a:hover{opacity:.7}.header .logo a{font-weight:700;font-size:1.5rem}.header .nav-links{display:flex;align-items:center}.header .nav-links li{margin-right:30px;display:inline-block}@media (max-width: 575px){.header .nav-links li{margin:0 5px}}.header .nav-links li:last-child{margin-right:0}.add-content{padding:50px 0;max-width:600px;margin:0 auto}.add-content .input-container input{width:600px;background:var(--primary);color:var(--color);padding:10px;border:none;border-radius:5px;font-size:1.25rem}.result{margin-top:20px}@media (max-width: 615px){.add-content .input-container input{width:500px}}@media (max-width: 517px){.add-content .input-container input{width:400px}}@media (max-width: 621px){.add-content .input-container input{width:300px}}.result-card{display:flex;margin-bottom:20px}.result-card .poster-wrapper img,.filter-poster{width:75px;height:113px;border-radius:5px;background-color:#dbdada;margin-right:15px;display:block;color:transparent}.result-card .info{display:flex;flex-direction:column;justify-content:space-between}.result-card .info .title{font-size:1.25rem;color:var(--primary);font-weight:600;margin:0}.result-card .info .release-date{font-size:1rem;font-weight:700;color:gray;margin:0}.result-card .controls button{margin-right:10px}.movie-card{width:100%;border-radius:5px;overflow:hidden;position:relative;border:0;display:block}.movie-card img{width:100%;height:100%;object-fit:cover}.movie-card .overlay{position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid transparent;transition:all .3s ease}.movie-card:hover .overlay{border:3px solid var(--secondary)}.inner-card-controls{display:flex;align-items:center;position:absolute;bottom:20px;left:50%;transform:translate(-50%);background-color:#000c;border-radius:5px;padding:3px;opacity:0;transition:all .3s ease}.movie-card:hover .inner-card-controls{opacity:1}.ctrl-btn{color:#fefefe;background-color:transparent;border:none;transition:all .3s ease;font-size:1.25rem;padding:5px;margin:0}.ctrl-btn:hover{color:var(--secondary);cursor:pointer}.watch-list{padding:30px 0;overflow:hidden}.watch-list .main-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.watch-list h1{color:var(--primary);margin:0}.watch-list .no-movies{color:#c4c4c4;font-size:3rem;text-align:center}@media (max-width: 793px){.watch-list .no-movies{font-size:2rem}}@media (max-width: 539px){.watch-list .no-movies{font-size:1.5rem}}@media (max-width: 621px){.watch-list .no-movies{font-size:1rem}}.movie-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:30px}@media (min-width: 992px){.movie-grid{grid-template-columns:repeat(4,1fr)}}@media (max-width: 989px){.movie-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 661px){.movie-grid{grid-template-columns:repeat(1,1fr)}}.watched{padding:30px 0;overflow:hidden}.containere{padding-left:15px;padding-right:15px;margin-left:auto;margin-right:auto}.watched .main-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.movies-count{display:block;background:var(--secondary);padding:5px 15px;font-size:1.125rem;font-weight:600;border-radius:999px;color:var(--primary)}.watched h1{color:var(--primary);margin:0}.watched .no-movies{color:#c4c4c4;font-size:3rem;text-align:center}@media (max-width: 793px){.watched .no-movies{font-size:2rem}}@media (max-width: 539px){.watched .no-movies{font-size:1.5rem}}@media (max-width: 621px){.watched .no-movies{font-size:1rem}}
