* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

::-moz-selection {
    background: #366284;
    color: white;
}

::selection {
    background: #366284;
    color: white;
}

/*body {
    background: url(http://baptistevillemur.fr/images/wolf-background.svg) repeat;
    background-size: contain;
    height: 25vh;
}

/* MENU
----------------------------------------*/

nav {
    z-index: 99999;
    position: relative;
    height: 30px;
    line-height: 30px;
    width: 100%;
    font-size: 1.3em;
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    background: rgba(255, 255, 255, .65);
    box-shadow: 0 0 10px #4b4b4b;
    -webkit-transition: .5s;
    transition: .5s;
}

nav img {
    margin-top: 0vh;
}

nav .rest {
    text-align: right;
}

nav:hover {
    background: rgba(255, 255, 255, 0.85);
}

nav img {
    height: auto;
    width: auto;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}

nav img:hover {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: 0.2s;   
    transition: 0.2s;
}

nav .text-menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: wrap row;
    -ms-flex-flow: wrap row;
    flex-flow: wrap row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    float:right;
}

nav p {
    display: inline;
    position: relative;
}

nav > div > div > div > div > a {
    display: block;
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    font-size: 0.75em;
    text-transform: uppercase;
    color: #000000;
    text-decoration: none;
    -webkit-transition: .2s;
    transition: .2s;
}

nav > div > div > div > div > a:hover {
    color: #6f6f6f;
}

nav a:hover+ul, nav a+ul:hover {
    opacity: 1;
    visibility: visible;
}

nav ul {
    visibility: hidden;
    position: absolute;
    top: 30px;
    background: white;
    width: 150px /*20%*/;
    margin-left: -3%;
    z-index: -99999;
    opacity: 0;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    box-shadow: 0 4px 8px #ccc;
}

nav li {
    list-style-type: none;
    width: 100%;
    font-size: .8em;
    line-height: normal;
    text-align: left;
    padding: 8%;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}

nav li:hover {
    background: #eeeeee;
}

nav li a {
    text-decoration: none;
    color: #909090;
}

nav .slash {
    color: #d5d5d5;
}

nav .fa {
    display: none;
    color: #000000;
    font-size: 7vh;
    margin-top: 3.75vh;
}


@media (max-width: 750px) {
    
    nav .text-menu {
        position: absolute;
        top: -85vh;
        left: 0;
        background: white;
        width: 100%;
        height: 85vh;
        text-align: center;
        -webkit-transition: 0.5s;
        transition: 0.5s;
        z-index: -1;
    }
    
    nav .text-menu * {
        height: 12vh;
    }
    
    nav .menu-appear {
        position: absolute;
        top: 5vh;
        -webkit-transition: 0.5s;
        transition: 0.5s;
    }
    
    nav .fa {
        display: block;
    }
    
    nav .six {
        width: 48%;
    }
    
    nav .text-menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: wrap column;
        -ms-flex-flow: wrap column;
        flex-flow: wrap column;
        position: absolute;
        top: -85vh;
        left: 0;
        background: white;
        width: 100%;
        height: 30px /*85vh*/;
        text-align: center;
        -webkit-transition: 0.5s;
        transition: 0.5s;
        z-index: -1;
    }
    
    nav .text-menu * {
        height: 12vh;
    }
    
    nav .text-menu a:hover+ul {
        display: none;
    }
    
    nav .menu-appear {
        position: absolute;
        top: 5vh;
        -webkit-transition: 0.5s;
        transition: 0.5s;
    }
    
    nav .fa {
        display: block;
    }
}    
    



.row {
    width: 95%;
    height:30px;
    margin: 0 auto;
    text-align: center;
}

.quarter, .rest {
    text-align: left;
    line-height: 30px;
    float:left;
}

.quarter {
    width: 23%;
}

.rest {
    width: 73%;
    float: right;
}