/*
author : el mansouri.abdelilah
version : 1
 */


:root {
    /* COLOR */
    --global--color-red: #AD1919;
    --global--color-rose: #F6E6E6;
    --global--color-bleu: #346BA8;
    
    

    /* Font Size */
    --global--font-size-base: 16px;
    --global--font-size-xs: 14px;
    --global--font-size-sm: 16px;
    --global--font-size-md: 17px;
    --global--font-size-lg: 18px;
    --global--font-size-xl: 2.25rem;
    --global--font-size-xxl: 4rem;
    --global--font-size-xxxl: 5rem;
    --global--font-size-page-title: var(--global--font-size-xxl);
    --global--letter-spacing: normal;

    --cursorX: 50vw;
  	--cursorY: 30vh;
 
}  

/********/

*{
	-webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
body{
	font-family: 'Nunito', sans-serif;
	font-size:  14px;
	line-height: 20px;
	color: #1B1F1F;
}

#wrapper{
	overflow-x: hidden;
	padding-top: 77px;
	padding-bottom: 160px;
}

.header{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 8px 0;
	background: #fff;
	z-index: 10;
}

.module-size{
	background: var(--global--color-red);
	padding: 25px 10px 10px 10px;
	text-align: center;
	color: #fff;
	-webkit-box-shadow: 5px 5px 19px 3px rgba(0,0,0,0.35); 
	box-shadow: 5px 5px 19px 3px rgba(0,0,0,0.35);
	float: left;
	position: fixed;
	right: 50px;
	top: 300px;
	z-index: 3;
	width: 155px;
	height: 155px;
	border-radius: 50%;
}
	.module-size span{
		font-size: 14px;
		line-height: 18px;
		font-weight: 700;
		display: block;
		margin-bottom: 20px;
	}
	
	.module-size a{
		text-transform: uppercase;
		text-decoration: none;
		color: #fff;
		font-weight: 800;
		position: relative;
	}
	.module-size a.active:before{
		content: '';
		position: absolute;
		left: 0;
		background: #fff;
		height: 2px;
		width: 100%;
	}
	.module-size a.size-1{
		font-size: 20px;
		line-height: 20px;
	}
	.module-size a.size-1.active:before{
		bottom: 1px;
	}
	.module-size a.size-2{
		font-size: 30px;
		line-height: 20px;
	}
	.module-size a.size-2.active:before{
		bottom: 5px;
	}
	.module-size a.size-3{
		font-size: 40px;
		line-height: 20px;
	}
	.module-size a.size-3.active:before{
		bottom: 7px;
	}
/*******************  SECTION INTRO *******************/
.logo{
	max-width: 300px;
}
.section-intro{
	position: relative;
	padding-top: 55px;
	padding-bottom: 55px;
}
.section.section-intro{
	background: url(../images/visuel-intro.jpg) no-repeat center center; 
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
.text-intro{
	margin-bottom: 20px;
}
.text-intro p{
	color: #fff;
	text-transform: uppercase;
	font-size: 40px;
	line-height: 45px;
	font-weight: 800;
}
.text-intro span{
	display: inline-block;
	font-size: 25px;
	line-height: 25px;
	font-weight: 800;
	text-transform: uppercase;
	background: #fff;
	color: var(--global--color-red);
	padding: 8px 4px 4px 4px;
	margin-bottom: 20px;
}
.player{
	width: 180px;
	height: 180px;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	background: url(../images/bg-player.jpg) no-repeat center;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
	.player a{
		display: block;
		height: 100%;
		width: 100%;
		background: url(../images/icon-player.svg) no-repeat center;
	}

#popup-video-youtube .modal-body{
	border: none;
	padding: 0;
}
#popup-video-youtube .modal-content {
    border: none;
    background: none;
}
#popup-video-youtube .modal-header{
	border-radius: 0;
	border: none;
}
#popup-video-youtube .btn-close{
	color: #fff;
}
/***********************************************************/
.section-form-dons{
	background: var(--global--color-red);
	color: #fff;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 10;
}
.section-form-dons h3{
	position: relative;
	background: var(--global--color-red);
	margin-top: -20px;
	font-size: 18px;
	text-transform: uppercase;
	float: left;
	padding: 10px;
	margin-left: -10px;
}
.section-form-dons h3 img{
	position: absolute;
	left: 10px;
	top: 30px;
}

.section-form-dons .bloc-dons{
	padding-top: 20px;
}
.style-form .radio-toolbar {
    margin: 0 0 20px 0;
    padding-left: 60px;
}
.style-form .radio-toolbar ul{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0;
    width: 100%;
}
.style-form .radio-toolbar ul li{
	text-align: center;
}
.style-form .radio-toolbar ul li p.deduction{
	margin: 0;
	font-style: italic;
	font-size: 12px;
	line-height: 16px;
}
.style-form .radio-toolbar input[type="radio"] {
    opacity: 0;
    position: fixed;
    width: 0;
    height: 0;
}

.style-form .radio-toolbar label {
    color: #fff;
    display: inline-block;
    padding: 0 0 0 48px;
    font-size: 30px;
    line-height: 30px;
    font-weight: 800;
    border-radius: 10px;
    cursor: pointer;
    margin-bottom: 15px;
    position: relative;
}
.style-form .radio-toolbar label:before{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	background: #F0EDED;
}
.style-form .radio-toolbar label:after{
	content: '';
	position: absolute;
	left: 5px;
    top: 2px;
	width: 26px;
	height: 20px;
	background: url(../images/check.svg) no-repeat center;
	display: none;
}

.style-form .radio-toolbar label.active:after{
	display: block;
}

.style-form .radio-toolbar .bloc-input{
	padding: 3px 0 3px 10px;
	background: #fff;
	border-radius: 10px;
	margin-bottom: 20px;
	max-width: 230px;
	text-align: left;
	display: flex;
    align-items: center;
}
.style-form .radio-toolbar .bloc-input .label{
	color: #000;
	white-space: nowrap;
	display: block;
	font-size: 14px;
	font-weight: 700;
}
.style-form .radio-toolbar .input-radioLibre {
    font-size: 14px;
	font-weight: 700;
    background-color: transparent;
    border: none;
    border-radius: 10px;
    color: #000;
    padding: 6px 0 6px 10px;
    display: inline-block;
    position: relative;
    width: 100%;
}
.style-form .radio-toolbar input[type="text"]:focus{
    border: none;
    outline: none !important;
}
.style-form .radio-toolbar .input-radioLibre::placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}
.style-form .radio-toolbar .input-radioLibre::-webkit-input-placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}
.style-form .radio-toolbar .input-radioLibre:-moz-placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}
.style-form .radio-toolbar .input-radioLibre:-moz-placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}
.style-form .radio-toolbar .input-radioLibre:-ms-input-placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}
.style-form .radio-toolbar .input-radioLibre::-ms-input-placeholder{
    color: #000 !important;
    opacity: 1;
    font-weight: normal;
}


.style-form .radio-toolbar .list-inline-item{
    position: relative;
}
.bloc-btn p{
	font-size: 12px;
	line-height: 16px;
}
.bloc-btn p.don-ponctuel a{
	color: #fff;
	font-weight: 800;
	text-decoration: underline;
}
.style-form .radio-toolbar .submit-form-don{
	margin-bottom: 10px;
}

.error_montant{
    color: red;
    font-size: 14px;
    line-height: 16px;
    background: #fff;
    padding: 5px 20px;
    text-align: center;
    display: none;
    margin: 0 auto 10px auto;
    max-width: 80%;
}

.error_montant{
	display: none;
}
.container.dons-mobile{
	display: none;
	text-align: center;
	padding: 5px 0;
}
/********************** SECTION POURQUOI *******************/

.bloc-titre h2{
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
}
.bloc-titre p{
	font-size: 20px;
	line-height: 30px;
	text-transform: uppercase;
}
.section-pourquoi{
	padding: 55px 0;
}
.item-pourquoi{
	text-align: center;
}
.item-pourquoi span.chiffre{
	color: var(--global--color-red);
	font-size: 55px;
	line-height: 55px;
	font-weight: 800;
	display: block;
}

.item-pourquoi span.text{
	color: var(--global--color-red);
	font-size: 16px;
	font-weight: 800;
	display: block;
	text-transform: uppercase;
	text-align: left;	
}

.item-pourquoi p{
	font-size: 14px;
	line-height: 20px;
	text-align: center;
}
.item-pourquoi.item-1 span.chiffre{
	margin-bottom: 7px;
}
.item-pourquoi.item-1 span.text{
	margin-left: 53%;
}
.item-pourquoi.item-1 .item-content{
	padding-top: 15px;
	padding-bottom: 25px;
	background: url(../images/form-pourquoi.svg) no-repeat center;
	margin-bottom: 25px;
	position: relative;
}
.item-pourquoi.item-1 .perso{
	position: absolute;
	top: 51px;
	left: 20%;
}
.item-pourquoi.item-1 .fleche,
.item-pourquoi.item-1 .fleche-2{
	position: absolute;
	top: 64px;
	left: 21%;
}
.item-pourquoi.item-1 .fleche-2{
	top: 70px;
	left: 24%;
}
/**********  item-2 ************/
.item-pourquoi.item-2 .item-content{
	padding-top: 15px;
	padding-bottom: 46px;
	background: url(../images/form-pourquoi-2.svg) no-repeat center;
	margin-bottom: 25px;
	position: relative;
}
.item-pourquoi.item-2 .perso{
	position: absolute;
    top: 15px;
    left: 20%;
}

.item-pourquoi.item-2 .fleche{
	margin-left: 34px;
	margin-top: -3px;
}
/**********  item-3 ************/
.item-pourquoi.item-3 span.text{
	margin-left: 50%;
}
.item-pourquoi.item-3 .item-content{
	padding-top: 15px;
	padding-bottom: 19px;
	background: url(../images/form-pourquoi-3.svg) no-repeat center;
	margin-bottom: 14px;
	position: relative;
}
.item-pourquoi.item-3 .perso{
	position: absolute;
	top: 53px;
	left: 32%;
}
.item-pourquoi.item-3 .fleche{
	position: absolute;
	top: 70px;
	left: 17%;
}

.item-pourquoi.item-1 .perso,
.item-pourquoi.item-2 .perso,
.item-pourquoi.item-3 .perso{
	transform: scale(.1);
}
	.item-pourquoi.item-1 .perso.loaded,
	.item-pourquoi.item-2 .perso.loaded,
	.item-pourquoi.item-3 .perso.loaded{
		transform: scale(1);
	}
.item-pourquoi.item-1 .fleche,
.item-pourquoi.item-1 .fleche-2,
.item-pourquoi.item-2 .fleche,
.item-pourquoi.item-3 .fleche{
	opacity: 0;
}
	.item-pourquoi.item-1 .fleche.loaded,
	.item-pourquoi.item-1 .fleche-2.loaded,
	.item-pourquoi.item-2 .fleche.loaded,
	.item-pourquoi.item-3 .fleche.loaded{
		animation: pulsation 2s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
	}


/*********************** SECTION section-generosite ******/

.section-generosite{
	background: var(--global--color-rose);
	padding: 30px 0;
}
.section-generosite .part-1{
	display: flex;
}
.section-generosite .part-1 img{
	margin-right: 10px;
}
.section-generosite .part-1 p{
	margin: 0;
	font-size: 20px;
	line-height: 30px;
	font-weight: 500;
	text-transform: uppercase;
	padding-right: 60px;
}
.section-generosite .part-1 p b{
	font-weight: bold;
}
.section-generosite .part-3{
	display: flex;
	position: relative;
	text-align: center;
	flex-direction: column;
    justify-content: space-between;
    min-height: 134px;
}
.section-generosite .part-3 p{
	font-size: 18px;
	line-height: 22px;
	color: var(--global--color-red);
	font-weight: 800;
	text-transform: uppercase;
}
.section-generosite .part-3 .petit-chien{
	position: absolute;
	left: 0px;
	top: 25%;
}
.section-generosite .bloc-coeur{
	width: 180px;
	height: 134px;
	position: absolute;
	top: -10px;
	left: 50%;
	margin-left: -90px;
}
.section-generosite .coeur-1{
	width: 128px;
	height: 105px;
	background: url(../images/coeur-1-part-3.svg) no-repeat center;
	position: absolute;
	top: 50%;
	margin-top: -52px;
	left: 50%;
	margin-left: -64px;
}
.section-generosite .coeur-2{
	width: 180px;
	height: 134px;
	background: url(../images/coeur-2-part-3.svg) no-repeat center;
	position: absolute;
	top: 0;
	left: 0;
}
.coeur-fleche{
	width: 28px;
	height: 48px;
	position: absolute;
	top: 50%;
	margin-top: -24px;
	left: 50%;
	margin-left: -14px;
	background: url(../images/fleche-part-3.svg) no-repeat center;
}

/****** ANIME LOADED  ********/
.section-generosite .part-1,
.section-generosite .part-2,
.section-generosite .part-3{
	opacity: 0;
}
	.section-generosite .part-1.loaded,
	.section-generosite .part-2.loaded,
	.section-generosite .part-3.loaded{
		opacity: 1;
	}

.section-generosite .part-3 p{
	transform: scale(.0);
}
	.section-generosite .part-3 p.first.loaded,
	.section-generosite .part-3 p.second.loaded{
		transform: scale(1);
	}
.section-generosite .part-3 .petit-chien{
	left: 20px;
	transform: scale(.0);
}
	.section-generosite .part-3 .petit-chien.loaded{
		transform: scale(1);
		left: 0;
	}

.section-generosite .coeur-2{
	transform: scale(.0);
}
.section-generosite .coeur-2.loaded{
	animation: battement 1.2s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}

/***************  section-texte   ***********************/

.section-texte{
	padding: 105px 0;
}
.section-texte .content-texte{
	background: #fff;
	padding: 35px;
	color: #303B3B;
}
.section-texte .content-texte h2{
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 30px;
}
.section-texte .content-texte h3{
	font-size: 20px;
	line-height: 30px;
	text-transform: uppercase;
	font-weight: 800;
}
.section-texte .content-texte p{
	font-size: 14px;
	line-height: 20px;
	margin-bottom: 30px;
}
.bloc-pattes{
	height: 100%;
	position: relative;
}
	.bloc-pattes .traces-pattes{
		position: absolute;
	}


.section-texte .section-img{
	display: none;
	margin-left: -15px;
	margin-right: -15px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
}
	.section-texte .section-img img.illustration {
		width: 100%;
	}
	/*.section-texte .traces-pattes{
		display: none !important;
	}*/
	.section-texte .section-img .traces-pattes{
		display: block !important;
		position: absolute;
		bottom: 0;
		z-index: 1;
		width: 100%;
	}
	
/***********************  section-parcours  ****************/

.section-parcours{
	background: url(../images/visuel-parcours.jpg) no-repeat center;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
.section-parcours .traces-pattes{
	bottom: -110px;
	left: 0;
	opacity: 0;
}
.section-parcours .traces-pattes.loaded{
	opacity: 1;
}

/***********************  section-accompagnement  ****************/

.section-accompagnement{
	background: url(../images/visuel-accompagnement.jpg) no-repeat top center;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}

.section-accompagnement .traces-pattes{
	bottom: -120px;
	right: 0;
}

/***********************  section-rencontre  ****************/

.section-rencontre{
	background: url(../images/visuel-rencontre.jpg) no-repeat center;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}

.section-rencontre .traces-pattes{
	left: -10%;
    top: -80%;
    opacity: 0;
}
.section-rencontre .traces-pattes.loaded{
	opacity: 1;
}

/************************  section-avantages  ***************/
.section-avantages{
	padding: 50px 0;
}
.section-avantages h2{
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
	font-weight: 700;
	text-align: center;
	margin-bottom: 50px;
}
.section-avantages h4{
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--global--color-red);
	margin-bottom: 20px;
}
.section-avantages h4.bg-titre{
	color: #fff;
	background: var(--global--color-red);
	padding: 5px 10px;
	display: inline-block;
}
.section-avantages .pour-vous{
	margin-top: 20px;
}
.section-avantages .pour-vous .contacts{
	background: var(--global--color-rose);
}
.section-avantages .pour-vous .contacts ul{
	display: flex;
}
.section-avantages .pour-vous .contacts ul li{
	padding: 10px;
}
.section-avantages .pour-vous .contacts ul li > a{
	display: block;
	text-decoration: none;
	font-size: 13px;
	color: #000;
}
.section-avantages .avantages-visu{
	margin-top: 40px;
	position: relative;
	padding-top: 60px;
	text-align: center;
}
	.section-avantages .avantages-visu .fleche-g{
		position: absolute;
		left: 0;
		top: 0;
	}
	.section-avantages .avantages-visu .fleche-d{
		position: absolute;
		right: 0;
		top: 0;
	}
.section-avantages .pour-chien-guide{
	margin-top: 20px;
}
.section-avantages .pour-nous{
	border: 2px solid var(--global--color-rose);
	padding: 25px 25px;
}

/***************  ANIME LOADED *********/

.section-avantages .pour-vous,
.section-avantages .pour-chien-guide,
.section-avantages .pour-nous{
	top: 30px;
	position: relative;
	opacity: 0;
}
	.section-avantages .pour-vous.loaded,
	.section-avantages .pour-chien-guide.loaded,
	.section-avantages .pour-nous.loaded{
		top: 0;
		opacity: 1;
	}
.section-avantages .avantages-visu .fleche-g,
.section-avantages .avantages-visu .fleche-d{
	opacity: 0;
}
	.section-avantages .avantages-visu .fleche-g.loaded,
	.section-avantages .avantages-visu .fleche-d.loaded{
		animation: pulsation 2s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
	}
/********************* section-histoires ****************/

.section-histoires{
	padding: 0 0 50px 0;
}
.section-histoires .item-histoire{
	position: relative;
	padding: 45px 0;
}
.section-histoires .item-histoire .content-texte{
	background: #fff;
	padding: 30px 35px;
	-webkit-box-shadow: 7px 7px 14px 2px rgba(0,0,0,0.23); 
	box-shadow: 7px 7px 14px 2px rgba(0,0,0,0.23);
	position: relative;
	z-index: 2;
}
.section-histoires .item-histoire h3{
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 20px;
}
.section-histoires .item-histoire p{
	font-size: 14px;
	line-height: 22px;
	padding-right: 70px;
	background: url(../images/quote.svg) no-repeat top right;
}
.section-histoires .item-histoire p.auteur{
	margin:0;
	background: none;
}
.section-histoires .item-histoire .visuel-histoire{
	height: 100%;
	width: 70%;
	position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
	.section-histoires .item-histoire .visuel-histoire img{
		display: none;
	}
.bloc-fleche-slider{
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
}
.bloc-fleche-slider ul{
	display: flex;
}
.bloc-fleche-slider ul li{
	cursor: pointer;
}
.bloc-fleche-slider ul li:first-child{
	margin-right: 20px;
}

/********************  section-ffac ********************/

.section-ffac{
	padding: 50px 0;
	background: url(../images/visuel-chien-association.jpg) no-repeat center;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
.section-ffac .visuel-ffac{
	display: none;
	margin-left: -15px;
	margin-right: -15px;
}
	.section-ffac .visuel-ffac img{
		width: 100%;
	}
.section-ffac .content-texte{
	background: #fff;
	padding: 30px;
}
.section-ffac .bloc-titre{
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}
	.section-ffac .bloc-titre ul{
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
.section-ffac h3{
	font-size: 25px;
	line-height: 35px;
	text-transform: uppercase;
}
.section-ffac p{
	font-size: 14px;
	line-height: 22px;
}

.section-ffac .chiffres p{
	font-size: 12px;
	line-height: 18px;
}
.section-ffac .bloc-btn{
	margin-bottom: 30px;
}
.section-ffac .chiffres .item-chiffre{
	text-align: center;
	padding-top: 10px;
	position: relative;
}
.section-ffac .chiffres .item-chiffre img{
	margin-bottom: 20px;
}
.section-ffac .chiffres .item-chiffre .chiffre{
	display: block;
	text-align: center;
	font-size: 30px;
	font-weight: 800;
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
}

.section-ffac .chiffres .item-chiffre-1 .chiffre,
.section-ffac .chiffres .item-chiffre-3 .chiffre{
	color: var(--global--color-red);
}
.section-ffac .chiffres .item-chiffre-2 .chiffre{
	color: var(--global--color-bleu);
}
/***********************   FOOTER   ************************/
.footer{
	background: #fff;
	padding: 20px 0;
}

.menu-footer{
	font-size: 12px;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 100%;
}
.menu-footer ul{
	margin: 0;
}
.menu-footer a{
	color: #303B3B;
	text-decoration: none;
}
.menu-footer a:hover{
	color: var(--global--color-red);
}
.no-break{
	word-break: keep-all;
}

/*******************  BTN *******************/
.btn{
	font-size: 16px;
	line-height: 18px;
	text-transform: uppercase;
	color: #fff;
	background: var(--global--color-red);
	border: 2px solid var(--global--color-red);
	text-align: center;
	position: relative;
	padding: 13px 30px;
	padding-left: 68px;
	border-radius: 25px;
	text-decoration: none;
	font-weight: 800;
}
	.btn:hover{
		background: #fff;
		color: var(--global--color-red);
	}
	.btn:before{
		content: '';
		position: absolute;
		left: 0;
		top:0;
		background: url(../images/icon-btn.svg) no-repeat center;
		width: 30px;
		height: 26px;
		left: 21px;
    	top: 8px;
	}
	.btn:hover:before{
		background: url(../images/icon-btn-hover.svg) no-repeat center;
	}

.btn.btn-white{
	color: var(--global--color-red);
	background: #fff;
}
.btn.btn-white:before,
.btn.btn-white:hover:before{
	background: url(../images/icon-btn-hover.svg) no-repeat center;
}

.clearfix{
	height: 0;
}
.rouge{
	color: var(--global--color-red);
}

.modal .modal-content{
	border: none;
}
#exit-popup .modal-header{
	height: 0;
    padding: 0;
    border: 0;
}
#exit-popup .btn-close{
	opacity: 1;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 2;
}
#exit-popup .modal-body{
	text-align: center;
	padding: 0;
	padding-bottom: 30px;
}
#exit-popup .header-popup{
	margin-bottom: 20px;
}
#exit-popup .header-popup img{
	width: 100%;
}
#exit-popup .modal-body h2{
	font-size: 25px;
	line-height: 35px;
	text-transform: uppercase;
	font-weight: 800;
	margin-bottom: 10px;
}

#exit-popup .modal-body p{
	font-size: 18px;
	line-height: 26px;
	color: #303B3B;
}
@media (min-width: 576px){
	#exit-popup .modal-dialog {
    	max-width: 690px;
    }
}

/***************************/

@keyframes pulsation {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes battement {
  0% {
    transform: scale(0.95);
  }
  5% {
    transform: scale(1.1);
  }
  39% {
    transform: scale(0.85);
  }
  45% {
    transform: scale(1);
  }
  60% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(0.9);
  }
}