h1,
h2,
h3,
h4,
h5,
h6,
a,
p {
color: white;
font-weight: 500;
}




body {
background-color: #1e1d1c;
}
section {
width: 100%;
background-color: #1e1d1c;
}

.sectionTitle {
text-align: center;
}

.infoDescritpion {
margin: 5% 20%;
line-height: 1.8rem;
}

.divcontainer,
.divcontainerLeft {
width: 100%;
display: flex;
margin-top: 50px;
margin-bottom: 75px;
}


.childcontainer {
/* display:block; */
width: 100%;
}


.childcontainerIm {
display: flex; /* Définit la div comme un conteneur flexible */
justify-content: center; /* Centre l'image horizontalement */
align-items: center; /* Centre l'image verticalement */

width: 100%;
}

.childcontainerIMG {
display: flex; /* Définit la div comme un conteneur flexible */
justify-content: center; /* Centre l'image horizontalement */
align-items: center; /* Centre l'image verticalement */
padding: 10px;
width: 800px;
margin: 0 auto;
margin-top: 20px;
padding: 2px;
position: relative;
background-color: #252323;
text-align: center;
max-width: 75%;
max-height: 75%;
border-radius: 25px;
}

.childcontainerIMGleft {
display: flex; /* Définit la div comme un conteneur flexible */
justify-content: center; /* Centre l'image horizontalement */
align-items: center; /* Centre l'image verticalement */
padding: 10px;
width: 800px;
margin: 0 auto;
margin-top: 20px;
padding: 2px;
position: relative;
background-color: #252323;
text-align: center;
max-width: 75%;
max-height: 75%;
border-radius: 25px;
}

section > div > h2 {
font-weight: 600;
font-size: 36px;
line-height: 1.2em;
text-align: center;
margin-top: 100px;
}

.titlecarou {
position: absolute;
top: 200px;
left: 60px;
font-size: 80px;
color: white;
z-index: 9;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.subcarou {
position: absolute;
top: 300px;
left: 100px;
font-size: 30px;
color: white;
z-index: 9;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.weburl {
position: absolute;
top: 450px;
left: 100px;
font-size: 30px;
color: white;
z-index: 9;
background: #1e81b0;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
height: 50px;
border-radius: 5px;
padding: 5px;
height: 50px;
border-radius: 5px;
width: 250px;
text-align: center;


}



#redline {
max-width: 50px;
height: 3px;
background-color: #1e81b0;
margin-left: auto;
margin-right: auto;
margin-bottom: 25px;
}

footer {
padding-top: 90px;
padding-bottom: 90px;
background-color: #1e1d1c;
padding-left: 15%;
padding-right: 15%;
}

.footermain {
display: flex;
}

.info {
width: 33.33%;
display: flex;
justify-content: center;
}

.info > div > h2 {
font-family: "Poppins", Helvetica, Arial, Lucida, sans-serif;
font-size: 30px;
line-height: 1.4em;
text-align: center;
}

@media screen and (max-width: 768px) {
.titlecarou {
top: 180px;
left: 60px;
font-size: 30px;
}

.subcarou {
top: 225px;
left: 86px;
font-size: 15px;
}

section {
flex-direction: column;
}

.divcontainer {
flex-direction: column;
}

.divcontainerLeft {
flex-direction: column-reverse;
display: flex;
}
.childcontainer {
margin: auto;
width: 100%;
}

.childcontainerIMG {
padding-top: 0px;
width: 100%;
}
.childcontainerIMGleft {
padding-top: 0px;
padding-left: 0px;
width: 100%;
}

.infoDescritpion {
margin: 5% 10%;
}

footer {
padding-left: 5%;
padding-right: 5%;
}

.footermain {
flex-direction: column;
}
.info {
width: 100%;
}
}
















.slide-top {
-webkit-animation: slide-top 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-top 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/* ----------------------------------------------
* Generated by Animista on 2023-3-14 18:38:21
* Licensed under FreeBSD License.
* See http://animista.net/license for more info.
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

/**
* ----------------------------------------
* animation slide-top
* ----------------------------------------
*/
@-webkit-keyframes slide-top {
0% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slide-top {
0% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}



.slide-right {
-webkit-animation: slide-right 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-right 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}



/* ----------------------------------------------
* Generated by Animista on 2023-3-14 18:39:24
* Licensed under FreeBSD License.
* See http://animista.net/license for more info.
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

/**
* ----------------------------------------
* animation slide-right
* ----------------------------------------
*/
@-webkit-keyframes slide-right {
0% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slide-right {
0% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}


.slide-left {
-webkit-animation: slide-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/* ----------------------------------------------
* Generated by Animista on 2023-3-14 18:40:5
* Licensed under FreeBSD License.
* See http://animista.net/license for more info.
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

/**
* ----------------------------------------
* animation slide-left
* ----------------------------------------
*/
@-webkit-keyframes slide-left {
0% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slide-left {
0% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}