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

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-transform: capitalize;
    color: white;
    scroll-behavior: smooth;

}

body {
    z-index: -1;
    background-color: #000000;

}

header {
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(download.jpg);
    height: 93vh;
    background-size: cover;
    background-repeat: no-repeat;
}

nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 170px;
    width: 100%;
    background-position: center;
    height: 90px;

}

.logo img {
    height: 58px;
    width: 165px;
}

.nav select {
    padding: 4px 20px;
    margin-left: 30px;
    background: none;
    border: 2px solid #5f5f5e;
    color: white;
    border-radius: 5px;
}

.nav input {
    height: 32px;
    width: 76.9px;
    margin-left: 18px;
    font-size: 14px;
    font-weight: 500;
}

.nav input:hover {
    background-color: #c11119;
}

.nav input {
    background: #e50914;
    border: none;
    border-radius: 4px;
    font-size: 18px;
}

.nav select {
    font-size: 18px;
    background-color: #000000;

}

section {
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(93vh - 90px);
}

.center {

    text-align: center;
    align-items: center;
}

.center h1 {
    font-size: 46px;
    font-family: 'Alexandria', sans-serif;
}

.center h4 {
    margin-top: 13px;
    font-size: 24px;
    margin-bottom: 34px;
    font-weight: 500;
    font-family: system-ui;


}

.center h3 {
    font-size: 20px;
    margin-bottom: 20px;
    font-family: system-ui;
    font-weight: normal;


}

#email {
    height: 24px;
    width: 400.75px;
    padding: 24px 20px;
    border-radius: 4px;
    background: #161514;
    border: 1px #5e5e5e solid;
    color: #ffff;
    font-size: 16px;



}

#email:focus {
    background-color: #000000;
    color: white;
}


#getstarted {
    margin-left: 6px;
    padding: 12px 40px;
    background-color: #e50914;
    color: white;
    font-size: 24px;
    border-radius: 4px;




}

#getstarted:hover {

    background-color: #c11119;
}

.carouselsS {
    position: absolute;
    top: 113px;
    width: 379px;
}

.carousel2 {
    position: relative;
    width: fit-content;
}

.btn {
    display: flex;
    justify-content: center;
    align-items: center;

}

.hr {
    height: 8px;
    width: 8px;
    background-color: rgb(35, 35, 35);
    width: 100%;
}

.part2 {
    display: flex;

    z-index: 99999999999999;
    min-height: 570px;
    background-color: #000000;
    justify-content: center;
}

.part2 h1,
.part2 h3 {
    color: rgb(255, 255, 255);
}

.part2 h1 {
    font-size: 48px;
    font-family: 'Tilt Warp', cursive;
    letter-spacing: 1.2px;
}

.part2 .text {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.part2 p {
    font-size: 24px;
    margin-top: 10px;
    line-height: 1.4;
}


.text,
.text2 {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;

}

.text1,
.text3 {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
}

.text1 h1 {

    line-height: 1.6;

}



.carousel img,
.carousel1 img,
.carousel2 img,
.carousel3 img {
    width: 577px;

}

.carousel,
.carousel1,
.carousel2,
.carousel3 {

    display: flex;
    align-items: center;
    justify-content: center;
}





.beforelast {
    background-color: #000000;
}

.textss {
    padding: 50px 0 20px 0;
    display: flex;
    justify-content: center;
}

.beforelast .textss h1 {
    font-size: 45px;
    font-family: 'Tilt Warp', cursive;
}

.container {
    width: 77%;
    margin: 5px auto;
}

.container .bt button {
    width: 100%;
    text-align: start;
    padding: 29px;
    font-size: 24px;
    background-color: #2d2d2d;
    border: none;
}

.container .bt {
    margin-bottom: 10px;
}

.center1 {
    margin-top: 60px;
    padding-bottom: 70px;
}

.center1 h3 {
    display: flex;
    justify-content: center;
    padding: 15px;
    font-size: 20px;
    font-family: system-ui;
    font-weight: normal;
}

.container .bt button:hover {
    background-color: #4e4e4e;

}

.lastpart {
    display: flex;
    align-items: center;
    justify-content: SPACE-EVENLY;
}



.sss h4 {
    text-decoration: underline;

    padding: 40px 0 40px 188px;
    color: #b3b3b3;

}


.lastpart .cont ul li {
    list-style-type: none;
    padding-bottom: 15px;
    text-decoration: underline;
    color: #b3b3b3;
}

footer {
    height: 570px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: -50px;
}

.nav1 select {
    padding: 4px 20px;
    margin-left: 30px;
    background: none;
    border: 2px solid #5f5f5e;
    color: white;
    border-radius: 5px;
    font-size: 18px;
    background-color: #000000;

}

.nav1 {
    padding-left: 157px;
    margin-top: 30px;
}

.lastdd {
    padding-left: 188px;
    margin-top: 25px;

}

.lastdd h5 {
    color: #b3b3b3;
}

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

.carousels {
    position: absolute;
    width: 432px;
    margin-top: -9px;
}

.carousel1 {
    display: flex;
    flex-direction: column;
    position: relative;
}

.download {
    width: 363px;
    height: 92px;
    background-color: rgb(0, 0, 0);
    position: absolute;
    display: flex;
    align-items: center;
    border-radius: 11px;
    padding: 7px 12px;
    gap: 10px;
    MARGIN-TOP: 279PX;

    border: 1px solid #5f5f5e;

}

.download .starnger img {
    height: 100%;
    width: 60px;

}

.starnger {
    height: 100%;
    display: flex;
    align-items: center;
}

.article {

    flex-basis: 70%;
}

.akhiran {
    height: 70%;

}

.akhiran img {
    height: 100%;
    width: 50px;
}

.article h4:nth-of-type(2) {
    color: rgb(0, 113, 235)
}

.nav span {
    display: none;
}

#fix {
    position: fixed;
    right: 10px;
    bottom: 20px;
    z-index: 99999999999999999999999999;
    transition: 0.5s;
    display: none;

}

#fix img {
    width: 70px;
    cursor: pointer;
}








@media screen and (max-width: 960px) {
    nav {
        padding: 0 21px;
    }

    .nav select,
    .nav input {
        padding-left: 3px;
        margin: 0;
    }

    .nav select {
        padding: 4px 1px;
    }


    .logo img {
        height: 32px;
        width: 95px;
    }

    header {
        height: 550px;
    }

    section {

        height: calc(550px - 90px);

    }



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

    #email {
        width: 75%;
    }

    .center h1 {
        font-size: 30px;
        font-family: 'Alexandria', sans-serif;
    }

    .center h4 {
        margin-top: 13px;
        font-size: 16px;
        margin-bottom: 34px;
        font-weight: 500;
        font-family: system-ui;
    }

    .center h3 {
        font-size: 18px;
        margin-bottom: 20px;
        font-family: system-ui;
        font-weight: normal;
        padding: 0 40px;
    }

    #getstarted {
        margin-left: 6px;
        margin-top: 10px;
        padding: 10px 16px;
        background-color: #e50914;
        color: white;
        font-size: 24px;
        border-radius: 4px;
    }

    .carousel img,
    .carousel1 img,
    .carousel2 img,
    .carousel3 img {
        width: 100%;

    }

    .carousel,
    .carousel1,
    .carousel2,
    .carousel3 {
        width: 70%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        POSITION: RELATIVE;


    }

    .carousel1 {
        grid-area: 2;
    }

    .carousel3 {
        grid-area: 2;
    }

    .beforelast .textss h1 {
        font-size: 33px;
        font-family: 'Tilt Warp', cursive;
        font-weight: normal;
        text-align: center;
    }

    .container .bt button {
        width: 100%;
        text-align: start;
        padding: 29px;
        font-size: 20px;
        background-color: #2d2d2d;
        BORDER: NONE;
    }

    .center1 h3 {
        display: flex;
        justify-content: center;
        padding: 15px;
        font-size: 16px;
        font-family: system-ui;
        font-weight: normal;
        margin-top: -20px;
        text-align: center;
    }

    .container {
        width: 90%;
        margin: 5px auto;
    }

    .part2 {
        width: 100%;
    }



    .text,
    .text2 {
        padding-left: 0px;
        align-items: center;
        width: 100vw;
    }

    .part2 p {
        font-size: 16px;
        margin-top: 18px;
        text-align: center;
        line-height: 1.4;
    }

    .part2 h1 {
        font-size: 26px;
        font-family: 'Tilt Warp', cursive;
        letter-spacing: 1.2px;
        text-align: center;
    }

    .part2 .text {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100vw;
    }

    .part2 {

        padding: 40px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
    }

    .carousel1 {
        position: download;
    }



    .text1,
    .text3 {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100vw;
    }

    .sss h4 {
        text-decoration: underline;
        padding-left: 20px;
        color: #b3b3b3;
    }

    .lastpart {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding-left: 20px;
        padding-right: 40PX;
    }

    .nav1 {
        padding-left: 20px;
        margin-top: 30px;
    }

    .lastdd {
        padding-left: 20px;
        margin-top: 25px;
    }

    .nav1 select {
        padding: 4px 20px;
        margin-left: 0px;
        background: none;
        border: 2px solid #5f5f5e;
        color: white;
        border-radius: 5px;
        font-size: 18px;
        background-color: #000000;
    }

    .nav span {
        display: block;
        position: absolute;
        left: 10px;
        top: 5px;
        font-size: 20px;
    }

    .nav select {
        width: 48px;
        padding: 3px 1px;
    }

    .nav {
        position: relative;
    }

    .parttt {
        flex-direction: column-reverse;
    }

    .carousels {
        position: absolute;
        width: 75%;
        margin-top: -9px;
    }

    .carouselsS {
        position: absolute;
        top: 12%;
        width: 64%;
    }

    .download {
        width: 100%;
        height: 63px;
        background-color: rgb(0, 0, 0);
        position: absolute;
        display: flex;
        align-items: center;
        border-radius: 11px;
        padding: 7px 12px;
        gap: 10px;
        border: 1px solid #5f5f5e;
        margin-top: 205px;
    }

    .akhiran img {
        width: 40px;
    }

    .article h4 {
        font-size: 10px;
    }

    .download .starnger img {
        height: 100%;
        width: 36px;
    }





}

@media screen and (max-width: 250px) {
    .container2 {
        min-width: 250px;
    }

}