@font-face{
	font-family: 'Roboto';
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/roboto-regular-webfont.eot');
	src: url('../fonts/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto-regular-webfont.woff2') format('woff2'),
         url('../fonts/roboto-regular-webfont.woff') format('woff'),
         url('../fonts/roboto-regular-webfont.ttf') format('truetype'), 
}
:root {
  color-scheme: dark;
}
*{
	font-size: 13px;
	font-family: "Roboto", helvetica, arial;
	text-decoration: none;
	color:#ffffff;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	transition: font-size 0.5s;
}
body{
	display: block;
	background-color: #303030;
}
h1, h1 *{
	font-size: 2rem;
}
h2, h2 *{
	font-size: 1.5rem;
}
h3, h3 *{
	font-size: 1.3rem;
}
h4, h4 *{
	font-size: 1.2rem;
}
/*INPC Litl Tab*/
.inpcLitlTab{
	font-family: arial;
	width: 100%;
}
.inpcLitlTab th{
		text-align: center;
	font-size: 13px;
	background-color: #05558c;
	color: #ffffff;
	font-weight: bold;
}
.inpcLitlTab td{
	text-align: left;
	color: #000000;
	font-weight: normal;
}
.inpcLitlTab td:nth-child(n+2){
	text-align: right;
	color: #000000;
	font-weight: bold;
}
/*--------------*/
/*INPC TABLE*/
.inpcTable{
	display: inline-block;
	width: 100%;
	color: #ffffff;
}
.tbleRow{
	position: relative;
	width: 100%;
}
.tbleRow div{
	display: inline-block;
	text-align: center;
	width: 7.690%;
	padding: 5px 0;
	background-color: #202020;
	/*margin: 0 0 0 -5px;*/
	border: 1px solid #ffffff;
	float: left;
}
.tableHead div{
	background-color: #006bbd;
	font-weight: bold;
}
.upInWrap{
	position: absolute;
    top: -10%;
    left: 44%;
    padding: 0.5rem;
    max-height: 120px;
	min-height: 80px;
    background-color: #505050;
    border: 1px solid;
    border-radius: 5px;
    box-shadow: -3px 4px 3px rgba(0, 0, 0, 1);
    z-index: 2;
}
/*-----------*/
/*Loading screen*/
.loadWrapp{
	display: none;
	width: 100vw;
	height: 100vh;
	position: fixed;
	background-color: rgba(0,0,0,0.7
);
	z-index: 102;
}
.loadWrapp .loadCenter{
	position: absolute;
	text-align: center;
	display: inline-block;
	max-width: 200px;
	max-height: 0;
	background-color: rgba(255, 255, 255, 0.5);
	left: 0;
	right: 0;
	top:0;
	bottom: 0;
	margin: auto;
}
.loadingImg{
	display: block;
	margin: 0 auto;
}
/*END Loading screen*/
.insetList{
	list-style-position: inside;
	padding:0.5rem;
}
.clearFix:before, .clearFix:after {
    content: "";
    display: block;
    clear: both;
}
.paddingSec{
	padding: 116px 5rem 1rem 5rem;
}
.paddingSec.short{
	padding: 2rem 5rem 1rem 5rem;	
}
.moreBtn, .btnStandar{
	display: inline-block;
	padding: 10px 1rem;
	color: #ffffff;
	background-color: #ff8203;
	border-radius: 5px; 
}
.btnCont{
	text-align: center;
	padding: 1rem 1rem;
}
.inline{
	display: inline-block;
}
/*Scroll Nav*/
.scrollMenuContainer{
	position: fixed;
	top: -100px;
	left: 0;
	opacity: 0;
	display: block;
	width:100%;
	min-width: 300px;
	height: 100px;
	padding: 1rem;
	background: linear-gradient(to right, #909090 10%, #303030 30%);
	box-shadow: 0 5px 15px 0 #101010;
	z-index: 101;
	transition: opacity 1s, top 0.5s;
}
.appearScrollNav{
	top: 0;
	opacity: 1;
}
/*Static Nav*/

.staticMenuContainer{
	position: relative;
	display: block;
	width: 100%;
	min-width: 300px;
	padding: 1rem;
	height: 100px;
	background: linear-gradient(to right, #909090 10%, #303030 30%);
	box-shadow: 0 5px 15px 0 #101010;
	z-index: 101;
}
.logo{
	display: inline-block;
	vertical-align: top;
	height: 100%;
}
.logo img{
	display: block;
	height: 100%;
	width: auto;
}
.menu{
	display: inline-block;
	float: right;
	vertical-align: top;
	height: 100%;
}
.menu ul{
	display: block;
	list-style-type: none;
	height: 100%;
}
.menuOpt{
	display: inline-block;
	float: left;
	position: relative; 
	height: 100%;
}
.menuOpt .optLink{
	display: block;
	padding: 0 1rem;
	line-height: 72px;
	text-align: center;
	height: 100%;
	cursor: pointer;
	color:#505050;
	transition: background-color 0.5s, color 0.5s;
}
.menuOpt:hover .optLink{
	background-color: #afafaf;
	color: #ffffff;
}
.menuOpt .subMenu{
	position: absolute;
	top: 100%;
	width: 150%;
	min-height: 0;
	max-height: 0;
	overflow:hidden;
	background-color: rgba(0,0,0,0.7);
	transition: max-height 0.5s, min-height 0.5s;
	z-index: 103;
}
.menuOpt:hover .subMenu{
	min-height: 140px;
	max-height: 200px;
}
.subOpt{
	position: relative;
	display: block;
}
.subOpt:hover{
	background-color: #063c5f;
}
.subOpt a{
	display: block;
	height: 35px;
	padding: 0 0 0 1rem;
	text-align: left;
	line-height: 35px;
	color: #ffffff;
}
.mobileMenuBtn{
	position: absolute;
	display: none;
	top: 2.5rem;
	right: 1rem;
	width: 40px;
	height: 40px;
	border: solid 2px #505050;
	background-color: #ffffff;
	color: #505050;
	text-align: center;
	border-radius: 10px;
	cursor: pointer;
	z-index: 103;
}
.mobileMenuIcon{
	font-size: 28px !important;
	line-height: 125% !important;
}
.mobileMenu{
	position: absolute;
	width: 100%;
	top:100%;
	left: -100%;
	opacity: 0;
	background-color: rgba(0,0,0,0.7);	
	transition: left 0.5s, opacity 0.5s;
	z-index: 104;
}
.showMobileMenu{
	left: 0%;
	opacity: 1;
}
.mobileMenu ul{
	list-style-type: none;
}
.mobileOpt .mobileOptLink{
	display: block;
	width: 100%;
	padding: 0.5rem 1rem;
	color: #ffffff;
	cursor: pointer;
}
.mobileOpt:hover .mobileOptLink{
	background-color: #063c5f;
}
.mobileSubMenu{
	background-color: rgba(255,255,255,0.3);
	min-height: 0;
	max-height: 0;
	overflow:hidden;
	transition: min-height 0.5s, max-height 0.5s;
}
.mobileOpt:hover .mobileSubMenu{
	min-height: 93px;
	max-height: 150px;
}
.mobileSubOpt a{
	display: block;
	width: 100%;
	padding: 0.5rem 0.5rem 0.5rem 3rem;
	color: #202020;
}
.mobileSubOpt:hover a{
	background-color: #0672b7;
	color: #ffffff;
}
/*Advice dialogue globe*/
.advice{
	position: relative;
	max-width: 150px;
	background-color: #006BBD;
	padding: 1rem;
	border-radius: 20px;
	bottom: -20%;
	right: 25%;

}
.globeArrow{
	position: absolute;
	display:block;
	background-color: #006BBD;
	width: 20px;
	height: 20px;
	top:-8px;
	right: 1.5rem;
	transform: rotate(45deg);
}
.close{
	display: inline-block;
	position: absolute;
	bottom: 1rem;
	right: 1rem;
	font-weight: bolder;
	line-height: 1.3rem;
	background-color: #ff0000;
	color: #ffffff;
	text-align: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	cursor:pointer;
}

/*mini contact info*/
.contact{
	text-align: right;
	background-color: #006BBD;
	padding: 1rem 2rem;
}
.contact .contactLink{
	display: inline-block;
	margin: 0 0 0 1em;
	color:#ffffff;
}
.contact .contactLink:first-child{
	margin:0;
}
.sectionTitle{
	color: #ff8203;
	margin:0 0 1rem 0;
}
/*Rtransmitions section*/

/*Retransmitions LogIn*/

.logBack{
	background-image: url(../img/logBack.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.newUser{
	position: absolute;
	top: 1rem;
	right: 0.5rem;
	display: inline-block;
	padding: 1rem;
	color: #ffffff;
	font-weight: bold;
}
.returnAcademo{
	position: absolute;
	top: 1rem;
	left: 0.5rem;
	display: inline-block;
	padding: 1rem;
	color: #ffffff;
	font-weight: bold;
}
.returnIndexIcon{
	font-size: 2.5rem;
	color: #ffffff;
}
.returnAcademo:hover{
	color: #ff8203;
}
.returnAcademo:hover .returnIndexIcon{
	color: #ff8203;
}
.newUserIcon{
	font-size: 2.5rem;
	color: #ffffff;
}
.newUser:hover{
	color: #20ff30;
}
.newUser:hover .newUserIcon{
	color: #20ff30;
}
.clientLog{
	position: relative;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0,0,0,0.5);
}
.logWrapper{
	position: absolute;
	padding:1rem;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 100%;
	max-width: 450px;
	min-width: 280px;
	height: 320px;
	background-color: #505050;
	border-radius: 15px;
	box-shadow: 0 0 15px 0 #000000;
}
.logLogo{
	width: 100px;
	height: auto;
	display: block;
	margin: 0 auto;
}
.logForm .logFormTitle{
	text-align: center;
}
.logForm input[type="mail"], .logForm input[type="password"], .logForm input[type="text"]{
	width: 100%;
	padding: 4px;
	margin: 5px 0px;
	font-size: 1rem;
	border:none;
	background-color: #303030;
	color: #ffffff;
	border-bottom: solid 1px #afafaf;
	outline: none;
	transition: 0.5s;
}
.logForm input[type="mail"]:focus, .logForm input[type="password"]:focus, .logForm input[type="text"]:focus{
	border-bottom: solid 2px #606060;
	font-size: 1.3rem;
}
.logButtons{
	text-align: center;
}
.logForm .submitLogBtn{
	display: inline-block;
	width: 100%;
	max-width: 150px;
	padding: 0.5rem;
	margin: 3px;
	border:none;
	border-radius: 5px;
	background-color: #006BBD;
	color: #ffffff;
	cursor: pointer;
}
.logForm .submitLogBtn:hover{
	background-color: #003862 ;
}
.logForm .submitCancelBtn{
	display: inline-block;
	width: 100%;
	max-width: 150px;
	padding: 0.5rem;
	margin: 3px;
	border:none;
	border-radius: 5px;
	background-color: #ff2020;
	color: #ffffff;
	cursor: pointer;
}
.logForm .submitCancelBtn:hover{
	background-color: #cf2020 ;
}
/*Notifications*/
.logNotification{
	width: 100%;
	max-width: 320px;
	min-width: 320px;
	background-color: #303030;
	padding:1rem;
	position: fixed;
	bottom: 1rem;
	right: -320px;
	color: #afafaf;
	transition: right 0.5s;
	z-index: 99;
}
.showNotif{
	right: 0;
}
.notifIconContainer{
	position: absolute;
	top:1rem;
	left: 1rem;
}
.notifIconContainer .notifIcon{
	font-size: 2rem;
}
.activateUserNotifContainer{
	position: relative;
	width: 100vw;
	height: 100vh;
}
.activationNotif{
	position: absolute;
	width: 320px;
	height: 320px;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	padding: 1rem;
	text-align: center;
	border-radius: 10px;
	background-color: #101010; 
	box-shadow: 5px 5px 10px 0 #101010;
}
.activateText{
	margin: 5px 0 0 0;
	color: #ffffff;
}
.notifError{
	font-size: 2.5rem;
	color: #cf0000;
}
.notifWarn{
	font-size: 2.5rem;
	color: #ffcc00;
}
.notifGood{
	font-size: 2.5rem;
	color: #20af30;
}
.notifTextContainer{
	width: 90%;
	padding: 2.5rem 0 0 0;
}
.chargeIcon .loadSpinner{
	display: inline-block;
	position: absolute;
	top:40%;
	right: 2rem;
	font-size: 2rem;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.reloadIcon .loadSpinner{
	display: inline-block;
	right: 2rem;
	font-size: 2rem;
	color: #505050;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.chargeIcon .sideSpinner{
	display: inline-block;
	font-size: 2rem;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.reloadIcon .sideSpinner{
	display: inline-block;
	font-size: 2rem;
	color: #505050;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.buttCharger{
	display: none;
	position: relative;
	margin: 0 0 0 1rem;
}
.buttCharger .loadButtSpinner{
	font-size: 2rem;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.activateChargeIcon .loadSpinner{
	display: inline-block;
	font-size: 2rem;
	animation-name: spinLoad;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
@keyframes spinLoad{
	from{
		-webkit-transform: rotateZ(0deg);
		transform: rotateZ(0deg);
	}
	100%{
		-webkit-transform: rotateZ(360deg);
		transform: rotateZ(360deg);
	}
}

/*My videos*/

.userScrollSession, .userSession{
	position: absolute;
	right: 1rem;
	padding: 1rem 0;
	display: inline-block;
	top:0;
	bottom: 0;
	margin: 0 0;
}
.userIcon{
	display: inline-block;
	margin: 0 5px;
	width: 35px;
	height: 35px;
	border-radius: 50%;
	background-color: #909090;
}
.userName{
	font-size: 0.8rem;
	display: inline-block;
	margin: 0 5px;
	text-align: center;
	max-width: 150px;
	vertical-align: 50%;
	color: #006BBD;
	font-weight: bold;
}
.logOutBtn, .userSettings{
	display: inline-block;
	vertical-align: 100%;
	padding: 0.8rem;
	border: solid 1px #909090;
	border-radius: 5px;
	transition:0.5s;
	margin: 0 5px;
}
.logOutIcon, .userSetsIcon{
	color: #909090;
	transition:0.5s;
}
.logOutBtn:hover, .userSettings:hover{
	border: solid 2px #006BBD;
}
.logOutBtn:hover .logOutIcon, .userSettings:hover .userSetsIcon{
	color: #006BBD;
}
.forgotPass{
	text-align: center;
	color: #00A1FF;
	cursor: pointer;
	margin: 10px 0 0 0;
}

/*admn main*/

.admnOptWrapper{
	display: inline-block;
	float: left;
	width: 25%;
	min-width: 228px;
	margin: 1rem 0;
}
.mainAdmnOpt{
	display: block;
	position: relative;
	width: 100%;
	max-width: 350px;
	min-width: 228px;
	margin: auto;
	background-color: #1a1a1a;
	box-shadow: 0 0 10px 0 #101010;
}
.optDisb{
	opacity: 0.5;
	cursor: not-allowed;
}
.mainAdmnOpt:hover{
	background-color: #006BBD;
}
.admnOptIcon{
	position: absolute;
	font-size: 5.5rem;
	color: #ffffff;
	opacity: 0.4;
	right: 10px;
	top:2rem;
	bottom:0;
	margin: auto;
}
.mainAdmnOpt:hover .admnOptIcon{
	opacity: 0.7;
}
.optTitle{
	padding: 4rem 1rem;
	color: #afafaf;
}
.subOptTitle{
	font-size: 16px;
	text-align: center;
}
.mainAdmnOpt:hover .optTitle{
	color: #ffffff;
}
/*manage user*/
.userType, .userChecks{
	display: inline-block;
	padding: 0 0.5rem;
}

	/*Admin Users and Admins*/
	.adminUserResult{
		text-align: justify;
	}
	.userWrapper{
		min-width: 307px;
		max-width: 307px;
		vertical-align: top;
		display: inline-block;
		margin: 0 0 1rem 0;
		padding: 0.7rem;
		background-color: #101010;
		border-radius: 10px;
		box-shadow: 2px 2px 10px 0 #101010;
	}
	.adminUsersIconWrapper{
		vertical-align: top;
		display: inline-block;
		float: left;
		height: auto;
		margin:0 10px 0 0;
	}
	.adminUserIcon{
		color:#10af00;
		font-size: 5rem;
		vertical-align: 10px;
	}
	.inactive{
		color:#ffffff;
		padding: 1.2rem .7rem;
		font-size: 3rem;
		background-color: #dfaa00;
		vertical-align: 17px;
		border-radius: 50%;
	}
	.userData{
		vertical-align: top;
		display: inline-block;
		float: left;
		text-align: left;
		max-width: 170px;
		margin:0 5px 0 0;
	}
	.adminUserMail{
		font-size: 0.8rem;
		font-weight: bold;
	}
	.signedUpDate{
		font-size: 0.75rem;
		font-weight: bold;
	}
	.adminUserOpts{
		padding: 1rem;
	}
	.userTypeTag{
		display:inline-block;
		padding:0.4rem;
		font-size: 0.8rem;
		font-weight: bold;
		border-radius: 10px;
	}
	.totalAdmin{
		background-color: #5090ff;
		color:#ffffff;
	}
	.parcialAdmin{
		background-color: #3050ff;
		color:#ffffff;
	}
	.simpleUser{
		background-color: #8000ff;
		color:#ffffff;
	}
	.adminUsersOpts{
		vertical-align: top;
		display: inline-block;
		float:left;
	}
	.adminUsersOpts > i{
		display: block;
		padding: 0.5rem;
		text-align: center;
		color: #ffffff;
		background-color: #909090;
		border-radius: 5px;
		margin-bottom: 2px;
		cursor: pointer;
	}
	.adminUsersOpts a i{
		display: block;
		padding: 0.5rem;
		text-align: center;
		color: #ffffff;
		background-color: #10af00;
		border-radius: 5px;
		margin-bottom: 2px;
	}
	.adminUsersOpts .deleteUser{
		background-color: #cc0000;
	}

		/*User Hist*/
		.userHistTable, .videoHistTable{
			margin: 0 0 4rem 0;
			width: 100%;
			text-align: center;
			background-color: #202020;
			color: #ffffff;
		}
		.lastDay, .retName{
			position: relative;
		}
		.upDInput{
			margin: 5px 0;
			padding: 2px;
			border:none;
			width: 100%;
			background-color: #101010;
			border-radius: 5px;
		}
		.updateD{
			font-size: 16px;
			margin:0 5px;
			color: #ffffff !important;
			cursor: pointer;
		}
		.cancelD{
		    font-size: 16px;
		    margin:0 5px;
			color: #ff0000 !important;
			cursor: pointer;
		}
		.upDWrap{
			position: absolute;
		    top: -10%;
		    left: -100%;
		    padding: 0.5rem;
		    max-height: 120px;
    		min-height: 80px;
		    background-color: #505050;
		    border: 1px solid;
		    border-radius: 5px;
		    box-shadow: -3px 4px 3px rgba(0, 0, 0, 1);
		    z-index: 2;
		}
		.chngRet{
			top: 65%;
		    left: 0;
		    width: 120%;
		}
		.chngInput{
			background-color: #202020;
			width: 100%;
		}
		.upDBtn{
			vertical-align: -3px;
		}
		.cancelUpd{
			display: inline-block;
			margin: 0.5rem 5px 0 0;
			font-size: 30px;
			color: #ff0000;
			background-color: #ffffff;
			border-radius: 50%;
			cursor: pointer;
		}
		.acceptUpd{
			display: inline-block;
			margin:0.5rem 0 0 5px;
			font-size: 30px;
			color: #10ff15;
			background-color: #ffffff;
			border-radius: 50%;
			cursor: pointer;
		}
		.searchRetList{
			position: absolute;
			background-color: #303030;
			max-height: 300px;
			overflow-y: auto;
		}
		.courseListSelect{
			border: solid 1px #909090;
			font-size: 0.9rem;
			cursor: pointer;
		}
		.courseListSelect:hover{
			background-color: #5090ff;
		}

	/*Pop out Alerts and action Alerts*/

	.actionMessage{
		display: none;
		position: fixed;
		padding: 0.5rem;
		max-width: 800px;
		min-width: 319px;
		left: 0;
		bottom: 2rem;
		background-color: #ffffff;
		box-shadow: 1px 1px 5px 0 #101010;
		z-index: 102;
	}
	.popOutVerif{
		display: none;
		background-color: rgba(0,0,0,0.5);
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		z-index: 101;
	}
	.alertContainer{
		text-align: center;
		position: absolute;
		width: 20vw;
		min-width: 280px;
		max-width: 500px;
		height: 10vh;
		min-height: 250px;
		max-height: 350px;
		padding: 1rem; 
		margin:auto;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		border-radius: 10px;
		background-color: #dfdfdf;
		box-shadow: 5px 5px 10px 0 #000000;
		animation-name:zoomIn;
		animation-duration: 0.5s;
		z-index: 102;
	}
	.appearPopOut{
		display: block;
	}

	@keyframes zoomIn{
	from {
	    opacity: 0;
	    transform: scale3d(.3, .3, .3);
	  }
	  50% {
	    opacity: 1;
	  }
	}

	.alertButtonsWrapper{
		position: absolute;
		display: block;
		bottom: 1rem;
		left: 0;
		width: 100%;
	}
	.alertButtons{
		border: none;
		border-radius: 5px;
		width: 30%;
		min-width: 100px;
		height: 30px;
		padding: 0.3rem;
		color: #ffffff;
		text-align: center;
		box-shadow: 0 0 5px 0 #303030;
		cursor: pointer;
	}
	.alertIcon{
		font-size: 3rem;
		margin: 0 0 1rem;
		text-shadow: 0 0 3px #202020;
	}
	.verifWarn{
		color: #ffcc00;
	}
	.verifGood{
		color: #10ff20;
	}
	.verifError{
		color: #ff0000;
	}
	.alertMessage{
		color: #303030;
	}
	p.alertMessage{
		color: #303030;
		font-size: 0.9rem;
	}
	.cancelButt{
		background-color: #ff3000;
	}
	.acceptButt{
		background-color: #10ff20;
	}

	/*------------*/

.userMail{
	font-size: 1.5rem;
	margin: 5px 0;
}
.statusMailVerif{
	display: inline-block;
	padding: 1rem;
	border-radius: 5px;
	color: #ffffff;
	font-weight: bold;
}
.admnRetLabel{
	font-weight: bold;
	color: #909090;
	font-size: 1.5rem;
}
.mailVerified{
	background-color: #20cf20;
}
.notYetVerifiedMail{
	background-color: #dfcc00;
}
.userOptionsContainer{
	margin: 2rem 0 1rem 0;	
}
.retransUserSettings{
	display: none;
	transition: opacity 1s;
	transition-delay: 2s;
}
.retransAdmnSettings{
	display: block;
	transition: opacity 1s;
	transition-delay: 2s;
}
.editUserButtons{
	padding: 0.5rem;
	border-radius: 5px;
	cursor: pointer;
}
.passChange{
	background-color: #006BBD;
	color: #ffffff;
	font-weight: bold;
}
.elimUser{
	background-color: #df1010;
	color: #ffffff;
	font-weight: bold;
}
.formRegInptWrapper{
	display: inline-block;
	width: 45%;
	padding: 0.5rem 0;
	vertical-align: top;
	margin: 0 10px;
}
.frmError{
    background-color: #ff0000;
    color: #ffffff;
    padding: 1rem;
    width: 50%;
}
.admnRetInputs{
	border:none;
	display:inline-block;
	height: 30px;
	width: 100%;
	font-size: 1.3rem;
	border-radius: 5px;
	background-color: #101010;
	color: #ffffff;
	padding: 5px;
	margin: 5px 0;
	outline: none;
}
.dynaSizeInps{
    display:inline-block;
    width:auto;
}
.inpWidAuto{
    width:auto;
}
.admnRetInputs:disabled{
	opacity: 0.5;
	cursor: not-allowed;
}
.admnRetSelect{
	border:none;
	height: 30px;
	width: auto;
	font-size: 1.3rem;
	border-radius: 5px;
	background-color: #101010;
	color: #ffffff;
	padding: 5px;
	margin: 5px 0;
	outline: none;
}
.admnRetSelect:disabled{
	opacity: 0.5;
	cursor: not-allowed;
}
/******* Checkbox/Radio Switch Type 01 ********/
	.switchContainer{
		position: relative;
		display: inline-block;
		vertical-align: top;
	}
	.deactSwitch, .actSwitch{
		display: inline-block;
		vertical-align: -9px;
		margin: 0 3px;
		font-size: 1.1rem;
		transition: 0.5s;
		color:#cfcfcf;
	}
	.switches {/*básic*/
		position: absolute;
		right: 0;
		visibility: hidden;
	}
	/*basico*/
	.switches + .switchGraph{
		display: inline-block;
		position: relative;
		cursor: pointer;
		outline: none;
		user-select: none;
		vertical-align: -16px;
	}
	.switches[disabled="disabled"] + .switchGraph{
		cursor: not-allowed;
		opacity: 0.4;
	}
	
	/********** Graphic Switch styles ************************************/
	input.graphicSwitches + label {
		padding: 2px;
		width: 39px;
		height: 23px;
		background-color: #dddddd;
		border-radius: 60px;
	}
	input.graphicSwitches + label:before,
	input.graphicSwitches + label:after {
	  display: block;
	  position: absolute;
	  top: 1px;
	  left: 1px;
	  bottom: 1px;
	  content: "";
	}
	input.graphicSwitches + label:before {
	  right: 1px;
	  background-color: #808080;
	  border-radius: 15px;
	  -webkit-transition:background 0.4s;
	  transition: background 0.4s, right 0.4s;
	}
	input.graphicSwitches + label:before{
		background-color: #cfaa00;
	}
	input.graphicSwitches + label:after {
	  width: 20px;
	  height: 20px;
	  background-color: #dfdfdf;
	  border-radius: 100%;
	  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
	  -webkit-transition: margin 0.4s;
	  transition: margin 0.4s;
	}
	input.graphicSwitches:checked + label:before {
	  background-color: #00ff50;
	}
	input.graphicSwitches:checked + label:after {
	  margin-left: 20px;
	}
	input.graphicSwitches:checked ~ .actSwitch {
		color: #00ff50;
		font-weight: bold;
	}
/******** End Checkbox/Radio Switch *********/
.admnRetTextArea{
	border:none;
	resize: none;
	height: 200px;
	width: 100%;
	font-size: 1.3rem;
	border-radius: 5px;
	background-color: #101010;
	color:#ffffff;
	padding: 5px;
	margin: 5px 0;
	outline: none;
}
.admnRetSubmit{
	border:none;
	font-weight: bold;
	color:#ffffff;
	background-color: #006BBD;
	margin: 5px 0;
	padding: 0.5rem 1.5rem;
	border-radius: 5px;
	cursor: pointer;
}
.admnRetSubmit:disabled{
	opacity: 0.5;
	cursor: not-allowed;
}
.delInst{
	display: none;
}
	/*Error and Good notifs :D*/

	.searchError{
		color:#ff0000;
	}
/*activate ret to user*/
.searchResultsContainer{
	width: 100%;
	max-height: 250px;
	overflow: auto;
}
.hiddenInp{
	display: none;
}
.liveInputs{
	display: none;
}

.inputExpirationDate{
	color: #ff0000;
}
/*////// MAIL TEMPLATES AREA //////*/
.template{
	padding:1rem 0 0 0;
}
.userDataFlds{
	display: none;
}
.hiddenFields{
	display: none;
}
.tempView{
	max-width: 100%;
	max-height: 800px;
	overflow-y: auto;
	background-color: #afafaf;
	box-shadow: 0 0 5px 0 #202020 inset;
}
.tempCode{
	display: none;
	resize: none;
	width: 100%;
	min-height: 800px;
	overflow-y: auto;
	background-color: #202020;
	font-family: "Lucida Console", Courier, monospace;
	font-size: 1rem;
	color: #ffffff;
	padding: 5px;
}
/*---------------*/
/*my Videos*/

.noVideos{
	color: #ff0000;
}
.videoWrapper{
	display: inline-block;
	float: left;
	width: 20%;
	margin: 1.2rem 0;
	vertical-align: top;
}
.videoContainer{
	position: relative;
	display: none;
	width: 100%;
	max-width: 350px;
	min-width: 280px;
	margin: 0 auto;
	background-color: #006BBD;
	box-shadow: 5px 5px 10px 0 #202020;
	border-radius:10px;
	overflow: hidden;
}
.retransContainer{
	position: relative;
	display: block;
	width: 100%;
	max-width: 350px;
	min-width: 280px;
	margin: 0 auto;
	background-color: #006BBD;
	box-shadow: 5px 5px 10px 0 #202020;
	border-radius:10px;
	overflow: hidden;
}
.disabledRetrans{
	opacity: 0.5;
}
.animateVideo{
	animation-name: videoRotation;
	animation-duration: 1s;
}
.displayElement{
	display: block;
}
/*Manage videos btns*/
.radioCheckCustomCatalogue{
	position: absolute;
	top: 5px;
	left: 5px;
	display: inline-block;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	background-color: #afafaf;
	cursor: pointer;
	box-shadow: 0 0 10px 0 #000000;
	z-index: 1;
}
.radioCheckCustomCatalogue:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	background-color: #40cf50;
	transform: rotateY(90deg);
	transition: transform 0.5s;
}
.radioCheckCustomCatalogue:after{
	position: absolute;
	top: 5px;
	left: 9px;
	margin: auto;
	content: attr(data-value);
	color: #ffffff;
	transform: scale(0);
	transition: transform 0.3s;
	transition-delay: 0.2s;
}
.radioCheck:checked + .radioCheckCustomCatalogue:before, .radioCheck:checked + .radioCheckCustomCatalogue:after{
	transform: rotateY(0deg);
}
.radioCheck:checked + .radioCheckCustomCatalogue:after{
	transform: scale(1);
}
.activate-Deactivate-Video{
	position: absolute;
	top: 5px;
	right: 5px;
	z-index: 2;
}
.videoButton{
	border:none;
	display: inline-block;
	padding: 0.5rem;
	border-radius:5px;
	color: #ffffff;
	font-weight: bold;
	cursor: pointer;
	box-shadow:1px 1px 5px 0 #000000;
}
.deactivateVideo{
	margin: 0 5px 0 0;
	background-color: #dfaf00;
}
.deleteVideo{
	margin: 0 5px 0 0;
	background-color: #9f9f9f;
}
.seeMore{
	background-color: #006BBD;
	color:#ffffff;
}
.courseModeIcon{
	display: inline-block;
	position: absolute;
	top:1rem;
	left: 1rem;
	color: #ffffff;
	font-weight: bold;
	padding:6px;
	border-radius: 5px;
	z-index: 1;
}
.courseModeIcon.live{
	background-color: #ff0000;
}
.courseModeIcon.retrans{
	background-color: #0000ff;
}
.deleteIcon{
	color: #ffffff;
	font-size: 1.2rem;
}
.deleteVideo:hover{
	background-color: #9f0000;
}
.courseSets{
	background-color: #9f9f9f;
}
.courseSetsIcon{
	color: #ffffff;
	font-size: 1.2rem;
}
.courseSets:hover{
	background-color: #006BBD;
}
.activateVideo{
	margin: 0 5px;
	background-color: #20af20;
}
.durationWrap{
	position: absolute;
	text-align: right;
	bottom: 0;
	padding: 0.5rem;
}
.durationWrap .hDur, .durationWrap .minsDur{
	padding: 3px;
	font-weight: bold;
	color: #ffffff;
	background-color: #000000;
	display: inline-block;
}
.videoThumb{
	position: relative;
	width: 100%;
	height: auto;
	background-color: #ffffff;
}


/*CATALOGUE Shoping*/
	/******* Checkbox/Radio Box Switch Type 02 ********/
	.categSwitches{
		padding: 1rem;
	}
	.switchBoxContainer{
		position: relative;
		display: inline-block;
		min-width: 228px;
		margin: 10px 0;
		background-color: #505050;
		border-radius: 5px;
		padding: 0.5rem;
	}
	.radioCheck{
		position: absolute;
		top:0;
		left:0;
		display: none;
	}
	.radioCheck.actVidUsr{
		position: relative;
	}
	.radioCheckCustom{
		position: relative;
		vertical-align: 15%;
		display: inline-block;
		border-radius: 50%;
		width: 30px;
		height: 30px;
		cursor: pointer;
		background-color: #afafaf;
	}
	.radioCheckCustom:before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		border-radius: 50%;
		width: 30px;
		height: 30px;
		background-color: #40cf50;
		transform: rotateY(90deg);
		transition: transform 0.5s;
	}
	.radioCheckCustom:after{
		position: absolute;
		top: 3px;
		left: 8px;
		margin: auto;
		content: attr(data-value);
		color: #ffffff;
		transform: scale(0);
		transition: transform 0.3s;
		transition-delay: 0.2s;
	}
	.radioCheck:checked + .radioCheckCustom:before, .radioCheck:checked + .radioCheckCustom:after{
		transform: rotateY(0deg);
	}
	.radioCheck:checked + .radioCheckCustom:after{
		transform: scale(1);
	}
	.switchBoxContainer label{
		font-weight: bold;
		font-size: 1.1rem;
		cursor: pointer;
	}
	.switchBoxContainer .mainLabel{
		position: relative;
		display: inline-block;
		padding: 0rem 1rem;
	    text-align: left;
	    vertical-align: 10px;
	}
	.switchBoxContainer label .miniInfo{
		font-weight: bold;
		font-size: 0.7rem;
		color: #909090;
	}
	/******** End Checkbox/Radio Box Switch *********/
	.retCatCount{
	    display:inline-block;
	    position: absolute;
	    top:0;
	    left:1rem;
		padding: 1rem;
	}
	.cartIcon{
		position: absolute;
		top:9.5rem;
		left:1rem;
		display:inline-block;
		padding: 1.5rem;
		background-color: #229900;
		border-radius: 50%;
	}
	.cartIcon i{
		font-size: 2rem;
	}
	.cartItems{
		display: inline-block;
		position: absolute;
		bottom:0px;
		border-radius: 10px;
		padding: 0.2rem 0.5rem;
		background-color: #ff0000;
	}
	.activeVideos{
		position: relative;
	}
	.scrollIndicator{
		text-align: center;
		text-shadow: 0 0 5px #ffffff;
		font-weight: bolder;
		display: inline-block;
		position: absolute;
		font-size: 1.5rem;
		color: #003862;
		right: 0.5rem;
		top:0;
		z-index: 3;
	}
	.scrollIndicator i{
		color: #ff8203;
		font-size: 2.5rem;
		background-color: #ffffff;
		border-radius: 50%;
	}
	.inputWrapper{
		display: inline-block;
		width: 80%;
		height: 40px;
	}
/*----------------------------------*/
@keyframes videoRotation{
	from{
		-webkit-transform: rotateY(90deg);
		transform: rotateY(90deg);
	}
	100%{
		-webkit-transform: rotateY(0deg);
		transform: rotateY(0deg);
	}
}

.videoImage{
	position: relative;
	display: block;
	width:100%;
}
.playIconWrapper{
	position: absolute;
	text-align: center;
	width: 100%;
	height: 100%;
	opacity: 0;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.7);
	transition: opacity 0.5s;
}
.videoLink:hover .playIconWrapper{
	opacity: 1;
}
.playIcon{
	display: inline-block;
	vertical-align: -100px;
	text-align: center;
	margin: auto;
}
.playSign{
	display: block;
	color: #ff8203;
	font-size: 3.5rem;
}
.videoInfo{
	padding: 0.5rem;
	height: 190px;
}
.retransInfo{
	padding: 0.5rem;
	height: 145px;
}
.retransInfo .videoPres{
    text-align: right;
    display: inline-block;
    margin:5px 0 0 0;
    padding: 5px 1rem;
    background-color: #ff8203;
    color: #ffffff !important;
    border-radius: 5px;
}
.retransInfo .coursePrice > *{
	color: #ff8203;
	text-shadow: 0 0 2px #000000;
}
.addCart{
	position: absolute;
	bottom: 12px;
	margin: 0 auto;
	left:1rem;
	display: inline-block;
	padding:0.5rem 1rem;
	text-align: center;
	cursor: pointer;
	background-color: #509000;
	border-radius: 5px;
}
.addCart:hover{
	background-color: #20cf00;
}
.videoUseStatus{
	padding: 0.5rem;
}
.videoUseText{
	display: inline-block;
	color:#ffffff;
	font-weight: bold;
	margin: 5px 0;
}
.inUse{
	font-size: 1.5rem;
	color: #00ff00;
}
.noUsers{
	font-size: 1.5rem;
	color: #ff0000;
}
.usersUsing{
	color:#00ff00;
	font-weight: bold;
	display: inline-block;
}
.videoTitle{
	color:#ffffff;
	font-size: 1.1rem;
	text-shadow: 0 0 2px #000000;
}
.courseDuration{
	text-align: center;
	font-size: 0.8rem;
	color: #ffffff;
}
.expirationDate, .activationDate{
	display: inline-block;
	color:#ffffff;
	margin: 10px 0 0 0;
	font-size: 0.8rem;
}
.retransInstructor{
	color: #ffffff;
	margin: 5px 0;
	text-align: center;
	font-size: 0.9rem;
}
.expirationDate, .dateOfRecord{
	color: #ffffff;
}
.courseAttachment{
	display: inline-block;
	margin: 16px 0 0 0;
	padding: 0.6rem;
	color: #ffffff;
	font-weight: bold;
	text-align: right;
	background-color: #303030;
	border-radius: 5px;
}
.coursePrice{
	display: block;
	position:absolute;
	margin: 0;
	right: 10px;
	bottom: 5px;
	text-align: right;
	color: #ffffff;
}
.categTab{
	position: absolute;
	bottom: 1rem;
	left: 1rem;
	display: inline-block;
	font-size: 0.7rem;
	background-color: #505050;
	padding: 3px 1rem;
	font-size: 1rem;
	color: #ffffff;
	text-align: center;
	border-radius: 30px;
}
.expirationDate .videoExpiration{
	color:#ffffff;
	font-weight: bolder;
	background-color: #ff0000;
	padding: 2px;
	border-radius: 4px;
}
.activationDate .videoActivation{
	color:#ffffff;
	font-weight: bold;
	background-color: #4050ff;
	padding: 2px;
	border-radius: 4px;
}
/*Cart*/
.cartContainer{
	padding: 0.5rem;
	min-height: 250px;
	max-height: 250px;
	overflow-y: auto;
	border-radius: 5px;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.8) inset;
}
.cartItem{
	width: 100%;
	max-height: 190px;
	background-color: #202020;
	border:1px solid #ffffff;
	padding: 1rem;
}
.cartTotals{
	text-align: right;
}
/*-------------*/
/*Watch videos*/

.videoPlayerTitle{
	margin: 0 0 0.8rem 0;
}
.retransDate{
	margin:0 0 0.8rem 0;
	color: #909090;
}
.watchVideo iframe{
	display: block;
	margin: 0 auto;
}
.blankSpace{
	display: block;
	width: 100%;
	height: 70px;
	background-color: #303030;
}
.otherOptionsBtn{
	display: inline-block;
	padding: 0.8rem;
	border-radius: 6px;
	background-color: #2090ff;
	font-weight: bold;
	color: #ffffff;
}
.toAdmn{
	display: inline-block;
	position: fixed;
	bottom: 15px;
	right: 5.5rem;
	padding: 0.8rem;
	border-radius: 6px;
	background-color: #2090ff;
	font-weight: bold;
	color: #ffffff;
	z-index: 6;
}
.toPage{
    display: inline-block;
	position: fixed;
	top:15px;
	right: 5.5rem;
	padding: 0.8rem;
	border-radius: 6px;
	background-color: #2090ff;
	font-weight: bold;
	color: #ffffff;
	box-shadow:1px 1px 5px 0 #000000;
	z-index: 6;
}
.toHome{
	display: inline-block;
	position: fixed;
	bottom: 15px;
	right: 15px;
	padding: 0.8rem;
	border-radius: 6px;
	background-color: #2090ff;
	font-weight: bold;
	color: #ffffff;
	z-index: 6;
}
/*MEDIA QUERYS*/
@media (max-width: 2050px){
	.videoWrapper{
		width: 25%;
	}
}
/*@media (max-width: 1860px){
	*{
		font-size: 19px;
	}
}
@media (max-width: 1790px){
	*{
		font-size: 18px;
	}
}
@media (max-width: 1700px){
	*{
		font-size: 16px;
	}
}*/
@media (max-width: 1623px){
	.videoWrapper{
		width: 33.33%;
	}
}
@media (max-width: 1607px){
	/*mainAdmn*/
	.admnOptWrapper{
		width: 33.33%;
	}
}
@media (max-width: 1524px){
	*{
		font-size: 14px;
	}
	.userName{
		font-size: 0.8rem;
		display: inline-block;
		margin: 0 5px;
		text-align: center;
		max-width: 110px;
		vertical-align: 50%;
		color: #006BBD;
		font-weight: bold;
	}
	.adminUserIcon{
		font-size: 3.5rem;
	}
	.inactive{
		padding: 1rem .7rem;
		font-size: 2rem;
	}
}
@media (max-width: 1330px){
	.paddingSec{
		padding: 116px 2rem 1rem 2rem;
	}
	.sliderTextCont{
		padding: 7% 0 2.5rem 0;
	}
	/*WEEK COURSES*/
	.courseDate {
	    display: block;
	    text-align: left;
	    background-color: #ffffff;
	    padding: 0.8rem;
	    height: auto;
	    border-radius: 0;
	}
	.courseDay, .timeLapse{
		display: inline-block;
	}
	.courseDay br, .timeLapse br{
		display: none;
	}
	.courseDetail{
		padding: 48px 1rem 0.7rem 1rem;
		margin: -43px 0 0 0;
		width: 100%;
	}
	.courseName{
		width: 80%;
	}
}
@media (max-width: 1165px){
	.videoWrapper{
		width: 50%;
	}
}
@media (max-width: 1138px){
	.slideResume{
		display: none;
	}
	.courseName{
		width: 70%;
	}
}
@media (max-width: 1125px){
	/*mainAdmn*/
	.admnOptWrapper{
		width: 50%;
	}
}
@media (max-width: 1000px){
	.courseName{
		width: 60%;
	}
}
@media (max-width: 989px){
	.menu{
		display: none;
	}
	.mobileMenuBtn{
		display:block;
	}
}
@media (max-width: 960px){
	.sliderTextCont{
		padding: 6% 0 2.5rem 0;
	}
}
@media (max-width: 994px){
	.InfoButton span{
		display: none;
	}
}
@media (max-width: 890px){
	.sliderTextCont{
		padding: 7% 0 2.5rem 0;
		width: 80%;
	}
}
@media (max-width: 823px){
	.courseName{
		width: 53%;
	}
	.courseName a{
		font-size: 1rem;
	}
}
@media (max-width: 805px){
	.videoWrapper{
		width: 100%;
	}
}
@media (max-width: 772px){
	/*mainAdmn*/
	.admnOptWrapper{
		width: 100%;
	}
	.lastDay, .retName{
		position: static;
	}
	.upDWrap, .chngRet {
	  top: 10rem;
	  left: 0;
	  width: 95%;
	  right: 0;
	  margin: auto;
	}
}
@media (max-width: 768px){
	.sliderTextCont{
		padding: 5% 0 2.5rem 0;
	}
	.sliderTitle{
		font-size: 1.8rem;
	}
	.left{
		left: 1rem;
	}
	.right{
		right: 1rem;
	}
	.userName{
		display: none;
	}
}
@media(max-width: 709px){
	.courseWrapper{
		height: auto;
	}
	.courseDetail{
		display: block;
		width: 100%;
		height: auto;
		padding: 0.5rem;
		margin: 0;
	}
	.courseName{
		width: 100%;
	}
	.courseName a{
		font-size: 1.2rem;
	}
	.courseInfoLinks{
		position: relative;
		margin: 1.5rem 0 0 0;
	}
	.detailAndReservation {
	    position: relative;
	    width: 100%;
	    min-width: 280px;
	    padding: 0.5rem 0;
	}
	.reservation{
		position: relative;
		bottom: 0;
	}
}
@media (max-width: 659px){
	.sliderTextCont{
		padding: 3.5% 0 2.5rem 0;
	}
	.sliderTitle{
		font-size: 1.6rem;
	}
	.slideInfoBtnCont{
		bottom: 1rem;
	}
}
@media (max-width: 575px){
	.sliderTextCont{
		padding: 2% 0 2.5rem 0;
	}
	.sliderTitle{
		font-size: 1.5rem;
		padding: 0.5rem;
	}
}
@media (max-width: 500px){
	.logo{
		height: 80%;
	}
	.paddingSec{
		padding: 116px 10px 1rem 10px;
	}
	.paddingSec.short{
		padding: 116px 2rem 1rem 2rem;	
	}
	/*Forms inputs*/
	.formRegInptWrapper{
		width: 100%;
		padding: 0;
		margin: 0;
	}
}
@media (max-width: 479px){
	.sliderTextCont{
		padding: 2% 0 2.5rem 0;
	}
	.sliderTitle{
		font-size: 1.2rem;
		padding: 0.5rem;
	}
	.slideInfoBtnCont{
		bottom: 0.5rem;
	}
	.infoVideo{
		padding: 0.4rem;
		font-weight: normal;
	}
	.seeMore a, .infoVideo span {
		font-size: 0.8rem
	}
	.playIcon{
		font-size: 0.75rem
	}
}
@media (max-width: 389px){
	.left{
		left: 0.5rem;
	}
	.right{
		right: 0.5rem;
	}
	.leftIcon, .rightIcon{
		font-size: 25px;
	}
	.sliderTextCont{
		padding: 1.5% 0 2.5rem 0;
	}
	.sliderTitle{
		font-size: 0.9rem;
		padding: 0.5rem;
	}
	.seeMore a, .playIcon{
		font-size: 0.7rem
	}
	.paddingSec.short{
		padding: 116px 1rem 1rem 1rem;	
	}
	.infoVideo{
		padding: 0.3rem 0.5rem;
		font-weight: normal;
	}
	.infoVideo span{
		display: none;
	}
}
@media (max-width: 334px){
	*{
		font-size: 13px;
	}
	.mobileOptLink{
		font-size: 15px;
	}
	.mobileSubOpt a{
		font-size: 14px;
	}
	
}