@font-face {
 font-family: "Oswald-Medium";
 font-style: medium;
 src:  url("../fonts/Oswald/Oswald-Medium.ttf") format("truetype");
}

@font-face {
 font-family: "Oswald-Light";
 font-style: light;
 src:  url("../fonts/Oswald/Oswald-Light.ttf") format("truetype");
}

@font-face {
 font-family: "Oswald-Regular";
 font-style: normal;
 src:  url("../fonts/Oswald/Oswald-Regular.ttf") format("truetype");
}

@font-face {
 font-family: "Oswald";
 font-style: bold;
 src:  url("../fonts/Oswald/Oswald-Bold.ttf") format("truetype");
}

@font-face {
 font-family: "Oswald";
  font-style: semibold;
 src:  url("../fonts/Oswald/Oswald-SemiBold.ttf") format("truetype");
}


@font-face {
 font-family: "Open Sans";
  font-style: bold;
 src:  url("../fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype");
}

@font-face {
 font-family: "Open Sans";
  font-style: normal;
 src:  url("../fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype");
}

@font-face {
 font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
 src:  url("../fonts/Open_Sans/OpenSans-ExtraBold.ttf") format("truetype");
}

/* roboto-regular - latin-ext_latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v29-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* Chrome, Safari and Opera syntax */
:-webkit-full-screen {
  background-color: white;
}

/* Firefox syntax */
:-moz-full-screen {
  background-color: white;
}

/* IE/Edge syntax */
:-ms-fullscreen {
  background-color: white;
}

/* Standard syntax */
:fullscreen {
  background-color: white;
}



@media print{@page {size: landscape}}


@media (min-width: 1010px) {
  /* Rules for tablets and smaller viewports */

	  .version{
		font-size:0.7rem;
	}
}





@media (min-width: 1280px) {
  /* Rules for tablets and smaller viewports */
  body{
	  font-size:0.85rem;
  }
}


@media (max-width: 1280px) {
  /* Rules for tablets and smaller viewports */
  body{
	  font-size:0.8rem;
  }
  

  
	.progressBar1 span.success{
	font-size: 0.9rem !important;
	}
	.progressBar2 span.success{
	font-size: 0.9rem !important;
	}
	.progressBar3 span.success{
	font-size: 0.9rem !important;
	}
	.progressBar4 span.success{
	font-size: 0.9rem !important;
	}
	
	.icon{
	margin-right: 1.25rem !important;
	height: 21px !important;
	}
	.icon2{
	margin-right: 1.25rem !important;
	height: 36px !important;
	}
}

@media (max-width: 1010px) {
  /* Rules for tablets and smaller viewports */
  body{
	  font-size:0.7rem;
  }
  

  
	  .version{
		font-size:0.5rem;
		color:#00000059;
	}
    .myNav:hover{
		border-bottom: .20rem solid #8080804d !important;
		border-top: .20rem solid #8080804d !important;
	}
	.myNav.active{
		border-bottom: .20rem solid #ffffff !important;
		border-top: .20rem solid #ffffff !important;
	}
	
	
	div[class^="progressBar"]{
	  font-size:0.55rem !important;
	  margin-bottom:0.6em !important;
	  width:32px !important;
	}

	.barOverflow{ /* Wraps the rotating .bar */
	  width: 32px !important;
	  height: 16px !important; /* Half circle (overflow) */
	  margin-bottom: -8px !important; /* bring the numbers up */
	}
	.bar{
	  width: 32px !important;
	  height: 32px !important; /* full circle! */
	  border-width: 3px !important;     /* half gray, */
	}
	
	.progressBar1 span.success{
	font-size: 0.8rem !important;
	}
	.progressBar2 span.success{
	font-size: 0.8rem !important;
	}
	.progressBar3 span.success{
	font-size: 0.8rem !important;
	}
	.progressBar4 span.success{
	font-size: 0.8rem !important;
	}
	
	.icon{
	margin-right: 1rem !important;
	height: 21px !important;
	}
	.icon2{
	margin-right: 1rem !important;
	height: 30px !important;
	}
}




@media (max-width: 823px) {
  /* Rules for tablets and smaller viewports */
  body>header{
	  font-size:0.5rem;
  }
    body{
	  font-size:0.65rem;
  }
  
 
  
	  .version{
		font-size:0.45rem;
		color:#00000059;
	}
	
	.progressBar1 span.success{
	font-size: 0.7rem !important;
	}
	.progressBar2 span.success{
	font-size: 0.7rem !important;
	}
	.progressBar3 span.success{
	font-size: 0.7rem !important;
	}
	.progressBar4 span.success{
	font-size: 0.7rem !important;
	}
	
	.icon{
	margin-right: 0.75rem !important;
	height: 21px !important;
	}
	.icon2{
	margin-right: 0.75rem !important;
	height: 28px !important;
	}
}


 

@media (max-width: 767px) {
	
  /* Rules for tablets and smaller viewports */
  body{
	  font-size:0.6rem;
  }
  
 
	
  #navigation{
	  font-size:0.5rem;
  }
  
  .myNav:hover{
		border-bottom: .15rem solid #8080804d !important;
		border-top: .15rem solid #8080804d !important;
	}
	.myNav.active{
		border-bottom: .15rem solid #ffffff !important;
		border-top: .15rem solid #ffffff !important;
	}
	

	div[class^="progressBar"]{
	  font-size:0.5rem !important;
	  margin-bottom:0.6em !important;
	  width:28px !important;
	}

	.barOverflow{ /* Wraps the rotating .bar */
	  width: 28px !important;
	  height: 14px !important; /* Half circle (overflow) */
	  margin-bottom: -7px !important; /* bring the numbers up */
	}
	.bar{
	  width: 28px !important;
	  height: 28px !important; /* full circle! */
	  border-width: 2px !important;     /* half gray, */
	}
	
	.progressBar1 span.success{
	font-size: 0.6rem !important;
	}
	.progressBar2 span.success{
	font-size: 0.6rem !important;
	}
	.progressBar3 span.success{
	font-size: 0.6rem !important;
	}
	.progressBar4 span.success{
	font-size: 0.6rem !important;
	}
	
	.icon{
	margin-right: 0.5rem !important;
	height: 21px !important;
	}
	.icon2{
	margin-right: 0.5rem !important;
	height: 24px !important;
	}
}


.text-white{
  color:#ffffff;
}
.text-blue{
  color:#2aace3;
}
.text-black{
  color:#000000;
}

.navbar{
	
	  display: flex;
  flex-flow:  row nowrap;
  /* This aligns items to the end line on main-axis */
  justify-content: flex-end;
}

#sidebar.isOut{
	margin-left:0px !important;

}

/* width */
::-webkit-scrollbar {
  width: 9px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #d0d2d1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #a7a9ac;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #878c94;
}

span.item_menu {
	min-height: 60px;
    align-items: center;
    display: flex;
	max-width: 60px;
}



#menu_download_pdf,#menu_help,#menu_fullscreen,#menu_exit{
	
	height:60px;
	max-width:60px;
}

#logo_airbus{
	
	height:60px;
	flex: 0 1 60px;
    max-width: 70px;
}



.border-bottom-blue{
	border-bottom:#00b9ff;

}

/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


#nav-bottom {
	-webkit-transition: margin-left 0.45s, padding-bottom 0.25s;
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    flex-flow: column; /*  row wrap */
    overflow-x: hidden;
    overflow-y: hidden;
    justify-content: space-between;
    padding-left: 6px;
    padding-right: 6px;
    bottom: 0;
    left: 50%;
    margin-left: -150px;
   /* margin-bottom: 20px;*/
   /* padding-bottom: 4px;*/
    padding-top: 5px;
}

@media(hover: hover) and (pointer: fine) {
    #arrow-right:hover {
         color:#f05c2b;
    }
}

 
 @media(hover: hover) and (pointer: fine) {
    #arrow-left:hover {
         color:#f05c2b;
    }
}

#arrow-right.hover-forced {
	color: #F05C2B !important;
    --animate-repeat: infinite;
    --animate-duration: 2.1s;
    animation-name: headShake;
    -webkit-animation-name: headShake;
    animation-duration: var(--animate-duration);
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-duration: var(--animate-duration);
    animation-duration: var(--animate-duration);
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
#arrow-left{
	padding-left:0.2em;
	padding-right: 0.2em;
	cursor: pointer;
	font-size:70px;
	color:#345c84;
	font-weight:500;
	font-family: 'Open Sans';
	padding-bottom: 15px;
}
#arrow-right{
	padding-left:0.2em;
	padding-right: 0.2em;
	cursor: pointer;
	font-size:70px;
	color:#345c84;
	font-weight:500;
	font-family: 'Open Sans';
	padding-bottom: 15px;
}

#nav-bottom #customizeHome .interpuce.passed {
	color: #65767d !important;
}

#nav-bottom #customizeHome .interpuce {
	
	/*font-size: 14px;
	margin-left: 7.5px;
    margin-right: 7.5px;*/
    color: #92a1a8;
    align-content: center;
    text-align: center;
	border-bottom: 2px solid;
	width: 20px;
	flex: 100 100 20px;
	-webkit-transition: color 0.4s;
}

@-webkit-keyframes flipInX2{
	0%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg)}
	40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg)}
	60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}
	80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}
	to{-webkit-transform:perspective(400px);transform:perspective(400px)}}

@keyframes flipInX2{
	0%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg)}
	40%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg)}
	60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}
	80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}
	to{-webkit-transform:perspective(400px);transform:perspective(400px)}}
	
.animate__flipInX2{-webkit-animation-name:flipInX2;animation-name:flipInX2;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}


#nav-bottom #customizeHome .puce.selected {
	width: 35px !important;
    height: 35px !important;
    padding-top: 4.5px !important;
    font-weight: 700 !important;
	font-size: 15px;
}

#nav-bottom #customizeHome .puce:hover{
	background-color:#65767d;
}

#nav-bottom #customizeHome .puce.passed {
	background-color: #65767d !important;
}

#nav-bottom #customizeHome .puce {
	
	font-size: 12px;
	/*margin-left: 7.5px;
    margin-right: 7.5px;*/
    cursor: pointer;
    border-radius: 100%;
    background-color: #92a1a8;
    color: #ffffff;
    align-content: center;
    text-align: center;
    width: 25px;
    height: 25px;
	/*animation-delay: 0.05s;*/
	padding:2.5px;
	-webkit-transition: width 0.15s, height 0.15s, font-weight 0.15s, padding-top 0.15s, background-color 0.4s;
}
#nav-bottom #customizeHome {
    -webkit-transition: width 0.45s;
	background: linear-gradient(90deg, #f0efee, #f7f6f6);
    color: white;
    border-radius: 30px 30px;
    width: 100%;
    height: 2.6rem;
	/*max-height:70px;*/
    text-align: left;
    align-items: center;
    flex-flow: nowrap; /*nowrap  */
    padding-right: 1%;
    padding-left: 1%;
    padding-bottom: 5px;
    padding-top: 5px;
    display: flex;
	box-shadow: 0 .1rem 0.5rem rgba(0,0,0,.55)!important;
	justify-content: space-between;
}

#textBottomCenter {
    color: white;
    font-size: 1.0rem;
    font-family: Roboto;
	-webkit-transition: margin-left 0.45s, padding-bottom 0.25s;
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    flex-flow: column;
    justify-content: space-between;
    bottom: 0;
    left: 50%;
    margin-left: -200px;
    /* margin-bottom: 20px; */
    padding-bottom: 47px;
    width: 400px;
	text-shadow: 0px 1px 4px #000000;
}
#background.black
{
	background-color: #1379ab;
}

#background.blue
{
	background-color: #238EC2;
}
#background.orange
{
	background-color: #f05c2b;
}
#background.darkBlue
{
	background-color: #1379ab;
}

#background{
	color:black;
	cursor:pointer;

/*
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2000' height='2000' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke-opacity='0.1'%3E%3Cg stroke='%23295789' stroke-width='17'%3E%3Cline x1='-8' y1='-8' x2='808' y2='808'/%3E%3Cline x1='-8' y1='792' x2='808' y2='1608'/%3E%3Cline x1='-8' y1='-808' x2='808' y2='8'/%3E%3C/g%3E%3Cg stroke='%23295484' stroke-width='16'%3E%3Cline x1='-8' y1='767' x2='808' y2='1583'/%3E%3Cline x1='-8' y1='17' x2='808' y2='833'/%3E%3Cline x1='-8' y1='-33' x2='808' y2='783'/%3E%3Cline x1='-8' y1='-783' x2='808' y2='33'/%3E%3C/g%3E%3Cg stroke='%2329517f' stroke-width='15'%3E%3Cline x1='-8' y1='742' x2='808' y2='1558'/%3E%3Cline x1='-8' y1='42' x2='808' y2='858'/%3E%3Cline x1='-8' y1='-58' x2='808' y2='758'/%3E%3Cline x1='-8' y1='-758' x2='808' y2='58'/%3E%3C/g%3E%3Cg stroke='%23294e7a' stroke-width='14'%3E%3Cline x1='-8' y1='67' x2='808' y2='883'/%3E%3Cline x1='-8' y1='717' x2='808' y2='1533'/%3E%3Cline x1='-8' y1='-733' x2='808' y2='83'/%3E%3Cline x1='-8' y1='-83' x2='808' y2='733'/%3E%3C/g%3E%3Cg stroke='%23294b75' stroke-width='13'%3E%3Cline x1='-8' y1='92' x2='808' y2='908'/%3E%3Cline x1='-8' y1='692' x2='808' y2='1508'/%3E%3Cline x1='-8' y1='-108' x2='808' y2='708'/%3E%3Cline x1='-8' y1='-708' x2='808' y2='108'/%3E%3C/g%3E%3Cg stroke='%23284871' stroke-width='12'%3E%3Cline x1='-8' y1='667' x2='808' y2='1483'/%3E%3Cline x1='-8' y1='117' x2='808' y2='933'/%3E%3Cline x1='-8' y1='-133' x2='808' y2='683'/%3E%3Cline x1='-8' y1='-683' x2='808' y2='133'/%3E%3C/g%3E%3Cg stroke='%2328456c' stroke-width='11'%3E%3Cline x1='-8' y1='642' x2='808' y2='1458'/%3E%3Cline x1='-8' y1='142' x2='808' y2='958'/%3E%3Cline x1='-8' y1='-158' x2='808' y2='658'/%3E%3Cline x1='-8' y1='-658' x2='808' y2='158'/%3E%3C/g%3E%3Cg stroke='%23274367' stroke-width='10'%3E%3Cline x1='-8' y1='167' x2='808' y2='983'/%3E%3Cline x1='-8' y1='617' x2='808' y2='1433'/%3E%3Cline x1='-8' y1='-633' x2='808' y2='183'/%3E%3Cline x1='-8' y1='-183' x2='808' y2='633'/%3E%3C/g%3E%3Cg stroke='%23274062' stroke-width='9'%3E%3Cline x1='-8' y1='592' x2='808' y2='1408'/%3E%3Cline x1='-8' y1='192' x2='808' y2='1008'/%3E%3Cline x1='-8' y1='-608' x2='808' y2='208'/%3E%3Cline x1='-8' y1='-208' x2='808' y2='608'/%3E%3C/g%3E%3Cg stroke='%23263d5e' stroke-width='8'%3E%3Cline x1='-8' y1='567' x2='808' y2='1383'/%3E%3Cline x1='-8' y1='217' x2='808' y2='1033'/%3E%3Cline x1='-8' y1='-233' x2='808' y2='583'/%3E%3Cline x1='-8' y1='-583' x2='808' y2='233'/%3E%3C/g%3E%3Cg stroke='%23253a59' stroke-width='7'%3E%3Cline x1='-8' y1='242' x2='808' y2='1058'/%3E%3Cline x1='-8' y1='542' x2='808' y2='1358'/%3E%3Cline x1='-8' y1='-558' x2='808' y2='258'/%3E%3Cline x1='-8' y1='-258' x2='808' y2='558'/%3E%3C/g%3E%3Cg stroke='%23243754' stroke-width='6'%3E%3Cline x1='-8' y1='267' x2='808' y2='1083'/%3E%3Cline x1='-8' y1='517' x2='808' y2='1333'/%3E%3Cline x1='-8' y1='-533' x2='808' y2='283'/%3E%3Cline x1='-8' y1='-283' x2='808' y2='533'/%3E%3C/g%3E%3Cg stroke='%23233550' stroke-width='5'%3E%3Cline x1='-8' y1='292' x2='808' y2='1108'/%3E%3Cline x1='-8' y1='492' x2='808' y2='1308'/%3E%3Cline x1='-8' y1='-308' x2='808' y2='508'/%3E%3Cline x1='-8' y1='-508' x2='808' y2='308'/%3E%3C/g%3E%3Cg stroke='%2322324b' stroke-width='4'%3E%3Cline x1='-8' y1='467' x2='808' y2='1283'/%3E%3Cline x1='-8' y1='317' x2='808' y2='1133'/%3E%3Cline x1='-8' y1='-333' x2='808' y2='483'/%3E%3Cline x1='-8' y1='-483' x2='808' y2='333'/%3E%3C/g%3E%3Cg stroke='%23212f47' stroke-width='3'%3E%3Cline x1='-8' y1='342' x2='808' y2='1158'/%3E%3Cline x1='-8' y1='442' x2='808' y2='1258'/%3E%3Cline x1='-8' y1='-458' x2='808' y2='358'/%3E%3Cline x1='-8' y1='-358' x2='808' y2='458'/%3E%3C/g%3E%3Cg stroke='%23202d42' stroke-width='2'%3E%3Cline x1='-8' y1='367' x2='808' y2='1183'/%3E%3Cline x1='-8' y1='417' x2='808' y2='1233'/%3E%3Cline x1='-8' y1='-433' x2='808' y2='383'/%3E%3Cline x1='-8' y1='-383' x2='808' y2='433'/%3E%3C/g%3E%3Cg stroke='%231F2A3E' stroke-width='1'%3E%3Cline x1='-8' y1='392' x2='808' y2='1208'/%3E%3Cline x1='-8' y1='-408' x2='808' y2='408'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;*/


    width: 100%;
    position: absolute;
    z-index: -1;
    display: flex;
    align-items: center;
    flex-flow: column;
	overflow-x: hidden;
	overflow-y: auto;
	justify-content: center;
	min-height: -webkit-fill-available;
	height:100%;
	
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5;
	animation-delay: 0.5;
	
	-webkit-transition: background-color 600ms ease-out;
    -moz-transition: background-color 600ms ease-out;
    -o-transition: background-color 600ms ease-out;
	transition: background-color 0.6s ease;
}
#blackout{
	cursor:pointer;
	background: #000000bd;
    width: 100%;
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    flex-flow: column;
	overflow-x: hidden;
	overflow-y: auto;
	justify-content: center;
	min-height: -webkit-fill-available;
	height:100%;
}



#terms{
	cursor:pointer;
	background: #e7e6e5d6;
    width: 100%;
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    flex-flow: column;
	overflow-x: hidden;
	overflow-y: auto;
	justify-content: center;
	padding-top:1%;
	padding-bottom:1%;
	min-height: -webkit-fill-available;
	height:100%;
}
#terms>#terms-text>.title {
	margin-top:1rem;
	margin-bottom:0.1rem;
	font-weight:600;
}
#terms>#terms-text {
	color:#345c84;
	font-size:1.2em;
	font-family:Roboto;
    background: #ffffff;
    max-width: 900px;
	width:90%;
    z-index: 4;
    overflow-x: hidden;
    overflow-y: auto;
	padding: 0em 2em 1em 2em;
    min-width: 300px;
	border-radius: 30px 30px 30px 30px;
	line-height: 1.1rem;
}
#terms-text>#terms-titre {
	color:#F05C2B;
	font-weight: bold;
	font-size:1.2em;
	font-family:Roboto;
	padding-top:0.8em;
	padding-bottom:0.9em;
	display:block;
	}


#choice-lang #terms-of-use{
	cursor:pointer;
}


_:-ms-fullscreen, :root .ie11up { 
property: value; 
}


#choice-lang{
	background: linear-gradient(90deg, #f0efee, #f7f6f6);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    flex-flow: column;
	overflow-x: hidden;
	overflow-y: auto;

}

.choice-space1{
	flex: 100 0 0px;
	
}

.choice-space2{
	flex: 400 400 50px;
	
}

#choose-lang
{
	font-style:normal;
	font-size: 1.4em;
	font-family: Oswald;
	color:#345c84;
	padding-top:0.8%;
	padding-bottom:0.8%;
}

	
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
#lang-list {
flex:0 0 200px;
}
}

#lang-list {
	height: min-content;
	width:100%;
    max-width: 700px;
    display: flex;
    align-items: center;
    flex-flow: row wrap;
    min-width: 400px;
    justify-content: center;
}


.box-lang{
	color:#345c84;
	font-size: 1.1em;
	font-family: Oswald;
    background: #dadcdb;
    text-align: center;
    padding: 0.6em;
    margin: 5px;
    min-width: 146px;
	cursor:pointer;
}

.box-lang.active{
    background: #0b4d78;
    color:white;
}


.box-validate{	
	flex:0 0 25px;
    font-family: Oswald-Regular;
	font-style: normal;
	font-size:1.1em;
    background: #0b4d78;
    text-align: center;
	padding: 0.6em;
	margin-top: 1% !important;
    margin: 10px;
    min-width: 146px;
	cursor:pointer;
	color:white;
	font-weight: 300;
	border:0;
}

#choice-lang>#choice-term{
	font-size: 1em;
	font-family: Roboto;
	color:#345c84;
	padding-top:0%;
	text-align: center;
}
#choice-lang>#choice-copyright{
	font-size: 1em;
	font-family: Roboto;
	color:#345c84;
	padding-bottom:0.2%;
	text-align: center;
}

.splash-title{
	
font-size: 1.6em;
font-family: Roboto;
font-weight: bold;
line-height: 1.2;
}

#sidebar{
	
	max-width: 500px;
	margin-left:-500px;
	z-index:1;
	left:0px;
    transition: margin-left 0.30s ease-out;
	margin-right: 14px;
	padding-top:60px;
	padding-right:1px;
	background: linear-gradient(90deg, #f0efee, #f7f6f6);
	line-height: normal;
	background-size: cover;
    background-position: center;
	cursor: auto;
	position: absolute;
	overflow-x: hidden;
	overflow-y: scroll;
	font-size: 1.2em;
}

.pointer{
	
cursor:pointer;
}
.container-fluid{
	display: flex;
	flex-flow: row;
	padding-left:0;
	padding-right: 0;
	align-items: center;
	background: linear-gradient(90deg, #f0efee, #f7f6f6);
	height: 60px;
	z-index: 2;
}


.saturate0{
	filter: sepia(100%) hue-rotate(188deg) saturate(100%) opacity(70%);
	 -webkit-filter: grayscale(100%);
	 -ms-filter-filter: gray;

}
.saturate1{
	filter: saturate(100%) opacity(100%);
}

/* 
  .tooltip .tooltip-inner {
    background-color: #0d507c !important;
  }

  .tooltip-inner:before {
    border-bottom-color: #0d507c !important;
	 background-color: #0d507c !important;
   color: #0d507c !important;
  }

.tooltip-inner::before {
   border-top-color: #0d507c !important;
}
 */

.container-fluid > div, .container-fluid > span, .container-fluid > img{
	
	border-left:1px solid #cccccc7d
}

.space{
	flex: 1 1 10px;
}
.titres{
    padding-left: 1.4em;
    display: flex;
    flex-flow: column wrap;
    height: 60px;
}

.titre2{
	font-family: Oswald-Medium;
	color:#f05c2b;
	font-size: 1.0rem;
	padding-left: 0.6rem;
	 line-height:normal;
	}

.titre1{
	font-family: Oswald-Medium;
	color:#345c84;
	font-size: 1.0rem;
	  text-transform: uppercase;
	  line-height:normal;
	}






#resourceButton{
  font-size: 1.2em;
  color:#ffffff;
  font-weight: 500;
  cursor: pointer;
  border-left: 1px solid #656a81;
}
#homeButton{
  font-size: 1.2em;
  color:#ffffff;
  font-weight: 500;
  cursor: pointer;
  border-left: 1px solid #656a81;
}
#page-title{
  font-size: 1.4em;
  font-weight: 500;
  padding-top:0.1rem;
}
#page-title2{
  padding-bottom:0.15rem;
  font-size: 1.3em;
  font-weight: 500;
}

.copyright{
  font-size: 0.7em;
  color:#000000;
}

#safran{
	height: 45px;
    margin-right: 20px;
	margin-bottom: 15px;
	position: fixed;
    right: 0;
    bottom: 0;
    /* left: 0; */
    z-index: 998;
}


.progress>div{
	transition: width 0s !important;
	background-color:#f05c2b;
}

.icon{
	margin-right: 1.5rem;
	height: 21px;
}
.iconAndroid{
	height: 24px;
}

.icon_home{
	padding-right: 3px !important;
	width: fit-content;
	height: 20px;
	filter: sepia(100%) hue-rotate(167deg) saturate(100%) opacity(100%);
}

.icon-print{
	margin-right: 1.5rem;
	height: 35px;
	}

body{
	font-family: 'Oswald', sans-serif !important;
	overflow-x: hidden;
	overflow-y: hidden;
	imgMaxWidth: 100px;
	imgMaxHeight: 100px;
	innerWidthSide: 100px;
}

.animate__animated.animate__delay__05s{-webkit-animation-delay:0.25s;animation-delay:0.25s;-webkit-animation-delay:calc(var(--animate-delay)*0.25);animation-delay:calc(var(--animate-delay)*0.25)}

#homeChoice
{
	/* d-flex  */
	opacity:0;
	z-index:999;
	margin-top:0px;
	display: none;
	cursor:pointer;
}
#homeChoice.active
{
	z-index:999;
	opacity:1;
	display: flex !important;
}

#CNPE{
	min-height:30px;
}
#menu{

	background: linear-gradient(to right, #f0efee, #fefefe, #f0efee);
	height:60px;
}
#footer{
	/*max-height:70px;
	min-height:70px;*/
	background-color:#f4f4f4;
	height:50px;
	border-bottom: 4px solid #2aace3;
	position: fixed;
    right: 0;
    bottom: 0;
	z-index: 997;
}
#chevronCollapse{
	transform: rotate(180deg);
	transition-duration: 0.25s;
}
#chevronCollapse.rotate{
	transform: rotate(0deg);
	transition-duration: 0.25s;
}

.background_grey {
  background-color:#f4f4f4;
}

.background_blue_dark {
  background-color:#484e68;
}

.linear-gradient .col {
  padding-right:0!important;
}

.version{
	color:#00000059;
}

.myNav{
	color:#ffffff;
	padding: 0.15rem !important;
	text-decoration: none;
}
.myNav:hover{
	color:#ffffff;
	padding: 0.15rem !important;
	text-decoration: none;
	border-bottom: .25rem solid #8080804d;
	border-top: .25rem solid #8080804d;
}
.myNav.active{
	font-weight: 700;
	border-bottom: .25rem solid #ffffff;
	border-top: .25rem solid #ffffff;
}

.btn:focus, .btn:visited, .btn:active, .btn:active:focus{
  outline: none !important;
  box-shadow: none !important;
  background-color: #343a40 !important;   
}
.btn:hover{
	background-color: #212529 !important;   
}
.btn.active{
	background-color: #e2b502 !important;
}

.btn-default, .btn-default:hover, .btn-default:active, .btn-default:active:focus, .btn-default:visited, .btn-default:focus
{     color: white !important;     background-color: #212529 !important;         outline: none !important;  }

main > .container {
  padding: 60px 15px 0;
}

.border-right-black, .border-right-black:disabled{
border-right-color: #1a1c1f;	
}

.border-left-black, .border-left-black:disabled{
border-left-color: #1a1c1f;		
}

.navbar{
	height:3rem;
}
.nav-link{
	color: rgba(255, 255, 255, 1) !important;
}

#container{
	-webkit-transition: background-color 500ms ease-out;
    -moz-transition: background-color 500ms ease-out;
    -o-transition: background-color 500ms ease-out;
	transition: background-color 0.5s ease;
	background-color: #dcdcdc00;   	
	transition-delay: 250ms;
	position: fixed;
}

.footer {
  height:3rem;
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.btn-group {
  height:3rem;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

.darker{
transition:  0.25s all ease-out;	
filter:brightness(80%);
-webkit-filter:brightness(80%);
}


code {
  font-size: 80%;
}


#loader_iframe{
overflow:hidden;
/* height:var(imgMaxHeight); */
/* width: var(--imgMaxWidth); */
}

#loader_iframe_home{
 background:transparent;
  cursor: pointer;
}




.navbar {

   /*padding: 15px 10px;*/
    background: #fff;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
    display: flex;
    width: 100%;
	/*height:100%;*/
    align-items: stretch;
	background-color: #ffffff;
}

.menu-progress {
    display: -ms-flexbox;
    display: flex;
    height: 1rem;
    overflow: hidden;
    line-height: 0;
    font-size: 0.75rem;
    background-color: #666666;
    border-radius: 0rem;
}
	
.menu-progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #2aace3;
}

.menu-item .text{
	margin-left: 1rem;
}



@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
.menu-item{
	padding-top:18px;	
   /* IE10+ specific styles go here */  
}
 
}

.collapseForce{
	display:none !important;
}
.menu-item{
	border-left:5px solid #c1c1c1;
	border-bottom: 1px solid #cccccc3d;
	font-family: Oswald-Medium;
    color: #345c84;
    font-size: 0.9rem;

	align-content: center;
	min-height: 56px;

	padding-left:10px;
	padding-right:10px;
	cursor: pointer;
	
	/*padding-top:5px;
	padding-bottom:5px;*/
}


.menu-item.viewed{
	border-left:5px solid #4bd92f;
}
.menu-item.selected{
	border-left:5px solid #f05c2b !important;
	background-color:#d7d7d724;
}
.menu-item:hover{
	background-color:#d7d7d747;
}
.menu-item>div.col{
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:10px;
}

.menu-rubrique{
	border-left:5px solid #d7d7d724;
	border-bottom: 1px solid #cccccc3d;
	font-family: Oswald-Medium;
    color: #345c84;
    font-size: 0.9rem;

	align-content: center;
	min-height: 56px;

	padding-left:10px;
	padding-right:10px;
	cursor: pointer;
	
	/*padding-top:5px;
	padding-bottom:5px;*/
}
.menu-rubrique>div.col{
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:10px;
}

.menu-rubrique2>div.col{
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:10px;
}
.menu-rubrique2{
	font-weight: 700;
	/*background-color:;*/
	color:#000000;
	padding-left:10px;
	padding-right:10px;
	/*padding-top:5px;
	padding-bottom:5px;*/
	border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
}
.menu-rubrique2>div.item-puce{
	background-color: #dedede;
	max-width:45px;
	max-height:15px;
	width:45px;
	height:15px;
	margin-right:5px;
	margin-top: 11px;
}
.menu-item.unfold{
display:none;
}

.menu-item>div.col.active{
	/*background-color: #484e68;
	color: #ffffff !important;*/
}



.menu-item>div.item-puce{
	background-color: #666666;
	max-width:15px;
	max-height:15px;
	width:15px;
	height:15px;
	margin-right:5px;
	margin-top: 11px;
}
.menu-item>div.item-puce.active{
	background-color: #2aace3;
	max-width:15px;
	max-height:15px;
	width:15px;
	height:15px;
	margin-right:5px;
}
.rubrique{
	font-weight: 700;
	margin-top:15px;
	margin-bottom:15px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.125) !important;
}


.list-group-item {
    position: relative;
    display: block;
    padding: 0.75rem 1.25rem;
    background-color: #fff;
	border: 0 !important;
}	
.list-group-item.active {
    z-index: 2;
    color: #fff;
    background-color: #2aace3;
    border-color: #007bff;
/* scroll behavior on html */
}
html {
  scroll-behavior: smooth;
}


#CLOSEBTN{
	
	display:none;
}

/* scrollbar styling non-standard version */
#texteVoixOffConcat::-webkit-scrollbar {
  width: 0.8rem;
  background-color: rgba(0,0,0,0.2);  
}

#texteVoixOffConcat::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.25);  
	border-radius: 0px;
	width: 0.8rem;
}

#texteVoixOffConcat::-webkit-scrollbar-track {
	border-radius: 0px;
	width: 0.8rem;
}

/* scrollbar styling standard version */
#texteVoixOffConcat {
	scrollbar-color: #f4f4f4;
	padding-right: 0.4rem;
	padding-top:2px;
	padding-bottom:5px;
	overflow-y: auto !important;
	/*height: var(imgMaxHeight);*/
	word-break: break-word;
	scrollbar-width: 0.8rem;
}


#texteVoixOffConcat>div,#texteVoixOffConcat>div>ul {
  margin-top:0.15rem !important;
  margin-bottom: 0.15rem !important;
}

#texteVoixOffConcat>div.new {
	opacity:1;
	color:#000000;
	transition: all 0.5s;
	background-color:#ffffffe0;
}
#texteVoixOffConcat>div.bg-flash {
	opacity:0.4;
	color:#000000;
	transition: all 0.5s;
	background-color:#007bff70;
}

#texteVoixOffConcat>div.old {
  opacity:1;
  color: #6e89b2;
  transition: all 0.5s;
  
}

#texteVoixOffConcat>div>ul {
  padding-inline-start: 0.9rem;
}

#texteVoixOffConcat>div>ul>li:first-child {
  margin-top:0.4rem!important;
}

#texteVoixOffConcat>div>ul>li {
  margin-top:0.2rem;
}



#barsAndroid
{
	background-color:#484e68;
	width: 100%;
}




#sidebar .sidebar-header {
    padding: 20px;
    background: #6d7fcc;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #47748b;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar ul li a:hover {
    color: #7386D5;
    background: #fff;
}

.project-title {
    font-size: 1.5em;
}




.bars{
	margin-right: 0.3em;
	border-bottom: 4px solid #2aace3;
    padding-top: 2rem;
    padding-left: 20px;
}

.print{
	margin-left: 20px;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #6d7fcc;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

a.download {
    background: #fff;
    color: #7386D5;
}

a.article,
a.article:hover {
    background: #6d7fcc !important;
    color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
	height:100%;
    padding: 0px;
    
    transition: all 0.3s;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
/*
@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
		width:0px;
    }
    #sidebar.active {
        margin-left: 0;
		width:250px;
    }
    #sidebarCollapse span {
        display: none;
    }
}*/

#sidebarCollapse {
       cursor:pointer;

    }
	
	
	
.dropdown-item.active, .dropdown-item:active {
  /*  color: #000000;
    text-decoration: none;
	background-color: #2aace333;*/
}
	
.dropdown-item:hover{
    color: #000000;
    text-decoration: none;
	background-color:#2aace333;
}
		
		

	
.dropdown-menu  {
    width:250px;
    top: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    float: left !important;
    min-width: 10rem !important;
    padding: 0.5rem 0 !important;
	margin-top: 3.1rem !important;
	margin-right: 0.1rem !important;
    font-size: 1rem !important;
    color: #212529 !important;
    text-align: left !important;
    list-style: none !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
    border-radius: 0.3rem  0.3rem  0.3rem  0.3rem !important;
}
	
.borderBottomHome{ /* Wraps the rotating .bar */
  border-bottom: 2px solid #2aace3;     /* half gray, */
}	

.border-bottom-blue-dark{ /* Wraps the rotating .bar */
  border-bottom: 3px solid #484e68;     /* half gray, */
}

.border-bottom-blue{ /* Wraps the rotating .bar */
  border-bottom: 3px solid #2aace3;     /* half gray, */
}

div[class^="progressBar"]{
  position: relative;
  font-size:0.6rem;
  color:#27b818; /* color:#27b818;#adb5bd*/
  width:36px;
  margin-bottom:0.6em;
}

.barOverflow{ /* Wraps the rotating .bar */
  position: relative;
  overflow: hidden; /* Comment this line to understand the trick */
  width: 36px; height: 18px; /* Half circle (overflow) */
  margin-bottom: -9px; /* bring the numbers up */
}
.bar{
  position: absolute;
  top: 0; left: 0;
  width: 36px; height: 36px; /* full circle! */
  border-radius: 50%;
  box-sizing: border-box;
  border: 4px solid #ccc;     /* half gray, */
  border-bottom-color: #27b818;  /* half azure */
  border-right-color: #27b818;
}

.progressBar1 span.success{
	font-size: 1rem;
}
.progressBar2 span.success{
	font-size: 1rem;
}
.progressBar3 span.success{
	font-size: 1rem;
}
.progressBar4 span.success{
	font-size: 1rem;
}

