:root{--textColor: #FFFFFF;--headerBackgroundColor: #233647;--mainBackgroundColor: #EDF0F4;--headerButtonColor: #C6EE80;--searchButtonBackgroundColor: #A6B2C4}body{display:flex;flex-direction:column;align-items:center;margin:0}h1,h2,h3,h4,h5,h6{margin:0}ul{margin:20px 0 0;padding:0}li{list-style-type:none}button{background-color:transparent;border:none;cursor:pointer;color:var(--textColor);padding:0}#app{background-color:var(--mainBackgroundColor);color:var(--textColor);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:100vw;max-width:1440px;min-height:100vh;display:flex;flex-direction:column;gap:40px}#app .top-section .header{height:100px;background-color:var(--headerBackgroundColor);display:flex;justify-content:space-between;padding:0 60px}#app .top-section .header>.header-section{height:inherit;display:flex;gap:60px}#app .top-section .header>.header-section>.header-logo{display:flex;flex-direction:column;justify-content:center;gap:2px}#app .top-section .header>.header-section>.header-logo>h2{font-size:2rem}#app .top-section .header>.header-section>.header-logo>span{font-size:.7rem}#app .top-section .header>.header-section>.header-nav{height:100%;display:flex;align-items:end;gap:20px}#app .top-section .header>.header-section>.header-nav .button{padding-bottom:10px;border-bottom:transparent solid 2px}#app .top-section .header>.header-section>.header-nav .button:active{border-bottom:var(--headerButtonColor) solid 2px}#app .top-section .header .header-profile>.burger-icon{display:none}#app .top-section .hero{height:567px;background-image:url(/02/heroImage.png);background-size:contain;background-position:center;position:relative}#app .top-section .hero .hero-blur{position:absolute;width:100%;height:100%;background:rgb(0,0,0);background:linear-gradient(180deg,rgba(35,54,71,0) 0%,rgba(35,54,71,.6) 100%)}#app .top-section .hero .hero-content{position:absolute;left:60px;bottom:70px;display:flex;flex-direction:column;align-items:start;gap:22px}#app .top-section .hero .hero-content .hero-rating{display:flex;flex-direction:column;gap:5px}#app .top-section .hero .hero-content .hero-rating .hero-rating-info{display:flex;align-items:end;gap:5px}#app .top-section .hero .hero-content .hero-text{display:flex;flex-direction:column;gap:44px}#app .top-section .hero .hero-content .hero-text .hero-title{width:341px}#app .top-section .hero .hero-content .hero-text .hero-buttons-container{font-size:18px;display:flex;flex-direction:row;align-items:center;gap:20px}#app .top-section .hero .hero-content .hero-text .hero-buttons-container>.hero-button{font-size:18px;color:#000;padding:10px 0;width:312px;height:48px;border-radius:24px;background-color:var(--textColor);display:flex;align-items:center;justify-content:center;gap:10px}#app .top-section .hero .hero-content .hero-text .hero-buttons-container>.hero-button.opposite{color:var(--textColor);border:var(--textColor) solid 2px;background-color:transparent}#app .search{padding:0 60px}#app .search>.search-container{background-color:var(--textColor);width:447px;height:60px;border-radius:30px;padding:0 0 0 16px;display:flex;align-items:center;justify-content:space-between}#app .search>.search-container>#searchInput{flex-grow:1;border:none;line-height:22px;font-size:16px;outline:none}#app .search>.search-container>.search-button{width:60px;height:60px;background-color:var(--searchButtonBackgroundColor);border-radius:30px;display:flex;align-items:center;justify-content:center}#app .search>.search-container>.search-button>img{width:24px;height:24px}#app .lists-container{padding:0 60px;display:flex;flex-direction:column;gap:40px}#app .film-list-title{color:var(--headerBackgroundColor);font-size:20px;font-weight:600}#app .films-list{display:flex;flex-wrap:wrap;justify-content:space-evenly;gap:45px}#app .films-list>.film-card{height:255px;width:182px;position:relative}#app .films-list>.film-card>.film-card-button{position:absolute;top:5px;right:5px}#app .films-list>.film-card>.film-card-button>img{color:var(--headerButtonColor)}@media screen and (max-width: 1439px){#app{gap:32px}#app .top-section .header{height:100px;display:flex;justify-content:space-between;padding:0 24px}#app .top-section .header>.header-section{height:inherit;display:flex;gap:60px}#app .top-section .header>.header-section>.header-logo>span{display:none}#app .top-section .header>.header-section>.header-nav{display:none}#app .top-section .header .header-profile>.profile-icon{display:none}#app .top-section .header .header-profile>.burger-icon{display:block}#app .top-section .hero{background-size:cover;display:flex;align-items:center;justify-content:center}#app .top-section .hero .hero-content{height:100%;left:auto;bottom:auto;justify-content:center}#app .top-section .hero .hero-content .hero-rating{display:flex;flex-direction:column;gap:5px}#app .top-section .hero .hero-content .hero-rating .hero-rating-info{display:flex;align-items:end;gap:5px}#app .top-section .hero .hero-content .hero-text .hero-title{width:280px}#app .top-section .hero .hero-content .hero-text .hero-buttons-container{flex-direction:column;align-items:center}#app .search{width:auto;padding:0 24px}#app .search>.search-container{width:auto}#app .search>.search-container>.search-button{display:none}#app .lists-container{padding:0 32px;gap:32px}#app .film-list-title{font-size:18px}#app .films-list{gap:25px}#app .films-list>.film-card{width:130px;height:min-content}#app .films-list>.film-card>img{width:130px;height:186px}}
