body {

    transition: 0.3s;
    padding-bottom: 80px;
  }

  ::selection {
    background: rgba(180, 180, 180, 0.25);
  }

  ::-moz-selection {
    background: rgba(180, 180, 180, 0.25);
  }

  a{

    text-decoration: none;
    color: black;

  }

  #main{

    width: 800px;
    margin: auto;
    padding: 10px;

  }


    #footer{
      text-align: center;
      padding-top: 20px;
      margin-top: 20px;
      border-top: solid grey;
      border-width: 1px;
      font-size: 13px;
      color: #5f5f5f;
    }

    .footer_link{
      color: black;
      text-decoration: underline;
    }

    .footer_img{

      width: 50px;

    }

    .footer_img{

      margin-right: 10px;
      margin-top: 10px;
      opacity: 0.6;
      transition: all 0.6s;

    }

    .footer_img:hover{

      cursor: pointer;
      opacity: 1;

    }

    .footer_line{

      padding-top: 5px;

    }


    .badge {

      height: 50px;

    }

    .noselect {

      -webkit-user-select: none; /* Chrome all / Safari all */
      -moz-user-select: none;    /* Firefox all             */
      -ms-user-select: none;     /* IE 10+                  */
       user-select: none;        /* Likely future           */

    }

    .textlink {

      text-decoration: underline;

    }

    .smallimg {

      height: 17px;
      vertical-align: middle;

    }

    .link {

      color: grey;
      transition: all 0.6s;

    }

    .link:hover{

      color: black;

    }

    #menubar {

      position: fixed;
      bottom: 0px;
      width: 100%;
      max-width: 800px;
      background-color: white;
      border-top: solid grey 1px;
      text-align: center;

    }

    .barlink {

      display: inline;

      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      -webkit-tap-highlight-color: transparent;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
       user-select: none;
    }

    .barimage {
      transition: 0.3s;
      width: 30px;
      height: auto;
      margin: 8px;
      padding: 12px;
      border-bottom: solid grey 3px;
      border-radius: 5px;

    }

    .barimage:active {

      background-color: rgba(128, 128, 128, 0.3);

    }

    .barimage:hover {

      cursor: pointer;

    }

    @media only screen and (max-width: 900px) {
      #main{

        width: calc(100% - 20px);

      }

      h1{

        margin-top: 0px;

      }

      #menubar {

        width: calc(100% - 35px);

      }
    }


    @media only screen and (max-width: 360px) {

      #main{

        padding: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        width: 100%;

      }

      #menubar {

        margin-left: -10px;
        width: 100%;

      }

    }