@media screen and (max-width: 800px) {


	.content-body-wrapper {
		width: 100%;
	}

	/*---------------- header -----------------*/

	#logo {
		width: 28%;
	}

	#logo img {
		width: 90%;
	}

	.header-right {
		width: 71%;
	}

	/*-------------- navigation ---------------*/

	.js #dropdown {
		display: none;
	}

	.js .selectnav {
		display: block;
	}

	#top-nav {
		margin-top: 30px;
		padding-bottom: 1%;
	}

	#top-nav .selectnav {
		float: right;
	}
}

@media screen and (max-width: 500px) {

	body {
		font-size: 90%;
	}

	.content-body-wrapper {
		width: 100%;
	}

	/*-------------- type ---------------*/

	.subpage h1 {
		color: #bf2e1b;
		font-size: 28px;
		font-weight: 600;
	}

	/*-------------- header ---------------*/

	.header-right {
		margin: 0 auto;
		display: block;
		width: 100%;
	}

	#logo {
		width: 100%;
		height: auto;
		text-align: center;
	}

	#logo img {
		width: 50%;
	}

	/*-------------- navigation ---------------*/

	#top-nav {
		margin: 10px 0 10px 0;
		float: none;
	}


	#top-nav .selectnav {
		float: none;
		margin: 0 auto;
	}

	#member-buttons, #top-nav {
		width: 100%;
		display: block;
		text-align: center;
	}

	#login, #members-area, #logout {
		float: none;
	}

	#member-buttons .primary, #member-buttons .secondary {
		display: inline;
	}

	#member-buttons .primary {
		background: none;
		border: 0px;
		padding: 5px;
		color: #80b44e;
		font-weight: bold;
	}

	#member-buttons .secondary {
		background: none;
		border: 0px;
		padding: 5px;
		color: #bb1018;
		font-weight: bold;
	}

	#members-area {
		width: 115px;
		margin-right: 15px;
	}

	#logout {
		width: 60px;
	}

	/*-------------- footer ---------------*/

	footer ul, #copyright {
		width: 100%;
		display: block;
	}

	#copyright p {
		text-align: left;
	}
}