@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&family=Mulish&family=Nunito:wght@300&family=Open+Sans:wght@300&family=Poppins:wght@300&family=Quicksand:wght@300&family=Roboto:wght@500&family=Shippori+Antique+B1&display=swap');

*{
  box-sizing: border-box;
  margin: 0;

}
::selection{
  background: aqua;
  color: blue;
}


.logo{
  font-weight: bold;
  color: white !important;
  font-size: 25px;
}
nav{
  padding: 0 !important;
}

.nav_eff li{
  transition: all .4s;
  border-radius: 0 5px;
}
.nav_eff li:hover{

  background-color: aqua !important;
}
.btns{
  display: flex;
  justify-content: center;

}
.sidenav {
    height: 100%; /* Full-height: remove this if you want "auto" height */
    width: 0%; /* Set the width of the sidebar */
    position: fixed; /* Fixed Sidebar (stay in place on scroll) */
    z-index: 1; /* Stay on top */
    top: 48px; /* Stay at the top */
    left: 0;
    background-color: darkblue; /* Black */
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 20px;
    transition: width 400ms;
}
.show-sidebar {
    width: 275px;} /* New*/


.close-crs{
    visibility: hidden;
}
/* The navigation menu links */
.sidenav a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 20px;
    color: #fff;
    display: block;
  }
  .sidenav a:hover{
      color: blue;
      text-decoration: underline;
  }
  .content{
    font-size: 24px;
    font-family: 'Quicksand', sans-serif !important;
    /* font-weight: bold; */
  }
  .section{
    background-color: rgb(81, 81, 236);
    
    
  }
  .section a{
    color: #fff;
    text-decoration: none;
    padding-top: 10px;
  }
.section a:hover{
  text-decoration: underline !important;
}

  /* 13 */
.btn-13 {
  background: #000;
 color: #026480;
 z-index: 1;
}

.custom-btn {
  width: 130px;
  height: 40px;
  padding: 10px 25px;
  border: 2px solid #026480;
  font-family: 'Lato', sans-serif;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
}
.btn-13:after {
 position: absolute;
 content: "";
 width: 100%;
 height: 0;
 bottom: 0;
 left: 0;
 z-index: -1;
  background-color: #20bf55;
  background-image: linear-gradient(315deg, #20bf55 0%, #01baef 74%);
  
 transition: all 0.3s ease;
}
.btn-13:hover {
 color: #000;
}
.btn-13:hover:after {
 top: 0;
 height: 100%;
}
.btn-13:active {
 top: 2px;
}

  @media only screen and (max-width:1000px) {
    .sidenav{width: 0%; } /* New*/
    .sidenav a{padding: 5px 10px; font-size: 18px;  transition: margin 500ms;}
    .sidenav a:hover{margin-left: 15px;}
    .show-sidebar{width: 100%; text-align: center;} /* New*/
    .close-crs{visibility: visible;}
    .con{width: 97% !important;}
    .card{width: 40% !important;}
}
@media only screen and (max-width:700px){
  .card{width: 100% !important;}
}