/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 16/05/2018, 13:46:18
    Author     : alefrogers
*/


#container-menu-open.active-menu{
    top: 0%;
}



/* Menu Toggle icon animation */

.active-menu .custom-toggle span:nth-child(1) {
    top: 10px;
    width: 0%;
    left: 50%;
}

.active-menu .custom-toggle span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.active-menu .custom-toggle span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.active-menu .custom-toggle span:nth-child(4) {
    top: 8px;
    width: 0%;
    left: 50%;
}

/* Animation before select new category */

@keyframes old-category{
    0%{
        top:0;
        opacity:1;
    }
    
    50%{
        top:-20px;
        opacity:0.5;
    }
    
    100%{
        top:-40px;
        opacity:0;
        
    }

}

@keyframes new-category{
    0%{
        top:33;
        opacity:0;
    }
    
    50%{
        top:16px;
        opacity:0.5;
    }
    
    100%{
        top:-5px;
        opacity:1;
        
    }    

}