@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

body {
  max-width: 1440px;
  margin: 0 auto;
}
.section1{
	background: linear-gradient(171.68deg, #090909 0.36%, #28487A 108.7%);
	border: 1px solid #5479B5;
	border-radius:720px 720px 0 0;
}
.section2{
	background: linear-gradient(171.68deg, #090909 0.36%, #28487A 108.7%);
	padding:0 48px;
}
.heading1{
	font-family: Red Hat Display;
	font-size: 70px;
	font-weight: 700;
	line-height: 84px;
	letter-spacing: 0em;
	text-align: center;
	color:white;
	padding-top:280px;
}

.text1{
	font-family: Red Hat Display;
	font-size: 24px;
	font-weight: 400;
	line-height: 37.68px;
	letter-spacing: 0em;
	text-align: center;
	color:white;	
	padding:80px 0;
}
.darkbg{
	background: #0B0C0F;
}
.appbtn{
	margin-top:55px;
}
.btncontainer{
	margin-right:112px;
}
.section1 ul li span{
	
font-weight: 700;
}
.section1 ul li{
font-family: Red Hat Display;
font-size: 20px;
font-weight: 400;
line-height: 44px;
letter-spacing: 0em;
text-align: left;
	
}
.fw-700{
	font-weight:700;
}
.fw-300{
	font-weight:300;
}
.fw-500{
	font-weight:500;
}
.fw-400{
	font-weight:400;
}
.fw-800{
	font-weight:800;
}
.classDate{
	background: #161D29;
	font-family: Red Hat Display;
font-size: 40px;
line-height: 54px;
letter-spacing: 0px;
text-align: left;
width: fit-content;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    border-radius: 42px;
    padding: 28px 42px;    gap: 23px;
    
    margin-top: 107px;
	
}
.specslider{
	margin: 104px 57px 89px 57px; 
	display:flex;
	gap:16px;
	overflow:auto;      
}
.specslider::-webkit-scrollbar {
  visibility: hidden;
}

.specslider::-webkit-scrollbar-thumb {
  visibility: hidden;
}

.specslider::-webkit-scrollbar-track.slider::-webkit-scrollbar-thumb {
  visibility: hidden;
}
.specslider img{
	    width: 251px;
    height: 319px;
}
.heading2{
font-family: Red Hat Display;
font-size: 62px;
line-height: 74px;
letter-spacing: 0em;
text-align: center;
padding:160px 0 94px 0;
	
}
.cardlisting{
	display:flex;
	flex-wrap:wrap;padding-bottom: 83px;
}
.listing2{
	display: flex;
    gap: 40px;
    width: calc(50% - 20px);
    border: 1px solid #5479B5;
    padding: 88px;
    align-items: center;
}
.listing2:hover{
	background: #171F2B;
}
/* Add left border on the first and third items */
.listing2:nth-child(2n + 1) {
  border-left-width:0;
}

/* Add right border on the second and fourth items */
.listing2:nth-child(2n) {
  border-right-width: 0;
}
.listing2 p{
	font-family: Red Hat Display;
font-size: 28px;
font-weight: 400;
line-height: 39px;
letter-spacing: 0em;
text-align: left;

}
.listing2 img{
	width:128px;
	height:128px;
}
.text2{
		font-family: Red Hat Display;
		font-size: 30px;
		font-weight: 500;
		letter-spacing: 0em;
		text-align: center;
		padding-top:112px;
		padding-bottom:75px;
		margin:0 auto;
}
.text3{
	font-family: Red Hat Display;
	font-size: 54px;
	letter-spacing: 0em;
	text-align: center;margin:0 auto;
	padding-bottom:86px;
		
}
.weekbox-container{
	display:flex;
	flex-wrap:wrap;
	gap:16px;
}
.weeksimg{
	    width: 198px;
    height: 198px;
    background-position: center;
    background-size: cover;
    border-radius: 12px;
}
.weekbox{
	background: #EAF3FF;
	padding:9px;
	display:flex;
	gap:78px;
	align-items:center;
	width:calc(50% - 20px);
	border-radius:14px;
	font-family: Red Hat Display;
}
.weekbox h3{
	
font-size: 30px;
font-weight: 700;
	
}
.weekbox h4{
font-size: 20px;
font-weight: 600;
padding: 20px 0;
	
}
.weekbox p{
font-size: 18px;
font-weight: 400;
	
}
.weekbox p span img{
	margin-bottom:4px;
}
#content {
 display:none;
  transition: display 0.3s ease;
}
.text4{
	font-family: Red Hat Display;
font-size: 30px;
font-weight: 500;
line-height: 42.75px;
letter-spacing: 0em;
text-align: center;
	
}
.sliderbtnsblack{
	padding-bottom:160px;
}
.instructor{
	padding:130px 0 204px 0;
	display:flex;
	gap:40px;
	font-family: Red Hat Display;
letter-spacing: 0em;
align-items:center;
text-align: left;color: #161D29;
	
}
#trigger{
	padding-top:90px;
}
#scrolling-bottom-div{
	margin-top:98px;
}
.slider{
	padding-top:152px; 
}
.morebutton{
	margin-top:102px;
}
.instructor h2{
	
font-size: 40px;
font-weight: 700;
line-height: 57px;padding-bottom: 37px;
}
.instructor p{
font-size: 24px;
font-weight: 400;
line-height: 34px;
	
	
}
.qariImg{
	height: 567px;
    background-size: cover;
    background-position: center;
    min-width: 450px;
    border-radius: 20px;background-repeat:no-repeat;
    
}
.text5{
	font-family: Red Hat Display;
	font-size: 30px;
	font-weight: 500;
	line-height: 42.75px;
	letter-spacing: 0em;
	text-align: center;
	color:#191B3C;	
	padding-bottom:62px;
}
.instructorMob{
	padding:0 34px;
}
.qariIntro{
	display:flex;
	align-items:center;
	gap:20PX;
}
.qariIntro div h2{
	font-family: Red Hat Display;
font-size: 16px;
font-weight: 700;
line-height: 19px;
letter-spacing: 0em;
text-align: left;
	
}
.qariIntro div p{
	font-family: Red Hat Display;
font-size: 12px;
font-weight: 500;
line-height: 15px;
letter-spacing: 0em;
text-align: left;

	
}
.qariDesc{
	font-family: Red Hat Display;
font-size: 18px;
font-weight: 400;
line-height: 26px;
letter-spacing: 0em;
text-align: left;padding-top:32px;padding-bottom:76px;
color:#323232;
	
}
.qarimob{
	width:125px;
	height:125px;
	border-radius:100%;
	background-size:cover;
	background-repeat:no-repeat;
}
.row10{
		margin:0 190px 30px 190px;
	
}
.collapsible {
    cursor: pointer;
    outline: none;
    padding: 57px 67px;
    BORDER-RADIUS: 23PX;
	border: 1px solid #5479B5;
	font-family: Red Hat Display;
	font-size: 24px;
	font-weight: 600;
	line-height: 36px;
	letter-spacing: 0px;
	text-align: left;
	color:#191B3C;
	background:#fff;
	    width: 100%;
}
.Qactive{
	font-weight:700;
}
.collapsible:focus {
	 outline: none;
}
.collapsible:after {
  content: url("data:image/svg+xml,%0A%3Csvg width='29' height='29' viewBox='0 0 29 29' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26.8945 13.8047L2.00038 13.8047' stroke='%23161D29' stroke-width='2.5' stroke-linecap='round'/%3E%3Cpath d='M15.0957 2L15.0957 26.8942' stroke='%23161D29' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
  float: right;
  margin-left:5px;
}

.Qactive:after {
 content: url("data:image/svg+xml,%0A%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.9512 8.34766L8.34835 25.9505' stroke='%23161D29' stroke-width='2.5' stroke-linecap='round'/%3E%3Cpath d='M9.25977 8.34375L26.8626 25.9466' stroke='%23161D29' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.answer {
    visibility: hidden;
    max-height: 0;
    overflow: hidden;
    transition: height 200ms;
    font-family: Red Hat Display;
font-size: 24px;
font-weight: 400;
line-height: 47px;
letter-spacing: 0px;
text-align: left;
    background: #EAF3FF;
     padding: 57px 67px;
    BORDER-RADIUS: 23PX;
    MARGIN-TOP: -89PX;
  
}
.whitelogoclasses{
margin:50px 42px;
Width:245px;
Height:30.77px;
}
@media (max-width:768px){
	#trigger{
	padding-top:64px;
}
	.morebutton{
		margin-top:30px;
	}
	.heading1{
		font-family: Red Hat Display;
		font-size: 38px;
		font-weight: 700;
		line-height: 46px;
		letter-spacing: 0em;
		text-align: center;
		padding-top:54px;
				
		}
		.slide{
			width:354px;
			height:354px !important;;
		}
		.slide > .card-h{
		padding-top:32px;
		}
		.slide > .commenter{
			font-size:14px;
			line-height:31px;
		}
		.slide > .comment{
		    padding: 24px 0;
		}
		.text1
		{
			font-family: Red Hat Display;
			font-size: 16px;
			font-weight: 400;
			line-height: 22px;
			letter-spacing: 0em;
			text-align: center;
			padding:42px 0;
		}
		.appbtn{
			margin-top:42px;
		}
		.classDate{
			font-family: Red Hat Display;
		font-size: 20px;
		line-height: 27px;
			padding: 28px;
			gap:18px;
		    margin-top: 42px;
		}
		.btncontainer{
			display:none;
		}
		.specslider{
			margin: 47px 15px 32px 15px; 
			gap:12px;      
		}
		.specslider img{
			    width: 180px;
		    height: 228px;
		}
		.heading2{
			padding : 56px 0;
			margin:0 auto;
			font-size: 22px;
			line-height: 26.4px;
		}
		.heading2 span{
			font-family: Red Hat Display;
			font-size: 38px;
			line-height: 46px;
			letter-spacing: 0em;
			text-align: center;
			
		}
		.section2{
			padding: 0 35px;
		}
		.listdivider{
			border: 0.25px solid #5479B5
		}
		.listing2mob{
			padding:28px 0;
			display:flex;
			gap:35px;
		}
		.cardlistingMob{
		    padding-bottom: 4px;
		}
		.listing2mob img{
			width:74px;
			height:74px;
		}
		.listing2mob p{
			font-family: Red Hat Display;
			font-size: 20px;
			font-weight: 700;
			line-height: 26px;
			letter-spacing: 0em;
			text-align: left;
			font-weight:400;
			
		}
		.listing2mob p span{
			font-weight:700;
		}
		.text2{
			font-size:22px;
			font-weight:500;
			padding-top:75px;
			padding-bottom:30px;
		}
		.text3{
			font-size:22px;
			padding-bottom:34px;
		}
		.weeksimg{
			Width:102px;
			    min-Width: 102px;
			Height:105px;
			border-radius:12px;
			background-size:contain;
			background-repeat:no-repeat;
			background-position:center;
		}
		.weekbox-container{
			gap:12px;
			margin:0 14px;
		}
		.weekbox{
			padding:4px;
			gap:20px;
			width:100%;
		}
		.weekbox h3{
			
			font-size: 16px;
			font-weight: 700;
				
		}
		.weekbox h4{
			
			font-size: 14px;
			font-weight: 600;
			padding-top:20px;
			padding-bottom:8px;
			color:#5479B5
			
		}
		.weekbox p{
			
			font-size: 10px;
			font-weight: 400;
            color: #5479B5;

			
		}
		.text4{
			font-size: 24px;
			font-weight: 700;
			text-align: center;margin-bottom: 54px;
			
		}
		.text5{
			font-family: Red Hat Display;
			font-size: 24px;
			font-weight: 700;
			line-height: 34px;
			letter-spacing: 0em;
			text-align: center;
			padding-bottom:54px;
		}
		.row10{
			margin:10px 34px;
	
		}
		.collapsible {
		    cursor: pointer;
		    outline: none;
		    padding: 32px 23px;
		    BORDER-RADIUS: 23PX;
			border: 1px solid #5479B5;
			font-family: Red Hat Display;
			font-size: 16px;
			font-weight: 600;
			line-height: 19.2px;
			letter-spacing: 0px;
			text-align: left;
			color:#191B3C;
			background:#fff;
			display:flex;
			align-items:baseline;
			    justify-content: space-between;
			    width: 100%;
		}
		.Qactive{
	font-weight:700;
}
		.collapsible:after {
		  content: url("data:image/svg+xml,%0A%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.9316 6.77734L1.01348 6.77734' stroke='%23191B3C' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M7.28125 1L7.28125 13.1875' stroke='%23191B3C' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
		  margin-left:5px;
		}
		
		.Qactive:after {
		 content: url("data:image/svg+xml,%0A%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3398 13.1797L4.91243 4.56182' stroke='%23191B3C' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M13.3398 5.00879L4.91243 13.6267' stroke='%23191B3C' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");;
		}
		.answer{
			font-family: Red Hat Display;
			font-size: 16px;
			font-weight: 400;
			line-height: 22px;
			padding: 32px 23px;
    		MARGIN-TOP: -51PX;
		}
		.whitelogoclassesmob img{
			width:175px;
			height:22px;
		}
		.whitelogoclassesmob{
        margin: 89px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
		}
}