/* ===

Theme Name: SLE
Version: 1.2.0
Description: The Template is created for TemplateMonster
Author: Koval Web

*=== */
.contacts-items-large .ci-list {
    font-weight: bold;
    font-size: 1.25rem;
}

.ci-heading {
    text-transform: uppercase;
    opacity: 0.6;
    font-weight: 700;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
}

.ci-list li a {
    display: inline-flex;
    line-height: 1.75rem;
    text-decoration: none;
    color: var(--text);
}

.ci-list li a:hover {
    color: var(--accent);
}

.contact-form {
    margin-top: 1rem;
}

.contact-form-m0 {
    margin: 0;
}

.map-outer {
    position: relative;
    margin-top: 3rem;
}

.map-outer .text-circle {
    position: absolute;
    right: 50%;
    top: -4rem;
    height: 8rem;
    width: 8rem;
    margin-right: -4rem;
    z-index: 2;
}

.map {
    position: relative;
    height: 400px;
}

.map::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--text);
    opacity: 0.05;
}

.map iframe {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    filter: grayscale(100%);
}

.contacts-arrows-decor {
    display: flex;
    justify-content: center;
}

.contacts-arrows-decor svg {
    display: block;
    height: 27.75rem;
}

.contact-btn-left {
    margin: 1rem auto 0;
}

.contacts-social-links {
    display: flex;
    justify-content: center;
    margin-top: 2.5rem;
}

.form-success-hidden.visible {
    display: none;
}

.form-success-visible {
    display: none;
}

.form-success-visible.hidden {
    display: block;
}

@media (min-width: 480px) {
    .map-outer {
        margin-top: 5rem;
    }

    .contacts-social-links {
        display: block;
        margin-top: 0;
    }
}

@media (min-width: 768px) {
    .map {
        height: 500px;
    }

    .contact-btn-left {
        margin: 0 auto 0;
    }

    .contacts-items-large {
        margin-top: 2rem;
    }

    .contacts-text-circle {
        margin-bottom: 5rem;
    }
}

@media (min-width: 1024px) {
    .contacts-items-center {
        display: flex;
        justify-content: center;
    }
}