html {
	scroll-behavior: smooth;
}

.main_page_info {
    display: flex;
    margin-top: 70px;


    opacity: 0;
    transform: translateY(10%);
    animation: appear 0.5s forwards; /* Use the 'appear' animation with different delays */
}

.main_page_info .info {
    width: 505px;
}

.main_page_info .custom_header {
    font-size: 49px;
    width: 505px;
    font-family: Gilroy-Bold;
    line-height: 45px;
    margin: 0;
}

.main_page_info .values {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 35px;
    gap: 18px;
    row-gap: 10px;
}

.main_page_info .values * {
    margin: 0;
}

.main_page_info .values .value {
    padding: 5px 20px;
    background: #FDD3B2;
    border: 1px solid #F96E00;
    color: #BA5200;
    border-radius: 5px;

    opacity: 0;
    transform: translateX(-10%);
    animation: appearx 0.3s forwards;
}

.main_page_info .values .value:nth-child(1) {
    animation-delay: 0.4s;
}

.main_page_info .values .value:nth-child(2) {
    animation-delay: 0.8s;
}

.main_page_info .values .value:nth-child(3) {
    animation-delay: 1.2s;
}

.main_page_info .sub-header {
    line-height: 20px;
    font-size: 15.5px;
    opacity: 0.6;
}

.main_page_info .info .sub-header, .main_page_info .info .authentication {
    opacity: 0;
    transform: translateY(10%);
    animation: appear 0.4s forwards;
    animation-delay: 1.5s;
}

.main_page .our_works {
    opacity: 0;
    transform: translateY(10%);
    animation: appear 0.3s forwards;
    animation-delay: 1.8s;
}

.main_page_info .info .statistics {
    display: flex;
    width: 380px;
    gap: 15px;
    flex-wrap: wrap;
}

.main_page_info .info .statistics div {
    width: 48%;
    height: 110px;
    background-color: #BAE6DD;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;

    opacity: 0;
    transform: translateY(20%);
    animation: appear 0.3s forwards; /* Use the 'appear' animation with different delays */
}

@keyframes appear {
  to {
    opacity: 1; /* Fade in the element */
    transform: translateY(0); /* Slide up the element */
  }
}

@keyframes appearx {
  to {
    opacity: 1; /* Fade in the element */
    transform: translateX(0); /* Slide up the element */
  }
}

.main_page_info .info .statistics div:nth-child(1) {
  animation-delay: 0.5s; /* Delay for the first element */
}

.main_page_info .info .statistics div:nth-child(2) {
  animation-delay: 0.8s; /* Delay for the second element */
}

.main_page_info .info .statistics div:nth-child(3) {
  animation-delay: 1.1s; /* Delay for the third element */
}

.main_page_info .info .statistics div:nth-child(4) {
  animation-delay: 1.4s; /* Delay for the fourth element */
}



.main_page_info .info .statistics div h2 {
    margin: auto 0px 0px 0px;
    font-size: 30px;
    font-family: Gilroy-Bold;
}

.main_page_info .info .statistics div p {
    margin: 0px 0px auto 0px;
    font-size: 20px;
    text-align: center;
}

.main_page_info .banner {
    width: 560px;
    height: 388px;
    margin-left: auto;
    transform: translateY(-10px);
}

.main_page_info .banner .choices_us {
    border: none;
    border-radius: 12px;
    box-shadow: 0 0 10px 0px #cecece;
    background: white;

    width: 250px;
    height: 110px;

    position: absolute;
    bottom: 20px;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
}

.main_page_info .banner .choices_us img {
    margin-top: 13px;
    width: 70%;
}

.main_page_info .banner .choices_us {
    opacity: 0;
    transform: translateY(20%);
    animation: appear 0.5s forwards;
    animation-delay: 1.6s;
}

.main_page_info .banner .choices_us p {
    text-align: center;
    margin: 0 0 auto 0;
    font-family: Gilroy-Medium;
    width: 60%;
}

.main_page .our_works .see_more {
    display: flex;
    justify-content: center;
    color: #F96E00;
    font-size: 18.5px;
    text-decoration: none;
    border-bottom: 1px solid #F96E00;
    width: fit-content;
    margin: 0 auto;
    margin-top: 20px;
}


.block.modules .container .module {
    display: flex;
    justify-content: space-between;
}

.main_content {
    padding-bottom: 100px;
}

.block.modules .container .module * {
    margin: 0;
}

.block.modules .container .module .text {
    margin: 35px 0;
}

.block.modules .container .module .bottom_opacity {
    display: none;
    width: 100%;
    background: linear-gradient(189.05deg, white 14.24%, white 58.46%, white 107.34%);
    height: 30px;
    filter: blur(6px);
    transform: translateY(-25px);
}

.block.modules .container .module .module_img {
    width: 443px;
    height: auto;
    margin-right: 40px;
}

.block.modules .container:nth-child(2) .module .module_img {
    margin-right: 45px;
}

.block.modules .container .module .text .module_id {
    font-size: 26px;
    font-family: Gilroy-Bold;
}

.block.modules .container .module .text .module_name {
    margin: 15px 0;
    font-size: 64px;
    font-family: Gilroy-Medium;
    margin-top: 50px;
}

.block.modules .container .module .text .themes_count {
    color: #A6A6A6;
    font-size: 22px;
    font-family: Gilroy-Medium;
    margin-bottom: 5px;
    width: 80%;
}

.block.modules .container .module .text .theme_name {
    white-space: pre-wrap;
    font-size: 15px;
    font-family: Gilroy-Regular;
    color: #A6A6A6;
}

.block .container .authentication .signup_btn {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 0 70px;
    position: relative;
}

.block:first-child .container .authentication .signup_btn {
    padding: 0 63.5px;
}

.block .container .authentication .signup_btn img {
    position: absolute;
    top: 35%;
    right: 20%;
}

.container.themes_title, .container.themes {
    margin-top: 12px;
    margin-bottom: 0;
    height: 70px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    color: black;
}

.container.themes_title {
    margin-top: 45px;
}

.container.themes_title *, .container.themes * {
    margin: 0;
}

.container.themes_title span {
    font-size: 35px;
    font-family: Gilroy-Bold;
}

.container.themes h1 {
    font-family: Gilroy-Regular;
    font-size: 20px;
    opacity: 0.7;
}

.container.video {
    padding: 0;
    width: 1200px;
    background: none;
}

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

.container.video .content video {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    aspect-ratio: 1200/600;
}

.container.video .content .files {
    width: 31.5%;
    background: white;
    padding: 27px;
    border-radius: 21px;
    overflow-y: scroll;
    max-height: 351px;
}

.container.video .content .files .files_title {
    font-size: 25px;
    margin-bottom: 17.5px;
    display: block;
    font-family: Gilroy-Bold;
}

.container.video .content .files .file {
    line-break: anywhere;
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 12px 20px;
    margin-bottom: 15px;

    border: 1px solid #AA5DFF;
    border-radius: 6px;
}

.container.video .navigation {
    margin-top: 48px;
    display: flex;
    justify-content: space-between;
}

.container.video .content .files .empty {
    width: 100%;
    height: 86%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid #dfdfdf;
    color: #DFDFDF;
    font-size: 34px;
    font-family: 'Gilroy-Bold';
    border-radius: 12px;
}

.block.modules .container ._themes {
    display: flex;
    gap: 24px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.block.modules .container ._themes * {
    margin: 0;
}

.block.modules .container ._themes ._theme {
    padding: 4px 4px 27px 4px;
    flex: 1 0 calc(100% / 4 - 26px);
    border-radius: 16px;
    background-color: #F5F5F5;
    display: flex;
    flex-direction: column;
    gap: 18px;
    text-decoration: none;
    color: black;
}

.block.modules .container ._themes ._theme ._theme_img {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    width: 100%;
    aspect-ratio: 199/160;
    border-radius: 12px;
}

.block.modules .container ._themes ._theme p {
    font-size: 24px;
    font-family: Gilroy-Bold;
    padding: 0px 13px;
}

.block.modules .container .module .progress_img:nth-child(1) {
    position: absolute;
    bottom: 50px;
    rotate: 11deg;
    transform: translateX(-170px);
}

.block.modules .container .module .progress_img:nth-child(2) {
    position: absolute;
    bottom: -30px;
    rotate: -15deg;
    transform: translateX(100px);
}


.block.poster {
    background-image: url(/static/v2/imgs/main_page_background.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    aspect-ratio: 1512/674;
    position: absolute;
    top: 0;
    z-index: -1;
}

.block.title * {
    background: none;
}

.block.title .container {
    margin-top: 64px;
    margin-bottom: 75px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.block.title .container * {
    margin: 0;
    background: none;
    text-align: center;
}

.block.title .container h2 {
    font-family: Gilroy-Regular;
    opacity: 0.25;
    font-size: 24px;
}

.block.title .container h1 {
    margin: 25px 0 12px 0;
    font-size: 70px;
    line-height: 65px;
    letter-spacing: 0.5px;
}