/* override browser default */
html, body {
  margin: 0;
  padding: 0;
}

body {
	height: 				100%;
	width: 				100%;
	position:			relative;
	background-color: #c0ceef;
	font-family: 		Montserrat, tahoma, 'Open Sans', sans-serif;
	font-size: 			1.0em;
	color: 				#2d1a82;
}

table {
	background-color: rgba(176, 189, 239, 0.9);	
	border-collapse:	collapse;
	margin: 				0;
	padding:				0;
	border: 				0;
	width: 				100%;
	border-radius: 	10px;
	margin-top:			4px;
}

td {
	height:		30px;
	font-size: 	1.0em;
}

th {
	height:			15px;
	font-size: 		1.2em;
	text-align:		center;
}

select {
	height:		35px;
	font-size: 	0.9em;
}

input {
	height:			25px;
	font-size: 		0.8em;
   border-radius: 6px;
   border: 			1px solid gray;
}

.radio {
	height: 		0.9em;
   font-size: 	0.9em;
   margin-top: 0;
}


/* Desktops */
	.main {
		width:				100%;
		max-width:			820px;
		min-width:			460px;
		margin:				auto;
		padding:				2px;
		padding-bottom:	0;
	}
	
	.outerDiv {
		display:				flex;
		flex-wrap:			wrap;
		justify-content: 	center;
		width:				100%;
		max-width:			820px;
		margin:				auto;
		padding:				0px;
	}
	
	.topDiv {
		width:		49%;
		max-width:	400px;
		flex-basis:	auto;
	}

	.middleDiv {
		width:		1%;
		flex-basis:	auto;
	}

	.bottomDiv {
		width:		49%;
		max-width:	400px;
		flex-basis:	auto;
	}

	
/* End Desktops */



/* Mobiles ----830------- SINGLE COLUMN  */
@media (max-width : 830px) {

	.main {
		width:				98%;
		min-width:			410px;
		margin:				auto;
		padding:				2px;
		padding-bottom:	0;
	}

	.outerDiv {
		width:		100%;
		max-width:	660px;
		min-width:	410px;
		margin:		auto;
		padding:		0;
	}
	
	.topDiv {
		width:		100%;
		display: 	inline-block;
	}

	.middleDiv {
		width:		1%;
		display: 	none;
	}

	.bottomDiv {
		width:		100%;
		display: 	inline-block;
		position:	relative;
	}
}

 


.tfForm {
	width:		100%;
}


.disclaim {
	height:		20px;
	font-size: 	0.8em;
	text-align:	center;
	color: 		maroon;	
}

.tfHeader {
	min-width: 	100%;
	max-width: 	100%;
	height:		50px;
	font-size: 	1.0em;
	text-align:	center;
	margin-bottom:	4px;	
}

.movesarray {
	visibility:	hidden;
	height:		15px;
	font-size: 	1em;
	text-align:	center;
}

.routine-row {
	height:		40px;
}

.routine {
	font-size: 		1.0em;
}

.routine-picker {
	height:			28px;
	font-size: 		0.9em;
	min-width:		25em;
	border-radius: 6px;
}

.routine-header {
	height:				30px;
	font-size: 			0.7em;
	font-weight:		bold;
	vertical-align: 	bottom;
}

.label {
	font-size: 		0.8em;
	font-weight:	normal;
	text-align:		right;
}

.total {
	height:			28px;
	font-size: 		1em;
	font-weight:	normal;
	text-align:		right;
}

.picklist {
	height:			28px;
	min-width:		15.7em;
	max-width:		15.7em;
	border-radius: 6px;
	border: 			1px solid gray;
	margin:			3px 0 3px 0;
}

.gender {
	border-radius: 6px;
	border: 			1px solid gray;
	margin:			3px 0 3px 0;
}


button {
	background-color:	#a9b6f1;
	border-color:		#99a6f1;
	border-radius:		6px;
	height:				28px;
	width:				100px;
}

.narrowButton {
	width:				50px;
}

.tdc {
	text-align:	center;
}

.thinTDdc {
	text-align:	center;
	height:		6px;
}	

.tdl {
	text-align:	left;
}

.tdr {
	text-align:	right;
}

.info {
	height:			1em;
	font-size: 		0.8em;
	font-weight:	normal;
	text-align:		center;
}

.saveroutine {
	xvisibility:	hidden;
}

.hide {
	display:	none;
}

.title {
	font-size: 	1.4em;
	color:		white;
	width:		100%;
}

.tariff {
	min-width:		3em;
	max-width:		4em;
	height:			35px;
	font-size: 		1em;
	border-radius: 6px;
	border:			1px solid gray;
	text-align:		center;
}

.blurb {
	min-width: 		100%;
	max-width: 		100%;
	xheight:			80px;
	font-size: 		0.8em;
	font-weight:	normal;
	text-align:		left;
}

.fig {
	min-width:		4.9em;
	max-width:		4.9em;
	font-size: 		0.9em;
	text-align:		left;
	padding-left:  6px;
}