@media screen and (max-width: 800px) 
{
   #headeHR {display:none;}    
   #headerLogo {display:none !important;}    
}

#header{   
   z-index:1;
   position:absolute;
}
#headeHR
{
  height: 1px;
  background-color: #10A5D6;  
  box-shadow: 0  1px 1px 0px #99CCFF;  
  padding-bottom:0;
  position:relative;
}


.imgMore{
  position:relative;
  vertical-align: middle;		
  bottom:0.1vw; 
  width: min(1.7vw, 15px);
  height:min(1.7vw, 15px);
  max-width:25px;
}

.sideNavBtn {
   background: white;      
   color: #0491FF;
}
.logoJR {
   color:rgba(255,255,255, 0.7);	
}

#headerContainer{
 position: relative;
 display: inline-block;
 font-weight:400;	
 color:white;
 width:100%;
}
#headerContainer .textHeader {
  font-weight:400;
  font-size:calc(0.9vw + 7px);  
}
.headerContainer {
  position: relative;
  text-align: center;
  color: white;
  margin:auto;
}
.headerContainer a:link{
  position:relative;
  display:inline-block;
  vertical-align:middle;
  top:0.1vw; 
}

#header a{
  color: white; 
}
#header a:link{
  color: white; 
}
#header a:hover{
  color:rgba(255,255,255, 0.8) ;
}
#header a:active{
  color: white; 
}
#header a.selected{
  color: white; 
}
#header .headerLogo a{
 color:white;	
}



.centered {
  width:100%;
  position: absolute;
  top: 75.5%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.btn2 {
/*  padding: 0.6vw calc(0.9vw + 4px) 0.6vw calc(0.9vw + 4px);   */
  padding: 7px 12px 7px 12px;
  color:white !important;
  background-color:rgba(255,255,255, 0.2) !important;
  font-family:Rubik;
  font-weight:400;
  text-align:center;
  border-radius: 6px;
}
.btn2:hover
{
  color:white !important;
  background-color:rgba(255,255,255, 0.3) !important;
}
.btn2:active {
  color:white !important;
  transform: translateY(4px) !important;
}

.downloadText {
  position:relative; 
  top:0.15vw;
}
.imgDownload {
  position:relative;
  vertical-align: middle;		
  width:2.5vw;
  height:2.5vw;
}
.downloadSection .btn2:hover
{
  color:white !important;
  background-color:rgba(0,0,0, 0.8) !important;
}
.downloadSection .btn2{
  background-color:#4D4D4D !important;
}
.btnDownload {	  
 color:white !important;
 font-size:calc(0.6vw + 11px);  
}
 .downloadBox {
  padding-top:calc(1.6vw + 0px);  
  display:flex;
  justify-content: center;  
 }  
.downloadBox .btn2 {	
  margin-left:calc(0.9vw + 1px);    
/*  padding: 9px 15px 5px 11px;*/
}

  .overlay
  {
	cursor:pointer;
    position: absolute; 
    border-radius: 17px;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background-color: rgba(0,0,0,0.3);
  }

  .pageContainerSection{
    width:100%;
	background-color:#F5F8FA;
	margin:auto;
  }

  .container {
    width:85%;
    display:flex;
	padding-top: 3.0vw;
	padding-bottom: 3.0vw;
	margin:auto;	
  }

  .containerDisplay
  {
	position:relative;
	left:0;
  }
  .containerText{
	width:38%;
	position:relative;
	left:0;
  }


  .container .textHeader {
    font-weight:bold;
    font-size:calc(1.3vw + 7px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
  }
  .textHeaderIcon {
    font-weight:bold;
    font-size:calc(0.7vw + 9px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
	text-align:center; 
	width:95%;  
	margin:auto;
  	padding-top:1.2vw;  	
  }

  .textHeaderBold {
    font-weight:bold;
    font-size:calc(0.7vw + 7px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
    margin-top:1vw;
  }

  .textSub {
    font-weight:400;
    font-size:calc(0.8vw + 5px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
    margin-top:1vw;
  }
  .textSub2 {
    font-weight:400;
    font-size:calc(0.8vw + 7px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
    margin-top:0.5vw;
  }
  .videoPlay {
	z-index:3;
	position:absolute; 
	left:47.8%;
	top:50%;
    width:100%;	
	
	cursor:pointer;
	display:block;
	width:7.5vw;
	height:7.5vw;
	max-width:75px;	
	max-height:75px;	
  }
  .containerSpacer
  {
	width:5%;
  }
  .BGContainer {
	box-shadow: 12px 12px 2px 1px #F5F8FA;  
  }  
  .mainImg{
    border-radius: 10px;
    z-index:1;
  }
  .greenText
  {
	margin-top:1.4vw;
    border-radius: 27px;
    width:fit-content;
    height:fit-content;
    background-color: #9BDAFF ; /*#C7FE86*/
    padding: 15px 30px 15px 30px;
    font-size:calc(0.5vw + 10px);  
    color: rgba(0,0,0,0.7);
    text-align:center;
    margin-bottom:15px;
  }  
  .rowSpacer{
	padding-top: 3.1vw;
  }
  .rowSpacerHeader{
	padding-top: 1.8vw;
  }

   .iconBoxes{
     display:flex;
     width:95%;	
     margin-top:1vw;
     margin-bottom:1vw;
  }

  .boxIcon{
    display: inline-block;
    position: relative;
    margin-left: 4vw;
    width: 20%;
    }
    
   .iconBox {
     width:70%;
     margin:auto;
     max-width:180px;
     padding:15px;
	 background-color:white; 
	 border-radius:50%;
	 box-shadow: 10px 10px 9px 0 #EAF0F3, 12px 14px 20px 0 #EAF0F3; 
   }
      
   .imgIcon {
     display:block;     
   }   
   
  .imgStarRecommend {
     max-width:20px;	
     max-height:20px;
     width:2.2vw;
     height:2.2vw;
  }
  .imgStar {
     max-width:27px;	
     max-height:27px;
     margin-left:5px;	
     margin-top:0.7vw;
     width:4vw;
     height:4vw;
  }
  .textHeaderSmall {
    font-weight:500;
    font-size:calc(0.3vw + 11px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
	text-align:left;
	width:100%;  	
  }
  .textSubSmall{
    font-weight:normal;
    font-size:calc(0.7vw + 10px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
	width:100%;  
  }
  .textBox {
	width:100%;
  }
  .text {
	text-align:justify;
    font-weight:normal;
    font-size:calc(0.3vw + 9px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
	padding-left:2%;	
  }
  .starsBox {
	width:87%; 
	text-align:left; 
	padding-left:0.6vw;
	padding-top:0.0vw; 
	padding-bottom:0.5vw;
   } 
   .arrowImgRecommend {
     max-width:38%;
     margin:21% 0 0 5%;     
   }  
   .arrowBoxBG
   {
     background-color:#DDE4E9; border-radius: 50%; width: 1.8vw; height: 1.8vw; margin:auto; text-align:center; min-width:25px; min-height:25px;     
     cursor:pointer;
   }
   .arrowBox {
	height:100%; margin:auto; width:5%;
   }
   .rightArrowBox {
	  display:none;
   }

   .rankBox {
	padding-top:4vw;
   }

	.messageInstr
	{
		width:fit-content;
		height:fit-content;
		color:white;
		padding:12px; 
		text-align:center; 
		background-color:#00B1FF; 
		font-family:Arial, Helvetica, sans-serif; 
		font-size:15px; 
		font-weight:400;
		direction: ltr;
		border-radius:10px;
		border-style: solid;
  		border-color: white;		
	}	

	@keyframes updownFirefox 
	{
	  from {top: 100x;}
	  to {top: 0px;}
	}


 @media screen and (min-width: 1201px)
  {	    				
   .resetPaddingContainerTop {
	 padding-top:0;	
   }
 }

 @media screen and (max-width: 1200px) 
  {	    				
	div[class^='container']{
      display:block;
      width:95%;
      margin:auto;
	}
	/*.personImg {*/
	.containerRecommend {
	   display:none !important;
	}
	.recommendAlter {
	   display:block;
	}	
	.textHeader {
	  margin-top:1vw;		
	}
	.reverseOrder .textHeader {
	  margin-top:2vw;		
    }
	.recommendAlter .textHeaderBold, .textSub2{
	   margin-left:0px;
	}	

	.paddingTextHeader {
	margin:auto;
	  text-align:left;
	  direction:ltr;
	  width:100%;
	}
	.reverseOrder {
      display:flex !important;
      flex-direction: column-reverse;
	}
	.limitHeader{
	   width:78% !important;
	}
	.textHeaderBold {
	  margin-top:2vw;		
	}
   .studentsBox {
      width:75% !important;
   }
   .adujstPaddingTop {
	 padding-top:0  !important;
   }
  .rankBox {
	padding-top:1.5vw;
	text-align:center;
	width:100%;
   }
   .starsBoxCenter {
	text-align:center;
	margin:auto;
   }
   .adjustPaddingBottom {
	padding-bottom:2vw;	
   }
 }

 @media screen and ((min-width: 886px) and (max-width: 1200px)) 
  {	    				
   .adjustWidth{
      width:95% !important;
	}
 }


  @media screen and (max-width: 885px) 
  {	    		
    .containerText{
      width:92%;
      display:block;
	}
	.adjustWidth {
      width:95% !important;
	  display:block;
      margin:auto !important;
	}
   .iconBoxes{
      width:100%;
      display:block;
      margin:auto;
	}
	
	.boxIcon{
      display:inline-table;
	  width:37%;
      padding:3vw;	  
	  margin-left:3.5%;
	}
	.iconBox{
	  width:50%;	
	  padding: 8px;
	  box-shadow: 5px 5px 4px 0 #EAF0F3, 6px 7px 10px 0 #EAF0F3; 	  
	}
	.iconBoxes .textSub {
	   width:85%;		
	   margin:auto;	
	}
	
  .boxRecommend {
	width:100%;
	padding-bottom:3vw;
  }
  .boxRecommendIn
  {
	width:91%; 
  }
  .text {
    font-size:calc(0.3vw + 10px);  
    color:black;
    color:rgba(0,0,0, 0.7);	
  } 
   .ajustWidth{
     display:flex !important;
     width:98% !important;
   }  	
 }