@media (max-width: 600px) {

    .logo {
        position: relative;
        width: 80%;
        left: 2em;
        top: 1em;
    }  
    
	.toggle2 {
		position: absolute;
		top: 1em;
		right: 1em;
		z-index: 50;
		cursor: pointer;
		transform:translateX(0%);		
	}

		.toggle {
		position: absolute;		
		top: 2.2em;
		right: 3em;
		width:30px;
		height:5px;
		background-color:#FFFFFF;
		border-radius:5px;
		cursor: pointer;
		z-index: 50;		
		}
		
.toggle:after, .toggle:before
{
    content: '';
    width: 100%;
    height:5px;
    background-color:#FFFFFF;
    position:absolute;
    border-radius:5px;
}

.toggle:after
{
    top:10px;
}

.toggle:before
{
    top:20px;
	background-color: #FFFFFF
}		
	
	nav {
		position: fixed;
		padding-top: 2.5em;
		padding-left: 1em;
		top: 0;
		right: 0;
		width: 65%;
		height: 100%;
		background: #123c56;
 		z-index:49;
		transform: translateX(100%);
		transition: transform 0.6s ease;
	}

	nav.open {
		transform: translateX(0);
	}
	
nav  ul li {
	display:block;
	padding: .7em;
	margin: 0 auto;
}

nav  ul li a {
	text-decoration: none;
	color: #FFFFFF;
	transition: all .25s ease; 
}

/*nav  ul li a:hover {
	color: #CC0000;
}*/
	
}