/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

.modal.window{
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 30px;
}

.modal a.close-modal{
    right: -5.5px;
    top: -5.5px;
}

.form{
    color: var(--orange-color);
    display: -ms-grid;
    display: grid;
    font-size: 1.5rem;
    font-weight: 600;
    gap: 10px;
    letter-spacing: 0.15rem;
    margin: 27px 0px;
    text-transform: uppercase;
}

.contact-input{
    -webkit-box-shadow: inset 0 0 0px 9999px var(--grey-color);
    background: #f1f1f1;
    border-radius: 10px;
    border: none;
    color: gray;
    font-weight: 600;
    height: 47px;
    letter-spacing: 0.05rem;
    outline: none;
    padding: 10px;
}

.contact-message{
    background: #f1f1f1;
    border-radius: 10px;
    border: none;
    color: gray;
    font-family: sans-serif;
    font-weight: 600;
    height: 100%;
    letter-spacing: 0.05rem;
    max-height: 280px;
    outline: none;
    padding: 10px;
    resize: vertical;
}

.contact-btn{
    background-color: var(--primary-color);
    border-radius: 10px;
    color: var(--secondary-color);
    cursor: pointer;
    font-weight: 600;
    height: 47px;
    letter-spacing: 0.1rem;
    text-align: center;
    text-transform: uppercase;
    width: 50%;
}

.contact-container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
}

@media screen and (max-width: 650px) {
    .modal.window{
        max-width: none;
        width: 100%;
    }

    .jquery-modal.blocker.current{
        padding: 10px;
        z-index: 50;
    }
}