
.noscroll {
  overflow: hidden;

}

.inactive{
	overflow: hidden;
	}
@media only screen and (min-width: 992px) {
	.overlay {
		top: -1617px;
		
		}
	}

.wrap {

}
.wrap_y{
	  display: block;
  width: 100%;
  height:100%;
  padding: 50px;
  margin:0;
	background:#F8D749 ;
	color:#000;
}





body.dm .nav-el {
/*  background-color: #00a7e4;
*/  transition: background-color .2s ease-in;
  -moz-transition: background-color .2s ease-in;
  -webkit-transition: background-color .2s ease-in;
}

body.dm .nav-el.active {
  z-index: 11;
}


/******************************
.nav-el.active anim
******************************/
@keyframes fx-el_center-active {
  0% {
    transform: translate3d(0%, 0%, 0);
  }

  33% {
    transform: translate3d(15%, 0%, 15%) scale(1);
    color: #C81342;
  }

  40% {
    transform: translate3d(15%, 0%, 0%) scale(1);
    color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    transform: translate3d(15%, 0%, 0%) scale(20);
    color: transparent;
  }
}

@keyframes fx-el_topleft-active {
  0% {
    transform: translate3d(0%, 0%, 0);
  }

  33% {
    transform: translate3d(15%, 15%, 0) scale(1);
    color: #C81342;
  }

  40% {
    transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@keyframes fx-el_topright-active {
  0% {
    transform: translate3d(0%, 0%, 0);
  }

  33% {
    transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  40% {
    transform: translate3d(-15%, 15%, 0) scale(1);
    color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@keyframes fx-el_btmleft-active {
  0% {
    transform: translate3d(0%, 0%, 0);
  }

  33% {
    transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
  }
}

@keyframes fx-el_btmright-active {
  0% {
    transform: translate3d(0%, 0%, 0);
  }

  33% {
    transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
  }
}
@-moz-keyframes fx-el_center-active {
  0% {
    -moz-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -moz-transform: translate3d(0, 15%, 0%) scale(1);color: #C81342;
  }

  40% {
    -moz-transform: translate3d(0, 15%, 0%) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -moz-transform: translate3d(0, 15%, 0%) scale(20);
    color: transparent;
  }
}



@-moz-keyframes fx-el_topleft-active {
  0% {
    -moz-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -moz-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  40% {
    -moz-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -moz-transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@-moz-keyframes fx-el_topright-active {
  0% {
    -moz-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  40% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@-moz-keyframes fx-el_btmleft-active {
  0% {
    -moz-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -moz-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    -moz-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -moz-transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
  }
}

@-moz-keyframes fx-el_btmright-active {
  0% {
    -moz-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
  }
}
@-webkit-keyframes fx-el_center-active {
  0% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -webkit-transform: translate3d(0, 15%, 0%)  scale(1);color: #C81342;
  }

  40% {
    -webkit-transform: translate3d(0, 15%, 0%)  scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -webkit-transform: translate3d(0, 15%, 0%)  scale(20);
    color: transparent;
  }
}


@-webkit-keyframes fx-el_topleft-active {
  0% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -webkit-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  40% {
    -webkit-transform: translate3d(15%, 115%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -webkit-transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@-webkit-keyframes fx-el_topright-active {
  0% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  40% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
  }
}

@-webkit-keyframes fx-el_btmleft-active {
  0% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
  }
}

@-webkit-keyframes fx-el_btmright-active {
  0% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }

  33% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  40% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  50% {
    color: transparent;
  }

  100% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
  }
}
#el-center.active {
  animation: fx-el_center-active 1.6s 1 ease-in-out forwards;
  -moz-animation: fx-el_center-active 1.6s 1 ease-in-out forwards;
  -webkit-animation: fx-el_center-active 1.6s 1 ease-in-out forwards;
}

#el-topleft.active {
  animation: fx-el_topleft-active 1.6s 1 ease-in-out forwards;
  -moz-animation: fx-el_topleft-active 1.6s 1 ease-in-out forwards;
  -webkit-animation: fx-el_topleft-active 1.6s 1 ease-in-out forwards;
}

#el-topright.active {
  animation: fx-el_topright-active 1.6s 1 ease-in-out forwards;
  -moz-animation: fx-el_topright-active 1.6s 1 ease-in-out forwards;
  -webkit-animation: fx-el_topright-active 1.6s 1 ease-in-out forwards;
}

#el-btmleft.active {
  animation: fx-el_btmleft-active 1.6s 1 ease-in-out forwards;
  -moz-animation: fx-el_btmleft-active 1.6s 1 ease-in-out forwards;
  -webkit-animation: fx-el_btmleft-active 1.6s 1 ease-in-out forwards;
}

#el-btmright.active {
  animation: fx-el_btmright-active 1.6s 1 ease-in-out forwards;
  -moz-animation: fx-el_btmright-active 1.6s 1 ease-in-out forwards;
  -webkit-animation: fx-el_btmright-active 1.6s 1 ease-in-out forwards;
}
/******************************
.nav-el.active reverse
******************************/
@keyframes fx-el_center-active_reverse {
  0% {
    transform: translate3d(0, 5%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    transform: translate3d(0%, 0%, 0);
  }
}


@keyframes fx-el_topleft-active_reverse {
  0% {
    transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    transform: translate3d(0%, 0%, 0);
  }
}

@keyframes fx-el_topright-active_reverse {
  0% {
    transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    transform: translate3d(0%, 0%, 0);
  }
}

@keyframes fx-el_btmleft-active_reverse {
  0% {
    transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    transform: translate3d(0%, 0%, 0);
  }
}

@keyframes fx-el_btmright-active_reverse {
  0% {
    transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    transform: translate3d(0%, 0%, 0);
  }
}
@-moz-keyframes fx-el_center-active_reverse {
  0% {
    -moz-transform: translate3d(0, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -moz-transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -moz-transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -moz-transform: translate3d(0%, 0%, 0);
  }
}



@-moz-keyframes fx-el_topleft-active_reverse {
  0% {
    -moz-transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -moz-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -moz-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -moz-transform: translate3d(0%, 0%, 0);
  }
}

@-moz-keyframes fx-el_topright-active_reverse {
  0% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -moz-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -moz-transform: translate3d(0%, 0%, 0);
  }
}

@-moz-keyframes fx-el_btmleft-active_reverse {
  0% {
    -moz-transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -moz-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    -moz-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -moz-transform: translate3d(0%, 0%, 0);
  }
}

@-moz-keyframes fx-el_btmright-active_reverse {
  0% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    -moz-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -moz-transform: translate3d(0%, 0%, 0);
  }
}
@-webkit-keyframes fx-el_center-active_reverse {
  0% {
    -webkit-transform: translate3d(0, 5%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -webkit-transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -webkit-transform: translate3d(0, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }
}



@-webkit-keyframes fx-el_topleft-active_reverse {
  0% {
    -webkit-transform: translate3d(15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -webkit-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -webkit-transform: translate3d(15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }
}

@-webkit-keyframes fx-el_topright-active_reverse {
  0% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  67% {
    -webkit-transform: translate3d(-15%, 15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }
}

@-webkit-keyframes fx-el_btmleft-active_reverse {
  0% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    -webkit-transform: translate3d(15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }
}

@-webkit-keyframes fx-el_btmright-active_reverse {
  0% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(20);
    color: transparent;
    background-color: #00a7e4;
  }

  50% {
    color: transparent;
    background-color: #00a7e4;
  }

  60% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  67% {
    -webkit-transform: translate3d(-15%, -15%, 0) scale(1);color: #C81342;
  }

  82% {
    background-color: #0091F8;
  }

  100% {
    -webkit-transform: translate3d(0%, 0%, 0);
  }
}
#el-center.active_reverse {
  animation: fx-el_center-active_reverse 1.6s 1 ease-in-out;
  -moz-animation: fx-el_center-active_reverse 1.6s 1 ease-in-out;
  -webkit-animation: fx-el_center-active_reverse 1.6s 1 ease-in-out;
}

#el-topleft.active_reverse {
  animation: fx-el_topleft-active_reverse 1.6s 1 ease-in-out;
  -moz-animation: fx-el_topleft-active_reverse 1.6s 1 ease-in-out;
  -webkit-animation: fx-el_topleft-active_reverse 1.6s 1 ease-in-out;
}

#el-topright.active_reverse {
  animation: fx-el_topright-active_reverse 1.6s 1 ease-in-out;
  -moz-animation: fx-el_topright-active_reverse 1.6s 1 ease-in-out;
  -webkit-animation: fx-el_topright-active_reverse 1.6s 1 ease-in-out;
}

#el-btmleft.active_reverse {
  animation: fx-el_btmleft-active_reverse 1.6s 1 ease-in-out;
  -moz-animation: fx-el_btmleft-active_reverse 1.6s 1 ease-in-out;
  -webkit-animation: fx-el_btmleft-active_reverse 1.6s 1 ease-in-out;
}

#el-btmright.active_reverse {
  animation: fx-el_btmright-active_reverse 1.6s 1 ease-in-out;
  -moz-animation: fx-el_btmright-active_reverse 1.6s 1 ease-in-out;
  -webkit-animation: fx-el_btmright-active_reverse 1.6s 1 ease-in-out;
}


/******************************
.overlay anim
******************************/
@keyframes fx-overlay {
  0% {
    visibility: visible;
    color: transparent;
  }

  50% {
/*    background-color: #ccc;
*/    color: white;
  }

  100% {
    visibility: visible;
/*    background-color: #ccc;
*/color: #C81342;
  }
}

@keyframes fx-overlay-reverse {
  0% {
    visibility: visible;
/*    background-color: #ccc;
*/color: #C81342;
  }

  40% {
/*    background-color: #ccc;
*/    color: transparent;
  }

  85% {
    background-color: transparent;
  }

  100% {
    visibility: invisible;
    color: transparent;
    background-color: transparent;
  }
}

@-webkit-keyframes fx-overlay {
  0% {
    visibility: visible;
    color: transparent;
  }

  50% {
/*    background-color: #ccc;
*/    color: white;
  }

  100% {
    visibility: visible;
/*    background-color: #ccc;
*/color: #C81342;
  }
}

@-webkit-keyframes fx-overlay-reverse {
  0% {
    visibility: visible;
/*    background-color: #ccc;
*/color: #C81342;
  }

  40% {
/*    background-color: #ccc;
*/    color: transparent;
  }

  85% {
    background-color: transparent;
  }

  100% {
    visibility: invisible;
    color: transparent;
    background-color: transparent;
  }
}

@-moz-keyframes fx-overlay {
  0% {
    visibility: visible;
    color: transparent;
  }

  50% {
 /*   background-color: #ccc;*/
    color: white;
  }

  100% {
    visibility: visible;
/*    background-color: #ccc;
*/color: #C81342;
  }
}

@-moz-keyframes fx-overlay-reverse {
  0% {
    visibility: visible;
   /* background-color: #ccc;*/color: #C81342;
  }

  40% {
  /*  background-color: #ccc;*/
    color: transparent;
  }

  85% {
    background-color: transparent;
  }

  100% {
    visibility: invisible;
    color: transparent;
    background-color: transparent;
  }
}

.overlay.active {
  animation: fx-overlay .5s .8s 1 ease-in-out forwards;
  -webkit-animation: fx-overlay .5s .8s 1 ease-in-out forwards;
  -moz-animation: fx-overlay .5s .8s 1 ease-in-out forwards;
}

.overlay.active_reverse {
  animation: fx-overlay-reverse 0.4s 1 ease-in backwards;
  -webkit-animation: fx-overlay-reverse 0.4s 1 ease-in backwards;
  -moz-animation: fx-overlay-reverse 0.4s 1 ease-in backwards;
}
/*.overlay.active_reverse {
  animation: fx-overlay-reverse 1s 1 ease-in backwards;
  -webkit-animation: fx-overlay-reverse 1s 1 ease-in backwards;
  -moz-animation: fx-overlay-reverse 1s 1 ease-in backwards;
}
*/
