:root{
    --color1: #e5e5e5; 
    --color2: #ef233c;
    --color3: #ef233c70; 
    --color4: #dedede;
    --color5: #e5e5e580; 
    
}

html{
    overflow-x: hidden;
    scroll-behavior: smooth;    
    scroll-padding-top: 100px;
}

body{
    margin: 0;
    font-family: 'Questrial', sans-serif;    
    background: #e5e5e5;
}

.d-none{
    display: none !important;
}


.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
  }
  
  .embed-responsive::before {
    display: block;
    content: "";
  }
  
  .embed-responsive .embed-responsive-item,
  .embed-responsive iframe,
  .embed-responsive embed,
  .embed-responsive object,
  .embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
  }
  
  .embed-responsive-21by9::before {
    padding-top: 42.857143%;
  }
  
  .embed-responsive-16by9::before {
    padding-top: 56.25%;
  }
  
  .embed-responsive-4by3::before {
    padding-top: 75%;
  }
  
  .embed-responsive-1by1::before {
    padding-top: 100%;
  }

  .text-center{
    text-align: center;
  }

  .w-100{
    width: 100%;
  }

  .mt-20{
    margin-top: 20px;
  }

  .mt-40{
    margin-top: 40px;
  }

  .mt-60{
    margin-top: 60px;
  }

  .mt-80{
    margin-top: 80px;
  }

  .flex{
    display: flex;
    justify-content: center;
  }

  .flexCenter{
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .flexColumns{
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
  }

  .f-20{
    font-size: 20pt;
  }

  .f-24{
    font-size: 24pt;
  }

