@charset "utf-8";

/*
===================================================================
    X-Small devices (portrait phones, less than 576px)   // 320px
===================================================================
*/

/* ===============================
 *  FOOTER TOP BAR
=============================== */
.footerTop {
    padding-top: 4vmax;
    padding-bottom: 4vmax;
    background-color:var(--focus-x-light) ;
}

.footerTop a {
    display: inline-block;
    font-size: .813rem;
    text-transform: uppercase;
    color:var(--neutral-2x-dark);
    text-align: center;
    line-height: 1.2;
}

.footerTop a img {
    display: block;
    margin: 0 auto 1vmax;
}

/* ===============================
 *  FOOTER MAIN CONTENT
=============================== */
.footerMain {
    padding-top: 4vmax;
    padding-bottom: 4vmax;
    background-color: #fff;
}

.footerMain .logo {
    width: 250px !important;
}

.footerMain .footerLinks a {
    color:#000;
    padding-bottom: .5vmax;
    line-height: 1.2;
    position: relative;
    padding-left: 0;
    transition: color .4s ease, padding-left .4s ease;
}

.footerMain .footerLinks a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--focus-main);
    transform: translateY(-50%) scale(0);
    transition: transform .4s ease;
}

.footerMain .footerLinks a:hover {
    color: #000;
    padding-left: 16px;
}

.footerMain .footerLinks a:hover::before {
    transform: translateY(-50%) scale(1);
}

.footerMain .footerLinks a.footerCta {
    transition: transform .3s ease;
}

.footerMain .footerLinks a.footerCta::before {
    display: none;
}

.footerMain .footerLinks a.footerCta:hover {
    padding-left: 0;
    transform: scale(1.03);
}

/* ===============================
 *  FOOTER BOTTOM BAR
=============================== */
.footerBottom {
    background: var(--primary-main);
    padding-top: 2vmax;
    padding-bottom: calc(2vmax + 80px);
    color:#FFF;
    text-align: center;
    font-size: .813rem;
    line-height: 1.2;
}

.footerBottom a {
    color:#FFF;
    display: block;
    padding-top: .5vmax;
    padding-bottom: .5vmax;
}

/* ===============================
 *  SCROLL TO TOP
=============================== */
#btn-back-to-top {
    display:block;
    margin: 3vmax auto;
    font-size: 2rem;
    color: var(--neutral-dark);
}

#btn-back-to-top img {
    height: 42px;
}


/*
===================================================================
    Medium devices (tablets, 768px and up)             // 768px
===================================================================
*/
@media screen and (min-width: 768px) {

/* ===============================
 *  FOOTER TOP BAR
=============================== */
.footerTop {
    padding-top: 1vmax;
    padding-bottom: 1vmax;
}

.footerTop a {
    padding-top: 1vmax;
    padding-bottom: 1vmax;
}

/* ===============================
 *  FOOTER BOTTOM BAR
=============================== */
.footerBottom {
    text-align: left;
}

.footerBottom a {
    display: inline;
    padding-right: 1vmax;
}

/* ===============================
 *  SCROLL TO TOP
=============================== */
#btn-back-to-top {
    position: fixed;
    bottom: 13vmax;
    right: 2vmin;
    display:none;
    background-color: var(--neutral-light);
    margin: 0;
    padding: 6px;
}

/* ===============================
 *  BOUTONS CONTACT SCROLL FIXE
=============================== */
.contactAbsolu {
    position: fixed;
    right: 0;
    bottom:calc(50% - 100px);
    display: flex !important;
    flex-direction: column;
    z-index: 1010;
}

.contactAbsolu .btn {
    border-radius: .15rem 0 0 .15rem;
    margin-bottom: 1vmax;
    padding: 1vmax;
}

.contactAbsolu .btn img {
    width:32px;
}

}/*/mediaquery*/


/*
===================================================================
    Large devices (desktops, 992px and up)             // 992px
===================================================================
*/
@media screen and (min-width: 992px) {

/* ===============================
 *  FOOTER TOP BAR
=============================== */
.footerTop a {
    text-align: left;
    display:flex;
}

.footerTop a img,
.footerTop a span {
    display: inline-block;
    margin: 0;
}

.footerTop a span {
    padding-left: 1vmax;
}

/* ===============================
 *  FOOTER BOTTOM BAR
=============================== */
.footerBottom {
    padding-bottom: 2vmax;
}

/* ===============================
 *  BOUTONS CONTACT SCROLL FIXE
=============================== */
.contactAbsolu {
    bottom:calc(2vmin + 100px);
}

.contactAbsolu .btn:hover {
    transform:translateX(-10px);
    margin-right: -10px;
    transition:all ease .2s;
}

/* ===============================
 *  SCROLL TO TOP
=============================== */
#btn-back-to-top {
    bottom: 2vmin;
    transition: all ease .15s;
}

}/*/mediaquery*/


/*
===================================================================
    X-Large devices (large desktops, 1200px and up)    // 1200px+
===================================================================
*/
@media screen and (min-width: 1200px) {

/* ===============================
 *  FOOTER TOP BAR
=============================== */
.footerTop a {
    font-size: 1rem;
    justify-content: center;
}

.footerTop a:hover {
    transform: scale(1.05);
}

/* ===============================
 *  FOOTER BOTTOM BAR
=============================== */
.footerBottom a:hover {
    text-decoration: underline;
}

/* ===============================
 *  SCROLL TO TOP
=============================== */
#btn-back-to-top:hover {
    background: #FFF;
    color:#000;
    transform: scale(1.05);
    bottom:2.5vmin;
}

}/*/mediaquery*/
