:root {
    --primary-color: #eceae1;
    --secondary-color: #c18775;
    --secondary-color-rgb: rgb(193, 135, 117);
    --secondary-color-shade: #CD9F91;
    --secondary-color-shade-rgb: rgb(205, 159, 145);
    --tertiary-color: #000;


    /*--secondary-color: #607582;
    --secondary-color-rgb: rgb(96, 117, 130);*/

    --font-family: 'Montserrat', sans-serif;
    --font-family-title: 'Playfair Display', sans-serif;
    --font-color: #000;

    --section-blog: #b7b8a6;
    --section-contrast-blog: #7b847f;

    --section-one: #ebe8df;
    --section-two: #e0dace;
    --section-contrast-1: #5f7582;
    --section-contrast-2: #c18674;


}

h1, h2, h3, h4, h6 {
    text-transform: uppercase;
    letter-spacing: 3px;
}

b, strong {
    font-weight: 500;
}
.link-hover {
    position: relative;
    color: rgba(0,0,0, .85);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
}

.link-hover::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    left: 0;
    bottom: -2px;
    background-color: currentColor;
    transition: width 0.3s ease;
}

.link-hover:hover {
    color: var(--font-color);
}

.link-hover:hover::after {
    width: 100%;
}
a:visited, a:link, .art-postcontent a:visited, .art-postcontent a.visited, a:visited, a.visited {
    color: var(--font-color);
}

.art-footer a:visited {
}

.art-footer {
    margin-top: 150px;
}
.art-footer h3 {
     font-family: var(--font-family-title), serif;
    color: var(--font-color);
    margin-top: 2rem;
}

body#art-main, .art-sheet, .after-sheet, .before-sheet, .kw-custom-container, .art-footer {
    background-color: var(--primary-color);
}

.left-side-menu-container, .right-side-menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer .left-side-menu-container, .footer .right-side-menu-container {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.art-modulo-informazioni .art-social-company-list {
    display: flex;
    gap: 1rem;
    min-width: 230px;

    .art-social-company-item {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px;
        border: 1px solid var(--tertiary-color);
        border-radius: 50%;
        width: 45px;
        height: 45px;
        margin: 0;
        transition: all .3s ease;
        color: var(--font-color);

        &:hover {
            color: var(--secondary-color);
            border-color: var(--secondary-color);
        }
    }
}
.footer .art-modulo-informazioni .art-social-company-list, .mobile-menu .art-modulo-informazioni .art-social-company-list {
    justify-content: flex-end;
}

.footer .navbar-expand-md .navbar-collapse {
    align-items: flex-start;
}

.btn, .art-postcontent a:visited, .art-postcontent a.visited, a:visited, a.visited {
    font-family: var(--font-family-title), serif !important;
    padding: .75rem 2rem;

    &.btn-bd-primary, &.btn-primary, &.btn-outline-primary {
        --bs-btn-font-weight: 600;
        --bs-btn-color: var(--font-color);
        --bs-btn-bg: var(--secondary-color-shade);
        --bs-btn-border-color: var(--secondary-color-shade);
        --bs-btn-hover-color: var(--font-color);
        --bs-btn-hover-bg: var(--secondary-color);
        --bs-btn-visited-color: rgba(0, 0, 0, 1);
        --bs-btn-hover-border-color: var(--secondary-color);
    }

    &.btn-bd-secondary {

        --secondary-color-shade: #81635a;
        --secondary-color-shade-rgb: rgb(129, 99, 90);
        --bs-btn-font-weight: 600;
        --bs-btn-color: #000;
        --bs-btn-bg: transparent;
        --bs-btn-border-color: var(--secondary-color-shade);
        --bs-btn-hover-color: var(--font-color);
        --bs-btn-hover-bg: var(--secondary-color);
        --bs-btn-visited-color: var(--secondary-color-shade);
        --bs-btn-hover-border-color: var(--secondary-color);
    }

    &.btn-link {
        --bs-btn-color: rgba(0, 0, 0, 0.7);
        --bs-btn-bg: transparent;
        --bs-btn-border-color: transparent;
        --bs-btn-hover-color: rgba(0, 0, 0, 1);
        --bs-btn-hover-bg: transparent;
        --bs-btn-hover-border-color: transparent;
        --bs-btn-active-color: rgba(0, 0, 0, 1);
        --bs-btn-visited-color: rgba(0, 0, 0, 1);
        font-size: 28px;
    }
}

.before-sheet .kw-custom-container-col {
    min-height: 100px;
}

.kw-custom-container .section-background, .section-background {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    min-height: 800px;
}

/* CITAZIONE HOMEPAGE */
.window-image-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.window-image {
    background-size: cover !important;
    background-position: top center !important;
    background-repeat: no-repeat !important;
    height: 600px;
    width: 600px;
    border-radius: 50% 50% 13px 13px;
    background-image: url(../../../images/chi-siamo/debora-fiore-seduta-in-camicia-bianca.jpg);
}
.debora {
    margin: 10px 0 10px 2rem;
    background-image: url(../../../images/homepage/debora-fiore-in-giacca-verde.jpg);
}
.window-text-container {
    position: absolute;
    width: 60%;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem 1.5rem;
    border-radius: 13px;
    /*background: var(--secondary-color);*/
    background: #607582;
    .window-text h4 {
        color: var(--font-color);
        font-size: 1.5rem;
        font-family: var(--font-family-title), serif;
    }
    .window-cit p {
        color: var(--font-color);
    }
}


.kw-latest-news {
    padding: 150px 0;
}

.card-image {
    aspect-ratio: 16/9;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    &.horizontal {
        height: 100%;
        width: 400px;
    }
}

.card-image-absolute {
    position: relative;
    width: 100%;
    max-height: 230px;
    overflow: hidden;
    aspect-ratio: 16/9;
    img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

}

h5.card-title, a.back-to-top-link {
    color: var(--font-color);
}

.published time {
    font-weight: 500;
    font-size: 14px;
    color: var(--font-color);
}

.item-content {
    transition: all 0.15s ease-in-out;

    &:hover {
        transform: scale(1.01);
    }
}

.navbar-footer-container ul.art-hmenu.mod-menu {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    .footer-item a {
        color: var(--font-color);
        padding: 0;
        height: 55px;
        font-family: var(--font-family), serif;
    }
}

.container-header .navbar-brand {
    padding: 1rem;
    width: 136px;
}

.art-article:not(.blog-category) {
    margin-top: 150px;
    margin-bottom: 150px;
}

.art-article.blog-category {
    padding-top: 150px;
    padding-bottom: 150px;
}

.blockquote {
    margin-left: 35px;
    border-left: 5px solid var(--secondary-color);
    padding-left: 15px;
    font-size: 1.2rem;
    font-style: italic;
    color: var(--font-color);
}
.blockquote-footer {
    margin-left: 3.5rem;
}

.accordion {

}

.in-page-menu {
    display: grid;
    grid-template-columns: repeat(3, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}

/* Extra extra large devices (<1400px) */
@media (max-width: 1399.98px) {

}

/* Extra large devices (max-width 1199.98px) */
@media (max-width: 1199.98px) {

}


/* Large devices (max-width 991.98px): Desktops */
@media (max-width: 991.98px) {
    .container-header .navbar-brand {
        padding: 10px;
        width: 65px;
        height: 65px;
    }
    .navbar .mobile-menu.show {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: nowrap;
        .art-hmenu {
            justify-content: flex-start;
        }
        .metismenu-item a {
            color: var(--font-color);
            padding: 0;
            height: 55px;
        }
    }
    .window-image-container {
        display: flex;
        justify-content: center;
        flex-direction: column;
    }
    .window-image {
        background-size: cover;
        background-repeat: no-repeat;
        height: 400px;
        width: 100%;
        border-radius: 50% 50% 13px 13px;
        z-index: 1;
        top: -170px;
        &.debora {
            margin: 1rem 0;
        }
    }
    .window-text-container {
        position: relative;
        width: 100%;
        right: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        padding: 2rem 1.5rem;
        border-radius: 13px;
        /* top: 80%; */
    }
    .footer {
        padding: 1rem;
        .art-modulo-informazioni .art-social-company-list {
            justify-content: flex-start;
        }
    }
}

/* Medium devices (max-width 767.98px): Tablets */
@media (max-width: 767.98px) {
    .in-page-menu, .grid-3 {
        grid-template-columns: repeat(1, minmax(200px, 1fr));

    }
}


/* Small devices (max-width 575.98px): Mobile portrait */
@media (max-width: 575.98px) {
    .link-hover {
        text-wrap: auto;
        text-align: left;
    }

}
