/*-------------------------------------new ICONS font for navbars----------------------------------------*/
@font-face {
    font-family: "madfont";
    src: url("../../static/fonts/madfont.ttf") format("TrueType"),
           url("../../static/fonts/madfont.otf") format("OpenType");
   }
.centered{
    text-align: center;
}
.bold{
    font-weight: bold;
}
.italic{
    font-style: italic;
}
.nonItalic{
    font-style: normal !important;
}
.icon{
    font-family: "madfont";
}
.hidden{
    display: none;
}
* {
  box-sizing: border-box;
}

/* Create two equal columns that sits next to each other */
.row {
  display: flex;
}
.column {
  flex: 50%;
  padding: 10px;
}

.righttag {
  position: relative;
  float: right;
  }
/*======================================================LARGE SCREENS===========================================*/
@media screen and (min-width: 900px){
  #page {
      margin: 6vh 10vw;
  }
  #descript{
    width: 800px;
    min-height: 3em;
  }
  #divpdf{
    width: 800px;
    height: 1200px;
  }
  #divmp3{
    width: 800px;
  }
  #monmp3{
    width:100%;
  }
  .titlesection{
    color: white;
    font-size: 25px;
    background-color: rgb(8, 40, 83);
    padding: 0.5vh 0.5vw;
    font-weight: normal;
  }
  .section div{
    margin: 4vh 0vw 2vh 50px;
    position: relative;
  }
}
/*======================================================SMALL SCREENS===========================================*/
@media screen and (max-width: 900px) {

  .titlesection{
      color: white;
      font-size: 25px;
      background-color: rgb(8, 40, 83);
      padding: 0.5vh 0.5vw;
      font-weight: normal;
  }
  .section div{
      margin: 4vh 0vw 2vh 50px;
      position: relative;
  }
}