﻿/* modal*/

.popup-modal {
    position: fixed;
    bottom: 2%;
    background: #fff;
    height: auto;
    width: fit-content;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    border-radius: 5px;
    box-shadow: 1px 1px 5px #444;
    border: solid 3px #1f5014;
    padding: 25px;
}

.popup-modal-inner {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

    .popup-modal-inner #close-img {
        z-index: 11;
        cursor: pointer;
        height: 20px;
        width: 20px;
    }

    .popup-modal-inner .popup-modal-text {
        color: #000;
        font-size: 22px;
        margin-bottom: 1rem;
    }

        .popup-modal-inner .popup-modal-text p {
            font-size: 16px;
        }

        .popup-modal-inner .popup-modal-text ul>li {
            font-size: 16px;
        }

    .popup-modal-inner .popup-modal-column {
        flex-direction: column;
        padding: 0 2rem;
    }

.map-image{
    height: 300px;
    width: auto;
}

@media only screen and (max-width: 458px) {
    .popup-modal {
        left: 0;
        height: 33rem !important; /* not taking the mobile height, inheriting 1100px */
        z-index: 999;
    }

    .popup-modal-inner .popup-modal-column {
        flex-direction: column;
        padding: 0 1rem;
    }

    .popup-modal-inner .popup-modal-text {
        font-size: 1rem;
    }

    .popup-modal-inner .hide-mobile {
        display: none;
    }
}

@media only screen and (max-width: 1281px) {
    .popup-modal {
        left: 50%;
        height: 33rem;
        z-index: 99999;
    }
    .popup-modal-inner .popup-modal-text {
        color: #000;
        font-size: 22px;
        margin-bottom: 1rem;
    }
        .popup-modal-inner .popup-modal-text h3 {
            font-size: 12px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text p {
            font-size: 8px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text ul > li {
            font-size: 10px;
        }

    .row{
        margin: 0;
    }

    .map-image{
        height: 15rem;
    }
}

@media only screen and (max-width: 1544px) {
    .popup-modal {
        left: 50%;
        height: 33rem;
        z-index: 99999;
    }

    .popup-modal-inner .popup-modal-text {
        color: #000;
        font-size: 22px;
        margin-bottom: 1rem;
    }

        .popup-modal-inner .popup-modal-text h3 {
            font-size: 12px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text p {
            font-size: 8px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text ul > li {
            font-size: 10px;
        }

    .row {
        margin: 0;
    }

    .map-image {
        height: 15rem;
    }
}

@media only screen and (max-width: 1100px) {
    .popup-modal {
        left: 50%;
        height: 28rem;
        z-index: 99999;
    }

    .popup-modal-inner .popup-modal-text {
        color: #000;
        font-size: 22px;
        margin-bottom: 1rem;
    }

        .popup-modal-inner .popup-modal-text h3 {
            font-size: 12px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text p {
            font-size: 8px;
            margin: 0;
        }

        .popup-modal-inner .popup-modal-text ul > li {
            font-size: 10px;
        }

    .row {
        margin: 0;
    }

    .map-image {
        height: 10rem;
    }
}