@font-face {
  font-family: 'ibnolden';
  src: url('../adds/font.otf');
}
body{
  background-color: #e9e9e9;
  padding: 0;
  margin: 0;
  font-family: 'ibnolden';
  line-height: 25px;
}
#maincontainer{
  margin: auto;
  padding-top: 40px;
  background-color: #ffffff;
}
#header{
  background-color: #f5f5f5;
  padding: 5px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#headcol1 img{
  height: 150px;
  width: auto;
  float: left;
}
#headcol2{
  display: flex;
  justify-content: center;
}
#headcol2 h1{
  font-weight: normal;
  font-size: 1.7em;
  text-align: right;
}
#menu{
  background-color: #f9f9f9;
  height: 40px;
  margin: 30px 0;
  display: flex;
  position: sticky;
  top: 0;
}
#content{
  background-color: #ffffff;
  color: #333333;
  margin: auto;
  margin-bottom: 50px;
  min-height: 46vH;
}
#content p{
  margin: 40px 0;
}
#fblocka{
  background-color: #333333;
  min-height: 60px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
#fblockb{
  background-color: #000000;
  min-height: 40px;
  display: flex;
  justify-content: flex-start;
}
.foota a{
  text-decoration: none;
  color: #f5f5f5;
}
.footb{
  width: 50%;
  padding: 5px;
  color: #e9e9e9;
  font-size: .8em;
}
.pcation{
  text-decoration: underline;
}
@media screen and (max-width: 1023px) {
  /*#header img{
    display: block;
    margin: auto;
  }*/
  #headcol3{
    display: block;
  }
  #menu{
    justify-content: flex-start;
  }
  .headcol{
    width: 33%;
  }
  .widescreenmenu{
    display: none;
  }
  nav .smallscreenmenu{
    list-style-type: none;
    display: inline;
    padding: 0;
  }
  .smallscreenmenu .mainmenu:hover .submenu{
    display: block;
  }
  .smallscreenmenu .submainmenu:hover .subsubmenu{
    display: block;
  }
  nav > .smallscreenmenu > li{
    float: left;
    padding: 0 10px;
  }
  nav .smallscreenmenu a{
    text-decoration: none;
    color: inherit;
    display: block;
    height: 32px;
    padding: 4px 5px;
  }
  nav .smallscreenmenu a:hover{
    background-color: #01cdff;
    color: white;
  }
  .smallscreenmenu .submenu{
    display: none;
    background-color: #82e5ff;
    position: absolute;
    top: 40px;
    width: 90%;
  }
  .smallscreenmenu .subsubmenu{
    display: none;
    background-color: #00ccff;
    position: absolute;
    width: 80%;
    left: 20%;
    top: 80px;
  }
  #content{
    padding: 15px;
  }
  .foota{
    width: 45%;
    padding: 5px 5%;
    color: #f5f5f5;
  }
  @media screen and (max-width: 624px) {
    #headcol3{
      display: none;
    }
    .headcol{
      width: 50%;
    }
    .smallscreenmenu .subsubmenu{
      width: 60%;
      left: 40%;
    }
    .foota{
      width: 90%;
      padding: 5px 5%;
      color: #f5f5f5;
    }
  }
}
@media screen and (min-width: 1024px) {
    #maincontainer{
      width: 80%;
    }
    #headcol3{
      display: block;
    }
    #menu{
      justify-content: center;
    }
    .headcol{
      width: 33%;
    }
    .smallscreenmenu{
      display: none;
    }
    nav .widescreenmenu{
      list-style-type: none;
      display: inline;
      padding: 0;
    }
    nav > .widescreenmenu > li{
      float: left;
      padding: 0 10px;
    }
    nav .widescreenmenu a{
      text-decoration: none;
      color: inherit;
      display: block;
      height: 32px;
      padding: 4px 5px;
      transition: background-color .3s ease-in, color .3s ease-in;
    }
    nav .widescreenmenu a:hover{
      background-color: #01cdff;
      color: white;
    }
    .widescreenmenu .submenu{
      display: none;
      background-color: #f9f9f9;
      position: absolute;
    }
    .widescreenmenu .mainmenu:hover .submenu{
      display: block;
    }
    #content{
      width: 90%;
    }
    .foota{
      width: 30%;
      padding: 5px 15px;
      color: #f5f5f5;
    }
}
.txtcenter{
  text-align: center;
}
