:root,
html[data-theme="dark"] {
    --solar-orange   : #fab040;
    --dark           : #252525;
    --dark-popup     : #000;
    --pagebackground : #000;
    --tablet         : #242424; 
    --tablett        : #1a1a1a;
    --tabletc        : #090909;
    --font-color     : hsl(0, 0%, 50%);
    --contrast       : brightness(100%);
    --button-color   : #000;
    --table-border   : #000;
    --solar-chartb   : #111;
}

html[data-theme="light"] {
    --solar-orange   : #fab040;
    --pagebackground : #eee;
    --tablet         : #dcdcdc; 
    --tablett        : #e9e9e9;
    --tabletc        : #e9e9e9;   
    --dark           : #252525;
    --dark-popup     : #000;
    --font-color     : hsl(0, 0%, 50%);
    --contrast       : brightness(100%);
    --button-color   : #fff;
    --table-border   : #fff;
    --solar-chartb   : #eee;
}

body {
    font-family        : "Outfit", "Segoe UI", "Ubuntu", "Roboto", "sans-serif";
    margin             : 2px auto;color: var(--body-text-dark);background: var(--pagebackground);
    text-rendering     : optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;
    backface-visibility: hidden;overflow-x: hidden;-webkit-box-sizing : border-box;-moz-box-sizing: border-box;box-sizing: border-box;
    font-size          : 1em;-webkit-filter: var(--contrast); transition: .4s;

}
html {
    min-height: 100%;
    overflow-x: hidden;
}

.chartbox{ 
    width: 100%;margin-bottom:4px;
}

.textbox{ 
    width: 100%;margin-left:2px;margin-bottom:4px;border-radius:7px;border:2px solid #e59020;border-bottom:5px solid #e59020;
}

.rowhead{ color:#FAB040;font-size:20px;}
.pv1{color:#D07000;font-size:18px;font-weight:bold;}
.pv2{color:#E59020;font-size:18px;font-weight:bold;}
.pv3{color:#FAB040;font-size:18px;font-weight:bold;}
.pv1a{color:#D07000;font-size:12px;}
.pv2a{color:#E59020;font-size:12px;}
.pv3a{color:#FAB040;font-size:12px;}


.chart { 
    height:300px;width:100%;border-radius:7px;border:2px solid #e59020;border-bottom:5px solid #e59020;
    text-rendering: optimizeLegibility !important;background-color: var(--solar-chartb);box-shadow: none;padding-top:0;overflow-y: hidden;font-family:"Outfit";
}

.canvasjs-chart-credit { 
    display:none !important;
}
table { color:#e59020;}

input.right{ 
    float:right;vertical-align:middle;transition-duration:0.5s;background-color:#FAB040;font-size:14px;font-family:"Outfit";font-weight:bold;
    border:4px solid #D07000;border-radius:10px;color:white;padding:5px 10px;text-align:center;
}

input.right:hover {
    color:#ffd080;border:4px solid #D07000;background-color:#e59020;
}


.nav-top {
    margin               : 0 auto;background: var(--tablett);padding: 5px 0 0 0;height: 30px;line-height: 2;
    position             : relative;bottom: 0;margin-top: 2px;margin-bottom: 2px;
    width                : 100%;font-family: Outfit;text-decoration: none;text-align: center;
}
.nav-bottom {
    margin               : 0 auto;background: var(--tablet);padding: 5px 0 0 0;height: 30px;line-height: 1;
    position             : relative;bottom: 0; margin-top: 4px;margin-bottom: 5px;
    width                : 100%;font-family: Outfit;text-decoration: none;text-align: center;justify-items: left;
}
.navspace {
    position: relative;display: flex;margin-top: 5px;
}

.links * {
    position: relative;margin-left: 1px;margin-top: 3px;text-decoration: none;
    font-size: 0.38em;text-align: center;justify-items: center;
}
a.alinks {
    float: right;color: var(--solar-orange);height: 20px;margin-right:5px;cursor: pointer;
}
img.ilinks {
    height: 26px;
}
.button {
  background-color: var(--button-color);border: none;padding: 1px 1px;text-decoration: none;float:right;margin-right:5px;
  border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius   : 4px;-ms-border-radius    : 4px;-o-border-radius     : 4px;
}

.button svg {
  float:right;height: 24px;width: 24px;
}

.container {
    margin: 0 auto; width: 100%;min-width: 320px; max-width: 850px;justify-content: center;justify-items: center;text-align: center;
}

hr {
    border: none;border-top: 2px double;color: var(--solar-orange);width: 100%;
}

.sitetitle {
    color: var(--solar-orange);
    font-size: 24px; margin-top: -14px;font-family: Outfit;font-weight: bold;text-decoration: none;float: none;text-align: center;justify-items: center;
}

::-webkit-scrollbar {
    width                : 6px;border-radius        : 10px;-webkit-border-radius: 10px;-moz-border-radius   : 10px;-ms-border-radius    : 10px;-o-border-radius     : 10px;
}

::-webkit-scrollbar-thumb {
    background           : var(--scrollbar-bg);border-radius        : 10px;-webkit-border-radius: 10px;-moz-border-radius   : 10px;-ms-border-radius    : 10px;-o-border-radius     : 10px;
}

@media screen and (min-width: 585px) {
   .nav-bottom {
    height               : 33px;
   }
   .links * {
     font-size       : 0.65em;margin-left     : 4px;
   }
   a.alinks {
     height: 25px;margin-right:5px;
   }
   img.ilinks {
     height: 28px;
   }
   .button svg {
     height: 26px;width: 26px;
   }
}

@media screen and (min-width: 825px) {
   .nav-bottom {
    height: 36px;
   }
   .links * {
     font-size: 0.85em;margin-left: 7px;
   }
   a.alinks {
     height: 30px;margin-right:5px;
   }
   img.ilinks {
     height: 31px;
   }
   .button svg {
     height: 29px;width: 29px;
   }
}