/* main site settings */

body {
font-size: 1.05rem;
line-height: 1.5;
font-family: sans-serif, system-ui, monospace;
/* width: min(800px, calc(100% - 8px)); */
max-width: 45rem;
padding: 1.4rem;
  margin: 3em auto;
}

  /* center text */
footer, nav, h1 {
text-align: center;
margin: 12px;
}

header {
text-align: center;
}

 /* paraprah readability */
p {
line-height: 1.5
}

 /* code readability */
code {
font-family: 'Courier New', monospace;
font-size: larger;
}

 /* quote style */
blockquote {
margin: 8px;
border-style: solid;
border-color: #bd93f9;
border-width: 2px;
padding: 2px;
}


 /* sections style 
section {
max-height: 400px;
overflow: scroll;
background: #FFFFFF;
border-style: dashed;
border-width: 1px;
border-color: #195342;
} */

/* sections */
section {
display: none;
padding: 8px;
margin: 2px;
border-style: solid;
border-width: 2px;
overscroll-behavior-y: contain;
}

article {
display: block;
}

section:target {
 display: block;
}
 
section:#home {
 display: block;
}

 /* table style */
table {
  border-collapse: collapse;
  max-width: 100%;
  overflow: auto;
}

table, th, td {
  border: 2px solid #bd93f9;
}

th, td {
text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
background-color: #1D1B28;
}

 /* dracula style */

html,
body {
	background-image: none !important;
	background-color: #282a36 !important;
}

body * {
	color: #f8f8f2 !important;
	background-color: #282a36 !important;
}

a,
a * {
	color: rgba(80, 250, 123, 1) !important;
	background-color: transparent !important;
}

a:hover,
a:hover *,
a:visited:hover,
a:visited:hover *,
span[onclick]:hover,
div[onclick]:hover,
[role="link"]:hover,
[role="link"]:hover *,
[role="button"]:hover *,
[role="menuitem"]:hover,
[role="menuitem"]:hover *,
.link:hover,
.link:hover * {
	color: #f1fa8c !important;
}

a:visited,
a:visited * {
	color: #44475a !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
[id*="headline"],
[class*="headline"],
[id*="header"],
[class*="header"],
[class*="header"] td {
	color: rgba(255, 184, 108, 1) !important;
}

table {
	background-color: #44475a !important;
}

[id*="overlay"],
[id*="lightbox"],
blockquote {
	background-color: #282a36 !important;
}

pre,
dl {
	background-color: #44475a !important;
}

input,
select,
button,
[role="button"],
a.button,
a.submit,
a.BigButton,
a.TabLink,
.install[onclick] {
	text-indent: 5px;
	appearance: none !important;
	-moz-appearance: none !important;
	-webkit-appearance: none !important;
	background: #44475a !important;
}

textarea {
	appearance: none !important;
	-moz-appearance: none !important;
	-webkit-appearance: none !important;
	background: #44475a !important;
}

div,
ul,
li {
	background-image: none !important;
}

a.highlight,
a.highlight *,
a.active,
a.active *,
.selected,
.selected *,
[href="#"] {
	font-weight: bold !important;
	color: #8be9fd !important;
}


@media only screen and (max-width: 620px) {
  /* For mobile phones: */
  .body {
    width: 100%;
  }
}