h1, h2, h3, h4  {  font-family: 'darkmode-off', sans-serif;}
div, ul, li, ol, p, h6, h5 {  font-family: 'open-sans', sans-serif;}
body {  font-family: 'open-sans', sans-serif;  position: relative; }
.trans {  -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease;  -o-transition: all 0.3s ease; }



/*!
 |-----------------------------------------------------------------------------------------------------------
 |
 |
 |
 | Root Variables
 |
 |
 |
 |-----------------------------------------------------------------------------------------------------------
*/ :root {
  /*   |-----------------------------------------------------------   |   | Colors   |   |-----------------------------------------------------------  */
  --color-gray-1: #F4F4F4;
  --color-gray-2: #e9ecef;
  --color-gray-3: #dee2e6;
  --color-gray-4: #ced4da;
  --color-gray-5: #adb5bd;
  --color-gray-6: #6c757d;
  --color-gray-7: #495057;
  --color-gray-8: #3A3A3A;
  --color-gray-9: #212529;
  --color-gray-10: #181818;
  --color-white: #ffffff;
  --color-light: #e9ecef;
  --color-dark: #181818;
  --color-black: #000000;
  --color-primary-lightest: #efefef;
  --color-primary-lighter: #aaa;
  --color-primary-light: #666;
  --color-primary: #000;
  --color-primary-dark: #000;
  --color-primary-darker: #000;
  --color-primary-darkest: #000;
  --color-secondary-lightest: #F9F2DC;
  --color-secondary-lighter: #E2D7B5;
  --color-secondary-light: #CCBF96;
  --color-secondary: #BAAB75;
  --color-secondary-dark: #8E825B;
  --color-secondary-darker: #726849;
  --color-secondary-darkest: #4C4530;
  --color-red: #dc3545;