@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
body {
	
	
	font-family: 'Open Sans',"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	
	font-size:13px;
	
	
	color: #383838;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	position:relative;
	background-color:#FFFFFF;
}

h1 {
	font-size:18px;
	font-weight:normal;
	margin: 4px 3px 5px 6px;
	
}

h2 {
	font-size:16px; 
	color:#0066CC;
	margin: 4px 3px 5px 6px;
	font-weight:normal;
}

a:link {
	text-decoration: none;
	color:#C13C3F;
}
a:visited {
	text-decoration: none;
	color:#C13C3F;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}


p {
	line-height: 20px;
	list-style-type: lower-roman;
	margin: 5px 5px 5px 5px;
}



.small {
	font-size: 10px;
	list-style-type: lower-roman;
	margin: 4px 3px 5px 6px;
	line-height: 10px;
}


.small a:link {
	text-decoration: none;
	color: #383838;
}
.small a:visited {
	text-decoration: none;
	color: #383838;
}
.small a:hover {
	text-decoration: underline;
}
.small a:active {
	text-decoration: none;
}


.smallnav {
	font-size: 11px;
	list-style-type: lower-roman;
	margin: 4px 3px 5px 6px;
	line-height: 15px;
}


.smallnav a:link {
	text-decoration: none;
	color: #C13C3F;
}
.smallnav a:visited {
	text-decoration: none;
	color: #C13C3F;
}
.smallnav a:hover {
	text-decoration: underline;
}
.smallnav a:active {
	text-decoration: none;
}


.container {
	max-width:900px; 
	background-color:#FFFFFF;
	margin-left:auto; 
	margin-right:auto;
	padding:5px 5px 5px 5px;
}

.containerLT {
	max-width:880px; 
	background-color:#FFFFFF;
	margin-left:auto; 
	margin-right:auto;
	padding:5px 5px 5px 5px;
	border-left: 0.5px solid #EFEFEF;
	border-right: 0.5px solid #EFEFEF;
}

@media (min-width:901px) {
	.headerContainer {
	
	background-color:#384048; 
	background-image:url(images/headerl.png);
	background-size: 900px 75px;
	background-repeat:no-repeat;
	background-position:center;
	width:100%;
	height:105px;
	
		
		
}
	
}



@media (max-width:900px) {
	.headerContainer {
	width:100%; 
	background-color:#384048; 
	background-image:url(images/headerl.png); 
	background-repeat:no-repeat;
	background-position:center;
	height:75px;
	background-size:contain;
}
	
}

/*navigation*/

.buttonContainer {
	max-width:900px; 
	margin-left:auto; 
	margin-right:auto;
	height:30px;
	background-color:#273036;
}



.buttonContainer ul {

	list-style: none;
	margin: 0; padding: 0;

}



.buttonContainer li {

	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size:medium;
	font-weight:normal;
	color: #FFFFFF;
	line-height: 30px;
	width:170px; 
	height:30px;
	background-color:#273036;
	float:left; 
	vertical-align: middle;
	border-bottom:3px solid #273036;
	text-align:center;
	

}



.buttonContainer li a{
	width:170px; 
	height:30px; 
	text-decoration: none;
	color: #FFFFFF;
	display:block;
	vertical-align: middle;
	border-top:3px solid #273036;
	border-bottom:3px solid #273036;
	
}



.buttonContainer li a:hover{
	width:170px; 
	height:30px; 
	color:#383838;
	background-color: #F7F7F7;
	text-decoration:none;
	vertical-align: middle;
	border-top:3px solid #C13C3F;
	border-bottom:3px solid #F7F7F7;
	
	
}

@media (min-width:901px) {


	#basket_img {
		width: 38px;

	}

	#basket_img a {

		width: 38px;
		background-image: url(images/basket_singlel.png);
		background-repeat: no-repeat;
		background-size: 38px 30px;
	}

	#basket_img a:hover {

		width: 38px;
		background-image: url(images/basket_single_overl.png);
		background-repeat: no-repeat;
		background-size: 38px 30px;
	}



	
}

@media (max-width:900px) {
	
	#basket_img {
		width: 170px;

	}

	#basket_img a {

		width: 170px;
		background-image: url(images/basket_singlel.png);
		background-position: center;
		background-repeat: no-repeat;
		background-size: 38px 30px;
	}

	#basket_img a:hover {

		width: 170px;
		background-image: url(images/basket_single_overl.png);
		background-position: center;
		background-repeat: no-repeat;
		background-size: 38px 30px;
	}
	
	
}

.menu-icon {
		display:none;
		width: 30px;
		height: 30px;
		background: #273036 url(images/menu-iconl.png) center;
	background-size: 30px 30px;
		


}

a:hover#menu-icon {

	background-color: #444;
	

}

/*Hide checkbox*/
.buttonContainer input[type=checkbox]{
    display: none;
}

.buttonContainer input[type=checkbox]:checked ~ #menu{
    display: block;
}





@media only screen and (max-width : 900px) 
{
	.menu-icon {
		display:block;
	}
	
	
	
	
	
	nav ul, nav:active ul { 
		display: none;
		position: absolute;
		background: #fff;
		top: 105px;
		width: 170px;
	}
	

	nav li {

		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;
	}
	
	
	
}






.bgBGContainer {
	width:100%; 
	height:36px; 
	background-color:#273036;
}


@media (min-width:901px) {
.mainImgContainer {
	background-image:url(images/cablel2.png); 
	background-repeat:no-repeat; 
	height:150px;
	background-size:contain;
}

}
@media (max-width:900px) {
	.mainImgContainer {
	background-image:url(images/cablel2.png); 
	background-repeat:no-repeat; 
	height:150px;
	background-size:contain;
		
}
	
}



@media (min-width:901px) {
	.socialContainer {
	width:100%; 
	background-color:#384048; 
	background-repeat:no-repeat;
	background-position:center;
	height:35px;
}

.socialmenucontainer {
	max-width:900px;
	height:35px;
	margin-left:auto; 
	margin-right:auto;
}
	.socialmenuitem {
	width:35px;
	height:35px;
	text-align:center;
	float:right;
}
	
}



@media (max-width:900px) {
	.socialContainer {
	width:100%; 
	background-color:#384048; 
	background-repeat:no-repeat;
	background-position:center;
	height:35px;
	background-size:contain;
}

.socialmenucontainer {
	max-width:900px;
	height:35px;
	margin-left:auto; 
	margin-right:auto;
}
	.socialmenuitem {
	width:34px;
	height:35px;
	text-align:center;
	float:right;
}
	
}



@media (min-width:901px) {
	
	.bottommenu {
	background-color:#F7F7F7; 
	height:55px;
	position:fixed;
	bottom:0;
	left:0; 
	width:100%;
	z-index:3;
	text-align:center;
}
	
.bottommenucontainer {
	max-width:900px;
	height:20px;
	margin-left:auto; 
	margin-right:auto;
}

.bottommenuitem {
	width:300px;
	height:20px;
	text-align:center;
	float:left;
}

}

@media (max-width:900px) {
	
	.bottommenu {
	background-color:#F7F7F7; 
	height:75px;
	position:fixed;
	bottom:0;
	left:0; 
	width:100%;
	z-index:3;
	text-align:center;
}
	.bottommenucontainer {
	max-width:900px;
	height:40px;
	margin-left:auto; 
	margin-right:auto;
}
	.bottommenuitem {
	width:33%;
	height:40px;
	text-align:center;
	float:left;
}

}

@media (min-width:901px) {
.thirdpage_box {
	width:300px; 
	float:left;
}
	
.halfpage_box {
	width:439px; 
	float:left;

}

.twothirdpage_box {
	width:590px; 
	float:left;
}
}

@media (max-width:900px) {
.thirdpage_box {
	width:100%; 
	
}
	
.halfpage_box {
	width:100%;

}

.twothirdpage_box {
	width:100%; 
	
}
}


@media (min-width:901px) {
.thirdpage_box_offer {
	width:200px; 
	float:left;
	height: 500px;
	background-image: url(images/mobiletower.png); 
	background-repeat: no-repeat;
}

.twothirdpage_box_offer {
	width:690px; 
	float:left;
	min-height: 500px;
}
}

@media (max-width:900px) {
.thirdpage_box_offer{
	width:100%;
	
}

.twothirdpage_box_offer {
	width:100%;
	
}
}


.whText {
	color:#FFFFFF;	
}

/* HOME PAGE*/

@media (min-width:901px) {

.customCourse {
	width:500px;  
	padding-left:10px; 
	float:left; 
	border-right:1px dotted #333;	
}

.newsMenu {
	width:350px; 
	padding-left:10px; 
	float:left;
}

.featCourseBoxGrL {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	border-right: 1px dotted #333; 
	background-color: #FCFCFC;
	border-bottom: 1px dotted #333;
}
	

.featCourseBoxGrR {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	background-color: #FCFCFC;
	border-bottom: 1px dotted #333;
}

.featCourseBoxBl {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	border-right: 1px dotted #333; 
	background-color: #F4F6FB;
	border-bottom: 1px dotted #333;
}
	
.featCourseBoxGrLB {
	width: 279px; 
	height: 280px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	border-right: 1px dotted #333; 
	background-color: #FCFCFC;
	
}
	

.featCourseBoxGrRB {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	background-color: #FCFCFC;
	
}

.featCourseBoxBlB {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	border-right: 1px dotted #333; 
	background-color: #F4F6FB;
	
}
	
	
.featCourseBoxBlBR {
	width: 279px; 
	height: 290px; 
	padding-left: 10px; 
	padding-right: 10px; 
	float: left; 
	background-color: #F4F6FB;
	
}
	
	
}

@media (max-width:900px) {
	.featCourseBoxGrL {
	width: 100%; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px; 
	background-color: #FCFCFC;	
}

.featCourseBoxGrR {
	width: 100%; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px;
	background-color: #FCFCFC;	
}

.featCourseBoxBl {
	width: 100%;  
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px;
	background-color: #F4F6FB;
}
	
	.featCourseBoxGrLB {
	width: 100%; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px; 
	background-color: #FCFCFC;	
}

.featCourseBoxGrRB {
	width: 100%; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px;
	background-color: #FCFCFC;	
}

.featCourseBoxBlB {
	width: 100%;  
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px;
	background-color: #F4F6FB;
}
	
.featCourseBoxBlBR {
	width: 100%;  
	padding-left: 10px; 
	padding-right: 10px; 
	padding-bottom: 20px;
	background-color: #F4F6FB;
}

.customCourse {
	width:100%;  
	padding-left:10px; 
	padding-bottom: 20px;
	float:left; 
	background-color: #FCFCFC;	
}

.newsMenu {
	width:100%; 
	padding-left:10px; 
	float:left;
}
	
}

.catLink {
	max-width:900px; 
	border-bottom:1px dotted #333	;
	text-align:right;
}

/*learntelecoms.html*/

.learntelecomsLogo {
	background-image:url(images/learnTelecomsLogol.png); 
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:45px;	
	background-size: contain;
}

@media (min-width:901px) {
.LTImgContainer {
	background-image:url(images/cablesLT.png); 
	background-repeat:no-repeat; 
	background-position: right;
	height:200px;
}

}
@media (max-width:900px) {
	.LTImgContainer {
	background-image:url(images/cablesLT.png); 
	background-repeat:no-repeat;
	background-position: right;
	height:200px;
	background-size:contain;
}
	
}

@media (min-width:901px) {

.LTcontainerBox2 {
	width:279px;  
	float: left; 
	padding-right: 0px;
	padding-left: 0px;
}
	
	
}

@media (max-width:900px) {

.LTcontainerBox2 {
	width:92%;  
	
	margin:0;
}
	
}

@media (min-width:901px) {

.LTcontainerBox {
	width:279px;  
	float: left; 
	padding-right: 10px;
	padding-left: 10px;
}

.LTboxHeader {
	width: 279px; 
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
}
	

	
	
	
.LTboxHeaderA {
	width: 419px; 
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
}
	
.LTboxHeaderLTb {
	width: 277px; 
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
}

.LTboxHeaderC {
	width: 279px; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px; 
	border-left:1px dotted #FFFFFF; 
	border-right:1px dotted #FFFFFF; 
	float: left;
	text-align:center;
}
	
.LTboxHeaderD {
	width: 419px; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px; 
	border-left:1px dotted #FFFFFF; 

	float: left;
	text-align:center;
}

.LTBox {
	width:279px;  
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
}
	
.HalfPgHeader {
	width: 418px; 
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
	border-left:1px dotted #333;
	border-right:1px dotted #333; 
}
	
.HalfPgHeaderB {
	width: 418px; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
	border-left:1px dotted #333;
	border-right:1px dotted #333; 
}
	
.HalfPgContent {
	width:418px;  
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
	height: 300px;
	border-left:1px dotted #333;
	border-right:1px dotted #333;
	border-bottom:1px dotted #333; 

}
	
.FullPgHeader {
	width: 858px; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px;  
	float: left;
	text-align:center;
	border-left:1px dotted #333;
	border-right:1px dotted #333; 
	 
}
	
.FullPgContent {
	width:858px;  
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
	height: 300px;
	border-left:1px dotted #333;
	border-right:1px dotted #333;

}

	
.LTBoxA {
	width:419px;  
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
}

.LTBoxC {
	width:279px; 
	background-color: #FCFCFC; 
	border-left:1px dotted #333;
	border-right:1px dotted #333; 
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
}
	
.LTBoxD {
	width:419px; 
	background-color: #FCFCFC; 
	border-left:1px dotted #333;
	
	padding-left: 10px; 
	padding-right: 10px;  
	float:left;
}
	
.LTcatButton {
	margin-left:auto; 
	margin-right:auto;
	padding:5px 5px 5px 5px;
	border: 1px solid #AEAEAE;
	width: 350px;
	height: 55px;
	text-align: center;
	line-height: 45px;
		
	}


}

@media (max-width:900px) {

.LTcontainerBox {
	width:92%;  
	
	margin:0;
}

.LTboxHeader {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}

	
	
.LTboxHeaderA {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}
	
.LTboxHeaderLTb {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}

.LTboxHeaderC {
	width: 100%; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px; 
	text-align:center;
}
	
.LTboxHeaderD {
	width: 100%; 
	height: 30px; 
	background-color: #384048; 
	padding-left: 10px; 
	padding-right: 10px; 
	text-align:center;
}

.LTBox {
	width:100%;  
	padding-left: 10px; 
	padding-right: 10px;  
}
	
.LTBoxA {
	width:100%;  
	padding-left: 10px; 
	padding-right: 10px;  
}
	
.HalfPgHeader {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}
	
.HalfPgHeaderB {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}
	
	.HalfPgContent {
	width:100%;  
	padding-left: 10px; 
	padding-right: 10px;
		
}
	
	.FullPgHeader {
	width:100%;  
	height: 30px; 
	background-color: #5F6D7B; 
	padding-left: 10px; 
	padding-right: 10px;  
	text-align:center;
}
	
	.FullPgContent {
	width:100%;  
	padding-left: 10px; 
	padding-right: 10px;
		
}

.LTBoxC {
	width:100%; 
	padding-left: 10px; 
	padding-right: 10px;  
}
	
.LTBoxD {
	width:100%; 
	padding-left: 10px; 
	padding-right: 10px;  
}
	
.LTcatButton {
	
	padding:5px 5px 5px 5px;
	border: 1px solid #AEAEAE;
	width: 96%;
	height: 55px;
	text-align: center;
	line-height: 45px;
		
	}

}

/*CATALOGUE PAGE */

.flagStyle {
	visibility:hidden;
	position:fixed;
	width:400px;
	height:350px;
	z-index:1001;
	background-color: #FFFFFF;
	border: 1px solid #A6A6A6;
	overflow: auto;
	top: 50%; 
	left: 50%; 
	margin-top: -150px; 
	margin-left: -200px;
	
}

.transtyle {
	visibility: hidden;
    position:fixed;
    left:0px;
    top:0px;
	width:100%;
	height:100%;
	z-index:1000;

    background-image:url(images/semitran.png);
    /* ieWin only stuff */
        /* with this trick only IE
           manage the following 2 attributes */
    _background-image:none;
    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
        (enabled=true, sizingMethod=scale src='images/semitran.png');
}

a.fill-div {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
	color: #383838;
}

a.fill-div:link {
 	text-decoration: none;
	color: #383838;
}


.flex-container {
  /* We first create a flex layout context */
  display: flex;
  
  /* Then we define the flow direction 
     and if we allow the items to wrap 
   * Remember this is the same as:
   * flex-direction: row;
   * flex-wrap: wrap;
   */
  flex-flow: row;
	
  
  /* Then we define how is distributed the remaining space */
  justify-content: space-around;
  
  padding: 0;
  margin: 0;
  list-style: none;
}


.catalogue_ind_courses {
	color:#000000;
	
}




.flex-container-course{
  
	padding: 0;
  margin: 0;
	list-style: none;
	 display: grid;
  grid-template-columns: repeat(auto-fill, 260px);
  justify-content:center;
	grid-gap: 20px;
  
}


.wrap    { 

}  


.flex-item-whitebg {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #FFFFFF;
  

}

.flex-item-bluebg {
  padding: 5px;
  
  height: 210px;
  margin: 5px;
  border: 1px solid #000000;
  background-color:  #F4F6FB;
  
}


/*Catalogue box colour categories*/

.flex-item-intro {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #BEB4D9;
  
}

.flex-item-intro:hover {
	
	background-color: #CAC1E0;
}
.catintroBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #E6E3F1;	
}

.catCourseintroBG {
	display:none; 
	padding-left:15px; 
	background-color: #E6E3F1;	
}

.flex-item-fund {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #BFDB78;
  
}

.flex-item-fund:hover {
	
	background-color: #CFE49B;
}

.catfundBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #dee7ba;	
}

.catCoursefundBG {
	display:none; 
	padding-left:15px; 
	background-color: #dee7ba;	
}


.flex-item-sec {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #f0eae2;
  
}

.flex-item-sec:hover {
	
	background-color: #F7F4F0;
}

.catsecBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #f9f7f5;	
}

.catCoursesecBG {
	display:none; 
	padding-left:15px; 
	background-color: #f9f7f5;	
}


.flex-item-bb {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #8dc7e0;
  
}

.flex-item-bb:hover {
	
	background-color: #ABD6E8;
}

.catbbBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #e0ecf5;	
}

.catCoursebbBG {
	display:none; 
	padding-left:15px; 
	background-color: #e0ecf5;	
}

.flex-item-vv {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #fae484;
  
}

.flex-item-vv:hover {
	
	background-color: #FBECAB;
}

.catvvBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #fcf6da;	
}

.catCoursevvBG {
	display:none; 
	padding-left:15px; 
	background-color: #fcf6da;	
}


.flex-item-cn {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #92BBBA;
  
}

.flex-item-cn:hover {
	
	background-color: #B3CFCF;
}

.catcnBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #dee9e8;	
}

.catCoursecnBG {
	display:none; 
	padding-left:15px; 
	background-color: #dee9e8;	
}

.flex-item-wan {
  padding: 0px;
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #EF8155;
	
  
}


.flex-item-wan:hover {
	
	background-color: #F19571;
}

.catwanBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #f8c8b5;	
}

.catCoursewanBG {
	display:none; 
	padding-left:15px; 
	background-color: #f8c8b5;	
}

.flex-item-mob {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #58B6E5;
  
}

.flex-item-mob:hover {
	
	background-color: #9BD3EF;
}

.catmobBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #bfe3f5;	
}

.catCoursemobBG {
	display:none; 
	padding-left:15px; 
	background-color: #bfe3f5;	
}


.flex-item-opt {
  padding: 0px;
 
  height: 340px;
  margin: 0px;
  border: 1px solid #000000;
  background-color: #b7cd00;
  
}

.flex-item-opt:hover {
	
	background-color: #E7FF26;
}

.catoptBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #e7eeab;	
}

.catCourseoptBG {
	display:none; 
	padding-left:15px; 
	background-color: #e7eeab;	
}


/*Catalogue box contents*/

.flex-container-content {
	display: flex;
	flex-direction: column;
	list-style: none;
	padding: 0px;
  	margin: 0px;
	
	
	
}

.flex-container-content p{
	color: #000000;
	
}


.flex-content-course_title
{
	height: 60px;
	text-align:center;
	display: flex;
  justify-content: center;
  align-items: center;
	font-size:14px;
	font-weight: bold;
	
	
}


.flex-content-course_img
{
	height: 100px;
	background-size: contain; 
	background-repeat: no-repeat; 
	background-position: bottom;
	
	
}

.flex-content-course
{
	height: 150px;
	text-align:left;
	display: flex;
   justify-content: left;
   align-items: center;
	
}




.flex-content-level-code
{
	margin-left: 5px;
	margin-right: 5px;
	height: 20px;
}

.catTitle {
	
	margin:0px;
	padding: 5px;
}

.catTitle p{
	color: #000000;
	
}

.courseCode {
	float: right;
	
}

.courseLevel {
	float: left;
	
}


.flex-L3A-logo {
	
	min-width: 100px; 
	height: 80px; 
	background-image: url('images/L3Alogo.png'); 
	background-size: 75px 75px; 
	background-repeat: no-repeat; 
	background-position: center
}

.flex-L3C-logo {
	
	min-width: 100px; 
	height: 80px; 
	background-image: url('images/L3Clogo.png'); 
	background-size: 75px 75px; 
	background-repeat: no-repeat; 
	background-position: center
}

.flex-qual-desc {
	
}

.flex-qual-desc a
{
	font-size:14px; 
}

.flex-hex {
	
	min-width: 100px; 
	height: 80px; 
	background-image: url('images/emptyhex.png.png'); 
	background-size: 75px 75px; 
	background-repeat: no-repeat; 
	background-position: center
}


.catGrBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px;
	background-color: #FCFCFC;	
}

.catCourseGrBG {
	display:none; 
	padding-left:15px; 
	background-color: #FAFAFA;	
}

.catBlBG {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px; 
	background-color: #F4F6FB;	
}

.catCourseBlBG {
	display:none; 
	padding-left:15px; 
	background-color: #F4F6FB;	
}


.catAdWPageGr {
	
	padding-left:15px; 
	background-color: #FAFAFA;
	float: left;
}

.catAdWPageBl {
	
	padding-left:15px; 
	background-color: #F4F6FB;	
	float: left;
}


.catExpand {
	float:right; 
	padding-right:20px;
	
	
}

.catQual {
	border:1px solid #383838; 
	padding:3px 3px 3px 3px;	
}

.catQualDesc {
	padding-left:15px; 
	background-color:#FAFAFA;	
}

/* COURSE PAGE */

.purchaseTitle
{
	line-height: 30px;
	list-style-type: lower-roman;
	margin-left: 5px;
	color: #FFFFFF;
	margin-top: 0px;
	margin-bottom: 0px;
	
}

.relatedBox
{
	width: 95%; 
	padding: 5px 5px 5px 5px; 
	border: 1px dotted #333333;
}

.cardbox {
	height: 20px;
	background-image: url("images/cards.png");
	background-position: center;
	background-repeat: no-repeat;
	padding: 5px;
	background-size: 200px 16px;
	
}

.cardbox2 {
	height: 50px;
	background-image: url("images/cards2.png");
	background-position: center;
	background-repeat: no-repeat;
	padding: 5px;
	background-size: 200px 35px;
	
}


@media (min-width:901px) {

.purchaseHeader {
	width: 100%; 
	height: 30px; 
	background-color: #384048; 
	
	margin-left:auto; 
	margin-right:auto;
	border-left:1px dotted #FFFFFF; 
	border-right:1px dotted #FFFFFF;
}

.purchaseContent {

	width: 600px; 
	padding-left: 10px; 
	padding-right: 10px;
	margin-left:auto; 
	margin-right:auto;
	border-left:1px dotted #333333; 
	border-right:1px dotted #333333; 
	border-bottom:1px dotted #333333;
}

.purchaseContentL {
	width: 340px; 
	border-right:1px dotted #333333;
	padding-right:10px;
	float:left;
}

.purchaseContentR {
	float:left;
	padding-left:10px;
	width: 230px; 
}

.purchaseContentApp {
	width: 580px; 
	border-right:1px dotted #333333;
	padding-right:10px;
	float:left;
}

}

@media (max-width:900px) {
	.purchaseHeader {
	width: 100%; 
	height: 30px; 
	background-color: #384048; 
	
	border-left:1px dotted #FFFFFF; 
	border-right:1px dotted #FFFFFF;
}

.purchaseContent {

	width: 95%; 
	
	border-left:1px dotted #333333; 
	border-right:1px dotted #333333; 
	border-bottom:1px dotted #333333;
}

.purchaseContentL {
	width: 95%; 
	border-bottom:1px dotted #333333;
	padding-bottom:10px;
	
}

.purchaseContentR {
	width: 95%; 
}

.purchaseContentApp {
	width: 95%; 
	padding-right:10px;
}
	
}


/*e-learning */

.elearnImg {
	background-image:url(images/courses.png);
	background-position:center;
	background-repeat:no-repeat;
	width:280px;
	height:130px;	
}

/*apprentice*/

.apprenticeImg {
	background-image:url(images/apprentice.gif);
	background-position:center;
	background-repeat:no-repeat;
	width:294px;
	height:500px;	
}

.cablesImg {
	background-image:url(images/cables.png);
	background-position:center;
	background-repeat:no-repeat;
	background-size: contain;
	width:294px;
	height:500px;
}

/*apprentice*/

.blendedWPImg {
	background-image:url(images/blended.png);
	background-position:center;
	background-repeat:no-repeat;
	height:500px;
	width:294px;
}

/*client logo*/

.clientLogo {
	background-repeat:no-repeat;
	background-position:center top;
	width:300px; 
	height:110px;	
}

.clientText {
	min-height:110px;
}

/*approach*/

.approachImg {
	background-image:url(images/approachImage.jpg); 
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:250px;	
}

.appG2logo {
	background-image:url(images/GEANT2Logo.jpg);
	background-repeat:no-repeat;
	background-position:right;
	width:100%; 
	height:75px;	
}


/*tna*/

.tnaImg {
	background-image:url(images/aboutMan.jpg); 
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:250px;	
}

/*blended*/

.blendedImg {
	background-image:url(images/blendedLearningImage.jpg); 
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:300px;	
}

/*dyskans*/

.dyskansImg {
	background-image:url(images/dyskansLogo.gif);
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:200px;	
}

/*contact*/

.contactImg {
	background-image:url(images/contact3.png);
	background-size: contain;
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:400px;
}


/*demo*/

.demoLevel {
	width:60px; 
	float:left;
	
}

.demoLevelText {
	width:600px; 
	float:left;
}


.demoModules {
	width:800px; 
	border:1px solid #383838; 
	padding:5px 5px 5px 5px; 
	margin-left:20px;
}


/*el_sample*/

.geantImg {
	background-image:url(images/GEANT2.jpg);
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:200px;	
}

/*tel_diploma*/

.awardLogo {
	height:70px;
	background-image:url(images/award.gif);
	background-repeat:no-repeat;
	
}

/*about*/
.PTTlogo {
	
	background-image:url(images/PTTlogo.png);
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:200px;
	background-size: contain;
}



.PTTscreen {
	background-image:url(images/PTTscreenl2.png);
	background-repeat:no-repeat;
	background-position:center;
	width:250px; 
	height:200px;
	background-size: contain;
}


/*apprentice page 2024*/


.flex-container-course-appr{
 
	padding: 0;
  margin: 0;
	list-style: none;
	 display: grid;
  grid-template-columns: repeat(auto-fill, 350px);
  justify-content:center;
	grid-gap: 20px;
  
}


.flex-item-grbg-appr {
  padding: 0px;
 
  height: 350px;
  margin: 5px;
  border: 1px solid #000000;
  background-color: #add296;
  
}

.flex-item-bluebg-appr {
  padding: 0px;
  
  height: 350px;
  margin: 5px;
  border: 1px solid #000000;
  background-color:  #abcfeb;
  
}

.flex-item-yellbg-appr {
  padding: 0px;
  
  height: 350px;
  margin: 5px;
  border: 1px solid #000000;
  background-color:  #fae484;
  
}

.flex-item-purbg-appr {
  padding: 0px;
  
  height: 350px;
  margin: 5px;
  border: 1px solid #000000;
  background-color:  #aca0c0;
  
}

.flex-container-content-appr {
	display: flex;
	flex-direction: column;
	list-style: none;
	padding: 0;
  	margin: 0;
	
	
}

.flex-content-course-appr
{
	height: 100px;
	padding-left: 5px;
	padding-right: 5px;
}

.flex-content-course-appr a
{
	font-size:14px; 
}

.flex-content-course-appr h2 a
{
	font-size:14px;
	color: #383838;
	font-weight: bold;
}

.flex-content-course-appr h2 a:hover
{
	font-size:14px;
	color: #C13C3F;
	text-decoration: underline;
}

.flex-content-img1-appr
{
	background-image: url("images/tfoimg.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	height: 200px;	
}

.flex-content-img2-appr
{
	background-image: url("images/ict2img.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	height: 200px;	
}

.flex-content-img3-appr
{
	background-image: url("images/ict3img.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	height: 200px;	
}

.flex-content-img4-appr
{
	background-image: url("images/neimg.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	height: 200px;	
}



.flex-content-link-appr1
{
	text-align:right;
	padding-right: 5px;
	height: 50px;
	background-color: #283583;
	line-height: 50px;
}

.flex-content-link-appr2
{
	text-align:right;
	padding-right: 5px;
	height: 50px;
	background-color: #27724f;
	line-height: 50px;
}

.flex-content-link-appr3
{
	text-align:right;
	padding-right: 5px;
	height: 50px;
	background-color: #f3c51e;
	line-height: 50px;
}

.flex-content-link-appr4
{
	text-align:right;
	padding-right: 5px;
	height: 50px;
	background-color: #7f3d79;
	line-height: 50px;
}

.flex-content-link-appr1 a
{
	color: #FFFFFF;
	
}

.flex-content-link-appr2 a
{
	color: #FFFFFF;
	
}

.flex-content-link-appr3 a
{
	color: #383838;
	
}

.flex-content-link-appr4 a
{
	color: #FFFFFF;
	
}

.mappingtable_bl
{
	width: 50%;
	background-color: #abcfeb;
	
	float: left;
	
}

.mappingtable_gr
{
	width: 50%;
	background-color: #add296;
	
	float: left;
	
}

.mappingtable_ye
{
	width: 50%;
	background-color: #fae484;
	
	float: left;
	
}

.mappingtable_pu
{
	width: 50%;
	background-color: #aca0c0;
	
	float: left;
	
}

.mappingtable_wh
{
	width: 50%;
	background-color: #FFFFFF;
	border-top: 1px solid #383838;
	float: left;
	
}



.mappingtable_container
{
	border: 1px solid #383838;
	width: 90%
	
}

@media (min-width:901px) {

.apprenticepage_img 
{
	background-image: url('images/appinfo.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 350px; 
	background-position: center bottom;
	margin: 10px;
	
}
	
.tfoheader
{
	background-image: url('images/tfoheader.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 450px; 
	background-position: center bottom;
	margin: 10px;
	
}

.ict2header
{
	background-image: url('images/ict2header.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 450px; 
	background-position: center bottom;
	margin: 10px;
	
}

.ict3header
{
	background-image: url('images/ict3header.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 450px; 
	background-position: center bottom;
	margin: 10px;
	
}

.neheader
{
	background-image: url('images/neheader.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 450px; 
	background-position: center bottom;

	
}

}

@media (max-width:900px) {
.apprenticepage_img 
{
	background-image: url('images/appinfo.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 350px; 
	background-position: center bottom;

	
}
	
.tfoheader
{
	background-image: url('images/tfoheader.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 300px; 
	background-position: center bottom;

	
}

.ict2header
{
	background-image: url('images/ict2header.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 300px; 
	background-position: center bottom;

	
}

.ict3header
{
	background-image: url('images/ict3header.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 300px; 
	background-position: center bottom;
	
	
}

.neheader
{
	background-image: url('images/neheader.png'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	height: 300px; 
	background-position: center bottom;

	
}
	
}

.courseTitleTop
{
		background-color: #384048;
		
}

.courseTitleTop h1
{
	color: #FFFFFF;
	padding: 5px;
	margin: 0;
	
}

.courseTitleBottom
{

	background-color: #273036
	
}

.courseTitleBottom p
{

	color: #FFFFFF;
	padding: 5px;
	margin: 0;
	
}

.courseTitleBottom p a
{

	color: #FFFFFF;
	text-decoration: underline;
	
}




@media (min-width:901px) {
	.courseTitleContainer
	{
	width: 580px; 
	
	}
	
	.courseTitleImg
	{
		height: 200px; 
		background-size: contain; 
		background-repeat: no-repeat; 
		background-position: bottom; 
		background-color: #384048;
		
	}
	
}


@media (max-width:900px) {
	.courseTitleContainer
	{
	width: 350px;
	margin: auto;
	}
	
	.courseTitleImg
	{
		height: 140px;
		background-size: contain; 
		background-repeat: no-repeat; 
		background-position: bottom; 
		background-color: #384048;
		
	}
}


.courseTitleContainerSM
	{
	width: 350px;
	margin: auto;
	height: 350px;
	background-color: #273036;
	}
	
	.courseTitleImgSM
	{
		height: 140px;
		background-size: contain; 
		background-repeat: no-repeat; 
		background-position: bottom; 
		background-color: #384048;
		
	}


section {
  
}

#checkout {
  width: 100vw;
}
.hidden {
  display: none;
}