/* Gastouderopvang de Eekhoorn */

@base-url:	"http://gastouderopvang-de-eekhoorn.nl";

@import "css3.less";
@import "general.less";
@import "grid.less";
 
/* Grid setup */
@columns: 			12;
@column-width: 		70;
@gutter-width: 		10;

/* Eekhoorn huisstijl: */
@body-color:		#eee;
@hilite-color:		#800;
@header-color:		#800;
@secondary-color: 	#666;
@menu-link-color:	#ee0;
@content-bg:		#fff;
@hilite-bg:			#fdd;

@link-color:		@hilite-color;

/* @body-width:		960px; */

body {
	background-color:@body-color;
	padding-top:20px;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size:12px;
}

#page_container {
	.box-shadow;
	.rounded_top_right(20px,#ccc);
	width:@total-width;
	margin: 0 auto;
	padding:0px;
	background: @content-bg url("../img/column_230.png") repeat-y;  /* Faux column */
	overflow:hidden;
}

#page_header {
	.row;
	h1 {
		.shadow;
		.align_center;
		color:@header-color;
		font-size:32px;
		padding-top:20px;
	}
	h2 {
		.shadow;
		.align_center;
		color:@secondary-color;
		.normal;
		.italic;
		font-size:22px;
	}

	#logo {
		.left_col;
		background-color: @hilite-color;
		text-align:center;
		padding:10px 0px;
		img { 	.box-shadow; border:1px solid #222;	}
	}
}

#page_content {
	.row(12);
	nav {
		.left_col;
		height:auto !important;
		min-height:100%;
	}
	ul#nav_list {
/* 		font-family: 'Arial', arial, serif;*/
		font-size: 14px;
		list-style:none;
		margin:5px;
		padding:10px 0px 40px 0px;
		overflow:auto; /* makes sure the container fits the floated list-items below */
		
		a { .a(#fff, none, none); .normal; }

		li {
			position:relative;
			z-index: 5;
			margin:3px 5px;
			padding:5px 10px 4px;
			float:top; /* floats list items to the left, creating a horizontal menu */
		}
		li.backLava {
			/* background-color: @hilite-color; */
			border-bottom: 2px solid @hilite-color;
		}
		li.selectedLava {
			color: @menu-link-color;
		}
	}
	#main_content { 
		.right_col; 

		h2 {
			.normal; .italic; 
			font-family: Georgia, Times, serif;
			margin: 0px; 
			padding:5px 0px; 
			color:@hilite-color;
		}
		h3 { 
			.normal; .italic; 
			font-family: Georgia, Times, serif;
			margin: 0px; 
			padding:5px 15px; 
			background-color:@hilite-color; color:#fff;
		}
		#ref_wrapper {
			.row(9);
		}
		#ref_uitleg {
			.column(4,9);
		}
		#ref_teksten {
			.column(5,9);
			min-height:250px; /* Aanpassen indien nodig.*/
		}
		
		blockquote {
			font-family: Georgia, Times, serif;
			font-size: 14px;
			width: 200px; /* required */
			margin: 0 auto;
			color: @hilite-color;
			
			p { margin-bottom: 10px; font-style: italic; }
			cite { font-style: normal; display: block; text-align: right; text-transform: uppercase; font-size: 10px; font-weight: bold; letter-spacing: 1px; font-family: Arial, Helvetica, sans-serif; }
		}
		#quote_wrap { 
			background: @hilite-bg url( "../img/quotes_open.png" ) no-repeat 20px 0px;
			margin-bottom:40px; padding: 20px; border: 1px solid @hilite-color;
		}


	}
}

.theme-default { 
	margin-bottom:100px; 
	#slider {
		margin:20px auto 0 auto;
		width:618px; /* Make sure your images are the same size */
		height:246px; /* Make sure your images are the same size */
	}
}


footer {
	background-color:@secondary-color;
	color:#fff;
	padding-bottom:10px;
	a { .a(#fff, underline, none);  }
	
	#page_footer {
		.row(12);
		padding:10px 0px;
		
		
		h2 {
			font-size: 18px;
			font-style: italic;
			color:@hilite-color;
			.shadow;
		}
		#adres   { .column(2,12); .offset(3); background:url("../img/home.png") no-repeat; padding-left:24px; }
		#email   { .column(2,12); .offset(1); background:url("../img/mail.png") no-repeat; padding-left:24px; }
		#info    { .column(2,12); .offset(1); background:url("../img/contacts.png") no-repeat; padding-left:24px; }
	}

	#attribution {
		.align_right;
		.italic;
		font-size:smaller;
	}
}

.left_col {
	.column(3,12);
}

.right_col {
	.column(9,12);
}