html {
    background-attachment: fixed;
    background-image: url("background.png");
    background-position-x: 50%;
    background-position-y: 50%;
    background-repeat: no-repeat;
    background-size: cover
}

/* h1 { */
  /* color: white; */
  /* -- text-align: center; */
  /* font-family: verdana; */
  /* font-size: 20px; */
/* } */

/* p { */
  /* color: white; */
  /* font-family: verdana; */
  /* font-size: 20px; */
/* } */

--div titles
.container {
    display: block;
    width: 100%;
    position: relative;
    background-color: lightgrey;
    background-color: transparent;
    background-image: url('shadow.png');
    background-repeat: repeat-y;
    background-position: top center;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='shadow.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='shadow.png', sizingMethod='scale')";
}
.headerlogo {
    display: block;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    /* background: white; */
    min-width: 480px;
    max-width: 500px;
	text-align: center;
}

.headerbuttons {
    display: block;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    background-image: linear-gradient(to right, rgb(10, 36, 106) 0%, rgb(166, 202, 240) 100%, rgb(166, 202, 240) 101%);
    min-width: 480px;
    max-width: 500px;
	text-align: center;
	padding: 1px !important;
    box-shadow: inset -1px -1px 0px 0px #404040, inset 1px 1px 0px 0px #eceae7, inset -2px -2px 0px 0px #808080, inset 2px 2px 0px 0px #ffffff !important;
	color: white;
    font-family: verdana;
    font-size: 20px;
}

.headerbuttons a {
	color: white;
	text-decoration: none;
}

.winbar {
	margin: auto;
    margin-top: 0px;
    margin-bottom: -22px;
    background-image: linear-gradient(to right, rgb(10, 36, 106) 0%, rgb(166, 202, 240) 100%, rgb(166, 202, 240) 101%);
	text-align: center;
	padding: 1px !important;
	box-shadow: inset -1px -1px 0px 0px #404040, inset 1px 1px 0px 0px #eceae7, inset -2px -2px 0px 0px #808080, inset 2px 2px 0px 0px #ffffff !important;
	color: white;
	min-width: 480px;
    max-width: 500px;
    font-family: verdana;
    font-size: 18px;
}

/* .headerbuttons { */
    /* font-size: 11px; */
    /* background-color: linear-gradient(90deg, $active-caption, $gradient-active-caption); */
    /* padding: 3px 2px 3px 3px; */
    /* display: flex; */
    /* justify-content: space-between; */
    /* align-items: center */
/* } */

.wip, .error404, .home, .aboutme, .socials, .portfolio, .fanart, .fanartsubmissions, .braindump{
    display: block;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 10px;
    background: #d4d0c8;
    min-width: 480px;
    max-width: 502px;
	box-shadow: inset -1px -1px 0px 0px #404040, inset 1px 1px 0px 0px #eceae7, inset -2px -2px 0px 0px #808080, inset 2px 2px 0px 0px #ffffff !important;
}

.home h1, .home p, .aboutme h1, .aboutme p, .socials h1, .socials p, .portfolio h1, .portfolio p, .fanart h1, .fanart p, .fanartsubmissions h1, .fanartsubmissions p, .fanartsubmissions h3, .braindump h1, .braindump p, .wip h1, .wip p, .error404 h1, .error404 p{
    padding: 15px;
    padding-top: 5px;
}

.fanartsubmissions td, .fanartsubmissions th {
    padding: 10px;
    padding-top: 0px;
}

.home, .aboutme, .fanartsubmissions, .braindump {
	text-align: left;
	font-family: verdana;
}

.braindumpbsky {
	margin: auto;
	min-width: 420px;
    max-width: 420px;
}

.centersection, .wip, .error404, .socials, .portfolio, .fanart {
	text-align: center;
	font-family: verdana;
}

.wip a, .error404 a, .home a, .aboutme a, .socials a, .portfolio a, .fanart a, .fanartsubmissions a, .braindump a {
	color: black;
}

.footer {
    display: block;
    margin: auto;
    margin-top: 22px;
    margin-bottom: 18px;
    background: #d4d0c8;
    min-width: 480px;
    max-width: 502px;
	box-shadow: inset -1px -1px 0px 0px #404040, inset 1px 1px 0px 0px #eceae7, inset -2px -2px 0px 0px #808080, inset 2px 2px 0px 0px #ffffff !important;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
}

.code-textbox {
    width: 80%;
    padding: 15px;
    background-color: #000;
    border: 1px solid var(--color);
    color: white;
    font-family: monospace;
    font-size: 14px;
    box-sizing: border-box;
}
