/* -----------STYLES for Floating Forms---------------*/
/*style the filter table*/
#player {
	width: 100%;    
	font-size:16px;
	padding: 12px 20px 12px 20px;
	border: 1px solid #DDD;
	margin-bottom:12px;
}


/*style inputs, select elements and textareas */
input[type=text], input[type=email], select, option, textarea {
	width: 100%;
	padding: 12px;
	border: 1px solid #CCC;
	border-radius: 4px;
	box-sizing: border-box;
	resize: vertical;
}

/*style the label to display next to the inputs */
label {
	padding: 12px 12px 12px 0;
	display: inline-block;
}

/*style the submit button */
input[type=submit] {
	background-color: #04AA6D;
	color: white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	float: right;
	width: 100%;
}

/*style the form container*/
.form {
	border-radius: 5px;
	background-color: #f2f2f2;
	padding: 20px;
	height: 1000px;
  	overflow: scroll;
}

/* Floating column for labels: 25% width */
.col-25 {
	float:left;
	width:25%;
	margin-top:6px;
}

/*Floating column for inputs: 75% width */
.col-75 {
	float:left;
	width:75%;
	margin-top: 6px;
}

/*clear floats after the columns*/
.row:after {
	content:"";
	display: table;
	clear: both;
}

.responsive_table{
	overflow-x:auto;
}

.tables{
	width: 100%;
	border-style:inset;
	border-color:#FFFFFF;
	border-width:1px;
	text-align:center;
	
}

.tables td{
	border-top-style:outset;
	border-bottom-style:outset;
	border-top-color:#FFFFFF;
	border-bottom-color:#FFFFFF;
	border-top-width:1px;
	border-bottom-width:1px;
}


/*Responsive layout when the screen is less than 620px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width:620px) {
	.col-25, .col-75, input[type=submit]{
		width:100%;
		margin-top: 0
		height: 400px;
  		overflow: scroll;
	}
}