/* Online Courses Styles */

/* Courses Styles */
.purchased-courses-container .course-details .second-row form {
	justify-content: center;
	background-image: url(/wp-content/uploads/2022/03/progression-arrow.svg);
	background-repeat: no-repeat;
	background-size: contain;
}
.purchased-courses-container .course-details .second-row form input {
	opacity: 0 !important;
}
.purchased-courses-container .course-details .second-row form {
  filter: grayscale(1);
  opacity: 0.3;
  transition: .5s;
}
.purchased-courses-container .course-details .second-row form:hover {
  filter: grayscale(0);
  opacity: 1;
}
/** Online Courses **/
.purchased-courses-container,
.most-popular-courses-container {
	display: flex;
	flex-direction: column;
	gap: 20px;
  width: max-content;
}
.courses-tab-container h2 {
	color: #231F20 !important;
	font-weight: 800;
  font-size: max(2vw, 35px);
  font-family: bebas-neue-pro;
}
.purchased-courses-container .inner-courses-container,
.most-popular-courses-container .inner-courses-container {
	display: flex;
  gap: 40px;
  padding-bottom: 20px !important;
}
.single-course { 
	display: flex;
	flex-direction: column;
	max-height: 400px;
	min-width: 21vw;
	max-width: 400px;
	background: #fff;
	padding: 10px !important;
	border-radius: 25px;
	box-shadow: 5px 5px 10px 1px #0003;
}
.purchased-courses-container .single-course *,
.most-popular-courses-container .single-course * {
	color: #231F20 !important	;
}
.purchased-courses-container .single-course > *,
.most-popular-courses-container .single-course > * {
	flex: 1;
	height: 50%; 
}
.purchased-courses-container .single-course .image-container,
.most-popular-courses-container .single-course .image-container {
	border-radius: 15px;
  overflow: hidden;
}
.purchased-courses-container .single-course .image-container img,
.most-popular-courses-container .single-course .image-container img {
	height: 100%;
	width: 100%;
	display: block;
	margin: auto;
	object-fit: cover;
}
.single-course .course-details {
	display: flex;
	flex-direction: column;
	gap: 10px;
  padding: 0 1% !important;
	height: 100%;
}
.single-course .course-details hr {
	max-height: 1px;
	width: 100%;
}
.single-course .course-details .first-row {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	flex: 3;
}
.single-course .course-details .first-row .course-heading h3,
.courses-tab-container .heading-container a {
	font-weight: 800;
  font-size: max(1vw, 18px);
  font-family: nhaasgrotesktxpro-65;
}
.single-course .course-details .first-row .course-meta {
	display: flex;
	gap: 10px;
	align-items: center;
}
.single-course .course-details .first-row .course-meta > * {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-size: max(.8vw, 14px);
	padding: 5px;
}
.single-course .course-details .first-row .course-meta .category {
	background: #EAEAEA;
	border-radius: 25px;
	padding: 5px;
  text-align: center;
}
.single-course .course-details .second-row {
	display: flex;
	align-items: center;
	flex: 2;
}
.single-course .course-details .second-row .progression-tracker,
.single-course .course-details .second-row .rating-container {
	flex: 5;
	display: flex;
	align-self: center;
	height: 15px;
	padding-right: 5%;
}
.single-course .course-details .second-row .rating-container,
.single-course .course-details .second-row .stars-rating {
  height: max-content;
}
.single-course .course-details .second-row .rating-count {
  display: flex;
  align-items: center;
}
.single-course .course-details .second-row .track {
	width: 100%;
	background: #EAEAEA;	
	border-radius: 10px;	
}
.single-course .course-details .second-row form {
	flex: 1;
	display: flex;
	align-items: center;
}
.courses-tab-container {
	display: flex;
	flex-direction: column;
	gap: 40px;
}
.purchased-courses-container,
.most-popular-courses-container {
	overflow-x: scroll;
	width: 100%;
}
.woocommerce-MyAccount-navigation {
	grid-row-start: 1;
}
.single-course .course-details .second-row .rating-container {
	justify-content: space-around;
	align-items: center;
}
.single-course .course-details .second-row .product-price h3 {
	font-family: bebas-neue-pro;
	font-size: max(3vw, 40px); 
}
.courses-tab-container .heading-container {
	display: flex;
	justify-content: space-between;
	padding-right: 5% !important;
}
.courses-tab-container .heading-container a {
	background: #FC5D01;
	padding: 1% 3% !important;
  cursor: pointer;
  border-radius: 26px;
  box-shadow: 5px 5px 10px 1px #0003;
  line-height: 2;
}
.popular-course-message {
	color: #000 !important;
	font-family: bebas-neue-pro;
}