/*
Theme Name: QNZ
Author: Doubletong
Version: 1.0
*/
#transition {
  position: fixed;
  top: 0;
  left: -0%;
  width: 100%;
  height: 100%;
  background-color: #fff100;
  z-index: 100000;
}

#transition::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  right: -18%;
  background-color: #fff100;
  -moz-transition: all .4s;
  -o-transition: all .4s;
  -webkit-transition: all .4s;
  transition: all .4s;
}

.show-page-1 {
  left: -106% !important;
  -moz-transition: all .4s ease-out;
  -o-transition: all .4s ease-out;
  -webkit-transition: all .4s ease-out;
  transition: all .4s ease-out;
}

.show-page-1::after {
  -webkit-transform: skew(25deg);
  -moz-transform: skew(25deg);
  -ms-transform: skew(25deg);
  -o-transform: skew(25deg);
  transform: skew(25deg);
}

.show-page-2::after {
  right: 0 !important;
  -webkit-transform: initial !important;
  -moz-transform: initial !important;
  -ms-transform: initial !important;
  -o-transform: initial !important;
  transform: initial !important;
}

.showed-page {
  left: 100% !important;
  width: 100%;
}

.hide-page {
  left: 30% !important;
  -moz-transition: all .4s ease-out;
  -o-transition: all .4s ease-out;
  -webkit-transition: all .4s ease-out;
  transition: all .4s ease-out;
}

.hide-page::after {
  right: initial;
  left: -18%;
  -webkit-transform: skew(-25deg);
  -moz-transform: skew(-25deg);
  -ms-transform: skew(-25deg);
  -o-transform: skew(-25deg);
  transform: skew(-25deg);
}

.hide-page-2 {
  left: 0 !important;
}

.hide-page-2::after {
  -webkit-transform: initial !important;
  -moz-transform: initial !important;
  -ms-transform: initial !important;
  -o-transform: initial !important;
  transform: initial !important;
  left: -100%;
}