@font-face {
    font-family: 'RubikText25';
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Medium.eot");
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Medium.eot?#iefix") format("embedded-opentype"),url("../../_Ressources/Fonts/Rubik/Rubik-Medium.ttf") format("ttf"),url("../../_Ressources/Fonts/Rubik/Rubik-Medium.ttf") format("truetype"),url("../../_Ressources/Fonts/Rubik/Rubik-Medium.svg#TitilliumBdBold") format("svg");
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: 'RubikText25';
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Light.eot");
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Light.eot?#iefix") format("embedded-opentype"),url("../../_Ressources/Fonts/Rubik/Rubik-Light.ttf") format("ttf"),url("../../_Ressources/Fonts/Rubik/Rubik-Light.ttf") format("truetype"),url("../../_Ressources/Fonts/Rubik/Rubik-Light.svg#TitilliumRegular") format("svg");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'RubikText25';
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Italic.eot");
    src: url("../../_Ressources/Fonts/Rubik/Rubik-Italic.eot?#iefix") format("embedded-opentype"),url("../../_Ressources/Fonts/Rubik/Rubik-Italic.ttf") format("ttf"),url("../../_Ressources/Fonts/Rubik/Rubik-Italic.ttf") format("truetype"),url("../../_Ressources/Fonts/Rubik/Rubik-Italic.svg#TitilliumItalic") format("svg");
    font-weight: normal;
    font-style: italic
}

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    word-wrap: break-word;
}

a:focus {
    outline: thin dotted
}

a:active,a:hover {
    outline: 0
}

h1 {
    font-size: 2em;
    margin: 0.67em 0
}

b,strong {
    font-weight: bold
}

img {
    border: 0
}

.top-bar .name h1 a {
    width: auto
}

*,*:before,*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html,body {
    font-size: 100%
}

body {
    background: #fff;
    color: #222;
    padding: 0;
    margin: 0;
    font-family: "Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    position: relative
}



.row {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    max-width: 62.5em;
    zoom:1;
}

.row:before,.row:after {
    content: " ";
    display: table
}

.row:after {
    clear: both
}

.row .column,.row .columns {
    position: relative;
    padding-left: 0.9375em;
    padding-right: 0.9375em;
    width: 100%;
    float: left
}

.row.collapse .column,.row.collapse .columns {
    position: relative;
    padding-left: 0;
    padding-right: 0;
    float: left
}

.row .row {
    width: auto;
    margin-left: -0.9375em;
    margin-right: -0.9375em;
    margin-top: 0;
    margin-bottom: 0;
    max-width: none;
    zoom:1;
}

.row .row:before,.row .row:after {
    content: " ";
    display: table
}

.row .row:after {
    clear: both
}

.row .row.collapse {
    width: auto;
    margin: 0;
    max-width: none;
    zoom:1;
}

.row .row.collapse:before,.row .row.collapse:after {
    content: " ";
    display: table
}

.row .row.collapse:after {
    clear: both
}

@media only screen and (min-width: 48em) {
    .row .large-4 {
        position: relative;
        width: 33.33333%
    }
}

div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,th,td {
    margin: 0;
    padding: 0;
    direction: ltr
}

a {
    color: #0084ff;
    text-decoration: none;
    line-height: inherit
}

a:hover,a:focus {
    color: #0084ff
}

p {
    font-family: inherit;
    font-weight: normal;
    font-size: 1em;
    line-height: 1.6;
    margin-bottom: 1.25em;
    text-rendering: optimizeLegibility
}

p aside {
    font-size: 0.875em;
    line-height: 1.35;
    font-style: italic
}

h1,h2,h3,h4,h5,h6 {
    font-weight: bold;
    font-style: normal;
    color: #222;
    text-rendering: optimizeLegibility;
    margin-top: 0.2em;
    margin-bottom: 0.5em;
    line-height: 1.2125em
}

ul,ol,dl {
    font-size: 1em;
    line-height: 1.6;
    margin-bottom: 1.25em;
    list-style-position: outside;
    font-family: inherit
}

ul li ul,ul li ol {
    margin-left: 1.25em;
    margin-bottom: 0;
    font-size: 1em
}

ol li ul,ol li ol {
    margin-left: 1.25em;
    margin-bottom: 0
}









/*TOPBAR*/
.top-bar {
    overflow: hidden;
    height: 80px;
    line-height: 80px;
    position: relative;
    background: #001425;
    margin-bottom: 1.875em;
    text-align: left;
}

.top-bar ul {
    margin-bottom: 0;
    list-style: none;
    display: flex;
    align-items: center;
}

.top-bar .title-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-bar .name {
    height: 80px;
    margin: 0;
    font-size: 16px;
}

.top-bar .name h1 {
    line-height: 80px;
    font-size: 1.875em;
    margin: 0;
}

.top-bar .name h1 a {
    font-weight: bold;
    color: #fff;
    display: block;
    padding: 0 20px;
}

.top-bar .toggle-topbar {
    display: none;
}

.top-bar.expanded .toggle-topbar {
    display: block;
}

.top-bar .toggle-topbar a {
    color: #fff;
    text-transform: uppercase;
    font-size: 0.8125em;
    font-weight: bold;
    position: relative;
    display: block;
    padding: 0 26.66667px;
    height: 80px;
    line-height: 80px;
}

.top-bar .toggle-topbar.menu-icon {
    right: 26.66667px;
    top: 50%;
    margin-top: -16px;
    padding-left: 40px;
}

.top-bar .toggle-topbar.menu-icon a {
    text-indent: -48px;
    width: 34px;
    height: 34px;
    line-height: 33px;
    padding: 0;
    color: #fff;
}

.top-bar .toggle-topbar.menu-icon a span {
    position: absolute;
    right: 0;
    display: block;
    width: 16px;
    height: 0;
    box-shadow: 0 10px 0 1px #fff, 0 16px 0 1px #fff, 0 22px 0 1px #fff;
}

.top-bar .custom-nav {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.top-bar .custom-nav li {
    margin: 0;
    padding: 0;
}

.top-bar .custom-nav li a {
    display: block;
    color: #fff;
    padding: 12px 20px;
    font-size: 0.8125em;
    font-weight: bold;
    text-decoration: none;
    transition: background-color 0.3s;
}

.top-bar .custom-nav li a:hover {
    background-color: #2b2b2b;
}

/* Média query pour les écrans étroits, comme les téléphones mobiles */
@media screen and (max-width: 768px) {
    .top-bar .name h1 {
        font-size: 1em;
    }

    .top-bar .custom-nav li a {
        font-size: 0.7em;
    }
}

















/*FOOTER*/
.footer {
    background: #00182c;
    padding: 1em 0;
    color: #f2f2f2
}

.footer h1,.footer h2,.footer h3,.footer h4,.footer h5,.footer h6 {
    color: #fff
}

.footer ul.nav {
    list-style-type: none;
    margin: 0em 1em 1.25em
}

.footer ul.nav li {
    border-top: 1px solid gray;
    padding: 0.15em 0.5em
}

.footer a {
    color: #d9d9d9;
    text-decoration: underline
}

.footer a:hover {
    color: #fff;
    text-decoration: none
}

