@font-face
{
   font-family: "Open Sans";
   font-weight: 400;
   font-display: swap;
   src: url('../fonts/Open-Sans.woff2') format('woff2'),
        url('../fonts/Open-Sans.woff') format('woff');
}
@font-face
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: 700;
   font-display: swap;
   src: url('../fonts/Open-Sans-Bold.woff2') format('woff2'),
        url('../fonts/Open-Sans-Bold.woff') format('woff');
}
@keyframes slide-up-in
{
   0% { transform: translate(0px,100%) rotate(1deg) ; opacity: 0; transform-origin: 0 0;  }
   100% { opacity: 1; transform: translate(0px,0px) rotate(0deg) ; transform-origin: 0 0;  }
}
h1, .h1
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: normal;
   font-size: 48px;
   text-decoration: none;
   color: #000000;
   --color: #000000;
   margin: 0 0 0 0;
   padding: 0 0 0 0;
   display: inline;
}
.darktheme h1, .darktheme .h1
{
   text-decoration: none;
   color: #FFFFFF;
   --color: #FFFFFF;
}
h2, .h2
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: 700;
   font-size: 32px;
   text-decoration: none;
   color: #777777;
   --color: #777777;
   margin: 0 0 0 0;
   padding: 0 0 0 0;
   display: inline;
}
.darktheme h2, .darktheme .h2
{
   text-decoration: none;
   color: #F5F5F5;
   --color: #F5F5F5;
}
.body
{
   text-decoration: none;
   background-color: #FFFFFF;
   --background-color: #FFFFFF;
}
.darktheme .body
{
   text-decoration: none;
   background-color: #000000;
   --background-color: #000000;
}
.text
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: normal;
   font-size: 16px;
   text-decoration: none;
   color: #777777;
   --color: #777777;
}
.darktheme .text
{
   text-decoration: none;
   color: #FFFFFF;
   --color: #FFFFFF;
}
.section
{
   text-decoration: none;
   background-color: #F5F5F5;
   --background-color: #F5F5F5;
}
.darktheme .section
{
   text-decoration: none;
   background-color: #777777;
   --background-color: #777777;
}
.button
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: normal;
   font-size: 16px;
   text-decoration: none;
   color: #FFFFFF;
   --color: #FFFFFF;
   background-color: #007BFF;
   --background-color: #007BFF;
   border: 0 solid #007BFF;
   --border-color: #007BFF;
   border-radius: 6px;
}
.button:hover, .button.active
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: normal;
   font-size: 16px;
   text-decoration: none;
   color: #FFFFFF;
   --color: #FFFFFF;
   background-color: #0B5ED7;
   --background-color: #0B5ED7;
   border-radius: 6px;
}
.input
{
   font-family: "Open Sans";
   font-weight: 400;
   font-weight: normal;
   font-size: 16px;
   text-decoration: none;
   color: #999999;
   --color: #999999;
   background-color: #FFFFFF;
   --background-color: #FFFFFF;
   border: 1px solid #CCCCCC;
   --border-color: #CCCCCC;
   border-radius: 6px;
}
.darktheme .input
{
   text-decoration: none;
   color: #FFFFFF;
   --color: #FFFFFF;
   background-color: #4F4F4F;
   --background-color: #4F4F4F;
   border: 1px solid #FFFFFF;
   --border-color: #FFFFFF;
}