@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;600;700;800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Marcellus&display=swap');

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body{
    background: #000;
    font-family: 'Mulish', sans-serif;
    color: #fff;
}

.container{
    max-width: 1500px;
    margin: 0 auto;
}

.header{
    width: 100%;
    padding: 14px 0;
    background: url('../img/header__bg.jfif') no-repeat center right;
    background-size: cover;
}

.header__menu{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav__list{
    display: flex;
    justify-content: space-between;
    list-style: none;
}

.nav__list li{
    margin-right: 54px;
}

.nav__list li:last-child{
    margin-right: 0;
}

.nav__list a{
    font-family: inherit;
    font-weight: bold;
    font-size: 16px;
    line-height: 20px;
    color: #FFFFFF;
    opacity: 0.5;
    text-decoration: none;
}

.menu__list{
    display: flex;
    justify-content: space-between;
    list-style: none;
}

.menu__list li{
    margin-right: 75px;
}

.menu__list li:last-child{
    margin-right: 0;
}

h1{
    font-family: Marcellus;
    font-style: normal;
    font-weight: normal;
    font-size: 100px;
    line-height: 70px;
    color: #FFFFFF;
    margin-top: 213px;
}

.header__tegs{
    display: flex;
    justify-content: space-between;
    font-weight: 800;
    font-size: 16px;
    line-height: 10px;
    margin: 50px 0 32px;
    max-width: 330px;
    align-items: center;
}

.header__text{
    font-size: 18px;
    line-height: 28px;
    color: #C2C2C2;
    max-width: 470px;
}

.btn{
    display: inline-block;
    padding: 15px 30px;
    font-family: Mulish;
    font-weight: 800;
    font-size: 16px;
    line-height: 20px;
    color: #323232;
    background: #FFFFFF;
    border-radius: 100px;
    text-decoration: none;
    margin-top: 25px;
}

.btn__2{
    margin-right: 30px;
    background: linear-gradient(316.53deg, #26FFF2 13.2%, #326CFF 71.54%);
    box-shadow: 0px 4px 50px rgba(50, 108, 255, 0.5);
    color: #fff;
}

.btn__play img{
    margin-right: 15px;
}

.tegs__age{
    border-radius: 50px;
    background: linear-gradient(316.53deg, #26FFF2 13.2%, #326CFF 71.54%);
    padding: 3px;
    text-align: center;
}

.tegs__age p{
    border-radius: 50px;
    padding: 6px 15px;
    background: #000;
}

.header__wrapper{
    margin-bottom: 170px;
}

.star{
    margin-right: 6px;
}

.tranding__slider{
    display: flex;
    justify-content: space-between;
    margin-top:60px;
}

.slider__block img{
    width: 206px;
    height: 309px;
    border-radius: 20px;
}

.section__title{
    font-size: 28px;
    line-height: 20px;
    margin-left: 11px;
}

.title__block{
    display: flex;
    align-items: center;
    margin: 60px 0 40px;
}

.title__bone{
    width: 8px;
    height: 35px;
    background: linear-gradient(316.53deg, #26FFF2 13.2%, #326CFF 71.54%);
    border-radius: 50px;
}

.trandingTV{
    border-top: 1px solid#2F2E2E;
    padding-top: 60px;
}
.genres{
    margin-top: 40px;
}

.genres__categoty{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.category__box{
    width: 340px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 27px;
    margin-bottom: 27px;
    border-radius: 20px;
    padding: 45px 0;

}

.category__box:nth-child(1){
    background: linear-gradient(109.31deg, #FD093F 2.4%, #F383F1 100%);
}

.category__box:nth-child(2){
    background: linear-gradient(114.5deg, #0FFFDA 2.22%, #3CDB77 68.84%);
}

.category__box:nth-child(3){
    background: linear-gradient(109.31deg, #B936FF 2.4%, #57DEDA 100%);
}

.category__box:nth-child(4){
    background: linear-gradient(109.31deg, #FD093F 2.4%, #FB1378 2.41%, #FCCB1A 100%);
}

.category__box:nth-child(5){
    background: linear-gradient(109.31deg, #FF6472 2.4%, #FDA75D 100%);
}

.category__box:nth-child(5) img{
    transform: rotate(46.5deg);
}

.category__box:nth-child(6){
    background: linear-gradient(110.16deg, #13547A 2.37%, #80D0C7 96.77%);
}

.category__box:nth-child(7){
    background: linear-gradient(109.93deg, #FFF77B 2.37%, #FFBF42 50%);
}

.category__box:nth-child(8){
    background: linear-gradient(109.31deg, #1FA2FF 2.4%, #1FA2FF 2.41%, #1F535C 97.46%);
}

.slider__chenel{
    display: flex;
    justify-content: space-between;
}

.chenel__box{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 260px;
    border-radius: 20px;
    background: #fff;
    color: #000;
    padding: 47px 0;
}

.actors__slider{
    margin-top: 70px;
    display: flex;
    justify-content: space-between;
}

.actors__box{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.actors__img{
    border-radius: 50%;
    width: 190px;
    height: 190px;
}

.actors__box:nth-child(1) .actors__img{
    background: url('../img/1.jfif') no-repeat center top;
    background-size: cover;
}

.actors__box:nth-child(2) .actors__img{
    background: url('../img/2.jfif') no-repeat center top;
    background-size: cover;
}

.actors__box:nth-child(3) .actors__img{
    background: url('../img/3.jfif') no-repeat center top;
    background-size: cover;
}
.actors__box:nth-child(4) .actors__img{
    background: url('../img/4.jfif') no-repeat center top;
    background-size: cover;
    transform: matrix(-1, 0, 0, 1, 0, 0);
}

.actors__box:nth-child(5) .actors__img{
    background: url('../img/5.jfif') no-repeat center top;
    background-size: cover;
}

.actors__box:nth-child(6) .actors__img{
    background: url('../img/6.jfif') no-repeat center top;
    background-size: cover;
}

.soon{
    margin-top: 90px;
}

.soon__block{
    width: 100%;
    height: 340px;
    background: linear-gradient(87.02deg, #0D1A73 29.67%, #000000 70.52%);
    box-shadow: 0px 0px 30px rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    display: flex;
}

.soon__box{
    flex-basis: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.soon__box img{
    width: 294px;
}

.soont__title{
    font-size: 64px;
    line-height: 100%;
    text-transform: capitalize;
}

.soon__box:first-child{
    background: url('../img/bigbunny.png') no-repeat center center;
    background-size: cover;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.registor{
    margin-top: 120px;
}

.registor__title{
    font-size: 64px;
    line-height: 100%;
    text-transform: capitalize;
    width: 792px;
}

.registor__block{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    background: url('../img/9.jfif') no-repeat center center;
    background-size: cover;
    padding: 71px 0;
    max-width: 1225px;
    margin: 0 auto; 
    border-radius: 20px;
    backdrop-filter: blur(50px);
}

.footer{
    background: #101012;
    margin-top: 120px;
    padding: 70px 0;
}

.footer__block{
    display: flex;
    justify-content: space-between;
}

.footer__nav{
    display: flex;
    justify-content: space-between;
}

.social__list{
    display: flex;
    list-style: none;
    margin-top: 21px;
}

.social__list li{
    margin-right: 13px;
}

.footer__list{
    list-style: none;
    margin-right: 52px;
}

.footer__list:last-child{
    margin-right: 0;
}

.footer__list li{
    margin-top: 20px;
}

.footer__list li:first-child{
    margin-top: 0;
}

.footer__list a{
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    color: #C2C2C2;
    text-decoration: none;
}