/* ------------------------------------------------------------------------ 		
			
	 == GLOBAL ==

	 ------------------------------------------------------------------------		*/
body {
	width: 100%;
	height: 100%;
	font-family: 'Trade Regular';
	font-size: 13px;
	color: #FFF;
	line-height: 1.3;
    background: #0a1946;
}


/* ------------------------------------------------------------------------ 		
			
	 == GLOBAL ==
	 ------------------------------------------------------------------------ 
			CONTAINER
	 ------------------------------------------------------------------------		*/
div#site-container { /* contient le contenu de la page */
	position: relative;
    overflow: hidden;
}

section { /* étage 100% large */
    position: relative;
    width: 100%;
}
    section.under-nav {
        margin-top: -34px;
        padding-top: 50px;
    }
    section.graphic-blue01, article.graphic-blue01 {
    /*    background: url('../../_img/backgrounds/graphic-blue01.jpg') no-repeat top center #0e2247; */
    }
    section.graphic-blue02, article.graphic-blue02 {
    /*    background: url('../../_img/backgrounds/graphic-blue02.jpg') no-repeat top center #102346; */
    }
    section.graphic-green, article.graphic-green {
     /*   background: url('../../_img/backgrounds/graphic-green.jpg') no-repeat top center #b7c72a; */
    }
    section.graphic-green-30, article.graphic-green-30 {
    /*    background: url('../../_img/backgrounds/graphic-green-30.jpg') no-repeat top center #b7c72a; */
    }
    section.white {
        background: #FFF;
    }
    section.newsletter {
        background: url('../png/newsletter.png') no-repeat top center #db0011;
    }


div.container { /* contenu 1100px centré  */
	margin: 0 auto; 
	position: relative;
	width: 1010px;
}
	div.content-wrapper { /* contenu de la page */
		position: relative;
    	padding: 20px;
    }
        div.content-wrapper.no-pad {
            padding: 0px;
        }
        div.content-wrapper.no-tb {
            padding-top: 0px;
            padding-bottom: 0px;
        }
        div.content-wrapper.no-lr {
            padding-left: 0px;
            padding-right: 0px;
        }
        div.content-wrapper.min-height {
            min-height: 500px;
        }


/* ------------------------------------------------------------------------ 		

		HEADER
		
	 ------------------------------------------------------------------------		*/
header {
    width: 100%;
}
    div.header-mobile {
        display: none;
    }
    div.header-desktop {
        margin-top: 0;
        height: 110px;
        width: 100%;
        position: relative;
        display: flex; display: -webkit-flex; 
        flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
        justify-content: flex-start; -webkit-justify-content: space-around;
        background: url('../png/header-hsbc.png') no-repeat top right #FFF;
    }
        div.header-desktop .container {
            display: flex; display: -webkit-flex; 
            flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
            justify-content: flex-start; -webkit-justify-content: flex-start;
        }
        div.header-desktop a.head-logo {
            width: 208px;
            height: 109px;
            margin: auto 0;
            display: flex; display: -webkit-flex; 
            flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
            justify-content: space-around; -webkit-justify-content: space-around;
        }
            div.header-desktop a.head-logo img {
                margin: auto;
                height: 83px;
                width: 174px;
            }

        div.header-desktop div.head-right {
            margin: auto 0 0 auto;
            display: flex; display: -webkit-flex; 
            flex-flow: row wrap; -webkit-flex-flow: row wrap;
            justify-content: flex-end; -webkit-justify-content: flex-end;
        }
            div.header-desktop div.head-right div.head-links {
                margin: auto 0 5px auto;
                height: 30px;
                display: flex; display: -webkit-flex; 
                flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
                justify-content: flex-end; -webkit-justify-content: flex-end;
                width: 100%;
            }
                div.header-desktop div.head-right div.head-links a {
                    display: block;
                    margin: auto 0;
                    padding: 0 2px;
                }
                div.header-desktop div.head-right div.head-links .langues {
                    height: 30px;
                    display: flex; display: -webkit-flex; 
                    flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
                    justify-content: space-around; -webkit-justify-content: space-around;
                    margin-right: 20px;
                }
                    div.header-desktop div.head-right div.head-links .langues a {
                        padding: 0 5px;
                        color: #0b2149;
                        font-family: 'Trade HvCn';
                        font-size: 16px;
                        text-transform: uppercase;
                   }
                        div.header-desktop div.head-right div.head-links .langues a:first-child {
                            border-right: 1px solid #0b2149;
                        }
                        div.header-desktop div.head-right div.head-links .langues a.is-active {
                            color: #3178b8;
                        }


            div.header-desktop div.head-right div.head-nav {
                margin: 0 0 0 auto;
                height: 37px;
                display: flex; display: -webkit-flex; 
                flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
                justify-content: flex-start; -webkit-justify-content: flex-start;
                background: #0b2149;
            }

    div.header-baseline {
        position: relative;
        z-index: 50;
        margin-top: 0;
        height: 34px;
        width: 100%;
        position: relative;
        display: flex; display: -webkit-flex; 
        flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
        justify-content: flex-start; -webkit-justify-content: space-around;
        background: url('../png/header-baseline.png') repeat-x top left;
    }
        div.header-baseline .container {
            display: flex; display: -webkit-flex; 
            flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
            justify-content: flex-start; -webkit-justify-content: flex-start;
        }
        div.header-baseline div.baseline-logo {
            display: block;
            width: 123px;
            height: 34px;
            margin: auto 0;
        }
        div.header-baseline div.baseline-chrono {
            display: block;
            width: auto;
            margin: auto 0;
            font-size: 16px;
            color: #FFF;
            font-family: 'Trade Lt';
            border-right: 1px solid #FFF;
            margin-right: 15px;
            padding-right: 25px;
        }
            div.header-baseline div.baseline-chrono .time {
                font-family: 'Trade HvCn';
                display: inline-block;
                padding: 0px 1px; 
            }
            div.header-baseline div.baseline-chrono .spacer {
                font-family: 'Trade HvCn';
                color: #087eb8;
            }
        div.header-baseline div.baseline-dates {
            display: block;
            width: 215px;
            margin: auto 0;
            font-size: 16px;
            color: #FFF;
            text-transform: uppercase;
        }

        div.header-baseline div.baseline-links {
            margin: auto 0 auto auto;
            display: flex; display: -webkit-flex; 
            flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
            justify-content: flex-end; -webkit-justify-content: flex-end;
        }
            div.header-baseline div.baseline-links a {
                width: 135px;
                height: 34px;
                display: flex; display: -webkit-flex; 
                flex-flow: row nowrap; -webkit-flex-flow: row nowrap;
                justify-content: flex-start; -webkit-justify-content: flex-start;
            }
                div.header-baseline div.baseline-links a img {
                    margin: auto 10px;
                    margin-right: 10px;
                }
                div.header-baseline div.baseline-links a span {
                    margin: auto 0;
                    display: block;
                    font-size: 14px;
                    color: #FFF;
                    font-family: 'Trade HvCn';
                    text-transform: uppercase;
                }

            div.header-baseline div.baseline-links a.red {
                background-color: #c22023;
            }
            div.header-baseline div.baseline-links a.green {
                background-color: #009de2;
            }



 /* ------------------------------------------------------------------------        

       FOOTER
        
     ------------------------------------------------------------------------       */
footer {
    width: 100%;
    min-height: 500px;
    background: url('../jpg/footer.jpg') no-repeat top center #0a1946;
    padding: 10px 0;
}
.baseline {
    width: 100%;
    height: 50px;
    background: #011128;
    text-align: center;
    font-family: 'Trade Lt';
    font-size: 13px;
    color: #FFF;
    text-transform: uppercase;
    line-height: 45px;
}
    .baseline a {
        color: #FFF;
        display: inline-block;
        text-decoration: none;
    }
		
/* ------------------------------------------------------------------------ 		

		MISC
		@Titles, Flex, Buttons, Fonts...
		
	 ------------------------------------------------------------------------		*/

/* LINKS */
a { 
	color: #554c4c;
	text-decoration: none; 
}
a:hover { 
    text-decoration: none; 
	cursor: pointer; 
}

/* HR */
hr {
	width: 100%;
	height: 4px;
	background: #009de2;
	border: none;
	margin: 7px 0;
	padding: 0px;
    background: url('../png/spacer-large.png') no-repeat top center #009de2;
}
    hr.large {
        height: 8px;
        margin: 20px 0;
    }
hr.red {
}
hr.blue {
}


.live-shadow {
    -webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.17);
    -moz-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.17);
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.17);    
}