/*******************	General classes	********************/
body {
	color: #707070;
}

main {
	background-color: #f8f8f8;
}

h1, h2, h3, h4 {
	color: #232323;
}

.white-on-red {
	background-color: red;
	color: white;
}

.bg-grey {
	background-color: #f8f8f8;
}

.bg-gradient-red {
	background: linear-gradient(to bottom, #ff0000 0%,#c40000 100%); 
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.rounded-corners-large {
	border-radius: 23px;
}

.input-icon {
	position: absolute;
	z-index: 1;
	padding: 10px;
}

.btn-primary {
	background-color: red;
	color: white;
	border-color: red;
	border-radius: 23px;
	padding-left: 3rem;
	padding-right: 3rem;
}
.btn-primary.focus, .btn-primary:focus {
	background-color: red;
	color: white;
	border-color: red;
	box-shadow: 0 0 0.2rem red;
}
.btn-primary:hover {
	background-color: white;
	color: red;
	border-color: red;
}
.btn-primary.disabled, .btn-primary:disabled {
	background-color: red;
	color: white;
	opacity: 0.5;
	border-color: red;
	cursor: not-allowed;
}
.btn-2ndary {
	border-radius: 23px;
	border-color: red;
	color: red;
	border-width: 2px;
	padding-left: 3rem;
	padding-right: 3rem;
}
.no-margin {
	margin: 0px;
}
table.tbl-row-bottom-border tr {
	border-bottom: 1px solid #d9dce0;
}
table.tbl-row-bottom-border td {
	padding-top: 10px;
	padding-bottom: 10px;
}

.iframe-container {
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}
/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

.img-fluid {
/* no extra styling needed, just added here to show in JCE*/
}
/*******************	End of General classes	********************/
/*******************	Top Menu classes	********************/
#top-nav {
	background-color: #232323;
}
.nav-item.active {
	background-color: red;
	border-radius: 8px;
}
div.dropdown-menu a.nav-link:hover {
	background-color: #2b2e33;;
}
.dropdown-menu .nav-link.active {
	background-color: red;
}
/*******************	End of Top Menu classes	********************/
/*******************	Header classes	********************/
#btn-top-login{
	border-radius: 23px;
	border-color: red;
	color: red;
	width: 140px;
}
#btn-top-reg {
	border-radius: 23px;
	background-color: red;
	color: white;
	width: 140px;
}
/*******************	End of Header classes	********************/
/*******************	Home page classes	****************************/
#carousel-testimonials ol.carousel-indicators {
	bottom: -3rem;
}
#carousel-testimonials ol.carousel-indicators li {
	background-color: #bcbcbc;
}
#carousel-testimonials ol.carousel-indicators li.active {
	background-color: #707070;
}
/*******************	End of Home Page classes	********************/
/*******************	About Us classes	********************/
.ellipse {
	width: 138px;
	height: 138px;
	border-radius: 50%;
	margin: auto;
}
.services-top-bg-img {
	background-position: center; 
	background-size: cover; 
	min-height: 175px; 
	display: grid; 
	border-radius: 12px 12px 0px 0px !important;
}
/*******************	End of About Us classes	********************/
/*******************	Contact Us classes	********************/
div.contact h1 {
	text-align: center;
}
#contact-form legend {
	display: none !important;
}
#contact-form div.controls {
	margin-bottom: 1rem;
}
#contact-form div.controls .form-control {
	border-radius: 23px !important;
}
/*******************	End of Contact Us classes	********************/

ul.red-dots {
	list-style: none; /* Remove default bullets */
	padding-left: 0px;
}

ul.red-dots li::before {
	content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
	color: red; /* Change the color */
	font-weight: bold; /* If you want it to be bold */
	display: inline-block; /* Needed to add space between the bullet and the text */
	width: 1em; /* Also needed for space (tweak if needed) */
	margin-left: -0px; /* Also needed for space (tweak if needed) */
}

.box-with-shadow {
	border-radius: 12px;
	box-shadow: 0 3px 15px 0 rgba(217, 220, 224, 0.84);
	padding: 10px 20px;
}
.margin-top-bottom {
	margin-bottom: 10px;
	margin-top: 10px;
}
span.testimonial {
	background-image: url(../img/quote_red.png);
	background-repeat: no-repeat;
	background-position: top left;
	padding-left: 40px;
	min-height: 30px;
	display: inline-block;
}
/*******************	Joomla Blog Articles classes			************************/
div.blog-articles div.row div.col div.item {
	background-color: white;
	height: 100%;
	border-radius: 12px;
	box-shadow: 0 3px 15px 0 rgba(217, 220, 224, 0.84);
}

div.blog-articles div.row div.col div.item .readmore {
	text-align: center;
}
/*******************	End of Joomla Blog Articles classes	************************/
/*******************	Seminar classes			************************/
div.seminar-carousel div h4 a:hover {
	text-decoration: none;
}
div.seminar-carousel div.active h4 {
	color: red;
	border-bottom: 1px solid red;
}
div.seminar-carousel div.inactive h4 {
	color: #bcbcbc;
	border-bottom: 1px solid #bcbcbc;
	cursor: pointer;
}
div.alternate-rows > div:nth-child(2n) {
	background-color: white;
}
/*******************	End of Seminar classes	************************/
/*******************	J2 Store classes	************************/
div.j2ExpressCheckout div.j2store-product {
	display: none;
}
/*******************	End of J2 Store classes	********************/
/*******************	EBook Category classes	*****************************/
div.item-page-ebooks div[style*="max-width:100%"] {
	/*Center PDF viewer*/
	margin: auto;
}
/*******************	End of EBook Category classes	************************/
/*******************	Video Category classes	*****************************/
.categories-list-videos > div.categories-list-child {
	border: 2px solid black;
	border-radius: 10px;
	padding: 1em;
	margin: 1em auto;
	position: relative;
	width: 400px;
	aspect-ratio: 1;
  }

.categories-list-videos div.categories-list-child span.no-videos {
	position: absolute;
	right: 1em;
	bottom: calc(1em + 40px);
}

.categories-list-videos div.categories-list-child div.yt-icon-wrapper {
	position: absolute;
	bottom: calc(1em + 20px);
}

.categories-list-videos div.categories-list-child h2 a {
	color: #333333;
	text-transform: uppercase;
}
/*******************	End Of Video Category classes	*****************************/