:root {
    --red-color: #E9212F;
}

.mm-form .mediamintForm-input-wrapper
{
    position: relative;
    margin-bottom: 11px;
}

.mm-form .form-input
{
    width: 100%;
    padding: 15px 20px;

    border: 1px solid rgba(0, 0, 0, 0.24);
    border-radius: 2px;

    color: #000;

    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;

    outline: none;

    transition: color .4s, border .4s, box-shadow .4s;

    position: relative;
    z-index: 2;
}
.mm-form .form-input:placeholder-shown
{
    color: #6F6F6F;
}

/*.mm_landing-wrapper .form-elem .form-input:last-child*/
/*{*/
/*	margin-bottom: 0;*/
/*}*/

.mm-form .form-input.invalid
{
    border: 1px solid var(--red-color);
    color: var(--red-color);
    box-shadow: 0 0 4px 2px rgba(255, 0, 0, 0.25);
}
.mm-form .form-input.valid
{
    border: 1px solid rgba(0, 0, 0, 0.24);
    color: #000;
    box-shadow: unset;
}

.mm-form .mediamintForm-input-invalid-message
{
    position: absolute;
    z-index: 5;
    top: 50%;
    transform: translateY(-50%);
    right: calc(100% + 30px);

    white-space: nowrap;
    padding: 10px 23px;
    border-radius: 2px;

    background-color: var(--red-color);
    color: #fff;

    user-select: none;

    opacity: 0;
    transition: opacity .4s;
}
@media screen and (max-width: 768px)
{
    .mm-form .mediamintForm-input-invalid-message
    {
        right: unset;
        left: 0;
        padding: 0;
        color: var(--red-color);
        background-color: transparent;
        top: -12px;

        transform: translateY(20px);
        z-index: 0;

        transition: opacity .3s, transform .3s;
    }
}
@media screen and (max-width: 650px)
{
    .mm-form .mediamintForm-input-invalid-message
    {
        display: none;
    }
}

.mm-form .mediamintForm-input-invalid-message::after
{
    content: "";
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    right: -17px;

    background-color: var(--red-color);
    clip-path: polygon(100% 50%, 0 0, 0 100%);

    width: 17px;
    height: 22px;

    will-change: right;
}
@media screen and (max-width: 768px)
{
    .mm-form .mediamintForm-input-invalid-message::after
    {
        display: none;
    }
}

.mm-form .form-input.invalid + .mediamintForm-input-invalid-message
{
    opacity: 1;
}
@media screen and (max-width: 768px)
{
    .mm-form .form-input.invalid + .mediamintForm-input-invalid-message
    {
        opacity: 1;
        transform: translateY(-12px);
    }
}

.mm-form textarea
{
    border: 1px solid rgba(0, 0, 0, 0.24);

    color: #000;

    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
}
.mm-form textarea:placeholder-shown
{
    color: #6F6F6F;
}

.mm-form .input-check:not(:checked)
{
    background-color: var(--red-color);
}

.mm-form .input-check + span
{
    transition: color .5s;
}

.mm-form .input-check:not(:checked) + span
{
    color: var(--red-color);
}