jabadaw.css

html {
    font-size: 1pc
}

body {
    height: 100%;
    width: 100%;
    margin: 0%;
    padding: 0%;
    background: #FFFFFF
}

nav, div.bar {
    display: block;
    margin: 0;
    padding: 0;
    font-family: "Verdana", "Tahoma", "Gill Sans MT", "Gill Sans", sans-serif;
    color: #FFFFFF;
    background-image: url("back1.jpg");
    background-repeat: repeat;
    background-attachment: fixed;
    font-size: 1em;
}

main, div.main {
    display: block;
    overflow: auto;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: "Verdana", "Tahoma", "Gill Sans MT", "Gill Sans", sans-serif;
    color: #000000;
    font-size: 1em;
    line-height: 1.5
}

p {
    margin-left: 10px;
    margin-right: 10px;
    clear: both
}

form.paypal {
    margin-left: 10px;
    margin-right: 10px;
    clear: both
}

q {
    font-style: italic
}

h1 {
    font-family: "Verdana", "Tahoma", "Gill Sans MT", "Gill Sans", sans-serif;
    margin-left: 10px;
    margin-right: 10px;
    background-image: url("image7.jpg");
    background-repeat: repeat;
    clear: both
}

h2, h3, summary {
    font-family: "Verdana", "Tahoma", "Gill Sans MT", "Gill Sans", sans-serif;
    margin-left: 10px;
    margin-right: 10px;
    clear: both
}

summary {
    cursor: pointer
}

hr {
    margin-left: 10px;
    margin-right: 10px;
    clear: both
}

ul {
    margin-left: 10px;
    margin-right: 10px
}

address {
    margin-left: 10px;
    margin-right: 10px
}

a:link {
    text-decoration: underline;
    color: #FF9900
}

a:visited {
    text-decoration: underline;
    color: #999999
}

a:hover {
    text-decoration: none;
    background: #FF9900;
    color: #FFFFFF
}

table {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-size: 1em;
    line-height: 1.5
}

img {
    max-width: 100%;
    height: auto
}

img.left {
    border: 1px solid;
    margin-right: 10px;
    margin-bottom: 10px;
    float: left;
    vertical-align: text-top
}

img.right {
    border: 1px solid;
    margin-left: 10px;
    margin-bottom: 10px;
    float: right;
    vertical-align: text-top
}

@media only screen and (max-width: 680px) {
  span.navlink label {
      display: none;
  }
  nav > p {
      display: -webkit-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
  }
  span.navlink {
      -webkit-flex: 1;  /* Safari 6.1+ */
      -ms-flex: 1;  /* IE 10 */
      flex: 1;
  }
}

@media only screen and (max-width: 768px) {
  nav, div.bar {
      position: static;
      z-index: auto;
      top: auto;
      left: auto;
      height: auto;
      width: 100%;
      overflow: auto;
  }
  main, div.main {
      position: static;
      z-index: auto;
      top: auto;
      left: auto;
      height: auto;
      width: 100%;
  }
  span.navlink {
      display: inline;
  }
  span.navlink label{
    padding-left: 0.25em;
  }
}

@media only screen and (min-width: 768px) {
  nav, div.bar {
      position: absolute;
      z-index: 1;
      top: 0%;
      left: 0%;
      height: 100%;
      width: 15%;
      overflow: hidden;
  }
  main, div.main {
      position: absolute;
      z-index: 0;
      top: 0%;
      left: 15%;
      height: 100%;
      width: 85%;
  }
  span.navlink {
      display: block;
  }
  span.navlink i.fa {
      display: none;
  }
}