@media screen and (max-width: 520px) {
    .container {
        width: -webkit-fill-available;
        width: fill-available;
        padding: 25px;
    }

    .navigation {
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 20px;
    }

    .navList {
        flex-direction: column;
        align-items: center;
    }

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

    .header {
        height: auto;
        padding: 0;
        z-index: 999;
    }

    .headDescWrapper {
        padding: 50px 0 0 0;
        flex-direction: column;
    }

    .headDesc h2 {
        font-size: 32px;
    }

    .bonusSpan {
        width: auto;
        text-align: center;
    }

    .headDescWrapper .mainBird {
        display: none;
    }

    .onlineUsers {
        text-align: center;
    }

    .headDog {
        width: auto;
    }

    .headDog img {
        max-width: 100%;
    }

    .aboutSection {
        margin-top: 0;
        padding-top: 0;
    }

    .containerAbout {
        flex-direction: column;
    }

    .mainTitle {
        font-size: 27px;
    }

    .howItWorksWrapperFlex {
        flex-direction: column;
    }

    .howItWorksWrapperFlex div .mainTitle {
        font-size: 27px;
    }

    .hiwDog {
        display: none;
    }

    .hitTitle {
        margin-bottom: 0;
        font-size: 27px;
        text-align: center;
    }

    .rightStar {
        display: none;
    }

    .petsTitle img {
        max-width: 100%;
    }

    .sectionPets .mainBird4 {
        display: none;
    }

    .petsGrid {
        grid-template-columns: 1fr;
        margin-bottom: 0;
    }

    .petDetailsModal {
        top: 0;
        padding: 10px;
    }

    .petDetailsModal {
        z-index: 9999999999;
    }

    .tableWrapper table tr {
        display: flex;
        flex-direction: column;
    }

    .petTable th,
    .petTable td {
        padding: 8px;
        font-size: 14px;
    }

    .modalContent {
        width: -webkit-fill-available;
        width: fill-available;
        overflow-x: hidden;
        max-height: 400px;
    }

    .petDetailsModal {
        align-items: start;
    }

    .petPrice b,
    .petProfit b,
    .petName {
        font-size: 27px;
    }

    .reffFlex {
        margin-bottom: 0;
        flex-direction: column;
    }

    .reffFlex img {
        max-width: 100%;
    }

    .headOwl1 {
        display: none;
    }

    .newsWrapper .birdN {
        display: none;
    }

    .titleRightContainer .mainTitle {
        text-align: center;
        font-size: 34px;
    }

    .titleRightContainer .mainTitleDesc {
        text-align: center;
        font-size: 27px;
    }

    .titleRightContainer {
        margin-top: 0;
    }

    .newsWrapper {
        margin-top: 0;
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .newsImages img {
        max-width: 100%;
    }

    .sectionAnswers .mainTitle {
        font-size: 34px;
    }

    .sectionAnswers .mainTitleDesc {
        font-size: 24px;
        line-height: 140%;
    }

    .sectionAnswers {
        padding: 0;
    }

    .pawTop {
        display: none;
    }

    .containerAns {
        margin-top: 0;
    }

    .sectionNews {
        margin-bottom: 0;
    }

    .faqQuestion span {
        min-width: 64px;
    }

    .faqQuestion span img {
        max-width: 100%;
    }

    .faqQuestion {
        font-size: 18px;
        height: auto;
        border-radius: 20px;
        padding: 8px;
    }

    .faqQuestion {
        gap: 10px;
    }

    .dogEyes {
        display: none;
    }

    .mobileNavigation {
        display: flex;
        box-shadow: 0 8px 15px rgba(249, 142, 60, 0.28);
    }

    .mobileNavigation img {
        height: 30px;
    }

    .navigation .logoLink {
        display: none;
    }

    .navigation {
        display: flex;
        position: fixed;
        background: #3B2F20;
        padding: 20px;
        z-index: 9999;
        top: 50px;
        left: -220px;
        opacity: 0;
        width: 180px;
        overflow: hidden;
        border-radius: 0 0 20px 20px;
        transition: all .5s ease;
    }

    .navigation.active {
        left: 0;
        opacity: 1;
    }

    .buttonWrapper a {
        width: -webkit-fill-available;
        width: fill-available;
        color: #3B2F20;
    }

    .navList {
        gap: 15px;
    }

    .newsImages {
        overflow: hidden;
    }

    .formWrapper {
        width: -webkit-fill-available;
        width: fill-available;
    }

    .formCol {
        flex-direction: column;
        align-items: start;
    }

    .formTitle {
        line-height: 120%;
        font-size: 20px;
    }

    .welcomeBlock {
        grid-template-columns: 1fr;
        margin: 58px 0 0 0;
    }

    .cabPet img {
        display: none;
    }

    .welcomeBlockStatCol {
        grid-template-columns: 1fr;
    }

    .balanceRow {
        grid-template-columns: 1fr;
    }

    .paymentsWrapper {
        grid-template-columns: 1fr;
    }

    .amountWrapperRow {
        flex-direction: column;
    }

    .sectionBalance {
        margin-bottom: 0;
    }

    .tableBlock {
        max-width: 600px;
        overflow-y: hidden;
    }

    table.list tr th,
    table.list tr td {
        padding: 10px;
    }

    .depoColBlock {
        flex-direction: column;
    }

    .containerWallet .formatTableWrapper {
        grid-template-columns: repeat(1, 1fr);
        gap: 10px;
    }
    .containerWallet .formatTableWrapper .formatTableRow {
        flex-direction: column;
        gap: 10px;
    }

    .refDog {
        display: none;
    }

    .cabRefLvl {
        display: flex;
        gap: 10px;
        flex-direction: column;
        position: revert;
        right: 0px;
        top: 0px;
    }

    .refTopStat {
        margin-top: 0;
    }

    .refTopRow {
        grid-template-columns: 1fr;
    }

    .mainRefList {
        grid-template-columns: 1fr;
    }

    .refList {
        margin-top: 10px;
    }

    .refLinkRow {
        flex-direction: column;
    }

    .refLinkRow input {
        width: -webkit-fill-available;
        width: -moz-available;
    }

    .cabFReffInfo,
    .refPartnerRow {
        grid-template-columns: 1fr;
    }

    .refPartnerRow {
        gap: 10px;
    }

    .containerMaterials {
        grid-template-columns: repeat(1, 1fr);
    }

    .materialsBtn {
        flex-direction: column;
        gap: 10px;
    }

    .materialsBtn .btn {
        width: -webkit-fill-available;
        width: available;
    }

    .contactsRow {
        grid-template-columns: repeat(1, 1fr);
    }

    .sectionContact {
        padding: 5px 0;
    }

    .contMailRow {
        flex-direction: column;
    }

    .mediaTelegramRow {
        width: 100%;
        height: 80px;
        top: auto;
        left: 0;
        bottom: 0;
        display: flex;
        flex-direction: row;
    }
}