html {
  overflow: hidden;
  width: 100%; }
  html:hover ::-webkit-scrollbar-thumb {
    background: #a0a0a0; }

body {
  font-size: 16px;
  width: 100%;
  height: 100%;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin: 0;
  padding: 0;
  background: #111;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed; }

/* width */
::-webkit-scrollbar {
  width: 5px; }

/* Track */
::-webkit-scrollbar-track {
  background: transparent; }

/* Handle */
::-webkit-scrollbar-thumb {
  background: transparent; }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #e2e2e2; }

.sm-ctrl {
  display: none; }

.lg-ctrl-blk {
  display: block; }

.lg-ctrl-iblk {
  display: inline-block; }

.loader-cont {
  z-index: 9; }

.header-cont {
  position: fixed;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  height: 60px;
  background: rgba(0, 0, 0, 0.4);
  line-height: 50px;
  text-align: center;
  opacity: 0;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.2), 0 10px 10px rgba(0, 0, 0, 0.2);
  transition: opacity ease-in-out 0.3s; }
  .header-cont .header {
    padding-left: 20px;
    max-width: 1920px;
    margin: auto; }

.page-cont {
  max-width: 1920px;
  opacity: 0;
  transition: all ease-in-out 0.3s; }

.footer-cont {
  opacity: 0;
  transition: opacity ease-in-out 0.3s; }

.page {
  padding: 0 5%;
  margin: 60px auto 0;
  max-width: 1280px; }

.op1 {
  opacity: 1 !important; }

@media only screen and (max-width: 700px) {
  .header-cont {
    text-align: left;
    background-color: transparent;
    box-shadow: none;
    z-index: 10;
    padding: 0;
    height: 60px; }
  .sm-ctrl {
    display: block; }
  .lg-ctrl-blk,
  .lg-ctrl-iblk {
    display: none; }
  /* width */ }