* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
	_border-style: solid; 
	_border-width: 1px;
	_padding: 2px;
}

html {
	overflow: auto;
	height: 100%; 
	min-height: 100%; 
	background-color: #FFFFFF;
}

body {
	overflow: auto;
	height: 100%;
	min-height: 100%;
  	max-width: 1024px;
  	margin: 0 auto 0 auto;
	background-color: #FFFFFF;
}

.pagelayout {
	position: relative;
	overflow: auto;
	min-height: 100%; 
  	max-width: 1024px;
  	margin: 0 auto 0 auto; 
	_color: #161251;
	color: #1A1A66;
	background-color: #FFFFFF;
	font-family: Georgia, "Trebuchet MS", Arial, Serif;
	font-size: 1.0em; 
	line-height: 1.5em;
	vertical-align: center;
	border-color: #CCCCCC;
	border-style: solid;
	border-width: 0px 1px 0px 1px; 
}

.pageheader {
	height: 50px; 
	margin-top: 10px;
	margin-bottom: 60px;
	background-color: #1A1A66;
        background-image: linear-gradient(90deg, #1A1A66, white);
}

.imglogo {
	float: left;
	width: 80%;
	max-width: 250px;
 	height: auto;
	margin-top: 10px;
	margin-left: 20px;
}

.pagefooter {
	position: absolute;
  
	bottom: 10px;
	width: 100%;
 
	margin-top: 20px;
 	padding: 10px;
	color: #F5F5DC;
	background-color: #1A1A66;
        background-image: linear-gradient(90deg, #1A1A66, white);
	border-color: #8B8114; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px; 
}

.pagemain {
	overflow: auto;
	min-height: 100%; 
	margin: 0 40px 120px 40px;
}

.main-col-1 {
  	float: left;
	width: 180px;
	margin: 60px auto 0px auto;
 	padding: 0px 0px 0px 0px;
	vertical-align: center;
}

.main-col-2 {
	overflow: auto;
	min-width: 300px;
	margin: 0 0 0 180px;
}

.main-box {
	padding-left:40px;
	padding-right:40px;
}

.r-margin {
	margin-right: 180px;
}

.tx-centered {
	text-align: center;
}

.quote {
	padding-left: 40px;
	padding-right: 40px;
	padding-top: 40px;
	padding-bottom: 40px;
	font-size: 1.2em;
	font-style: italic;
	text-align: center;
}

.imgsmall {
  	display: inline;
	float: right;
	width: auto;
	max-width: 180px;
	height: auto;
	margin-left: 40px;
	margin-bottom: 40px;
	padding: 0px;
}

.bookstyle {
	border-width: 0px 3px 3px 0px; 
	border-style: solid; 
	border-spacing: 0px; 
	border-color: #808080;
}

.bookstyle2 {
	border-width: 1px 3px 3px 1px; 
	border-style: solid; 
	border-spacing: 0px; 
	border-color: #808080;
}

.asided {
  	display: block;
	float: none;
	margin-bottom: 20px;
}

.r-aside {
  	display: inline;
	float: right;
	width: auto;
	max-width: 180px;
	height: auto;
	padding: 0px;
}

.bordered {
	border-color: #808080; 
	border-style: double; 
	border-width: 1px 0px 1px 0px; 
	border-spacing: 20px; 
}

.emptyline {
	height:20px;
}

nav ul {	
	margin: 0.0em 0.0em 0.0em 0.0em; 
	padding: 0;
}

nav li {
        list-style: none;
        margin: 0.0em 0.0em 0.0em 0.0em; 
	text-align: center;
	background-color: #E3CEF6; 
        border-radius: 0px;
	border-color: #696969; 
	border-style: solid; 
	border-width: 2px 0px 2px 0px; 
}

.addon-item {
        background-color: transparent;
}

.li-sidebar {
        margin: 1.0em 0.0em 1.0em 0.0em; 
}

nav a {
        display: block;
        padding: 0.2em;
        text-decoration: none;
        border: 1px black;
	color: #0F0F0F;
        background-color: transparent;
}

nav a:focus,
nav a:hover,
nav a:active,
nav span {
        color: dimgrey; 
        background-color: #F5F5DC;
        border-color: #F5F5DC;
}

nav h2 {
        font-size: 1em;
        margin: 0.0em 0 0;
	color: black;
        border-color: transparent;
        background-color: transparent;
        box-shadow:n one;
}

@media screen and (max-width:850px) {

  .pageheader {
	margin-top: 10px;
	margin-bottom: 20px;
        background-image: linear-gradient(90deg, #1A1A66, #E0E0E0);
  }

  .pagefooter {
        background-image: linear-gradient(90deg, #1A1A66, #E0E0E0);
  }

  .pagemain {
	margin: 0px 40px 120px 20px;
	min-height: 100%; 
	overflow: auto;
  }

  .main-box {
	padding-left: 20px;
	padding-right: 40px;
  }

  .main-col-1 {
  	float: none;
	width: 100%;
	margin: auto;
	vertical-align: center;
  }

  .main-col-2 {
	min-width: 100px;
	margin:0 0 0 0px;
  }

  .li-sidebar {
	display: inline-block;
        margin: 0.5em 0.2em 0.5em 0.2em; 
  }

  nav li {
	width: 150px;
  }

  .emptyline {
	height:10px;
  }

}


@media screen and (max-width:650px) {
  .pageheader {
        background-image: linear-gradient(90deg, #1A1A66, #C0C0C0);
  }

  .pagefooter {
        background-image: linear-gradient(90deg, #1A1A66, #C0C0C0);
  }

  .main-col-1 {
  	float: none;
  }

  .main-col-2 {
	margin: 0 0 0 0px;
  }
  
  .r-margin {
	margin-right:0px;
  }

  .imgsmall {
	display: block;
	float: none;
	margin: 20px auto 20px auto;
  }
}

@media screen and (max-width:480px) {
  .pagelayout {
	border-width: 0px 0px 0px 0px; 
  }

  .pageheader {
	margin-top: 0px;
	margin-bottom: 10px;
        background-image: linear-gradient(90deg, #1A1A66, #1A1A66);
  }

  .pagefooter {
        background-image: linear-gradient(90deg, #1A1A66, #1A1A66);
  }

  .pagemain {
	margin: 0px 5px 50px 5px;
  }


  .main-box {
	padding-left: 5px;
	padding-right: 5px;
  }

  .main-col-1 {
  	float: none;
	width: 100%;
	_margin: 10px auto;
	margin: auto;
	vertical-align: center;
  }

  .main-col-2 {
	margin: 0 0 0 0px;
  }
  
  .r-margin {
	margin-right: 0px;
  }

  .quote {
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
  }

  .li-sidebar {
	display: block;
	width: 100%;
        margin: 0.5em auto 0.5em auto; 
  }

  nav li {
	.width: 100%;
  }

  .emptyline {
	height: 0px;
  }

}