/* Les espaces top */

.espace-20 {
    margin-top: 20px;
}

.espace-40 {
    margin-top: 40px;
}

.espace-70 {
    margin-top: 70px;
}

.espace-80 {
    padding-top: 80px !important;
}

.espace-20-bas {
    padding-bottom: 20px;
}

.espace-70-bas {
    padding-bottom: 70px;
}

.logo-top {
    margin-top: 20px;
}

/* Les couleurs */
.color-fff {
    color: #fff;
}

.color-000 {
    color: #000;
}

a {
    display: block;
}

.image-container {
    width: 140px;
    /* Définissez la largeur souhaitée pour votre image */
    height: 140px;
    /* Définissez la hauteur souhaitée pour votre image */
    overflow: hidden;
    /* Masque tout contenu dépassant de la zone du conteneur */
    border-radius: 50%;
    /* Applique un rayon de bordure de 50%, créant ainsi une forme circulaire */
}

.image-container2 {
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 50%;
    margin-top: -164px;
    margin-left: -180px;
}

.image-container img {
    width: 100%;
    /* Assurez-vous que l'image occupe toute la largeur du conteneur */
    height: 100%;
}

.text-2xl {
    font-size: 1.8rem !important;
}

.align {
    text-align: center;
    justify-content: center;
}

@media (min-width: 1920px) {
.centre2 {
    margin-left: 15% !important;
}  
.min-h-screen {
    min-height: 10vh !important;
} 
}

.centre {
    text-align: center;
    justify-content: center;
}

body {
    background: #fff;
}

.w-full {
    width: 99%;
}

/* Bouton */

@media screen and (min-width: 800px) {
.btnsize {
    height: 2rem !important;
    width: 27% !important;
    margin-left: 36.5% !important;
}
.only-mobile {
    display: none;
}
}


@media (max-width: 640px) {
.btn {
    font-size: 20px !important;
}
.btn2 {
    padding-top: 10px !important;
}
.only-desktop {
    display: none;
}
}

body {
    overscroll-behavior: contain; /* Empêche le défilement par défaut */
    touch-action: pan-y; /* Autorise le défilement vertical */
  }

.btn2 {
    padding-top: 5px;
}

.btn {
    text-shadow:0 0 2px rgba(255, 255, 255, 0.6),0 0 30px rgba(255, 255, 255, 0.6),0px 0px 5px rgba(255, 255, 255, 0.6), 0 0 150px rgba(255, 255, 255, 0.6);color:#fff;
    text-transform: uppercase;
    font-weight: bold;
	width: 90%;
    margin-right: 20px;
    margin-left: 20px;
	height: 50px;
	cursor: pointer;
	border: none;
	color: rgba(255,255,255,0.5);
	font-size: 15px;
	border-radius: 50px;
	box-shadow: inset 0px 3px 5px rgba(255,255,255,0.5), 0px 0px 10px rgba(0,0,0,0.15);
	background: rgb(2,0,36);
    background: linear-gradient(45deg, rgba(2,0,36,0) 5%, rgba(255,255,255,.5) 6%, rgba(255,255,255,0) 9%, rgba(255,255,255,.5) 10%, rgba(255,255,255,0) 17%, rgba(255,255,255,.5) 19%, rgba(255,255,255,0) 21%);
	background-size: 150%;
	background-position: right;
	transition: 1s !important;
}

.btn:hover {
	background-position: left;
	box-shadow: inset 0px 3px 5px rgba(255,255,255,1), 0px 0px 10px rgba(0,0,0,0.25);
}

.btn:focus {
	outline: none;
}

/* Voir plus */

ul {
    position: relative;
    display: flex;
}

ul li {
    position: relative;
    list-style: none;
    margin: 0 20px;
    cursor: pointer;
}

ul li a {
    text-decoration: none;
}

ul li a .fa-brands {
    font-size: 20px;
    color: #fff;
    padding: 10px;
    border-radius: 50%;
    background: #A662F9;
}

.left-icon {
    background: #CEA6FD !important;
}

.right-icon {
    background: #7201F4 !important
}

/* separation */

.separation-bar {
    width: 100%;
    height: 5px;
    background: linear-gradient(100deg, rgba(9, 52, 173, 1) 2.25%, rgba(0, 74, 173, 1) 4.5%, rgba(203, 108, 230, 1) 50%, rgba(224, 114, 230, 1) 100%);
}

.separation-bar2 {
    width: 100%;
    height: 4px;
    background: linear-gradient(100deg, rgba(9, 52, 173, 1) 2.25%, rgba(0, 74, 173, 1) 4.5%, rgba(203, 108, 230, 1) 50%, rgba(224, 114, 230, 1) 100%);
}

.separation-bar3 {
    width: 100%;
    height: 3px;
    background: linear-gradient(100deg, rgba(9, 52, 173, 1) 2.25%, rgba(0, 74, 173, 1) 4.5%, rgba(203, 108, 230, 1) 50%, rgba(224, 114, 230, 1) 100%);
}

.separation-bar4 {
    width: 100%;
    height: 2px;
    background: linear-gradient(100deg, rgba(9, 52, 173, 1) 2.25%, rgba(0, 74, 173, 1) 4.5%, rgba(203, 108, 230, 1) 50%, rgba(224, 114, 230, 1) 100%);
}

/* photos */

.slick-slide img {
    height: 120px !important;
}

.slick-prev,
.slick-next {
    padding: 30px !important;
    margin-top: -10px !important;
}

.slick-prev:before {
    color: rgba(9, 52, 173, 1) !important;
}

.slick-next:before {
    color: rgba(203, 108, 230, 1) !important;
}

.carousel {
    width: 94%;
    padding-bottom: 30px;
    padding-top: 30px;
}

.slide img {
    width: 85%;
    height: auto;
    margin-left: 30px;
    border-radius: 20px;
}

.slide2 img {
    margin-left: 15px !important;
}

.shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06) !important;
    /*box-shadow: 0px 0px 100px -1px #fff, 0 2px 4px -1px #fff;*/
}

.md\:h-48 {
    background-color: #fff !important;
}
















  
#wrapper {
    text-align: right;
    position: absolute;
    left: 0;
    right: 0;
    margin-top: 70px;
    width: 100%;
    z-index: 99999999999 !important;
}
  
  input[type="checkbox"]{display:none;}
  
  .checkbox:checked + .label{
    background:#fff;
    color:#231733;
  }
  
  .social {
    opacity:0;
    transform: scale(0) translateY(-200px);
    transform-origin: 550% -100%;
    transition:.5s;
  }

  .checkbox:checked ~ .social {
    opacity:1;
    transform:scale(1) translateY(-139px);
  }
  
  .label {
    background: #fff;
    font-size: 45px;
    cursor:pointer;
    margin:0;
    padding:5px 10px;
    border-radius:100%;
    color:#ffffff;
    margin-right: 30px;
  }
  
  ul {
    position:relative;
    left:0;
    right:0;
    margin:-5px auto 0;
    color:#fff;
    height: 50px;
    width: 100%;
    background:#ffffff;
    padding:0;
    list-style:none;
  }
  
  ul li {
    font-size:20px;
    cursor:pointer;
    width:100px;
    margin:0;
    padding:12px 0;
    text-align:center;
    float:left;
    display:block;
    height:22px;}
  
  ul li:hover {color:rgba(0,0,0,.5);}
  
  ul:after {
    content:'';
    display:block;
    position:absolute;
    left:0;
    right: -270px;
    margin:46px auto;
    height:0;
    width:0;
    /*border-left: 20px solid transparent;*/
    /*border-right: 20px solid transparent;*/
      border-top: 20px solid #ffffff;
  }
  
  li[class*="twitter"] {background:#ffffff;padding:12px 0;}
  li[class*="gplus"] {background:#ffffff;padding:12px 0;}
  li[class*="dropbox"] {background:#ffffff;padding-left: 10px;padding-right: 30px;}
  li[class*="github"] {background:#ffffff;padding:12px 0;}
  li[class*="instagram"] {background:#ffffff;padding:12px 0;}
  li[class*="youtube"] {background:#ffffff;padding:12px 0;}
  
  .credits a {
    color: #fff;
    text-decoration: none;
  }

  .fa2 {
    width: 19%;
    margin-top: 7px;
    margin-right: 57px;
}

  .fa-share:before {
    color: #7201F4 !important;
}






.header-back {
    z-index: 1 !important;
    margin-top: 0px;
    position: absolute;
    width: 27% !important;
    margin-left: 36.5% !important;
}
@media (max-width: 640px) {
.header-back {
    z-index: 1 !important;
    margin-top: 0px;
    position: absolute;
    width: 100% !important;
    margin-left: 0% !important;
}
}

.footer-logo {
    width: 20% !important;
    margin-left: 40%;
    margin-top: 30px;
    z-index: 9999999;
    position: absolute;
}
.footer-back {
    z-index: 1 !important;
    margin-top: 0px;
    position: absolute;
    width: 27% !important;
    margin-left: 36.5% !important;
}
@media (max-width: 640px) {
.footer-back {
    z-index: 1 !important;
    margin-top: 0px;
    position: absolute;
    width: 100% !important;
    margin-left: 0% !important;
}
}

.min-h-screen {
    min-height: 10vh !important;
}

.before {
    z-index: 99999 !important;
    position: relative;
}

a {
    font-family: revert;
}

* {
    font-family: revert;
    font-style: normal;
    font-size: 14px;
    color: #715CF8 !important;
}

.light { 
    font-weight: 300;
}
.regular { 
    font-weight: 400;
}
.semibold { 
    font-weight: 600;
}

h1, h2, h3 {
    color: #715CF8 !important;
    font-family: 'Poppins', sans-serif;
}

.fa-instagram:before {
    color:#fff !important;
}
.fa-facebook:before {
    color:#fff !important;
}
.fa-linkedin:before {
    color:#fff !important;
}

.icon9 {
    width: 15% !important;
}

.icon10 {
    width: 15% !important;
}

.social1 {
    margin-top: 40px !important;
    margin-left: 10px !important;
}

.social2 {
    margin-top: 10px !important;
    margin-left: 10px !important;
}

.social3 {
    margin-top: 60px !important;
}