/* >–––––––––––––––––––––––––––––––––––––– COMMON STRUCTURE –––––––––< */

#iViewport > section.a { padding-left: 0; }

	section.a > header 
	{
		display: flex;
	}

	section.a > div.maxwidth
	{
		display: flex;
		box-sizing: border-box;
		padding-top: 3rem;
	}
		section.a nav {
			flex: 0 0 25%;
		}

		section.a .box {
			flex-grow: 1; 
		}
		

/* CAND MENU  –––––––––< */

nav#umenu {
    box-sizing: border-box;
    /*margin-bottom: auto;*/
    padding: 0 5rem 2rem 0;
    /*height: auto;*/
    text-align: left;
}
    nav#umenu h1 {
        margin-bottom: 2rem;
        font-family: "Proxima Nova W01 Thin", sans-serif;
        font-size: 2.5rem; line-height: 2.6rem;
        color: #B4D4FF;
        text-align: left;
    }

    nav#umenu p {
        font-size: 1.4rem; line-height: 1.8rem;
        color: #B4D4FF;
    }

    nav#umenu a.login {
        display: block;
        box-sizing: border-box;
        padding: 1rem;
        text-align: center;
        border-radius: 0.6rem;
        background-color: #002D46;
    }
        nav#umenu a.login .arrow {
            margin: 0 auto;
            -webkit-transform: scaleX(-1);
                    transform: scaleX(-1);
        }
        nav#umenu a.login .arrow svg { fill: #9F9F9F; }

    /* >------ social -----< */
    nav#umenu .social {
        margin-top: 6rem;
        text-align: center;
    }
        nav#umenu .social a {
            display: flex;
            justify-content: center;
            align-items: center;
            box-sizing: border-box;
            margin: 0 auto 2rem auto;
            width: 3.5rem;
            height: 3.5rem;
        }
        nav#umenu .social div {
            position: relative; 
            margin: 0 auto;
            width: 100%;
            height: 100%;
        }
        nav#umenu .social div::before { content: ''; display: block; padding-top: 100%; }
            nav#umenu .social svg { position: absolute; left: 0; top: 0; right: 0; bottom: 0; fill: #080000; }
        
        nav#umenu .social .facebook div { width: 44%; }
        nav#umenu .social .facebook div::before { padding-top: 204%; }
        nav#umenu .social .linkedin div { width: 96%; }
        nav#umenu .social .linkedin div::before { padding-top: 96%; }
        nav#umenu .social .instagram div { width: 96%; }

    /* >------ branches -----< */
    nav#umenu .branches {
        margin-top: 6rem;
    }
        nav#umenu .branches a {
            display: block;
            margin-bottom: 1rem;
        }
            nav#umenu .branches img {
                display: block;
                width: 100%;
                height: auto;
                border-radius: 0.6rem;
                box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
            }

        nav#umenu .branches h2 {
            margin-bottom: 3rem;
            font-family: "Proxima Nova W01 Thin", sans-serif;
            font-size: 2.5rem; line-height: 2.6rem;
            color: #B4D4FF;
        }

    /* >------ connected -----< */

    nav#umenu header {
        box-sizing: border-box;
        margin-bottom: 2rem;
        padding: 0 2rem;
    }
        nav#umenu header .img {
            display: inline-block; vertical-align: top;
            position: relative;
            width: 25%;
            border-radius: 1.5rem;
            /*border: 2px solid #c0c0c0;*/
            background-color: #F7F7FF;
            overflow: hidden;
        }
        nav#umenu header .img::before { content: ''; display: block; padding-top: 100%; }
            nav#umenu header img {
                position: absolute; left: 50%; top: 50%;
                transform: translate(-50%, -50%);
                display: block;
                width: 100%;
                height: auto;
            }

        nav#umenu header .txt {
            display: inline-block; vertical-align: top;
            box-sizing: border-box;
            padding: 1rem 0 0 1rem;
        }

            nav#umenu header aside {
                margin: 0;
                font-family: "HelveticaNeueETW01-45Lt", sans-serif;
                font-size: 1.4rem; line-height: 1.4rem;
                color: #B4D4FF;
                cursor: pointer;
            }
            nav#umenu header aside:hover { color: #000; }

    nav#umenu section 
    {
        box-sizing: border-box;
        margin-bottom: 0rem;
        padding-left: 2rem;
        border-bottom: 1px solid #27B0FF;
    }
    nav#umenu section:last-of-type { margin-bottom: 0; border-bottom: 0; }

        nav#umenu section > h1
        {
            margin-top: 1.5rem;
        }

        nav#umenu h6 {
            box-sizing: border-box;
            margin-top: 2rem;
            margin-bottom: 1rem;
            font-family: "HelveticaNeueETW01-45Lt", sans-serif;
            font-size: 1.2rem; line-height: 1.2rem;
            color: #B4D4FF;
        }

        nav#umenu li {
            box-sizing: border-box;
            padding: 1.5rem 0;
            font-family: "HelveticaNeueETW01-45Lt", sans-serif;
            font-size: 1.6rem; line-height: 1.8rem;
            list-style: none;
        }
        nav#umenu a li { color: #fff; }
        nav#umenu a:hover li,
        nav#umenu li.current { color: #B4D4FF; }

    nav#umenu section.since p { 
        font-family: "HelveticaNeueETW01-45Lt", sans-serif;
        font-size: 1.8rem; line-height: 1.8rem;
        color: #B4D4FF;
    }


/* HEADER –––––––––< */

section.a > header .triple_title 
{
	margin-left: auto;
}




/* >–––––––––––––––––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF –––––––––< */



@media all and (max-width: 1000px) {
	/* STRUCTURE –––––––––< */
	#iViewport > section.a { padding-left: 2rem; }
	section.a div.maxwidth { display: block; }

	/* CAND. MENU ––––––< */
    nav#umenu { display:none; }
}

@media all and (max-width: 600px) {
	/* HEADER –––––––––< */
	section.a > header .triple_title { margin-left: 0; }
}