html { height: 100%; }
body {
/* 
   background-attachment : fixed;
        background-color : #fff;
        background-image : linear-gradient(to top, #300, #600 85%, #600);
 */
                  margin : 0;
                overflow :  auto;
                 padding : 0 0  48px 0;
}
/* 
#topBarContainer { background-color: #fff; height: 94px; margin: 0; overflow: visible; padding: 0; position: relative; width: 100%; }
#topBarContainer #topBar { height: 128px; margin: 0; padding: 0; position: relative; width: 100%; }
#topBarContainer .topBarImage { cursor: pointer; filter: drop-shadow(1px 1px 2px #36f); height: 128px; left: 8px; position: absolute; top: 8px; transition: all .2s ease-in-out; width: 128px; }
#topBarContainer .topBarText { color: #060; font-size: 140%; font-weight: bold; left: 140px; overflow: hidden; position: absolute; right: 0px; text-overflow: ellipsis; top: 14px; transform: scaleY(1.5); transition: all .2s ease-in-out; white-space: nowrap; }
#topBarContainer .jcMenu { position: absolute; right: 16px; top: 24px; }
 */
#topContainer { background-color: #fff; border: none; border-radius: 4px; box-shadow: 0 0 2px #fff; margin: 18px auto 0 auto; max-width: 1300px; overflow: hidden; padding: 0; position: relative; }
#topNavbar { margin: 0 0 10px 0; }
#topNavbar a[onclick] { cursor: pointer; }
#mainContainer { margin: 10px;  }
#mainContainer div.jcDate { color: #999; font-size: bigger; font-style: italic; text-align: right; }

/* Mobile only */
@media (max-width: 600px) {
	body > * { max-width: 100% !important; }
/* 
	#topBarContainer { height: 56px; }
	#topBarContainer #topBar { height: 60px; left: 0; padding: 0; position: absolute; right: 0; top: 0; }
	#topBarContainer .topBarImage { left: 0px; top: 4px; transform: scale(0.4,0.4); transform-origin: top left; }
	#topBarContainer .topBarText { font-size: 100%; left: 60px; right: 0px; top: 8px; }
	#topBarContainer .jcMenu { right: 4px; top: 4px; }
	#topBarContainer .jcMenu .jcicon svg { height: 24px; width: 24px; }
 */
	#topContainer { width: 100%; margin: 16px 0; }
	#mainContainer > * { overflow-x: auto; }
}
@media (min-width: 600px) and (max-width: 1000px) {
	body > * { max-width: 100% !important; }
/* 
	#topBarContainer { height: 56px; }
	#topBarContainer #topBar { height: 60px; left: 0; padding: 0; position: absolute; right: 0; top: 0; }
	#topBarContainer .topBarImage { left: 2px; top: 4px; transform: scale(0.6,0.6); transform-origin: top left; }
	#topBarContainer .topBarText { font-size: 120%; left: 80px; right: 0px; top: 8px; }
	#topBarContainer .jcMenu { right: 4px; top: 4px; }
	#topBarContainer .jcMenu .jcicon svg { height: 24px; width: 24px; }
 */
	#topContainer { width: 100%; margin: 32px 0; }
	#mainContainer > * { overflow-x: auto; }
}
/* Tablets */
@media (min-width: 600px) {
}

/* Desktop */
@media (min-width: 768px) {
}