/* --------------- (c) 2013 alogis ag / beat schaub ------------------------------------------------------------------------ */
@charset "utf-8";
/* --------------- Colors -----------------------------------------------------------------------------------------------------
------------------ End Colors ---------------------------------------------------------------------------------------------- */

/* --------------- General Definitions ------------------------------------------------------------------------------------- */
*						{ margin: 0; padding: 0; }
/* Set table cellspacing / cellpadding to 0 */
table					{ border-spacing: 0; border-collapse:collapse; border: none; }
/* 'Cuz not all browsers do it the same way??? */
table, td			{ box-sizing: border-box; -moz-box-sizing: border-box; vertical-align: top; }
/* Prevent IE from making border and outline around images that are links */
a > img				{ border: none; outline: none; }
/* For Firefox who doesn't know these tags anymore */
b, strong			{ font-weight: bold; }
/* --------------- End General Definitions --------------------------------------------------------------------------------- */

/* --------------- Homogenize Form Field behaviour -------------------------------------------------------------------------- */
input[type="text"], input[type="select"], input[type="password"], select, textarea {
	/* BORDER  		*/	border: 1px solid #cccccc;
	/* BACKGROUND	*/	background-color: transparent;
	/* PADDING 		*/	padding: 1px 2px;
	/* FONT-FAMILY	*/	font-family: inherit;
	/* FONT-SIZE	*/	font-size: inherit;
	/* LINE-HEIGHT	*/	line-height: 16px;
	
	/* So all those elements behave the same */
	box-sizing:			border-box;
	-moz-box-sizing:	border-box;
	}

.w150					{ width: 150px; }
.w250					{ width: 250px; }
.w350					{ width: 350px; }
.w500					{ width: 500px; }
/* --------------- End Homogenize Form Field behaviour ---------------------------------------------------------------------- */

/* --------------- Skelleton ------------------------------------------------------------------------------------------------ */
html										{  }
body										{ font: 13px Spinnaker; color: #555555; background: url(/pages/img/headerBGshort.jpg) no-repeat center top #f3f7f8; line-height: 20px; }
body.home								{ background: url(/pages/img/headerHomeBG.png) no-repeat center top #f3f7f8; }
.container								{ width: 960px; margin: 0 auto; }
#mainBG, .gradientBG					{
												background: #f3f7f8; /* f4f8f9 f3f7f8 Old browsers */
												background: -moz-linear-gradient(top,  #f3f7f8 0%, #e9f0f3 100%); /* FF3.6+ */
												background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f7f8), color-stop(100%,#e9f0f3)); /* Chrome,Safari4+ */
												background: -webkit-linear-gradient(top,  #f3f7f8 0%,#e9f0f3 100%); /* Chrome10+,Safari5.1+ */
												background: -o-linear-gradient(top,  #f3f7f8 0%,#e9f0f3 100%); /* Opera 11.10+ */
												background: -ms-linear-gradient(top,  #f3f7f8 0%,#e9f0f3 100%); /* IE10+ */
												background: linear-gradient(to bottom,  #f3f7f8 0%,#e9f0f3 100%); /* W3C */
												filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f7f8', endColorstr='#e9f0f3',GradientType=0 ); /* IE6-9 */
											}

@font-face 								{
												 font-family: 'dk_babysitter_regular';
												 src: url('/pages/font/dk_babysitter-webfont.eot');
												 src: url('/pages/font/dk_babysitter-webfont.eot?#iefix') format('embedded-opentype'),
														url('/pages/font/dk_babysitter-webfont.svg#dk_babysitter_regular') format('svg'),
														url('/pages/font/dk_babysitter-webfont.woff') format('woff'),
														url('/pages/font/dk_babysitter-webfont.ttf') format('truetype');
												 font-weight: normal;
												 font-style: normal;

												}

.img_cms.L									{ margin: 5px 15px 5px 0; }
.img_cms.R									{ margin: 5px 0 5px 15px; }
.img_cms.LA 		 						{ margin: 5px 15px 5px 0; }
/* --------------- End Skelleton -------------------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------------------------------------------------- */
/* --------------- HEADER --------------------------------------------------------------------------------------------------- */
/* --------------- ServiceNavigation ---------------------------------------------------------------------------------------- */
#logo										{ position: relative; display: block; float: left; height: 50px; width: 329px; margin-top: 8px; background: url("/pages/img/REFK_Zofingen_RGB_negativ.svg") no-repeat left center; background-size: contain; }
#logo:after								{ display: block; content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url("/pages/img/flags.png") no-repeat right center; background-size: contain; }
/*#logo										{ display: block; float: left; height: 50px; width: 329px; margin-top: 8px; background: url(/pages/img/logo_full.png) no-repeat left center; }*/
#serviceNavigation					{ height: 70px; }
#serviceNavigation ul				{ float: right; padding-top: 24px; }
#serviceNavigation ul li			{ float: left; list-style: none; margin-left: 7px; padding-left: 7px; border-left: 1px dotted #59a9d4; }
#serviceNavigation ul li:first-child	{ border-left: none; }
#serviceNavigation ul li a			{ display: block; text-decoration: none; color: #59a9d4; margin: -4px 0 -5px 0; }
#serviceNavigation ul li a:hover	{ color: #ffffff; }

/* --------------- Navigation ----------------------------------------------------------------------------------------------- */
#navigation								{ float: right; padding: 30px 15px 14px 15px; text-align: justify; }
#navigation	li							{ display: inline-block; list-style: none; position: relative; }
#navigation	li.breaker				{ width: 200px; height: 0px; }
/*#navigation	li							{ float: left; list-style: none; }*/
#navigation	li a						{ display: block; padding: 5px 15px; border: 1px solid transparent; border-radius: 3px;
											  font-size: 16px; color: #ffffff; text-decoration: none; text-transform: uppercase; }
#navigation	li:hover a.sub			{ border-radius: 3px 3px 0 0; }
#navigation	li.current a			{ border-radius: 3px; }
/*#navigation	li a:hover				{ border-top-color: #014368; border-right-color: #0168a2; border-bottom-color: #0168a2; border-left-color: #014368; background: #0168a2; }*/
#navigation	li.current > a,
#navigation	li:hover > a			{ border-color: #014368 #0168a2 #0168a2 #014368; background: #0168a2; }
#navigation	li:hover > div			{ display: inline-block; }
#navigation	li div					{ display: none; position: absolute; left: 0; top: 20px; padding-top: 11px; z-index: 100; }
#navigation	li div ul				{ display: inline-block; border-radius: 0 4px 4px 4px; border: 1px solid #676767; }
#navigation	li div ul li			{ display: block; }
#navigation	li div ul li a			{ color: #676767; white-space: nowrap; border-color: transparent !important; background: none !important; }
#navigation	li div ul li a:hover	{ color: #014368; background: #ffffff !important; }

/* --------------- END HEADER ----------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------- */


/* --------------- Content -------------------------------------------------------------------------------------------------- */
#main										{ padding: 0 30px 30px 30px; }

#crump									{ padding: 18px 0 14px 300px; line-height: 16px; font-size: 11px; }

#eyeCatcher								{ width: 269px; padding-right: 30px; }
#eyeCatcher	ul							{ }
#eyeCatcher	ul li						{ border: 1px solid #9CCAF4; background: url(/pages/img/yt50-2.png); list-style: none; border-radius: 15px;
											  margin-bottom: 10px; box-shadow: 0 0 10px #bbbbbb; }
#eyeCatcher	ul li:hover				{ background: #ffffff; box-shadow: 0 0 10px #676767; }
#eyeCatcher	ul li a					{ display: block; padding: 18px 12px 12px 12px; line-height: 32px; width: 213px;
											  /*font-family: 'dk_babysitter_regular';*/ font-size: 18px; color: #0168a2; /*letter-spacing: 1px;*/ text-align: right;
											  background-repeat: no-repeat; background-position: 10px center; text-decoration: none; }

#spacer									{ width: 1px; background: url(/pages/img/spacerBG.png) repeat-y center top; }

#content									{ width: 630px; padding-left: 30px; }
#content ul								{ padding: 5px 0 9px 18px; }
#content ul li							{ padding-bottom: 5px; }
#crump a,
#content a								{ color: #0168a2; text-decoration: none; }
#crump a:hover,
#content a:hover						{ color: #6FAE34; }
#content	img							{ border-radius: 5px; }
#content .greenLink,
#content .greenLinkEnd				{ float: right; display: inline-block; height: 18px; line-height: 18px;  }
#content .greenLink					{ font-size: 11px; font-weight: bold; color: #ffffff !important; padding: 2px 6px 0 8px; background: url(/pages/img/greenLink.png) no-repeat; }
#content .greenLinkEnd				{ width: 12px; background: url(/pages/img/greenLinkEnd.png) no-repeat; padding-top: 2px; }

.stripedtable							{ width: 100%; }
.stripedtable td						{ padding: 2px 10px; }
.oddRow									{ background-color: #ffffff; }
.evenRow									{ background-color: #C9E5F4; }
.linkText								{ width: 308px; }

.docListTable							{ width: 100%; }
.docListTable td						{ padding: 2px 15px 2px 5px; }
.docListTable td a					{ padding-left: 20px; color: #555555 !important; background-position: left center; background-repeat: no-repeat; }
.docListTable td a:hover			{ color: #0168a2 !important; }
/* --------------- End Content ---------------------------------------------------------------------------------------------- */

/* --------------- Footer --------------------------------------------------------------------------------------------------- */
#footerBGTop							{ background: url(/pages/img/footerBGTop.png) no-repeat center top #ffffff; }
#footerBGBottom						{ background: url(/pages/img/footerBGBottom.png) no-repeat center bottom;  }
#footer									{ position: relative; padding: 50px 0 60px 0; }

.footerContent							{ padding: 0 15px; width: 159px; line-height: 18px; }
.footerContent	li						{ list-style: none; }
.footerContent	li	a					{ color: #676767; font-size: 14px; text-decoration: none; }
.footerContent	li	a:hover			{ color: #014368; }
.footerContent	li	ul					{ padding: 10px 0; }
.footerContent	li	ul li a			{ font-size: 11px; }
.footerSpacer							{ width: 0; border-right: 1px dotted #787880; }

#copy										{ position: absolute; left: 0px; bottom: 0px; width: 960px; text-align: center; padding: 10px 0; font-size: 11px; }
#copy a									{ color: #676767; }
#copy a:hover							{ color: #449900; }
/* --------------- End Footer ----------------------------------------------------------------------------------------------- */

#content ul#box_sitemap				{ padding-left: 0; }
#content ul#box_sitemap li			{ list-style: none; display: block; }
#content ul#box_sitemap li a		{ display: block; padding: 1px 5px }
#content ul#box_sitemap li a:hover	{ background: #ffffff; }
#content ul#box_sitemap li	ul		{ padding: 2px 20px 10px 20px; }


/* --------------- Events --------------------------------------------------------------------------------------------------- */
.eventTitleSmall					{ color: #0168a2; padding: 16px 0 2px 0; font-size: 14px; }
.eventFilterBox					{ padding: 10px; border-radius: 10px; margin-bottom: 40px; background: url(/pages/img/yt50-2.png); box-shadow: 0 0 10px #dddddd; }

.eventFilterTable					{ }
.eventFilterTable td				{ padding-right: 5px; line-height: 21px; height: 21px; }
.eventFilterTable td *			{ float: left; }
input[type="text"].eventFilterSearch	{ width: 217px; background: #ffffff; line-height: 17px; height: 21px; border-right: none; }
input[type="submit"].eventFilterButton	{ width: 25px; height: 21px; border: 1px solid #cccccc; border-left: none;
													  background: url(/pages/img/search_14_555.png) no-repeat center #eeeeee; }
input[type="submit"].eventFilterButton:hover	{ background: url(/pages/img/search_14_fff.png) no-repeat center #0168a2; cursor: pointer; }

.eventListTable					{ width: 100%; }
.eventListTable td				{ padding: 5px 10px 5px 0px; line-height: 16px; }
.eventListTable .titleColumn	{ min-width: 220px; font-weight: bold; }
.eventListTable .dataColumn	{ max-width: 100px; padding: 5px 10px; white-space: nowrap; }

.eventPlanTable					{ margin: 0 auto 40px auto; }
.eventPlanTable td				{ padding: 1px 2px 1px 3px; width: 27px; border-right: 1px solid #d8d8d8; line-height: 16px; font-size: 12px; }
.eventPlanTable td.planTableTime { padding: 1px 12px 1px 3px; }
.eventPlanTable td.planTableReserved { background:#0168a2; cursor: pointer; }
.eventPlanTable td.planTableReservedPrivate { background: #dd0d00; }
.eventPlanTable td.midday		{ border-top: 2px solid #d8d8d8; }
.eventListTable td.eventNewYear { padding: 30px 10px 0px 10px; }

.showAllEvents,
.showLessEvents					{ cursor: pointer; float: right; padding-right: 20px; color: #0168a2; margin-top: 6px; }
.showAllEvents						{ background: url(/pages/img/down.png) no-repeat right center; }
.showLessEvents					{ background: url(/pages/img/up.png) no-repeat right center; }
/* --------------- End Events ----------------------------------------------------------------------------------------------- */


.videobox	{ position: relative; margin: 12px 0; padding: 28.2%; }
.videobox iframe { position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: black; border: none; }