.ei_contener header.hero {
	background:#97c8ff
}

.ei_contener header.hero.solo .banner div {
	padding: 6rem 0;
}

.body .hero.solo .banner {
	padding-top:5rem;
	padding-bottom:7rem;
}


/* tooltip */

.tool-wrapper .tip {
	background: #f3f3f3;
}

.tool-wrapper {
	width: 30px;
	position: absolute;
	display: inline-block;
	right: 0px;
	top: 15px;
}

.tooltip_templates:before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #fff transparent;
	position: absolute;
	transform: translateX(-50%);
	left: 50%;
	top: -6px;
}

.tooltip {
	font-size: 14px;
	border: none;
	background: none;
}
.tip {
	padding: 3px 9px;
	font-size: 12px;
	background: white;
	border-radius: 20px;
	color: #000;
	margin-right: 5px;
	position: relative;
}
.tooltip_templates {
	display: none;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	background: white;
	z-index: 30000;
	box-shadow: 0 0 10px 6px rgba(0, 0, 0, .1);
	color: #414141;
	line-height: 18px;
	padding: 15px;
	width: 170px;
	text-align: center;
	font-size: 0.85em;
	top: 30px;
}
.tool-wrapper .tooltip_templates {
	width: 270px;
}

.tooltip_templates p:first-of-type {
	margin-top: 0;
}

.tooltip_templates p {
	font-size: 0.85em;
	line-height: 18px;
	color:#444 !important
}

/* Bouton demande */

#faire_demande span.shape {
	height: 54px;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

#faire_demande span span {
	content:"";
	position: absolute;
	margin: auto;
	height: 10px;
	width: 2px;
	background: #007c82;
	opacity: 0;
}
#faire_demande span span:nth-of-type(1) {
	top: -20px;
	left: 0;
	right: 0;
}

#faire_demande span span:nth-of-type(2) {
	bottom: -20px;
	left: 0;
	right: 0;
}

#faire_demande span span:nth-of-type(3) {
	top:0;
	bottom: 0;
	left: -10px;
}

#faire_demande span span:nth-of-type(4) {
	top:0;
	bottom: 0;
	right: -10px;
}

#faire_demande span span:nth-of-type(5) {
	top: -20px;
	left: -70%;
	right: 0;
	transform:rotate(-30deg);
}

#faire_demande span span:nth-of-type(6) {
	top: -20px;
	left: 0;
	right: -70%;
	transform:rotate(30deg);
}
#faire_demande span span:nth-of-type(7) {
	bottom: -20px;
	right: 0;
	left: -70%;
	transform:rotate(30deg);
}
#faire_demande span span:nth-of-type(8) {
	bottom: -20px;
	left: 0;
	right: -70%;
	transform:rotate(-30deg);
}

@keyframes bounce {
	0%{transform: scale(1);}
	50%{transform: scale(1.1);}
	100%{transform: scale(1);}
}

#faire_demande.active {
	animation: bounce 0.2s ease-out 1;
}

#faire_demande.active span span:nth-of-type(1) {
	animation: anim1 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(2) {
	animation: anim2 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(3) {
	animation: anim3 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(4) {
	animation: anim4 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(5) {
	animation: anim5 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(6) {
	animation: anim6 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(7) {
	animation: anim7 0.4s ease-out 1;
}
#faire_demande.active span span:nth-of-type(8) {
	animation: anim8 0.4s ease-out 1;
}

@keyframes anim1 {
	0%{transform: scaleY(0.5);opacity: 0;}
	50%{transform: translateY(-10px) scaleY(1.4); opacity: 1;}
	100%{transform: translateY(-20px) scaleY(0.5);opacity: 0;}
}
@keyframes anim2 {
	0%{transform: scaleY(1);opacity: 0;}
	50%{transform: translateY(10px) scaleY(1.4); opacity: 1;}
	100%{transform: translateY(20px) scaleY(0.5);opacity: 0;}
}
@keyframes anim3 {
	0%{transform: rotate(90deg) scaleX(0.5);opacity: 0;}
	50%{transform: rotate(90deg) translateY(10px) scaleX(1.4); opacity: 1;}
	100%{transform: rotate(90deg) translateY(20px) scaleX(0.5);opacity: 0;}
}
@keyframes anim4 {
	0%{transform: rotate(90deg) scaleX(0.5);opacity: 0;}	
	50%{transform: rotate(90deg) translateY(-10px) scaleX(1.4); opacity: 1;}
	100%{transform: rotate(90deg) translateY(-20px) scaleX(0.5);opacity: 0;}
}
@keyframes anim5 {
	0%{transform: rotate(-30deg) scaleY(0.5);opacity: 0;}
	50%{transform: rotate(-30deg) translateY(-8px) scaleY(1.4); opacity: 1;}
	100%{transform: rotate(-30deg) translateY(-16px) scaleY(0.5);opacity: 0;}
}
@keyframes anim6 {
	0%{transform: rotate(30deg) scaleY(0.5);opacity: 0;}
	50%{transform: rotate(30deg) translateY(-8px) scaleY(1.4); opacity: 1;}
	100%{transform: rotate(30deg) translateY(-16px) scaleY(0.5);opacity: 0;}
}
@keyframes anim7 {
	0%{transform: rotate(30deg) scaleY(0.5);opacity: 0;}
	50%{transform: rotate(30deg) translateY(8px) scaleY(1.4); opacity: 1;}
	100%{transform: rotate(30deg) translateY(16px) scaleY(0.5);opacity: 0;}
}
@keyframes anim8 {
	0%{transform: rotate(-30deg) scaleY(0.5);opacity: 0;}
	50%{transform: rotate(-30deg) translateY(8px) scaleY(1.4); opacity: 1;}
	100%{transform: rotate(-30deg) translateY(16px) scaleY(0.5);opacity: 0;}
}
.tableau, #resultats_aes {
	position:relative;
}
:focus-visible{
	outline: 4px solid #0c4789;
}
h1 span:first-of-type {
	color:#0c4789;
}
.hero .flex div.banner h1 {
	color: #0c4789;
}
.hero .flex div.banner .h2 {
	color: #0c4789;
}
.hero .flex div.banner .h3 {
	color: #0c4789;
	font-size:1rem;
	margin-bottom:1rem
}
.sim {
	background-color: #fff;
}
input {
	height: 60px;
	width: 100%;
	border: none;
	font-size: 2rem;
	padding: 3rem;
	font-weight: bold;
	color: #0c4789;
	background:none;
	text-align: center;
	border: 1px solid #0c4789;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input {
	font-size: 3.5rem;
	border-radius:5px;
}
.selectionne .ei_gly_ic_check_circle {
	display:block !important;
}
.ei_gly_ic_check_circle {
	left: -15%;
	width:50px;
}
#boutons_simulez {
	width:70%;
	margin: 0 auto;
	position: absolute;
	bottom: -45px;
	display:block;
	text-align:center;
}
#simuler .d a {cursor:pointer;
	position:relative;
	padding-right:20px;
	margin-bottom:0.5rem;
	display:inline-block
}
#simuler .d a .icon:after {
	font-family: fts_commun;
	content: "\EA46";
	position: absolute;
	text-decoration: none;
	font-size: 1rem;
	top: 2px;
	right: 0;
	text-indent: 0;
	text-decoration: none;
}
#faire_demande, #AESsimulerTop {
	width: 50%;
	margin: 0 auto;
	cursor:pointer;
	position: absolute;
	bottom: -1.75rem;
	display:block;
	padding-top: 1rem;
	padding-bottom:1rem;
	font-size: 1.2rem;
	text-align:center;
	text-decoration:none;
	transition: .2s ease;
}
#AESsimuler, #AEScapacites{
	padding-top: 1rem;
	padding-bottom:1rem;
	font-size: 1.2rem;
	text-align:center;
	text-decoration:none;
	margin-bottom:1rem;
	transition: .2s ease;
}
#AESsimuler:active, #AEScapacites:active, #AESsimulerTop:active, #faire_demande:active {
	transform: translate(4px, 10px);
}
#faire_demande {
	color:#fff;
	background:#0043CB;
	border:none;
}
#faire_demande:hover {
	background:#3463c1;
	color:#fff;
	border:none;
}
.selectionne [class*=ei_gly_]:before, .selectionne [class^=ei_gly_]:before {
	font-size: 2.7rem !important;
}
.shadow{
	background: #f7f7f7;
	margin: 0 auto;
}
.shadow span {
	display: block;
	position: absolute;
	right: 0;
	transform: translateY(-50%);
	top: 50%;
	font-size: 2rem;
	font-weight: bold;
	color: #0c4789;
	padding-right: 1rem;
}
.wrap{
	display: flex;
}
#triangle {
	width: 0px;
	height: 0px;
	border-top: 100px solid transparent;
	border-bottom: 100px solid transparent;
	border-left: 60px solid #fff;
	padding: 0;
	overflow: visible;
	left:-5px;
	transform:translateY(-50%);
	top:50%;
	position:absolute;
	transition:all 200ms ease-in
}

.ei_contener .body .btn.primary:hover, .btn.primary:focus, .btn.primary.hover {
	border: 1px solid #0c4789;
} 
#exemple-simu{
	background-color: #F7FB7C;
	width: 100%;
	padding: 0;
}
.page-header {
	padding: 2.353em 0 0 0 !important;
}
.page-header h1 {
	line-height: 1.3em;
	padding-top: 1em;
	text-align: left;
}
.page-header h1 span {
	color:#2e3b4e;
}
.page-header img {
	display: block;
	max-width: 100%;
}

/* MENTION CREDIT */

.body section.mention-credit {
	background-color: #F7FB7C;
}
section .mention-credit .mt0{
	padding-top: 0.8rem; 
}

.mention-credit strong {
	font-size: 1em;
	color: #0c4789;
}

.mention-credit div {
	padding: 0;
}

.mention-credit div p {
	margin: 0;
}

/* STICKY */

.col_1_4.cta {
	padding: .85em 0;
}
.internal-navbar .btn .icoon {
	font-size: .9em;
	margin: 0 0 0 .5em;
	position: relative;
}
.internal-navbar-container {
	border-bottom: 1px solid #ddd;
}
.body .internal-navbar-container * {
	padding-top:0;
	padding-bottom:0;
	margin-bottom:0;
	margin-top:0
}
.body .internal-navbar-container ul {
	padding:2rem 0
}
.internal-navbar {
	padding: 1em 0;
}

/* SECTIONS */

.cd-section {
	min-height: 100%;
	position: relative;
}
.section-intro {
	color:#2f2f2f;
	font-size: 1.059em;
	text-align: center;
}
.body .cd-section h2 {
	padding-top: 0;
	margin-top:0;
}
#avantages {
	padding-bottom: 5.294em;
}
#avantages ul {
	margin:0 auto;
	list-style-type: none;
}
#avantages li {
	background: transparent url('/fr/epargnants/offres/avance-epargne-salariale/visuels/check.svg') center left no-repeat;
	background-size: 30px 30px;
	color:#2f2f2f;
	font-size: 1.4rem;
	line-height: 1.2;
	padding: 1rem 0 1rem 3rem;
}
#avantages li strong {
	color:#EB4343;
}
#avantages li span {
	color:#505050;
	display: block;
	font-size: .750em;
}
.simul-aes {
	background-color: white;
	margin-bottom:6rem !important;
}
.simul-aes .actions{
	display: flex;
	align-self: flex-end;
}
.simul-form, .simul-result {
	padding: 1.765em !important;
}
.simul-form h3 {
	background-size: 33px 42px;
	color:#2f2f2f;
	font-size: 1em;
	letter-spacing: 2px;
	margin-bottom: 2em;
	padding: .882em 0 .882em 3.529em;
	text-transform: uppercase;
}
.simul-form label {
	padding-top: 1rem;
	font-size: 1.6rem;
	color: #0c4789;
	margin-bottom: 1rem;
	line-height: 1;
	font-weight: bold;
}
.simul-form div {
	position: relative;
}
.mentionminmax {
	display: inline;
	font-size:0.8rem;
	font-style:italic;
	width: 100%;
	color:#414141;
	transition:all 100ms ease-in
}
form .mentionminmax.highlight {
	background-color: #f6ef6d;
}
.simul-action {
	margin-bottom: 0;
	padding-top: 2em;
}
main .actions .btn.primary, main .btn.primary {
	background: #25378d;
	border-color:#25378d;
}
.simul-aes .simul-result {
	background-color: #25378d;
	color: #fff;
	padding: 2rem 7rem 4rem 7rem !important;
	align-items: start;
}
.simul-aes.capacite .simul-result {
	background-color: #25478c;
}
.capacite .simul-form label {
	color: #25478C;
}
.capacite input {
	color: #25478C;
	border: 1px solid #25478C;
}
.capacite :focus-visible {
	outline: 4px solid #25478C;
}
.simul-result p {
	color:#fff;
	margin-bottom:0;
	line-height:1;
	font-size:.9em;
}
.mensualites {
	color:#fff;
	font-size: 1em;
	letter-spacing: 1px;
	padding: 1em 0 1.5em 0;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}
.mensualites h3 {
	color:#fff;
	padding-bottom:0;
	margin-bottom:0
}
.mensualites span {
	display: block;
	font-size: 3.529em;
}
.result-item{
	display: flex;
	position:relative;
	justify-content: space-between;
}

#resultats_aes, #resultats_aes_max {
    min-height: 410px;
}


.result-item .libelle {
	width: 60%;
}
.result-item .valeur {
	width: 30%;
}
.simul-notes {
	font-size:.824em;
	line-height:1;
	margin-top:1rem;
}
#modalites {
	padding-bottom: 5.294em;
}
#avantages{
	background-color: #a8cffa;
}
#avantages div .wrap-card{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.col_1_2.aes-card {
	padding: 2.765em !important;
	margin-bottom:2rem;
	background-color: #fff;
}
#avantages .wrap-card .desc-card{
	background-color: #FFF;
	padding: 1rem 2rem;
	min-height: 380px;
}
#avantages .desc-card .h3 {
	color: #414141;
	margin: 1rem 0 0 0;
	font-weight: bold;
	height: auto;
}
#avantages .desc-card p {
	color:#444444;
	height: auto;
}
#video dl{
	margin-bottom: 0px;
}
.aes-card strong {
	color:#25378d;
	font-weight: bold;
}
.aes-card strong[lang=la] {
	font-style: italic;
}
.aes-card span {
	color:#505050;
	display: block;
	font-size: .889em;
}
.aes-card h3 {
	color: #505050;
	font-size: 1.059em;
	letter-spacing: 1px;
	text-align: center;
	text-transform: uppercase;
}
.aes-card p {
	color:#2f2f2f;
	font-size: 1.059em;
	padding:.75em 0 .75em 0 !important;
}
.cd-section .aes-faq {
	padding: 0 0 0 2em;
	}
.aes-faq h3 {
	color:#2f2f2f;
	margin-bottom: 0;
}
.aes-faq p {
	margin: .5em 0 1.5em 0;
}
#dos_go {
	background-color: #97c8ff;
	padding: 4rem 1rem;
}
#dos_go h2 {
	font-size: 2.353em;
	padding-top: 0;
}
#dos_go h2 span {
	display: block;
	color: #444;
}
#dos_go img {
	position: absolute;
	right: 0px;
	top: 50%;
}
#dos_go p {
	margin-top:2rem;
}
#dos_go .primary {
	font-size:1.2rem;
}
#dos_go .btn.secondary {
	margin:0 .5rem .5rem .5rem;
}
#mentions p {
font-size: .824em;
line-height:1.2rem;
}

@media only screen and (max-width: 1200px) {
	#dos_go img {
		display: none;
	}
	.internal-navbar li.col_1_4 {
		display:none
	}
	.internal-navbar li.col_1_4:last-child {
		display:block;
		width:100%;
		text-align:center;
	}
	header.hero.solo .banner, header.hero.solo div[class*="col_"] {
	padding: 0 2rem !important;
	}
	#AESclear, #AESsimuler {
	margin-bottom:1rem;
	margin-top:1rem;
	float: none;
	}
	#avantages ul {
	padding-left: 0;
	} 
	.col_1_2 img{
	max-width: 35px;
	}
	#exemple-simu{
	padding: 2rem;
	}
	#exemple-simu div {
	padding: 0;
	}
	#exemple-simu p {
	margin: 0;
	}
}

@media only screen and (max-width: 950px) {
	
	.hero.solo > .flex > div[class*="col_"].banner {
    padding: 2rem 0;
}
	
	.hero.solo .banner .sim > div {
	padding:2rem
}

	.c.col_1_2.out.bottom.right {
	position: relative;
	max-width: 50%;
	margin: 0 auto;
	}
	.wrap-card .col_1_4 {
	width: 50%;
	}
	.wrap-card .col_1_4 .desc-card {
	flex-direction: column;
	}
	
	.banner .h3 {
		line-height:1;
		margin-top:1rem;
		margin-bottom:1rem
	}
	input {
		font-size: 2rem;
		border-radius: 5px;
	}
}

@media only screen and (max-width: 768px) {
	
	.simul-form label {
		padding-top: 0;
	}
		
	.mentionminmax {
		line-height:1
	}
	
	.tool-wrapper {
		position: relative;
		display: inline-block;
		right: auto;
		top: auto;
		margin:.5rem auto
	}
	
	.body .hero.solo .banner {
		padding-top: 0;
	}
	
	#simuler p.section-intro {
		padding-bottom: 3rem;
	}

	#faire_demande {
		bottom: -25px;
		width:80%
	}
	
	#AESsimulerTop {
		width:80%
	}
	
	#boutons_simulez {
		bottom: auto;
		width:100%;
		position:relative
	}
	#triangle {
		top: -100px;
	}
	
	.aes-faq {
		padding: 0;
	}

	.ei_content .hero.solo {
		padding: 0 1rem;
	}
	.mention-credit.mt0 {
		padding: 1rem; 
	}
	.mention-credit.mt0 p {
		line-height: 1;
		font-size: 1rem; 
	}
	#triangle{
		transform: rotate(90deg);
		left: auto;
	}
	.simul-aes .simul-result {
		padding: 1.765em 1.765em 4rem 1.765em !important; 
	}
	.banner.col_1_2.pt4 {
		padding-top: 0 !important;
	}
	.ei_content .wrap-card .col_1_4 {
		width: 50%;
	}
}

@media only screen and (max-width: 600px) {
	
	.mensualites span {
		display: block;
		font-size: 3em;
	}
	
	.result-item {
		display: flex;
		position: relative;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
	}
	
	.result-item .valeur {
		width: 100%;
		margin-top:0
	}

	.c.col_1_2.out.bottom.right{
		max-width: 100%;
	}
	.ei_content .hero.solo .col_1_2 img{
		max-width: 80%;
	}
	#avantages {
		padding-bottom: 2rem;
	}  
	#avantages .videoContainer {
		margin-bottom: 0;
	}
	#avantages dl {
		margin-bottom:1rem
	}
	.ei_content .wrap-card .col_1_4{
		width: 100%;
	}
}