/*--- Slider Circle -----------*/
:root{
    --circle-width:   200px;
  }
  .logo_circle{
    position: relative;
    width: var(--circle-width);
    height: var(--circle-width);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 90;
  }
  .logo_circle .cir-logo{
    position: absolute;
    width: 100px;
    height: auto;
    border-radius: 50%;
    align-items: center;
    text-align: center;
    z-index: 20;
  }
  .logo_circle .cir-logo a{
      font-size: 20px;
      color: red;
      text-transform: uppercase;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: 600;
      text-decoration: none !important;
  }
  .logo_circle .cir-text{
    position: absolute;
    width: 100%;
    height: 100%;
    animation: rotate_circle 10s linear infinite;
    z-index: 19;
  }
  .logo_circle .cir-text span{
    font-family: "RocknRoll One", sans-serif;
    font-weight: 400;
    color: #000;
    position: absolute;
    left: 50%;
    font-size: 1.2em;
    transform-origin: 0 calc(var(--circle-width) / 2);
  }
  
@keyframes rotate_circle{
    0%{
      transform: rotate(360deg);
    }
    100%{
      transform: rotate(0deg);
    }
}
.blurFadeInOut{
    animation: blurFadeInOut 3.2s ease-in backwards;
}