/* --------------------------------------------------------

	Author:      click solutions GmbH  
				 Michael Schultze
	Date:		 06.02.2015

	Media:       all (screen, projector, print)
	Responsive:  yes
	Breakpoints: 40em, 64em, 90em, 120em (mobile first)
					

   -------------------------------------------
	TABLE OF CONTENT :: STYLE SECTIONS
		
		Style defaults
		Typography
		Buttons
		Colors
		
		Topbar
		Quicksearch
		Banner
		Search Results
		Navigation
		Text & Content
		Breadcrumb
		Listing
		Gallery embed in content
		News
		Buttons
		Button Groups
		Dropdown Buttons
		Split Buttons
		Button bar
		Forms
		Labels
		Prefix & Postfix
		Inputs
		Error
		Switch (Checkboxes)
		Panels
		Footer
		Social
		Subscribe
		Sitemap
		
		Helper classes & Accessibility
		Print styles

   ------------------------------------------- */
@charset 'UTF-8';
/* @import "normalize.css"; */


/* ========================================================
   Style defaults
   ======================================================== */

html, body {
  font-size: 100%;
  height: 100%; }

body {
  padding: 0;
  margin: 0;
  position: relative;
  cursor: auto; }

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	*behavior: url(/styles/boxsizing.htc); }

html,
button,
input,
select,
textarea {
	color: inherit; }

hr {
	clear: both; 
	margin: 0 0 1.5em; 
	border: none;
	border-bottom: 1px solid #ccc; 
	background: none; 
	height: 0; 
}


/* Remove default fieldset styles. */
fieldset {
	border: 0; margin: 0; padding: 0; }
/* Allow only vertical resizing of textareas. */
textarea {
	resize: vertical; }

img,
object,
embed {
  max-width: 100%;
  height: auto; }

object,
embed {
  height: 100%; }

img {
  max-width: 100%;
  height: auto;
  display: inline-block; 
  vertical-align: middle; /* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */
  -ms-interpolation-mode: bicubic; }

textarea {
  height: auto;
  min-height: 50px; }

select {
  width: 100%; }

a:hover {
  cursor: pointer; }

html {  /* force scrollbars */
	overflow-y: scroll;
}




/* ========================================================
    Typography
   ======================================================== */


html {
	font-size: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

body {
	background: #fff;
	color: #333;
	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 1.618;
	-webkit-font-smoothing: antialiased;
	/*-webkit-font-smoothing: subpixel-antialiased;*/
}
	
/* http://typecast.com/blog/a-more-modern-scale-for-web-typography */
/* http://typecast.com/blog/contrast-through-scale */
/* Fibonacci Sequence as a canon on which to compose – setting each subsequent value
 to the sum of the preceding two values – 16, 24, 40, 64 */

h1, .h1 {
	font-size: 4em;
	line-height: 1.1;
	margin: 0 0 .3em; 
	font-weight: 400;
	text-decoration: none;
	text-rendering: optimizeLegibility; }
	
	h1 a, .h1 a {
		color: inherit; 
		text-decoration: none; }

	h1 a:hover, .h1 a:hover {
		text-decoration: none; }

h2, .h2 {
	font-size: 2.5em;
	line-height: 1.15;
	margin: .5em 0; 
	font-weight: 400;
	font-style: normal;
	text-decoration: none; }

	h2 a, .h2 a {
		color: inherit;
		text-decoration: none; }

	h2 a:hover, .h2 a:hover {
		text-decoration: none; }

h3, .h3 {
	font-size: 1.5em;
	line-height: 1.2;
	margin: 1em 0;
	font-weight: 400; }

	h3 a, .h3 a {
		color: inherit;
		text-decoration: none; }

	h3 a:hover, .h3 a:hover {
		text-decoration: none; }

h4, .h4 {
	font-size: 1.2em;
	line-height: 1.3;
	margin: 1.5em 0;
	text-decoration: none;
	font-weight: 400; }

	h4 a, .h4 a { 
		text-decoration: none; }

	h4 a:hover, .h4 a:hover { 
		text-decoration: none; }


p {
	line-height: 1.618;
	margin: 0 0 1.618em;
	text-indent: 0em; }
	
	p:empty {
	    display: none; }
	
	/* typographic scaling between heading and paragraph to lead into the content */
	.text-intro,
	.text-subheader { 
		font-size: 1.5em;
		line-height: 1.3;
	}
	/* first paragraph emphasised */
	.text-lead { 
		/*font-size: 1.25em;*/
		font-weight: bold;
	}
	.text-message {
		text-align: center;
		font-style: italic;
		font-size: 1.5em;
		line-height: 1.3;
	}
	.text-author {
		opacity: .6; 
	}
	.text-dropcap {
		float: left;
		font-size: 3.5em;
		line-height: 0.8;
		padding: 0.05em 0.1em 0 0;
	}
	.text-caption {
		margin-top: .3em;
		font-style: italic;
		font-size: 0.875em;
	}
blockquote {
	margin: 1.618em 0;
	border-left: 1px solid #ccc;
	padding-left: 1em;
}
	blockquote p {
		font-style: italic;
	}

a {
	color: inherit;
	text-decoration: none;
	font-weight: inherit;
	border-bottom: 1px solid #ccc; }

	a:hover {
		border-bottom-color: #439ab7; }

ul, ol {
	margin: 0 0 1.618em; 
	padding: 0 0 0 1.5em;
}

	li {
		line-height: inherit; 
		margin-bottom: 1em;
		position: relative;
		margin: 0 0 0.618em;
		padding: 0 0 0 0.2em;
	}

	ul ul {
		margin: 0;
	}


.list--custombullets li {
	list-style: none;
	padding: 0 0 0 1.2em;
	margin-left: -1.2em;
}
.list--custombullets li:before { /* cutom list bullets */
	position: absolute;
	left: 0;
	content: "▪";
	font-size: 1.1em;
	line-height: 1.2;
	color: #2ba6cb;
}


::-moz-selection {
	text-shadow: none; }

::selection {
	text-shadow: none; }








/* ========================================================
    Testimonial
   ======================================================== */

.testimonial {
	text-align: center;
}
	.testimonial__image {
		border-radius: 1000px;
	}
	.testimonial__name {
		margin: 0;
	}
	.testimonial__title {

	}
	.testimonial__text {
		text-align: center;
		font-style: italic;
		font-size: 1.5em;
		line-height: 1.3;
	}

/* ========================================================
	Topbar
   ======================================================== */
.topbar {
	width: 100%;
}

.topbar--sticky {
	position: absolute; 
	top: 0; 
	z-index: 900;
	background: rgba(255,255,255,0.9);
	box-shadow: 0 16px 25px -24px black;
}

.topbar.is-slight {
		position: fixed; 
}
	.is-slight .topbar--hide-on-slight {
		max-height: 0;
		display: none; 
	}






/* ========================================================
	Quicksearch
   ======================================================== */

.quicksearch {
	position: relative; font-size: 1em; width: 16em; 
	-webkit-transition: all .3s ease; transition: all .3s ease; }
	.quicksearch-input {
		-webkit-transition: background .3s, width .3s ease; 
		        transition: background .3s, width .3s ease;
		position: absolute; 
		right: 0; 
		-webkit-appearance:none; 
		   -moz-appearance:none; 
		        appearance:none; 
		width: 100%; 
		/*padding: .5em .8em; */
		padding: .1em .5em 0;
		background: white; 
		border-radius: 0;
		border: 1px solid #439ab7;  
		font-size:1.4em;
		color: #9b9b9b; }
		.quicksearch-input::-webkit-input-placeholder {
			color: #cecece; }
			.quicksearch-input:-moz-placeholder { /* Firefox 18- */
				color: #cecece;   }
			.quicksearch-input::-moz-placeholder {  /* Firefox 19+ */
				color: #cecece;   }
			.quicksearch-input:-ms-input-placeholder {  
				color: #cecece;   }
		.quicksearch-input:focus {
			color: #656565; 
			outline: none; 
			background-color: white; }
			.quicksearch-input:focus::-webkit-input-placeholder {
				color: #cecece; }
			.quicksearch-input:focus:-moz-placeholder { /* Firefox 18- */
				color: #cecece;   }
			.quicksearch-input:focus::-moz-placeholder {  /* Firefox 19+ */
				color: #cecece;   }
			.quicksearch-input:focus:-ms-input-placeholder {  
				color: #cecece;   }
		.quicksearch-input[type="search"] {
			-moz-appearance:    textfield;
			-webkit-appearance: textfield;
			appearance: textfield;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
		}

	.quicksearch-submit {
		position: absolute; top: 0; right: 0; width: auto; padding: 0 .5em; border: 0; background: none; }
		.quicksearch-submit:focus,
		.quicksearch-submit:hover {
			outline: none; cursor: pointer; }

		.quicksearch-icon {
			font-size: 1.2em; line-height: 2.2;
			color: #4080a3; }

/* states */
.quicksearch.is-slight  {
	width: 2em; }
	.quicksearch.is-slight .quicksearch-input {
		opacity: 0; -webkit-transition:opacity .2s linear,visibility 0s .3s; transition:opacity .2s linear,visibility 0s .3s }
	.quicksearch.is-slight.is-expanded .quicksearch-input {
		opacity: 1; -webkit-transition:opacity .2s linear,visibility 0s; transition:opacity .2s linear,visibility 0s }
	.quicksearch.is-slight .quicksearch-submit {
		opacity: 1; color: #808080; position: absolute; -webkit-transition:opacity .2s .3s; transition:opacity .2s .3s }
	.quicksearch.is-slight.is-expanded .quicksearch-submit {
		color: #363434; }
.quicksearch.is-expanded .quicksearch-input {
	min-width: 14em; }

/* modifier */
.quicksearch--small .quicksearch-input {
	padding: .3em 2em .3em .8em; font-size: 13px; }
.quicksearch--small .quicksearch-submit {
	top:7px; right:7px }

/* media queries */
@media (max-width: 90em) {
	.quicksearch {
		width: 14em }
}
@media (max-width: 79em) {
	.quicksearch {
		width: 10.5em }
}
@media (max-width: 66em) {
	.quicksearch {
		width:2em; }
	.quicksearch-input {
		opacity: 0; -webkit-transition:opacity .2s linear,visibility 0s .3s; transition:opacity .2s linear,visibility 0s .3s }
	.quicksearch.is-expanded .quicksearch-input {
		opacity: 1; -webkit-transition:opacity .2s linear,visibility 0s; transition:opacity .2s linear,visibility 0s }
	.quicksearch-submit {
		opacity: 1; position: absolute; -webkit-transition:opacity .2s .3s; transition:opacity .2s .3s }
	.quicksearch.is-expanded .quicksearch-submit {
		color: #363434; }
}




/* ========================================================
    Banner
   ======================================================== */

.banner {
	margin: 0 -3.125em; /* disable .row padding */
	 }
	.banner-img {
		width: auto!important;
		max-width: none; }

.banner-caption {
	padding: 0 4.125em;
	position: absolute;
	top: 3em;
	color: white; }

	.banner-headline, 
	.banner-subline {
		text-transform: uppercase;
		color: white;
		margin: 0; }
	.banner-headline {
		font-size: 2.5em; }
	.banner-subline {
		margin-bottom: 1em;
		font-size: 1.875em;  }





/* ========================================================
	Search Results
   ======================================================== */
.search {
		float: none;
	 }
	.search-form {
		position: relative; top:-.3em; font-size: .93em; max-width: 20em; }
		.search-input {
			-webkit-transition: background .3s, width .3s ease; transition: background .3s, width .3s ease;
			position: relative; right: 0; -webkit-appearance:none; -moz-appearance:none; appearance:none; width: 100%; line-height: 1.2; padding: .4em .8em .2em; color: #5d4f4b; }
			.search-input::-webkit-input-placeholder {
				color: #aea19d; }
				.search-input:-moz-placeholder { /* Firefox 18- */
					color: #aea19d;   }
				.search-input::-moz-placeholder {  /* Firefox 19+ */
					color: #aea19d;   }
				.search-input:-ms-input-placeholder {  
					color: #aea19d;   }
			.search-input:focus {
				color: #444; outline: none; }
				.search-input:focus::-webkit-input-placeholder {
					color: #5d4f4b; }
				.search-input:focus:-moz-placeholder { /* Firefox 18- */
					color: #5d4f4b;   }
				.search-input:focus::-moz-placeholder {  /* Firefox 19+ */
					color: #5d4f4b;   }
				.search-input:focus:-ms-input-placeholder {  
					color: #5d4f4b;   }
			.search-input[type="search"] {
				-moz-appearance:    textfield;
				-webkit-appearance: textfield;
				appearance: textfield;
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
			}

		.search-submit {
			position: absolute; top: 0; bottom: -1px; right: -1px; height: auto; width: auto; padding: 0 .5em; border: 0; background: #7b8c11; background: none; border-radius: 0 100px 100px 0; }
			.search-submit:focus,
			.search-submit:hover {
				outline: none; cursor: pointer; }

		.search-icon {
					color: #5d4f4b;
					color: #4080a3;
					font-size: 1.1em;
					line-height: 2.3;
					width: 1.4em; }


@media only screen and (max-width: 50em) {
	.search-form {
		margin: 0 auto; text-align: center; }
}

.search-heading {
	font-style: italic; }
.search-item:hover::after {
	color: #7b8c11; }
	.search-item:hover .search-href {
		text-decoration: underline; }
		.search-textwrapper {
			width: 100%; padding-right: 3em; color: #5d4f4b; }
			.search-title {
				margin: 0 0 .2em; color: #9d3610; }
			.search-href {
				font-size: .8em; opacity: .5; line-height: 1.2; margin-bottom: .3em; word-break: break-all; }
				.search-text {
					line-height: 1.4; }
					.search-highlight {
						font-style: normal; font-weight: 400; color: #7b8c11; }
.search-pagination {
	margin: 2em 0 0; padding-right: 2em; text-align: center; }
	.search-pagination>* {
		display: inline-block; width: 1.5em; height: 1.5em; line-height: 1.4; text-align: center; margin: 0 0 0 .4em; border-radius: 50%; background: #f0e8dc; color: #8e8278; color: #5d4f4b; text-decoration: none; }
	.search-pagination>strong {
		color: #9d3610; background: #dfdad1; }
	.search-pagination>*:hover {
		background: #dfdad1; text-decoration: none; }




/* ========================================================
	Navigation
   ======================================================== */

.nav__burger { 
	background: none; margin-right: .5em; padding: .4em .5em; border: none; outline: none; cursor: pointer; color: inherit; }
	/* IE 8 */
	.lt-ie9 .nav__burger {
		display: none!important; }


.nav { }
	.nav__list {
		list-style: none; 
		margin: 0; 
		padding: 0; 
		*zoom: 1; }
		.nav__list:before, .nav__list:after {
			content: " "; 
			display: block; }
		.nav__list:after {
			clear: both; }
	.nav__item {
		float: left; 
		width: 100%; 
		margin: 0; 
		padding: 0; 
		line-height: 1.1; 
		color: inherit; }
	.nav__link,
	.nav__link:hover {
		display: block; 
		text-decoration: none; 
		cursor: pointer; } 
	.nav__link:focus,
	.nav__link:hover,
	.nav__link.is-current {
		border-bottom: 1px solid #439ab7; }




/* navi--cats | main navigation for categories */
.nav--horizontal {
	  }
	.nav--horizontal .nav__item {
		float: left; 
		width: auto;  }
	.nav--horizontal .nav__link {
		position: relative; 
		padding: .5em 0.7em; 
		line-height: 1; 
		white-space: nowrap; }


.nav--horizontal.is-stacked .nav__item {
	float: none; 
	width: 100%;
}



/* navi--meta | meta navigation with aditional links used in topbar and footer */
.nav--meta { 
	float: right; font-size: .7em; text-transform: uppercase; padding-right: .8em; }
	.nav--meta .nav__item {
		width: auto; padding: .6em 1em .4em; }
	.nav--meta .nav__link {
		color: #656565; font-weight: 400; }
		.nav--meta .nav__link:hover,
		.nav--meta .nav__link:focus {
			color: #9d1f1e; }


/* alternative navigation text color */
.nav--alt .nav__link {
	color: white; }
	.nav--alt .nav__link:hover,
	.nav--alt .nav__link:focus {
		color: white; }


/* navi--pages | sub navigation for pages */
.nav--vertical > .nav__list {
	margin: 0 0 2em; }
	.nav--vertical .nav__item {
		border-bottom: 2px dotted #cecece; }
	.nav--vertical .nav__link {
		font-size: 1.0625em; line-height: 1.2; padding: .8em 0; color: #808080; overflow: hidden; 
		-ms-word-break: break-word; word-break: break-word; }
		.nav--vertical .nav__list .nav__list {
			padding-left: 0; margin-top: 0; }
		.nav--vertical .nav__list .nav__list .nav__item {
			margin: 0; border: none; box-shadow: none; }
		.nav--vertical .nav__list .nav__list .nav__link {
			font-size: 1em; font-weight: 400; padding: 0 0 .6em 0; }

	.nav--vertical .nav__link:focus,
	.nav--vertical .nav__link:hover,
	.nav--vertical .nav__link.is-current {
		color: #9d1f1e; }



	/*@media only screen and (max-width: 38em) {
	.nav--pages { font-size: 1.15em; }
		.nav--pages .nav__item {
		position: relative; overflow: hidden; }
		.nav--pages .nav__link {
			position: relative; padding: .9em 1.5em .9em 0; }
		.nav--pages .nav__link:after {
			content: "\e001"; color: #b2b2b2; position: absolute; right: 0; top: .9em; font-family: "zoro"; font-size: 1em; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none !important; speak: none; display: inline-block; text-decoration: none; width: 1em; line-height: 1em; -webkit-font-smoothing: antialiased; }
	}*/
	


/* navi--sitemap */
.nav--sitemap {
	font-size: 12px; }
	.nav--sitemap .nav__list {
		margin-bottom: 1.618rem; }
		.nav--sitemap .nav__item--cats,
		.nav--sitemap .nav__item:first-child .nav__link {
			font-weight: 600; }
		.nav--sitemap .nav__item { }
		.nav--sitemap .nav__link {
			margin-bottom: .618rem; }
		.nav--sitemap .nav__link:hover {
			 }



/* ========================================================
   Text & Content
   ======================================================== */


.text--static {
	min-height: 1px; }

.text-centered {
	text-align: center; }

.text-larger {
	font-size: 1.2em; }

.text-smaller {
	font-size: .8em; }





/* ========================================================
    Breadcrumb
   ======================================================== */

.breadcrumb {
	margin: 0 0 1.5em; 
	font-size: 11px;
	cursor: default; }

	.breadcrumb-item {
		display: inline-block;
		position: relative; z-index: 2; }
	
	.breadcrumb-link {
		text-decoration: none; 
		font-weight: 400; 
		color: #999; }
	
		.breadcrumb-link:hover {
			color: inherit; }
	
		.breadcrumb-link--current {
			color: inherit; }
	
	.breadcrumb-separator {
		color: #999; }
	
	.breadcrumb-sublist { 
		visibility: hidden;
		display: inline-block; 
		position: absolute; z-index: 1;
		top: 1em; left: 0;
		list-style: none;
		padding: .7em 1px 1px;
		background: white;
		min-width: auto;
		box-shadow: 0 2px 4px #e0e0e0; }
	
		.breadcrumb-subitem {
			white-space: nowrap;
			margin: 0; }
	
		.breadcrumb-sublink {
			display: block;
			padding: .3em .8em;
			color: #999;
			text-decoration: inherit;
			font-weight: 400; }
	
			.breadcrumb-sublink:hover {
				color: inherit; }
	
		.breadcrumb-item--dropdown:hover .breadcrumb-sublist {
			visibility: visible; }


/* ========================================================
    Pagination
   ======================================================== */


.pagination {
	margin: 0;
	text-align: center; }

	.pagination-item {
		display: inline-block;
		width: 1em; 
		text-decoration: inherit;
		color: inherit; }

	.pagination-item:hover {
		text-decoration: inherit;
		color: inherit; }

/* theme with buttons */
.pagination--buttons .pagination-item {
	width: 1.5em; 
	height: 1.5em; 
	background: #f0f0f0;
	line-height: 1.5; 
	background: #f0f0f0;
	text-align: center;  
	text-decoration: none; }

	.pagination--buttons .pagination-item:hover {
		background: #e0e0e0;
		text-decoration: none; }

	.pagination--buttons .pagination-item.is-current,
	.pagination--buttons .pagination-item.is-current:hover {
		background: none;
		color: inherit; 
		box-shadow: 0 0 4px #e0e0e0 inset; }

/* theme round buttons */
.pagination--rounded .pagination-item {
	margin-left: .4em;
	border-radius: 50%; }






/* ==========================================================================
	List
   ========================================================================== */

	.list {
		margin: 0 -1em;
		padding: 0;
		list-style: none; }

		.list__item { 
			position: relative;
			margin: 0;
			padding: 0;
			line-height: 1.4; }

			.list__link {
				display: block;
				padding: .2em 1em;
				text-decoration: none;
				overflow: hidden;
				color: inherit; }

			.list__link:hover {
				color: #0c61ed; }

			.list__link:focus,
			.list__link:active {
				outline: 1px solid #e0e0e0;
				background-color: #f7f7f7 }

			.list__item.is-current .list__link {
				pointer-events: none;
				text-decoration: none;
				background: #ecf2fe;
				color: #0c61ed;
				margin-top: -1px;
				margin-bottom: -1px;
				border-top: 1px solid #ecf2fe;
				border-bottom: 1px solid #ecf2fe;
				position: relative;
				z-index: 1; /* puts border-bottom in front of seperator of the next item */ }

	/* with horizontal lines between items */
	.list--seperator::before, 
	.list--seperator::after, 
	.list--seperator>.list__item::before { 
		content: "";
		display: block;
		height: 0;
		line-height: 0;
		margin: 0 1em;
		border-bottom: 1px solid #e0e0e0; }

		.list--seperator>.list__item:first-child::before {
			border: none; }

	.list--scrollable {
		max-height: 85vh;
		overflow-x: hidden;
		overflow-y: scroll; }



/* ========================================================
    Contact Detail
   ======================================================== */

.contact { }

	.contact__name {
		margin: 0 0 -.1em;
		padding-top: .15em; }





/* ========================================================
    Media Block
   ======================================================== */
/*
.media {
	overflow: hidden;
}
	.media__image {
		float: left;
		margin-right: 1em;
	}

	.media__body > *:first-child {
		margin-top: 0;
	}
*/


/* ========================================================
    Media Object
   ======================================================== */
	/* flexbox approach: http://philipwalton.github.io/solved-by-flexbox/demos/media-object/ */


.media {
	overflow:hidden; 
	_overflow:visible; 
	zoom:1;
}

	.media::after {
		overflow: hidden;
		content: " ";
		display: table;
		clear: both; }

	.media__image {
		float: left;
		margin-right: 1em; }

		.media__image img {
			display: block; }

	.media__right {
		float: left;
		margin-right: 1em; }

	.media__body {
		overflow:hidden; 
		_overflow:visible; 
		zoom:1; }

		.media__body *:first-child {
			margin-top: 0; }

		.media__body > *:last-child {
			margin-bottom: 0; }

.media--thumb .media__image {
	width: 8em;
	height: auto; }

	.media--thumb .media__image {
		display: block;
		float: left;
		padding-right: 1em;  }

	.media--thumb .media__body {
		display: block;
		margin-left: 8em; }





/* ========================================================
    Data
   ======================================================== */

.data__list {
	margin-bottom: 1em;
	line-height: 1.3;
	list-style: none;
	padding: 0; }

	.data__item {
		line-height: inherit;
		margin: 0; }

		.data__key {
			float: left;
			width: 8em;
			text-align: right;
			padding-top: .1em;
			padding-right: .7em;
			color: #999; }
			
			.data__key--has-select,
			.data__key.-has-select {
				padding-right: .4em; }

		.data__value {
			display: block;
			margin-left: 8em;
			padding-top: .1em;
			word-break: break-all;
			word-break: break-word; /* Non standard for webkit */
			-webkit-hyphens: auto;
			        hyphens: auto; }





/* ========================================================
   Listing
   ======================================================== */

.listing {
	margin: 0 -16px;
	margin: 0 -1rem;
	padding: 0; 
	list-style: none; }
	.listing__item {
		position: relative; 
		margin: 0; 
		overflow: hidden; }
		.listing__link {
			display: block; 
			padding: 16px 16px 0 16px; 
			padding: 1rem 1rem; 
			text-decoration: none; 
			overflow: hidden; 
			color: inherit;
			border: none; }
			.listing__link:hover {
				text-decoration: none; 
				color: inherit; }

	/* separator */
	.listing__item::before, 
	.listing__item:before { 
		content: ""; 
		display: block; 
		height: 0; 
		line-height: 0; 
		margin: 0 1em; 
		border-bottom: 1px solid #ccc;  }
		.listing__item:first-child::before, .listing__item:first-child:before {
			/*border: none;*/ }
	 /* chevron-right */
	.listing__item::after, 
	.listing__item:after {
		position: absolute; right: 0; top: 50%; z-index: 0;
		margin-top: -.5em;
		font: normal normal 45px "icon-font";
		font-size: 2.8rem;
		font-variant: normal;
		text-transform: none !important;
		speak: none;
		display: inline-block;
		text-decoration: none;
		width: 1em;
		line-height: 1em;
		content: ">";
		color: inherit;
		pointer-events: none;
		-webkit-font-smoothing: antialiased;
		-webkit-transition: right .3s ease-out, color .3s; transition: right .3s ease-out, color .3s; }
		.no-touch .listing__item:hover::after {
			right: 0; color: inherit; }
	.listing__item--slim::after,
	.listing__item--slim:after { /* arrow-right */
		font-size: 29px; font-size: 1.8rem; }

.listing--noarrow .listing__item::after,
.listing--noarrow .listing__item:after {
	display: none; }
	.listing--noarrow .listing__textwrapper {
		padding-right: 1em; }


/* Grid view */
.listing--grid {
	margin: -.5em; }
	.listing--grid:before, .listing--grid:after {
			content: " "; display: block; }
		.listing--grid:after {
			clear: both; }
	.listing--grid .listing__item {
		float: left; width: 33.333%; }
		.listing--grid .listing__link {
			margin: 0 .5em; padding: 0; }
		.listing--grid .listing__img,
		.listing--grid .listing__imgcrop {
			float: none; width: 100%; max-width: 100%; padding: 0; margin: 0 0 .8em; max-height: none; }
		.listing--grid .listing__textwrapper {
			float: none; width: 100%; min-height: 12em; font-size: 75%; padding: 0 2.5em 1em 0; }
	.listing--grid .listing__item::after, .listing--grid .listing__item:after { /* arrow-right */
		display: none; font-size: 29px; font-size: 1.8rem; top: 67%; }
	.listing--grid .listing__item::before, .listing--grid .listing__item:before { /* separator */
		display: none; }




/* responsive one which goes vertical on small screen */
/*@media only screen and (max-width: 29em) { 
	.listing--responsive .listing__item { 
		font-size: 80%; }
		.listing--responsive .listing__imgcrop,
		.listing--responsive .listing__img {
			float: none; 
			width: 100%; 
			max-width: 100%;
			padding: 0;
			margin: 0 0 1em 0; }
		.listing--responsive .listing__textwrapper {
			width: 100%; padding: 0 3em 1em 0; }
	.listing--responsive .listing__item::after, .listing--responsive .listing__item:after {
		display: block!important; top: auto; bottom: 1.2rem; font-size: 32px; font-size: 2rem; }
}*/


/* small one for sidebars */
.listing--small .listing__item,
.large-4 .listing__item { 
	font-size: 80%; }
	.listing--small .listing__imgcrop,
	.large-4 .listing__imgcrop {
		float: none; 
		width: 100%; 
		max-width: 100%;
		margin: 0 0 1em 0; }
	.listing--small .listing__textwrapper,
	.large-4 .listing__textwrapper {
		width: 100%; padding: 0 3em 1em 0; }
.listing--small .listing__item::after, .listing--small .listing__item:after,
.large-4 .listing__item::after, .large-4 .listing__item:after{ /* arrow-right */
	top: 75%; }




/* ========================================================
	Index
   ======================================================== */
/* Index view with text on picture and slide-up hover effekt */

.index { margin-top: 1.5em; }

	.index-list {
		list-style: none; 
		margin: -2px; 
		padding: 0; 
		*zoom: 1; }

		.index-list:before, .index-list:after {
			content: " "; 
			display: block; }

		.index-list:after {
			clear: both; }

	.index-item {
		margin: 0; 
		padding: 4px 2px 0; 
		overflow: hidden; 
		float: left; 
		width: 33.333%; }

		.index-link,
		.index-link:hover {
			position: relative; 
			display: block; 
			text-decoration: none; 
			overflow: hidden; 
			color: inherit; 
			min-height: 4em; }

			.index-imgcrop {
				position: relative; 
				display: block; 
				width: 100%; 
				max-width: 100%; 
				margin: 0; 
				background-position: 50% 50%; 
				background-size: cover; }

				.index-imgcrop > .index-img {
					visibility: hidden; 
					float: none; 
					padding: 0; 
					width: 100%; 
					max-width: 100%; }

					.index-img {
						width: 100%; 
						max-width: 100%; 
						margin: 0; }

			.index-textwrapper {
				position: absolute; 
				bottom: 0; 
				max-height: 3.8em; 
				width: 100%; }

				.index-textwrapper,
				.index-textwrapper * {
				-webkit-transition: all .3s ease-out;
					    transition: all .3s ease-out; }

				.index-title {
					margin-top: 0; 
					line-height: 1.2;
					-ms-word-break: break-word; 
					word-break: break-word; }

				.index-description {
					opacity: 0; 
					margin-bottom: 10em; }

		.index-link:hover .index-textwrapper {
			max-height: 100%; }

			.index-link:hover .index-description {
				opacity: 1; 
				min-height: 3em; }

	@media only screen and (max-width: 58em) { 
		.index-item {
			width: 50%; }
	} 





/* ========================================================
	Gallery embed in content
   ======================================================== */

.gallery { position: relative; }
	.gallery-list { position: relative;
		list-style: none; margin: 0 -.5em; padding: 0; *zoom: 1; }
		.gallery-list:before, .gallery-list:after {
			content: " "; display: block; }
		.gallery-list:after {
		clear: both; }
	.gallery-item {
		display: block; float: left; width: 33.333%; margin: 0; padding: 0 .5em;
		-webkit-transition: all .3s ease-out; transition: all .3s ease-out; }
		.gallery-item:first-child {
			position: relative; }
		.gallery-item:nth-child(n+4) {
			position: absolute; left: 100%; opacity: 0 }
		.gallery-item:nth-child(2) {
			position: absolute; left: 33.333%; }
		.gallery-item:nth-child(3) {
			position: absolute; left: 66.666%; }
		.gallery-item:hover {
			cursor: zoom-in; cursor: -webkit-zoom-in; }

.gallery.is-zoomed .gallery-item {
	left: 0; width: 100%; overflow: hidden; z-index: 2; opacity: 0; cursor: pointer; }
	.gallery.is-zoomed .gallery-item.is-active {
		z-index: 4; opacity: 1; }
		.gallery.is-zoomed:before,
		.gallery.is-zoomed:after {
			display: inline-block;
			position: absolute;
			top: 50%;
			width: 1.3em;
			height: 1.3em;
			line-height: 1.45;
			line-height: 1em;
			margin-top: -20px;
			font-size: 40px;
			color: #f0e8dc;
			color: rgba(240,232,220,1);
			z-index: 10;
			pointer-events: none;
			-webkit-transition: all .3s ease;
			        transition: all .3s ease;
			font-family: Arial, "zoro";
			font-style: normal;
			font-weight: 400;
			font-variant: normal;
			text-transform: none !important;
			speak: none;
			text-decoration: none;
			-webkit-font-smoothing: antialiased; }
		.gallery.is-zoomed:before {
			display: none;
			left: 0; 
			opacity: 0;
			content: "\e000";
			text-align: left; }
			.gallery.is-zoomed:hover:before {
				left: 20px;
				opacity: 1 }
		.gallery.is-zoomed:after {
			right: 0px;
			opacity: 0;
			content: "\e001";
			text-align: right; }
			.gallery.is-zoomed:hover:after {
				right: 20px;
				opacity: 1 }


.gallery.is-single .gallery-item {
	left: 0; width: 100%; overflow: hidden; opacity: 1; cursor: default; }


.gallery-download {
	display: block; width: 100%; background: #f0e8dc; text-decoration: none; overflow: hidden; }
	.gallery-download:before {
		position: absolute; left: 0; right: 0; top: 25%; font-size: 2.5em;  text-align: center; }
	.gallery-download-title {
		position: absolute; bottom: 0; left:0; font-size: .8em; width: 100%; padding: .5em 1em; overflow: hidden; text-align: center; }
	.gallery-download>img {
		visibility: hidden; }






/* ========================================================
    News
   ======================================================== */

.news { }

	.news-list {
		list-style: none; 
		margin: 0; 
		padding: 0; }

		.news-item {
			padding: .6em 0 .2em; }

			/*.news-item:nth-child(n+2) {
				 border-top: 1px solid  #ccc; }
*/
			.news-item {
				 border-bottom: 1px solid  #ccc; }

			.news-link {
				text-decoration: none;
				font-weight: normal; }

			.news-date {
				color: #e40139;
				font-size: .9em; }

			.news-title {
				color: #2f2f2f;
				/*font-size: 1.25em;*/
				margin: 0; }

			.news-more {
				color: #4080a3; 
				display: inline-block;
				opacity: 1;
				-webkit-transition: opacity .2s;
				   -moz-transition: opacity .2s;
				    -ms-transition: opacity .2s;
				     -o-transition: opacity .2s;
				        transition: opacity .2s;
				white-space: nowrap; }

				.news-link:hover .news-more {
				 	opacity: 1; }

				 .news-more:hover {
				 	color: #9d1f1e; }


.news--full .news-title {
	margin-bottom: .2em; }
	
	.news--full .news-text--intro {
		margin: 0 0 1em;
		color: inherit; }
					
.news--headlines {
	padding: 0 2em 0 0; }









/* ========================================================
    Buttons
   ======================================================== */

button, .button {
  border-style: solid;
  border-width: 0;
  cursor: pointer;
  font-weight: normal;
  line-height: normal;
  margin: 0 0 1.25rem;
  position: relative;
  text-decoration: none;
  text-align: center;
  -webkit-appearance: none;
  border-radius: 0;
  display: inline-block;
  padding-top: 1rem;
  padding-right: 2rem;
  padding-bottom: 1.0625rem;
  padding-left: 2rem;
  font-size: 1rem;
  background-color: #2ba6cb;
  border-color: #2285a2;
  border-radius: 3px;
  color: #FFFFFF;
  transition: background-color 300ms ease-out; }
  button:hover, button:focus, .button:hover, .button:focus {
    background-color: #2285a2; }
  button:hover, button:focus, .button:hover, .button:focus {
    color: #FFFFFF; }
  .button--secondary {
    background-color: #e9e9e9;
    border-color: #bababa;
    color: #333333; }
    .button--secondary:hover, .button--secondary:focus {
      background-color: #bababa;
      color: #333333; }
  .button--success {
    background-color: #5da423;
    border-color: #4a831c;
    color: #FFFFFF; }
    .button--success:hover, .button--success:focus {
      background-color: #4a831c;
      color: #FFFFFF; }
  .button--alert {
    background-color: #c60f13;
    border-color: #9e0c0f;
    color: #FFFFFF; }
    button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus {
      background-color: #9e0c0f; }
    button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus {
      color: #FFFFFF; }
  .button--warning {
    background-color: #f08a24;
    border-color: #cf6e0e;
    color: #FFFFFF; }
    .button--warning:hover, .button--warning:focus {
      background-color: #cf6e0e; 
      color: #FFFFFF; }
  .button--info {
    background-color: #a0d3e8;
    border-color: #61b6d9;
    color: #333333; }
    .button--info:hover, .button--info:focus {
      background-color: #61b6d9;
      color: #FFFFFF; }
  .button--large {
    padding-top: 1.125rem;
    padding-right: 2.25rem;
    padding-bottom: 1.1875rem;
    padding-left: 2.25rem;
    font-size: 1.25rem; }
  .button--small {
    padding-top: 0.875rem;
    padding-right: 1.75rem;
    padding-bottom: 0.9375rem;
    padding-left: 1.75rem;
    font-size: 0.8125rem; }
  .button--tiny {
    padding-top: 0.625rem;
    padding-right: 1.25rem;
    padding-bottom: 0.6875rem;
    padding-left: 1.25rem;
    font-size: 0.6875rem; }
  .button--expand {
    padding-right: 0;
    padding-left: 0;
    width: 100%; }
  .button--left-align {
    text-align: left;
    text-indent: 0.75rem; }
  .button--right-align {
    text-align: right;
    padding-right: 0.75rem; }
  button.disabled, button[disabled], .button.disabled, .button[disabled],
  button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus {
    cursor: default;
    opacity: 0.7;
    box-shadow: none; }

button::-moz-focus-inner {
  border: 0;
  padding: 0; }

@media only screen and (min-width: 40.063em) {
  button, .button {
    display: inline-block; } }






/* ========================================================
    Dropdown Buttons
   ======================================================== */



.button--dropdown {
  position: relative;
  outline: none;
  padding-right: 3.5625rem; }
  .button--dropdown::after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    display: block;
    border-style: solid;
    border-color: #FFFFFF transparent transparent transparent;
    top: 50%; }
  .button--dropdown::after {
    border-width: 0.375rem;
    right: 1.40625rem;
    margin-top: -0.15625rem; }
  .button--dropdown.button--tiny {
    padding-right: 2.625rem; }
    .button--dropdown.button--tiny:after {
      border-width: 0.375rem;
      right: 1.125rem;
      margin-top: -0.125rem; }
  .button--dropdown.button--small {
    padding-right: 3.0625rem; }
    .button--dropdown.button--small::after {
      border-width: 0.4375rem;
      right: 1.3125rem;
      margin-top: -0.15625rem; }
  .button--dropdown.button--large {
    padding-right: 3.625rem; }
    .button--dropdown.button--large::after {
      border-width: 0.3125rem;
      right: 1.71875rem;
      margin-top: -0.15625rem; }

  .button--dropdown.button--secondary:after {
    border-color: #333333 transparent transparent transparent; }





/* ========================================================
    Split Buttons   @todo
   ======================================================== */


.split.button {
  position: relative;
  padding-right: 5.0625rem; }
  .split.button span {
    display: block;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    border-left: solid 1px; }
    .split.button span:after {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      display: block;
      border-style: inset;
      top: 50%;
      left: 50%; }
    .split.button span:active {
      background-color: rgba(0, 0, 0, 0.1); }
  .split.button span {
    border-left-color: rgba(255, 255, 255, 0.5); }
  .split.button span {
    width: 3.09375rem; }
    .split.button span:after {
      border-top-style: solid;
      border-width: 0.375rem;
      top: 48%;
      margin-left: -0.375rem; }
  .split.button span:after {
    border-color: #FFFFFF transparent transparent transparent; }
  .split.button.secondary span {
    border-left-color: rgba(255, 255, 255, 0.5); }
  .split.button.secondary span:after {
    border-color: #FFFFFF transparent transparent transparent; }
  .split.button.alert span {
    border-left-color: rgba(255, 255, 255, 0.5); }
  .split.button.success span {
    border-left-color: rgba(255, 255, 255, 0.5); }
  .split.button.tiny {
    padding-right: 3.75rem; }
    .split.button.tiny span {
      width: 2.25rem; }
      .split.button.tiny span:after {
        border-top-style: solid;
        border-width: 0.375rem;
        top: 48%;
        margin-left: -0.375rem; }
  .split.button.small {
    padding-right: 4.375rem; }
    .split.button.small span {
      width: 2.625rem; }
      .split.button.small span:after {
        border-top-style: solid;
        border-width: 0.4375rem;
        top: 48%;
        margin-left: -0.375rem; }
  .split.button.large {
    padding-right: 5.5rem; }
    .split.button.large span {
      width: 3.4375rem; }
      .split.button.large span:after {
        border-top-style: solid;
        border-width: 0.3125rem;
        top: 48%;
        margin-left: -0.375rem; }
  .split.button.expand {
    padding-left: 2rem; }
  .split.button.secondary span:after {
    border-color: #333333 transparent transparent transparent; }
  .split.button.radius span {
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px; }
  .split.button.round span {
    -webkit-border-bottom-right-radius: 1000px;
    -webkit-border-top-right-radius: 1000px;
    border-bottom-right-radius: 1000px;
    border-top-right-radius: 1000px; }


/* ========================================================
    Button Groups   @todo
   ======================================================== */

.button-group {
  list-style: none;
  margin: 0;
  padding: 0;
  left: 0; }
  .button-group:before, .button-group:after {
    content: " ";
    display: table; }
  .button-group:after {
    clear: both; }
  .button-group > li {
    margin: 0 -2px;
    padding: 0;
    display: inline-block; }
    .button-group > li > button, .button-group > li .button {
      border-left: 1px solid;
      border-color: rgba(255, 255, 255, 0.5); }
    .button-group > li:first-child button, .button-group > li:first-child .button {
      border-left: 0; }

/* We don't need rounded borders betwee collapsed inputs or buttons */

.button-group li:not(:last-of-type),
.button-group li:not(:last-of-type) button,
.button-group li:not(:last-of-type) .button {
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0; }

.button-group li:not(:first-of-type),
.button-group li:not(:first-of-type) button,
.button-group li:not(:first-of-type) .button {
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0; }


/* ========================================================
    Button bar
   ======================================================== */

.button-bar:before, .button-bar:after {
  content: " ";
  display: table; }
.button-bar:after {
  clear: both; }
.button-bar .button-group {
  float: left;
  margin-right: 0.625rem; }
  .button-bar .button-group div {
    overflow: hidden; }




/* ========================================================
    Forms
   ======================================================== */

/* Standard Forms */
form {
  margin: 0 0 1rem; }

/* Using forms within rows, we need to set some defaults */
form .row .row {
  margin: 0 -0.5rem; }
  form .row .row .column,
  form .row .row .columns {
    padding: 0 0.5rem; }
  form .row .row.collapse {
    margin: 0; }
    form .row .row.collapse .column,
    form .row .row.collapse .columns {
      padding: 0; }
/*    form .row .row.collapse input {
      -webkit-border-bottom-right-radius: 0;
      -webkit-border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border-top-right-radius: 0; }*/
form .row input.column,
form .row input.columns,
form .row textarea.column,
form .row textarea.columns {
  padding-left: 0.5rem; }




/* ========================================================
    Labels
   ======================================================== */

/* Label Styles */
label,
.label {
  font-size: 0.875rem;
  color: inherit;
  cursor: pointer;
  display: block;
  font-weight: normal;
  line-height: 1.5;
  margin-bottom: 0; }
  label.right,
  .label--right {
    float: none !important;
    text-align: right; }
  label.inline,
  .label--inline {
    margin: 0 0 1rem 0;
    padding: 0.5625rem 0; }
  label small {
    text-transform: capitalize;
    color: #676767; }

/* Hide labels when placeholders are supported */
.label--placeholder-fallback  {
	display: none; }
	.lt-ie9 .label--placeholder-fallback {
		display: block; }



/* ========================================================
    Prefix & Postfix
   ======================================================== */

/* Attach elements to the beginning or end of an input */
.prefix,
.postfix {
  display: block;
  position: relative;
  z-index: 2;
  /*text-align: center;*/
  width: 100%;
  padding-top: 0;
  padding-bottom: 0;
  border-style: solid;
  border-width: 1px;
  overflow: hidden;
  font-size: 0.875rem;
  height: 2.3125rem;
  line-height: 2.3125rem; }

/* Adjust padding, alignment and radius if pre/post element is a button */
.prefix.button,
.postfix.button {
  padding: 0;
  text-align: center;
  border: none; }

/*
.prefix.button.radius {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px; }

.postfix.button.radius {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px; }

.prefix.button.round {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 1000px;
  -webkit-border-top-left-radius: 1000px;
  border-bottom-left-radius: 1000px;
  border-top-left-radius: 1000px; }

.postfix.button.round {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 1000px;
  -webkit-border-top-right-radius: 1000px;
  border-bottom-right-radius: 1000px;
  border-top-right-radius: 1000px; }*/

/* Separate prefix and postfix styles when on span or label so buttons keep their own */
span.prefix, label.prefix {
  text-align: center;
  background: #f2f2f2;
  /*border-right: none;*/
  color: #333333;
  border-color: #cccccc; }

span.postfix, label.postfix {
  text-align: center;
  background: #f2f2f2;
  border-left: none;
  color: #333333;
  border-color: #cccccc; }

/* We don't need rounded borders betwee collapsed inputs or buttons */
form .row.collapse .prefix,
form .row.collapse .column:not(:last-of-type),
form .row.collapse .columns:not(:last-of-type),
form .row.collapse .column:not(:last-of-type) input,
form .row.collapse .columns:not(:last-of-type) input,
form .row.collapse .column:not(:last-of-type) button,
form .row.collapse .columns:not(:last-of-type) button {
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0; }

form .row.collapse .postfix,
form .row.collapse .column:not(:first-of-type),
form .row.collapse .columns:not(:first-of-type),
form .row.collapse .column:not(:first-of-type) input,
form .row.collapse .columns:not(:first-of-type) input,
form .row.collapse .column:not(:first-of-type) button,
form .row.collapse .columns:not(:first-of-type) button {
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0; }

form .prefix + .postfix,
form .row.collapse .column:first-of-type + .column:last-of-type,
form .row.collapse .columns:first-of-type + .columns:last-of-type,
form .row.collapse .column:first-of-type + .column:last-of-type input,
form .row.collapse .columns:first-of-type + .columns:last-of-type input,
form .row.collapse .column:first-of-type + .column:last-of-type button,
form .row.collapse .columns:first-of-type + .columns:last-of-type button {
	border-left: none;
}



/* We use this to get basic styling on all basic form elements */
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea {
  -webkit-appearance: none;
  border-radius: 0;
  background-color: white;
  font-family: inherit;
  border-style: solid;
  border-width: 1px;
  border-color: #cccccc;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  /*color: rgba(0, 0, 0, 0.75);*/
  display: block;
  font-size: 0.875rem;
  margin: 0 0 1rem 0;
  padding: 0.5rem;
  height: 2.3125rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  transition: box-shadow 0.45s, border-color 0.45s ease-in-out; }
  input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus {
    box-shadow: 0 0 5px #999999;
    border-color: #999999; }
  input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus {
    background: #fafafa;
    border-color: #999999;
    outline: none; }
  input[type="text"]:disabled, input[type="password"]:disabled, input[type="date"]:disabled, input[type="datetime"]:disabled, input[type="datetime-local"]:disabled, input[type="month"]:disabled, input[type="week"]:disabled, input[type="email"]:disabled, input[type="number"]:disabled, input[type="search"]:disabled, input[type="tel"]:disabled, input[type="time"]:disabled, input[type="url"]:disabled, input[type="color"]:disabled, textarea:disabled {
    background-color: #DDDDDD;
    cursor: default; }
  input[type="text"][disabled], input[type="text"][readonly], fieldset[disabled] input[type="text"], input[type="password"][disabled], input[type="password"][readonly], fieldset[disabled] input[type="password"], input[type="date"][disabled], input[type="date"][readonly], fieldset[disabled] input[type="date"], input[type="datetime"][disabled], input[type="datetime"][readonly], fieldset[disabled] input[type="datetime"], input[type="datetime-local"][disabled], input[type="datetime-local"][readonly], fieldset[disabled] input[type="datetime-local"], input[type="month"][disabled], input[type="month"][readonly], fieldset[disabled] input[type="month"], input[type="week"][disabled], input[type="week"][readonly], fieldset[disabled] input[type="week"], input[type="email"][disabled], input[type="email"][readonly], fieldset[disabled] input[type="email"], input[type="number"][disabled], input[type="number"][readonly], fieldset[disabled] input[type="number"], input[type="search"][disabled], input[type="search"][readonly], fieldset[disabled] input[type="search"], input[type="tel"][disabled], input[type="tel"][readonly], fieldset[disabled] input[type="tel"], input[type="time"][disabled], input[type="time"][readonly], fieldset[disabled] input[type="time"], input[type="url"][disabled], input[type="url"][readonly], fieldset[disabled] input[type="url"], input[type="color"][disabled], input[type="color"][readonly], fieldset[disabled] input[type="color"], textarea[disabled], textarea[readonly], fieldset[disabled] textarea {
    background-color: #DDDDDD;
    cursor: default; }



/*  input[type="text"].radius, input[type="password"].radius, input[type="date"].radius, input[type="datetime"].radius, input[type="datetime-local"].radius, input[type="month"].radius, input[type="week"].radius, input[type="email"].radius, input[type="number"].radius, input[type="search"].radius, input[type="tel"].radius, input[type="time"].radius, input[type="url"].radius, input[type="color"].radius, textarea.radius {
    border-radius: 3px; }

form .row .prefix-radius.row.collapse input,
form .row .prefix-radius.row.collapse textarea,
form .row .prefix-radius.row.collapse select {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px; }
form .row .prefix-radius.row.collapse .prefix {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px; }
form .row .postfix-radius.row.collapse input,
form .row .postfix-radius.row.collapse textarea,
form .row .postfix-radius.row.collapse select {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px; }
form .row .postfix-radius.row.collapse .postfix {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px; }
form .row .prefix-round.row.collapse input,
form .row .prefix-round.row.collapse textarea,
form .row .prefix-round.row.collapse select {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 1000px;
  -webkit-border-top-right-radius: 1000px;
  border-bottom-right-radius: 1000px;
  border-top-right-radius: 1000px; }
form .row .prefix-round.row.collapse .prefix {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 1000px;
  -webkit-border-top-left-radius: 1000px;
  border-bottom-left-radius: 1000px;
  border-top-left-radius: 1000px; }
form .row .postfix-round.row.collapse input,
form .row .postfix-round.row.collapse textarea,
form .row .postfix-round.row.collapse select {
  border-radius: 0;
  -webkit-border-bottom-left-radius: 1000px;
  -webkit-border-top-left-radius: 1000px;
  border-bottom-left-radius: 1000px;
  border-top-left-radius: 1000px; }
form .row .postfix-round.row.collapse .postfix {
  border-radius: 0;
  -webkit-border-bottom-right-radius: 1000px;
  -webkit-border-top-right-radius: 1000px;
  border-bottom-right-radius: 1000px;
  border-top-right-radius: 1000px; }*/




/* ========================================================
    Inputs
   ======================================================== */


input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 0; }

/* Respect enforced amount of rows for textarea */
textarea[rows] {
  height: auto; }

/* Not allow resize out of parent */
textarea {
  max-width: 100%; }

/* Add height value for select elements to match text input height */
select {
  -webkit-appearance: none !important;
  border-radius: 0;
  background-color: #FAFAFA;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);
  background-position: 100% center;
  background-repeat: no-repeat;
  border-style: solid;
  border-width: 1px;
  border-color: #cccccc;
  padding: 0.5rem;
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.75);
  line-height: normal;
  border-radius: 0;
  height: 2.3125rem; }
  select::-ms-expand {
    display: none; }
  select.radius {
    border-radius: 3px; }
  select:hover {
    background-color: #f3f3f3;
    border-color: #999999; }
  select:disabled {
    background-color: #DDDDDD;
    cursor: default; }

/* Adjust margin for form elements below */
input[type="file"],
input[type="checkbox"],
input[type="radio"],
select {
  margin: 0 0 1rem 0; }

input[type="checkbox"] + label,
input[type="radio"] + label {
  display: inline-block;
  margin-left: 0.5rem;
  margin-right: 1rem;
  margin-bottom: 0;
  vertical-align: baseline; }

/* Normalize file input width */
input[type="file"] {
  width: 100%; }

/* HTML5 Number spinners settings */
/* We add basic fieldset styling */
fieldset {
  border: 1px solid #DDDDDD;
  padding: 1.25rem;
  margin: 1.125rem 0; }
  fieldset legend {
    font-weight: bold;
    background: #FFFFFF;
    padding: 0 0.1875rem;
    margin: 0;
    margin-left: -0.1875rem; }




/* ========================================================
    Error
   ======================================================== */

	/* my error message */
	.form-error {
		background-color: #e40139; 
		color: white; padding: 0.3em; 
		line-height: 1.1; 
		margin: 0 0 .3em; 
		text-align: center; }
		.form-error.-success,
		.form-error--success {
			background-color: #3fa9f5; }

	/* my error hint */
	.has-error {
		border: 1px solid #bd010f; 
		box-shadow: 0 0 4px #bd010f; }

		.has-error:valid {
			border-color: initial; 
			box-shadow: none;  }
	

/* Error Handling */
[data-abide] .error small.error, [data-abide] .error span.error, [data-abide] span.error, [data-abide] small.error {
  display: block;
  padding: 0.375rem 0.5625rem 0.5625rem;
  margin-top: -1px;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: normal;
  font-style: italic;
  background: #c60f13;
  color: #FFFFFF; }
[data-abide] span.error, [data-abide] small.error {
  display: none; }

span.error, small.error {
  display: block;
  padding: 0.375rem 0.5625rem 0.5625rem;
  margin-top: -1px;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: normal;
  font-style: italic;
  background: #c60f13;
  color: #FFFFFF; }

.error input,
.error textarea,
.error select {
  margin-bottom: 0; }
.error input[type="checkbox"],
.error input[type="radio"] {
  margin-bottom: 1rem; }
.error label,
.error label.error {
  color: #c60f13; }
.error small.error {
  display: block;
  padding: 0.375rem 0.5625rem 0.5625rem;
  margin-top: -1px;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: normal;
  font-style: italic;
  background: #c60f13;
  color: #FFFFFF; }
.error > label > small {
  color: #676767;
  background: transparent;
  padding: 0;
  text-transform: capitalize;
  font-style: normal;
  font-size: 60%;
  margin: 0;
  display: inline; }
.error span.error-message {
  display: block; }

input.error,
textarea.error,
select.error {
  margin-bottom: 0; }

label.error {
  color: #c60f13; }




/* ========================================================
    Switch (Checkboxes)
   ======================================================== */


.switch {
  margin: 0;
  padding: 0;
  border: none;
  position: relative;
  outline: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none; }
  .switch label {
    display: block;
    margin-bottom: 1rem;
    position: relative;
    color: transparent;
    background: #DDDDDD;
    text-indent: 100%;
    width: 4rem;
    height: 2rem;
    cursor: pointer;
    transition: left 0.15s ease-out; }
  .switch input {
    opacity: 0;
    position: absolute;
    top: 9px;
    left: 10px;
    padding: 0; }
    .switch input + label {
      margin-left: 0;
      margin-right: 0; }
  .switch label:after {
    content: "";
    display: block;
    background: #FFFFFF;
    position: absolute;
    top: .25rem;
    left: .25rem;
    width: 1.5rem;
    height: 1.5rem;
    -webkit-transition: left 0.15s ease-out;
    -moz-transition: left 0.15s ease-out;
    -o-transition: translate3d(0, 0, 0);
    transition: left 0.15s ease-out;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  .switch input:checked + label {
    background: #2ba6cb; }
  .switch input:checked + label:after {
    left: 2.25rem; }
  .switch label {
    width: 4rem;
    height: 2rem; }
  .switch label:after {
    width: 1.5rem;
    height: 1.5rem; }
  .switch input:checked + label:after {
    left: 2.25rem; }
  .switch label {
    color: transparent;
    background: #DDDDDD; }
  .switch label:after {
    background: #FFFFFF; }
  .switch input:checked + label {
    background: #2ba6cb; }
  .switch.large label {
    width: 5rem;
    height: 2.5rem; }
  .switch.large label:after {
    width: 2rem;
    height: 2rem; }
  .switch.large input:checked + label:after {
    left: 2.75rem; }
  .switch.small label {
    width: 3.5rem;
    height: 1.75rem; }
  .switch.small label:after {
    width: 1.25rem;
    height: 1.25rem; }
  .switch.small input:checked + label:after {
    left: 2rem; }
  .switch.tiny label {
    width: 3rem;
    height: 1.5rem; }
  .switch.tiny label:after {
    width: 1rem;
    height: 1rem; }
  .switch.tiny input:checked + label:after {
    left: 1.75rem; }
  .switch.radius label {
    border-radius: 4px; }
  .switch.radius label:after {
    border-radius: 3px; }
  .switch.round {
    border-radius: 1000px; }
    .switch.round label {
      border-radius: 2rem; }
    .switch.round label:after {
      border-radius: 2rem; }







/* ========================================================
    Panels
   ======================================================== */

.panel {
  border-style: solid;
  border-width: 1px;
  border-color: #d8d8d8;
  margin-bottom: 1.25rem;
  padding: 1.25rem;
  background: #f2f2f2;
  color: #333333; }
  .panel > :first-child {
    margin-top: 0; }
  .panel > :last-child {
    margin-bottom: 0; }
  .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, 
  .panel p, .panel li, .panel dl {
    color: #333333; }
  .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
    line-height: 1;
    margin-bottom: 0.625rem; }
    .panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader {
      line-height: 1.4; }
  
  .panel--callout {
    border-style: solid;
    border-width: 1px;
    border-color: #c5e8f3;
    margin-bottom: 1.25rem;
    padding: 1.25rem;
    background: #f2fafc;
    color: #333333; }
    .panel--callout > :first-child {
      margin-top: 0; }
    .panel--callout > :last-child {
      margin-bottom: 0; }
    .panel--callout h1, .panel--callout h2, .panel--callout h3, .panel--callout h4, .panel--callout h5, .panel--callout h6, .panel--callout p, .panel--callout li, .panel--callout dl {
      color: #333333; }
    .panel--callout h1, .panel--callout h2, .panel--callout h3, .panel--callout h4, .panel--callout h5, .panel--callout h6 {
      line-height: 1;
      margin-bottom: 0.625rem; }
      .panel--callout h1.subheader, .panel--callout h2.subheader, .panel--callout h3.subheader, .panel--callout h4.subheader, .panel--callout h5.subheader, .panel--callout h6.subheader {
        line-height: 1.4; }
    .panel--callout a:not(.button) {
      color: #2ba6cb; }
      .panel--callout a:not(.button):hover, .panel--callout a:not(.button):focus {
        color: #258faf; }
  



/* ========================================================
    Footer
   ======================================================== */

.footer { }
	
	.footer-rim {
		padding: .4em 0; }
	.footer-bottomend {
		padding: 2em 0; }
	.footer a { }



/* ========================================================
    Social
   ======================================================== */


.social { 
	margin: 0;  }
	.no-svg .social {
		margin-top: 0; }
	.social__heading {
		float: left; display: inline-block; margin: 0 .7em 0 0; line-height: 1; white-space: nowrap; }
	.social__list {
		list-style: none; margin: 0; padding: 0; *zoom: 1; }
		.social__list:before, .social__list:after {
			content: " "; display: block; }
		.social__list:after {
			clear: both; }
	.social__item {
		float: left; width: auto; margin: 0 .4em; padding: 0; line-height: 1; }
		.social__link,
		.social__link:hover {
			display: block; text-decoration: none; cursor: pointer; }

@media only screen and (max-width: 36em) {
	.social {
		font-size: 1em; }
}






/* ========================================================
   Backgrounds
   ======================================================== */


.bg-accent {
	background: #00527f; }

.bg-light {
	background: #eee; }

.bg-medium {
	background: #bbb; }

.bg-dark {
	background: #333; }








/* ========================================================
   Utility, Helper & Accessibility
   ======================================================== */




.left {
  float: left !important; }

.right {
  float: right !important; }

.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

/*
 * Image replacement
 */

.ir {
	background-color: transparent;
	border: 0;
	overflow: hidden;
	/* IE 6/7 fallback */
	*text-indent: -9999px;
}

.ir:before {
	content: "";
	display: block;
	width: 0;
	height: 110%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hide, .hidden {
	display: none !important;
	visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.cf:before, .clearfix:before,
.cf:after, .clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.cf:after, .clearfix:after {
	clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout.
 */

.cf, .clearfix {
	*zoom: 1;
}

.equalize-height {
	display: table;
	table-layout: fixed;
	display: block;
}
.equalize-height > [class*="columns"] {
	display: table-cell;
	float: none;
	margin: 0;
	vertical-align: top;
}
.equalize-height > [class*="columns"] > [class*="block"] {
	padding-bottom: 10000px;
	margin-bottom: -10000px; 
}

/* ========================================================
   Develop Info
   ======================================================== */

.cs-developinfo {
	box-shadow: 0 10px 20px rgba(18,44,91,.3);
	border: 1px solid #415d86; 
	border-bottom: none; 
	color: #122c5b;
	background: #cde3f3!important; }


/* ========================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ======================================================== */

@media print {
	* {
		background: transparent !important;
		color: #000 !important; /* Black prints faster: h5bp.com/s */
		block-shadow:none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links for images, or javascript/internal links
	 */

	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead {
		display: table-header-group; /* h5bp.com/t */
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	@page {
		margin: 0.5cm;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}