﻿.popup {
    position: fixed;
    background-color: white;
    width: 420px;
    height: 450px;
    padding: 20px 30px;
    transform: translate(-50%,-50%);
    left: 50%;
    top: 50%;
    border-radius: 8px;
    z-index: 25;
}

    .popup button {
        display: block;
        margin: 0 0 20px auto;
        background-color: transparent;
        font-size: 30px;
        color: rgb(71, 71, 53);
        border: none;
        outline: none;
        cursor: pointer;
    }

    .popup a {
        display: block;
        width: 150px;
        position: relative;
        margin: auto;
        text-align: center;
        background-color: black;
        color: white;
        text-decoration: none;
        padding: 5px 0;
    }

    .popup img {
        width: 350px;
    }

    .popup h3 {
        color: red;
    }
@media only screen and (max-width: 600px) {
    .popup {
        position: fixed;
        background-color: white;
        width: 250px;
        height: 325px;
        padding: 10px 15px;
        transform: translate(-50%,-50%);
        left: 50%;
        top: 50%;
        border-radius: 8px;
        z-index: 25;
    }
        .popup img {
            width: 220px;
        }
}
@media only screen and (max-height: 600px) {
    .popup {
        position: fixed;
        background-color: white;
        width: 250px;
        height: 325px;
        padding: 10px 15px;
        transform: translate(-50%,-50%);
        left: 50%;
        top: 50%;
        border-radius: 8px;
        z-index: 2000;
    }

        .popup img {
            width: 220px;
        }
}