/* Basis Stijlen aanpassen vanaf 1024px
--------------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
	
	html, body					{ font-size: 14px; }
	#container					{ width: auto; }
	#top 						{ margin-bottom: 4px; }
	#content					{ border: 0px none; }

	/* Header Styles
	--------------------------------------------------------------------*/
	#header 					{ margin-bottom: 0; border: 0px none; border-bottom: 4px solid #646464; }
	#headerRight img			{ width: 90%; }
	
	/* - Zet de padding/margin voor het submenu weer terug
	--------------------------------------------------------------------*/
	ul#subnav li a.active		{ padding-left: 12%; }
	
	#footer #footerLogo img#logoZwartbv	{ width: 25%; }
	#footer #footerLogo img#logoSterkin	{ max-width: 25%; }
	#footer #footerLogo img#logoVni		{ max-width: 25%; }
	#footer #footerLogo img#logoSei		{ max-width: 50%; }

} /*/mediaquery*/


/* Basis Stijlen aanpassen vanaf 800px
--------------------------------------------------------------------*/
@media only screen and (max-width: 800px) {
	
	/* Contant Styles, seperator weghalen
	--------------------------------------------------------------------*/
	#content 					{ background: none; }
	
	/* Header Styles
	--------------------------------------------------------------------*/
	#header 					{ border: 0px none; }
	#headerRight img			{ width: 100%; height: auto; margin: 14% 0 10% 0; }
	#headerRight div			{ font-size: 0.95em; }
	#headerRight .col-padding	{ padding: 0 24px 0 0; }
	#rightExtra					{ width: 60%; }
		
	/* - Zet de navigatie uit
	--------------------------------------------------------------------*/
	ul#fullnav, #subnav			{ display: none; }
	
	/* - Rechterkolom in dit geval niet verwijderen, maar onder de content zetten
	--------------------------------------------------------------------*/
	#right						{ width: 100%; margin: 0; background: #FFF none; }
	#left						{ width: 100%; margin: 0; padding-top: 10px; background: #FFF none; }
	
	#right .col-padding			{ padding-left: 14px!important; }
	#newsBlock					{ display: none; }
	#subnavBlock				{ display: none; }
	
	img.buienradar				{ display: none; }
	
	#footer						{ padding-top: 10px; }
	#footer #footerLinks		{ margin: 0; width: 48%; float: left; }
	#footer #footerContact		{ margin: 0; width: 48%; float: right; }
	#footer #footerLogo			{ margin: 20px 0; clear: both; width: 100%; }
	#footer #footerLogo img		{ float: left; margin: 10px 20px 0 0; }
	#footer #footerLogo img#logoZwartbv	{ display: none; }

} /*/mediaquery*/


/* Basis Stijlen aanpassen vanaf 580px
--------------------------------------------------------------------*/
@media only screen and (max-width: 580px) {
	
	/* Header Styles
	--------------------------------------------------------------------*/
	#header 					{ height: auto; border: 0px none; }
	#headerLeft 				{ display: none; }
	#headerRight				{ text-align: center; }
	#headerRight img			{ width: 35%; height: auto; margin: 14px 0; padding: 0; border: 0px none; }
	#headerRight .col-padding	{ padding: 0 14px 0 14px; margin-bottom: 0; }
	
	.mobile-menu				{ width: auto; background-color: #FFF; }
	
	/* Home Buttons Styles
	--------------------------------------------------------------------*/
	#homeButtons .button a		{ min-height: 98px; padding: 30px 10px 0 10px; }
	
	#right .col-padding			{ padding-top: 0px; }
	#rightExtra					{ width: 100%; }

	/* Projecten Styles
	--------------------------------------------------------------------*/
	.span_4_of_12 #projOverview				{ width: 50%; margin-bottom: 20px; }
	
	/* - Footer Styles
	--------------------------------------------------------------------*/
	#footer 					{ padding-bottom: 20px; padding-top: 10px; }
	#fleft, #fright				{ text-align: center!important; }
	
	.addthis_toolbox			{ display: none; }
		
} /*/mediaquery*/


/* Basis Stijlen aanpassen vanaf 320px
--------------------------------------------------------------------*/
@media only screen and (max-width: 320px) {
	
	html, body					{ font-size: 13px; }
	h1							{ font-size: 1.5em; }
	h2							{ font-size: 1.3em; }
	h3							{ font-size: 1.2em; }
	h4							{ font-size: 1.05em;}
	span.h1						{ font-size: 1.5em; }		
	
	/* Responsive afbeeldingen in de content
	--------------------------------------------------------------------*/
	img.responsive				{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-left-20		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-left-30		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-left-40		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-left-50		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-right-20		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-right-30		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-right-40		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	img.responsive-right-50		{ max-width: none; width: 100%; float: none; margin: 0 0 20px 0; }
	
	/* Header Styles
	--------------------------------------------------------------------*/
	#headerRight							{ text-align: center; }
	#headerRight img						{ float: none; width: 62%; height: auto; padding: 0; border: 0px none; }
		
	/* Item Overzicht
	--------------------------------------------------------------------*/
	#newsOverview div.item					{ margin-bottom: 8%; }
	#newsOverview div.item div.itemLeft		{ float: left; width: 20%; }
	#newsOverview div.item div.itemRight	{ float: right; width: 76%; }
	
	/* Item Detail
	--------------------------------------------------------------------*/
	div.toolbox_top div.addthis_toolbox		{ display: none;}
	div.addthis_toolbox						{ float: none; display: block; margin: 0; padding: 0; text-align: center;}
	
	/* - Zet de album banners naar 2 op een rij
	--------------------------------------------------------------------*/
	.album a								{ width: 31%; margin: 0 3% 3% 0; }
	.album a:nth-child(5n)					{ margin: 0 3% 3% 0; } 
	.album a:nth-child(3n)					{ margin: 0 0 3% 0; } 

	/* Projecten Styles
	--------------------------------------------------------------------*/
	#projOverview .item					{ width: 100%; margin-left: 0; float: none; margin-bottom: 20px; display: block; }
	.span_4_of_12 #projOverview			{ width: 100%; }
	
	#footer #footerLinks					{ width: 100%; margin-bottom: 20px; }
	#footer #footerContact					{ width: 100%; margin-bottom: 10px; }
	#footer #footerLogo						{ margin: 20px 0 10px 0; }
	
} /*/mediaquery*/