.container.class_learning_section {width: 100% !important;
    background-image: url('../images/Why English grammar banner.png');
    height: 100%;background-position: top center;background-repeat: no-repeat;
    background-size: 100%;min-height: 500px;}

p.learning_kits {font-size: 23px;color: #00115A;font-weight: 600;font-family: metropolis medium;
    line-height: 1.25;letter-spacing: 0.5px;margin-bottom: 0px;text-align: left;padding: 0 32px;
	position: relative;right: 14px;top: 15px;max-width: 25em;}
p.learning_comm {font-size: 24px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-left: 5%;
    margin-top: 23px;}
	
.slide_btn.blue, .clone.right .slide button{box-shadow: 4px 4px 4px #ccc;background-color: #8D5EFC; background-image: linear-gradient(to right, #8D5EFC , #737CFC);color:#ffffff;padding: 30px 0px 30px 0px;width: 80%;border-radius: 20px;font-size:25px;}
.rel-margin{margin-top:25%;}
.rel-margin2{margin-top:0%;}
.related_topic_heading {position: relative;font-weight: bold;float: left;left: 55px;
    font-size: 26px;color: #ffffff;font-family: metropolis bold;top: 65px;}

.slide_li_1{background-color: #F76C67;color: #ffffff;padding: 16px 85px;border-radius: 30px;font-size: 21px;box-shadow: 4px 4px 15px #ccc;}
.slide_li_2{background-color: #F97D63 ;color: #ffffff;padding: 16px 78px;border-radius: 30px;font-size: 21px;box-shadow: 4px 4px 15px #ccc;}
.slide_li_3{background-color: #FB8C60;color: #ffffff;padding: 17px 73px;border-radius: 30px;font-size: 21px;box-shadow: 4px 4px 15px #ccc;}
.slide_li_4{background-color: #FFB56C ;color: #ffffff;padding: 16px 70px;border-radius: 30px;font-size: 21px;box-shadow: 4px 4px 15px #ccc;}
.clone.right div button.red, .clone div button.parts_of_speechbutton.active, button.slide_btn.notactive{background-color: #FD8A75; background-image: linear-gradient(to right, #FD8A75 , #F6616A);color:#ffffff;}
button.slide_btn.notactive:hover{background-color: #FD8A75; background-image: linear-gradient(to right, #FD8A75 , #F6616A);color:#ffffff;}

img.card-img-top-related {width: 90%;margin-left: 4%;margin-right: 4%;}
img.card-img-top {width: 82%;cursor: pointer;}

#parts_of_speech{display:none;}
ul#parts_of_speech li{margin-top: 30px;}
a.slide_li_1:focus, a.slide_li_1:hover{font-size: 23px;padding: 20px 85px;transform: scale(1.1);color: #fff!important;text-decoration: none!important;}
a.slide_li_2:focus, a.slide_li_2:hover{font-size: 23px;padding: 19px 78px;transform: scale(1.1);color: #fff!important;text-decoration: none!important;}
a.slide_li_3:focus, a.slide_li_3:hover{font-size: 23px;padding: 20px 71px;transform: scale(1.1);color: #fff!important;text-decoration: none!important;}
a.slide_li_4:focus, a.slide_li_4:hover{font-size: 23px;padding: 18px 67px;transform: scale(1.1);color: #fff!important;text-decoration: none!important;}
#main.wrapper{background-color: #fff;}	
       	

.elearn_content {width: 53%;margin-left: 6%;margin-top: 3%;}
beginner{position: relative;
    right: 2px;}
	.advanced{position: relative;
    left: 0px;}
    .related_topics_section a.lSPrev{top: 48%!important;}
	.demo div a.lSPrev{top: 42px;left: 0px;}
.related_topics_section a.lSNext{top: 48%!important;}
.demo div a.lSNext{top: 42px !important;right: 0px !important; }
.lSAction > a {background-image: none !important;}
    .slide_btn.red, .slide button{box-shadow: 4px 4px 4px #ccc;background-color: #8D5EFC; background-image: linear-gradient(to right, #8D5EFC , #737CFC);color:#ffffff;padding: 30px 0px 30px 0px;width: 80%;border-radius: 20px;font-size:25px;}
	
.lslide.active{}
img { }

.related_topics_section div h1.class_heading {font-size: 34px;color: #4B4B4B;font-family: metropolis bold; padding-bottom: 0px;margin-bottom: 0px;margin-top: 37px;}
.your_classroom div h1.class_heading {font-size: 34px;color: #4B4B4B;font-family: metropolis bold;padding-bottom: 37px;margin-bottom: 0px;}
#beginner_lessons div h1.class_heading {font-size: 34px;color: #4B4B4B;font-family: metropolis bold;padding-bottom: 37px;margin-bottom: 0px;}
#intermediate_lessons div h1.class_heading {font-size: 34px;color: #4B4B4B;font-family: metropolis bold;padding-bottom: 37px;margin-bottom: 0px;}
.beginner_head{margin-bottom:3%;}	
.demo ul{list-style: none outside none;padding-left: 0;margin: 0;}
.demo ul#parts_of_speech li{padding: 15px;}
.demo ul#parts_of_speech li:hover{transform: scale(1.0);}
.demo .item{margin-bottom: 60px;height: 110px !important;}
.demo .content-slider li{text-align: center;color: #FFF;}
.demo .content-slider h3 {margin: 0;padding: 70px 0;}
.demo{width: 84%;margin: 0 auto;height: 110px !important;}	
/*ul.lSPager.lSpg {display: none !important;}*/
ul.content-slider{height: 500px !important;}
.learning_why{color: #ffffff;
    font-size: 50px;
    font-family: metropolis bold;
    margin-top: 22px;
    margin-bottom: 2px;
    margin-left: 10px;} 
.learning_eng_grammer{color:#ffffff;font-weight:bold;font-size:50px;margin-top: 0px;font-family: metropolis bold;margin-left: 17px;} 
.learning_comm{color:#ffffff;} 


.lavel_head_text{position: absolute;bottom: 0em;color: #fff;width:90%;}
.lavel_head_text h1.box{background-color: #ffffff;width: 65%;margin: 0 auto;padding: 22px 15px 22px 15px;border-radius: 20px;color: #000000;box-shadow: 3px 10px 15px -7px #cccccc;font-size: 23px;font-weight: bold;cursor: pointer;}

.lSSlideWrapper{text-align:center;}
a.lSPrev {font-size: 34px;font-weight: 800;opacity: 1;}
a.lSNext {font-size: 34px;font-weight: 800;opacity: 1;width:20px;}
.level_beginner{color:#FCA038!important;}
.level_intermediate{color:#F36567!important;}
.level_advanced{color:#1BA3ED!important;}
div#related_topic-slider {min-height: 200px;}
.related_topics_section a.lSNext{right: 10px;}
.right div button.deactive{box-shadow: 4px 4px 4px #ccc;background-color: #8D5EFC; background-image: linear-gradient(to right, #8D5EFC , #737CFC);color:#ffffff;padding: 30px 0px 30px 0px;width: 80%;border-radius: 20px;font-size:25px;}

/*popup UI*/
#adv-overlay-popups1{
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 6%;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 100;
    cursor: pointer;
  }
  #share-text{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 50px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
  }
  .share-text-inner{color: #000;font-family: metropolis;background-color: #fff;border-radius: 30px;cursor: pointer;padding-right: 100px;width: 540px;padding: 8% 2%;font-size: 20px;text-align: center;float:left;}
  .sharetitle h2{margin-top: 0;color: #4B4B4B;font-family: metropolis;font-weight: bold;}
  .title-message-top{float: left;width: 100%;}
  .title-message-top p{font-family: metropolis;font-size: 17px;color: #A9ABAD;line-height: 0.8;}
  .shareclsbtnclose{position: absolute;
      font-size: 20px;
      text-align: right;
      width: 45%;
      top:1px;
      color:#454545;
      background: none;
  }
  .shareclsbtnclose i.fa.fa-close{padding: 2%!important;}
  button.shareclsbtnclose:hover{ background: none!important;color:#454545;-webkit-box-shadow: unset !important;-webkit-box-shadow: unset !important;font-size: 20px;}
  .buynowimg{width: 60%;margin-bottom: 6%;}
  .viewpack{
  width: 32%;
  margin: 0 auto; 
  text-align: center;
  padding: 2.5% 2% 5.5% 2%;
  background: #1374fc;
  color: #fff;
  margin-top: 8%;
  }
  .main_text_popup{color: #4B4B4B;position: relative;text-align:center;font-family: metropolis bold;}
  .popupsatfix-screen{overflow:hidden;height:100vh;}
  .popupsatfix-close{overflow:visible;height:100%;}
  .close {
      color: #4b4b4b;
      float: right;
      font-size: 28px;
      font-weight: bold;
      opacity: 1;
  }

/*popup ends here */


	

@media screen and (max-width: 991.98px) and (min-width: 768px){
.elearning {margin-top: 0;}
.container.class_learning_section {background-image: url(../images/Why English grammar banner.png);height: 100%;background-size: 100%;min-height: 25em;}

.slide button:hover{
	background-color: #EB98DA ;
    background-image: linear-gradient(to right, #EB98DA  , #AF79FA);
 }	
 .beginner {
    position: relative !important;
    right: 5px !important;
    top: 15px !important;
}
.demo div a.lSNext {
    top: 27px !important;
    right: -2px !important;
}

.classroom:hover {
    transform: none !important;
}

.slide button {
    padding: 25px 0px 25px 0px !important;
    width: 80% !important;
    font-size: 16px !important;
}
.related_topics_section a.lSNext {
    top: 30%!important;
    /* left: 0; */
}
.related_topics_section a.lSPrev {
  top: 30%!important;
}
.rel-margin{margin-top:40% !important;}
footer#colophon {
    margin-top: 0 !important;
}
.demo {width: 92% !important;}
    .slide_li_1 {padding: 16px 30px !important;font-size: 18px !important;}
    .slide_li_2 {padding: 16px 28px !important;font-size: 18px !important;}
    .slide_li_3 {padding: 16px 28px !important;font-size: 18px !important;}
    .slide_li_4 {padding: 16px 28px !important;font-size: 18px !important;}
    .related_topic_heading {
        position: relative!important;float: left!important;left: 33px!important;font-size: 17px!important;top: 48px !important;}
.intermediate {
    /* margin-right: 19%!important; */
    position: relative;
    top: 16px;
    right: 7px;
}	

.advanced{position: relative;
    left: -8px;
    top: 15px;}
.beginnersectionhide{display:none;}
img.card-img-top {
    width: 100% !important;
    cursor: pointer;
}
.lavel_head_text h1.box{width: 80% !important;padding: 20px 10px 20px 10px !important;}
.elearn_content {width: 90% !important;margin-left: 27%;margin-top: 3%;}
.learning_why {font-size: 30px;margin-top: 0;margin-bottom: 2px;margin-left: 13px;}
.learning_eng_grammer {font-size: 30px;margin-top: 0px;margin-left: 17px}
p.learning_kits {font-size: 18px;width: auto;max-width:27em;top: 0;}
p.learning_comm {font-size: 18px;letter-spacing: 1px;margin-left: 5%;margin-top: 8px;}
	

.demo div a.lSPrev {
    top: 30px !important;
    left: 0px!important;
}
img.card-img-top-related {width: 90%;margin-left: 0%;margin-right: 4%;}
#adv-overlay-popups1{top:0;}
    #share-text {top: 36%;left: 42%;bottom: 0;right: 0;}

}

@media screen and (max-width: 767px){
	.elearn_content {margin-top: 10%;}
	.container.class_learning_section {width: 100% !important;background-image: url('../images/English_Grammar_Mobile.png');
		background-position: top center;
		background-repeat: no-repeat;
		background-size: 100%;min-height: 60em;height: auto;}
	.intermediatesectionshow{display:none!important}
	.advancedsectionshow{display:none!important}
		
	.beginnersectionshow{display:block !important;margin-top: 40px;}
	.classroom:hover{transform: none!important;}

	.lavel_head_text h1.box {width: auto;max-width: 10em;margin: 0 auto;padding: 22px 15px 22px 15px;border-radius: 20px;font-size: 23px;}
	.classroom img.card-img-top{width: auto;max-width: 23em;margin: 0 auto;}
	#content-slider li{}	 
	.slide_btn.blue, .clone.right .slide button{font-size: 20px !important;}
	.demo div a.lSPrev{}
	.lSAction > a{}
	.lSAction > a img{}
	.demo div a.lSNext{}
	.slide_li_1{padding: 16px 47px!important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_2{padding: 16px 39px!important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_3{padding: 16px 32px!important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_4{padding: 16px 32px!important;box-shadow: 0px 0px 8px #ccc!important;}
	.related_topic_heading {left: 16%;top: 3em;}
	ul#parts_of_speech li {

		margin-top: 25px!important;

	}

	.rel-margin {
		margin-top: 80%!important;
	}

	.classroom{margin-bottom: 35px;}
	
	.elearn_content {
    width: 100% !important; 
    margin-left:0;
   
}
.slide_li_1{padding: 16px 48px;}
.slide_li_2{padding: 16px 40px;}
.slide_li_3{padding: 16px 40px;}
.slide_li_4{padding: 16px 40px;}
.slide_li_1:focus{padding: 16px 48px !important;}
.slide_li_2:focus{padding: 16px 40px !important;}
.slide_li_3:focus{padding: 16px 40px !important;}
.slide_li_4:focus{padding: 16px 40px !important;}
/* .demo{height: 300px !important;} */

.classroom{margin-bottom: 50px;}
.elearn_content {
    position: relative;
    right: 0em;
}
.learning_why {
    color: #ffffff;
    font-size: 33px;
    font-family: metropolis bold;
    margin-top: 22px;
    margin-bottom: 2px;
    text-align: center;
}
.learning_eng_grammer {
    color: #ffffff;
    font-weight: bold;
    font-size: 33px;
	margin-top: 0px;
	margin-bottom: 0px;
    font-family: metropolis bold;
    text-align: center;
}
p.learning_kits {
	font-size: 15px;
    color: #00115A;
    font-weight: 600;
    font-family: metropolis medium;
    line-height: 1.25;
    letter-spacing: 0.5px;
    margin-bottom: 0px;
    text-align: center;
    padding: 0 16px;
    position: relative;
    left: 0;   
    top: 5px;
	max-width: 80%;
    margin: 0 auto;
   
}
p.learning_comm {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    /* margin-left: 5%; */
    margin-top: 30px;
    padding: 0 57px;
    text-align: center;
    position: relative;
    bottom: 21px;
}
.elearning{margin-top: 0px;}

.slide_btn:hover {
    background-image: linear-gradient(to right, #EB98DA , #AF79FA) !important;
}
button.slide_btn.notactive {
    background-color: #FD8A75 !important;
    background-image: linear-gradient(to right, #FD8A75 , #F6616A) !important;
    color: #ffffff !important;
}

#adv-overlay-popups1 {position: fixed;display: none;width: 100%;height: 100%;top: 0px;left: 0;right: 0;/* bottom: 0; */}
  #share-text {top: 3%;left: 10%;right: 0;margin: 0 auto;margin-left: 0;
    font-size: 30px;transform: inherit;}
    .share-text-inner{width: 90% !important;}
        .main_text_popup{font-size: 24px;}	
}
@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */ 
    #share-text{top:3%;left: 8%;}

  }
 @media screen and (min-width: 576px) and (max-width: 767px)
 {
	.container.class_learning_section {background-image: url('../images/Why English grammar banner.png');height: 100%;background-size: 100%;min-height: 18em;margin-top: 1.5em;}	
	.elearn_content {top: 1em !important;left: 0;right: unset !important;margin-top:0;}
	p.learning_kits {font-size: 15px;line-height: 1.2;margin-bottom: 0px;text-align: left;
top: 8px !important;padding: 0 18% 0 0;margin-left: 3%;}
	p.learning_comm {margin-top: 1em !important;bottom: 0 !important; text-align: left;margin-left: 0;padding: 0 2.3em;}
	.learning_why {font-size: 25px;margin-top: 0;margin-bottom: 2px;text-align: left;    margin-left: 15px;}
    .learning_eng_grammer {font-size: 25px;margin-top: 0px;text-align: left;}
    
    .share-text-inner{width: 90%;}
        .main_text_popup{font-size: 24px;}
	
	
	
 
 }
 
 @media screen and (min-width: 593px) and (max-width: 645px)
 {
	.slide_li_1{padding: 16px 1.2em !important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_2{padding: 16px 1em !important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_3{padding: 16px 1em !important;box-shadow: 0px 0px 8px #ccc!important;}
	.slide_li_4{padding: 16px 1em !important;box-shadow: 0px 0px 8px #ccc!important;}
 
 }
@media screen and (min-width: 451px) and (max-width: 575.98px)
 {
	.container.class_learning_section {height: auto;min-height:50em;}
	.elearn_content {margin-top:6%;}
	
	
		
 }
 @media screen and (min-width: 361px) and (max-width: 450.98px)
 {
	.container.class_learning_section {height: auto;min-height:40em;}
	.elearn_content {margin-top:6%;}
	.related_topic_heading {left: 16%;top: 2.5em;}
	
		
 }
 @media screen and (max-width: 360.98px)
 {
	.container.class_learning_section {height: auto;min-height:33em;}
	.elearn_content {margin-top: 5%}
	.learning_why , .learning_eng_grammer {font-size: 28px !important;}
	.related_topic_heading {left: 16%;top: 2em;}
	p.learning_kits {font-size: 15px;text-align: center;padding: 0 8px;top: 5px;
    max-width: 100%;margin: 0 auto;}
		
 }

 @media screen and (max-width: 1199.98px) and (min-width: 992px){
	.container.class_learning_section {min-height: 30em;}
    .learning_why{font-size: 5vh;margin-left:13px;}
    .learning_eng_grammer{font-size:5vh;margin-left: 15px;}
    .elearning{margin-top: 0 !important;}
    p.learning_kits{font-size: 20px; top:0 !important;width: 75%;}
    p.learning_comm{font-size: 21px;margin-top: 16px;}
    .elearn_content {width: 70%;margin-left: 20%;margin-top: 3%;}
    .classroom:hover {
        transform: none !important;
    }
    
    .rel-margin {
        margin-top: 30% !important;
    }
    .related_topics_section a.lSNext {top: 40%!important;}
    .related_topics_section a.lSPrev {top: 40%!important;}
  .related_topic_heading {
    position: relative !important;
    font-weight: bold;
    float: left;
    left: 46px !important;
    font-size: 26px;
    color: #ffffff;
    top: 60px !important;
}
    .slide_li_1 {padding: 16px 50px !important;font-size: 18px !important;}
    .slide_li_2 {padding: 16px 50px !important;font-size: 18px !important;}
    .slide_li_3 {padding: 16px 50px !important;font-size: 18px !important;}
    .slide_li_4 {padding: 16px 50px !important;font-size: 18px !important;}

    .slide button {
        padding: 30px 10px 30px 10px !important;
        width: 80% !important;
        border-radius: 20px;
        font-size: 20px !important;
    }
    #adv-overlay-popups1{top:0;}
    #share-text{top:20%;}
 }
 
 
 

/*safari UI */
@media not all and (min-resolution:.001dpcm) { @media
        {
			.elearning{margin-top:0 !important;}
		}}
/*safari UI ends*/


.grammer_title.lslide {
    min-height: 380px;
}
.box.rtopic_head {
    width: 100%;
    margin: 0 auto;
	color: #4B4B4B;
    text-align: center;
    font-size: 22px;
	font-family: Metropolis Bold !important;
}



/* img.level1:hover{
	transform: scale(1.14);
} */
/* img.level2:hover{
	transform: scale(1.14);
} */
/* img.level3:hover{
	transform: scale(1.14);
} */
#parts_of_speech_intm{display:none;}
.demo ul#parts_of_speech_intm li {
    padding: 15px;
}
ul#parts_of_speech_intm li {
	margin-top: 30px;}
.classroom:hover{transform: scale(1.14);}



@media only screen and (max-width: 1320px) and (min-width: 1260px){
	.rel-margin{margin-top:29%;}
	.container.class_learning_section{min-height:460px;}
}


@media only screen and (max-width: 1800px) and (min-width: 1601px){
	.container.class_learning_section{min-height:545px;}
	.elearn_content{margin-left:2%;}
	.learning_why{font-size:65px;margin-top:41px;}
	.learning_eng_grammer{font-size:65px;margin-left:10px;}
	p.learning_kits{font-size: 30px;}
	p.learning_comm{font-size: 28px;margin-left: 4%;margin-top: 26px;}
	.your_classroom div h1.class_heading{font-size: 45px;margin-top: 50px;}
	.slide_li_1{padding: 20px 80px;font-size: 25px;}
	.slide_li_2{padding: 20px 74px;font-size: 25px;}
	.slide_li_3{padding: 20px 70px;font-size: 25px;}
	.slide_li_4{padding: 20px 68px;font-size: 25px;}
	#beginner_lessons div h1.class_heading{font-size: 45px;margin-top: 70px;}
	.related_topics_section div h1.class_heading{font-size: 45px;margin-top: 100px;}
	.slide button{font-size: 28px;}
	.slide_btn.blue, .clone.right .slide button{font-size: 28px;}
	.lavel_head_text h1.box{font-size: 28px;}
	.box.rtopic_head{font-size: 26px;}
}
#related_topic-slider_mobile{display:none;}

@media only screen and (min-width: 100px) and (max-width: 767px) {
	#related_topic-slider_mobile{display:block !important;}#related_topic-slider{display:none !important;}
	.related_topic_heading {left: 30%;top: 2.3em;}
	img.card-img-top-related {width: 100%;margin-left: 0 !important;margin-right: 0%;max-width: 25em;/*margin-top: 10%;*/}
	.column.col-md-4.grammer_title.lslide.active {margin-left: 1.1%;}
	.lSAction > a {background-image: none;}
}
@media only screen and (max-width: 592px) {
	.column.col-md-4.grammer_title.lslide.active {margin-left: 0%;}
	.related_topic_heading {left: 25% !important;top: 2.5em !important;}
	.box.rtopic_head {margin-left: 0%;font-size:18px;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .related_topic_heading {left: 36px!important;font-size: 16px!important;top: 43px !important;}
	.related_topics_section a.lSPrev {top: 31%!important;left: -4px;}
	.related_topics_section a.lSNext {right: 0.5%;margin-top: -1.8%;}
}

@media only screen and (min-width: 593px) and (max-width: 767px) {
	.related_topics_section a.lSPrev {top: 49%!important;left: -1% !important;}
	.related_topics_section a.lSNext {right: 0%;margin-top: -1.8%;}
	.lSAction > a {background-image: none;}
	img.card-img-top-related {width: 88% !important;}
	.related_topic_heading {/*left: 9%;*/top: 3.6em;padding-top: 12px;position: relative;font-size: 21px;}
	.box.rtopic_head {font-size: 18px;}
	.box.rtopic_head {margin-left: -9%;}
}
@media only screen and (min-width: 992px) and (max-width: 1023px) {
    .related_topic_heading {left: 50px!important;top: 51px !important;}
	.related_topics_section a.lSPrev {top: 40%!important;left: -4px;}
	.related_topics_section a.lSNext {right: 0.5%;margin-top: 2.2%;}
}
@media screen and (max-width: 1030px) and (min-width: 1024px)
    .related_topic_heading {left: 46px !important;font-size: 20px !important;top: 55px !important;}
}