html, body
{height:100%;}

::-webkit-scrollbar {
    width:7px;
	height:3px;
}

::-webkit-scrollbar-track {
    background:#f1f1f1; 
}
 
::-webkit-scrollbar-thumb {
    background:#888; 
	border-radius:20px;
}

::-webkit-scrollbar-thumb:hover {
    background:#555; 
}



/* toggle menu style */
.clear-menu-btn
{position:relative; right:15px; z-index:999; top:0; padding:0;}

.clear-menu-btn {
  
  width:32px;
  height:30px;
  z-index:999999;
  transition: .8s cubic-bezier(.4,.47,.17,.98);
}

.clear-menu-btn .menu_tglbtn_checkbox {
  filter: alpha(opacity=0);
  opacity: 0;
  width: 100%;
  height: 100%;
}

.clear-menu-btn .menu_tglbtn_checkbox:hover { cursor: pointer; }

.clear-menu-btn .menu_tglbtn_checkbox_check ~ .top, .clear-menu-btn .menu_tglbtn_checkbox_check ~ .bottom { top: 45%; }

.clear-menu-btn .menu_tglbtn_checkbox_check ~ .top {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.clear-menu-btn .menu_tglbtn_checkbox_check ~ .bottom {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.clear-menu-btn .menu_tglbtn_checkbox_check ~ .middle {
  filter: alpha(opacity=0);
  opacity: 0;
}

.clear-menu-btn .menu_tglbtn_checkbox_check ~ .circle {
  filter: alpha(opacity=100);
  opacity: 0;
}

.clear-menu-btn span {
  position: absolute;
  display: block;
  width:100%;
  height:2px;
  background-color: #0a0a0a;
  transition: .8s cubic-bezier(.4,.47,.17,.98);
  z-index: -1;
  left:0;
  top:0;
}

.clearmenubtn_active span
{background-color: #fff;}

.clear-menu-btn .top { top: 5px; }

.clear-menu-btn .middle { top: 13px; }

.clear-menu-btn .bottom { top: 21px;}

.clearmenubtn_active .bottom
{width:100%;}


.clear-menu-btn .circle {
  display: block;
  position:absolute;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  filter: alpha(opacity=0);
  opacity: 0;
  width:28px;
  height:16px;
  background-color: transparent;
  border-radius: 50%;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  z-index: -1;
  left:14px;
  top:10px;
}




.wordSplit span
{position:relative; opacity: 0; transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);}

.wordSplit span:nth-child(1)
{animation-delay:0s; -webkit-animation-delay:0s;}
.wordSplit span:nth-child(2)
{animation-delay:0.05s; -webkit-animation-delay:0.05s;}
.wordSplit span:nth-child(3)
{animation-delay:0.1s; -webkit-animation-delay:0.1;}
.wordSplit span:nth-child(4)
{animation-delay:0.15s; -webkit-animation-delay:0.15s;}
.wordSplit span:nth-child(5)
{animation-delay:0.2s; -webkit-animation-delay:0.2s;}
.wordSplit span:nth-child(6)
{animation-delay:0.25s; -webkit-animation-delay:0.25s;}
.wordSplit span:nth-child(7)
{animation-delay:0.3s; -webkit-animation-delay:0.3s;}
.wordSplit span:nth-child(8)
{animation-delay:0.35s; -webkit-animation-delay:0.35s;}
.wordSplit span:nth-child(9)
{animation-delay:0.4s; -webkit-animation-delay:0.4s;}
.wordSplit span:nth-child(10)
{animation-delay:0.45s; -webkit-animation-delay:0.45s;}
.wordSplit span:nth-child(11)
{animation-delay:0.5s; -webkit-animation-delay:0.5s;}
.wordSplit span:nth-child(12)
{animation-delay:0.55s; -webkit-animation-delay:0.55s;}
.wordSplit span:nth-child(13)
{animation-delay:0.6s; -webkit-animation-delay:0.6s;}
.wordSplit span:nth-child(14)
{animation-delay:0.65s; -webkit-animation-delay:0.65s;}
.wordSplit span:nth-child(15)
{animation-delay:0.7s; -webkit-animation-delay:0.7s;}
.wordSplit span:nth-child(16)
{animation-delay:0.75s; -webkit-animation-delay:0.75s;}
.wordSplit span:nth-child(17)
{animation-delay:0.8s; -webkit-animation-delay:0.8s;}
.wordSplit span:nth-child(18)
{animation-delay:0.85s; -webkit-animation-delay:0.85s;}
.wordSplit span:nth-child(19)
{animation-delay:0.9s; -webkit-animation-delay:0.9s;}
.wordSplit span:nth-child(20)
{animation-delay:0.95s; -webkit-animation-delay:0.95s;}
.wordSplit span:nth-child(21)
{animation-delay:1s; -webkit-animation-delay:1s;}
.wordSplit span:nth-child(22)
{animation-delay:1.05s; -webkit-animation-delay:1.05s;}
.wordSplit span:nth-child(23)
{animation-delay:1.1s; -webkit-animation-delay:1.1s;}
.wordSplit span:nth-child(24)
{animation-delay:1.15s; -webkit-animation-delay:1.15s;}
.wordSplit span:nth-child(25)
{animation-delay:1.2s; -webkit-animation-delay:1.2s;}
.wordSplit span:nth-child(26)
{animation-delay:1.25s; -webkit-animation-delay:1.25s;}
.wordSplit span:nth-child(27)
{animation-delay:1.3s; -webkit-animation-delay:1.3s;}
.wordSplit span:nth-child(28)
{animation-delay:1.35s; -webkit-animation-delay:1.35s;}
.wordSplit span:nth-child(29)
{animation-delay:1.4s; -webkit-animation-delay:1.4s;}
.wordSplit span:nth-child(30)
{animation-delay:1.45s; -webkit-animation-delay:1.45s;}
.wordSplit span:nth-child(31)
{animation-delay:1.5s; -webkit-animation-delay:1.5s;}
.wordSplit span:nth-child(32)
{animation-delay:1.55s; -webkit-animation-delay:1.55s;}
.wordSplit span:nth-child(33)
{animation-delay:1.6s; -webkit-animation-delay:1.6s;}
.wordSplit span:nth-child(34)
{animation-delay:1.65s; -webkit-animation-delay:1.65s;}
.wordSplit span:nth-child(35)
{animation-delay:1.7s; -webkit-animation-delay:1.7s;}
.wordSplit span:nth-child(36)
{animation-delay:1.75s; -webkit-animation-delay:1.75s;}
.wordSplit span:nth-child(37)
{animation-delay:1.8s; -webkit-animation-delay:1.8s;}
.wordSplit span:nth-child(38)
{animation-delay:1.85s; -webkit-animation-delay:1.85s;}
.wordSplit span:nth-child(39)
{animation-delay:1.9s; -webkit-animation-delay:1.9s;}
.wordSplit span:nth-child(40)
{animation-delay:2s; -webkit-animation-delay:2s;}
.wordSplit span:nth-child(41)
{animation-delay:2.05s; -webkit-animation-delay:2.05s;}
.wordSplit span:nth-child(42)
{animation-delay:2.1s; -webkit-animation-delay:2.1s;}
.wordSplit span:nth-child(43)
{animation-delay:2.15s; -webkit-animation-delay:2.15s;}
.wordSplit span:nth-child(44)
{animation-delay:2.2s; -webkit-animation-delay:2.2s;}
.wordSplit span:nth-child(45)
{animation-delay:2.25s; -webkit-animation-delay:2.25s;}
.wordSplit span:nth-child(46)
{animation-delay:2.3s; -webkit-animation-delay:2.3s;}
.wordSplit span:nth-child(47)
{animation-delay:2.35s; -webkit-animation-delay:2.35s;}
.wordSplit span:nth-child(48)
{animation-delay:2.4s; -webkit-animation-delay:2.4s;}
.wordSplit span:nth-child(49)
{animation-delay:2.45s; -webkit-animation-delay:2.45s;}
.wordSplit span:nth-child(50)
{animation-delay:2.5s; -webkit-animation-delay:2.5s;}

@keyframes slideLeft {
  from {
    opacity: 0;
    left: 30px;
  } 
  to {
    opacity: 1;
    left: 0;
  }
}

.animated span
{animation: slideLeft 0.7s forwards;}





@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}