/*------------------------------------*\
	RESET
\*------------------------------------*/
body, div, dl, dt, dd, /*ul,*/
ol, /*li,*/
h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

address, caption, cite, code, dfn, th, var {
    font-style: normal;
    font-weight: normal;
}

caption, th {
    text-align: left;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before, q:after {
    content: '';
}

abbr, acronym {
    border: 0;
}

/*------------------------------------*\
	MAIN
\*------------------------------------*/
body {
    font-family: Arial, Verdana, sans-serif;
    font-size: 0.75em;
    color: #333;
    width: 85%;
    margin: 0 auto;
    padding: 0px 10px;
    background-color: rgba(242, 242, 242, 0.95);
}

#client_body {
    /*box-shadow: 0px 0px 15px -2px rgba(0, 0, 0, 0.7);*/
    background-color: white;
    padding: 0px 5px 20px 5px;
}

/*------------------------------------*\
	NAV
\*------------------------------------*/
.nav, .nav ul, .nav li, #side_menu ul, #side_menu li {
    margin: 0;
    padding: 0;
    z-index: 100;
}

.nav {
    list-style: none;
    font-weight: bold; /*font-size:80%;*/
    margin-bottom: 0px;
    /* Clear floats */
    float: left;
    /*width:900px;
  min-width:900px;*/
    /* Bring the nav above everything else--uncomment if needed.
    position:relative;
    z-index:5;
    */

    /*display:inline-block;*/
}

.nav li {
    float: left;
    margin-right: -1px;
    position: relative;
    border-right: 1px solid rgb(186, 192, 195);

}

.nav > li, .nav > li > a {
    max-width: 20em; /*90px;*/
    min-height: 2.5em;
    line-height: 2.5em;

}

.nav li:hover a { /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
    background: #F2F2F2;
    color: black;
    box-shadow: 2px 3px 2px 2px rgba(45, 45, 45, 0.6);
}

.side_nav span {
    background: #ffb898;
    color: black;
}

#site_identification {
    background: #F2F2F2;
    color: black;
}

.nav a {
    color: #fff;
    /*background:#165488;*/
    background: #003CA6;
    text-decoration: none;
}

.nav a {
    display: block;
    padding: 0.4em 20px;
    text-align: center;
    /* height:2.5em; */
}

/*modif car il y a une border sur la toolbar*/

.nav > li {
    margin-right: 0px;
}

.nav > li > a {
    border: none;
}

/*fin modif*/

.nav li ul li a {
    text-align: left;
    height: auto;
}

.nav > li.menu_selected > a, .side_nav > span.menu_selected {
    /*background:#bbbbbb;*/
    background: #BBD5E4;
    color: #003CA6;
    white-space: nowrap;
}

.nav a:hover {
    /*color:#fff;
    background:#6b0c36;
    text-decoration:underline;*/

    background: rgb(251, 128, 73);
    color: #003CA6; /*#0070C0;*/
}

/*--- DROPDOWN ---*/
.nav ul {
    background: #fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    background: rgba(255, 255, 255, 0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
    list-style: none;
    position: absolute;
    left: -9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}

.nav ul li {
    float: none;
}

.nav ul a {
    white-space: nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

.nav li:hover ul { /* Display the dropdown on hover */
    left: 0; /* Bring back on-screen when needed */
}

.nav li:hover ul a { /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    text-decoration: none;
    color: #003CA6; /*#0070C0;*/
}

.nav li:hover ul li a:hover, .side_nav span:hover { /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background: #BBD5E4;
    color: #003CA6;
}

.nav_alone > li, .nav_alone > li > a {
    max-width: none;
    min-height: inherit;

}

/*side menu*/

#side_menu {
    float: left;
    width: 158px;
    margin-right: 25px;
}

#side_menu .current {
    font-weight: bold;
}

#side_menu a { /*, .nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    display: block;
    text-decoration: none;
    color: #003CA6;
}

#side_menu span {
    display: block;
    border: 1px solid rgb(219, 150, 119);
    margin-top: 0px;
    margin-bottom: -1px;
    padding: 3px;
}

#side_menu a, #side_menu span {
    width: 100%;
}

#side_menu .menu_level_1 span {
    background: #f9aa87;
    color: #003CA6;
    padding-left: 10px;
    width: 151px;
}

#side_menu .menu_level_1 a:hover, #side_menu .menu_level_1 span:hover { /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background: rgb(251, 128, 73);
    color: #003CA6;
}

#side_menu .menu_level_2 span {
    background: #f1decf;
    color: #003CA6;
    padding-left: 17px;
    width: 144px;
    border: 1px solid rgb(208, 186, 176);
}

#side_menu .menu_level_2 a:hover, #side_menu .menu_level_2 span:hover { /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background: rgb(251, 128, 73);
    color: #003CA6;
}

#side_menu .menu_level_3 span {
    background: rgb(251, 245, 241);
    color: #003CA6; /*#0070C0;*/
    padding-left: 25px;
    width: 136px;
}

/*------------------------------------*\
	TYPE
\*------------------------------------*/
h1 {
    font-family: Calibri, Arial, Verdana, sans-serif;
    font-size: 2em;
    width: 520px;
}

/* cert */
#site_identification_old {
    width: 150px;
    text-align: center;
    position: relative;
    margin: 0px auto;
    border: 1px solid;
}

#site_identification {

    color: #003CA6; /*#0070C0;*/
    width: 150px;
    text-align: center;
    position: relative;
    margin: 0px auto;
    font-weight: bold;
    padding: 5px;
}

#banner {
    padding-bottom: 5px;
}

#logo_cert {
    vertical-align: middle;
}

#logo_print {
    vertical-align: middle;
    height: 32px;
}

#logo_flag {
    vertical-align: middle;
    height: 32px;
}

#logo_rss {
    vertical-align: middle;
}

/*
.textTitleHeader {  
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 17px; 
	font-style: normal; 
	font-weight: normal; 
	color: #2388BC
}
*/
#banner_title {
    /*vertical-align:middle;*/
    font-family: Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-style: normal;
    font-weight: bold /*normal*/;
    color: #003CA6;
    padding-top: 20px;
}

#slide_show > * {
    display: none;
}

#myaccount_bar {
    position: absolute;
    top: 0px;
    right: 0px;
    /*background-color:#127BB5;
    padding:2px;*/
    max-height: 1.5em;
}

#myaccount_bar .nav > li, #myaccount_bar .nav > li > a {
    max-width: 15em;
    line-height: 1em;
}

#myaccount_bar .nav > li > a:before {
    content: "⚙ ";
    font-size: 24px;
    margin-top: 8px;
    line-height: 21px;
    vertical-align: middle;
}

#myaccount_bar .nav > a {
    background-color: #00aa00;
}

#top_toolbar {
    position: absolute;
    bottom: 0px;
    right: 0px;
    padding: 2px;
}

#top_toolbar a {
    color: #003CA6;
    /*font-size: 10px;*/
    text-decoration: none;
}

#members_area:hover {
    text-decoration: underline;
}

#top_toolbar a:hover img {
    border: 1px solid;
    margin: -1px;
}

#menu_toolbar {
    position: relative;
    width: 100%;
    background: #003CA6;
}

#search {
    padding-top: 10px;
    padding-right: 10px;
    vertical-align: middle;
    float: right
}

#search_text {
    width: 200px;
    border: 0px solid black;
    padding: 3px;
    display: inline;
}

.search_text {
    width: 200px;
    border: 0px solid black;
    padding: 3px;
    display: inline;
}

#search_btn {
    background-color: #FFFFFF;
    color: #252b25;
    text-decoration: none;
    border: none;
    padding: 3px;
    display: inline;
}

/*<a href="#" class="btn right">*/
/*<span class="left title">Favorite This!</span>*/
/*<span class="right icon icon-heart"><span class="arrow-right"></span></span>*/
/*</a>*/

/*.pageTitles {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #F59320;
	font-weight: normal;
	padding-top: 10px;
	padding-left: 0px;
}*/


.hotNews {
    padding: 5px;
    background-color: #E7FF38;
}

.hotNews,
.hotNews a {
    margin: 0 auto;
    text-align: center;
    color: mediumvioletred;
    font-size: 1.2em;
    font-weight: bold;
}

#side_bar {

}

#breadcrumb, #breadcrumb_separator {
    color: #F59320;
}

#breadcrumb {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    float: left;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

#breadcrumb_separator {
    clear: both;
    margin-top: 0px;
    padding: 0px;
    margin-bottom: 10px;
    /*border-bottom: solid 1px rgba(245, 147, 32, 0.55);*/
}

#breadcrumb_image {
    float: right;
}

#breadcrumb * {
    text-decoration: none;
    color: green;
}

#breadcrumb *:hover {
    text-decoration: underline;
}

#content {
    float: left;
    width: calc( 100% - 183px);
}

#content.fullwidth {
    float: none;
    width: 100%;
}

/*.pageSubTitles{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #003CA6;
	font-weight: bold;
	padding-top:  0px;
	padding-left: 0px;
}*/
#content_title {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #003CA6;
    font-weight: bold;
    padding-top: 0px;
    padding-left: 0px;
}

#page_block, .textBox {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    color: #003CA6;
}

#page_block p {
    margin: 1.12em 0;
}

#footer {
    clear: both;
    text-align: center;
    padding-top: 10px;
    border-top: solid 1px rgba(0, 0, 0, 0.14);
}

.tag {
    display: inline-block;
    padding: 2px 4px;
    font-size: 12px;
    font-weight: bold;
    line-height: 14px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    box-shadow: 1px 2px 2px #888888;
    margin-bottom: 3px;
    margin-top: 3px;
}

.certtooltip {
    display: inline;
    position: relative;
}

.certtooltip:hover:after {
    background: #333;
    border-radius: 2px;
    bottom: 71px;
    color: #000;
    content: attr(title);
    left: 0%;
    padding: 15px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
    box-shadow: 3px 3px 6px 2px rgba(0, 0, 0, 0.7);
}

.certtooltip:hover:before {
    border: solid;
    border-color: transparent;
    border-width: 6px 6px 0 6px;
    bottom: 65px;
    content: "";
    left: 40%;
    position: absolute;
    z-index: 99;
}

.vigilance_rank0:hover:after {
    background: rgba(213, 245, 227, 0.95);
}

.vigilance_rank0:hover:before {
    border-color: #D5F5E3 transparent;
}

.vigilance_rank1:hover:after {
    background: #f0f8fd;
}

.vigilance_rank1:hover:before {
    border-color: #f0f8fd transparent;
}


.vigilance_rank2:hover:after {
    background: rgba(253, 253, 1, 0.95);
}

.vigilance_rank2:hover:before {
    border-color: #fdfd01 transparent;
}

.vigilance_rank3:hover:after {
    background: rgba(192, 57, 43, 0.95);
}

.vigilance_rank3:hover:before {
    border-color: #C0392B transparent;
}

.cadena-accueil {
    width: 64px;
}

.check-red {
    color: #f44336;
    font-weight: bold;
    font-size: 12px;
}
.check-green {
    color: #19B027;
    font-weight: bold;
    font-size: 12px;
}

@keyframes slidy {
    0% { left: 0%; }
    20% { left: 0%; }
    25% { left: -100%; }
    45% { left: -100%; }
    50% { left: -200%; }
    70% { left: -200%; }
    75% { left: -300%; }
    95% { left: -300%; }
    100% { left: -400%; }
}
figure {
    margin: 0; background: #101010;
    font-family: Istok Web, sans-serif;
    font-weight: 100;
}
div#captioned-gallery {
    width: 100%; overflow: hidden;
    height:119px;
    box-shadow: 0px 1px 8px -1px black;
}
figure.slider {
    position: relative; width: 500%;
    font-size: 0; animation: 30s slidy infinite;
}
figure.slider figure {
    width: 20%; height: 119px;
    display: inline-block;  position: inherit;
}
figure.slider img { width: 100%; height: auto; }
figure.slider figure figcaption {
    position: absolute; bottom: 0;
    background: rgba(0,0,0,0.6);
    color: #fff; width: 100%;
    font-size: 20px; padding: .6rem;
}