/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color:#ff9ecf;
  color: black;
  font-family: Verdana;
  padding: 50px;
}


.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.alert {
  padding: 50px;
  background-color: #5bffad;
  color: black;
  border-radius: 25px;
  text-align: center;
  font-size: 25px;
}
.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}
.closebtn:hover {
  color: black;
}

  .title {
    color: #ff58ab;
    text-align: center;
    text-shadow: 0px 0px 1px white;
    font-size: 100px;
    }
    
    .subtitle {
      color: #ff58ab;
      text-align: center;
      font-size: 17px;
    }
    
    .mainbody {
      display:block;
      background-color: #ff58ab;
      padding: 25px;
      border-radius: 25px;
      color:#ff9ecf;
      min-height:500px;
      
    }
      .imground {
       border-radius: 25px;
       border-style: solid;
       border-width: 10px;
       border-color: #ff9ecf;
      }
      
     .toc {
       color: #5bffff;
       display: block;
       width: 50%;
       border-radius: 25px;
       margin: auto
       
     }
      
     .toc a {
       color:  #5bffff;
       border-style: solid;
       border-color: #ff9ecf;
       border-width: 10px;
       border-radius: 25px;
       background-color: #9e9eff;
       padding: 20px;
       margin: 20px;
       display: block;
       text-decoration: none;
     }

     .toc a:hover {
  background-color: #5bffff;
  color: #9e9eff;
  
}
    .extra {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
    }
  
  .topnav {
  display: block;
  overflow: hidden;
  margin: auto;
  text-align: center;
  border-style: solid;
  border-color: #ff9ecf;
  border-width: 10px;
  background-color: #9e9eff;
  border-radius: 25px;
  width: 50%
  
  }
  


.extra img {
  border-radius: 25px;
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  border-style: solid;
  border-width: 10px;
  border-color: #ff9ecf;
  margin-bottom: 25px;
}

.topnav a {
  border-radius: 25px;
  display: inline-block;
  background-color: #9e9eff;
  color: #5bffff;
  text-align: center;
  padding: 20px;
  text-decoration: none;
  font-size: 17px;

}
.topnav a:hover {
  background-color: #5bffff;
  color: #9e9eff;
}
.topnav .active {
  background-color: #ff58ab;
  color: #ff8ec7;
}