body{
  margin: -1.2%;
}
header{
  background-color: rgb(255, 255, 255);
  height: 100px;
  position: fixed;
  width: 102%;
  z-index: 999;

  
}
header ul {
  float: right;
  margin-right: 20px;
  margin-top: -100px;
  display: flex;
}
header ul li{
  display: inline-block;
  line-height: 80px;
  margin:0 5px;
}
header ul li a{
color: black;
font-size: 17px;
padding: 7px 13px;
border-radius: 3px;
text-transform: uppercase;
text-decoration: none;
}
a.active,a:hover{
  background: linear-gradient(45deg, rgba(43, 3, 243, 0.667), rgba(236, 8, 8, 0.579));
  transition: .10s;
  color: white;
}
.checkbtn{
  font-size: 30px;
  color: white;
  float: right;
  line-height: 80px;
  margin-right: 40px;
}
.section {
  position: relative; 
  display: flex;
  align-items: fill;
  justify-content: center;
  overflow: hidden;
}
.hoslogo img{
  width: 300px;
  position: relative;
  left: 30px;
}
.tab {
  display: inline-block;
  margin-left: 40px;
}
.slidbar{
  position: fixed;
  z-index: 99;
  background-color: rgba(46, 80, 233, 0.5);
  box-shadow: -10px 0 10px rgba(180, 12, 146, 0.537);
  display: none;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  backdrop-filter: blur(10px);
  row-gap: 30px;
  top:0;
  right:0;
  left: 5px;
  height:100%;
  width: 300px;
}
.slidbar li{
   width: 80%;
   left: 0px;
   display: flex;
   column-gap:10px ;
   position: relative;
}
.slidbar a{
   width: 100%;
}
.menu-btn{
   display: none;
}
@media(max-width: 800px){
   .hideOnMobile{
       display: none;
   }
   .menu-btn{
       position: relative;
       display: block;
       right: 500%;
       margin-top:70px ;
       background-color: rgba(255, 0, 0, 0.63);
       border-radius: 10px;
   }

}