/*Lesson Accordions*/
	#customclass-lessons-accordion-box-id {
		display:inline-block;
		position:relative;
		width:96%;
		/*height:auto;*/
		margin:0px;
		padding:0px;
		padding-top:4px;
		padding-bottom:14px;		
		background:none;
		z-index: 20; /* Sit on top */
		border: 0px solid lightgrey;
		overflow: auto;  /* Enable or Disable horizontal scroll */
	}

	/*button class*/
	.customclass-lessons-accordion-button-class {
		width:90%;
		border: 0px solid lightgrey;
		font-size:14px;
		margin:0px;
		padding:0px;
		padding-top:4px;
		padding-bottom:4px;
		margin-left:10px;
		margin-bottom:6px;
		border-radius:15px;
		background-color:rgb(230,227,153);
	}
	
	button.customclass-lessons-accordion-button-class:before {
		content: '\f055';
		font-family: "fontawesome";
		font-size: 14px;
		padding:0;
		margin:0;
		margin-left:6px;
		margin-top:3px;
		margin-right: 3px;
		float:left;
	}

	button.customclass-lessons-accordion-button-class.is-open:before {
		content: '\f056';
	}
 
	button.customclass-lessons-accordion-button-class:hover, button.customclass-lessons-accordion-button-class.is-open {
		background-color: rgb(238,238,214);
	}	

	.customclass-lessons-accordion-content-class {
		width: 98%;
		color: black;
		font-weight:bolder;
		margin:0px;
		padding:0px;
		background-color: rgb(238,238,214);
		border-style:solid;
		border-width:0px;
		border-color: rgb(230,227,153);
		margin-left:2px;
		margin-bottom:10px;
		max-height: 0;
		overflow: scroll;
		transition: max-height 0.1s ease-in-out;
	}

	.customclass-dummy-lessons-accordion-content-class {
		min-height:30px;
	}


/*---------Time the Bobbing Hole Starts Here--------------------------------------*/
/**********************************************************************************/
	
	/*Handle the Content inside the Accordion. */
	/*This the Specific Beginner, Intermediate, Advanced Tabs and Defense Content
	/*---------------------------------------------------------------------------*/

	.customclass-lessons-tbh-headervideoimg-div-class {
		position:relative;
		margin:0;
		padding:0;
	}

	.customclass-lessons-tbh-headervideoimg-table-class {
		display: table;   /* Allow the centering to work */
		margin: 0 auto;
	}

	/*A User can pick between iframe, Video, Image within the Lesson Tab Headers.*/
	/*So we need to be ready to format whatever is built within the JS AJAX Result*/
		.customclass-lessons-tbh-header-iframe-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
	
		.customclass-lessons-tbh-header-video-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
		
		.customclass-lessons-tbh-header-image-class {
			width:90%;
			width:auto;
			max-width:350px;
			height:200px;
		}		
	/*-------------------------------------------*/
	

	.customclass-lessons-tbh-tabs-div-id {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}
	
	/* Style lessons tab buttons */
	.customclass-lessons-tbh-tab-buttons-class:hover {
		background-color: rgb(255, 254, 221);
	}

	.customclass-lessons-tbh-tab-buttons-class {
		background-color: rgb(230,227,153);
		color: black;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		margin:0;
		padding: 2px 2px;
		font-size: 12x;
		width: 33.33%;
	}


	/*Once the User selects a Tab, this is the Tab Content Area*/
	.customclass-lessons-tbh-tab-content-div-class {
		margin-bottom:20px;		
	}
	
	/* this particular class here is generic to the beginner,interm,advanced*/
	.customclass-lessons-tbh-tabcontent {
		position:relative;
		margin:0;
		padding:0;
		min-height:200px;
	}

	.cc-lessons-tbh-h3-beginner-tab-title-class {
		padding-top:10px;
		text-align:center;	
	}

	.cc-lessons-tbh-h3-intermediate-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	
	.cc-lessons-tbh-h3-advanced-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	




/*---------Hit The Open Hole Starts Here--------------------------------------*/
/******************************************************************************/
	
	/*Handle the Content inside the Accordion. */
	/*This the Specific Beginner, Intermediate, Advanced Tabs and Defense Content
	/*---------------------------------------------------------------------------*/

	.customclass-lessons-htoh-headervideoimg-div-class {
		position:relative;
		margin:0;
		padding:0;
	}

	.customclass-lessons-htoh-headervideoimg-table-class {
		display: table;   /* Allow the centering to work */
		margin: 0 auto;
	}

	/*A User can pick between iframe, Video, Image within the Lesson Tab Headers.*/
	/*So we need to be ready to format whatever is built within the JS AJAX Result*/
		.customclass-lessons-htoh-header-iframe-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
	
		.customclass-lessons-htoh-header-video-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
		
		.customclass-lessons-htoh-header-image-class {
			width:90%;
			width:auto;
			max-width:350px;
			height:200px;
		}		
	/*-------------------------------------------*/
	

	.customclass-lessons-htoh-tabs-div-id {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}
	
	/* Style lessons tab buttons */
	.customclass-lessons-htoh-tab-buttons-class:hover {
		background-color: rgb(255, 254, 221);
	}

	.customclass-lessons-htoh-tab-buttons-class {
		background-color: rgb(230,227,153);
		color: black;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		margin:0;
		padding: 2px 2px;
		font-size: 12x;
		width: 33.33%;
	}


	/*Once the User selects a Tab, this is the Tab Content Area*/
	.customclass-lessons-htoh-tab-content-div-class {
		margin-bottom:20px;		
	}
	
	/* this particular class here is generic to the beginner,interm,advanced*/
	.customclass-lessons-htoh-tabcontent {
		position:relative;
		margin:0;
		padding:0;
		min-height:200px;
	}

	.cc-lessons-htoh-h3-beginner-tab-title-class {
		padding-top:10px;
		text-align:center;	
	}

	.cc-lessons-htoh-h3-intermediate-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	
	.cc-lessons-htoh-h3-advanced-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	
	
/*---------Hit Between Several Open Holes Starts Here--------------------------------------*/
/******************************************************************************/
	
	/*Handle the Content inside the Accordion. */
	/*This the Specific Beginner, Intermediate, Advanced Tabs and Defense Content
	/*---------------------------------------------------------------------------*/

	.customclass-lessons-hbsoh-headervideoimg-div-class {
		position:relative;
		margin:0;
		padding:0;
	}

	.customclass-lessons-hbsoh-headervideoimg-table-class {
		display: table;   /* Allow the centering to work */
		margin: 0 auto;
	}

	/*A User can pick between iframe, Video, Image within the Lesson Tab Headers.*/
	/*So we need to be ready to format whatever is built within the JS AJAX Result*/
		.customclass-lessons-hbsoh-header-iframe-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
	
		.customclass-lessons-hbsoh-header-video-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
		
		.customclass-lessons-hbsoh-header-image-class {
			width:90%;
			width:auto;
			max-width:350px;
			height:200px;
		}		
	/*-------------------------------------------*/
	

	.customclass-lessons-hbsoh-tabs-div-id {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}
	
	/* Style lessons tab buttons */
	.customclass-lessons-hbsoh-tab-buttons-class:hover {
		background-color: rgb(255, 254, 221);
	}

	.customclass-lessons-hbsoh-tab-buttons-class {
		background-color: rgb(230,227,153);
		color: black;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		margin:0;
		padding: 2px 2px;
		font-size: 12x;
		width: 33.33%;
	}


	/*Once the User selects a Tab, this is the Tab Content Area*/
	.customclass-lessons-hbsoh-tab-content-div-class {
		margin-bottom:20px;		
	}
	
	/* this particular class here is generic to the beginner,interm,advanced*/
	.customclass-lessons-hbsoh-tabcontent {
		position:relative;
		margin:0;
		padding:0;
		min-height:200px;
	}

	.cc-lessons-hbsoh-h3-beginner-tab-title-class {
		padding-top:10px;
		text-align:center;	
	}

	.cc-lessons-hbsoh-h3-intermediate-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	
	.cc-lessons-hbsoh-h3-advanced-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}	
	
	
/*---------Pattern Recognition Starts Here--------------------------------------*/
/******************************************************************************/
	
	/*Handle the Content inside the Accordion. */
	/*This the Specific Beginner, Intermediate, Advanced Tabs and Defense Content
	/*---------------------------------------------------------------------------*/

	.customclass-lessons-pr-headervideoimg-div-class {
		position:relative;
		margin:0;
		padding:0;
	}

	.customclass-lessons-pr-headervideoimg-table-class {
		display: table;   /* Allow the centering to work */
		margin: 0 auto;
	}

	/*A User can pick between iframe, Video, Image within the Lesson Tab Headers.*/
	/*So we need to be ready to format whatever is built within the JS AJAX Result*/
		.customclass-lessons-pr-header-iframe-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
	
		.customclass-lessons-pr-header-video-class {
			width:90%;
			max-width:350px;
			height:200px;
		}
		
		.customclass-lessons-pr-header-image-class {
			width:90%;
			width:auto;
			max-width:350px;
			height:200px;
		}		
	/*-------------------------------------------*/
	

	.customclass-lessons-pr-tabs-div-id {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}
	
	/* Style lessons tab buttons */
	.customclass-lessons-pr-tab-buttons-class:hover {
		background-color: rgb(255, 254, 221);
	}

	.customclass-lessons-pr-tab-buttons-class {
		background-color: rgb(230,227,153);
		color: black;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		margin:0;
		padding: 2px 2px;
		font-size: 12x;
		width: 33.33%;
	}


	/*Once the User selects a Tab, this is the Tab Content Area*/
	.customclass-lessons-pr-tab-content-div-class {
		margin-bottom:20px;		
	}
	
	/* this particular class here is generic to the beginner,interm,advanced*/
	.customclass-lessons-pr-tabcontent {
		position:relative;
		margin:0;
		padding:0;
		min-height:200px;
	}

	.cc-lessons-pr-h3-beginner-tab-title-class {
		padding-top:10px;
		text-align:center;	
	}

	.cc-lessons-pr-h3-intermediate-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}
	
	.cc-lessons-pr-h3-advanced-tab-title-class {
		padding-top:10px;		
		text-align:center;	
	}		
	

	/*************************************************************/
	/* Dynamic Lesson Content (actual Lessons) stored in Database*/
	.cc-generic-lesson-object-div-class {
		display:block;
		font-size:12px;
		position:relative;
		min-height:50px;
		max-height:150px;
		margin-left:3px;
		margin-right:3px;
		margin-bottom:7px;
		background-color:rgb(245,245,245);
		overflow:none;
		transition:.5;				
	}

	.cc-gen-less-firstrow-div-class {
		display:flex;
		font-size:12px;
		position:relative;
		margin-left:1px;
		margin-right:1px;
		justify-content:space-between;	
	}

	.cc-gen-less-edit-div-class {
		display:flex;
		font-size:12px;
		position:relative;		
	}

	.cc-gen-less-editlessonbutton-class {
		border:none;
	}
	
	.cc-lesson-div-class {
		margin-left:3px;
	}

	
	.cc-gen-less-secrow-div-class {
		display:flex;
		font-size:12px;
		position:relative;
	}
	
	.cc-gen-less-list-videoimg-div-class {
		display:block;
		height:90px;
		width:100px;
		margin-top:10px;
	}

	.cc-gen-less-list-videoimg-div-class:hover  {
		height:90px;
		width:160px;		
	}

	/*--Lesson Types Supported---*/
		.cc-gen-less-list-img-class {
			height:80px;
			width:70px;
		}
		
		.cc-gen-less-list-img-class:hover {
			width:160px;
		}
	
		.cc-gen-less-list-iframe-class {
			height:80px;
			width:70px;
		}
		
		.cc-gen-less-list-iframe-class:hover {
			width:160px;
		}
				
		.cc-gen-less-list-video-class {
			height:80px;
			width:70px;
		}
		
		.cc-gen-less-list-video-class:hover {
			width:160px;
		}
	/*--------------------------------*/		
	
	.cc-gen-less-list-text-div-class {
		display:block;
		margin-top:10px;
		margin-left:5px;
		max-height:90px;
		overflow:auto;
	}		

	.cc-gen-less-list-title-class {
		font-size:14px;
		font-weight:bold;
		color:blue;
	}


	.cc-gen-less-thirdrow-div-class {
		display:flex;
		font-size:12px;
		position:relative;
		justify-content:space-between;
	}

	.cc-gen-less-foosplayerid-class {
		padding-top:7px;
	}
	
	.cc-gen-less-tracked-div-class {
		display:flex;
		font-size:12px;
		padding:0;
		padding-top:7px;
		position:relative;	
	}
	
	.cc-gen-less-trackedbutton-class {
		border-radius:15px;
		margin-left:3px;
		height:10px;
		width:10px;	
	}

	.cc-gen-less-loaddefense-div-class {
		display:flex;
		font-size:12px;
		position:relative;			
	}
	
	.cc-gen-less-loadlessonbutton-class {
		font-size:12px;
		margin-right:3px;
		margin-bottom:3px;
		background-color:rgb(204,229,255);
	}
	

/******************************************************************************/
/********** REPSONSIVE SECTION BELOW ******************************************/
/******************************************************************************/

	
@media screen and (min-width: 200px) {
 

}


@media screen and (min-width: 320px) {



}


@media screen and (min-width: 375px) {


}


@media screen and (min-width: 405px) {


}


@media screen and (min-width: 520px) {


}

@media screen and (min-width: 560px) {
	

}