/**
 * Theme Name:     Hello Elementor Child
 * Author:         TUs
 * Template:       hello-elementor
 * Text Domain:	   hello-elementor-child
 * Description:    Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
 * Author URI:     https://transformus.co/
 */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  margin: 0;
}
.topics-wrapper{
	width: 70%;
    margin: 0 auto;
}

.chapter-lessons-wrapper > a{
    display: grid;
    grid-template-columns: 4fr 1fr;
    gap: 5px;
    justify-content: space-between;
    align-items: center;
	padding: 5px 20px;
	margin-bottom: 20px;
}
.chapter-title{
	font-size: 22px;
	margin-bottom: 10px;
}
.chapter-lessons-wrapper h4{
	display: flex;
	gap: 5px;
	font-size: 16px;
	align-items: center;
}
.chapter-lessons-wrapper .chapter-lessons-icon{
    display: flex;
    align-items: center;
    flex-direction: row;
}
.chapter-lessons-wrapper .chapter-lessons-icon svg{
    width: 25px;
}
.chapter-lessons-wrapper button,
.chapter-lessons-wrapper .btn-popup{
	background-color: #f6db4c;
    border: none;
    padding: 5px 0px;
    color: #FFF;
    width: 100%;
}

.chapter-lessons-wrapper a:hover{
	background-color: #00000012;
    border-radius: 5px;
}
.single-lesson-container h1{
	display: flex;
    align-items: center;
	margin-bottom: 20px;
    gap: 10px;
}
.video-frame-wrapper{
	height: 650px;
}

/*Media Query for XS screen*/
@media (max-width: 767px) {
	.topics-wrapper{
		width: 100%;
	}
	.chapter-lessons-wrapper > a{
		grid-template-columns: 2fr 1fr;
		padding: 5px;
	}
	.chapter-lessons-wrapper h4{
		font-size: 15px;
	}
	#single-lesson-container h1{
		font-size: 19px;
	}
	.video-frame-wrapper{
		height: 255px;
	}
}




/*Media Query for S screen*/
@media (min-width: 768px) and (max-width: 991px) {
	.topics-wrapper{
		width: 100%;
	}
	.video-frame-wrapper{
		height: 420px;
	}

}