  /* GLOBAL STYLES
  -------------------------------------------------- */
  /* Padding below the footer and lighter body text */

  body {
     padding-top: 3rem;
     /* padding-bottom: 3rem;  */
    color: rgb(var(--bs-tertiary-color-rgb));
  }


  /* CUSTOMIZE THE CAROUSEL
  -------------------------------------------------- */

  /* Carousel base class */
  .carousel {
    /* margin-bottom: 4rem; */
  }

  /* Since positioning the image, we need to help out the caption */
  .carousel-caption {
    bottom: 3rem;
    z-index: 10;
    ;
  }

  /* Declare heights because of positioning of img element */
  .carousel-item {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }

  #carrousel1 {
    background-image: url("wallpaper1.jpg");
    background-position: right;
    height: 32rem;
  }


  #carrousel2 {
    background-image: url("carrousel2 bad.jpg");
    background-position: center;
    height: 32rem;
  }

  #carrousel3 {
    background-image: url("wallpaper6.jpg");
    height: 32rem;  
    
  }

  #carrousel4 {
    background-image: url("surf-logo-wallpaper.jpg");
    background-position: center;
    background-size: cover;
     height:95vh;
  }

  #carrousel5 {
    background-image: url("carrousel2 bad.jpg");
    background-position: center;
    height: 100vh;
  }

  #carrousel6 {
    background-image: url("wallpaper6.jpg");
    height: 100vh;
  }

  #title-font{
  font-family: "Fugaz One", sans-serif;
  font-weight: 400;
  font-style: normal;
  }



#footer-index {
  position: absolute;
  bottom: 15px;
  width: 100vw;
  color: white;
  text-align: center;
  font-size: 18px;
  z-index: 10;
  text-decoration: none;
}

#link-a{
color:rgb(255, 255, 255);
text-decoration: none;
}

#teste{
  font-size: 1000px;
  position: absolute;
  z-index: 2;
}

  #jack-slot{
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #profile1 {
    background-image: url(light-visu003.png);
    background-position: top;
    background-size: 150%;
    filter: brightness(200%);
  }

  #profile2 {
    background-image: url(carrousel2\ bad.jpg);
    background-position: center;
    background-size: 270%;
    background-repeat: no-repeat;
    filter: brightness(200%);
  }

    #profile3 {
    background-image: url(interrogacao.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    filter: brightness(200%);
  }



.carousel-content{
  background-color: rgba(33, 37, 41, 0.75);
  height:150vh;
  background-size: cover;
  margin-top: -10vh;
  padding-top: 10vh;
}

.timer {
    display: flex;
    justify-content: center;
    gap: 1px;
    font-size: 2rem;
  }

  .time-box {
    background: rgba(255,255,255,0.1);
    padding: 20px 20px;
    border-radius: 10px;
    text-align: center;
  }

  .time-box span {
    display: block;
    font-size: 1.2rem;
    color: #aaa;
    margin-top: 5px;
  }


  #item-card-pedra {
    height: 225px;
    width: 100%;
  }

  #sell-cp {
    font-weight: bolder;
    background: #df8d2f;
  }

  #sell-rs {
    font-weight: bolder;
    background-color: rgb(0, 255, 0);
  }

  #comprar {
    background-color: rgb(0, 255, 0);
    margin-top: 5px;
    text-align: center;
    font-weight: bolder;
    border-radius: 5px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: black;
  }

  .item-price-card {
    text-align: center;
    margin: 20px 0px 15px 0px;
  }

  .item-price {
    background-color: rgb(201, 156, 7);
    text-decoration: none;
    color: black;
    padding: 3px 8px 3px 8px;
    border-radius: 3px;
    cursor: pointer;
  }

  .item-price2 {
    background-color: rgb(43, 255, 0);
    text-decoration: none;
    color: black;
    padding: 3px 7px 3px 7px;
    border-radius: 3px;
    cursor: pointer;
  }

  .estoque-quantidade {
    text-align: center;
  }

  .table-wrapper {
    /* max-width: 640px; */
    /* margin: 1rem auto; */
    padding: 0 1rem;
  }

  table {
    width: 100%;
    border-collapse: collapse;
    font-family: system-ui, Arial, sans-serif;
  }

  caption {
    text-align: left;
    margin-bottom: .5rem;
    font-weight: 600;
    
  }

  th,
  td {
    border: 1px solid #ff0000;
    /* padding: .6rem .8rem; */
    
  }

  th {
    background: #f5f5f5;
    text-align: left;
  
  }

  tbody tr td{
    border-bottom:1px solid rgb(65, 63, 63)
  }

  /* Index */

  #body-back{
    background:url(wallpaper-index.jpg),rgb(333, 333,333);
    background-size: cover;
    background-position: center;
  }

  .main-label{
    width: 100%;
    height: 100vh;
    display: flex;
  }


#surf-link {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: transparent;
}

#surf-logo {
  width: 100%;
  height: auto;
  object-fit: contain;
  cursor: pointer;
  transition: transform 0.3s ease;
  animation: pulse 1s 1s infinite;
}

#surf-logo:hover {
  transform: scale(1.05);
  animation: none;
  filter: brightness(1.3) drop-shadow(0 0 15px rgba(255, 255, 255, 0.7));
  
 
}

#reset-terms{
  color: white;
  text-decoration: solid;
}

#reset-terms2{
  color: rgb(0, 0, 0);
  text-decoration: solid;
}

@keyframes pulse {
  0%{
    scale: 1;
  }

  50%{scale: 1.05;
  }

  100%{
    scale: 1;
  }
}


  /* MARKETING CONTENT
  -------------------------------------------------- */

  /* Center align the text within the three columns below the carousel */
  .marketing .col-lg-4 {
    margin-bottom: 1.5rem;
    text-align: center;
  }

  /* rtl:begin:ignore */
  .marketing .col-lg-4 p {
    margin-right: .75rem;
    margin-left: .75rem;
  }


  /* rtl:end:ignore */


  /* Featurettes
  ------------------------- */

  .featurette-divider {
    margin: 5rem 0;
    /* Space out the Bootstrap <hr> more */
  }

  /* Thin out the marketing headings */
  /* rtl:begin:remove */
  .featurette-heading {
    letter-spacing: -.05rem;
  }

  /* rtl:end:remove */

  /* RESPONSIVE CSS
  -------------------------------------------------- */

  @media (min-width: 40em) {

    /* Bump up size of carousel content */
    .carousel-caption p {
      margin-bottom: 1.25rem;
      font-size: 1.25rem;
      line-height: 1.4;
    }

    .featurette-heading {
      font-size: 50px;
    }
  }

  @media (min-width: 62em) {
    .featurette-heading {
      margin-top: 7rem;
    }
  }