.bgw { background: white; }
.bg1 { background: #2a60b2; }
.bg2 { background: #6ea8ff; }
.bg3 { background: #5599ff; }
.bg4 { background: #b27f18; }
.bg5 { background: #ffc655; }

.bo1 { border: 1px solid #2a60b2; }
.bo2 { border: 1px solid #6ea8ff; }
.bo3 { border: 1px solid #5599ff; }
.bo4 { border: 1px solid #b27f18; }
.bo5 { border: 1px solid #ffc655; }

.fgw { color: white; }
.fg1 { color: #2a60b2; }
.fg2 { color: #6ea8ff; }
.fg3 { color: #5599ff; }
.fg4 { color: #b27f18; }
.fg5 { color: #ffc655; }
.fgi { color: inherit; }

.pad2 { padding: 5px 15px; }

.bold { font-weight: bold; }
.point { cursor: pointer; }

.w200 { width: 150px; }
.w100p { width: 100%; }

dl.titles {}
dt.titles {}
dd.titles { padding: 0; text-indent: 0; margin: 0; }


#supermenuside div:hover { background: #5599ff; }
#newmenu div:hover { background: #ffc655; color: #b27f18; }

div.submenu { background: #5599ff; text-align: left; font-size: 12px; padding: 3px 3px 3px 15px; }
a.submenu { color: #ffc655; }

#kona_links div { font-size: 1.2em; padding: 10px 10px 10px 70px; }

/* mobile */

@media all and (max-width: 768px) {
	#newmenu { display: flex !important; }
	#newmenumobile { display: none !important; }
	#mobileacdbhead { display: block !important; }

}
@media all and (min-width: 768px) {
	#newmenu { display: none !important; }
	#newmenumobile { display: flex !important; }
	#mobileacdbhead { display: none !important; }

}

/* quotes */

	div.flexcontainer{ display: flex; flex-direction: row; flex-wrap: wrap; }

	div.quotebg {  min-height: 300px; width: 400px; margin: 10px 10px; }
	div.quotecontainer { font-size: 2em; padding: 30px 30px;  }
	a.quoteline { font-weight: bold; text-shadow: -1px 0 black, 0 1px #222, 1px 0 #222, 0 -1px #222; color: #fff; }
	a.quoteline:hover { background: none; }


	div.quotet { width: 850px; border: 2px solid black; padding: 0 0; margin: 20px 20px; border-spacing: 0 0; }
	table.quotet { width: 850px; height: 400px; border: 2px solid silver; padding: 0 0; margin: 0 0; border-spacing: 0 0; }

	td.quotebg2 {  height: 392px; width: 295px; margin: 0px 0px; }
	td.quotebg3 { background: #333; vertical-align: top; }

	p.quoteline2 { font-size: 2em; padding: 10px 30px 30px 30px;
	font-weight: bold; text-shadow: -1px 0 black, 0 1px #222, 1px 0 #222, 0 -1px #222; color: #fff;
	cursor: pointer;


	}

	p.quotename { font-size: 1.2em; padding: 30px 30px 0 30px; color: #59f; }
	p.quoteacdb { font-size: 0.8em; color: silver; font-style: italic; }


	div.quotet_small { width: 400px; border: 2px solid black; padding: 0 0; margin: 10px 10px; border-spacing: 0 0; }
	table.quotet_small { width: 400px; height: 100px; border: 2px solid silver; padding: 0 0; margin: 0 0; border-spacing: 0 0; }

	td.quotebg2_small {  height: 100px; width: 100px; margin: 0px 0px; }
	td.quotebg3_small { background: #333;  border: 2px solid silver; border-width: 0 0 0 2px; vertical-align: top; }

	p.quoteline2_small { font-size: 1em; padding: 10px 30px 30px 30px; 
	font-weight: bold; text-shadow: -1px 0 black, 0 1px #222, 1px 0 #222, 0 -1px #222; color: #fff; 
	cursor: pointer;
	}


	p.quotename_small { font-size: 1.2em; padding: 30px 30px 0 30px; color: #59f; }
	p.quoteacdb_small { font-size: 0.8em; color: silver; font-style: italic; }



/* character birthdays */

	#calendar th { width: 120px; background: #b27f18; color: #ffc655; }
	#calendar td { padding: 5px 5px; text-align: left; vertical-align: top; height: 150px;  background: #2a60b2; color: #ffc655; }
	#calendar p { padding-top: 0; margin-top: 0px; font-size: 1.2em; margin-bottom: 5px; }

	#calendar a { color: white; text-decoration: none; }

	#calendar a:hover { color: #6ea8ff; text-decoration: underline; }

	td.today { background: #5599ff; }
	
/* va */
	
	div.va { margin-top: 5px; }
	#va a { text-decoration: none; font-weight: bold; text-size: 1.2em; }


	#characterzone * { border-radius: 0 0 !important; }
	#characternames h1 { text-align: left; font-size: 2em; margin: 0 0; background: var(--w); color: var(--r); }
	#characternames a { color: var(--r); }
	#characternames a:hover { color: var(--b); }
	#characternames h3 { font-size: 1em; margin: 0 0; padding-top: 0; background: var(--w); color: var(--b); border: 1px solid var(--b); border-width: 0 0 2px 0; }

	div.sidephoto  { text-align: right; }
	#sidephoto table { border: 1px solid black; width: 200px; margin-right: 0; border-spacing: 0 0; padding: 0 0; }
	#sidephoto th { text-align: right; margin: 0 0; padding: 0 5px; border-spacing: 0 0; background: var(--b); color: var(--w); }
	#sidephoto td { text-align: left; margin: 0 0; border-spacing: 0 0;  border: 1px solid var(--b); border-width: 0 0 0 1px; padding: 10px 5px;}