/*@font-face{font-family:'Urbanist';font-style:normal;font-weight:400;src:local(''),url(/fonts/urbanist-v1-latin-regular.woff2) format('woff2'),url(/fonts/urbanist-v1-latin-regular.woff) format('woff'),url(/fonts/urbanist-v1-latin-regular.ttf) format('truetype')}*/
/*@font-face{font-family:'Inconsolata';font-style:normal;font-weight:400;src:local(''),url(/fonts/Inconsolata/Inconsolata-Regular.ttf) format('truetype')}*/
@font-face{font-family:'Source Sans Pro';font-style:normal;font-weight:400;src:local(''),url(/fonts/Source_Sans_Pro/SourceSansPro-Regular.ttf) format('truetype')}

:root {
  --lightThemeText: #000;
  --lightThemeBody: #fff;
  --darkThemeText: #fff;
  --darkThemeBody: #222;
}

html {
  height:100%;
  box-sizing: border-box;
}

body {
  font-family:'Source Sans Pro', sans-serif;
  margin:0;
  padding: 0;
  height: 100%;
}
* {
    box-sizing: inherit;
}

section {
    height: 100%
}

.wrapper {
  min-height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
}
        
        
body.lightTheme {
  color:var(--lightThemeText);
  background-color: var(--lightThemeBody);
}
body.darkTheme {
  color:var(--darkThemeText);
  background-color: var(--darkThemeBody);
}
main{
  margin: 10px 10px 0px;
}
header{
  font-size: 24px;
  font-weight: bold;
  padding: 4px 0;
  color:#fff;
	background-color:#000;
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 100;
}
.hideWhenModalOpen {
 display: none;
}
header div{
  margin:0 10px;
}
header a{
  color: #fff;
  text-decoration: none;
}
header a:hover{
  color: orange;
}
footer {
  font-size: 12px;
  padding: 1px 0;
  margin-top: 20px;
  color: #fff;
  background-color:#000;
}
footer div{
  margin:0px 10px 10px 10px;
}
footer a, #newsModal a {
  color: orange;
}
#shill {
/*   display: none; */
  font-size: 12px;
}
.darkTheme #shill {
  display: inline !important;
}
#shill p {
  margin: 5px;
}

#btnDarkMode{
  cursor: pointer;
}
.lightTheme hr{
  background-color: #222;
  height: 1px;
  border: none;
}
.darkTheme hr{
  background-color: #111;
  height: 1px;
  border: none;
}
h2{
  color:white;
  padding:5px;
}
/*h3{
  padding:5px;
}*/
.lightTheme h2 {
  background-color: #222;
}
.darkTheme h2 {
  background-color: #111;
}
.lightTheme h3 {
  background-color: #ccc;
  color:#000;
}
.darkTheme h3 {
  background-color: #444;
  color:#fff;
}

.bold{font-weight: bold;}

.switch {
  display: inline-block;
  height: 18px;
  position: relative;
  width: 32px;
}

.switch input {
  display:none;
}

.slider {
  background-color: #ccc;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: .2s;
}

.slider:before {
  background-color: #fff;
  bottom: 2px;
  content: "";
  height: 14px;
  left: 2px;
  position: absolute;
  transition: .2s;
  width: 14px;
}

input:checked + .slider {
 background-color: #333;
}
input:checked + .slider:before {
 background-color: darkorange;
}

input:checked + .slider:before {
  transform: translateX(14px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
.toggleSwitch{
  text-align:center;
  margin-top: 0.35rem;
}
.lightTheme main a {
  color: steelblue;
}
.lightTheme main a:visited {
  color: purple;
}
.darkTheme main a {
  color: orange;
}
.darkTheme main a:visited {
  color: gold;
}

#darkmode img{
  border: 2px solid #999;
}
#darkmode #downloadLink{
  font-size: 24px;
}

#newsModal{
position: fixed;
z-index:1;
left:0;
top:0;
width:100%;
height:100%;
overflow:auto;
background-color:#444;
background-color:rgba(0,0,0,.8);
}
#newsModal #newsModalContent{
display: block;
margin: 5rem auto;
padding: 10px 10px 20px; 
border: 2px solid #222;
width: 70%;
max-width: 70%;
text-align: center;
}
.lightTheme #newsModal #newsModalContent{
 background-color:#fff;
 color: #000;
}
.darkTheme #newsModal #newsModalContent {
 background-color:#111;
 color: #fff;
}
.newsPostDate {
 font-size: 14px;
 text-align: left;
}
.darkTheme #newsModalContent hr {
 background-color:#ccc;
}
#newsModalContent p{
padding: 0px;
margin: 0px;
}
#newsModalContent h4{
padding: 0px;
margin: 0px;
}
.modalDisplayOff{
 display:none;
}
#newsCloseModal{
border-bottom: 2px solid #222;
border-right: 2px solid #222;
padding: 8px 8px;
vertical-align: middle;
overflow: hidden;
color: #fff;
background-color: darkred;
text-align: center;
cursor: pointer;
white-space: nowrap;
position: fixed;
font-weight: bold;
}
.skillTable, .skillTable td, .itemTable, .itemTable td{
 border: 1px solid;
 border-collapse: collapse;
 border-color: #000;
}
.skillTable td{
 width: 80px;
 padding: 3px;
}
.lightTheme .skillTable tr:hover, .lightTheme .itemTable tr:hover{
 background-color: #F0FCF3;
}
.darkTheme .skillTable tr:hover, .darkTheme .itemTable tr:hover{
 background-color: #333;
}
.darkTheme .skillTable, .darkTheme .skillTable td, .darkTheme .itemTable, .darkTheme .itemTable td {
 border-color: #ccc;
}
.darkTheme #skillsPage hr, .darkTheme #itemPage hr {
 background-color:#ccc;
}
#skillsPage .skillName {
 font-weight: bold;
}
.itemTable td{
 white-space: pre-wrap;
 padding: 3px;
}
.itemTable img{
 max-width: 80px;
}

header div > span, header div > a {
 padding: 0px 2px;
}

.dropdown {
 display: inline-block;
}
.dropdown-content {
 display: none;
 position: absolute;
 z-index: 1;
 border: 2px solid #000;
 padding: 5px;
 list-style: none;
}
.lightTheme .dropdown-content {
 background-color: #f9f9f9;
}
.darkTheme .dropdown-content {
 background-color: #353535;
}
.lightTheme .dropdown-content a {
 color: black;
}
.darkTheme .dropdown-content a {
 color: white;
}
.dropdown-content a:hover {
 color: orange;
}
.dropdown:hover .dropdown-content {
 margin-top: 0;
 margin-left: -4px;
 display: block;
}
.dropdown:hover {
 background-color: #333;
}
main#scriptPage {
 max-width: 70%; 
 margin: auto;
}
@media (max-width: 768px) {
#newsCloseModal{
padding: 4%;
}
}
h3{padding:4px 8px;border-radius:6px;border:1px solid #777;}
.scriptInfo{margin-left:16px}
.userCount{margin-left:16px;}