/* car loader */
    .loader {
      height: 200px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    
    .loader__text {
      letter-spacing: 1px;
      animation: fade 1s ease-in-out infinite alternate;
    }
    
    .car__body {
      -webkit-animation: shake 0.2s ease-in-out infinite alternate;
              animation: shake 0.2s ease-in-out infinite alternate;
    }
    .car__line {
        stroke: #ffd100;
      transform-origin: center right;
      stroke-dasharray: 22;
      -webkit-animation: line 0.8s ease-in-out infinite;
              animation: line 0.8s ease-in-out infinite;
      -webkit-animation-fill-mode: both;
              animation-fill-mode: both;
    }
    .car__line--top {
      -webkit-animation-delay: 0s;
              animation-delay: 0s;
    }
    .car__line--middle {
      -webkit-animation-delay: 0.2s;
              animation-delay: 0.2s;
    }
    .car__line--bottom {
      -webkit-animation-delay: 0.4s;
              animation-delay: 0.4s;
    }
    
    .car__body,
    .car__wheel--left,
    .car__wheel--right {
      stroke: #000000; /* color del auto */
    }
    
    @-webkit-keyframes fade {
      from { opacity: 0.5; }
      to { opacity: 1; }
    }
    
    @keyframes fade {
      from { opacity: 0.5; }
      to { opacity: 1; }
    }
    
    @-webkit-keyframes shake {
      0% {
        transform: translateY(-1%);
      }
      100% {
        transform: translateY(3%);
      }
    }
    
    @keyframes shake {
      0% {
        transform: translateY(-1%);
      }
      100% {
        transform: translateY(3%);
      }
    }
    @-webkit-keyframes line {
      0% {
        stroke-dashoffset: 22;
      }
      25% {
        stroke-dashoffset: 22;
      }
      50% {
        stroke-dashoffset: 0;
      }
      51% {
        stroke-dashoffset: 0;
      }
      80% {
        stroke-dashoffset: -22;
      }
      100% {
        stroke-dashoffset: -22;
      }
    }
    @keyframes line {
      0% {
        stroke-dashoffset: 22;
      }
      25% {
        stroke-dashoffset: 22;
      }
      50% {
        stroke-dashoffset: 0;
      }
      51% {
        stroke-dashoffset: 0;
      }
      80% {
        stroke-dashoffset: -22;
      }
      100% {
        stroke-dashoffset: -22;
      }
    }