/*

    Login.CSS
    @ Copyright © 2022 www.point-web.fr

 */

/* login **************/

    #login {height: 100vh;display: flex;justify-content: center;align-items: center;}

/* logo **************/

    .logo {text-align: center;}
    .logo .lo svg {width:calc(200px + 20 * (100vw - 320px) / 1080);}
    .logo p {text-transform: uppercase; font-weight: 700; margin-top: 1em; font-size: 1.2em;}

/* citation **************/

    .citation {display: flex; flex-direction: column; align-items: center;}
    .citation p {font-family: "Minion Pro"; font-size: 1.5em; text-align: center;}
    .citation .ct p {margin-top: 2em;}
    .citation picture {margin: 1em 0;}
    .citation img {width:calc(100px + 20 * (100vw - 320px) / 1080);}

/* btn **************/

    .bt {display: flex; justify-content: center; margin: 2em 0;}

/* pop-up **************/

    .opp #pop {display: flex; position: absolute; top: 0;}
    #pop {display: none;z-index: 99999;justify-content: center;align-items: center;}
    #pop:before {content: '';height: 100vh;width: 100vw;background-color:  rgb(0 0 0 / 30%);}
    #connect {display: flex;align-items: center;justify-content: center;position: fixed;background: #FFFFFF;border-radius: 16px;padding: 2em;}
    #connect .close {text-align: end;margin-bottom: 1em;cursor: pointer;}
    #connect .bc {padding-bottom: 1em; width: 100%;}
    #connect .bc button {width: 100%;}
    #connect .mdp {cursor: pointer;}
    #connect form {margin-top: 2em;}
    #connect form .fd {border: 1px solid var(--color_1); border-radius: 16px;}

/* bottom **************/

    .bottom{font-size:.9rem; font-weight: 500;}
    .bottom .ct{background-color:var(--color_4);color:var(--color_2); border-radius: 16px; padding:3em 4em; border: 2px solid var(--color_1);}
    .bottom .ct .m{display:flex;justify-content: space-between;}
    .bottom .m li + li{margin-top:15px;}
    .bottom .lo{fill:#fff;width:calc(80px + 30 * (100vw - 320px) / 1080);max-width:100%;}
    .bottom .mx li a i{margin-right: 15px;}
    .bottom .nv ul{display: flex; flex-direction: column; align-items: flex-end;}
    .bottom .b {display:flex;align-items:center;justify-content:space-between; margin-top: 2em;}


/*----------------------------------------------------< MEDIA QUERIES >---------------------------------------------------*/

@media screen and (max-width:450px){

    #login {height: 100%;}
    #login {padding: 2em 0;}

}
@media screen and (max-width:1084px){

    .bottom .b {flex-direction: column; text-align: center;}
    .bottom .b p{margin-top:15px;}

}
@media screen and (max-width:600px){

    .bottom .ct .m, .bottom .ct .nv ul {display:block; text-align: center;}
    .bottom .ct .nv {margin-top:2em;}
    .bottom .ct {padding: 2em;}
    .bottom {font-size:1em;}
    .opp {height: 100vh;}

}