@media (min-width: 1366px) and (max-width: 1700px) {
    /* Styles */
    .styles .item .item-title {
        bottom: 75px;
    }

    .separator {
        height: 140px;
    }

    .modal {
        padding-top: 0;
    }
}

@media (max-width: 1400px) {
    .styles .item .item-title {
        bottom: 125px;
    }

    .welcome-title {
        font-size: 60px;
    }
}

@media (max-width: 920px) {
    /* General */
    .section-beginning {
        display: grid;
    }

    .section-text {
        gap: 10px;
    }

    .section-title {
        font-size: 25px;
    }

    .section-message {
        font-size: 19px;
        margin-bottom: 15px;
    }

    .page-beginning {
        display: grid;
        place-items: center;
        justify-content: unset;
    }

    .page-text {
        text-align: center;
        gap: 10px;
    }

    .page-title {
        font-size: 25px;
    }

    .page-message {
        font-size: 19px;
        margin-bottom: 15px;
    }

    .tattoo-greeting-text {
        gap: 15px;
        margin-top: 15px;
    }

    .tattoo-greeting-title {
        font-size: 23px;
    }

    .modal {
        padding-top: 10px;
    }

    .separator {
        height: 30px;
    }

    .styles .item .item-title {
        bottom: 50px;
    }

    .tattoo-button {
        width: 100%;
    }

    /* Navigation */
    .navigation {
        display: none;
    }

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

    /* Welcome */
    .welcome {
        padding-top: 120px;
        position: relative;
    }

    .welcome-text {
        height: auto;
        gap: 15px;
    }

    .welcome-title {
        font-size: 30px;
    }

    .welcome-message,
    .welcome-subtitle {
        font-size: 17px;
    }

    .tattoo-button {
        font-size: 14px;
    }

    .welcome .tattoo-button {
        position: absolute;
        bottom: 75px;
        width: 95%;
    }

    .video-presentation {
        margin-top: 20px;
        margin-bottom: 110px;
    }

    .video-presentaiton-block {
        position: unset;
    }

    /* Specialists */

    .specialist {
        margin-bottom: 30px;
    }

    .specialist-card img {
        height: auto;
    }

    /* Promotions */

    .promotion-card {
        overflow: hidden;
    }

    /* Footer */
    .footer .container {
        display: grid;
    }

    .footer-links {
        display: grid;
        justify-content: unset;
        place-items: center;
        gap: 25px;
    }

    .footer-action {
        text-align: center;
    }

    .footer-logo {
        display: flex;
        justify-content: center;
    }

    /* Credentials */
    .credentials .container {
        display: grid;
        place-items: center;
        justify-content: unset;
        gap: 20px;
    }

    .item-text {
        padding: 20px 70px;
    }

    .contacts-information {
        flex-direction: column;
        gap: 17px;
        align-items: start;
    }

    .contact-block img {
        height: 100%;
        width: 50px;
        object-fit: contain;
    }

    .worker-information {
        margin-top: 30px;
    }

    .worker-action {
        margin-bottom: 20px;
    }

    .tattoo-modal-dialog .modal-content {
        height: 430px;
    }

    .worker-video {
        height: 620px;
    }

    .worker-container {
        height: 510px;
    }

    .tattoo-collapse-header {
        font-size: 20px;
        text-transform: uppercase;
    }

    .tattoo-collapse-body {
        font-size: 16px;
    }

    .portfoliu-card {
        width: 100%;
    }

    .worker-page .row {
        justify-content: center;
    }

    .worker-actions {
        justify-content: center;
    }

    .tattoo-greeting-text {
        padding-left: 10px;
    }

    .tattoo-modal-dialog .tattoo-button {
        width: 90%;
    }

    .price-modal {
        max-width: 400px !important;
    }

    .price-modal .modal-content {
        width: 100%;
    }

    .video-presentation-btn img {
        width: 135px;
        height: 135px;
    }

    .video-presentation-btn svg {
        width: 205px;
        height: 205px;
        top: -3px;
        left: -3px;
    }

    /*  BLOG PAGE  */
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 15px;
    }
}

@media (min-width: 768px) and (max-width: 920px) {
    .offcanvas {
        width: 40% !important;
    }

    .offcanvas-body .navigation-language {
        padding-right: 43px;
    }

    .styles .item .item-title {
        bottom: 45px;
    }

    .specialist-name {
        bottom: 27px;
        font-size: 21px;
    }

    .specialist .tattoo-button {
        width: 100%;
    }

    .specialists .col-md-4 {
        width: 49.33%;
    }

    .item-text {
        padding: 45px 20px;
    }

    .footer .container {
        display: flex;
    }

    .footer-links {
        display: flex;
    }

    .footer-action {
        font-size: 13px;
        text-align: start;
    }

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

    .video-presentaiton-block {
        position: absolute;
        top: 60px;
        right: 30px;
    }

    .welcome {
        height: 50vh;
        padding-top: 0;
    }

    .welcome .tattoo-button {
        position: absolute;
        bottom: 80px;
    }

    .promotions-page .promotion-text {
        left: 24px;
        bottom: 30px;
    }

    .porfoliu-page .col-md-3 {
        width: 49%;
    }

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

    .section-text {
        text-align: start;
        gap: 10px;
    }

    .page-beginning {
        display: flex;
        align-items: start;
        justify-content: start;
    }

    .page-text {
        text-align: start;
        margin-left: 13px;
    }

    .tattoo-greeting-title {
        text-align: start;
    }

    .tattoo-greeting-message {
        padding: 0;
    }

    .contacts-information {
        flex-direction: row;
        gap: 10px;
    }

    .contact-block {
        gap: 5px;
    }

    .contact-block a {
        font-size: 16px;
    }

    .worker-container {
        height: 470px;
    }

    .worker-picture img {
        height: 600px;
        object-fit: cover;
    }

    .worker-name {
        font-size: 25px;
    }

    .worker-specialist-img-block {
        width: 50% !important;
    }

    .worker-specialist-info-block {
        width: 50% !important;
    }

    .tattoo-button-modal {
        position: unset !important;
        bottom: 0 !important;
        width: 100% !important;
    }

    .promotion .col-md-6 {
        width: 100%;
    }

    .page-template-tattoo .col-md-6 {
        width: 100%;
    }

    .tattoo-greeting-img img {
        height: 450px;
        width: 100%;
        object-fit: cover;
    }

    .tattoo-greeting-text {
        padding-left: 30px;
    }

    .worker-actions {
        justify-content: center;
        gap: 20px;
        flex-wrap: nowrap;
    }

    .portfoliu-card {
        width: 33% !important;
    }
}

@media(max-width: 500px) {
    /*  BLOG PAGE  */
    .blog-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .blog-detail-image img {
        height: 250px;
    }
}