body {
  background-image: url(../img/shenron2.jpg);
  background-size:100% 100% ;
  background-repeat: no-repeat;
  background-position: center;
  background-position: top;
  height:100%;
  width: 100%;

  }

article {
  color: rgb(255, 189, 76);
  font-family: 'Titre', sans-serif;
  font-size: 40px;
  text-transform: uppercase; /* Met en majuscules */
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* Ombre noire */
 
  -webkit-text-stroke: 2px black; /* Bordure de 2 pixels de large en noir */

  
}
.row1:nth-child(odd) {
  flex-direction: row-reverse;
}
.row1 {
   height: 100%;
  display: flex;
  flex-wrap: wrap; /* Pour que les éléments restent sur la même ligne */

  --angle: 0deg;
  border-width: 1rem;
  border-style: dotted;
  border-image-source: linear-gradient(var(--angle),rgb(255,117,38),#2172ba,#022d53 10em );
  border-image-slice: 10;

  animation: 5s rotate linear infinite;
  -webkit-animation: 10s rotate linear infinite;
}

@keyframes rotate {
  to {
    --angle: 360deg;
  }
}
@property --angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

 


.carousel-item {
 
  background-size: cover;
  background-position: center;
  text-align: center;
  
}

.carousel-inner {
  height:25em;
}

.carousel-control-prev,
.carousel-control-next {
  
  background-color: rgba(0, 0, 0, 0);
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
  background-color: rgba(0, 0, 0, 0);
  cursor: pointer;
}

.carousel-item img {
  
  height: 18em;
  margin: 10px; /* Ajouter un espacement de 10px autour de chaque image */
}



  .carousel-control-prev img,
  .carousel-control-next img {
    animation: moveUpAndDown 1s infinite;
  }

  @keyframes moveUpAndDown {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-5px);
    }
    100% {
      transform: translateY(0);
    }
  }

.carousel-indicators>li{
  background-image : url(../img/boule1.png);
  background-size: cover;
  width : 50px;
  height : 50px;
  background-color: rgba(0, 0, 255, 0);
}

.carousel-indicators>li:nth-child(2){
  background-image : url(../img/boule2.png);
  background-size: cover;
  width : 50px;
  height : 50px;
}

.carousel-indicators>li:nth-child(3){
  background-image : url(../img/boule3.png);
  background-size: cover;
  width : 50px;
  height : 50px;
}

#nav {
  -webkit-box-shadow: 0px 10px 22px 12px #000000; 
box-shadow: 0px 10px 22px 12px #000000;
}

#compte:hover {

  transform: scale(1.2);
  transition: transform 0.2s ease;
  
}

#compte:active {
  transform:scale(1);
  transition: transform 0.2s ease;
}



.fa-li {
  color:#ff7b00;
}
/* Appliquer les styles aux éléments img à l'intérieur de .pre_order qui sont pairs */

  .bloc {
    background-image: url(../img/dbzphone1.jpg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: bottom;
   
  }