/*	Less Framework 4
/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/
	
	/*---------Resets---------*/






/*	Default Layout
	92px columns, 24 px gutters, 72 px margins, 1234px total (extra space for scrollbars)
	-------------------------------------------------------------------------------
cols    1    2     3     4     5     6     7     8     9     10     11     12     13
px      68   160   252   344   436   528   620   712   804   896	988    1050   1142 */


.Right {
text-align: right;
}

hr {
border-top: 1px solid #8c8b8b;
padding-top: 10px;
padding-bottom: 10px;
}

.columngrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 25px;
}

/*-----------Calendar Table Styles------------*/

#calendar {
	/*text-align: center;*/
}

#calendar table {
	width: 100%;
}

#calendar td {
	width: 20%;
	padding: 5px 8px;	
	vertical-align: top;
}

#calendar td, #calendar th {
	border: 1px solid #ccc; 	
}

#calendar th {
	padding: 7px 0;	
}

	/* Zebra striping */
	#calendar tr:nth-of-type(odd) { 
		background: #ececec; 
	}
	#calendar th { 
		background: #083872; 
		color: white; 
		font-weight: bold;}

.calendar, .CalendarHeader2 {
	/*padding: 9px;*/
	color: #000;
	/*text-align: center;*/
	font-weight: bold;	
	border-top: 1px solid #ccc; 
	border-left: 1px solid #ccc; 
	border-right: 1px solid #ccc;
	margin: 0 1px
}

.calendar {
	/*background-color: #E2E8FF;*/	
	background-color: rgba(14,118,188,0.1);
}

.CalendarHeader2 {
	/*background-color: #FFC;*/
	background-color: rgba(154,204,0,0.20);
}
#calendar a {
	text-decoration: underline;
}


.CalHeader
	{
		font-size: 36px;
		text-align: center;
		color: #5897D2;
		padding-top: 20px;
		
	}

.CalHeader2
 {
	font-size: 20px;
	color: #083872;
	text-decoration-line: underline;
     padding-bottom: 10px;
}
	


/*		10 Column Layout: 992px. 
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

@media only screen and (min-width: 992px) and (max-width: 1221px) {
	
	

}




/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	


}




/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436  */ 

@media only screen and (min-width: 480px) and (max-width: 767px) {


	
	/*-----------Calendar Table Styles------------*/

/* Force table to not be like tables anymore */
		#calendar table, #calendar thead, #calendar tbody, #calendar th, #calendar td, #calendar tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		#calendar thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		#calendar tr { border: 1px solid #ccc; }
		
		#calendar td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #ccc; 
			position: relative;
			padding: 10px 0 10px 40%;
			width: 60%;
			text-align: left;
		}
		
		#calendar td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
			font-weight: bold;
		}
		
		/*
		Label the data*/
		
		#calendar td:nth-of-type(1):before { content: "Monday"; }
		#calendar td:nth-of-type(2):before { content: "Tuesday"; }
		#calendar td:nth-of-type(3):before { content: "Wednesday"; }
		#calendar td:nth-of-type(4):before { content: "Thursday"; }
		#calendar td:nth-of-type(5):before { content: "Friday"; }
		
.calendar, .CalendarHeader2 {
	margin: 0;
}




	

}







/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252 */   

@media only screen and (max-width: 479px) {


	/*-----------Calendar Table Styles------------*/

/* Force table to not be like tables anymore */
		#calendar table, #calendar thead, #calendar tbody, #calendar th, #calendar td, #calendar tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		#calendar thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		#calendar tr { border: 1px solid #ccc; }
		
		#calendar td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #ccc; 
			position: relative;
			padding: 10px 0 10px 40%;
			width: 60%;
			text-align: left;
		}
		
		#calendar td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
			font-weight: bold;
		}
		
		/*
		Label the data*/
		
		#calendar td:nth-of-type(1):before { content: "Monday"; }
		#calendar td:nth-of-type(2):before { content: "Tuesday"; }
		#calendar td:nth-of-type(3):before { content: "Wednesday"; }
		#calendar td:nth-of-type(4):before { content: "Thursday"; }
		#calendar td:nth-of-type(5):before { content: "Friday"; }
		
.calendar, .CalendarHeader2 {
	margin: 0;
}


}