body{
	background-color:#E8F4FC;
}

.main{    margin-top: -20px;}
	
/* CSS - JUMBOTRON */

	.jumbotron.jumbotron-bg-right {
		background-position-x: 76%;
		background-position-y: bottom;
		background-size: auto 92%;
	}
	
	.jumbotron .content-container{
		max-width: 600px;
	}


	.content-container h1.hero-title {
		font-size: 50px;
		line-height: 56px;
		font-family:FigtreeLight;
		margin-top: 10px;
		font-weight: 300;		
	}

	.jumbotron .content-container .hero-description{
		font-size: 20px;
		line-height: 28px;
		margin-top: 36px;
		max-width: 60rem;
		letter-spacing: normal;
		font-family:FigtreeLight;
		font-weight: 300;		
	}

	.jumbotron-gradient {
		display: none;
	}


.page-health .jumbotron .btn{
	background-color: #e8f4fc;
	color: #212121;
	border:1px solid #e8f4fc;
	text-decoration:none;}

	.page-health .jumbotron .btn:hover
	{
		background:#aedcf3;
		border:1px solid #aedcf3;
		color: #212121;
	}
	
	.page-health .jumbotron .btn-clair	{
		background-color: #008ED0;
		border:1px solid #b2eafb;
		color:#fff;
	}
	

	.jumbo-mobile{
		display: none;
	}



	@media (max-width: 1570px) {
		.jumbotron.jumbotron-bg-right{
			background-position-x: 90%;
		}
	}	

	@media (max-width: 1300px) {
		.jumbotron.jumbotron-bg-right{
			background-position-x: 100%;
		}
	}	

	@media (max-width: 1200px) {

		.jumbotron .container{
			width: 100%;
		}

		.jumbotron .content{padding-left: 25px;}
	}	

	@media (max-width: 1000px) {
		.jumbotron.jumbotron-bg-right{
			background-size: auto 80%;
			height:auto;
		}

		.jumbotron .content-container .hero-description{max-width: 47rem;}
		
			.page-health .jumbotron .btn-clair{margin-top:20px;}
	}	
	
	@media (max-width: 875px) {

		.jumbotron .content-container .hero-description{max-width: 45rem;}
		.jumbotron .content-container .hero-description{
			max-width: 100%;
			font-size: 18px;
			line-height: 26px;}		

		.jumbotron.jumbotron-bg-right{
			background-size: auto 80%;
		}			

		.content-container h1.hero-title{
			font-size: 40px;
			line-height: 48px;
		}
	}	
	
	@media (max-width: 767px) {


		.page-health .jumbotron .btn{
			padding: 15px 30px;
	    	font-size: 16px;
    		line-height: 1.33333;
			margin-top: 2.3rem;
			margin-bottom: 38px;
		}

		
		
		.jumbotron.jumbotron-standard.jumbotron-white.jumbotron-with-bgcolor.jumbotron-bg-right{
			height: auto;
			 background-position: top;
			background-position-y: 17px;
			background-size: 100%;
			padding-top: 14rem;
            padding-bottom: 4rem;
		}
		
		.jumbotron.jumbotron-standard.jumbotron-white.jumbotron-with-bgcolor.jumbotron-bg-right .container{
			padding-top: 64%;
		}

		

		.jumbo-mobile{
			display: block;
			width: 100%;
			margin-bottom:25px;
		}

		.jumbotron .content-container{
			width: 94%;
			max-width: 730px;
			margin: 0;
		}

		.page-health .jumbotron .content-container .hero-description{
			margin-top: 23px;
		}



	}	

@media (max-width: 600px) {
		.jumbotron.jumbotron-standard.jumbotron-white.jumbotron-with-bgcolor.jumbotron-bg-right{
			background-size: 109%;
		}
}		
		
		
	@media (max-width: 539px) {
		.page-health .jumbotron .btn{margin-bottom:20px;}
		.page-health .jumbotron .btn-clair{margin-top:0px;}
		
		
	}
	
	@media (max-width: 440px) {
		.jumbotron.jumbotron-standard.jumbotron-white.jumbotron-with-bgcolor.jumbotron-bg-right{
			background-size: 117%;}
	}


		
	/* CSS - FIN JUMBOTRON */
	
.page-health #bloc-services-sante h2 {
    margin-top: 64px;

}	

@media (max-width: 740px) {
	.page-health #bloc-services-sante h2 {margin-top:45px;}
}
	
/*Bloc On vous informe sur votre destination id=bloc-consulter */

body.page-health .block-color{margin-top: 0px;}

#bloc-consulter
{background-color:#FBF6F1;}

#bloc-consulter .padding-top-right-left{padding-bottom:75px;}



body.page-health #bloc-consulter .container-title{margin-top: 50px;}

#bloc-consulter .col-md-6.div_consulter {
	border-radius:16px;
	border:1px solid #E2E2E2; 
	padding:27px 24px 32px;
	margin: 0 10px;
    width: 48%;
	min-height:321px;
	position:relative;
	font-family: FigtreeLight;
	background-color: #ffffff;
}


	#bloc-consulter .div_consulter .title-side h3{
		font-size:32px;
		line-height:38px;
		letter-spacing:normal; 
		font-family: FigtreeLight;
		margin-bottom: 33px;
		margin-top: 14px;
	}
	
	#bloc-consulter .div_consulter .notes{font-size: 0.8em;
    color: #212121;
    text-align: left;
    padding: 0 0 6rem;
    line-height: 1.2em;}
	
	#bloc-consulter .div_consulter p{
		
		/* Body/Body 1 */
			
		font-family: Roboto;
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 25px; /* 156.25% */
		margin: 0 auto;
		padding: 0;
		text-align:left;
		 
    letter-spacing: normal;
		
	}
	

	@media (max-width: 992px) {
		#bloc-consulter .div_consulter .notes{padding-bottom:2rem;}
		
	}
	
	#bloc-consulter .div_consulter .title-side .icon{
		border-radius: 16px;
		background:#008ED0;
		position:relative;
		width:64px;
		height:64px;
		float: left;
		margin: -9px 16px 0 0;
	}	
	
		#bloc-consulter .div_consulter .title-side .icon img{
			position:absolute;
			top: 18%;
			left: 19%;
		}	

	
	
	#bloc-consulter .col-md-6.div_consulter ul { 
		padding-left:28px;line-height: 23px;}
		
		bloc-consulter .col-md-6.div_consulter ul li{padding-bottom: 3px;}

	#bloc-consulter .col-md-6.div_consulter .btn-container{
		position: absolute;
		bottom: 32px;
	}


@media (max-width: 1200px) {
	#bloc-consulter .col-md-6.div_consulter{
		margin:0 6px 0px;
		min-height:345px;
	}
	
		#bloc-consulter .div_consulter .title-side{min-height: 70px;}
		#bloc-consulter .div_consulter .title-side h3{font-size:30px; line-height:36px;}
}

@media (max-width: 990px) {
	#bloc-consulter .col-md-6.div_consulter{
		width:auto;
		margin:0 0 30px;
		min-height: auto;
	}
	
		
		#bloc-consulter .div_consulter .title-side h3{margin-bottom:12px;}
		#bloc-consulter .div_consulter p{margin-bottom:19px;}
		#bloc-consulter .div_consulter .title-side .icon{margin:0 0 20px;float: none;}
		
		#bloc-consulter .col-md-6.div_consulter .btn-container{
			position: initial;
		}
		
		#bloc-consulter .padding-top-right-left{padding-bottom: 35px;}
	
		    
}

@media (max-width: 767px) {
	#bloc-consulter .col-md-6.div_consulter{
		margin:0 2% 30px;
	}
	
	#bloc-consulter .block-color{
		padding-bottom: 45px;
		}	
	    
}


/*FIN Bloc On vous informe sur votre destination id=bloc-consulter */






/* Consignes voyage*/

.conteneur-onglets{background-color:#FBF6F1;    padding-top: 50px;}
@media (max-width: 700px) {
	.conteneur-onglets {
		padding-top: 0px;
	}
}

#bloc-consignes-voyage .block-color .consignes p{
	
color: var(--color-text-text-primary, #212121);

/* Body/Body 1 */
	
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 25px; /* 156.25% */
margin: 0 auto;
padding: 0;
}


.consignes-descriptions{

display: flex;
min-height: 1px;
align-items: flex-start;
gap: 24px;
flex: 1 0 0;
margin: 0 auto;
width: 100%;
max-width: 1200px;
}

.consignes-descriptions .conteneur-description{
	
padding: 32px 0 64px;
margin: 0 auto;
width: 100%;
}



.conteneur-description h2{

color: var(--color-text-text-primary, #212121);	
font-family: FigtreeLight;
font-size: 40px;
font-style: normal;
font-weight: 400;
line-height: 48px; /* 118.75% */
padding: 0;
margin: 0;
}

.conteneur-description p{

color: var(--color-text-text-primary, #212121);	
font-family: Figtree;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 118.75% */
text-align:left;
letter-spacing:normal;
max-width:none;
padding: 20px 0 15px;
}


.consignes-descriptions .conteneur-description .bloc-img-txt{
  min-height:246px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 24px;
 /*align-items: start;*/
}


.consignes-descriptions .conteneur-description .bloc-img-txt div.image{
	
width: 100%;
max-width: 280px;
border-radius: 16px;
padding: 0;
background-size: cover;
background-repeat: no-repeat;
background-position-x: center;
background-position-y: center;
height:auto;
}


.consignes-descriptions .conteneur-description .bloc-img-txt div.txt{
	
background-color:#E8F4FC;
padding:24px;
border-radius: 16px;

}

	.consignes-descriptions .conteneur-description .bloc-img-txt div h3{
		color: var(--color-text-text-primary, #212121);	
		font-family: FigtreeLight;
		font-size: 32px;
		font-style: normal;
		font-weight: 400;
		line-height: 38px; /* 118.75% */		
		margin:0 0 20px;

	}
	
	.consignes-descriptions .conteneur-description .bloc-img-txt div p{
		font-size: 16px;
		line-height: 24px; /* 118.75% */		
		padding: 0px 0 15px;
	}
	


	
	.consignes-descriptions .conteneur-description .bloc-img-txt p a,
	.consignes-descriptions .conteneur-description .bloc-img-txt ul li a{
		color:#008ED0;
		text-decoration:underline;
	}	
		.consignes-descriptions .conteneur-description .bloc-img-txt p a:hover,
		.consignes-descriptions .conteneur-description .bloc-img-txt ul li a:hover{
			text-decoration:none;
		}	
 .consignes-descriptions .conteneur-description img.ico-ampoule{
 margin-top: -4px;}


	.consignes-descriptions .conteneur-description .bloc-img-txt .consigne-btn-container{
	display: flex;
    gap: 24px; /* Espace entre les boutons */
    flex-wrap: wrap; /* Empile si nécessaire */
  }

		.consignes-descriptions .conteneur-description .bloc-img-txt .btn-primary a{width: fit-content;}
		
	
	.consignes-descriptions .conteneur-description .bloc-img-txt .btn-lg:hover{
		
		background-color:#08638D;
		color:#fff;
	}

	.consignes-descriptions .conteneur-description .bloc-img-txt .btn-clair{
		
		background-color:#E8F4FC;
		color:#08638D;
		border:1px solid #08638D;
	}
	
		.consignes-descriptions .conteneur-description .bloc-img-txt .btn-clair:hover{
			
			background-color:#08638D;
			color:#fff;
			border:1px solid #08638D;
		}	

  .consignes-descriptions {
    display: none;
  }


  .consignes-descriptions.active {
    display: block;
    max-width: 1200px;
    width: 100%;
  }



.consignes{
display: flex;
padding-bottom: var(--spacing-spacing-10, 10px);
flex-direction: column;
justify-content: center;
align-items: center;
gap: 1px;	
background-color:#EDE5D8;
border: #EDE5D8 2px solid;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
border-bottom:0px;
padding-top:8px;
width:33%;
  flex: 0 0 auto;            /* chaque onglet garde sa largeur */
  scroll-snap-align: start;
  cursor: pointer;
  height: 118px;
}


.consignes img{
margin-bottom:6px;
}

.consignes p{
	padding-bottom:0px;
	font-size: 20px;
	font-weight: 700;
	line-height: 28px;
	color:#08638D;
}


.consignes:hover{
	box-shadow: inset 0 -3px #0072ce;
}

.consignes.active {
	background-color:#fff;
border: #EDE5D8 1px solid;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
border-bottom:0px;
}




.conteneur-consignes {

align-items: flex-end;
align-self: stretch;
width: 1160px;
margin: 0 auto;
	
  display: flex;
  overflow-x: auto;          /* scroll horizontal */
  -webkit-overflow-scrolling: touch; /* dÃƒÂ©filement fluide iOS */
  scroll-snap-type: x mandatory;
  gap: 4px;
  width: 100%;               /* garde la largeur de la page */
  box-sizing: border-box;    /* inclut le padding */
  justify-content: space-between;
  background-color:#FBF6F1;
  max-width:743px;
}

.conteneur-consignes::-webkit-scrollbar { display: none; }
.conteneur-consignes { -ms-overflow-style: none; scrollbar-width: none; }




@media (max-width: 1250px) {
	.consignes-descriptions .conteneur-description{
		
	padding-left: 2%;
	padding-right: 2%;
	}
}
@media (max-width: 830px) {
	.conteneur-description p{
		font-size:18px;
		line-height:26px;
	}
	
	.conteneur-description h2{
		font-size:34px;
		line-height:44px;
	}
}

@media (max-width: 500px) {
	.consignes p{
	font-size: 18px;
    line-height: 20px;
    margin-bottom: 2px;}
}


/* Mobile : 1 colonne, on garde le même gap de 24px entre chaque bloc */
@media (max-width: 720px) {
  .consignes-descriptions .conteneur-description .bloc-img-txt {
    grid-template-columns: 1fr; /* on passe à 1 colonne */
    /* le gap: 24px; reste appliqué et assurera l’espacement vertical entre
       image -> texte -> image -> texte */
  }

  .consignes-descriptions .conteneur-description .bloc-img-txt div.image {
    max-width: none;  /* l’image prend toute la largeur */
    width: 100%;
    /* Ajuste la hauteur fluide pour le mobile si tu veux un peu plus haut */
    height: clamp(210px, 50vw, 300px);
  }
}

/* (Optionnel) si tu veux que les boutons se “wrap” proprement en mobile */
.consignes-descriptions .conteneur-description .bloc-img-txt .consigne-btn-container {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}


/*FIN Consignes voyage*/




/*Bloc-thematique Peau en santé*/


body.page-health #bloc-thematique{
	margin-top: 0px;
}


/*FIN Bloc-thematique Peau en santé*/



/*Bloc de recherche par pays*/

.services-sante-search{
	background-color:#E8F4FC;
	color:#212121;
	margin-bottom:140px;
}

.services-sante-search .link-more{
	float: none;
    display: block;
    margin-top: 45px;
    color: #0A6E9D;
	
}


body.page-health .services-sante-search .container-title{text-transform: none;}

.services-sante-search .search-container {margin: 0px 0%;}

/* 1) Le conteneur devient le "pills" bleu */
.services-sante-search .input-wrapper {
  position: relative;              /* déjà présent inline, mais on le remet ici */
  display: flex;
  align-items: center;
  background-color: #008ED0;       /* bleu du mockup */
  border-radius: 16px;            /* arrondi maximum */
  padding: 8px 8px 8px 86px;                   /* espace interne autour de l’input */
  overflow: hidden;                /* coupe proprement l’intérieur */
}

/* 2) L'input : blanc, arrondi, full width */
.services-sante-search .search-input {
  width: 100%;
  border: none;
  outline: none;
  background: #fff;
  color: #000;
  border-radius: 16px;
  padding: 20px 20px;              /* padding normal à droite */
  padding-left: 25px;              /* on réserve l'espace pour l’icône gauche */
  box-shadow: none;
}

/* 3) Placeholder couleur (#212121 comme demandé) */
.services-sante-search .search-input::placeholder {
  color: #212121;
  opacity: 1; /* Firefox */
}

/* 4) L’icône à gauche, ajoutée via pseudo-élément sur le wrapper */
.services-sante-search .input-wrapper::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    background-color: #008ED0;
    background-image: url("/globalassets/sante/dossiers-thematiques-sante/sante-voyage/ico-loupe.svg");
    background-repeat: no-repeat;
    background-position: center;
	background-size: 48px 48px;
}

.solutions-content-no-results, .solutions-search-results{left: 90px;}

:root a.input-clear-text, a.input-clear-text{right: 19px;
    top: 12px;}

@media (max-width: 1200px) {
	.services-sante-search{
		margin-bottom:65px;
	}
}


/*FIN Bloc de recherche par pays*/