.pg_section {
  position: absolute;
  display: none;
  top: 0px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  /* color: #6CA5B3; */
}

a {
  text-decoration: none !important;
}

.welcome_txt {
  padding: 20px;
  position: absolute;
  z-index: 99999999999999;
}

#logo {
  max-width: 40px;
  border-right: solid white 1px;
  padding-right: 10px;
}

#logo img {
  width: 100%;
}

#logo, .welcome_txt h1 {
  display: inline-block;
}

.welcome_txt h1 {
  padding-left: 10px;
}

/* overflow-y: scroll;
-webkit-overflow-scrolling: touch;
-webkit-box-sizing: border-box; */
#pageContent, #page_wrap {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

/* navigation needs to be weeded
default and custom */
/* NAV ******************************* */
.active_link {
  background-color: none !important;
}

.toplevel-menu {
  z-index: 9999999999999999;
  position: fixed;
  bottom: 20px;
  right: 400px;
}

.toplevel-menu .links {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 250px;
}

.pg_nav_group {
  max-width: 800px;
}

.pg-link.btn-default {
  display: block;
  padding: 10px;
  margin: 2px 0;
  background-color: lightBlue;
  max-width: 300px;
  margin: 20px;
}

.pg-link.btn-default:hover {
  background-color: rgb(243, 251, 206);
}

.pg-link {
  cursor: pointer !important;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.pagebox {
  min-height: 100%;
  background-color: #cecece; // default color
}

.active_page {
  z-index: 99999999999999999999;
  display: block;
  /* position: absolute; */
  /* top: 0px;
  left: 0px; */
  /* top: 60px; */
  -webkit-box-shadow: 0px 0px 18px 5px rgba(0, 0, 0, 0.29);
  box-shadow: 0px 0px 18px 5px rgba(0, 0, 0, 0.29);
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
}

.previous_page {
  z-index: 99999999;
  display: block;
  /* position: absolute; */
  /* top: 0px;
  left: 0px; */
  overflow: hidden;
  transform-style: preserve-3d;
}

#loading {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 99999999999999999;
}

@-webkit-keyframes fadeBack {
  to {
    background-color: #333;
  }
}

@keyframes fadeBack {
  to {
    background-color: #333;
  }
}

/* OTHER WAY */
.pt-page-fade {
  -webkit-animation: fade 1.0s ease both;
  animation: fade 1.0s ease both;
  /* animation-delay: 5s; */
}

.pt-page-moveToLeft {
  -webkit-animation: moveToLeft 1.0s ease both;
  animation: moveToLeft 1.0s ease both;
}

.pt-page-moveFromLeft {
  -webkit-animation: moveFromLeft 1.0s ease both;
  animation: moveFromLeft 1.0s ease both;
}

.pt-page-moveToRight {
  -webkit-animation: moveToRight 1.0s ease both;
  animation: moveToRight 1.0s ease both;
}

.pt-page-moveFromRight {
  -webkit-animation: moveFromRight 1.0s ease both;
  animation: moveFromRight 1.0s ease both;
}

.pt-page-moveToTop {
  -webkit-animation: moveToTop 1.0s ease both;
  animation: moveToTop 1.0s ease both;
}

.pt-page-moveFromTop {
  -webkit-animation: moveFromTop 1.0s ease both;
  animation: moveFromTop 1.0s ease both;
}

.pt-page-moveToBottom {
  -webkit-animation: moveToBottom 1.0s ease both;
  animation: moveToBottom 1.0s ease both;
}

.pt-page-moveFromBottom {
  -webkit-animation: moveFromBottom 1.0s ease both;
  animation: moveFromBottom 1.0s ease both;
}

/* move from / to and fade */
.pt-page-moveToLeftFade {
  -webkit-animation: moveToLeftFade 1.0s ease both;
  animation: moveToLeftFade 1.0s ease both;
}

.pt-page-moveFromLeftFade {
  -webkit-animation: moveFromLeftFade 1.0s ease both;
  animation: moveFromLeftFade 1.0s ease both;
}

.pt-page-moveToRightFade {
  -webkit-animation: moveToRightFade 1.0s ease both;
  animation: moveToRightFade 1.0s ease both;
}

.pt-page-moveFromRightFade {
  -webkit-animation: moveFromRightFade 1.0s ease both;
  animation: moveFromRightFade 1.0s ease both;
}

.pt-page-moveToTopFade {
  -webkit-animation: moveToTopFade 1.0s ease both;
  animation: moveToTopFade 1.0s ease both;
}

.pt-page-moveFromTopFade {
  -webkit-animation: moveFromTopFade 1.0s ease both;
  animation: moveFromTopFade 1.0s ease both;
}

.pt-page-moveToBottomFade {
  -webkit-animation: moveToBottomFade 1.0s ease both;
  animation: moveToBottomFade 1.0s ease both;
}

.pt-page-moveFromBottomFade {
  -webkit-animation: moveFromBottomFade 1.0s ease both;
  animation: moveFromBottomFade 1.0s ease both;
}

/* fade */
@-webkit-keyframes fade {
  from {}

  to {
    opacity: 0.3;
  }
}

@keyframes fade {
  from {}

  to {
    opacity: 0.3;
  }
}

/* move from / to and fade */
@-webkit-keyframes moveToLeftFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateX(-100%);
  }
}

@keyframes moveToLeftFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@-webkit-keyframes moveFromLeftFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateX(-100%);
  }
}

@keyframes moveFromLeftFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@-webkit-keyframes moveToRightFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateX(100%);
  }
}

@keyframes moveToRightFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-webkit-keyframes moveFromRightFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateX(100%);
  }
}

@keyframes moveFromRightFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-webkit-keyframes moveToTopFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateY(-100%);
  }
}

@keyframes moveToTopFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

@-webkit-keyframes moveFromTopFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateY(-100%);
  }
}

@keyframes moveFromTopFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

@-webkit-keyframes moveToBottomFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateY(100%);
  }
}

@keyframes moveToBottomFade {
  from {}

  to {
    opacity: 0.3;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}

@-webkit-keyframes moveFromBottomFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateY(100%);
  }
}

@keyframes moveFromBottomFade {
  from {
    opacity: 0.3;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}

/* move from / to  */
@-webkit-keyframes moveToLeft {
  from {}

  to {
    -webkit-transform: translateX(-100%);
  }
}

@keyframes moveToLeft {
  from {}

  to {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@-webkit-keyframes moveFromLeft {
  from {
    -webkit-transform: translateX(-100%);
  }
}

@keyframes moveFromLeft {
  from {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@-webkit-keyframes moveToRight {
  from {}

  to {
    -webkit-transform: translateX(100%);
  }
}

@keyframes moveToRight {
  from {}

  to {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-webkit-keyframes moveFromRight {
  from {
    -webkit-transform: translateX(100%);
  }
}

@keyframes moveFromRight {
  from {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-webkit-keyframes moveToTop {
  from {}

  to {
    -webkit-transform: translateY(-100%);
  }
}

@keyframes moveToTop {
  from {}

  to {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

@-webkit-keyframes moveFromTop {
  from {
    -webkit-transform: translateY(-100%);
  }
}

@keyframes moveFromTop {
  from {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

@-webkit-keyframes moveToBottom {
  from {}

  to {
    -webkit-transform: translateY(100%);
  }
}

@keyframes moveToBottom {
  from {}

  to {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}

@-webkit-keyframes moveFromBottom {
  from {
    -webkit-transform: translateY(100%);
  }
}

@keyframes moveFromBottom {
  from {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}

/*
*
*
*
END
*/