.index-texto{
    position: absolute;
    top: 70%;
}
.index-icono a{
    position: relative;
    height: 100%;
    justify-content: center;
}
.index-icono svg {
    width: 80px;
    height: 80px;
    background: var(--svg-linea);
    border-radius: 50px;
    box-shadow: var(--shadow-boton-bg);
}
.mainicons path{
    fill: var(--svg-relleno) !important;
}
.letra {
    font-size: .65rem;
    font-weight: normal;
    letter-spacing: 1px;
    border-radius: 0px;
    padding: 0 0.5rem;
    background: var(--fondo);
    border-top: 2px solid #e2953d;
    border-bottom: 2px solid #e2953d;
    min-width: 80px;
}
.index-icono:hover {
    background: var(--second-color) radial-gradient(circle, transparent 1%, var(--second-color) 1%) center/15000%;
    border-radius: 10px;
}

.index-icono:hover svg{
    box-shadow: none;
}

.index-icono:hover .index-texto {
    z-index: -1;
}
.index-icono:active {
    background-color: var(--theme-color);
    background-size: 100%;
    transition: background 0s;
    border-radius: 10px;
}

#header-titulo-logo .cls-1 {
    fill: #265fae !important;
}

#header-titulo-logo .cls-3 {
    fill: #c1391c !important;
}
.menu-link-header-index path{
    fill: var(--second-color) !important;
}
.nombre-pie b {
    color: var(--firma-color)!important;
    font-family: 'Railroad' !important;
    text-transform: uppercase;
}
.banner-spamachos{
    position: absolute;
    top: 0;
    background: var(--banner-fondo);
    width: 100%;
    right: 0;
    left: 0;
    padding: 0.5rem;
    text-align: center;
    color: var(--banner-color);
    letter-spacing: 2px;
}
.big-boton a {
    letter-spacing: 2px;
}
.smartlink p {
    color: var(--aviso_terminos_color)!important;
}
.offcanvas-contacto .offcanvas-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
#SlideServicios{
    height: fit-content;
}
/*EFECTOS*/
.candy-cane {
    height: 20px;
    background-image: linear-gradient(45deg, #87292d 12.50%, #f0e9d4 12.50%, #f0e9d4 25%, #495d87 25%, #495d87 37.50%, #f0e9d4 37.50%, #f0e9d4 50%, #87292d 50%, #87292d 62.50%, #f0e9d4 62.50%, #f0e9d4 75%, #495d87 75%, #495d87 87.50%, #f0e9d4 87.50%, #f0e9d4 100%);
    background-size: 56.57px 56.57px;
}

.barberContainer{
    width:84px;
    margin: -5rem auto;
    transform: scale(0.4);
  
  }
  
  .ball{
    height:22px;
      width:22px;
      margin-left:31px;
      margin-right:31px;
    border-radius:100px;
      background-color:var(--firma-color);
  }
  
  .endCap{
      width:54px;
      height:15px;
      margin-left:15px;
      margin-right:15px;
      margin-top:5px;
      margin-bottom:5px;
      background-color:var(--firma-color);
  }
  
  .cap{
      width:84px;
      height:15px;
      background-color:var(--firma-color);
  }
  
  .barberWrap{
      height:172px;
      width:54px;
      margin-top:5px;
      margin-bottom:5px;
      margin-left:15px;
    margin-right:15px;
  }
  
  .barber{
      height:172px;
      width:54px;
      position: inherit;
      background:var(--firma-color);
      background-color: -webkit-linear-gradient(-45deg, transparent 25%, var(--firma-color) 25%, var(--firma-color) 50%, transparent 50%, transparent 75%, var(--firma-color) 75%);
      background: -moz-linear-gradient(-45deg, transparent 25%, var(--firma-color) 25%, var(--firma-color) 50%, transparent 50%, transparent 75%, var(--firma-color) 75%);
      background: -o-linear-gradient(-45deg, transparent 25%, var(--firma-color) 25%, var(--firma-color) 50%, transparent 50%, transparent 75%, var(--firma-color) 75%);
      background: linear-gradient(-45deg, transparent 25%, var(--firma-color) 25%, var(--firma-color) 50%, transparent 50%, transparent 75%, var(--firma-color) 75%);
      background-size: 27px 27px;
      -webkit-animation: barberpole 1.5s infinite linear;
    animation: barberpole 1.5s infinite linear;
  }
  
  @-webkit-keyframes barberpole {
          from {background-position: 0%;}
          to {background-position: 100%;}
  }