
:root{
    --fontColor:#ffffff;
    --kostadYellowColor:#FFC72C ; /*//#FFC72C;*/
    --kostadGrayColor: #BBBCBC;
    --kostadBGColor: #262626;
    --ValueColorGradBegin: var(--kostadYellowColor);
    --ValueColorGradEnd: #5a4200;
    --LimitColorGradBegin:#FF0000;
    --LimitColorGradEnd:#850000;

    --CONTAINER_WIDTH: 85vw;
  }

  

  body {
    position: relativ;
    max-height: 95vh;
    /* display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    align-content:center; */
    /* min-height:95vh;
    min-width: 400px; */
    /* outline: red solid 1px; */

    -webkit-font-smoothing: antialiased;
    background: rgb(34, 34, 34);
    
  }


* {
    /* no link */
    text-decoration: none; 
    color: var(--fontColor);
  }

  .bgPicture{
    position: absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    /* outline: orange solid 1px; */
  }


  .base {
        position: absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    
    
    /* margin-top: 40vmin; */
    display: flex;
    flex-direction: column;
    
    align-items: center;
    
    
    align-content: center;
    
    font-weight: 600;
    font-family: 'Poppins', 'Roboto', sans-serif;
    /* outline: orange solid 1px; */
  }


  .intro > * {
    animation: pulse 8s ease infinite ;
   
  }


  /* @keyframes heart {
    40% {
      transform: scale(1.0);
    }
    50% {
      transform: scale(1.1);
    }
    60% {
      transform: scale(0.95);
    }
    80% {
      transform: scale(1.0);
    }
  } */

   @keyframes pulse {
    0% {
      transform: scale(1.0);
    }
    12.5% {
      transform: scale(1.1);
    }
    25% {
      transform: scale(1.0);
    }

  } 


  .Wrapped
  {
display: flex;
flex-direction: column;
gap: 1rem;
font-size: large;
  }

  .Wrapped > * {
    font-family: Poppins;
    font-family: inherit;
    font-size: 100%;
    color: var(--fontColor);
  }
  

  .Wrapped > button{
    border-style: outset;
  
    border-color: #BBBCBC;
    background: #262626;

  }


input,
select,
textarea, 
option{
  
 background: none;
  color: var(--fontColor);
}


button, option {
  font-family: inherit;
  font-size: 100%;
  background-color: #262626;
  color: var(--fontColor);
}
/* 
option:selected {

  background-color: var(--kostadYellowColor);
  color: var(--fontColor);
} */


  .Wrapped > :invalid {
   
  
  color:#FF0000;
  
  }
/* 

  .Wrapped > select{
    border-style: outset;
   
  
  color:#262626;
  font-family: Poppins;
  } */