/*顶部及底部CSS*/
#bottomMenu{
	display: block;
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index:5;
}

#navMenu{
	height:2vh;
}

#myinput{
	color: black;
	    font-size: 100%;
	    border: 3px solid #c0dbed;
	    border-radius: 10px;
	    background-color: #f0f1f1;
	    text-align: center;
		width:12rem;
		height:4rem;
}

/*学校信息页*/
.siBanner{
	height: 20vh;
	background-color: #410d0d;
	
	color: white;
	text-align: right;
	object-fit: contain;
	font-size: 3rem;
	font-weight: 900;
	margin: 3rem;
	border-radius: 25px;
	box-shadow: 0 10px 10px 0 rgb(0 0 0 / 50%);
	padding: 12rem 1rem;
}

.siInfoWrapper{
	    padding: 3rem 3rem 1rem 3rem;
	    height: auto;
	    background-color: white;
	    text-align: center;
	    object-fit: contain;
	    font-size: 4rem;
	    font-weight: 900;
	    margin: 3rem;
	    border-radius: 25px;
	    box-shadow: 0 10px 10px 0 rgb(0 0 0 / 50%);
	    overflow: clip;
	    position: relative;
}

.siTitleWrapper{
	/* background-color: yellow; */
	text-align: left;
	display: flex;
	flex-direction: row;
	/* padding: 1rem; */
	justify-content: space-between;
}

.siTitle{
    font-size: 3.8rem;
	font-weight: 700;
	line-height: 150%;
	text-align: left;
	width: 60vw;
}

.siTitle2 {
    color: #555;
    font-size: 2rem;
    height: 1vh;
    text-align: left;
    overflow-wrap: anywhere;
    font-weight: 500;
    padding: 1rem 0rem 1rem 0rem;
    margin-bottom: 1rem;
    line-height: normal;
    display: inline;
}

.siLogo{
    height: auto;
       /* background-color: yellow; */
        display: inline-block;
        width: 25vw;
        text-align: center;
        object-fit: contain;
}

.siMotto{
	color: #999;
	font-size: 2rem;
	height: 5vh;
	text-align: left;
	overflow-wrap: anywhere;
	font-weight: 500;
	padding: 1rem 0rem 1rem 0rem;
	margin-bottom: 1rem;
}

.siTagWrapper{
	    width: 80vw;
	    /* 固定高度内置滚动*/
	    height: 30vh;
	    
	    /*全部展开高度*/
	    height: auto;
	    
	    display: flex;
	    flex-direction: column;
	    margin-bottom: 3rem;
		padding-bottom: 1rem;
		overflow:auto;
}
.siTagLine{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /*
	
	
	justify-content: space-between;
	*/
}
.siBrandFest{
	font-size: 2.5rem;
	height: fit-content;
	padding: 0px 10px 0px 10px;
}
.siBrandT1{
    vertical-align: middle;
    background-color: red;
    border-radius: 20px 0 0 20px;
    border: 3px solid red;
    padding: 5px 5px 5px 10px;
    color: white;
    margin-right: 0;
}

.siBrandT2{
    vertical-align: middle;
    background-color: white;
    color: red;
    border: 3px solid red;
    padding: 5px 10px 5px 5px;
    border-radius: 0 20px 20px 0;
    margin-left: 0;
}
.siTags{
	font-size: 2rem;
	background-color: #eee;
	margin-bottom: 2rem;
    max-width: 200px;
	padding: 10px 30px 10px 30px;
	font-weight: 500;
	border-radius: 15px;
}

.siRankingTag {
	font-size: 2.8rem;
	text-align: left;
	margin-top: 0.5rem;
	margin-bottom: 1.5rem;
	background-color: #fee3e3;
}

.siRankingKL{
    font-weight: 700;
    background-color: #fda1a4;
    vertical-align: middle;
    padding: 10px 20px 10px 20px;
    margin: 0 auto;
	display: inline-block;
}

.siRanking{
	font-weight: 500;
    color: #c97838;
    padding: 10px 20px 10px 20px;
    vertical-align: middle;
    background-color: #fee3e3;
	display: inline-block;
}


/*Part2 详情页*/
.siDetailWrapper {
    background-color: white;
    text-align: left;
    width: auto;
}

.siDetailNav{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	border-bottom: 3px solid #666;
}

.siDetailNavButton{
	font-size: 4rem;
	font-weight: 700;
}

.siDetailNavActive{
	border-bottom: 1rem solid red;	
}

.siProgramWrapper{	
    padding: 1rem 3rem 1rem 3rem;
	margin-top: 3rem;
}

.siProgramType{
	font-size: 3rem;
	font-weight: 700;
}

.siProgram{
	border: 3px solid #ccc;
	border-radius: 25px;
	height: auto;
	padding: 20px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 2rem;
}

.siProgramTitle{
	font-size: 3rem;
	font-weight: 500;
	padding-bottom: 1rem;
}

.siProgramDescribe{
	font-size: 2rem;
	font-weight: 500;
	color: #999;
}

.siProgramButton{
    vertical-align: middle;
    font-size: 3rem;
    font-weight: 500;
    background-color: #fb333e;
    color: white;
    border-radius: 50px;
    padding: 0.5rem 2.5rem 0.5rem 2.5rem;
    margin: 1.5rem 1rem 1rem 1rem;
}

.siSchoolOverviewWrapper{
	padding: 3rem;
	    margin-top: 3rem;
}

.siSchoolGrade{
		font-size: 3rem;
		display: flex;
		flex-direction: row;
		margin-bottom:3rem;
}

.siSchoolGradeTagLine{
    width: 70vw;
    display: flex;
    flex-direction: row;
    padding-left: 0rem;
	    
}

.siSchoolGradeTag{
    font-size: 2rem;
    background-color: #eee;
    vertical-align: middle;
    padding: 10px 30px;
    margin-left: 2rem;
}

.siSchoolGrad{
	    font-size: 3rem;
	    display: flex;
	    flex-direction: row;
	    margin-bottom: 3rem;
}

.siSchoolGradTag{
	font-size: 2rem;
	
	vertical-align: middle;
	padding: 10px 30px;
	margin-left: 2rem;
}

.siSchoolGradLine{
	display: contents;
}

.siHighChina{
	font-size:3rem;
}

.siNewsWrapper {
    padding: 3rem;
    margin-top: 3rem;
    font-size: 3rem;
    font-weight: 400;
}

.siNewsSection {
    display: flex;
    flex-direction: column;
    padding-bottom: 5rem;
    line-height: 6rem;
}

.siNewsTitle {
    font-weight: 700;
    padding-bottom: 3rem;
}



a.siNewsArticle{
       color: #333;
       border: 3px solid #aaa;
       border-radius: 45px;
       padding: 1rem;
       margin-bottom: 3rem;
       font-weight: 400;
       font-size: 2.8rem;
       display: flex;
		flex-direction: row;
       justify-content: space-between;
}

.articleLeft {
	text-align: center;
	    object-fit: cover;
    width: 30%;
}

.articleRight {
    width: 100%;
}

.articleImg{
	    display: block;
	    vertical-align: middle;
	    border: 0;
	    width: 100%;
	    height: 100%;
}
/*End of 详情页*/

.mobileNavTop{
	       width: 72vw;
	       /* background-color: #0f254d; */
	       /* left: 20%; */
		   background-color: white;
	       position: absolute;
	       left: 25%;
	       height: 120px;
	       max-height: 100px;
	       margin-top: 10px;
	       overflow-y: scroll;
	       overflow-x: auto;
	       overflow-y: hidden;
	       white-space: nowrap;
		   color: white;
		
}

.mobileNavBtn{
	    /* color: #0f254d; */
	    font-size: 300%;
	    font-weight: 700;
	    height: 100px;
	    max-height: 100px;
	    margin-right: 0px;
	    background-color: #f7f7f7;
	    padding: 10px 40px;
	    background-color: white;
	    color: #444444;
	    border-right: 5px solid white;
}



.mobileBtn{
	color: #2c7aca;
	font-size: 200%;
	font-weight: 600;
}

.bottomButton{
	background-color: #30bf46;
	    border: 1px solid #30bf46;
	    color: white;
	    font-size: 175%;
	    font-weight: 900;
	    border-radius: 75px;
	    height: 120px;
	    padding-top: 50px;
	
}

.bottomButton a{
	color: white;
	font-size: 300%;
	font-weight: 900;
}

/*品牌节和在线选择*/



.brandTag1{
	background-color: red;
	font-size:2.5rem;
	border-radius: 15px 0px 0px 15px;
	color: white; 
	padding-left: 5px;
	padding-right: 2px;
	border: 3px solid red;
}
.brandTag2{
	background-color: white; 
	color: red; 
	font-size:2.5rem;
	border-radius: 0px 15px 15px 0px; 
	padding-left: 5px;
	padding-right: 2px;
	border: 3px solid red;
}
.tagLeft{
	border-radius: 10px;
	padding:0rem; 
	font-size:50%; 
	font-weight: 800; 
	line-height: 200%; 
	background-color: white;
	display: inline-block;
	width: 65%
	}
	
.tagRight{
	    padding: 1rem;
	    background-color: #30bf46;
	    line-height: 3rem;
	    color: white;
	    font-size: 3rem;
	    text-decoration: none;
	    border-radius: 40px 0px 10px 0px;
	    position: absolute;
	    right: 0;
	    bottom: 0;
	}


.topPanel{
	padding-top: 20px;
	padding-bottom: 10px;
	display: flex;
	justify-content: space-between;
	width: 100%;
	float: left;
	margin: 0 auto;
	z-index: 10;
	background-color: white;
	width: 100vw;
	left: 0;
}

/*Side Filter*/
.filtedClass{
	text-decoration: underline;
}

.sidepanel  {
  width: 100%;
  position: fixed;
  z-index: 10;
  height: 0;
  bottom: 0;
  left: 0;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  

}

.sidePanelcontainer{
background-color: #2c7aca;
background-color: #f7f7f7;
opacity: 0.95;
border-radius: 25px;
height: 100%;
padding-top: 15%;
}

.sidepanel a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 300%;
  font-weight: 800;
  color: white;
  display: block;
  transition: 0.3s;
}

.topBut{
	background-color: white;
	border: 3px solid #444444;
	border-radius: 30px;
	color: #333333;
	padding: 20px 40px 20px 40px;
	margin-right: 30px;
	margin-left: 30px;
	margin: 0 auto;
	font-size: 300%;
}

.topButSelect{
	background-color: #ff000024;
	border: 3px solid red;
	border-radius: 30px;
	color: red;
	padding: 20px 40px 20px 40px;
	margin-right: 30px;
	margin-left: 30px;
	margin: 0 auto;
	font-size: 300%;
}


.sidepanel a:hover {
  color: greenyellow;
}

.sidepanel .closebtn {
  position: absolute;
  top: 50px;
  right: 25px;
  font-size: 1000%;
  color: black;
}

.sidepanel .clearbtn {
  position: absolute;
  top: 8rem;
  left: 25px;
  font-size: 300%;
  color: #2c7aca;
  text-decoration: underline;
}

.openbtn {
  font-size: 200%;
  font-weight: 800;
  line-height: 200%;
  cursor: pointer;
  /*background-color: antiquewhite;*/
  color: #2c7aca;
  padding: 10px 15px;
  border: none;
  background:rgba(99, 99, 99, 0);
  /*
  position: absolute;
  right: 0;
  bottom: 0;
*/
}

.openbtn:hover {
  background-color:#444;
}


.slideContainer{
	background-color: yellow:
}

.filterContainer{
	
	background-color: #f7f7f7;
	padding: 20px;
	text-align: center;
}

.filterButtonContainer{
	display: flex;
	justify-content: space-between;
}

.filterTitle{
	font-size: 400%;
	font-weight:900;
	padding:5%;
	text-align: left;
}

.filterSubmit
{
	    padding: 200 10 100 10;
	    width: 100%;
	    text-align: center;
	    display: flex;
	    justify-content: center;
}
.submitButton1
{	
	width: 50%;
	font-size: 300%;
	font-weight: 500;
	color: white;
	background-color: red;
	border-radius: 50px 0px 0px 50px;
	padding-right: 10px;
	margin-right: 0;
	line-height: 200%;
}
.submitButton2
{	
	width: 35%;
	font-size: 300%;
	font-weight: 500;
	color: white;
	background-color: #66cc00;
	border-radius: 0px 50px 50px 0px;
	padding-left: 10px;
	margin-left: 0;
	line-height: 200%;
}




.compBut{
	/*background-color: rgba(255,255,255,.5);*/
	padding: 15px;
	font-size: 300%;
	border: 3px solid;
	border-radius: 25px;
	width:50%;
}

.compUS{
	    background-image: url(../images/nationFlags/compUS2.png);
		background-repeat: no-repeat;
		background-position: bottom;
		background-size: cover;
		background-color: white;
		text-align: right;
		padding-right: 80px;
		padding-top: 60px;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, .4);
}

.compUK{
		  background-image: url(../images/nationFlags/compUK2.png);
		  background-repeat: no-repeat;
		  background-size: cover;
		  background-color: white;
		  padding-left: 80px;
		  padding-top: 60px;
		  text-align: left;
		  line-height: .5;
		  background-position: right;
		  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, .4);
	
}

.rightContent{
	    position: absolute;
	    right: 0;
		left:0;
	    top: 0;
		/*
	    height: 60vh;
		*/
}


.sticky {
  position: fixed;
  top: 6vh;
  width: 100%;
}

.sticky2 {
  position: fixed;
  top: 10vh;
  width: 100%;
}


.compHeader{
	display: flex; 
	justify-content: space-around; 
	padding-bottom: 10px;
	/*background-image: url("../images/nationFlags/usLogo.png");*/
}

.carnivalTable th{
	text-align: canter;
}
.carnivalHeader{
	text-align: center;
	line-height: 200%;
}

.carnivalTable table, th, td {
	border:1px none #0f254d;
	border-radius: 5px;
	color: #0f254d;
	line-height: 150%;
	font-weight: 800;
	padding-top: 2%;
	padding-bottom: 2%;
	font-size: 120%;
	padding-bottom: 10%;
}


.carnivalMonth{
	border:1px solid white;
	background-color: white;
	color: #2c7aca;
	font-weight: 800;
	font-size: 150%;
	line-height: 200%;
	margin-left: 2%;
	margin-right: 2%;
	padding-left: 2%;
	padding-right: 2%;
	margin-bottom: 0;
}

.carnivalMonth:hover{
	color: white;
	background-color: #2c7aca;
}

.carnivalMonthSelected{
	color: white;
	background-color: #2c7aca;
}

.schoolBlock:{
	height: 15%;
	background-color: yellow;
	font-weight: 900;
	font-size: 300%;
	margin-bottom: 5%;
	border-radius:20px;
}

.schoolLive{
	font-size: 300%;
	font-weight: 700;
}

.schoolTitle{
	font-size: 3.6rem;
	font-weight: 700;
	color:black;
	line-height: 120%;
}
.schoolTags{
	font-size: 50%;
	font-weight: 700;
	padding-bottom: 5rem;
}
.schoolCity{
	color: #aaa;
	padding: 5px;
		/*
	    padding: 5px;
	    border: 5px solid #EFA700;
	    border-radius: 10px;
	    color: #EFA700;
	    background-color: #EFA700;
	    color: white;*/
}
.stags{
	    font-weight: 400;
	    font-size: 100%;
	    color: #aaa;
	    padding: 5px;
	    line-height: 120%;
		display:inline-block;
}

.schoolType{
		color: #aaa;
		padding: 5px;
		/*
		border: 5px solid #0080ff;
	    border-radius: 11px;
	    color: #0080ff;
	    padding: 5px;
		*/
}
.school私立{
		color: #aaa;
		padding: 5px;
		/*
		border: 5px solid #0080ff;
	    border-radius: 11px;
	    color: #0080ff;
	    padding: 5px;
		*/
}

.school公办{
		
	   color: #aaa;
	   padding: 5px;
		
		/*border: 5px solid #66cc00;
	    border-radius: 11px;
	    color: #66cc00;
	    padding: 5px;*/
}

.school外籍{
	color: #aaa;
	padding: 5px;
	/*
	border: 5px solid #ff6666;
	    border-radius: 11px;
	    color: #ff6666;
	    padding: 5px;
		*/
}

.sideNav{
	
	background-color: #f7f7f7;
	position: absolute;
	left:0;
	top:0;
	/*
	height:60vh;
	*/
}

.sideNav a{
	font-size: 300%;
	 font-weight: 800;
	 color: white;
	 line-height: 300%;
	 margin-bottom: 5%;
}

.sideNav input{
	font-size: 200%;
	 font-weight: 400;
	 line-height: 270%;
	 background-color: black;
	/* margin-bottom: 5%; */
}

.sideNav button{
	font-size: 200%;
	 font-weight: 400;
	 line-height: 270%;
	 background-color: black;
	/* margin-bottom: 5%; */
}

.sideSelect{
	background-color: red;
	border:none;
	width: 100%;
	color: white;
	border-radius: 0px 10px 10px 0px;
}

.sideNormal{
	border: none;
	background-color: #f7f7f7;
	width: 100%;	
}

.sideNavContainer{
	background-color: #f7f7f7;
	padding: 40px 5px;
	padding-right: 30px;
	padding-left: 0px;
	position:relative;
}

.sideNavContainer:before{
	content : "";
	  position: absolute;
	  left    : 20%;
	  bottom  : 0;
	  height  : 3px;
	  width   : 50%;  /* or 100px */
	  border-bottom:5px solid darkgray;
}




.tableSearch {
	position: relative;
	padding-left:0;
	width: 70%;
	font-size: 300%;
	font-weight: 900;
	line-height:300%;
	color: #2c7aca;
	height:50%;
}

.tableSearchInput {
  width: 100%;
  border: 1px solid #ccc;
  padding: 10px 100px 10px 20px; 
  line-height: 1;
  box-sizing: border-box;
  outline: none;
  font-size: 100%; 
  border-radius:50px;
}
.tableSearchButton {
  position: absolute;
  right: 3px; 
  top: 3px;
  bottom: 3px;
  border: 0;
  background: red;
  color: #fff;
  border-radius: 50px;
  z-index: 2;
	width: 25%;
	line-height: initial;
}

.tableSearch select,input{
	border:1px solid #2c7aca; 
	border-radius: 5px;
	margin-left: 0;
	margin-right: 10px;
	color: #2c7aca;
	padding: 2px;
	font-size: 80%;
	font-weight: 700;
}

.tableSearch select:hover{
	cursor: pointer;
}

.videoLink{
	padding: 1%;
	border-radius: 20%;
	color: white;
	background-color: #2c7aca;
	text-decoration: none;
	right: 10px;
	position: flow;
}

.videoLinkR{
	padding: 1%;
	border-radius: 20%;
	background-color: yellowgreen;
	color: #F3FFCD;
	text-decoration: none;
	margin-right: 10px;
}

.videoLink:hover{
	background-color: yellowgreen;
	color: #F3FFCD;
	text-decoration: none;
}

.videoLinkR:hover{
	
	color: white;
	background-color: #2c7aca;
	text-decoration: none;
}

#calendarAnchor{
	margin-bottom: 0;
}
/* Drop Down CSS*/