@import url('https://fonts.googleapis.com/css?family=Rubik:300,400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap');

#logoEmailFrancaisSmall{
	max-width: 70%;
}

/*CONTENU*/

.intro {
	margin: auto;
	padding: 45px 25px 0 25px;
	text-align: center;
	}

.intro h1 {
	color : #344b57;
	text-align: center;
	font-size: 55px;
	font-weight: 500;
	font-family: 'Rubik', sans-serif;
letter-spacing: -3px;
}

.intro .btn-cestparti {
	width: 230px;
	border : 2px solid #42c4df;
	border-radius: 6px;
	background-color: white;
	font-family: 'Rubik', sans-serif;
	font-weight: 400;
	color: #42c4df;
	margin: 8px auto;
	padding: 10px;
}

.intro .btn-cestparti:hover {
background-color: #42c4df;
	color: white;
	border : 2px solid #42c4df;
}

.intro img {
	bottom : -44px;
	position: inherit;
}

video {
	margin: 30px 0;
	width: 100%;
	height: auto;
}

.blocs1_2_3  {
	width: 100%;
	border-top : 10px solid #d0f2f2;
	background-color: #42c4df;
}



.blocs1_2_3 .main img {
margin-bottom : 20px;
}

.blocs1_2_3 .main {
	text-align: center;
	font-weight: 500;
	color: white;
	margin: 60px 25px;
}

.blocs1_2_3 .main h2 {
		font-size: 40px;
	font-weight: 500;
}

.blocs1_2_3 .main p {
		font-size: 22px;
	font-weight: 400;
}

.blocs1_2_3 .separateur {
 margin: 25px 0;
	height: 5px;
	background: #8edcec;
}



.blocs1_2_3 .bloc_btn-cestparti {
		position: relative;
	width: 340px;
	margin: auto;
}

.blocs1_2_3 .btn-cestparti {
	width: 340px;
	border : 2px solid white;
	border-radius: 6px;
	background-color: #42c4df;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 22px;
	color: white;
	margin: 30px auto;
	padding: 10px;

}


 .btn-cestparti:hover {
background-color: white ;
	color: #344a56;
	border : 2px solid white;
}

 .personnage_bouton{
	 pointer-events: none;
 }
.blocs1_2_3 .personnage_bouton {
	position: absolute;
	right: 10px;
    bottom: -3px;
    width: 84px;
}



.blocs_email {
	text-align: center;
	background-color: #344a56;
}

.blocs_email .row {
max-width: 1200px;
margin: auto;
padding: 50px 0;
}

.blocs_email .row h2 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 50px;
	color: white;
	margin-bottom: 30px;
}

.blocs_email .row .col-md-4 {
padding: 15px;
	}


.blocs_email  img {
	cursor: pointer;
}


.blocs_email .bloc_btn-cestparti {
		position: relative;
	width: 340px;
	margin: auto;
}

.blocs_email .btn-cestparti {
	width: 340px;
	border : 2px solid white;
	border-radius: 6px;
	background-color: #344a56;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 22px;
	color: white;
	margin: 30px auto;
	padding: 10px;

}


.blocs_email .btn-cestparti:hover {
background-color: white ;
	color: #42c4df;
	border : 2px solid white;
}

.blocs_email .personnage_bouton {
	position: absolute;
right: 10px;
    bottom: -3px;
    width: 84px;
}


.blocs_doityourself  {
text-align: center;
	background-color: white;
}

.blocs_doityourself .diy {
	margin: auto;
	text-align: center;
}

.blocs_doityourself .row h2 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 50px;
	color: #42c4df;
	margin: 50px 0;
}

.blocs_doityourself .diy h3 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 38px;
	color: #42c4df;
	margin: 15px;
}
.blocs_doityourself .diy p {
margin-bottom: 7px;

}

.blocs_doityourself .btn-cestparti {
	width: 230px;
	border : 2px solid #00425f;
	border-radius: 6px;
	background-color: white;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	color: #00425f;
	margin: 30px auto;
	padding: 10px;
}

.blocs_doityourself .btn-cestparti:hover {
background-color: #00425f;
	color: white;
	border : 2px solid #00425f;
}

.blocs_doityourself .col-xs-6  {
margin: auto;
	padding-right: 10px;
padding-left: 10px;

}

.blocs_doityourself .col-xs-6 .col-xs-6 {
	padding-top: 80px;

}

.doityourself_separateur {
bottom: 18px;
}

.doityourself_separateur img {
	width: 100%;
}



#products{
	padding-top: 50px;
}

.pack_titre {
	color : #fcc418;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 28px;
	text-align: center;
	position: relative;
}

.pack_titre .pack_sep {
	height: 2px;
	background-color: #fcc418;
	margin: 25px 0;
}

.pack_titre img {
	position: absolute;
	bottom : -80px;
	z-index: 1;
}

.pack_contenu {
	background-color: #344a56;
	border-radius: 4px;
	text-align: center;
	padding: 80px 20px 50px 20px;
	border : 6px solid #344a56;
	height: 80%;
}

.pack_contenu .pack_car1 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 36px;
	line-height: 36px;
	color : white;
	margin: 0 !important;
}

.pack_contenu .pack_car2 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 26px;
	line-height: 26px;
	color : white;
	margin: 0 !important;
}

.pack_sep {
	height: 2px;
	background-color: white;
	margin: 20px 0;
}

.pack_contenu .pack_car3 {
	color : #fcc418;
		font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 65px;
	line-height: 90px;
}

.pack_contenu .pack_car3 sup {
	font-size: 34px;
	line-height: 48px;
}

.pack_contenu .pack_car3 sup sup {
	font-size: 19px;
	line-height: 30px;
		font-family: 'Rubik', sans-serif;
	font-weight: 400;
}

.pack_contenu .pack_car4 {
	color : #fcc418;
		font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 18px;
}

.pack_contenu .pack_car5 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 26px;
	line-height: 26px;
	color : white;
	margin-top: 30px; 
}

.pack_contenu .pack_car5 sup {
	font-size: 15px;
	line-height: 15px;
}
	
.pack_contenu .pack_car6 {
	color : white;
		font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 18px;
}

.pack_contenu .pack_car7 {
	color: #42c4df;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 18px;
}




.pack_contenu.best {
		border : 6px solid #42c4df;
	position: relative;
	z-index: 0;
}

.pack_contenu.best .recommanded {
	bottom: -18px;
}

.pack-img-center{
	position: absolute;
	right: 0; left: 50%;
	transform: translate(-50%);
	-webkit-transform: translate(-50%);
	-moz-transform: translate(-50%);
	-o-transform: translate(-50%);
	-ms-transform: translate(-50%);
}


#malin .bloc_btn-cestparti2 {
		position: relative;
	width: 585px;
	margin: auto;
}

#malin .btn-cestparti2 {
	width: 585px;
	border : 2px solid #00425f;
	border-radius: 6px;
	background-color: white;
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 22px;
	color: #00425f;
	margin: 290px auto 95px auto;
	padding: 10px;

}


#malin .btn-cestparti2:hover {
background-color: #42c4df;
	color: white;
	border : 2px solid white;
}

#malin .personnage_bouton {
	position: absolute;
	right: 50px;
    bottom: 107px;
    width: 509px;
	pointer-events: none;
}



.blocs_contact  {
	width: 100%;
	text-align: center;
	border-top : 10px solid #d0f2f2;
	background-color: #42c4df;
}


.blocs_contact .contact_intro {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 35px;
	color: white;
	margin: 70px 0 0 0;
}

.blocs_contact h2 {
	font-family: 'Rubik', sans-serif;
	font-weight: 500;
	font-size: 65px;
	color: white;
	    margin: 26px 0;

}

.blocs_contact .contact_nom {
		font-family: 'Rubik', sans-serif;
	font-weight: 500;
	color: #344a56;
	font-size: 23px;
	line-height: 23px;
	margin-bottom: 8px;
}

.blocs_contact .contact_poste {
		font-family: 'Rubik', sans-serif;
	font-weight: 400;
	color: white;
	font-size: 17px;
	line-height: 17px;
}

.blocs_contact .contact_texte {
		font-family: 'Rubik', sans-serif;
	font-weight: 400;
	color: white;
	font-size: 22px;
	line-height: 25px;
	margin : 60px 0 30px 0;
}

.blocs_contact .btn-contact {
	width: 285px;
	border : 2px solid white;
	border-radius: 6px;
	background-color: #42c4df;
	font-family: 'Rubik', sans-serif;
	font-weight: 400;
	font-size: 22px;
	color: white;
	margin: 0 auto 40px auto;
	padding: 13px;
}

.blocs_contact .btn-contact:hover {
background-color: white;
	color: #42c4df;
	border : 2px solid white;
}

.footer {
padding: 50px 0px;
margin: auto;
-webkit-box-shadow: 0px 5px 16px -5px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 5px 16px -5px rgba(0,0,0,0.25);
box-shadow: 0px 5px 16px -5px rgba(0,0,0,0.25);
}


.footer .row {
max-width: 1200px;
margin: auto;
	color: #334b57;
}

.footer1 p {
	padding-left: 75px;
	color: #334b57;
}

.footer1 p a {
	font-weight: 500;
	text-decoration: none;
		color: #334b57;
}

.footer2 {
	padding: 25px 25px 0 55px;
}

.footer2 a {
	text-decoration: none;
		color: #334b57;
	font-size: 14px;
}

.footer3 {
		padding-top : 25px; 
	font-weight: 500;
	font-size: 20px;
}

.mention .row {
	margin: 30px 0 0 0;

}

.mention .col-md-12 {
	padding:  30px 0 !important;
	font-size: 14px;
	color: #334b57;
}

.modal-content{
	background-clip: unset;
	border-radius: unset;
	border: none;
}

.close {
    color: #42c4df;
    opacity: .5;
}

.close:hover {
    color: #334b57;
    opacity: 1;
}

.modal-dialog {
	width : 70% !important;
 overflow-y: initial !important
}

.modal-body {
	background-color: #42c4df;
	color : white;
	max-height: 650px;
	overflow-y: auto;
}

.modal-body col-lg-6 {
	    padding-right: 35px;
    padding-left: 35px;
}

.modal-body img {
	max-width: 400px;
}

.modal-body h1 {
	font-size: 1.5rem;
	padding: 20px 0;
}

/* width */
 .modal-body::-webkit-scrollbar {
  width: 20px;
}

/* Track */
 .modal-body::-webkit-scrollbar-track {
   background: #77d9d8;
  
}

/* Handle */
 .modal-body::-webkit-scrollbar-thumb {
  background: #c8f0f0;
  
}

.modal-body p {
	font-size: 0.9rem;
}

.ticketModal .modal-body {
	background: #FFFFFF;
	color: black;	
}