/*
Theme Name: Divi Enfant 
Description: Kaleoz, theme enfant de Divi
Author: Claire Janssens
Template: Divi
*/


/* /***************   COLORS **************
sauge claire : #a7b2a0
sauge foncée : #8b8f84
bronze :  #c19b6a
or : #ad843e
beige : #e6d5c5
terre rouge : #933508
marron : #4b1606
*/


/**************** TYPO ****************/

/*color highlights in text*/
.cj-color-highlight {
	text-decoration: none;
	box-shadow: inset 0 3em #a7b2a0;
	color: inherit;
}

h1 {
	font-size: 45px !important;
}

h2 {
	font-size: 28px !important;
}

h3 {
	font-family: 'Montserrat', Helvetica, Arial, Lucida, sans-serif !important;
	font-size: 14px !important;
	letter-spacing: 1px;
	color: #c19b6a;
}

strong {
	font-weight: 600;
}

sup {
  font-size: 60% !important;
  line-height: 0 !important;
  position: relative !important;
  vertical-align: baseline !important;
}

/* enlever signe d'origine des listes a puces*/
.cj-liste-standard ul li {
	list-style-type: none;
	margin-left: 1.5em;
}

.cj-liste-standard li {
	display: list-item;
	text-align: -webkit-match-parent;
}

/* ajout d'un nouveau signe devant */
.cj-liste-standard ul li::before {
	content: "—";
	float: left;
	margin-left: -2em;
	margin-bottom: 5px;
}

.cj-liste-standard ul {
	text-align: left;
}


@media only screen and (max-width: 767px) {
	h1 {
		font-size: 33px !important;
	}
	
	h4{
		font-size: 33px !important;
	}
}

/**************** TEMOIGNAGES ****************/

.cj-big-number {
	font-size: 50px !important;
}

/* show slider arrows */
.et-pb-arrow-next {
	opacity: 1;
	right: 22px;
	bottom: 0%;
	top: 85%;
}

.et-pb-arrow-prev {
	opacity: 1;
	left: 22px;
}

.et-pb-arrow-next,
.et-pb-arrow-prev {
	bottom: 0%;
	top: 84.7%;
	background-color: #4b1606;
	padding: 10px;
	margin: 0
}

@media only screen and (max-width: 980px) {
.et-pb-arrow-next,
.et-pb-arrow-prev {
	top: 89.7%;
	padding: 3px;
}
}

@media only screen and (max-width: 767px) {
.et-pb-arrow-next,
.et-pb-arrow-prev {
	top: 94.7%;
	padding: 3px;
}
}
/**************** BACK TO TOP BUTTON ****************/

/* .et_pb_scroll_top:before {
	-webkit-transition: all 300ms 0s ease-in-out;
	transition: all 300ms 0s ease-in-out;
	content: url(https://www.kaleoz-orientation.fr/wp-content/uploads/2023/12/compass-white.png);
	width:30px;
	width:30px;
	display: block;
} */

.et_pb_scroll_top:before {
  content: '';
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url(https://www.kaleoz-orientation.fr/wp-content/uploads/2023/12/compass-white-north.png);
  background-size: 30px;
}

.et_pb_scroll_top.et-pb-icon {
	margin-right: 25px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.et_pb_scroll_top.et-hidden {
	opacity: 0 !important;
}

/**************** BOUTON CONTACT ****************/

	.cj-mon-bouton-contact:before, .cj-mon-bouton-accompagnements:before {
		  -webkit-transition: all 2300ms 0s ease-in-out;
		transition: all 200ms 0s ease-in-out;
	  content: "" ;
	  width: 40px ;
	  height: 40px ;
	  background-color: #ad843e ;
	  position:absolute ;
	  display: block ;
	  top:0px;
	  left:0px;
	  border-radius: 50% ;
	}
	
	.cj-mon-bouton-contact:hover:before, .cj-mon-bouton-accompagnements:hover:before {
		border-radius: 50px ;
	  content: "" ;
	  height: 40px ;
	  background-color: #ad843e ;
	  position:absolute ;
	  display: block ;
	  top:0px;
	  left:0px;
	}

.cj-mon-bouton-contact:hover:before {
	  width: 165px ;
	}

	.cj-mon-bouton-accompagnements:hover:before {
	  width: 245px ;
	}
	/*********************************************************************************************/
	/**************** QUI SUIS JE ****************/

	/* chapitrage  */
	.cj-filet-chapitre-main-one,
	.cj-filet-chapitre-main-two,
	.cj-filet-chapitre-main-three {
		padding: 2vw 0vw 2vw 1vw;
		margin-bottom: 3vw;
		font-size: 4vw;
	}

	.cj-filet-chapitre-one,
	.cj-filet-chapitre-two,
	.cj-filet-chapitre-three {
		padding: 1vw 0vw 1vw 0.5vw;
		padding-bottom: 15px !important;
		margin-bottom: 3vw;
		font-size: 2vw;
	}

	.cj-filet-chapitre-main-one,
	.cj-filet-chapitre-one {
		background-color: #8b8f84 !important;
	}

	.cj-filet-chapitre-main-two,
	.cj-filet-chapitre-two {
		background-color: #c19b6a !important;
	}

	.cj-filet-chapitre-main-three,
	.cj-filet-chapitre-three {
		background-color: #933508 !important;
	}

	#cj-colonne-filet-one {
		background-image: linear-gradient(90deg, #8b8f84 0%, #8b8f84 6.8%, #ffffff 6.8%, #ffffff 7%, #8b8f84 7%, #8b8f84 100%) !important;
	}

	#cj-colonne-filet-two {
		background-image: linear-gradient(90deg, #c19b6a 0%, #c19b6a 6.8%, #ffffff 6.8%, #ffffff 7%, #c19b6a 7%, #c19b6a 100%) !important;
	}

	#cj-colonne-filet-three {
		background-image: linear-gradient(90deg, #933508 0%, #933508 6.8%, #ffffff 6.8%, #ffffff 7%, #933508 7%, #933508 100%) !important;
	}


	#cj-background-parallax-haut .et_parallax_bg {
		background-position: right !important;
	}
	
	@media only screen and (min-width: 1400px) {
		.cj-image-guirlande-carre, .cj-image-escalade-carre, .cj-image-saut-carre {
			display:none !important;
			}
	}
	
	@media only screen and (max-width: 1399px) {
	.cj-image-guirlande, .cj-image-escalade, .cj-image-saut {
		display:none !important;
		}
}
/**************** MENU  ****************/
	
	/*make entire Divi Theme Builer header template fixed*/
	header.et-l.et-l--header {
		position: fixed;
		width: 100%;
		z-index: 9999;
		top:0;
	}
	
	#main-content {
		margin-top: 140px;
	}

@media only screen and (max-width: 767px) {
#main-content {
		margin-top: 60px;
	}
}	
	
	
/**************** MENU mobile ****************/
	
	  /*------------- Menu Mobile full-screen -----------------------------------*/
	@media only screen and (max-width: 767px) {
		  #cj-main-menu .et_mobile_menu {
			  top: 79px !important;
			}
	}
	
	@media only screen and (min-width: 768px) and (max-width: 1120px) {
		  #cj-main-menu .et_mobile_menu {
			  top: 152px !important;
			}
	}
	
	 @media only screen and (max-width: 1120px) {
	
	  /* icone burger devient un X quand menu ouvert */
	  .mobile_nav.opened .mobile_menu_bar:before {
		font-family: "ETmodules";
		content: "\4d";
	  }
	
	  span.mobile_menu_bar {
		z-index: 9999;
	  }
	
	  /* design de la zone de menu ouvert */
	  .et_mobile_menu {
		left: 0;
		position: fixed;
		z-index: 9998;
		overflow-y: scroll !important;
		/* max-height: 80vh !important; sans barre defilante */
		max-height: 80vh !important;
		-overflow-scrolling: touch !important;
		-webkit-overflow-scrolling: touch !important;
		background-color: rgba(57, 119, 138, 0.96) !important;
		margin-left: -30px;
		height: 100%;
		width: calc(100% + 60px);
		border: none;
	  }
	


	  #cj-main-menu .et_mobile_menu li a {
		text-align: center;
		border: 0;
		padding: 10px;
		text-transform: uppercase;
		letter-spacing: 3px;
		margin-bottom: 5px;
	  }
	
	  /* couleur des mots pr page active */
	  .mobile_nav ul#mobile_menu1 .current_page_item>a,
	  .mobile_nav ul#mobile_menu1 .sub-menu .current_page_item>a {
		color: #ad843e !important;
	  }
	
	  /* couleur des mots  rollover et arrière plan */
	  #cj-main-menu .et_mobile_menu li a:hover {
		color: #933508 !important;
		opacity: 1;
	  }
	}
	
	@media only screen and (max-width: 980px) {

	
  }
	/*-------END------ Menu Full-screen -----------------------------------*/



/*********************************************************************************************/
	/**************** DIVERS ****************/
	
	
	/*** pr garder 2 colonnes cote à cote sur mobile ***/
	.columns-side-by-side .et_pb_column {
	  width: 50% !important;
	}
	
	/* positionner ancres sous menu */
	#cj-ancre-parcoursup.ancre,
	#cj-ancre-ateliers.ancre,
	#cj-ancre-contact,
	#cj-ancre-diagnostic.ancre,
	#cj-ancre-valeurs.ancre,
	#cj-ancre-methode.ancre,
	#cj-ancre-formation.ancre
		{
	  display: block;
	  height: 140px;
	  /*same height as header*/
	  margin-top: -140px !important;
	  visibility: hidden;
	}
	
	/* positionner ancres sous menu MOBILE */
	#cj-ancre-parcoursup-mobile.ancre,
	#cj-ancre-ateliers-mobile.ancre,
	#cj-ancre-diagnostic-mobile.ancre,
	#cj-ancre-valeurs-mobile.ancre,
	#cj-ancre-methode-mobile.ancre,
	#cj-ancre-formation-mobile.ancre
		{
	  display: block;
	  height: 160px;
	  /*same height as header*/
	  margin-top: -160px !important;
	  visibility: hidden;
	}