.page-container {
		width: 100%;
		padding: 5px;
		border: 2px solid yellow;
		margin: auto auto auto auto;
		background-color: #B6DCE9;	
		overflow: visible;
	}

.top-header {
		width:90%;
		padding: 5px;
		border: 1px solid black;
		margin: 0 auto 0 auto;	
		vertical-align: middle;
		text-align: right;
		background-color: #000000;
	}

p.headings {
		padding: 5px 5px 5px 5px; 
		font-family: Arial; 
		color: black; 
		font-size: 20px; 
		text-align: center; 
		font-weight: bold;
}

p.plain-centered-text {
		padding: 0px 5px 5px 5px; 
		font-family: Arial; 
		color: black; 
		font-size: 16px; 
		text-align: center; 
		font-weight: normal;
}

p.plain-text {
		padding: 0px 5px 5px 5px; 
		font-family: Arial; 
		color: black; 
		font-size: 16px; 
		text-align: left; 
		font-weight: normal;
}

p.back2top {
		padding: 25px 5px 5px 10px; 
		font-family: Arial; 
		font-size: 18px; 
		text-align: center; 
		font-weight: bold;
}



li {
        padding: 0px 15px 5px 35px; 
        font-family: Arial; 
        color: black; 
        font-size: 16px; 
        text-align: left; 
        font-weight: normal;
}


.table {border-spacing: 8px; margin: auto auto auto auto;}

.table td { 
    border: 2px solid black;
    padding: 10px; 
    font-family: Arial; 
    font-size: 16px; 
    font-weight: normal;
	text-align: left;
	vertical-align: top; }


.table th { 
    border: 1px solid black;
    padding: 10px; 
    font-family: Arial; font-size: 16px; font-weight: normal;
	text-align: left;
	vertical-align: top; }


th, td {
    width: 50%;
    border: 1px solid black;
    padding: 10px; 
    font-family: Arial; font-size: 16px; font-weight: normal;
	text-align: left;
	vertical-align: top; }

table.booklist td {
        width: 33%;
        border: 1px solid black;
        padding: 10px;
        font-family: Arial;
        font-size: 16px;
        font-weight: normal;
        text-align: left;
        vertical-align: middle;
        overflow: hidden;
        white-space: nowrap;
}

table.history {
        width: 80%;
        margin: 15px auto 15px auto;
}

table.history td {
        
        border: 1px solid black;
        padding: 10px;
        font-family: Arial;
        font-size: 16px;
        font-weight: normal;
        text-align: left;
        vertical-align: middle;
        overflow: hidden;
        white-space: wrap;
        border-collapse: collapse;
}



/* --- TOP HEADER ACCOUNT LOGIN BUTTON ---*/

.account-button {
		border: 0px;
  		color: white;
  		padding: 4px 12px 4px 12px;
  		text-align: center;
  		text-decoration: none;
  		display: inline-block;
  		font-size: 16px;
  		margin: 4px 4px;
  		transition-duration: 0.4s;
  		cursor: pointer;
  		border-radius: 8px;
}
.account-button1 {
  		background-color: black; /*#fdfafa;*/ 
  		color: #fdfafa;  /*black;*/ 
  		height: 38px;
  		border: 2px solid #307C91;
	}
.account-button1:hover {
  		background-color: #8dd6fd;
  		color: #fdfafa;
  		box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
	}	
/* -------------------------------*/	



.main-header {
		width: 90%;
		padding: 5px;
		border: 1px solid #fdfafa;
		margin: 0 auto 0 auto;
		vertical-align: middle;
		text-align: center;
		background-color: #fdfafa;	
		overflow: auto;
	}

#logo-column1 {
		display: inline-block;		
		width: 108px;
		padding: 0px;
		margin: 0 2px 0 4px;
		vertical-align: middle;
		/* text-align: left; */
				
	}

#logo-column2 {
		display: inline-block;		
		width: 350x; 
		padding: 0px;
		/*border: 1px solid #ffffff;*/
		margin: 0 4px 0 4px;
		vertical-align: middle;
		text-align: left;
	}
	
#logo-column3 {
		display: inline-block;		
		width: 390x; 
		padding-left: 20px;
		/*border: 1px solid #ffffff;*/
		margin: auto 4px auto 4px;
		vertical-align: middle;
		text-align: left;
	}
#logo-column4 {
		display: block;
		float: right;
		margin-top: 5px;
		margin-right: -5px;
		vertical-align: top;
	}	



.nav-search {
		width: 90%;
		padding: 3px;
		border: 1px solid #fdfafa;
		margin: 0 auto 0 auto;
		vertical-align: middle;
		text-align: center;
		background-color: #8B929A;	
		overflow: auto;
	}
	
.nav-search li {
  		display: inline-block;
  		font-size: 18px;
  		/*padding: 10px; */
  	}
  	
.main-nav {
		width: 90%;
		background-color: #E5E3E4;
		padding: 3px;
		margin: 0 auto 0 auto;
		vertical-align: middle;
		text-align: center;		
		list-style-type: none;
	}
	
.main-nav a:hover {
		background-color: #ddd;
		color: black;
}
.main-nav li {
  		display: inline-block;
  		list-style-type: none;
  		position: relative;
  		font-size: 18px;
  		padding: 10px; 
  	}
/* -------------------------------*/
  

/* --- NAVIGATION SEARCH BUTTONS ---*/
  	
.button {
  		border: 0px;
  		color: white;
  		padding: 4px 12px 4px 12px;
  		text-align: center;
  		text-decoration: none;
  		display: inline-block;
  		font-size: 16px;
  		margin: 4px 4px;
  		transition-duration: 0.4s;
  		cursor: pointer;
  		border-radius: 8px;
	}

.button1 {
  		background-color: #8dd6fd; 
  		color: #fdfafa; 
  		border: 2px solid #307C91;
	}
	
.button1:hover {
  		background-color: #fdfafa;
  		color: black;
  		box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
	}	
/* -------------------------------*/



/* --- MAIN NAVIGATION DROP DOWN MENU ---*/

.dropbtn {
  background-color: #E5E3E4;
  color: black;
  padding: 16px;
  font-size: 17px; 
  border: none;
  cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #B6DCE9;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  text-align: left;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
  background-color: #8dd6fd;
}

/* -------------------------------*/
	
/* -----MAIN PAGE IMAGE SLIDER ----*/
	
.slider-Box {
		width: 100%;
		padding: 3px;
		border: 1px solid #fdfafa;
		margin: 0 auto 0 auto;
		vertical-align: middle;
		text-align: center;
		background-color: #8dd6fd;
		
	}
	
#img-slider {
		max-width: 90%;
		margin: 0 auto 0 auto;
		height: 100%;
	}
/* -------------------------------*/  	
 

/* CONTENT IN THE MIDDLE OF THE PAGE */

.content {
		width: 90%;
		padding: 0px 0px 0px 0px;
		border: 0px; /* solid #B6DCE9; */	
		margin: 0px auto 0px auto;
		background-color: #B6DCE9;		
		overflow: auto;
	}
	
.content-column {
		display: inline-block;
		width: 100%;
		
		padding: 0px;
		border: 0px solid black; /* #fdfafa; */ 
		margin: 5px auto 5px auto;
		padding: 0px 0px 25px 0px;
		vertical-align: middle;
		text-align: center;
		background-color: #fdfafa;	
		overflow: auto;
		

	}
/* ------------------------------ */





/* ------- FOOTER CONTROL ------- */

.footer {
		width: 90%;
		padding: 5px;
		border: 1px solid #ffffff;
		margin: 0 auto 0 auto;
		vertical-align: top;
		text-align: center;
		background-color: #000000;	
		overflow: auto;
	}
.footer-tables {
    display: inline-block;
    width: 260px;
    color: white;
    vertical-align: top;
    margin: 20px 20px 20px 20px;
    text-align: left;
}



	
/* -------------------------------*/