﻿@media only screen and (max-width: 1200px) {
}


@media only screen and (max-width: 750px) {

    body .content {
        max-width: 90%;
    }

    header {
        display: none;
    }


    .mobileMenu {
        display: block !important;
    }

        .mobileMenu .headMenu {
            display: flex;
            width: 100vw;
            border-bottom: 2px solid #81247B;
            align-items: center;
            padding: 0 20px;
            justify-content: space-around;
        }

            .mobileMenu .headMenu img {
                width: calc(100% - 30px);
            }

            .mobileMenu .headMenu i {
                font-size: 30px;
                margin-right: 20px;
                color: #81247B;
            }

        .mobileMenu .mobileSubMenu {
            position: fixed;
            top: 0;
            right: 0;
            left: 0;
            bottom: 0;
            opacity: 0;
            transform: translateY(-20px);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            z-index: 100000000;
            background-color: #ffffffde;
            transition: opacity 0.4s ease, transform 0.4s ease;
            pointer-events: none;
        }

            .mobileMenu .mobileSubMenu.show {
                opacity: 1;
                transform: translateY(0);
                pointer-events: auto;
            }

            .mobileMenu .mobileSubMenu a {
                width: 60%;
                text-align: center;
                line-height: 35px;
                margin-bottom: 5px;
                background-color: var(--yellow-color);
                color: var(--purple-color-200);
                font-weight: 600;
            }

            .mobileMenu .mobileSubMenu button {
                border: none;
                font-size: 30px;
                position: absolute;
                top: 15px;
                right: 15px;
                background-color: unset;
                color: var(--purple-color-200);
            }

    body .home .slider {
        padding: 50px 0;
    }

        body .home .slider img {
            width: 100%;
            margin: 0 auto;
        }

        body .home .slider .curver-slider {
            display: none;
        }

    body .home .plans img {
        width: 100%;
        margin: 0 auto;
    }

    body .home .unforgettable .content h2 {
        font-size: 25px;
    }


    body .home .unforgettable .passthrough {
        display: flex;
        flex-direction: column;
    }

        body .home .unforgettable .passthrough > div:first-child,
        body .home .unforgettable .passthrough > div:last-child {
            width: 100%;
            padding: 10px;
        }

        body .home .unforgettable .passthrough > div p {
            font-size: 14px;
            line-height: 25px;
        }


    body .home .pkg-item {
        display: flex;
        flex-direction: column;
    }

        body .home .pkg-item .col:first-child,
        body .home .pkg-item .col:last-child {
            width: 100%;
            padding: 10px;
            flex: none;
        }

            body .home .pkg-item .col:last-child h2 {
                font-size: 22px;
            }

            body .home .pkg-item .col:first-child .pkg {
                box-shadow: none !important;
                margin-top: 20px;
            }

    body .home .cancellation-policy .content {
        padding: 20px 20px;
        max-width: 90%;
        box-shadow: none;
    }


    body .home .plans .curver-slider {
        display: none;
    }


    body .home .plans .plan-items .items {
        display: flex;
        flex-wrap: wrap;
        margin: 5px;
        flex-direction: column;
    }

        body .home .plans .plan-items .items .plan-item {
            width: 100%;
        }


    body .footer .content .col:last-child {
        display: flex;
        flex-direction: column;
    }

        body .footer .content .col:last-child > div {
            width: 100%;
        }

    body .footer .row .col:first-child {
        display: none;
    }



    .contactus {
        margin: 30px 0;
        padding: 0;
    }

        .contactus .getintouch {
            max-width: 90%;
        }

            .contactus .getintouch .row {
                display: flex;
                flex-direction: column;
            }

                .contactus .getintouch .row.checkbox .col {
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                }

    contactus .getintouch .attention .col {
        display: flex;
        flex-direction: column;
    }
}
