body {
    background: none !important;
}

.logo {
    margin: 100px auto 0 auto;
/*  position: absolute;*/
/*  top: 100px;*/
/*  left: 50%;*/
/*  transform: translate(-50%, -30px);*/
}
.logo.down {
    margin-top: -50px;
}
.logo.up {
    margin-top: 100px;
}
.up {
	animation: up 1s ease;
}

.down {
	animation: down 1s ease;
}

@keyframes up {
	0% {
        margin-top: -50px;
/*		height: 100px;*/
/*		width: 400px;*/
/*		z-index: 1000;*/
	}
	
	30% {
		margin-top: -170px;
/*		z-index: 1000;*/
	}
	
	60% {
/*		z-index: 1000;*/
	}

	100% {
        margin-top: 100px;
/*        z-index: 1000;*/
/*        height: 210px;*/
/*        width: 800px;*/
	}
}

@keyframes down {
	0% {
		margin-top: 100px;
/*		z-index: 1000;*/
/*		height: 210px;*/
/*        width: 800px;*/
	}
	
	30% {
		margin-top: 300px;
/*		z-index: 1000;*/
		padding: 0;
	}
	
	60% {
/*		z-index: 1000;		*/
		
	}
	
	90%, 100% {
        margin-top: -50px;
/*		height: 100px;*/
/*		width: 400px;*/
/*		z-index:1000;*/
	}
}


@media (max-width: 1050px) and (min-width:768px) {
    @keyframes up {
        0% {
            margin-top: -8px;
        }
        
        30% {
            margin-top: -100px;
        }
        
        60% {
        }
        
        100% {
            margin-top: 100px;
        }
    }
    
    @keyframes down {
        0% {
            margin-top: 100px;
        }
        
        30% {
            margin-top: 300px;
            padding: 0;
        }
        
        60% {
            
        }
        
        90%, 100% {
            margin-top: -8px;
        }
    }
    
}

@media (max-width: 767px) {
    @keyframes up {
        0% {
            margin-top: 0px;
        }
        
        30% {
            margin-top: -100px;
        }
        
        60% {
        }
        
        100% {
            margin-top: 100px;
        }
    }
    
    @keyframes down {
        0% {
            margin-top: 100px;
        }
        
        30% {
            margin-top: 300px;
            padding: 0;
        }
        
        60% {
            
        }
        
        90%, 100% {
            margin-top: 0px;
        }
    }
    
}

@media (max-width: 510px) {
    @keyframes up {
        0% {
            margin-top: -4px;
        }
        
        30% {
            margin-top: -100px;
        }
        
        60% {
        }
        
        100% {
            margin-top: 100px;
        }
    }
    
    @keyframes down {
        0% {
            margin-top: 100px;
        }
        
        30% {
            margin-top: 300px;
            padding: 0;
        }
        
        60% {
            
        }
        
        90%, 100% {
            margin-top: -4px;
        }
    }
    
}