/*baniiere*/

#banner #banner-filter {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}

#banner .banner-details {
	position: absolute;
	top: 74%;
	left: 50%;
	transform: translate(-50%, -50%);
  	z-index: 10;
}

#banner .banner-details .banner-sub-titre {
	color: #fff;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
  	margin: 0 0 0.5rem;
  	padding: 0;
  	text-transform: uppercase;
}
#banner .banner-details .banner-titre1 {
	color: #fff;
	font-size: 23px;
	font-weight: 800;
	font-family: 'Cormorant';
	margin: 0 0 0.5rem;
	padding: 0;
	text-transform: uppercase;
}
@media(min-width:992px) {
	#banner .banner-details .banner-titre1 {
		font-size: 48px;
	}
}
@media(max-width:992px) {

	#banner .banner-details .banner-sub-titre {
		font-size: 9px;
	}
	#banner img {
		min-height: 260px;
		object-fit: cover;
		object-position: 86% 100%;
	}
	#banner .banner-details {
		top: 72%;
	}
}
/*end baniere*/

/*page Accréditations et reconnaissances*/

.green_title,#first_section .green-title,#second_sectrion .green-title,
#parcours_academiques_s1 .green-title,#parcours_academiques_s2 .green-title,#frais_scolarite #section1 .green-title,
#campus_lieu_apprentissage #section1 .green-title,#campus_lieu_apprentissage #section2 .green-title,
#campus_lieu_apprentissage #section3 .green-title,#campus_lieu_apprentissage #section4 .green-title,
#campus_lieu_apprentissage #section5 .green-title,#service_carriere #section1 .green-title,#service_carriere #section2 .green-title,
#service_carriere #section3 .green-title,#service_carriere #section4 .green-title,
#service_complementaires #service_complementaires_s1 .green-title,#service_complementaires #service_complementaires_s2 .green-title,
#service_complementaires #service_complementaires_s3 .green-title,#service_complementaires_s4 .green-title,
#service_complementaires_s5 .green-title,#vie_etudiante_associative #vie_etudiante_associative_s1 .green-title,
#vie_etudiante_associative #vie_etudiante_associative_s2 .green-title,#vie_etudiante_associative #vie_etudiante_associative_s3 .green-title {
	font-family: 'Montserrat';
	font-weight: 400;
	font-size: 16px;
	color: #1F9737;
	margin: 0;
}
.description h2,.titre,.titre-actualite,#first_section .title,#second_sectrion .title,#parcours_academiques_s1 .titre,#parcours_academiques_s2 .titre,
#frais_scolarite #section1 .title,#frais_scolarite #section2 .title,#campus_lieu_apprentissage #section1 .titre,
#campus_lieu_apprentissage #section2 .titre,#campus_lieu_apprentissage #section3 .titre,#campus_lieu_apprentissage #section4 .titre,
#campus_lieu_apprentissage #section5 .titre,#service_carriere #section1 .titre,#service_carriere #section2 .titre,
#service_carriere #section3 .titre,#service_carriere #section4 .titre,#service_complementaires #service_complementaires_s1 .titre,
#service_complementaires #service_complementaires_s2 .titre,#service_complementaires #service_complementaires_s3 .titre,
#service_complementaires_s4 .titre,#service_complementaires_s5 .titre,#vie_etudiante_associative #vie_etudiante_associative_s1 .titre,
#vie_etudiante_associative #vie_etudiante_associative_s1 .titre,#vie_etudiante_associative #vie_etudiante_associative_s3 .titre {
	font-family: 'Cormorant';
	font-weight: 700;
	font-size: 2.4rem;
	color: #002B4C;
	margin-top: 2px;
	margin-bottom: 3px;
	line-height: 1;
}
.description h2{
	font-size: 2rem;
}
.description,.description *,#first_section .description,#first_section .description *,
#parcours_academiques_s1 .description,#parcours_academiques_s1 .description *,
#parcours_academiques_s2 .description,#parcours_academiques_s2 .description *,#campus_lieu_apprentissage #section3 .description,
#campus_lieu_apprentissage #section3 .description *,#service_complementaires #service_complementaires_s2 .description *,
#service_complementaires_s4 .description *,#vie_etudiante_associative #vie_etudiante_associative_s1 .description * {
	font-family: 'Montserrat';
	/*font-weight: 400;*/
	font-size: 13px;
	color: #6E6F6F;
	text-align: justify;
}
#second_sectrion .round{
	width: 37px;
	height: 37px;
	border-radius: 50%;
	margin-right: 10px;
}
#second_sectrion .label-prive h3{
	font-family: Cormorant;
	font-weight: 700;
	font-size: 18px;
	color: #002B4C;
	margin-bottom: 2px;
	margin-top: 0;
}
#second_sectrion .label-prive p{
	font-family: 'Montserrat';
	font-weight: 400;
	font-size: 12px;
	color: #6E6F6F;
	margin-bottom: 2px;
}

/*end  page Accréditations et reconnaissances*/


/*PAGE FAQS*/
#first_section .Questions{
	border: 0.5px solid #0E2A4A;
	padding: 10px 10px;
	cursor: pointer;
}
#first_section .Questions h3{
	font-size: 20px;
	font-weight: 600;
	font-family: 'Cormorant';
	margin: 0;
	padding: 0;
}
#first_section .quest-plus h3{
	color: #1D2124;
}
#first_section .quest-ex h3{
	color: #FFFFFF;
}
#first_section .reponse{
	padding: 11px 5%;
	font-size: 12px;
	font-family: 'Montserrat';
	font-weight: 400;
	color: #1D2124;
	display: none;

}
#first_section .description_faqs {
	font-family: 'Montserrat';
	font-weight: 400;
	font-size: 16px;
	color: #6E6F6F;
	padding: 5px 5%;
}
#first_section .quest-plus h3::before {
	content: url(/wp-content/themes/csm/inc/assets/svg/+marker.svg);
	padding-right: 10px;
	cursor: pointer;
}
#first_section .quest-ex{
	background-color: #002B4C;
}
#first_section .quest-ex h3::before {
	content: url(/wp-content/themes/csm/inc/assets/svg/x-marker.svg);
	padding-right: 10px;
	cursor: pointer;
}

/*END PAGE FAQS*/


/*page Environnement pédagogique*/

#first_section .left-div .titre {
	color: #1D2124;
	font-weight: 700;
	font-size: 25px;
	font-family: 'Cormorant';
}
#first_section .left-div .description,#first_section .left-div .description * {
	color: #6E6F6F;
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#first_section .left-div h3.titre{
	color: #1D2124;
	margin: 0;
	padding-bottom: 4px;
	font-weight: 700;
	font-size: 15px;
	font-family: 'Cormorant';
}
#first_section .left-div .liste-enseignants-experience p{
	color: #1D2124;
	margin-bottom: 8px;
	font-size: 10px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#first_section .left-div .section4 .titre{
	color: #1D2124;
	font-weight: 700;
	font-size: 22px;
	font-family: 'Cormorant';
}
#first_section .left-div .section5 .img-center{
	width: 100px;
	height: 100px;
	border-radius: 50%;
}
#first_section .left-div .section5 .titre{
	color: #1D2124;
	margin: 0;
	margin-bottom: 5px;
	font-weight: 600;
	font-size: 17px;
	font-family: 'Cormorant';
}
#first_section .left-div .section5 .description,#first_section .left-div .section6 .description {
	color: #6E6F6F;
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 400;
	margin: 0;
}
#first_section .left-div .section6 .titre{
	color: #1D2124;
	margin: 0;
	margin-bottom: 5px;
	font-weight: 700;
	font-size: 22px;
	font-family: 'Cormorant';
}
#first_section .left-div .section6 .buttons-wrapper .arrows button.previous-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_l.svg);
}
#first_section .left-div .section6 .buttons-wrapper .arrows button {
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 55px;
  border: 1px solid #fff;
  border-radius: 50%;
  border: 1px solid #0E2A4A;
  height: 38px;
  width: 38px;
}
#first_section .left-div .section6 .buttons-wrapper .arrows button.next-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_r.svg);
}
#first_section .left-div .section6 .carousel .titre{
	color: #002B4C;
	margin: 0;
	margin-bottom: 5px;
	font-weight: 700;
	font-size: 20px;
	font-family: 'Cormorant';
}
#first_section .left-div .section6 .carousel .description{
	color: #6E6F6F;
	margin: 0;
	margin-bottom: 5px;
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#first_section .left-div .section6 .carousel .link-slider{
	color: #7ECE06;
	text-decoration: none;
	border-radius: 25px;
	font-size: 12px;
	font-family: 'Montserrat';
	font-weight: 500;
}
#first_section .left-div .section6 .carousel .link-slider:hover {
	background-color: #7ECE06;
	color: #FFFFFF;
	text-decoration: none;
	padding: 5px 15px;
}
/* end page Environnement pédagogique*/

/*Page Diversité et inclusion*/

#diversite_inclusion_s1 .green-title,#diversite_inclusion_s2 .green-title{
	color: #1F9737;
	font-family: 'Montserrat';
	font-size: 16px;
	font-weight: 400;

}
#diversite_inclusion_s1 .titre,#diversite_inclusion_s2 .titre{
	color: #1D2124;
	font-family: 'Cormorant';
	font-size: 40px;
	font-weight: 700;

}
#diversite_inclusion_s1 .description *,#diversite_inclusion_s2 .description *{
	color: #6E6F6F;
	font-family: 'Montserrat';
	font-size: 13px;
	font-weight: 400;
}
#diversite_inclusion_s2 .link-proced{
  border: 0.5px solid #0E2A4A;
  margin: 7px 0;
  color: #1D2124;
  font-size: 13px;
  font-weight: 500;
  font-family: 'Montserrat';
  display: block;
}
#diversite_inclusion_s2 .link-proced:active {
  background-color: #7ECE06;
  border: noe;
  color: #FFFFFF;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
	min-height: 440px;
	height: 100%;
	background-size: cover;
	margin-bottom: 8%;
	background-repeat: no-repeat;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img h3{
	color: #FFFFFF;
	font-size: 16px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img h2{
	color: #FFFFFF;
	font-size: 40px;
	font-family: 'Cormorant';
	font-weight: 700;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img p {
	color: #FFFFFF;
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div{
	background-color: #FFFFFF; 
	bottom: -20%;
	left: 15%;
	overflow: hidden;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div h2{
	color: #1D2124;
  font-family: "Montserrat";
  font-size: 40px;
  font-weight: 700;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div h3{
	color: #1D2124;
  font-family: "Montserrat";
  font-size: 13px;
  font-weight: 400;
}
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div h2::after{
	color: #92CC3F;
  content: '+';
  font-family: "Montserrat";
  font-size: 40px;
  font-weight: 550;
  position: absolute;
  top: 0;
  transform: translate(0, -25%);
}
@media(max-width:767px) {
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div {
		bottom: -82%;
		max-width: 90%;
		left: 5%;
	}
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
		margin-bottom: 65%;
	}
}
@media(min-width: 992px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
		background-image: url('/wp-content/uploads/2022/01/cdsq.png');
	}
}
@media(max-width: 992px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
		background-image: url('/wp-content/uploads/2022/01/sdc.png');
		min-height: 254px;
	}
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img h3{
		font-size: 10px;
	}
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img h2{
		font-size: 25px;
	}
}
@media(max-width:992px)and (min-width: 767px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div {
		bottom: -73%;
    left: 4%;
	}
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
		margin-bottom: 40%;
	}
}
@media(max-width:1024px) and (min-width: 992px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div {
		bottom: -27%;
    left: 3%;
    max-width: 95%;
	}
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img{
		margin-bottom: 40%;
	}
}
@media(max-width:1120px) and (min-width: 1024px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div {
		bottom: -26%;
    left: 3%;
	}
}
@media(max-width:1120px) and (min-width: 1200px){
	#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div {
		bottom: -26%;
    left: 7%;
	}
}
/*end Page Diversité et inclusion*/

/*Page Parcours Académiques*/

#parcours_academiques_s1 .link,#info_bourse{
  padding: 8px 20px;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 500;
  font-family: 'Montserrat';
  text-decoration: none;
}
#info_bourse{
	outline: none;
	border: .5px solid #7ECE06;
}
#parcours_academiques_s1 .link:hover,#info_bourse:hover{
	text-decoration: none;
	background-color: #FFFFFF;
}
#parcours_academiques_s1 .link1{
	background-color: #002B4C;
}
#parcours_academiques_s1 .link1:hover{
	color: #002B4C;
	border: .5px solid #002B4C;
}
#parcours_academiques_s1 .link2,#info_bourse{
	background-color: #7ECE06;
}
#parcours_academiques_s1 .link2:hover,#info_bourse:hover {
	color: #7ECE06;
	border: .5px solid #7ECE06;
}
#parcours_academiques_s1 .description *{
	margin-bottom: 0;
}
#parcours_academiques_s2 .number h2{
	color: #FFFFFF;
	font-family: "Montserrat";
  font-size: 40px;
  font-weight: 700;
  margin: 0;
  position: relative;
  text-decoration: none;
  text-transform: uppercase
}
#parcours_academiques_s2 .number-content:first-child .number h2::after,
#diversite_inclusion_s3 #diversite_inclusion_s3_back_img .white-div .number_content_divertisse:last-child h2::after {
	color: #92CC3F;
  content: '+';
  font-family: "Montserrat";
  font-size: 40px;
  font-weight: 550;
  position: absolute;
  top: 0;
  transform: translate(0, -25%);
}
#parcours_academiques_s2 .number h2:after{
	color: #92CC3F;
  content: '+';
  font-family: "Montserrat";
  font-size: 40px;
  font-weight: 550;
  position: absolute;
  top: 0;
  transform: translate(0, -25%);
}
#parcours_academiques_s2 .title h3{
	color: #FFFFFF;
	font-family: "Montserrat";
  font-size: 13px;
  font-weight: 400;
}
#parcours_academiques_s3 .titre{
	color: #1F9737;
	font-family: 'Cormorant';
	font-size: 30px;
	font-weight: 700;
}
#parcours_academiques_s3 .titre .span-number{
	color: #002B4C;
}
#parcours_academiques_s3 .description-hover{
	max-width: 92%;
	top: 0;
	background-color: rgba(0, 0, 0, 0.4);
	opacity: 0;
	-webkit-transition: all 0.45s ease-in-out;
  -moz-transition: all 0.45s ease-in-out;
  -o-transition: all 0.45s ease-in-out;
  -ms-transition: all 0.45s ease-in-out;
  transition: all 0.45s ease-in-out;
}
#parcours_academiques_s3 .description-hover h3{
	color: #FFFFFF;
	font-family: 'Cormorant';
	font-size: 20px;
	font-weight: 700;
}
#parcours_academiques_s3 .gallery:hover > .description-hover {
  opacity: 1;
}
#parcours_academiques_s3 .gallery img{
  -webkit-transition: all 0.45s ease-in-out;
  -moz-transition: all 0.45s ease-in-out;
  -o-transition: all 0.45s ease-in-out;
  -ms-transition: all 0.45s ease-in-out;
  transition: all 0.45s ease-in-out;
}
#parcours_academiques_s3 .gallery{
	overflow: hidden;
}
#parcours_academiques_s3 .gallery:hover img{
  transform: scale(1.09);
  -webkit-transition: all 0.45s ease-in-out;
  -moz-transition: all 0.45s ease-in-out;
  -o-transition: all 0.45s ease-in-out;
  -ms-transition: all 0.45s ease-in-out;
  transition: all 0.45s ease-in-out;
}
/*end Page Parcours Académiques*/

/*Page Frais de scolarité*/

#frais_scolarite #section1 .description,#frais_scolarite #section1 .description *,
#frais_scolarite #section2 .description,#frais_scolarite #section2 .description *{
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 400;
	color: #6E6F6F;
}
#frais_scolarite #section2 .Academic-year .title,#frais_scolarite #section2 .Degree .title,
#frais_scolarite #section2 .Recedency .title{
	color: #7ECE06;
	font-size: 25px;
	font-family: 'Cormorant';
	font-weight: 700;
}
#frais_scolarite #section2 select{
	-webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;       /* Remove default arrow */
  background-image: url(/wp-content/themes/csm/inc/assets/svg/right-arrow.png);   /* Add custom arrow */
  position: relative;
  font-size: 11px;
  font-family: 'Montserrat';
  font-weight: 500;
  color: #707070;
  background-repeat: no-repeat;
  background-position: 97% 50%;
  outline: none;
}
#frais_scolarite #section2 select::focus-visible {
	border-width: .5px;
}
#frais_scolarite #section2 select option{
  position: relative;
  font-size: 10px;
  font-family: 'Montserrat';
  font-weight: 500;
  color: #707070;
}
#frais_scolarite #section2 .send{
	padding: 8px 36px;
	color: #FFFFFF;
	background-color: #002B4C;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
}
#frais_scolarite #section2 .send:hover{
	color: #002B4C;
	background-color: #FFFFFF;
	border: .5px solid #002B4C;
}

/*end Page Frais de scolarité*/

/*Page Campus et lieux d’apprentissage*/
#campus_lieu_apprentissage #section1::after{
	content: '';
	position: absolute;
	height: 105%;
	width: 25%;
	top: 0;
	right: 0;
	background-color: #7ECE06;
}
@media(max-width:992px){
	#campus_lieu_apprentissage #section1::after{
		height: 400px;
	}
}

#campus_lieu_apprentissage #section1 .description{
	background-color: #EAEBEE;
}
#campus_lieu_apprentissage #section1 .activite:hover{
	transform: scale(1.2);
}
#campus_lieu_apprentissage #section1 .description-hover{
	max-width: 100%;
	top: 0;
	background-color: rgba(0, 0, 0, 0.4);
	opacity: 0;
	-webkit-transition: all 0.45s ease-in-out;
  -moz-transition: all 0.45s ease-in-out;
  -o-transition: all 0.45s ease-in-out;
  -ms-transition: all 0.45s ease-in-out;
  transition: all 0.45s ease-in-out;
}
#campus_lieu_apprentissage #section1 .description-hover h3{
	color: #FFFFFF;
	font-size: 13px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section1 .activite:hover .description-hover {
  opacity: 1;
}
#campus_lieu_apprentissage #section1 .description-hover .link {
	color: #FFFFFF;
	text-decoration: none;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
}
#home-services .link_service{
	color: #002B4C;
  font-family: 'Montserrat';
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}
#home-services .link_service:hover {
	color: #7ECE06;
  text-decoration: none;
}
#campus_lieu_apprentissage #section1 .description-hover .link .fleche,#home-services .fleche {
	color: #7ECE06;
	position: relative;
}
@keyframes defile {
  from {
    left: 10px;
  }
  to {
    left: 5px;
  }
}
#campus_lieu_apprentissage #section1 .description-hover .link .fleche,#home-services .fleche{
  animation: defile .3s infinite alternate;
}
#campus_lieu_apprentissage #section2 .description *{
	font-size: 13px;
	font-weight: 400;
	font-family: 'Montserrat';
	color: #6E6F6F;
}
#campus_lieu_apprentissage #section2 .description ul{
	padding-left: 16px;
}
#campus_lieu_apprentissage #section2 .description ul li{
	font-size: 11px;
}
#campus_lieu_apprentissage #section2 .ville-etudiant{
	background-color: #002B4C;
}
#campus_lieu_apprentissage #section2 .ville-etudiant p,#campus_lieu_apprentissage #section2 .services_attraits p{
	color: #FFFFFF;
	font-size: 10px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section2 .ville-etudiant h2,#campus_lieu_apprentissage #section2 .services_attraits h2{
	color: #FFFFFF;
	font-size: 21px;
	font-weight: 700;
	font-family: 'Cormorant';
}
@media(max-width:992px){
	#campus_lieu_apprentissage #section2 .ville-etudiant h2,,#campus_lieu_apprentissage #section2 .services_attraits h2{
		font-size: 15px;
	}
	#first_section .title,#second_sectrion .title,#parcours_academiques_s1 .titre,
	#parcours_academiques_s2 .titre,#frais_scolarite #section1 .title,#frais_scolarite #section2 .title,
	#campus_lieu_apprentissage #section1 .titre,#campus_lieu_apprentissage #section2 .titre,
	#campus_lieu_apprentissage #section3 .titre,#campus_lieu_apprentissage #section4 .titre,
	#campus_lieu_apprentissage #section5 .titre,#service_carriere #section1 .titre,#service_carriere #section2 .titre,
	#service_carriere #section3 .titre{
		font-size: 25px;
	}
}
#campus_lieu_apprentissage #section2 .ville-etudiant h3{
	color: #FFFFFF;
	font-size: 15px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#campus_lieu_apprentissage #section2 .ville-etudiant h4{
	color: #FFFFFF;
	font-size: 10px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#campus_lieu_apprentissage #section2 .ville-etudiant a{
	color: #7ECE06;
	font-size: 10px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section2 .services_attraits{
	background-color: #1F9737;
}
#campus_lieu_apprentissage #section3{
	background-color: #EFF8FF;
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .arrows button.previous-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_l.svg);
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .arrows button {
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 55px;
  border: 1px solid #fff;
  border-radius: 50%;
  border: 1px solid #0E2A4A;
  height: 38px;
  width: 38px;
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .arrows button.next-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_r.svg);
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .dots ul{
	list-style: none;
	display: flex;
	padding: 0;
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .dots ul li {
	margin-right: 5px;
	border: 1px solid #0E2A4A;
  cursor: pointer;
  height: 4px;
  width: 25px;
  border-radius: 20px;
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .dots ul li.slick-active {
	background-color: #7ECE06;
}
#campus_lieu_apprentissage #section3 .buttons-wrapper .dots ul li button {
	display: none;
}
#campus_lieu_apprentissage #section3 .slick-slider .titre{
	color: #000000;
	font-size: 20px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#campus_lieu_apprentissage #section3 .slick-slider .description{
	color: #6E6F6F;
	font-size: 13px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section3 .slick-slider .link-slider{
	color: #7ECE06;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section3 .slick-slider .link-slider span{
	color: #1F9737;
	animation: defile .3s infinite alternate;
}
.filter{
	top: 0;
 	left: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.33);
}
#campus_lieu_apprentissage #section4 .video-content a{
	overflow: hidden;
}
#campus_lieu_apprentissage #section4 .video-content a:hover img{
	transform: scale(1.15);
}
.filter::after{
	content: url(/wp-content/themes/csm/inc/assets/svg/play_button.svg);
	left: 43%;
  position: absolute;
  top: 43%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  z-index: 15;
  animation: gggg 2s infinite;
  border-radius: 50%;
  width: 40px;
  height: 41px;
}
@keyframes gggg{
  0% {
    box-shadow: 0 0 0 0px #7ECE06;
    transform: scale(1.2);
  }
  100% {
    box-shadow: 0 0 0 8px rgba(0, 0, 0, 0);
    transform: scale(1.2);
  }
}
#campus_lieu_apprentissage #section4 .savoir_plus{
	padding: 8px 25px;
	color: #FFFFFF;
	background-color: #002B4C;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
	border: .5px solid #002B4C;
	outline: none;
}
#campus_lieu_apprentissage #section4 .savoir_plus:hover {
	background-color: #FFFFFF;
	color: #002B4C;
	border: .5px solid #002B4C;
	outline: none;
}
#campus_lieu_apprentissage #section5 h3{
	color: #002B4C;
	font-size: 15px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#campus_lieu_apprentissage #section5 a{
	color: #7ECE06;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
}
#campus_lieu_apprentissage #section5 span.fleche,span.fleche{
	color: #1F9737;
  animation: defile .4s infinite alternate;
}
/*end Page Campus et lieux d’apprentissage*/

/*Page Service carrières*/
.description55 p{
	margin-bottom: 2px;

}
#espace_employeur_btn:focus{
	outline: none;
}
.btn_service_carriere ,.btn_service_carriere2 ,.btn_service_carriere2:focus{
  background-color: #7ECE06;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  font-family: 'Montserrat';
  text-decoration: none;
  border: none;
  outline: none;
  padding: 1rem 3.5rem 1rem 3rem;
}

.btn_service_carriere2 ,.btn_service_carriere2:focus{
  background-color: #002b4c;
}

.btn_service_carriere2.btn_service_carriere1 {
  background-color: #FFFFFF!important;
  color: #1D2124!important;
  border: 1px solid #002b4c!important;
}
.btn_service_carriere1{
	background-color: #FFFFFF!important;
  color: #1D2124!important;
  border: 1px solid #7ECE06!important;
}
#service_carriere #section1 .description *{
	color: #6E6F6F;
	margin-bottom: 8px;
	font-size: 13px;
	font-family: 'Montserrat';
}
#service_carriere #section2{
	min-height: 439px;
	background-image: url(/wp-content/uploads/2022/01/DCXQ.png);
	background-size: cover;
	background-repeat: no-repeat;
}
#service_carriere #section2 .filter::after {
	content: none;
}
#service_carriere #section2 .description *{
	color: #FFFFFF;
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#service_carriere #section2 .statistique{
	max-width: 85%;
	left: 10%;
	bottom: -25%;
	background-color: #FFFFFF;
}
#service_carriere #section2 .statistique .number{
	font-family: "Montserrat";
  font-size: 40px;
  font-weight: 700;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  color: #1D2124;
}
#service_carriere #section2 .statistique .titre{
	color: #1D2124;
	font-family: "Montserrat";
  font-size: 12px;
  font-weight: 400;
}
#service_carriere #section2 .statistique .statistique-content:first-child .number::after{
	color: #92CC3F;
  /*content: '%';*/
  font-family: "Montserrat";
  font-size: 30px;
  font-weight: 600;
  position: absolute;
  top: 0;
  transform: translate(0, -25%);
}
#service_carriere #section2 .statistique .statistique-content .number::after{
	color: #92CC3F;
  content: '+';
  font-family: "Montserrat";
  font-size: 40px;
  font-weight: 550;
  position: absolute;
  top: 0;
  transform: translate(0, -25%);
}
#service_carriere #section3 .description *{
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 400;
	color: #6E6F6F;
	margin-bottom: 8px;
}
#service_carriere #section3 .decouvrir_stage,.decouvrir_stage{
	padding: 6px 30px;
	color: #FFFFFF;
	background-color: #002B4C;
	font-size: 12px;
	font-family: 'Montserrat';
	font-weight: 500;
	outline: none;
	border: none;
}
#service_carriere #section3 .decouvrir_stage:hover,.decouvrir_stage:hover {
	background-color: #FFFFFF;
	color: #002B4C;
	border: .5px solid #002B4C;
}
#service_carriere #section3 .buttons-wrapper .arrows button.previous-arrow,#section2 .buttons-wrapper .arrows button.previous-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_l.svg);
}
#service_carriere #section3 .buttons-wrapper .arrows button,#section2 .buttons-wrapper .arrows button {
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 55px;
  border: 1px solid #fff;
  border-radius: 50%;
  border: 1px solid #0E2A4A;
  height: 38px;
  width: 38px;
}
#service_carriere #section3 .buttons-wrapper .arrows button.next-arrow,#section2 .buttons-wrapper .arrows button.next-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_r.svg);
}
#service_carriere #section3 .buttons-wrapper .dots ul,#section2 .buttons-wrapper .dots ul{
	list-style: none;
	display: flex;
	padding: 0;
	justify-content: center;
}
#service_carriere #section3 .buttons-wrapper .dots ul li,#section2 .buttons-wrapper .dots ul li {
	margin-right: 5px;
	border: 1px solid #0E2A4A;
  cursor: pointer;
  height: 4px;
  width: 25px;
  border-radius: 20px;
}
#service_carriere #section3 .buttons-wrapper .dots ul li.slick-active,#section2 .buttons-wrapper .dots ul li.slick-active {
	background-color: #7ECE06;
}
#service_carriere #section3 .buttons-wrapper .dots ul li button,#section2 .buttons-wrapper .dots ul li button {
	display: none;
}
#service_carriere #section4{
	background-color: #EFF8FF;
}
#service_carriere #section4 .description *{
	color: #1D2124;
	font-size: 15px;
	font-weight: 400;
	font-family: 'Montserrat';
}
.carriere-input::-webkit-input-placeholder{
	color: #707070!important;
	font-size: 11px!important;
	font-weight: 500!important;
	font-family: 'Montserrat'!important;
}
input::-webkit - input - placeholder: after {
   color: red;content: " *";
}
#service_carriere #section4 #carriere-submit,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission #soumetre_form,.custom_form [type=submit]{
	color: #FFFFFF;
	padding: 10px 30px;
	background-color: #7ECE06;
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 500;
   border: 0.8px solid #7ECE06;
   outline: none;
}

#service_carriere #section4 #carriere-submit:hover,
#service_carriere #section4 #carriere-submit:focus,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission #soumetre_form:hover,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission #soumetre_form:focus,
.custom_form [type=submit]:hover,
.custom_form [type=submit]:focus {
	background-color: transparent;
	color: #7ECE06;
	border: .8px solid #7ECE06;
	box-shadow: none;
}
/*end Page Service carrières*/

/* Page Services complémentaires*/

#service_complementaires #service_complementaires_s1 .description{
	color: #6E6F6F;
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#service_complementaires #service_complementaires_s2 .blue-block{
	background-color: #002B4C;
	padding: 20px;
}
#service_complementaires #service_complementaires_s3 .grenn_block_evo{
	padding: 20px;
}
@media(min-width:992px) {
	#service_complementaires #service_complementaires_s2 .blue-block,
	#service_complementaires #service_complementaires_s3 .grenn_block_evo {
		max-width: 65%;
	}
}
#service_complementaires #service_complementaires_s2 .blue-block h2{
	color: #FFFFFF;
	font-size: 25px;
	font-weight: 700;
	font-family: 'Cormorant';
	position: relative;
}
#service_complementaires #service_complementaires_s2 .blue-block h2::before,
#service_complementaires #service_complementaires_s3 .grenn_block_evo h3::before {
	content: "";
	background-color: #FFFFFF;
	width: 20%;
 	height: 2px;
 	position: absolute;
 	top: -9px;
}
#service_complementaires #service_complementaires_s2 .blue-block ol li,
#service_complementaires #service_complementaires_s3 .grenn_block_evo ol li,
#service_complementaires #service_complementaires_s2 .blue-block p,
#service_complementaires #service_complementaires_s2 .grenn_block_evo p
{
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#service_complementaires #service_complementaires_s3 .grenn_block_evo ol li{
	padding-bottom: 12px;
}
#service_complementaires #service_complementaires_s3 .service-content h3{
	color: #002B4C;
	font-size: 18px;
	font-family: 'Cormorant';
	font-weight: 700;
}
#service_complementaires #service_complementaires_s3 .service-content p{
	color: #6E6F6F;
	font-size: 12px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#service_complementaires #service_complementaires_s3 .decouvrez_aides,
#service_complementaires #service_complementaires_s5 .savoir_plus,
#vie_etudiante_associative #vie_etudiante_associative_s1 .savoir_plus,
#vie_etudiante_associative #vie_etudiante_associative_s3 .visite_blog,#logement_btn,#logement_btn2 {
 	padding: 5px 20px;
 	color: #FFFFFF;
 	background-color: #002B4C;
 	font-size: 12px;
 	font-weight: 500;
 	font-family: 'Montserrat';
 	border: none;
 	outline: none;
}
#logement_btn2{
	background-color: #7ECE06;
}
#logement_btn2:hover{
	color: #7ECE06;
	border: .8px solid #7ECE06;
	background-color: transparent;
}
#service_complementaires #service_complementaires_s3 .decouvrez_aides:hover,
#vie_etudiante_associative #vie_etudiante_associative_s1 .savoir_plus:hover,
#vie_etudiante_associative #vie_etudiante_associative_s3 .visite_blog:hover,
#logement_btn:hover {
 	background-color: #FFFFFF;
 	color: #002B4C;
 	border: .8px solid #002B4C;
}
#service_complementaires #service_complementaires_s5 .savoir_plus:hover{
	background-color: transparent;
 	color: #002B4C;
 	border: .8px solid #002B4C;
}
#service_complementaires #service_complementaires_s3 .service-aide-content{
	max-width: 450px;
  margin: 0 auto;
}
#service_complementaires #service_complementaires_s3 .service-aide-content .blue-block{
	background-color: #002B4C;
}
#service_complementaires #service_complementaires_s3 .service-aide-content .green-block,
.grenn_block_evo{
	background-color: #7ECE06;
}
#service_complementaires #service_complementaires_s3 .service-aide-content h2,
#service_complementaires #service_complementaires_s3 .grenn_block_evo h3{
	color: #FFFFFF;
	font-size: 22px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#service_complementaires #service_complementaires_s3 .service-aide-content p,
#service_complementaires #service_complementaires_s3 .grenn_block_evo .description *{
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#service_complementaires #service_complementaires_s5 .content-background{
	min-height: 250px;
	background-size: cover;
	background-repeat: no-repeat;
}
#service_complementaires #service_complementaires_s5 .content-background .content-container{
	min-height: 250px;
}
#service_complementaires #service_complementaires_s5 .content-background .filter{
	background-color: rgba(239, 248, 255, 0.7);
	min-height: 250px;
}
#service_complementaires #service_complementaires_s5 .content-background .filter::after{
	content: none;
}
/*end Page Services complémentaires*/

/*Page Vie étudiante et associative*/

#vie_etudiante_associative #vie_etudiante_associative_s1 .buttons-wrapper .arrows button.previous-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_l.svg);
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .buttons-wrapper .arrows button {
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 55px;
  border: 1px solid #fff;
  border-radius: 50%;
  border: 1px solid #0E2A4A;
  height: 38px;
  width: 38px;
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .buttons-wrapper .arrows button.next-arrow {
  background-image: url(/wp-content/themes/csm/inc/assets/svg/fleche_r.svg);
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .slick-slider .slick-content h2{
	font-size: 20px;
	font-weight: 700;
	font-family: 'Cormorant';
	color: #000000;
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .slick-slider .slick-content .description p{
	font-size: 11px;
	font-weight: 400;
	font-family: 'Montserrat';
	color: #707070;
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .slick-slider .slick-content .link a{
	color: #7ECE06;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
	text-decoration: none;
}
#vie_etudiante_associative #vie_etudiante_associative_s1 .slick-slider .slick-content .link a span{
	color: #1F9737;
  animation: defile .4s infinite alternate;
}
#vie_etudiante_associative #vie_etudiante_associative_s2 .service-aide-content{
	max-width: 450px;
  margin: 0 auto;
}
#vie_etudiante_associative #vie_etudiante_associative_s2 .service-aide-content .blue-block{
	background-color: #002B4C;
}
#vie_etudiante_associative #vie_etudiante_associative_s2 .service-aide-content .green-block{
	background-color: #7ECE06;
}
#vie_etudiante_associative #vie_etudiante_associative_s2 .service-aide-content h2{
	color: #FFFFFF;
	font-size: 22px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#vie_etudiante_associative #vie_etudiante_associative_s2 .service-aide-content p{
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#vie_etudiante_associative #vie_etudiante_associative_s3 h3{
	color: #002B4C;
	font-size: 15px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#vie_etudiante_associative #vie_etudiante_associative_s3 a{
	color: #7ECE06;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
}
#vie_etudiante_associative #vie_etudiante_associative_s3 span.fleche{
	color: #1F9737;
  animation: defile .4s infinite alternate;
}
#vie_etudiante_associative #vie_etudiante_associative_s3 .filter::after{
	content: none;
}
#vie_etudiante_associative #vie_etudiante_associative_s3 .filter h3{
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#vie_etudiante_associative #vie_etudiante_associative_s3 .date{
	color: #FFFFFF;
	font-size: 10px;
	font-weight: 400;
	font-family: 'Montserrat';
	margin: 0;
}
#vie_etudiante_associative #vie_etudiante_associative_s3 .filter a{
	color: #FFFFFF;
}
#vie_etudiante_associative #vie_etudiante_associative_s3 .filter span.fleche{
	color: #7ECE06;
}
/*End Page Vie étudiante et associative*/

/*Page Pré requis et conditions d’admission*/

#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list p{
	font-size: 13px;
	font-weight: 400;
	font-family: 'Montserrat';
	color: #6E6F6F;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list .titre{
	font-size: 15px;
	font-weight: 500;
	font-family: 'Montserrat';
	color: #002B4C;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list ul li{
	font-size: 11px;
	font-weight: 400;
	font-family: 'Montserrat';
	color: #6E6F6F;
	position: relative;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list ul li::after{
	color: #1F9737;
	font-size: 20px;
	font-weight: 700;
	font-family: 'Cormorant';
	position: absolute;
	left: -17px;
	top: 25px;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list ul li:last-child::after{
	content: none;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .description_list ul li::marker {
	color: #7ECE06;
  font-size: 15px;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .experience{
	background-color: rgba(31, 151, 55, 0.33);
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .experience .exclamation{
	background-color: rgba(31, 151, 55, 0.43);
	border: 1px solid #1E9736;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .experience .exclamation h3{
	color: #1F9737;
	font-size: 25px;
	font-family: 'Montserrat';
	font-weight: 600;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s1 .experience .description {
	color: #1F9737;
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 600;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 .table tr,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 .table td,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 .table th {
	font-weight: 600;
	font-family: 'Montserrat';
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 .table th{
	font-size: 20px;
	color: #1D2124;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 .table td{
	font-size: 12px;
	color: #002B4C;
}

/*End Page Pré requis et conditions d’admission*/

/*single Actualité*/
.actualite .titre-actualite-vert{
	color: #7ECE06;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Montserrat';
}
.actualite .fa-facebook-f:before{
	color: #002B4C;
	font-size: 20px;
}
.actualite .fa-linkedin-in:before {
  color: #7ECE06;
	font-size: 20px;
}
.actualite .fa-twitter:before{
	color: #002B4C;
	font-size: 20px;
}
.actualite .fa-instagram:before {
  color: #7ECE06;
	font-size: 20px;
}
.actualite .actualite-content p,.actualite .actualite-content-last-block .description-actualite *{
	color: #6E6F6F;
	font-size: 16px;
	font-weight: 400;
	font-family: 'Montserrat';
}
.actualite .actualite-content h2{
	color: #000000;
	font-size: 25px;
	font-weight: 700;
	font-family: 'Cormorant';
}

/*end single Actualité*/

/*Page Actualité*/

#actualite #actualite_content .filter::after {
	content: none;
}
#actualite #actualite_content .filter h3{
	color: #FFFFFF;
	font-size: 20px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#actualite #actualite_content .filter p{
	color: #FFFFFF;
	font-size: 11px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#actualite #actualite_content .flip-card {
  background-color: transparent;
  height: 165px;
  perspective: 1000px;
}
#actualite #actualite_content .flip-card h2,#actualite #actualite_content .third-act .third-act-content h3,
#actualite #actualite_content .fourth-content h3,#actualite #actualite_content .five-act h3{
	color: #000000;
	font-size: 20px;
	font-weight: 700;
	font-family: 'Cormorant';
}
#actualite #actualite_content .flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

#actualite #actualite_content .flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

#actualite #actualite_content .flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

#actualite #actualite_content .flip-card-front {
  background-color: #FFFFFF;
  color: black;
}

#actualite #actualite_content .flip-card-back {
  background-color: #2980b9;
  color: white;
  transform: rotateY(180deg);
}
#actualite #actualite_content .flip-card{
	margin-bottom: 20px;
}
#actualite #actualite_content .flip-card:nth-child(3n){
	margin-bottom: 0;
}
#actualite #actualite_content .flip-card:nth-child(4n){
	margin-bottom: 0;
}
#actualite #actualite_content .third-act .third-act-content{
	background-color: #FFFFFF;
	margin-right: 0;
	margin-left: 0;
}
#actualite #actualite_content .third-act .third-act-content:nth-child(1n){
	margin-bottom: 12px;
}
#actualite #actualite_content .third-act .third-act-content p{
	padding-bottom: 5px;
}
#actualite #actualite_content .third-act .third-act-content p,
#actualite #actualite_content .fourth-content p,#actualite #actualite_content .five-act p{
	color: #707070;
	font-size: 11px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#actualite #actualite_content .count-act p{
	color: #707070;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Montserrat';
}
#actualite #actualite_content .count-act p #count,#actualite #actualite_content .count-act p #count #url_count{
	color: #707070;
	font-size: 15px;
	font-weight: 400;
	font-family: 'Montserrat';
}

/*end Page Actualité*/

/*offre de stage*/

#offre_stage #offre_stage_s1 .content-input,#admission #admission_s2 #form_admission .content-input,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .content-input,
#vie_etudiante_associative #formulaire #vie_etudiant_form .content-input,#service-cariere-form .content-input,
#frais_scolarite #section2 #vie_etudiant_form .content-inpu,#post_R_H .content-input,
.custom_form .content-input{
	position: relative;
	box-sizing: border-box;
	/*min-width: 300px;*/
	border: none;
}
#offre_stage #offre_stage_s1 .content-input .textfield__label,#admission #admission_s2 #form_admission .textfield__label,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .textfield__label,
#vie_etudiante_associative #formulaire #vie_etudiant_form .textfield__label,#frais_scolarite #section2 #vie_etudiant_form .textfield__label,
#service-cariere-form .textfield__label,#post_R_H .textfield__label,
.custom_form input + label.textfield__label{
	position: absolute;
	top: 64%;
	left: 6%;
	display: block;
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 500;
	line-height: 24px;
	color: #707070;
	user-select: none;
	cursor: text;
	pointer-events: none;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission label,
#vie_etudiante_associative #formulaire #vie_etudiant_form label{
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 500;
	margin-bottom: 0;
}
#offre_stage #offre_stage_s1 .content-input .textfield__label::after,
#admission #admission_s2 #form_admission .textfield__label::after,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .textfield__label::after,
#vie_etudiante_associative #formulaire #vie_etudiant_form .textfield__label::after,
#frais_scolarite #section2 #vie_etudiant_form .textfield__label::after,#service-cariere-form .textfield__label::after,
#post_R_H .textfield__label::after,
.custom_form .textfield__label::after {
	position: relative;
	top: -3px;
	left: 5px;
	display: inline-block;
	content: "*";
	color: #d0011b;
}
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .cv .textfield__label::before,
#offre_stage #offre_stage_s1 .cv .textfield__label::before,#service-cariere-form  input[type="file"] + .textfield__label::before,
#post_R_H .cv::before {
	content: url(/wp-content/themes/csm/inc/assets/svg/import.svg);
	position: absolute;
	right: 2%;
	z-index: 1;
}
#offre_stage #offre_stage_s1 .content-input .input-form,#admission #admission_s2 #form_admission .input-form,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form,
#frais_scolarite #section2 #vie_etudiant_form .input-form,#service-cariere-form .input-form,#post_R_H .input-form,
.custom_form .input-form{
	display: block;
	box-sizing: border-box;
	height: 48px;
	width: 100%;
	padding: 11px 14px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: #fff;
	font-weight: 500;
	font-size: 11px;
	line-height: 24px;
	outline: none;
	transition: all 0.25s linear;
}
#service-cariere-form label.input-form{
cursor: pointer;
}
#offre_stage #offre_stage_s1 .content-input .input-form:focus,#admission #admission_s2 #form_admission .input-for:focus,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form:focus,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form:focus,
#frais_scolarite #section2 #vie_etudiant_form .input-form:focus,#service-cariere-form .input-form:focus,#post_R_H .input-form:focus {
	border-color: #3a82c6;
}
#offre_stage #offre_stage_s1 .content-input .input-form:disabled,#admission #admission_s2 #form_admission .input-for:disabled,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form:disabled,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form:disabled,
#frais_scolarite #section2 #vie_etudiant_form .input-form:disabled,#service-cariere-form .input-form:disabled,#post_R_H .input-form:disabled{
	border-color: #e6e6e6;
	background: #f9fafb;
}
#offre_stage #offre_stage_s1 .content-input #message::placeholder ,
.custom_form .content-input #message::placeholder {
	font-size: 11px;
	font-family: 'Montserrat';
	font-weight: 500;
	line-height: 24px;
	color: #707070;
}
#offre_stage #offre_stage_s1 .content-input .input-form::placeholder,
#admission #admission_s2 #form_admission .content-input .input-form::placeholder ,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form::placeholder,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form::placeholder,
#frais_scolarite #section2 #vie_etudiant_form .input-form::placeholder,#service-cariere-form .input-form::placeholder,
#post_R_H .input-form::placeholder,
.custom_form .input-form::placeholder{
	color: transparent;
}
#offre_stage #offre_stage_s1 .content-input .input-form:focus + .textfield__label,
#offre_stage #offre_stage_s1 .content-input .input-form:valid + .textfield__label,
#offre_stage #offre_stage_s1 .content-input .input-form:disabled + .textfield__label,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form:focus + .textfield__label,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form:valid + .textfield__label,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .input-form:disabled + .textfield__label,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form:focus + .textfield__label,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form:valid + .textfield__label,
#vie_etudiante_associative #formulaire #vie_etudiant_form .input-form:disabled + .textfield__label,
#frais_scolarite #section2 #vie_etudiant_form .input-form:focus + .textfield__label,
#frais_scolarite #section2 #vie_etudiant_form .input-form:valid + .textfield__label,
#frais_scolarite #section2 #vie_etudiant_form .input-form:disabled + .textfield__label
#service-cariere-form .input-form:focus + .textfield__label,
#service-cariere-form .input-form:valid + .textfield__label,
#service-cariere-form .input-form:disabled + .textfield__label,
#post_R_H .input-forminput-form:focus + .textfield__label,#post_R_H .input-form:valid + .textfield__label,
#post_R_H .input-form:disabled + .textfield__label,
.custom_form .input-form:valid + .textfield__label,
.custom_form .input-form:disabled + .textfield__label,
.custom_form .input-form:focus + .textfield__label{
	display: none!important;
}
#ressources_humaines_s1 .filter::after{
	content: none;
}
#offre_stage #offre_stage_s1 .cv,{
	margin-left: 15px;
	margin-right: 15px;
}
#offre_stage #offre_stage_s1 .content-input #cv,
#prerequis_conditions_dadmission #prerequis_conditions_dadmission_s2 #postule_condition_admission .hidden,#carriere-file,
#post_R_H .hidden {
  height: 100%;
  background: transparent;
  position: absolute;
  left: 0;
  opacity: 0;
  top: 30px;
  bottom: 0;
  width: 98%;
  z-index: 1;
  cursor: pointer;
}
#offre_stage #offre_stage_s1 #soumetre_form,#vie_etudiante_associative #formulaire #vie_etudiant_form #soumetre_form{
	color: #FFFFFF;
	background-color: #7ECE06;
	font-size: 13px;
	font-family: 'Montserrat';
	border: none;
	outline: none;
	font-weight: 500;
	padding: 10px 20px;
}
#offre_stage #offre_stage_s1 #soumetre_form:hover,#vie_etudiante_associative #formulaire #vie_etudiant_form #soumetre_form:hover {
	background-color: transparent;
	color: #7ECE06;
	border: 0.5px solid #7ECE06;
}
#offre_stage #offre_stage_s2,#admission #admission_s2{
	background-color: #EFF8FF;
}
#offre_stage #offre_stage_s2 button{
	color: #FFFFFF;
	background-color: #002B4C;
	font-size: 13px;
	font-family: 'Montserrat';
	border: none;
	outline: none;
	font-weight: 500;
	padding: 10px 20px;
}
#offre_stage #offre_stage_s2 button:hover {
	background-color: transparent;
	color: #002B4C;
	border: 0.5px solid #002B4C;
}

@media(max-width: 992px){
	#offre_stage #offre_stage_s1 .content-input .input-form {
		width: 91%;
	}
	#offre_stage #offre_stage_s1 .ajax{
		width: 95%;
	}
}
/*end offre de stage*/

/*Page Admission*/
#admission #admission_s2 #form_admission input[type='checkbox'] {
	width: 23px;
	height: 23px;
}
#admission #admission_s2 #form_admission .label_checkbox{
	font-size: 15px;
	font-family: 'Montserrat';
	font-weight: 400;
	color: #1D2124;
	padding-left: 7px;
}
#admission #admission_s2 #form_admission .titre_check {
	font-size: 17px;
	font-family: 'Montserrat';
	font-weight: 500;
	color: #1D2124;
}
#admission #admission_s2 #form_admission .metter_star::after {
	content: '*';
  color: red;
}
#admission #admission_s2 #form_admission #ville_select,
#admission #admission_s2 #form_admission #pays_select,
#admission #admission_s2 #form_admission #first_choix,
#admission #admission_s2 #form_admission #second_choix,#pole_projet,#domaine_exercices,
.custom_form select{
	font-size: 11px;
  font-family: 'Montserrat';
  font-weight: 500;
  line-height: 24px;
  color: #707070;
  border: 1px solid #ccc;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-left: 22px;
  border-radius: 5px;
  min-height: 48px;
}
#admission #admission_s2 #form_admission .content-select::after,.custom_form .content-select:after{
	content: ' ';
  background-image: url(/wp-content/themes/csm/inc/assets/svg/select_pink.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 10px;
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translate(0%, -50%);
  -webkit-transform: translate(0%, -50%);
  -moz-transform: translate(0%, -50%);
  -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
  width: 12px;
}
#admission #admission_s2 #form_admission .div_border{
	border-top: 1px solid #1E2124;
}
#admission #admission_s2 #form_admission #first_choix,
#admission #admission_s2 #form_admission #second_choix{
	height: 40px;
}
#admission #admission_s2 #form_admission #admission_submit,
#frais_scolarite #section2 #vie_etudiant_form #soumetre_form,#soumetre_form{
	color: #FFFFFF;
	background-color: #7ECE06;
	font-size: 13px;
	font-family: 'Montserrat';
	font-weight: 500;
	padding: 10px 20px;
	border: 0.5px solid #7ECE06;
	outline: none;
}
#admission #admission_s2 #form_admission #admission_submit:hover,
#frais_scolarite #section2 #vie_etudiant_form #soumetre_form:hover,#soumetre_form:hover {
	background-color: transparent;
	color: #7ECE06;
}
#admission #admission_s2 #form_admission .content-input .input-form:focus + .textfield__label,
#admission #admission_s2 #form_admission .content-input .input-form:valid + .textfield__label,
#admission #admission_s2 #form_admission .content-input .input-form:disabled + .textfield__label, 
.custom_form .content-input .input-form:disabled + .textfield__label ,
.custom_form .content-input .input-form:valid + .textfield__label,
.custom_form .content-input .input-form:valid + .textfield__label{
	display: none!important;
}

/*End Page Admission*/

/*Single events*/

#single_evenement #banner .banner_desc{
	color: #FFFFFF;
	font-size: 9px;
	font-family: 'Montserrat';
	font-weight: 400;
}
#single_evenement #section1 .titre{
	font-family: 'Cormorant';
  font-weight: 700;
  font-size: 22px;
  color: #1D2124;
  margin-top: 2px;
  margin-bottom: 5px;
  line-height: 1;
}
#single_evenement #section1 .description *{
	font-family: 'Montserrat';
  font-weight: 400;
  font-size: 11px;
  color: #1D2124;
}
#single_evenement #section1 .share_tags h3,#single_blog #section1 .share_tags h3{
	font-family: 'Cormorant';
  font-weight: 700;
  font-size: 17px;
	color: #1D2124;
}
#single_evenement #section1 .share_tags p,#single_blog #section1 .share_tags p{
	font-family: 'Montserrat';
  font-weight: 400;
  font-size: 13px;
	color: #7ECE06;
}
#single_evenement #section1 .share_tags .fab,#single_blog #section1 .share_tags .fab{
 	color: #1F9737;
 	font-size: 15px;
}
#single_evenement #section1 .share_tags .fab:hover, #single_blog #section1 .share_tags .fab:hover{
 	color: #1D2124;
}
#single_evenement #section1 .recent-events h3,#single_blog #section1 .recent-event h3{
	font-family: 'Cormorant';
  font-weight: 700;
  font-size: 20px;
	color: #002B4C;
}
#single_evenement #section1 .recent-link:hover,#single_blog #section1 .recent-link:hover {
	text-decoration: none;
}
#single_evenement #section1 .recent-link .recent-title,#single_blog #section1 .recent-link .recent-title{
	font-family: 'Montserrat';
  font-weight: 400;
  font-size: 11px;
	color: #1D2124;
}
#single_evenement #section1 .recent-link .recent-date p,#single_blog #section1 .recent-link .recent-date p{
	font-family: 'Montserrat';
  font-weight: 400;
  font-size: 9px;
	color: #CCCCCC;
}
#single_evenement #section1 .contact_event h3,#single_blog #section1 .contact_event h3{
	font-family: 'Cormorant';
  font-weight: 700;
  font-size: 16px;
	color: #1F9737;
}
#single_evenement #section1 .contact_event .telephone_events .link_tel,
#single_evenement #section1 .contact_event .mail_events .link_mail,
#single_blog #section1 .contact_event .telephone_events .link_tel,
#single_blog #section1 .contact_event .mail_events .link_mail{
	text-decoration: none;
}
#single_evenement #section1 .contact_event .telephone_events .link_tel p,
#single_evenement #section1 .contact_event .mail_events .link_mail p,
#single_blog #section1 .contact_event .telephone_events .link_tel p,
#single_blog #section1 .contact_event .mail_events .link_mail p{
	font-family: 'Montserrat';
  font-weight: 400;
  font-size: 9px;
	color: #1D2124;
}

/*end Single events*/
/*evolutif retour*/
@media(min-width: 767px){
	#bottom_button{
		bottom: -10%;
	}
}
.table-style thead{
	background-color: #7ECE06;
	color: #FFFFFF;
	text-align: center;
}
.table-style thead tr th:first-child,.table-style thead tr th:last-child {
	border: none;
}
.table-style thead tr th{
	border-right: 1px solid #FFFFFF;
}
.table-style tbody tr td:first-child{
	text-align: initial;
	font-size: 18px;
	font-weight: 500;
	font-family: 'Montserrat';
	color: #1D2124;
	background-color: transparent;
}
.table-style tbody tr td{
	background-color: #FFFFFF;
	text-align: center;
}
.table-style tbody tr:last-child td:first-child { 
	background:#002B4C;
	color: #FFFFFF; 
	font-weight: 600;
}
#frais_scolarite #section2 #vie_etudiant_form .programme{
	font-size: 11px;
  font-family: 'Montserrat';
  font-weight: 500;
  line-height: 24px;
  color: #707070;
  border: 1px solid #ccc;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-left: 22px;
  border-radius: 5px;
  height: 48px;
}
#frais_scolarite #section2 .evo_blue_div {
    background-color: #002B4C;
}
#frais_scolarite #section2 .evo_green_div {
    background-color: #1F9737;
}
#frais_scolarite #section2 .evo_blue_div h2,#frais_scolarite #section2 .evo_green_div h2{
	color: #FFFFFF;
  font-size: 20px;
  font-weight: 700;
  font-family: 'Cormorant';
}
#frais_scolarite #section2 .evo_blue_div p,#frais_scolarite #section2 .evo_green_div p{
	color: #FFFFFF;
  font-size: 12px;
  font-weight: 400;
  font-family: 'Montserrat';
}
#frais_scolarite #section2 .evo_blue_div a{
	color: #7ECE06;
  font-size: 10px;
  font-weight: 400;
  font-family: 'Montserrat';
}
#frais_scolarite #section2 .evo_blue_div .fichier_block {
	color: #FFFFFF;
	background-color: #7ECE06;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 500;
	font-family: 'Cormorant';
	text-decoration: none;
}
#frais_scolarite #section2 .evo_blue_div .fichier_block:hover {
	background-color: transparent;
	color: #7ECE06;
	border: 1px solid #7ECE06;
	text-decoration: none;
}
#frais_scolarite #section2 .evo_green_div .fichier_block{
	color: #FFFFFF;
	background-color: #002B4C;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 500;
	font-family: 'Cormorant';
	text-decoration: none;
}
#frais_scolarite #section2 .evo_green_div .fichier_block:hover {
	background-color: transparent;
	color: #002B4C;
	padding: 10px 20px;
	font-size: 13px;
	font-weight: 500;
	border: 1px solid #002B4C;
	text-decoration: none;
}
.form-background{
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.desc-white p{
	color: #FFFFFF!important;
}


/*header*/
#top_head_inscris a{
	text-decoration: none;
	font-size: 13px;
	background-color: #FFFFFF;
	border: 1px solid #002B4C;
  border: none;
  color: #002B4C;
  font-family: 'Montserrat';
  font-weight: 600;
  outline: none;
  padding: 0.5rem 1rem;
  text-align: center;

}
.navbar-light .navbar-toggler-icon {
    background-image: url('/wp-content/themes/csm/inc/assets/svg/Icon feather-menu.svg');
}
@media only screen and (min-width: 992px) {
	#menu-main li:last-child .dropdown-menu,#menu-main li:nth-last-child(2) .dropdown-menu{
	  left: auto;
	  min-width: 12.5rem;
	  right: 0;
	}
	.navbar-expand-lg .navbar-nav .dropdown-menu{
	  opacity: 0;
	  display: block!important; 
	  visibility: hidden;
	}
	.dropdown .open .dropdown-menu {
	  display: block;
	  left: 12.250em;
	  top: 0;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .show .dropdown-menu {
	  opacity: 1;
	  visibility: visible;
	}
	#masthead .navbar-nav .dropdown-toggle{
		padding: 0 5px;
	}
	.dropdown-menu .dropdown-item{
		font-size: 13px;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .current-menu-ancestor a::before{
		opacity: 1;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .current-menu-ancestor .current_page_item.active a,
	body:not(.theme-preset-active) #masthead .navbar-nav .current-menu-item a{
		color: #1F9737;
		transform: scale(1.01);
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .show li:hover > a{
		color: #1F9737;
		transform: scale(1.018);
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .show a::before{
		opacity: 1;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav > li > a::before{
		content: "";
		position: absolute;
		bottom: 5px;
		width: 83%;
		height: 0.8px;
		background-color: #7ECE06;
		opacity: 0;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav > li > a::after{
		content: none;
	}
}
@media only screen and (max-width: 991px){
	body:not(.theme-preset-active) #masthead .navbar-nav > .current-menu-ancestor > .dropdown-toggle {
		color: #1F9737!important;
	}
	.current-menu-ancestor .current_page_item a{
		color: #1F9737;
	}
	#main-nav{
		background-color: #FFFFFF;
		width: 100vw;
    border-top: 1px solid rgb(224, 224, 224);
    height: 384%;
    overflow: auto;
    top: 101%;
    position: absolute;
    align-items: initial;
    transform: translate(-50%, 0);
    left: 50%;
	}
	#menu-main{
		padding-left: 20px;
		padding-top: 15px;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav > li > a{
		color: #000000!important;
		font-size: 12px!important;
	}
	body:not(.theme-preset-active) #masthead .navbar-nav .dropdown-item{
		font-size: 12px;
		padding-top: 5px;
	}
	.navbar-toggler{
		background-color: transparent;
  	border: none;
  	cursor: pointer;
  	display: flex;
  	padding: 0;
	}
	.line {
	  fill: none;
	  stroke: #FFFFFF;
	  stroke-width: 6;
	  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
	    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
	}
	.line1 {
	  stroke-dasharray: 60 207;
	  stroke-width: 6;
	}
	.line2 {
	  stroke-dasharray: 60 60;
	  stroke-width: 6;
	}
	.line3 {
	  stroke-dasharray: 60 207;
	  stroke-width: 6;
	}
	.opened .line1 {
	  stroke-dasharray: 90 207;
	  stroke-dashoffset: -134;
	  stroke-width: 6;
	}
	.opened .line2 {
	  stroke-dasharray: 1 60;
	  stroke-dashoffset: -30;
	  stroke-width: 6;
	}
	.opened .line3 {
	  stroke-dasharray: 90 207;
	  stroke-dashoffset: -134;
	  stroke-width: 6;
	}

}
/*end header*/

/*loader*/
#loader{
	width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  align-items: center;
  justify-content: center;
  background-color: #FFFFFF;
  display: flex;
  height: 100%;
  z-index: 999;
}
.loader  {
  animation: rotate 1s infinite;  
  height: 50px;
  width: 50px;
}

.loader:before,
.loader:after {   
  border-radius: 50%;
  content: '';
  display: block;
  height: 20px;  
  width: 20px;
}
.loader:before {
  animation: ball1 1s infinite;  
  background-color: #F01414;
  box-shadow: 30px 0 0 #fd8585;
  margin-bottom: 10px;
}
.loader:after {
  animation: ball2 1s infinite; 
  background-color: #1F9737;
  box-shadow: 30px 0 0 #7ECE06;
}

@keyframes rotate {
  0% { 
    -webkit-transform: rotate(0deg) scale(0.8); 
    -moz-transform: rotate(0deg) scale(0.8);
  }
  50% { 
    -webkit-transform: rotate(360deg) scale(1.2); 
    -moz-transform: rotate(360deg) scale(1.2);
  }
  100% { 
    -webkit-transform: rotate(720deg) scale(0.8); 
    -moz-transform: rotate(720deg) scale(0.8);
  }
}

@keyframes ball1 {
  0% {
    box-shadow: 30px 0 0 #f8b334;
  }
  50% {
    box-shadow: 0 0 0 #f8b334;
    margin-bottom: 0;
    -webkit-transform: translate(15px,15px);
    -moz-transform: translate(15px, 15px);
  }
  100% {
    box-shadow: 30px 0 0 #f8b334;
    margin-bottom: 10px;
  }
}

@keyframes ball2 {
  0% {
    box-shadow: 30px 0 0 #97bf0d;
  }
  50% {
    box-shadow: 0 0 0 #97bf0d;
    margin-top: -20px;
    -webkit-transform: translate(15px,15px);
    -moz-transform: translate(15px, 15px);
  }
  100% {
    box-shadow: 30px 0 0 #97bf0d;
    margin-top: 0;
  }
}



/*modal**/
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}