@media screen {
	body {
		background:white;
		color:black;
		margin:0px;
		padding:0px;
	}

	#header{
		position:fixed;
		width:100vw;
		height:10vh;
		border-bottom:1px solid beige;
		background:navy;
		color:beige
		z-index:1;
	}

	#logo {
		text-align:center;
		display:inline;
		width:10vw;
		color:beige;
		text-align:center;
	}

	#logo img{
		margin-right:auto;
		margin-left:auto;
		width:10vw;
	}

	#logo div{
		width:10vw;
		display:inline-block;
		font-size:2.7vh;
		font-weight:bold;
		border-top:1px solid beige;
		padding-top:1vh;
	}

	#header .headerButton{
		display:inline-block;
		width:12vw;
		height:3.5vh;
		font-size:2vh;
		color:navy;
		background:beige;
		line-height:2vh;
		position:fixed;
		top:2vh;
		text-align:center;
		cursor:none;
		overflow:hidden;
		border-radius:7px;
	}

	#header .headerButton:nth-child(2) {
		left:25vw;
	}

	#header .headerButton:nth-child(3) {
		left:50vw;
	}
	
	#header .headerButton:nth-child(4) {
		left:75vw;
	}

	#header .headerButton .headerButtonContainer {
		display:table;
		height:100%;
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}

	#header .headerButton .headerButtonText {
		display:table-cell;
		vertical-align:middle;
		text-align:center;
	}

	#printButton img {
		height:3vh;
		margin-top:auto;
		margin-bottom:auto;
	}


	#close {
		color:navy;
		background:lightGray;
		border:5px outset darkGray;
		position:absolute;
		left:15px;
		top:15px;
		font-size:150%;
		font-weight:bold;
		margin:15px;
		padding:15px;
		text-align:center;
	}

	#close:hover {
		background:darkGray;
		border:5px inset lightGray;
	}

		
	h1 {
		text-align:center;
	}
	
	.tableDiv {
		height:100%;
		display: table;
		margin-right:auto;
		margin-left:auto;
	}

	.middleAlign {
		display: table-cell;
		vertical-align:middle;
		text-align:center;
	}
	
	#branchSelector {
		list-style-type:none;
		font-size:5vh;
		text-align:center;
		padding-left:0;
		margin-top:auto;
		margin-bottom:auto;
		width:20vw;
	}

	#branchSelector li {
		background:white;
		border:1px solid;
		cursor:pointer;
		display:block-inline;
	}

	#branchSelector li:hover {
		background:gray;
		color:red;
	}

	#scheduleDiv{
		background:beige;
		color:navy;
		position:relative;
		margin-top:0px;
		width:100vw;
		height:90vh;
		text-align:center;
		top:10vh;
	}
	
		width:90%;
		height:90%;
		margin-top:5%;
		margin-bottom:5%;
		margin-right:auto;
		margin-left:auto;
		border-collapse:collapse;
		table-layout:fixed;
	}

	#calendarTable {
		width:60vw;
		height:100%;
		margin-right: auto;
		margin-left:auto;
		border-collapse:collapse;
	}
	
	#calendarTable td {
		text-align:center;
		color:navy;
		background:white;
		border:1px solid navy;
		font-size:6vh;
		font-weight:bolder;
	}
	
	#calendarTable td.calendarControl {
		cursor:pointer;
	}

	#calendarTable td.calendarControl:hover {
		color:white;
		background:navy;
	}
	
	#calendarTable td.blankCalendarCell {
		background:navy;
	}

	#keyDiv{
		text-align:center;
		position:absolute;
		top:8vh;
		margin:0px;
		color:black;
	}

	#keyDiv table {
		width:100vw;
		height:2vh;
		font-size:1.75vh;
		margin:auto;
		table-layout:fixed;
		color:black;
		font-weight:bold;
	}

	#keyDiv table td {
		text-align:center;
		color:black;
	}

	#zoomDiv {
		display:none;
		width:60vw;
		height:60vh;
		top:20vh;
		left:20vw;
		position:fixed;
		border:5px solid navy;
		background:beige;
		color:navy;
		text-align:center;
		cursor:pointer;
	}

	#zoomContainer {
		display:table;
		margin-right:auto;
		margin-left:auto;
		width:60%;
		height:50vh;
		margin-top:3vh;
		margin-bottom:1vh;
	}

	#zoomData{
		display:table-cell;
		text-align:center;
		vertical-align:middle;
		font-size:3vh;
		height:50vh;
		border:3px solid black;
		color:black;
	}

	#zoomInstructions {
		display:block;
		text-align:center;
		position:absolute;
		color:red;
		bottom:1vh;
		left:0;
		width:100%;
		font-style:italic;
		height:3vh;
	}

	#printDiv {
		display:none;
	}

	.vContainer {
		background:navy;
		color:beige;
		height:100vh;
		width:100vw;
		display:flex;
		align-items:center;
		justify-content:center;
	}
		
	
	.xContainer {
		text-align:center;
	}
	
	.xContainer div {
		padding:1vh;
	}

	.xContainer input {
		width:275px;
		font-size:xx-large;
		text-align:center;
	}
	
	.xContainer button {
		font-size:xx-large;
	}

	.vTitle {
		width:100%;
		font-size:xxx-large;
	}

	#vMessage {
		width:100%;
		font-size: xx-large;
		display:none;
	}

	#codeQuery {
		display:none;
	}
		
	#logoDiv {
		text-align:center;
	}

	#logoDiv img {
		display:inline;
		background:beige;
		text-align:center;
		border-radius: 15px;
	}