@media screen and (max-width: 980px) {
	header {
	width: 100%; height: 40px; background: #1a1a1a;
	}
	#nav {
	width: 100%; height: 40px; margin-left: 20px; padding-top: 10px; margin: auto; padding: auto; 
	}
	#title {
	margin-left: 10px;
	}
	#logos {
	margin-right: 10px;
	}
	.subnav {
	width: 100%; height: 45px; background: #ffd62c;
	}
	.subnav .box {
	max-width: 100%; height: 60px; margin: auto; padding: auto; padding-top: 15px; text-align: center;
	}
	#logos {
	float: right;
	}
	#horizontal li {
	display: inline;
	list-style-type: none;
	}
	footer {
	width: 90%;
	}
	.left_footer{
	width: 80%;
	}
	.right_footer{
	width: 10%;
	}
	h2 {
	font-size: 100%; color: #1a1a1a; text-transform: uppercase; font-family: Helvetica;
	}
	.subnav_tiny {
	overflow: hidden; height: 0; width: 0;
	}
	#content {
	width: 99%; height: auto; margin: auto; padding: auto;
	}
	.portfolio {
	max-width: 95%; min-width: 60%; height: auto; margin: auto; padding: auto!important; margin-top: 20px;
	}
	.thumbnail {
	width: 23%; height: 16%; display: inline-block; margin-left: 5px; margin-bottom: 5px; -moz-width: 23%;
	}
	.thumbnail:hover {
	display: inline-table; position: relative;
	background-image: url(img/hover.jpg) no-repeat; background-position: center;
	transition-duration: 2s ease-in;
	-webkit-transition-duration: 2s ease-in;
	}
}

@media screen and (max-width: 700px) {
	header {
	width: 100%; height: 40px; background: #1a1a1a;
	}
	#nav {
	width: 100%; height: 40px; margin-left: 20px; padding-top: 10px; margin: auto; padding: auto;
	}
	.subnav {
	width: 100%; height: 45px; background: #ffd62c;
	}
	.subnav .box {
	max-width: 100%; height: 60px; margin: auto; padding: auto; padding-top: 15px; text-align: center;
	}
	#horizontal li {
	display: inline;
	list-style-type: none;
	}
	footer {
	width: 90%;
	}
	.left_footer{
	width: 100%; clear: both;
	}
	.right_footer{
	width: 100%; clear: both;
	}
	.footer_right li {
	display: none;
	}
	h2 {
	font-size: 70%; color: #1a1a1a; text-transform: uppercase; font-family: Helvetica;
	}
	#content {
	width: 99%; height: auto; margin: auto; padding: auto;
	}
	.subnav_tiny {
	overflow: hidden; height: 0; width: 0;
	}
	.portfolio {
	max-width: 95%; min-width: 60%; height: auto; margin: auto; padding: auto!important; margin-top: 20px;
	}
	.thumbnail {
	width: 22%; height: 11%; background: transparent; display: inline-table; margin-left: 3px; margin-bottom: 3px;
	}
	.mask:hover {
	width: 22%; height: 11%; display: inline-table; overflow: hidden; position: relative;
	background: url(img/hover.jpg) no-repeat; background-position: center;
	transition-duration: 2s ease-in;
	-webkit-transition-duration: 2s ease-in;
	}
}

@media screen and (max-width: 480px) {
	header {
	width: 100%; height: 50px; background: #232323;
	}
	#title {
	float: left; margin-top: 8px; margin-left: 38%;
	}
	#logos {
	overflow: hidden; margin: 0; padding: 0; height: 0; width: 0;
	}
	#horizontal li {
	display: inline;
	list-style-type: none;
	}
	footer {
	width: 100%;
	}
	p {
	margin-left: 5px;
	}
	ul.footer_list li {
	clear: both; display: table; height: 30px; background: #232323; width: 100%; padding: 10px 5px 0px 5px; border-bottom: 1px solid #2d2d2d;
	}
	ul.footer_list li:hover {
	background: #2d2d2d;
	}
	.footer_3 {
	padding-bottom: 20px; margin: 0;
	}
	.subnav {
	overflow: hidden; height: 0; width: 0;
	}
	.subnav .box {
	float: none;
	}
	#content {
	width: 99%; height: auto; margin: auto; padding: auto;
	}
	.subnav_tiny {
	width: 100%!important; height: 30px!important; background: #ffd62c!important; overflow: inherit!important;
	}
	.portfolio {
	max-width: 94%; height: auto; margin: auto; padding: auto!important; margin-top: 20px;
	}
	.thumbnail {
	width: 30%; height: 90px; background: transparent; display: inline-table; margin-left: 2px; margin-bottom: 2px;
	}
	.mask:hover {
	width: 30%; height: 10%; display: inline-table; overflow: hidden; position: relative;
	background: url(img/hover.jpg) no-repeat; background-position: center;
	transition-duration: 2s ease-in;
	-webkit-transition-duration: 2s ease-in;
	}
}