.main-head { height:290px; }

.main-head .active {
	/*opacity:0; */position: absolute;
	animation: on2off linear 0.5s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards;
  	-webkit-animation: on2off linear 0.5s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards;
  	-moz-animation: on2off linear 0.5s; -moz-animation-iteration-count: 1; -moz-transform-origin: 50% 50%; -moz-animation-fill-mode:forwards;
  	-o-animation: on2off linear 0.5s;	-o-animation-iteration-count: 1; -o-transform-origin: 50% 50%; -o-animation-fill-mode:forwards;
  	-ms-animation: on2off linear 0.5s; -ms-animation-iteration-count: 1; -ms-transform-origin: 50% 50%; -ms-animation-fill-mode:forwards;
}

.main-head .passive { 
	/*opacity:1; */position: absolute; 
	/*animation: on2off linear 0.5s; animation-iteration-count: 1; transform-origin: 50% 50%;
  	-webkit-animation: on2off linear 0.5s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%;
  	-moz-animation: on2off linear 0.5s; -moz-animation-iteration-count: 1; -moz-transform-origin: 50% 50%;
  	-o-animation: on2off linear 0.5s;	-o-animation-iteration-count: 1; -o-transform-origin: 50% 50%;
  	-ms-animation: on2off linear 0.5s; -ms-animation-iteration-count: 1; -ms-transform-origin: 50% 50%;*/
}

.main-head:hover .active { 
	/*opacity:1; */position: absolute; 
	animation: off2on linear 0.5s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards;
	-webkit-animation: off2on linear 0.5s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards;
	-moz-animation: off2on linear 0.5s; -moz-animation-iteration-count: 1; -moz-transform-origin: 50% 50%; -moz-animation-fill-mode:forwards;
	-o-animation: off2on linear 0.5s; -o-animation-iteration-count: 1; -o-transform-origin: 50% 50%; -o-animation-fill-mode:forwards;
	-ms-animation: off2on linear 0.5s; -ms-animation-iteration-count: 1; -ms-transform-origin: 50% 50%; -ms-animation-fill-mode:forwards;
}

.main-head:hover .passive { 
	/*opacity:0; */position: absolute;
	/*animation: off2on linear 0.5s; animation-iteration-count: 1; transform-origin: 50% 50%;
	-webkit-animation: off2on linear 0.5s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%;
	-moz-animation: off2on linear 0.5s; -moz-animation-iteration-count: 1; -moz-transform-origin: 50% 50%;
	-o-animation: off2on linear 0.5s; -o-animation-iteration-count: 1; -o-transform-origin: 50% 50%;
	-ms-animation: off2on linear 0.5s; -ms-animation-iteration-count: 1; -ms-transform-origin: 50% 50%;*/
}



@keyframes off2on{
  0% {
    opacity:0;
    transform:  ;
  }
  100% {
    opacity:1;
    transform:  ;
  }
}

@-moz-keyframes off2on{
  0% {
    opacity:0;
    -moz-transform:  ;
  }
  100% {
    opacity:1;
    -moz-transform:  ;
  }
}

@-webkit-keyframes off2on {
  0% {
    opacity:0;
    -webkit-transform:  ;
  }
  100% {
    opacity:1;
    -webkit-transform:  ;
  }
}

@-o-keyframes off2on {
  0% {
    opacity:0;
    -o-transform:  ;
  }
  100% {
    opacity:1;
    -o-transform:  ;
  }
}

@-ms-keyframes off2on {
  0% {
    opacity:0;
    -ms-transform:  ;
  }
  100% {
    opacity:1;
    -ms-transform:  ;
  }
}






@keyframes on2off{
  0% {
    opacity:1;
    transform:  ;
  }
  100% {
    opacity:0;
    transform:  ;
  }
}

@-moz-keyframes on2off{
  0% {
    opacity:1;
    -moz-transform:  ;
  }
  100% {
    opacity:0;
    -moz-transform:  ;
  }
}

@-webkit-keyframes on2off {
  0% {
    opacity:1;
    -webkit-transform:  ;
  }
  100% {
    opacity:0;
    -webkit-transform:  ;
  }
}

@-o-keyframes on2off {
  0% {
    opacity:1;
    -o-transform:  ;
  }
  100% {
    opacity:0;
    -o-transform:  ;
  }
}

@-ms-keyframes on2off {
  0% {
    opacity:1;
    -ms-transform:  ;
  }
  100% {
    opacity:0;
    -ms-transform:  ;
  }
}