﻿@media screen and (max-width: 597px) {
	#wrapper				{width:100%; }
	#header					{width:100%; height:auto; }
	#logobackground			{width:100%; height:50px;}
	#title					{width:100%; }
	#navbar					{width:100%; }
	#navbar ul.menu			{width:32%; max-width:110px;}
	#contentarea			{width:100%; }
	#leftbar				{width:100%; }
	#content				{width:100%; }
	.section				{width:100%; left:0px;}
	.sectionleftbar			{width:100%; }
	.sectioncontent			{width:100%; }
	#contact				{width:100%; height:3em;}
	#contact .inner			{font-size:x-small;}
	#windowsize				{margin-top:0.5em; }
	#footer					{width:100%; font-size:small; }
}

@media screen and (max-width: 967px) and (min-width: 598px){
	#wrapper				{width:90%; }
	#header					{width:100%; height:auto; }
	#logobackground			{width:100%; height:50px;}
	#title					{width:100%; }
	#navbar					{width:100%; }
	#navbar ul.menu			{width:110px;}
	#contentarea			{width:100%; }
	#leftbar				{width:100%; }
	#content				{width:100%; }
	.section				{width:100%; left:0px;}
	.sectionleftbar			{width:100%; }
	.sectioncontent			{width:100%; }
	#contact				{width:100%; height:3em;}
	#contact .inner			{font-size:x-small;}
	#windowsize				{margin-top:0.5em; }
	#footer					{width:90%; font-size:medium; }
}

@media screen and (max-width: 1199px) and (min-width: 968px){
	#wrapper				{width:90%; }
	#header					{width:100%; height:auto; }
	#logobackground			{width:22%; height:125px;}
	#title					{width:78%; }
	#navbar					{width:78%; }
	#navbar ul.menu			{width:19%; max-width:110px;}
	#contentarea			{width:100%; }
	#leftbar				{width:22%; }
	#content				{width:78%; }
	.section				{width: 128%; left: -28%; /* In case calc() doesn't work */
							width: calc((1 + 22/78)*100%); left: calc((-22/78)*100%);} /* Chrome NEEDS spaces or it will do weird stuff */
	.sectionleftbar			{width:22%; }
	.sectioncontent			{width:78%; }
	#contact				{width:22%; height:1em;}
	#contact .inner			{font-size:small;}
	#windowsize				{margin-top:8em; }
	#footer					{width:90%; font-size:medium; }
}

@media screen and (min-width: 1200px) {
	#wrapper				{width:1200px; }
	#header					{width:100%; height:auto; }
	#logobackground			{width:275px; height:120px;}
	#title					{width:912px; }
	#navbar					{width:78%; }
	#navbar ul.menu			{width:12%; }
	#contentarea			{width:100%; }
	#leftbar				{width:22%; }
	#content				{width:78%; }
	.section				{width: 128%; left: -28%; /* In case calc() doesn't work */
							width: calc((1 + 22/78)*100%); left: calc((-22/78)*100%);} /* Chrome NEEDS spaces or it will do weird stuff */
	.sectionleftbar			{width:22%; }
	.sectioncontent			{width:78%; }
	#contact				{width:22%; height:1em;}
	#contact .inner			{font-size:small;}
	#windowsize				{margin-top:8em; }
	#footer					{width:1200px; font-size:medium; }
}