/* ================================================================================ */
/* ROOT CSS */
/* ================================================================================ */
:root {
	--header-image: url('https://bangohouse.com/img/BangoHouse-Large-Logo_c.png');
	--body-bg-image: url('');
	--content: #43256E;}
/* ================================================================================ */
/* BODY CSS */
/* ================================================================================ */
* { box-sizing: border-box;}
*/ #leftSidebar {	order: 2;}
.left{ float: left; }
.right { float: right; }
.center {
  display: block;
  margin-right: auto;
  margin-left: auto;
  text-align: center; }
#flex {
	box-shadow: 0px -98px 34px -64px #FFF0A8 inset;
	height: 100%;
	background-color: #ffffe6;
	border: 0px solid #fff;
	border-left: 1px outset #FFF0A8;
	max-width: 1200px;
	border-right: 1px inset #FFF0A8;
	display: flex;
  image-rendering: smooth;
	margin-left: 6%;
	margin-right: 6%;
	margin: 0 auto;
	background-image: url('https://bangohouse.com/img/BorderSet11.png');
	background-repeat: repeat-x;
  padding: 16px;}
div.pixelBG {
	background-image: url('https://bangohouse.com/img/BorderSet11.png');
	background-repeat: repeat-x;
	background-size: 356px;
	image-rendering: pixelated;}
body {
  background-image: url('');
	background-position: top;
  font-size: 18px;
	overflow-x: hidden;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	background-color: #FFF0A8; }
main {
	width: 76%;
	margin-right: 20px;
	margin-left: 20px;
	flex: 1;
	padding: 0px;
	order: 1; }
aside {
	width: 24%;
	min-width: 200px;
	padding-left: 0px;
	font-size: smaller;
	margin-bottom: 24px; }
@media only screen and (max-width: 800px) {
  #flex {flex-wrap: wrap;}
  aside {width: 100%; }
  main {order: 1;}
  #leftSidebar {order: 2;}
  #navbar ul {flex-wrap: wrap;}}
#homeBanner {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center bottom;
	display: block;
  margin-right: auto;
  margin-left: auto;
	padding: 4px;
	padding-top: 8px;
  padding-bottom: 8px;
	max-width: 88%;
  min-width: 88%;
  min-height: 98px; }
div.homeHeader {
	box-shadow: -2px 2px 3px 0px rgba(0,0,0,0.2);
	margin-top: 16px;
	image-rendering: smooth;
	background-image: url('https://bangohouse.com/BBSD/demob.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
  position: relative;
	height: 124px;
  max-width: 500px;
	margin-right: auto;
  margin-left: auto;
  transition: .1s; }
div.homeHeader:hover {
	transition-delay: .2s;
	transition: .4s ease;
	transform: scale(1.04); }
/* ================================================================================ */
/* TEXT STYLES */
/* ================================================================================ */
strong {
	text-shadow: 0px 0px 3px #fff;
	color: #995c00; }
a:hover { }
p { line-height: 1.6em; }
/* HEADER STYLES */
h1.bango {
	letter-spacing: 43px; 
	word-spacing: 22px;
	text-shadow: 0px 0px 3px #995c00;
	color: #ffffe6;
	font-family: Impact;
	font-size: 38px;
	text-align: center;
  line-height: 94px;
  margin-top: -11px;}
h2 {
	font-size: 18px;
	color: #ffffe6;
	text-shadow: 0px 0px 3px #995c00;
  text-align: left; }
h2.postHeader {
	font-variant: small-caps;
	font-family: Lucida Console;
	color: #494135;
  border-bottom: 1px dashed #bd9652;
	margin-right: 18px; }
h2.timestamp {
	font-family: Lucida Console;
	margin-top: -10px;
  font-size: 12px;
	text-shadow: 0px 0px 4px #494135; }
h1.postTitleH1 {
	text-shadow: 0px 0px 3px #995c00;
  text-align: left;
	font-variant: small-caps;
	font-family: Lucida Console;
	color: #494135;
  border-bottom: 0px dashed #494135;
	margin-right: 18px; }
h4.postDate {
  text-align: left;
	font-size: 18px;
	color: #ffffe6;
	text-shadow: 0px 0px 3px #995c00;
  text-align: left; }
/* DIVIDER STYLES */
hr.home { margin-left: 200px; }
hr.light { border-bottom: 1px dashed #bd9652; }
hr {
	border-top: hidden;
	border-left: hidden;
	border-right: hidden #f7ac62;
  border-bottom: 2px dashed #494135; }
/* LIST STYLES */
ul { list-style-type: circle; }
/* ================================================================================ */
/* HEADER */
/* ================================================================================ */
#headerBanner {
	background-color: #ffffe6;
	box-shadow: 0px 24px 24px 1px #ffffe6 inset;
	width: 100%;
	height: 200px;
	background-image: url('https://caviexe.neocities.org/bangohouse/BangoHouse-Large-Logo_c.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;}
#topBar {
  width: 100%;
  height: 30px;
  padding: 10px;
  font-size: smaller;
  color: #995c00;
  float: left;}
/* NAVBAR */
#header, #indexheader {
	width: 100%;
	min-height: 32px;
	max-height: 32px;
	background-color: #fae165;
	background-image: url('https://bangohouse.com/img/BorderSet10.png');
	background-position: bottom;
	background-size: 32px;
  image-rendering: pixelated; }
#header ul {
	display: flex;
	padding: 0;
	margin: 0;
	list-style-type: none;
	justify-content: space-evenly;}
#header li { padding-top: 6px;}
#header li a {
	cursor: pointer;
	color: #995c00;
	font-weight: 600;
	text-decoration: none; }
#header li a:hover {
	color: #fff;
	text-decoration: none; }
#header li a.active { color: #fff; }
.dropdown-content {
  display: none;
	margin-top: 0px;
  position: absolute; 
  background-color: #fae165;
	border-bottom: 3px solid #E88A36;
  font-size: 12px;
	text-decoration: small-caps;
  min-width: 120px;
  box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
	z-index: 1; }
.dropdown-content a {
	background-image: url('https://bangohouse.com/img/slice.png');
  background-size: cover;
	padding: 12px 16px;
  display: block;
  text-align: left; }
.dropdown-content a:hover { 
	background-image: url('https://bangohouse.com/img/slice2.png');
  background-size: cover;
	background-color: #f5c160; }
.dropdown:hover 
.dropdown-content { 
	  display: block; }
/* ================================================================================ */
/* MAIN PAGE */
/* ================================================================================ */
#container {
	image-rendering: smooth;
	width: 100%;
	margin: 0 auto; }
#container a {
	text-decoration: none;
	font-variant: small-caps;
	color: #cc0000;
	font-weight: bold; }
#container a:hover {
	color: #; }
/* ICONS */
#bango {
  min-height: 68px; 
	max-height: 68px;
	padding: 4px;
	margin-right: 16px; }
/* UPDATES BLOG */
div.home {
	image-rendering: smooth; }
p.home {
	word-spacing: 8px;
	line-height: 1.4;
  text-align: justify;
  font-family: Verdana; }
.imgupdate {
	word-wrap: ; 
	position: relative;
	margin-left: 0px;
	min-width: 124px;
	min-height: 100px;
	max-width: 80%;
	height: auto;
	filter: opacity(50%);
	border: 3px outset #fff; }
.imgupdate:hover {
		filter: opacity(100%);
		border: 3px inset red; }
div.bannerdiv {
	margin-top: 8px;
	transition: .5s;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
  min-height: 64px;
	max-height: 64px;
	width: 100%;
	max-width: 800px;
	background-color: #fff;
  filter: opacity(40%); }
div.bannerdiv:hover {
	filter: opacity(100%);
}
div.bannerdivTitle {
	font-family: Lucida Console;
	margin-top: 10px;
  font-size: 14px;
	text-align: left;
	text-shadow: 0px 0px 4px #494135;
	color: #494135; 
}
#content { 
	min-width: 100%;
	padding: 0px 5% 20px 5%;
  margin-bottom: 48px;}
/* MAINPAGE BANNER */
#mainPromo {
	image-rendering: smooth;
	background-image: url('https://bangohouse.com/BBSD/BBSD-Teaser-imageNOLOGO2.png');
	background-color: #fae165;
  height: 269px;
	width: 70%;
  border: 0px dashed #fff;
  box-shadow: -2px 2px 1px 0px rgba(0,0,0,0.2);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	filter: ;
	margin-bottom: 24px;
	box-shadow: 0px -16px 20px 30px #ffffe6 inset;
  transition: .5s;}
#mainPromo:hover { 
	  transition: .5s;
	box-shadow: 2px 2px 20px 10px #ffffe6 inset; }
a.mainPromo {	}
/* ================================================================================ */
/* ZONELETS */
/* ================================================================================ */
/*POST LIST STYLE*/
#postlistdiv ul {
  font-size: 12px;
  padding: 4px;
	padding-top: 24px;
	padding-bottom: 8px;
  list-style-type: circle; 
  text-align: justify; }
#postlistdiv li {
	padding-bottom: 8px; }
#recentpostlistdiv ul {
  font-size: 12px;
  padding: 4px;
	padding-top: 24px;
	padding-bottom: 8px;
  list-style-type: none; }
#recentpostlistdiv li {
	padding-bottom: 4px; }
.moreposts {
  font-size: 0.8em;
  margin-top: 0.2em; }
/*NEXT AND PREVIOUS LINKS STYLE*/
#nextprev {
  text-align: center;
  margin-top: 1.4em; }
/*DISQUS STYLE*/
#disqus_thread {
  margin-top: 1.6em; }
/* ================================================================================ */
/* SIDEBOX */
/* ================================================================================ */
.box {
	image-rendering: smooth;
	box-shadow: 0px 30px 12px -10px #ffffe6 inset;
	background-color: #f5c160;
	border: 0px solid #fff;
	margin-top: 18px;
	min-height: 332px; }
.box2 {
	image-rendering: smooth;
	margin-top: -16px;
	margin-bottom: 34px; }
/* SIDEBOX */
#banners {  }
#banners a {
	transition: .5s;
	font-size: 24px;
	text-decoration: none;
	position: relative;
  top: 0px;
	color: #ffffe6;
  text-shadow: 2px 2px 10px #000; }
#banners a:hover { 
	transition: .5s;
	color: #ffffe6;
  text-shadow: 2px 2px 10px #f5c160; }
#banners div {
	transition: .5s;
	filter: grayscale(100%);
	margin-bottom: 0px; }
#banners div:hover { 
  transition: .5s;
	filter: grayscale(0%); }
/* SIDEBAR BANNER IMAGES */
#tailblazer {
	background-image: url('https://bangohouse.com/img/tailblazer_sidebox.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center; }
#cavitees {
	background-image: url('https://bangohouse.com/img/caviBanner2.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center; }
#hollewdz {
	background-image: url('https://bangohouse.com/img/hollewdzBanner.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center; }
div.boxDivider { 
	position: relative;
	color: #fff;
	min-height: 64px; }
/* ================================================================================ */
/* FOOTER */
/* ================================================================================ */
.footer {
  background-image: url('https://bangohouse.com/img/BorderSet2.png');
  image-rendering: pixelated;
	background-size: 46px;
	background-color: #f5c160;
	width: 100%;
	height: 46px;
	padding: 12px;
	text-align: center;
  text-shadow: 1px 1px 3px #fff;
	color: #995c00;
  font-size: 12px; }
.bttmSticky {
	position: fixed;
  bottom: 0px; }
#lastupdate {
	font-size: 10px;}
#lastupdate::before {
	content: "Last Updated:";}
#hitcount {
	font-size: 10px;}
#hitcount::before {	
	content: "Visitor #";
	margin-left: 24px; }
/* ================================================================================ */
/* SCROLLBAR */
/* ================================================================================ */
* { scrollbar-width: auto;
    scrollbar-color: #f5c160 #fafaba;}
  *::-webkit-scrollbar { width: 15px; }
  *::-webkit-scrollbar-track { background: #fff; }
  *::-webkit-scrollbar-thumb {
    background-color: #f5c160;
    border-radius: 			 24px;
    border:  5px none #f5c160; }
/* ================================================================================ */
/* IMAGE TRANSFORMS */
/* ================================================================================ */
.zoom {
	cursor: zoom-in;
	transition: .2s ease;
	transition-delay: .6s;
	image-rendering: smooth; }
.zoom:hover {
	transition-delay: .2s;
	transition: .4s ease;
	transform: scale(1.25);
	box-shadow: 2px 2px 20px 20px #fafaba; }
.half {
	width: 100%;
	min-height: 98px;
	max-height: 124px; }
img {
  max-width: 100%;
  height: auto;
  margin-top: 0.5em;
  margin-bottom: 0.5em; }
.caption {
  margin-top: 0;
  font-size: 0.9em;
  font-style: italic; }
.thumbnail {
	background-color: #fae165;
	min-height: 200px;
	max-height: 300px;
	width: 100%;
  border: 0px dashed #fff;
  box-shadow: -2px 2px 1px 0px rgba(0,0,0,0.2); }
a.thumbnail { }
a.thumbnail:hover {
  box-shadow: -12px 12px 10px 0px #fff inset; }
.auto {
	height: px;
	width: px;
	image-rendering: auto; }
.crisp-edges {
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges; }
.pixelated {
	image-rendering: pixelated; }
.smooth {
	image-rendering: smooth; }
.high-quality {
	image-rendering: high-quality; }
/* ================================================================================ */
/* INDEX PAGE */
/* ================================================================================ */
.entertext {
max-width: 256px;
}
.enterpage {
	letter-spacing: 1px;
	word-spacing:   4px; 
	line-height:      3;
	font-size:     12px; 
	color:         #000;
	filter: drop-shadow(1px 1px 4px #fff); }
div.enterbutton { 
  max-width:80%;					
	margin-top: 16px; }
.pill-form input[type=submit], 
.pill-form button[type=submit] {
	transition: 0.4s ease;
  width: 120px;
	margin-top: 8px; 
	cursor: pointer;
  display: block;
  color: white;
  text-align: center;
  padding: 16px;
  font-size: 17px;
  background-color: #fcbb62;
  border-radius: 4px;
  border-bottom: 2px solid black;
  border-right: 2px solid black; }
.pill-form input[type=submit]:hover, 
.pill-form input[type=submit]:active, 
.pill-form button[type=submit]:hover, 
.pill-form button[type=submit]:active, 
.pill-form .pill-form-page-button:hover, 
.pill-form .pill-forms-page-button:active 
{ background-color: #f6652f !important; }
/* ================================================================================ */
/* ABOUT PAGE */
/* ================================================================================ */
.aboutP {
	text-align-last: start;
	margin-left:        4%;
	letter-spacing:    2px;
	word-spacing:      2px; 
	line-height:         2;
	font-size:        12px; 
	color:            #000;
	padding:           4px;
	padding-left:      0px;
	padding-top:      16px; }
.aboutH {
	padding-top: 46px;
	margin-top: 64px;
	margin-left: 98px; }
.bango-walk {
	background-repeat: no-repeat;
	width: 68px;
	background-size: 68px;
	background-image: url('https://bangohouse.com/img/KIT-WALK-R.gif');
	min-height: 68px; 
	max-height: 68px;
	padding: 4px;
	margin-right: 16px; }
.bango-sit {
	background-repeat: no-repeat;
	width: 68px;
	background-size: 68px;
	background-image: url('https://bangohouse.com/img/KIT-IDLE.gif');
	min-height: 68px; 
	max-height: 68px;
	padding: 4px;
	margin-right: 16px; }
.bango-jump {
	background-repeat: no-repeat;
	width: 68px;
	background-size: 68px;
	background-image: url('https://bangohouse.com/img/KIT-JUMP.gif');
	min-height: 68px; 
	max-height: 68px;
	padding: 4px;
	margin-right: 16px; }
/* ================================================================================ */
/* PROJECTS PAGE - CURRENT */
/* ================================================================================ */
h2.projectH {	margin-left: 16px; }
.projectP {
	max-width: 460px;
	padding-right: 8px;
	padding-left: 8px;
}
.projectSig {
	margin-left: 8px;
	padding-right: 8px;
	padding-left: 8px;
	text-align: right; 
	letter-spacing: 1px;
	font-size:     12px; 
	color:         #000;
	text-align: right;  }
	

