/*
 * SETUP
 */
@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i');
html {
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}
/*
 * LAYOUT
 */
html, body {
	margin: 0;
	padding: 0;
}
#pagewrap {
	height: 100%;
	margin: 0;
	overflow: hidden;
	padding: 0;
}
#header {
	width: 100%;
	height: 64px;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 99;
	padding-top: 2px;
	border-bottom: 1px solid darkslategray;
}
#header #sjclogo {
	float: left;
	margin: 0 0 0 2px;
}
#header #gislogo {
	float: left;
	margin: 0 0 0 2px;
}
#header #titleblock {
	float: left;
	margin: 0 0 0 6px;
}
#sidebar {
	width: 160px;
	height: 100%;
	overflow: hidden;
	position: fixed;
	top: 64px;
	left: 0px;
	margin: 0;
	padding: 0.5em 0 0 0;
	z-index: 98;
}
#sidebar div {
	padding: 5px;
}
#content {
	margin: 64px 0 0 165px;
	padding: 0;
}
#content div {
	padding: 5px;
}

#sidebar a {
	border: 1px solid #204060;
}
#footer {
	clear: both;
	height: 40px;
	margin: 0;
	padding: 0;
}
#footer div {
	margin-left: 160px;
	padding-top: 4px;
	text-align: center;
}
.fullcard {
	background-color: #F0F4F8;
	padding: 10px;
	width: 100%;
}
.fullcard.notice {
	background-color: #F8C8C8;
	padding: 10px;
	width: 100%;
}
/*
 * RESPONSIVE NAV
 */
.nav .longlink { display: block; visibility: visible; }
.nav .shortlink { display: none; visibility: hidden; }
@media screen and (max-width: 700px) {
	#sidebar {
		width: 100%;
		height: auto;
		position: relative;
		padding-top: 0em;
	}
	#sidebar a { float: left; }
	#sidebar hr { display: none; }
	.nav .longlink { display: none; visibility: hidden; }
	.nav .shortlink { display: block; visibility: visible; }
	#content { margin-left: 0px; }
	#footer div { margin-left: 0px; }
}
@media screen and (max-width: 400px) {
	#sidebar a {
		text-align: center;
		float: none;
	}
}
/*
 * STYLE
 */
html, body {
	background-color: white;
	color: black;
	font-family: 'Roboto', sans-serif;
	font-size: 16pt;
}
#pagewrap {
}
#header {
	background-color: #4070a0;
	box-shadow: 0 2px 4px rgba(0,0,0,0.5);
	color: #ffffff;
}
#header img {
	border: 0;
}
#header #title {
	font-size: 16pt;
	font-style: bold;
}
#header #subtitle {
	font-size: 9pt;
	font-style: normal;
}
#header #gistitle {
	font-size: 9pt;
	font-style: normal;
}
#sidebar {
	background-color: #306090;
	box-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
#footer {
	background-color: #204060;
}
#footer div {
	text-align: center;
	color: #d0e0f0;
	font-size: 8pt;
}
/* LINKS */
a.offsite {
	color : Blue;
}
a:link {
	color : #00C;
}
a:visited {
	color : #009;
}
a:active {
	color : #33F;
}
a:hover {
  color : #33C;
}
/* NAVIGATION */
.nav {
	margin: 0;
	padding: 4px;
	font-size: 12pt;
	width: 100%;
}
.nav .indent {
	padding-left: 20px;
}
.nav hr {
	text-align: left;
}
.nav a {
	display: block;
	text-decoration: none;
	font-weight: normal;
	padding: 4px 4px 4px 4px;
}
.nav a:link {
	color: #FFF;
}
.nav a:visited {
	color: #FFF;
}
.nav a:active {
	color: #FFF;
}
.nav a:hover {
	background-color: #5080B0;
	color: #FFF;
}
/* HEADLINES */
h1 {
	font-size: 18pt;
}
h2 {
	font-size: 18pt;
}
h3 {
	font-size: 18pt;
}
h4 {
	font-size: 16pt;
}
h5 {
	font-size: 14pt;
}
h6 {
	font-size: 12pt;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0;
	font-style: italic;
}
/* TABLES */
table.borders {
	border-spacing: 0px;
}
table.borders th, table.borders tr, table.borders td {
	border: 1px solid black;
	padding: 2px;
}

table.servicefees {
	font-size: 12pt;
}

tr.gray { background-color: #dddddd; }
tr.blue { background-color: #ccddee; }

/* GENERIC */
.center {	text-align: center; }
.indent1 { margin-left: 10px; }
.indent2 { margin-left: 20px; }
.indent3 { margin-left: 30px; }
.noborder { border: 0; }
.fullwide { width:100%; max-width:100%; height:auto; }
.bold { font-weight: bold; }
.condensed { letter-spacing : -1px; }
.smaller { font-size : 12pt; }
.smallest { font-size : 10pt; }
.ninepoint { font-size : 9pt; }
.eightpoint { font-size : 8pt; }
.sevenpoint { font-size : 7pt; }
.sixpoint { font-size : 6pt; }
.fivepoint { font-size : 5pt; }
.disclaimer {	font-size:16pt; color: #660000; }
