body {
    background-color: #101010;
  }
  
  #full-page {
      display:flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
  }
  
  #sensified-logo {
    position: absolute;
    bottom: 0;
    right: 0;
      padding: 8px;
    width: 200px;
    opacity: 0;
    animation: fade-in 3s forwards;
  }
  
  #seguro-logo {
    width: 250px;
  }
  
  #seguro-text { 
    fill: transparent;
    animation: fill-in 2s ease  2s forwards;
  }
  
  #seguro-text path {
  stroke: #0082ba;
    stroke-width: 0.5px;
    stroke-dasharray: 230;
    stroke-dashoffset: 230;
    animation: draw 4s ease 0.1s 1 forwards;
    
  }
  
  #seguro-triangle {
    fill: transparent;
    animation: fill-in 2s ease  2s forwards;
  }
  #seguro-triangle path {
    stroke: #0082ba;
    stroke-width: 1px;
    stroke-dasharray: 580; 
    stroke-dashoffset: 580;
    width: 0;
    animation: draw 2s ease 0.1s 1 forwards;
  }
   
  #seguro-circle {
    fill: #0082ba;
        transform: scale(0.1,0.1);
  transform-origin: -120% 700%; 
    animation: zoom 2s ease 0.1s 1 forwards;
  }
  
  @keyframes fill-in {
    to {
    fill: #0082ba;
    }
  }
  
  @keyframes fade-in {
    to {
      opacity: 1;
    }
  }
  
  @keyframes zoom {
    to {
      transform: scale(1,1);
    }
  }
   
  @keyframes draw {
    to {
    stroke-dashoffset: 0;
    } 
  }