/* ****************************************
Footer style file.
All instructions related to the footer.
**************************************** */

/*
WPML plugin.
Hide notification message about developpement version of WPML.
*/
.otgs-development-site-front-end {
    display: none !important;
  }

/*
    Footer.
*/
footer {
    padding-top: var(--mobile-global-static-gap-lg);
    padding-left: var(--mobile-global-static-gap-md);
    padding-right: var(--mobile-global-static-gap-md);
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        footer {
            padding-top: var(--desktop-global-responsive-gap-md); /* Rewrite */
            padding-left: var(--desktop-global-responsive-gap-md); /* Rewrite */
            padding-right: var(--desktop-global-responsive-gap-md); /* Rewrite */
        }
    }

/*
    Main footer container.
*/
/* Container */
.footer_main {
    padding-bottom: var(--mobile-global-static-gap-lg)
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        /* Container */
        .footer_main {
            display:flex;
            padding-bottom:var(--desktop-global-responsive-gap-md) /* Rewrite */
        }
    }

/*
    Main column start.
*/
/* First main column */
/* Notes: Something is under something in the widget area.
          So let the user switch the order of the widget and the spacing will remain. */

/* First level anything first child + anything */
.footer_main-start > *:first-child + * {
    margin-top: var(--mobile-global-static-gap-lg);
}

/* Main level anything + anything */
.footer_main-start > * + * {
    margin-top: var(--mobile-global-static-gap-md);
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        /* Flex on desktop */
        .footer_main-start {
            flex:0 1 32%;
        }
    }

/*
    Main column start -> image widget.
*/
/* Any image must be... */
.footer_main-start img {
    max-width: 10rem;
    height: auto;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_main-start img {
            max-width: 85%; /* Rewrite */
        }
    }
        /* XL responsive */
        @media (min-width: 1200px)
        {
            .footer_main-start img {
                max-width: calc(6rem + 10vw); /* Rewrite */
            }
        }

/*
    Widget -> Links
*/
.footer_main .widget_links {
    width: 100%;
}

.footer_main .widget_links li:not(:last-child) {
    margin-bottom: 0.8rem;
}

.footer_main .widget_links li a {
    display: inline-flex;
    font-weight: 700;
    align-items: center;
    transition: color 100ms linear;
}

.footer_main .widget_links li a:hover {
    color: var(--color-gray-light);
}

.footer_main .widget_links li a.uppercase {
    text-transform: uppercase;
}

.footer_main .widget_links li a svg {
    fill: var(--base-color);
    width: 0.75rem;
    margin-left: 0.5rem;
    transition: margin-left 100ms linear;
    margin-bottom: 0.15rem
}
    /* MD responsive */
    @media (min-width: 768px) {
        .footer_main .widget_links li a svg {
            width: calc(0.65rem + 0.24vw); /* Rewrite */
            margin-left: calc(0.5rem + 1vw); /* Rewrite */
        }
    }

.footer_main .widget_links li a:hover svg {
    fill: var(--color-gray-light);
    margin-left: 1em;
}
    /* MD responsive */
    @media (min-width: 768px) {
        .footer_main .widget_links li a:hover svg {
            margin-left: 2em; /* Rewrite */
        }
    }

/*
    Main column end.
*/
.footer_main-end {
    margin-top: var(--mobile-global-static-gap-lg);
}
    /* SM responsive */
    @media (min-width: 576px) {
        .footer_main-end {
            flex:0 1 100%;
            display:flex;
            flex-wrap: wrap;
        }
    }
        /* MD responsive */
        @media (min-width: 768px) {
            .footer_main-end {
                margin-top: unset; /* Rewrite */
            }
        }

/*
    Main column end -> Sub div only.
*/
/* SM responsive */
@media (min-width: 576px) {
    /* Sub start/end row */
    .footer_sub-start,
    .footer_sub-end {
        flex: 0 1 100%;
        display: flex;
    }

    /* Sub end row */
    .footer_sub-end {
        align-content: flex-start;
        flex-wrap: wrap;
    }
}
    /* XL responsive */
    @media (min-width: 1200px)
    {
        .footer_sub-start,
        .footer_sub-end {
            flex:0 1 50%;
        }

        .footer_sub-start {
            padding-right: var(--desktop-global-static-gap-sm);
        }

        .footer_sub-end {
            padding-left: var(--desktop-global-static-gap-sm);
        }
    }

/*
    Sub sub column
*/
.footer_sub-sub {
    flex: 0 1 50%;
    margin-bottom: var(--mobile-global-static-gap-lg);
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_sub-sub:first-child {
            padding-right: var(--desktop-global-static-gap-sm);
        }
        
        .footer_sub-sub:last-child {
            padding-left: var(--desktop-global-static-gap-sm);
        }
    }

/*
    Main column end -> Sub div title.
*/
.footer_sub-title {
    font-family: 'Acumin Bold';
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: var(--mobile-global-static-gap-md);
    border-bottom: 1px solid var(--color-gray-light);
    padding-bottom: 1rem;
}

.footer_sub-end > .footer_sub-title {
    flex: 0 1 100%;
}

/*
    Main column end -> Sub div.
*/
/* SM responsive */
@media (min-width: 576px)
{
    /* Sub end sub start/end row */
    .footer_sub-end_sub-start,
    .footer_sub-end_sub-end {
        flex: 0 1 50%;
    }
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_sub-end_sub-start {
            padding-right: var(--desktop-global-static-gap-sm);
        }

        .footer_sub-end_sub-end {
            padding-left: var(--desktop-global-static-gap-sm);
        }
    }

/*
    Footer Social.
*/
.footer_social {
    margin-top: var(--mobile-global-static-gap-lg);
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_social {
            margin-top: var(--desktop-global-responsive-gap-md);
        }
    }

/*
    Footer copyright.
*/
/* Container */
.footer_copyright {
    padding-top: var(--mobile-global-static-gap-md);
    padding-bottom: var(--mobile-global-static-gap-lg);
    border-top: 1px solid var(--color-gray-light);
}

/* Copyright text self container */
.footer_copyright-c {
    font-size: 0.75em;
    color: var(--color-gray-light);
}

/*
    Footer Social Network.
*/
.footer_social svg {
    fill: var(--base-color);
    width: 2rem;
    height: auto;
    transition: fill 100ms linear;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_social svg {
            width: calc(1.2rem + 0.2vw);
        }
    }

.footer_social a:not(:last-child) {
    margin-right: var(--mobile-global-static-gap-lg);
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        .footer_social a:not(:last-child) {
            margin-right: var(--desktop-global-responsive-gap-sm)
        }
    }

.footer_social svg:hover {
    fill: var(--color-gray-light);
    stroke-width: 0.2px;
}

/*
    Footer Nav Menu.
*/
/* Margin will collapse with .footer_sub-title */
footer nav > ul > li {
    margin-top: 0.5rem;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        /* Mobile need margin everywhere but not desktop */
        footer nav > ul > li {
            margin-top: unset; /* Reset */
        }

        /* Margin top not first child */
        footer nav > ul > li:not(:first-child) {
            margin-top: 0.4rem;
        }
    }


/* Reduce margin on sub elements */
footer nav > ul > li > ul > li:not(:last-child) {
    margin-bottom: -0.15em;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        /* Reduce margin on sub elements */
        footer nav > ul > li > ul > li:not(:last-child) {
            margin-bottom: -0.15em;
        }
    }

/* First level item link */
footer nav > ul > li > a {
    font-weight: 700;
    transition: color 100ms linear;
    display: block;
    font-size: 0.92em;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        footer nav > ul > li > a {
            display: inline-block;
            font-size: 0.88em;
        }
    }

/* First level item link Hover */
footer nav > ul > li > a:hover {
    color: var(--color-gray-light);
}

/* Sub level link */
footer nav > ul > li > ul > li > a {
    color: var(--color-gray-light);
    font-weight: unset; /* Rewrite */
    transition: color 100ms linear;
    display: block;
    font-size: 0.92em;
}
    /* MD responsive */
    @media (min-width: 768px)
    {
        footer nav > ul > li > ul > li > a {
            display: inline-block;
            font-size: 0.88em;
        }
    }
