@media only screen and (max-width: 1227px) {
	body, header {
		overflow-x: hidden;
	}

    main, #wbox, footer { 
		width: 96%; 
		max-width: 96%; 
	}

	section#content { 
		min-width: 64vw; 
		max-width: 64vw; 
	}

	aside { 
		min-width: 29vw;
		max-width: 29vw; 
	}
}

@media only screen and (max-width: 1080px) {
	header {
		height: 35vw;
		background-size: 120%;
		image-rendering: auto;
	}

    main { 
		margin-bottom: 20px;
		display: block;
	}

	section#content { 
		min-width: 100%;
		max-width: 100%;
		display: table-header-group;
	}

	article {
		margin-bottom: 80px;
	}

    article .title {
        border-left-width: 4vw;
    }

    article .entry {
        padding-left: 4vw;
    }

    article .entry::before {
        margin-left: 2vw;
    }

    article .entry .featured::before {
        left: -4vw;
        width: 4vw;
    }

	aside { 
		width: 100%;
		min-width: 100%;
		max-width: 100%;
		margin: 0 auto;
		display: table-footer-group;
	}

	aside .proj { 
		max-width: 340px; 
	}

	#pagination { 
		margin: 0 auto 80px auto;
	}
}

@media only screen and (max-width: 900px) {
    #site h1 { 
		font-size: 6.25vw
	}
}

@media only screen and 	(min-width: 861px) {
	#rmenu { 
		display: block !important; 
	}
}

@media only screen and (max-width: 860px) {
	#show-menu { 
		display: block; 
	}

	nav ul.menu { 
		display: none; 
	}

	nav ul.menu li {
		margin: 0;
		padding: 15px 20px;
		text-align: left;
        border-bottom: 1px solid;
		display: block;
	}

	nav ul.menu li:first-child {
		padding-top: 30px;
	}

	nav ul.menu li .sub-menu {
		width: 100%;
		max-width: 100%;
		padding-top: 10px;
		height: 100%;
		border: none;
		position: relative;
	}

    #wbox {
        display: none;
    }

    main {
        margin-top: 40px;
    }

    article .title h1, article h2 {
        font-size: 18px;
    }

	article .entry img, aside .sidebox img {
		max-width: 15vw;
		height: auto;
	}

    article .entry .featured img {
        max-width: 100%;
    }

    article .cbox ul.post-categories li::after, aside .sidebox .proj ul.links li::after {
        margin: 0 5px;
    }

    footer #cred {
        flex-direction: column;
        justify-content: center;
    }

    footer #cred ul li {
        margin: 0 10px;
        padding: 5px 0;
    }

    footer #social {
        margin-top: 10px;
    }

    footer #social a {
        margin: 0 5px;
    }
}

@media only screen and (max-width: 640px) {
    body {
        font-size: 11px;
    }

    article .cbox ul.post-categories li, aside .sidebox .proj ul.links li {
        font-size: 9px;
    }       

    footer #disc {
        padding-left: 0;
        background-image: none;
    }
}

@media only screen and (max-width: 340px) {
	aside .sidebox .proj, aside .sidebox .proj img {
		max-width: 100%;
	}
}