/* ==============
	MOBILE BASIC 
   ============== */

/* ==============
	MOBILE: Menu
   ============== */
 
/* ==============
	MOBILE: Main
   ============== */
	.content
	{
		position:				static;
	}
	
	.tasks
	{
		padding:				4.0625% 0;		/* 13px v 320*/
		margin-bottom:			7.5%;		/* 24px v 320 */
		color:					#2f2a67;
		font-size:				1.5em;	/* 24 px */
		
		background: 			url(/content/images/general/bkg-tasks.png) left top repeat;
		
		-moz-border-radius:		7px; 			/* Firefox */
		-webkit-border-radius:	7px; 			/* Safari, Chrome */
		border-radius: 			7px; 			/* CSS3 */	
	}
	
	.contrast .tasks
	{
		background:				#fff;
	}
	
		.tasks a
		{
			display:				block;
			color:					#2f2a67;
			padding:				10px;
			text-decoration:		none;
			background:				transparent;		
		}
		
			.tasks a:hover
			{
				color:					#fff;
				text-decoration:		none;

				background: 			#312c6a;	/* Old browsers */
				background: 			url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUzNTBhOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMTJjNmEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
				background: 			-moz-linear-gradient(top,  #5350a9 0%, #312c6a 100%); /* FF3.6+ */
				background: 			-webkit-gradient(linear, left top, left bottom, color-stop(0%,#5350a9), color-stop(100%,#312c6a)); /* Chrome,Safari4+ */
				background: 			-webkit-linear-gradient(top,  #5350a9 0%,#312c6a 100%); /* Chrome10+,Safari5.1+ */
				background: 			-o-linear-gradient(top,  #5350a9 0%,#312c6a 100%); /* Opera 11.10+ */
				background: 			-ms-linear-gradient(top,  #5350a9 0%,#312c6a 100%); /* IE10+ */
				background: 			linear-gradient(to bottom,  #5350a9 0%,#312c6a 100%); /* W3C */
				/*	filter: 				progid:DXImageTransform.Microsoft.gradient( startColorstr='#5350a9', endColorstr='#312c6a',GradientType=0 );*/ /* IE6-8 */
			}
			
				/*.tasks li.item-0 a
				{
					font-family:			ReykjavikOneBGauge, 'Arial Narrow', 'Trebuchet MS', Arial, "Helvetica Neue", Helvetica, sans-serif;
				}*/
				
				.lt-ie9 .tasks a:hover
				{
					background: 			#312c6a;	/* Old browsers */
				}
	
	/* QUICKLINKS */
	.quickLinks 
	{
	}
	
		.quickLinks li
		{
			font-size:				1.25em; 				/* 20px */
			padding:				0 0 12px 32px;
			background:				url(/content/images/general/bullet-list-arrow.png) 13px 0.25em no-repeat transparent;	/* 5px*/
		}
		
		.quickLinksSecondary
		{
			padding-top:			20px;
		}

			.quickLinksSecondary li:last-child
			{
				padding-bottom: 			0;
			}
		
		/* ICONS */
		.quickLinks .icon
		{
			background:				url(/content/images/general/sprites.png) left top no-repeat transparent;
		}
		
			.icon.adres
			{
				background-position:		left -560px;	
			}
			
			.icon.tijden
			{
				background-position:		left -620px;
			}
			
			.icon.parkeren
			{
				background-position:		left -680px;
			}
			
			.icon.route
			{
				background-position:		left -740px;
				margin-bottom:				0;
			}
			
			.icon.kaartje
			{
				background-position:		left -800px;
			}
			
			.icon.voorzieningen
			{
				background-position:		left -860px;
			}
			
		/* NEWS */
		.news
		{
			clear:						both;
		}
		
	.carouselBanner
	{
		position:						relative;
		display:						block;
		margin:							30px 0 0 0; /* Remove this later */
		padding:						20px 3.125%; /* 20px 10px */
		color:							#2f2a67;
		background-color:				#fff;
		border:							1px solid #2f2a67;		
		-moz-border-radius:				7px;
		-webkit-border-radius:			7px;
		border-radius:					7px;
		
		background-image:				url(/content/images/general/banner-arrow.png);
		background-position:			right center;
		background-repeat:				no-repeat;
	}
		.carouselBanner .arrow
		{

		}
		
		body .content .carouselBanner h2
		{
			padding-bottom:					0;
		}
	

/* ==============
	MOBILE: Footer
   ============== */

/* ===============
	ALL: IE Fixes
   =============== */
   	.lt-ie9 .tasks
	{
		/* IE */
		/*behavior: 					url(/content/scripts/pie.htc);*/
	}

/******************************************************* RULER *******************************************************/

/* ==========================================================================
   Media Queries
   ========================================================================== */

/*@media only screen and (min-width: 480px)*/ 
@media only screen and (min-width: 30em)
{

	
/* ====================
    INTERMEDIATE: Menu
   ==================== */

/* ====================
    INTERMEDIATE: Main
   ==================== */
	.tasks
	{
		position: 				absolute;
		left:					3.252032520325203%;			/* 40px v 1230 */
		top:					282px;						/* 128px + 154  */
		z-index:				100;
		
		width:					63.33333333333333%;			/* 304px v 480*/
		padding:				1.056910569105691% 0;		/* 13px v 1230 */
	}
	
	.wrapper.main
	{
		padding-top:				564px;	/* 154 + 360 + 50 */
		padding-bottom:				0;
	}
   
/* CAROUSSEL */
	#caroussel
	{
		display:				block;
		position:				absolute;
		z-index:				98;
		
		width: 					100%;
		/*height:					472px; */	 /* 472 v 1230 */
		height:					360px;
		
		/*padding-top:			154px;*/
		
		/*overflow:				hidden;*/
	}
	
		.slide
		{
			position:				relative;
			width:					100%;
			height:					100%;
		}
		
		.overlay
		{
			position:				absolute;
			z-index:				99;
			
			left:					0;
			bottom:					0;
			
			display:				block;
			
			width:					64.8780487804878%; /* 798 v 1230 */
		}

	.news
	{
		clear:				none;
	}

	/* MODULE */
	.module
	{
		float:					left;
		margin-left:			7.967479674796748%;			/* 98px v 1230; */
		margin-bottom:			50px;
	}
	
		.quickLinks
		{
			margin-left:			0;
			width: 					36.34146341463415%;		/* 272px + 175 v 1230 ;*/
		}
		
		.news
		{
			float:					right;
			width:					42.68292682926829%;		/* 350px + 175 v 1230;*/ 
		}
		
		.calender
		{
			clear:					both;
			width:					93.75%;		/* 100% -3.125% -3.125 */
			margin-left:			0;
		}
		
		.calender .no-events
		{
			padding-bottom:			0.5em;
		}
		
		.news,
		.quickLinks
		{
			min-height:				450px;		
		}
	
	.tasks a
	{
		padding:				10px 18px;
	}

/* ====================
    INTERMEDIATE: Footer
   ==================== */

}

/******************************************************* RULER *******************************************************/

/*@media only screen and (min-width: 768px)*/
@media only screen and (min-width: 48em) 
{

/* ====================
    LARGE: Menu
   ==================== */

/* ====================
    LARGE: Main
   ==================== */
	#caroussel
	{
		height:					472px;
	}
   
	.news,
	.quickLinks
	{
		min-height:				383px;		
	}

	/* CONTENT */
	.wrapper.main
	{
		padding-top:				676px;	/* 154 + 472 + 50 */
	}
	
	.tasks
	{
		position: 				absolute;
		left:					3.252032520325203%;			/* 40px v 1230 */
		top:					282px;						/* 128px + 154  */
		z-index:				100;
		
		width:					39.58333333333333%;			/* 304px v 768*/
		padding:				1.056910569105691% 0;		/* 13px v 1230 */
	}

/* ====================
    LARGE: footer
   ==================== */
}

/******************************************************* RULER *******************************************************/
/*@media only screen and (min-width: 896px) */
@media only screen and (min-width: 56em)
{

/* ====================
    BETWEENIE : Menu
   ==================== */

/* ====================
    BETWEENIE : Main
   ==================== */
	/* MODULE */
	.module
	{
		float:					left;
		margin-left:			7.967479674796748%;			/* 98px v 1230; */
		padding:				1.219512195121951% 0.8130081300813008% 0.8130081300813008% 0.8130081300813008%;	/* 15px en 10px v 1230 */
		margin-bottom:			4.065040650406504%;		/* 50px v 1230 */
	}
	
		.quickLinks
		{
			margin-left:			0;
			width: 					22.11382113821138%;		/* 272px v 1230 ;*/
		}
		
		.news
		{
			width:					28.45528455284553%;		/* 350px v 1230;*/ 
		}
		
		.calender
		{
			clear:					none;
			width:					28.45528455284553%;		/* 350px v 1230;*/ 
		}
		
		.calender,
		.news,
		.quickLinks
		{
			min-height:				385px;
		}
}

/******************************************************* RULER *******************************************************/

/*@media only screen and (min-width: 1140px)*/
@media only screen and (min-width: 71.25em) 
{
/* ====================
    WIDE: Menu
   ==================== */

/* ====================
    WIDE: Main
   ==================== */
	.tasks
	{
		width:					24.71544715447154%;			/* 304px v 1230*/
	}
	
/* ====================
    WIDE: footer
   ==================== */
}

/******************************************************* RULER *******************************************************/

/* @media only screen and (min-width: 1280px) */
@media only screen and (min-width: 80em) 
{

/* ====================
    MAX WIDTH: Menu
   ==================== */
 
/* ====================
    MAX WIDTH: Main
   ==================== */

/* ====================
    MAX WIDTH: Footer
   ==================== */

}


/******************************************************* RULER *******************************************************/


@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min–moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 2) 
{

/* ====================
    RETINA
   ==================== */
	.quickLinks .icon
	{
		background-image:			url(/content/images/general/sprites_2x.png);
		
		-webkit-background-size: 	25px 1840px;
		-moz-background-size: 		25px 1840px;
		background-size: 			25px 1840px;
	}
	
		.quickLinks li,
		.module.list li
		{
			background-image:			url(/content/images/general/bullet-list-arrow_2x.png);
			
			-webkit-background-size: 	7px 10px;
			-moz-background-size: 		7px 10px;
			background-size: 			7px 10px;
		}
}