#banner{
	width:100vw;
	height:50px;
	position:fixed;
	display:block;
	top:0;
	background-color:#F9F9F9;
}

.bannerDiv{
	display:inline-block;
}

#longClub{
	display:inline-block;
	font-size:24px;
}

.title{
	font-family: 'Times New Roman', serif;
	font-size:20px;
	color:blue;
	margin:0px 0px 0px 80px;
}	

.popupPanel
{
    border: solid 1px #ff3333;
    position: fixed;
    left: 10%;
    top: 10%;
	color:black;
    background-color: #fff5e6;
    z-index: 100;
	overflow-wrap: normal;
    height: auto;
	padding:10px;
    max-width: 320px;
	box-shadow: 10px 10px 5px grey;
}

.printBanner{
	display:inline-block;
	width:100%;
}

#redsLogoPrint{
	display:inline-block;
	width:80px;
	height:auto;
}

#printLongClub{
	display:inline-block;
	font-size:24px;
	margin:20px 0px 0px 20px;
	vertical-align:top;
}

#shortClub{
	display:none;
}

#collection{
	border:solid red 2px;
	display:block;
	float:left;
	width:45vw;
	height:80vh;
	margin:140px 0px 0px 10px;
	overflow:scroll;
}	

#collection img{
	width:32%;
	height:auto;
}

#selection{
	border:solid black 2px;
	display:block;
	float:right;
	width:45vw;
	height:80vh;
	overflow: scroll;
	margin:140px 10px 0px 0px;
	
}	

.circuitNameBlock{
	display:inline-block;
	margin:0px 0px 20px 50px;	
	float:left;
}

.circuitLabel{
	font-size:18px;	
	display:inline-block;
}

#circuitName{
	display:inline-block;
	font-size:14px;
	width:350px;
	background-color:transparent; 
	border:none; 
	border-bottom:solid blue 1px;
}

.exerciseBlock{
	display:block;
	float:right;
	width:40vw;
	height:70vh;
	margin:10px 10px 0px 10px;
}	

.topnav {
  overflow: hidden;
  background-color: #b30059;
}

.topnav input {
  float: left;
  color: #f2f2f2;
  text-align: center;
  background-color: #b30059;
  padding: 5px 5px;
  text-decoration: none;
  font-size: 14px;
}

.topnav input:hover {
  background-color: #ff0000;
  color: black;
}

.topnav input.active {
  background-color: #558000;
  color: white;
}

.toolLogo{
	width:25px; 
	height:auto; 
	margin:5px 8px 0px 0px;
	background-color:#ffad33;
}
	
.toolLogo:hover{
	background-color:#ffd699;	
}

.block{
	display:inline-block;
	width:32%;
	height:29%;
	border:solid 1px black;
	margin:0px 0px 10px 0px;
}

.image{
	width:100%;
	height:auto;
	margin:0;
}
.imageDiv{
	width:100%;
	height:80%;
	margin:0;
}

.CText{
	width:25%;
	height:90px;
	resize:none; 
	font-size:14px;
	border:solid black 1px;
}

.SText{
	width:95%;
	height:110px;
	padding:10px;
	overflow:hidden;
	resize:none;
	font-family:time;
	font-size:22px;
	text-align:center;
	border:solid 1px black;
}

.setrep{
	width:98%;
	float:bottom;
	margin:0;padding:0;
	text-align:center;
	font-size:10px;
}
	 
@media print {
	#selection{
		margin:0px 0px 0px 15px;
		border:solid red 1px;
		float:left;
		width:93vw;
		height:auto;
		overflow:hidden;
	}
	
	.printBanner{
		display:inline-block;
		width:95vw;
		margin:0px ;
	}
	
	.bannerDiv{
	display:inline-block;
	vertical-align: middle;
	}

	#longClub{
		font-size:16px;
	}
	
	.circuitLabel{
		font-size:16px;	
		vertical-align: middle;
		display:inline-block;
		float:right;
		margin:15px 0px 0px 10px;
	}

	#circuitName{
		display:inline-block;
		width:45vw;	
		font-size:16px;				
		text-align:center;
	}

	.block{
		display:inline-block;
		width:30vw;
		height:auto;
		border:none; 
	}
	
	.setrep{
		height:20px;
		font-size:16px;
		border:solid 1px black;
	}

	.imageDiv{
		width:100%;
		height:90%;
		margin:0;
	}
	.exerciseBlock{
		width:98%;
		height:85%;
		margin:10px 10px 0px 10px;
	}
	
	.SText{
	width:95%;
	max-height:125px;
	padding:10px;
	resize:none; 
	text-align:center;
	font-size:22px;
	border:solid 1px red; 
	}
}

/*Styles for phones  */
@media only screen and (max-width: 800px){
	#collection{
		border:solid red 2px;
		display:block;
		float:left;
		width:80vw;
		height:40vh;
		margin:150px 0px 0px 10px;
		overflow:scroll;
	}	

	#selection{
		border:solid blue 2px;
		display:block;
		float:left;
		width:90vw;
		height:50vh;
		overflow: scroll;
		margin:10px 0px 0px 10px;
	}
	.toolLogo{
	width:30px; 
	height:auto; 
}

	.exerciseBlock{
		width:98%;
		height:85%;
		margin:10px 10px 0px 10px;
	}

	.block{
		display:inline-block;
		width:32%;
		height:45%;
		border:solid 1px black;
		margin:0px 0px 10px 0px;
	}

	.imageDiv{
		width:100%;
		height:90%;
		margin:0px;
	}

	.block input{
		font-size:14px;
	}
}












