@media only screen and (max-width: 1160px) {
    .profile-info-head .profile-info-avatar {
        /* max-width: 220px; */
        width: 100%;
    }
    .connect-actions {
        width: 100%;
    }
    .newsTab-item--preview {
        width: 180px;
    }
    .chat-block-outer {
        grid-template-columns: 330px 1fr;
    }
}
@media only screen and (max-width: 1030px) {
    #modal-promo .promo-popup-content {
        padding: 50px 20px;
    }
    #modal-promo .promo-popup-content > div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #modal-promo .modal-promo-popup .btn {
        margin-bottom: 25px;
    }
    .myProjects-item__grid {
        grid-template-columns: auto;
        grid-template-areas:
            'myProjects-item-tags '
            'myProjects-item-info'
            'myProjects-item-description';
        gap: 30px 70px;
    }
}

@media only screen and (max-width: 960px) {
    .profile-info-head {
        gap: 20px;
    }
}

@media only screen and (max-width: 900px) {
    .profile-info-head {
        grid-template-columns: max-content 1fr;
    }
    .profile-info-user-info {
        grid-column: 1/3;
    }
}

@media only screen and (max-width: 930px) {
    .btn {
        border-radius: 12px;
    }
    .main-block {
        margin-top: 15px;
    }
    .main-block > h1 {
        margin: 0;
    }
    .right-menu {
        position: absolute;

        top: 0;
        left: -105%;
        background-color: #fff;
        z-index: 1;
    }
    .right-menu.right-menu--open {
        position: fixed;
        width: 100%;
        height: 100vh;
        left: 0;
        top: 96px;
    }
    .right-menu .job-post-form {
        max-width: unset;
        max-height: calc(100vh - 96px);
        overflow-y: auto;
        position: relative;
    }
    .right-menu .job-post-form .btn {
        display: block;
    }
    .btn.btn--add-project,
    .btn.btn--add-news {
        display: flex;
    }
    .newsInner {
        margin-top: 20px;
    }
    .news-filters-wrapper {
        margin-top: 30px;
    }

    .right-pop,
    .right-pop-inner,
    .right-menu .job-post-form,
    .job-post-form {
        max-width: unset;
        padding-bottom: 120px;
    }
    .right-pop .right-pop--close {
        top: 0;
        right: 0;
        transform: none;
    }
    .right-pop .right-pop--close:hover {
        transform: none;
    }
    .left-menu {
        display: none;
    }
    /* .main-3columns {
        grid-template-columns: 1fr max-content;
        grid-template-areas: 'main-block right-menu';
        padding: 0 15px;
    } */
    .main-3columns {
        display: block;
        grid-template-columns: 1fr;
        grid-template-areas: unset;
        padding: 0 15px;
    }
    .recomendation-rate,
    .latest-news {
        margin: 36px 0 15px 0;
    }
    .app-nav {
        display: block;
    }
    .nav-header .nav-logo .nav-logo__small {
        display: block;
        max-width: 100%;
        max-height: 45px;
    }
    .nav-header .nav-logo .nav-logo__large,
    .recomendation-rate,
    .latest-news {
        display: none !important;
    }
    .nav-header .nav-logo {
        margin-right: 40px;
    }

    .nav-header.nav-header--sticky {
        position: sticky;
        top: 0;
    }

    .postedProjects-list {
        padding: 0;
    }
    .my-projects__heading-menu-items {
        margin-top: 25px;
    }
    .settings-grid-item.subscription h5 {
        font-size: 14px;
    }
}

@media only screen and (max-width: 800px) {
    /* .btn.btn--add-news {
        top: 95px;
    } */
    .nav-header .nav-menu-item {
        width: 35px;
        height: 35px;
    }
    .right-menu.right-menu--open {
        top: 85px;
    }
    .nav-menu-item-count {
        top: 0;
        right: 0;
    }

    .chat-block-outer {
        position: relative;
        grid-template-columns: 100%;
    }
    .chat-left {
        max-width: 100%;
        border: none;
    }
    .chat-right {
        position: absolute;
        top: 0;
        right: 100%;
        background-color: #fff;
        z-index: 2;
        border-radius: 15px;
        overflow: hidden;
    }
    .chat-block-outer {
        max-height: unset;
        height: calc(100vh - 215px);
    }
    .chat-msg {
        max-width: 82%;
    }

    .update-popup,
    .modal-error-popup {
        display: block;
    }
       .update-popup > img,
    .modal-error-popup > img{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .update-popup > div, .modal-error-popup > div{
        position: relative;
        z-index: 1;
        background-color: rgba(255, 255, 255, 0.726);
        margin-left: 0;
        min-height: 60vh;
    }
}

@media only screen and (max-width: 750px) {
    #modal-promo .modal-promo-popup > img {
        /* display: none; */
        position: absolute;
        top: 0;
        left: 0;
        max-width: 100%;
        height: 100%;
    }
    #modal-promo .promo-popup-content {
        background-color: rgba(255, 255, 255, 0.938);
        z-index: 1;
    }
    .profile-grid {
        grid-template-columns: unset;
    }
    .register-form .card-info {
        grid-template-columns: 100%;
    }
    #add-payment-method {
        padding: 25px !important;
    }
    .user-info-inner-grid.user-info-inner-grid--3col {
        grid-template-columns: 1fr 1fr;
    }
}

@media only screen and (max-width: 700px) {
    .search-block > form {
        grid-template-columns: 1fr;
    }
    .search-block > form .search-in-recomended__users-selected {
        margin-bottom: 25px;
    }
    .m-top-search-trigger {
        display: flex;
        margin-left: auto;
    }
    .nav-search {
        position: absolute;
        width: 100%;
        padding: 15px 10px;
        background-color: var(--greyscale-1);
        left: 0;
        top: 100%;
        display: none;
    }
    .shapePage-popup {
        min-width: unset;
    }
    .shapePage-popup .a2a_kit {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    .shapePage-popup .share-this-page-copy {
        position: absolute;
        top: 100%;
        transform: none;
    }
    .fav-vendors-head {
        white-space: nowrap;
    }
    .jconfirm.jconfirm-modern .jconfirm-box {
        width: auto !important;
        max-width: 100%;
    }
}

@media only screen and (max-width: 650px) {
    .person-for-recommend-wrapper {
        min-width: unset;
    }
    .person-for-recommend .user-info-grid {
        gap: 15px;
    }
    .person-for-recommend .user-info-grid > a img {
        margin-right: 0;
    }
    .settings-heading {
        margin-bottom: 1em;
    }
    /* .common-link.common-link--delete-acc {
        width: 100%;
        text-align: right;
    } */
    .user-info-inner-grid {
        grid-template-columns: 1fr;
        gap: 10px;
        display: block;
    }
    .settings-grid-item .user-info-inputContainer.user-info-inputContainer--mobile {
        flex-direction: row;
        align-items: center;
    }
    .settings-grid-item .user-info-inputContainer.user-info-inputContainer--mobile .switch {
        margin: 0;
        margin-left: 15px;
    }
    .user-info-inner-grid .user-info-inputContainer,
    .user-info-inner-grid .files-container {
        margin: 0;
        margin-bottom: 10px;
    }
    .settings-grid-item.userInfo .btn {
        padding: 17px 25px;
    }
    .user-info-inner-grid .flex-row {
        flex-direction: column;
    }
    .settings-radios-sub .input-immitation {
        margin-bottom: 10px;
    }
    .settings-radios {
        display: flex;
        align-items: stretch;
        gap: 0;
    }
    .settings-radios .input-immitation {
        width: 100%;
        border-color: var(--accent-color);
        flex: 1;
        height: auto;
        display: flex;
        align-items: center;
    }
    .settings-radios .input-immitation.input-immitation--checked {
        background-color: var(--accent-color);
    }
    .settings-radios .input-immitation.input-immitation--checked {
        display: flex;
        align-items: center;
    }
    .settings-radios .input-immitation.input-immitation--checked label,
    .settings-radios .input-immitation.input-immitation--checked p {
        color: #fff;
    }
    .settings-radios .input-immitation:first-of-type {
        border-radius: 10px 0 0 10px;
    }
    .settings-radios .input-immitation:last-of-type {
        border-radius: 0 10px 10px 0;
    }
    .settings-grid .advantages-list {
        width: 100%;
    }
    .register-step > label,
    .register-form label {
        margin: 0 !important;
        margin-bottom: 15px;
        grid-column: 1 !important;
    }
    .register-form .flex-row {
        gap: 10px;
    }

    .section-inner.register .register-form .register-step.step-2-col {
        grid-template-columns: 100%;
    }
    /* .register-form label {
        grid-column: 1 !important;
    } */
    .register-step .btn {
        width: 100%;
        margin: 20px 0;
    }

    .register-step .input-immitation {
        margin: 0 !important;
    }
    .register-step .subscription-type {
        flex-direction: column;
    }
    .register-step .subscription-type .input-immitation {
        margin-bottom: 15px !important;
    }
    .registration--paymentInfo-container {
        padding: 25px;
    }
}

@media only screen and (max-width: 600px) {
    .home-recomendation-section-jobs .swiper-container .swiper-slide:last-of-type {
        margin-bottom: 0 !important;
    }
    .m-view-all {
        display: block;
    }
    .m-view-all--hide {
        display: none;
    }
    .thumbs-slider.thumbs-slider--4 .swiper-slide,
    .thumbs-slider .swiper-slide {
        grid-template-columns: 100%;
    }
    .thumbs-slider-head,
    .home-recomendation-section-jobs-nav {
        flex-direction: column;
        align-items: flex-start;
    }
    .thumbs-slider-head-nav,
    .home-recomendation-section-jobs-nav-slider {
        height: 50px;
        margin-left: auto;
    }
    .profile-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            'profile-info'
            'profile-protfolio'
            'profile-other';
    }
    .btn.btn--add-project {
        padding: 8px 17px;
    }
    #portfolio-view {
        width: 100%;
        max-width: unset;
        padding: 50px 20px !important;
    }

    .recommended-connections-slider .thumbs-slider-head-nav,
    .recently-joined-slider .thumbs-slider-head-nav {
        display: none;
    }
    .recommended-connections-slider .swiper-slide:nth-child(n + 2),
    .recently-joined-slider .swiper-slide:nth-child(n + 2) {
        display: none;
    }
    .recommended-connections-slider .square-thumb:nth-child(n + 5),
    .recently-joined-slider .square-thumb:nth-child(n + 5) {
        display: none;
    }
}
@media only screen and (max-width: 570px) {
    .my-projects__heading-menu-items .flex-row {
        flex-direction: column;
        flex-wrap: wrap;
        gap: 10px;
    }
    .my-projects__heading-menu-items > form > * {
        width: 100%;
    }
}
@media only screen and (max-width: 550px) {
    .profile-info-avatar {
        margin: 0 auto;
        object-fit: scale-down;
    }
    .profile-info-head .profile-info-avatar img {
        display: block;
        margin: 0 auto 15px auto;
        object-fit: cover;
        border-radius: 50%;
        overflow: hidden;
        width: 50vw;
        height: 50vw;
        max-width: 220px;
        max-height: 220px;
    }

    .profile-info-head,
    .search-connections__search-results,
    .favourite-vendors-list {
        grid-template-columns: 1fr;
    }
    .profile-info-user-info {
        grid-column: 1;
    }

    /* .invite-to-connect > img {
        object-fit: cover;
    } */
    .invite-to-connect-box p {
        display: none;
    }
    .newsInner-item-header-signature {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    .newsInner-item-header-signature .news-prop {
        margin: 0 !important;
    }
    #add-to-portfolio {
        padding: 25px !important;
    }
    #add-to-portfolio .flex-row {
        flex-direction: column;
    }
    #add-to-portfolio .user-info-inputContainer {
        margin: 0;
        margin-bottom: 15px;
    }
}
@media only screen and (max-width: 500px) {
    .person-for-recommend-wrapper {
        padding: 20px !important;
    }
    .person-for-recommend .btn,
    .myConnections-list-item .user-info-grid .btn {
        font-size: 12px;
        padding: 5px 10px;
    }
    .person-for-recommend h4,
    /* .user-info-grid h4 {
        font-size: 14px;
        line-height: 120%;
    } */
    .myConnections__head {
        flex-direction: column;
    }
    /* .user-info-inner-grid .user-info-grid h4 {
        font-size: 16px;
        line-height: 120%;
    } */
    .nav-header {
        grid-template-columns: max-content 1fr 1fr;
    }
    .nav-header .nav-menu {
        justify-content: flex-end;
    }
    .nav-header .nav-menu-item {
        margin: 0 5px;
    }
    .nav-header .nav-logo {
        margin-right: 15px;
    }
    .search-block > form {
        display: block;
    }
    .search-block > form > div {
        margin-bottom: 15px;
    }
    .search-block > form .common-link,
    .search-block > form .btn,
    .right-pop .btn,
    .right-menu .job-post-form .btn:not(.clear-date) {
        width: 100%;
        display: block;
        margin: 20px auto;
        text-align: center;
    }
    .myConnections-actions,
    .myConnections-list {
        width: 100%;
    }
    .myConnections-actions > div {
        display: flex;
        gap: 15px;
        flex-direction: column;
        align-items: flex-start !important;
    }
    /* .fav-vendors-head {
        flex-direction: column-reverse;
        margin-top: 15px;
        gap: 10px;
        white-space: pre-wrap;
    } */
    .my-projects__heading-section,
    .myProjects-item__heading-section {
        flex-direction: column;
    }
    .myProjects-item__heading-menu-items {
        margin-top: 10px;
    }
    .settings-subscription-paymentInfo > .btn {
        display: block;
        margin: 0 auto;
        padding: 10px 20px !important;
    }
    .input-immitation.cc-option .control.control-radio > .flex-row > .flex-row img {
        display: none;
    }
    .news-filters {
        /* flex-direction: column; */
        gap: 10px;
        width: 100%;
        margin-top: 15px;
    }
    .news-filters .btn {
        margin-left: auto;
        margin-right: 5px;
    }
    .news-filters .select2 {
        width: 100% !important;
        min-width: 0;
        margin: 0;
        margin-bottom: 10px;
    }

    .newsTab-item {
        flex-direction: column;
        max-height: unset;
        /* padding: 0; */
        overflow: hidden;
    }
    .newsTab-item--preview {
        width: 100%;
        height: 50vw;
        margin: 0;
        margin-bottom: 15px;
    }
    .newsTab-item--preview img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .newsTab-item--signature {
        white-space: nowrap;
        flex-wrap: wrap;
    }
    .profile-info-avatar > p {
        text-align: center;
    }
    .profile-info-avatar > p > a {
        display: block;
        margin: 0px auto 10px auto;
    }
    .beta-note__container, .membership-message__container{
        padding: 17px 100px 17px 15px;
    }
}

@media only screen and (max-width: 450px) {
    .profile-info-user-info-grid {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .profile-info-label {
        margin-top: 10px;
    }
    .myConnections-list-view > div:first-of-type {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .input-immitation.cc-option .control.control-radio > .flex-row > .flex-row {
        display: none;
    }
    .card-info.card-billing .flex-row {
        flex-wrap: wrap;
        gap: 10px;
    }
    #add-payment-method {
        width: 100%;
    }
    #add-payment-method label {
        width: 100%;
        margin: 0 !important;
        max-width: unset !important;
    }
    #add-payment-method .flex-row {
        gap: 10px;
    }
    .payment-method-form-title ~ img {
        display: none;
    }

    #add-to-portfolio .btn {
        padding: 15px 40px;
    }
}

@media only screen and (max-width: 420px) {
    .settings-grid-item.userInfo .btn {
        padding: 15px;
    }
}

@media only screen and (max-width: 400px) {
    .row-thumb .row-thumb-user > a {
        margin: 0 auto;
    }
    .row-thumb {
        flex-direction: column;
    }
}
@media only screen and (max-width: 380px) {
    .nav-header__inner {
        grid-template-columns: max-content 1fr minmax(100px, max-content);
    }
    .nav-header .nav-menu-item {
        width: 25px;
        height: 25px;
    }
}