.main, .copyright, .menuwrapper, .sidebar, .socialmedia {
	order: 10;
}


@media screen and (max-width: 499px) {
    .menu {
        position:relative;
        display:inline-block;
        width: 100%;
    }
 
    .menu ul.active {
        display:none;
    }
 
    .menu ul {
        width:100%;
        position:absolute;
        top:120%;
        box-shadow:0px 5px 5px rgba(0,0,0,0.5);
        border-radius:3px;
        background:white;
    }
 
    .menu ul:after {
        position:absolute;
        top:0%;
        right:22px;
        content:'';
        transform:translate(0%, -100%);
        border-left:7px solid transparent;
        border-right:7px solid transparent;
        border-bottom:7px solid #303030;
    }
 
    .menu li {
        float:none;
        display:block;
    }
 
    .menu a {
        display:block;
    }
 
    .toggle-nav {
        padding:20px;
        float: right;
        display:inline-block;
        border-radius:3px;
        color:black;
        text-decoration: none;
        font-size:20px;
    }
    .toggle-nav:hover, .toggle-nav.active {
        text-decoration:none;
    }
}

@media screen and (min-width: 500px) and (max-width: 799px) {
	.menuwrapper {
		width: 100%;
		order: 0;
	}
	.menu_item {
		display: inline-block;
    	width: calc(100%/3);
	}
	.main {
		width: 70%;
		order: 1;
	}
	.sidebar {
		width: 30%;
	}
}

@media screen and (min-width: 800px) {
	.headertext {
		width: 70%;
	}
	.socialmedia {
		width: 30%;
		text-align: right;
	}
	.menuwrapper {
		width: 20%;
		order: 0;
	}
	.main {
		width: 60%;
		order: 1;
	}
	.sidebar {
		width: 20%;
		order: 2;
	}
}