/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0;
    background: #ffee8a;
    color: #000;
	 font-size: 90%;
	padding: 0.5em 2%;
	line-height: 1.2;
	-webkit-box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


*,
*:before,
*:after	{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

html {height: 100%;}

html, body
{
	margin: 0;
	padding: 0;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;

	background: white; color: #666; border-color: #666;
	font-family: 'Accord Alternate W00';
	font-weight: 300;
	font-style: normal;
}

/* --------------------------------------------------------------------------------------- */
/* Icon Font */
/* --------------------------------------------------------------------------------------- */
@font-face {
      font-family: 'fontello';
      src: url('./font/fontello.eot?45584418');
      src: url('./font/fontello.eot?45584418#iefix') format('embedded-opentype'),
           url('./font/fontello.woff?45584418') format('woff'),
           url('./font/fontello.ttf?45584418') format('truetype'),
           url('./font/fontello.svg?45584418#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }



   .demo-icon
    {
      font-family: "fontello";
      font-style: normal;
      font-weight: normal;
      speak: none;

      display: inline-block;
      text-decoration: inherit;
      width: 1em;
      margin-right: .2em;
      text-align: center;
      /* opacity: .8; */

      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;

      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;

      /* Animation center compensation - margins should be symmetric */
      /* remove if not needed */
      margin-left: .2em;

      /* You can be more comfortable with increased icons size */
      /* font-size: 120%; */

      /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;

      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-download-alt:before { content: '\e800'; } /* '' */
.icon-export:before { content: '\e801'; } /* '' */
.icon-location:before { content: '\e802'; } /* '' */
.icon-map:before { content: '\e803'; } /* '' */
.icon-map-1:before { content: '\e804'; } /* '' */

a.location {text-decoration: none; font-size: 80%;}
/* --------------------------------------------------------------------------------------- */



.wrapper {width: 90%; margin: 0 auto; max-width: 1500px;}
.inner	{width: 50%; margin: 0 auto; max-width: 760px;}

@media screen and (max-width: 768px)
{
	.inner	{width: 90%;}	
	body {font-size: 1rem;}
}

h1 {margin: 0rem 0 1rem 0 !important; font-weight: normal; font-size: 350%; }
h2 {margin: 3rem 0 1rem 0 !important; font-weight: normal; font-size: 180%; border-bottom: 1px solid #aaa;}
h3 {font-size: 1.2rem; margin-bottom: 0.5rem; font-weight: normal;}
h4 {font-weight: 500; border-bottom: 1px solid #aaa; margin-bottom: 0;}
p {margin-top: 0; margin-bottom: 1rem;}
ul {padding-left: 1.3rem;}
p+ul {margin-top: -0.5rem;}
strong {font-weight: 500;}

a,
a:link {color: #e4636b;}
a:visited,
a:hover,
a:active,
a:focus {color: #b7515b;}



header {margin-bottom: 3rem;}

.home .home,
.lektionen .lektionen,
.coaching .coaching,
.akademie .akademie,
.workshops .workshops,
.yogaferien .yogaferien,
.ueberuns .ueberuns,
.studio .studio,
.kontakt .kontakt
{
	color: #e4636b; cursor: default; font-weight: 500;
}

.home .home:hover,
.lektionen .lektionen,
.coaching .coaching,
.akademie .akademie,
.ueberuns .ueberuns:hover,
.kontakt .kontakt:hover {border-bottom-color: transparent; cursor: default;}

/*	---------------------------------------------------------------------- */
/* Table Structure */
/*	---------------------------------------------------------------------- */
.topbar 			{display: table;}
.logo				{display: table-cell; width: 20%; vertical-align: middle;}
header nav 		{display: table-cell; width: 80%; vertical-align: middle;}
/*	---------------------------------------------------------------------- */

.logo a img {width: auto; height: 40px;} 

nav 		{line-height: 1; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none;}
nav ul	{list-style: none; margin: 0; padding: 0;}
nav li	{float: left; padding: 0 0.5rem;}
nav a		{text-decoration: none; color: #222;}



/* Slider */
/* Original font size: 350% */
.royalSlider h1 {font-size: 250%}




@media screen and (min-width: 768px)
{
	header nav a	{display: block; text-transform: uppercase; padding: 1rem 0; border-color: transparent; border-style: solid; border-width: 10px 0;}


header nav a,
header a:link,
header a:visited,
header a:active,
header a:focus 					{color: #666;}


header a:focus {border-color: transparent; border-style: solid; border-width: 10px 0;}



header nav ul	{ float: right; text-align: right; position: relative;}
header nav ul li 		{ position:relative; float:left; }

header nav ul ul
{
	display:none;
	position:absolute;
	top:100%;
	left: 8px;
	padding:0;
	background: rgba(255,255,255,0.85);
}


header nav ul ul li
{
	float:none;
	width:auto;
	margin-top: -1px;
	text-align: left;
	padding: 0;
}

header nav ul ul li
{
	border-top: 1px solid #eadead;
}

header nav ul ul li:first-child
{
	border-top: 1px solid transparent;
}


header nav ul ul ul
{
	top:0;
	left:100%
}

header nav ul li:hover > ul
{
	display:block
}

header nav ul ul a {padding: 0.5rem 0.5rem; border-color: transparent; white-space: nowrap;}
header nav ul ul a:hover {}


header nav a:hover {border-bottom-color: #e4636b; color: #e4636b; -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -ms-transition: background 0.2s linear; -o-transition: background 0.2s linear; transition: background .2s linear;}

}

/* Hamburger icon */
.hamburger, #mobile-trigger {display: none;}

@media screen and (max-width: 1000px)
{
	#mobile-trigger {display: block; float: right;}
	header ul {display: none;}
}

.nav-icon
{
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
	width: 2em;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}

.nav-icon:after,
.nav-icon:before,
.nav-icon span
{
display: block;
  transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
  content: '';
margin: 7px 0;
  height: 5px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
  border-radius: 3px;
  background-color: #e4636b;
}
/*
.nav-icon:hover:after {
  -moz-transform: translateY(-12px) rotate(-135deg);
  -webkit-transform: translateY(-12px) rotate(-135deg);
  transform: translateY(-12px) rotate(-135deg);
}
.nav-icon:hover span {
-moz-transform: scale(0);
-webkit-transform: scale(0);
transform: scale(0);
}
*/
.nav-icon-closer
{
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
	width: 2em;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}
.nav-icon-closer:after,
.nav-icon-closer:before,
.nav-icon-closer span
{
display: block;
  transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
  content: '';
margin: 7px 0;
  height: 5px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
}
.nav-icon-closer:before
{
	-webkit-transform: translateY(12px) rotate(135deg);
	-moz-transform: translateY(12px) rotate(135deg);
	transform: translateY(12px) rotate(135deg);
}
.nav-icon-closer:after {
  -moz-transform: translateY(-12px) rotate(-135deg);
  -webkit-transform: translateY(-12px) rotate(-135deg);
  transform: translateY(-12px) rotate(-135deg);
}
.nav-icon-closer span {
-moz-transform: scale(0);
-webkit-transform: scale(0);
transform: scale(0);
}
/* --------------------------------------------------------- */
button {
  display: block;
  margin: 10px 0;
  background: transparent;
  border: none;
  padding: 0;
}
button.md-close {
  margin-top: 40px;
}
.md-modal
{
	margin: auto;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 50%;
/*
	max-width: 630px;
	min-width: 320px;
*/
	height: 100%;
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
}
.md-show {
  visibility: visible;
}
.md-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  visibility: hidden;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  background: rgba(195, 169, 128, 0.8);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show ~ .md-overlay {
  opacity: 1;
  visibility: visible;
}
.md-effect-12
.md-content
{
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.md-show.md-effect-12 ~ .md-overlay {
  background-color: rgba(195, 169, 128, 1);
}
.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
  background: transparent;
}
.md-show.md-effect-12 .md-content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
/* --------------------------------------------------------- */
.bar {height: 400px; color: white; background-color: #CEC5C0; background-position: center center; background-repeat: no-repeat; background-size: 1500 auto;	display: flex; align-items: center;	justify-content: center;}
.bar .v-h-center {text-align: center;}
.header-logo {width: auto; max-height: 4rem;}

.home 			.bar {height: 650px;}
.lektionen		.bar {background-image: url(../img/stripes/be-a-yogi-lektionen.jpg)}
.coaching		.bar {background-image: url(../img/stripes/be-a-yogi-coaching.jpg)}
.akademie		.bar {background-image: url(../img/stripes/be-a-yogi-akademie.jpg)}
.workshops		.bar {background-image: url(../img/stripes/be-a-yogi-workshops.jpg)}
.yogaferien		.bar {background-image: url(../img/stripes/be-a-yogi-yoga-ferien.jpg)}
.ueberuns		.bar {background-image: url(../img/stripes/be-a-yogi-ueberuns.jpg)}
.studio			.bar {background-image: url(../img/stripes/be-a-yogi-10.jpg)}
.kontakt			.bar {background-image: url(../img/stripes/be-a-yogi-kontakt.jpg);}
.agb 				.bar {background-image: url(../img/stripes/be-a-yogi-agb.jpg);}
.links 			.bar {background-image: url(../img/stripes/be-a-yogi-links.jpg);}
.impressum 		.bar {background-image: url(../img/stripes/be-a-yogi-impressum.jpg);}
.newsletter		.bar {background-image: url(../img/stripes/be-a-yogi-newsletter.jpg);}
.datenschutz	.bar {background-image: url(../img/stripes/be-a-yogi-datenschutz.jpg); background-position: left center;}
.spezial			.bar {background-image: url(../img/stripes/be-a-yogi-spezial.jpg);}
.spezial1		.bar {background-image: url(../img/stripes/be-a-yogi-spezial-1.jpg);}
.spezial2		.bar {background-image: url(../img/stripes/be-a-yogi-spezial-2.jpg);}
.spezial3		.bar {background-image: url(../img/stripes/be-a-yogi-spezial-3.jpg);}
.spezial4		.bar {background-image: url(../img/stripes/be-a-yogi-spezial-4.jpg);}
.spezial-online	.bar {background-image: url(../img/stripes/be-a-yogi-spezial-online.jpg);}


.bar .text {text-align: left; padding-top: 10rem;}
.bar .text h1 {line-height: 1;}
.bar .text p {font-size: 150%;}
.bar .text img {width: 100px; height: 170px; display:block; margin-bottom: 1rem;}
@media screen and (max-width: 480px)
{
	header {margin-bottom: 1rem;}
	.bar
	{
		height: auto !important;
		padding: 1rem 0 0 0;
		/*
		height: 300px !important;
		background-color: red;
		*/
		background-image: none!important;
	}
	.bar .text {font-size: 80%; padding: 1rem 0; /* color: #222; */}
}



/*	---------------------------------------------------------------------- */
/* Cards / Icons from Homepage */
/*	---------------------------------------------------------------------- */
.card-container {
	margin-top: 4rem;
	width: 80%;
	max-width: 1200px;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;

	align-items: flex-start;
}

.card {min-width: 100px; transition: all .2s ease-in-out; }

svg {width: 100%; max-width: 60%;}

svg #lektionen,
svg #coaching,
svg #akademie,
svg #spezial  {fill: #e4636b;}

svg:hover #lektionen,
svg:hover #coaching,
svg:hover #akademie,
svg:hover #spezial  {fill: #b05562;}

.card {width: 25%; text-align: center; margin: 1%; padding: 0 2%;}
.card a {  text-decoration: none; font-weight: 600; display: block;}
.card .title {margin-top: 0.5rem; font-size: 120%;}

@media screen and (max-width: 768px)
{
	.card-container { -webkit-flex-wrap: wrap;  flex-wrap: wrap;}
	.card {width: 48%; margin-bottom: 2rem;}
	.card:nth-child(3),
	.card:nth-child(4) {margin-bottom: 0;}
}

@media screen and (max-width: 480px)
{
	.card {width: 100%; margin-bottom: 2rem !important;}
	.card:last-child {margin-bottom: 0!important}
}


/*	---------------------------------------------------------------------- */
/* Sections with full width images and vertically centered text */
/*	---------------------------------------------------------------------- */
.vertical-center
{
	height: 400px;
	background-color: #FBF8F3;
	background-position: center;
	background-repeat: no-repeat;
	margin: 5rem 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.vertical-center p {max-width: 50%; color: white; font-size: 250%;}
.s01 {background-image: url(../img/stripes/be-a-yogi-01.jpg);}
.s02 {background-image: url(../img/stripes/be-a-yogi-02.jpg);}
.s03 {background-image: url(../img/stripes/be-a-yogi-03.jpg);}
.s04 {background-image: url(../img/stripes/be-a-yogi-04.jpg);}
.s05 {background-image: url(../img/stripes/be-a-yogi-05.jpg);}
.s06 {background-image: url(../img/stripes/be-a-yogi-06.jpg);}
.s07 {background-image: url(../img/stripes/be-a-yogi-07.jpg);}
.s08 {background-image: url(../img/stripes/be-a-yogi-08.jpg);}
.s09 {background-image: url(../img/stripes/be-a-yogi-09.jpg);}
.s10 {background-image: url(../img/stripes/be-a-yogi-10.jpg);}
.s11 {background-image: url(../img/stripes/be-a-yogi-11.jpg);}
.s12 {background-image: url(../img/stripes/be-a-yogi-12.jpg);}
.s13 {background-image: url(../img/stripes/be-a-yogi-13.jpg);}

/*	---------------------------------------------------------------------- */
/* Lektionen */
/*	---------------------------------------------------------------------- */
.lektionen-facts {border-collapse: collapse; width: 100%; margin-bottom: 6rem;}
.lektionen-facts th {text-align: left; font-weight: 300; padding-right: 2rem;}
.lektionen-facts th,
.lektionen-facts td {vertical-align: top;}
.lektionen-facts .border {border-bottom: 1px solid #999;}


/*	---------------------------------------------------------------------- */
/* Footer */
/*	---------------------------------------------------------------------- */
footer 								{background: #C3B598; padding: 0.75rem 0; font-size: 1rem; margin-top: 2rem;}
footer .wrapper					{text-align: left;}
footer nav 							
{
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;

	align-items: center;
}
footer nav ul 						{}
footer nav li 						{border-right: 1px solid white; padding: 0 0.35rem;}
footer nav li:first-child 		{padding-left: none;}
footer nav li:last-child 		{border: none;}

footer a,
footer a:link,
footer a:visited,
footer a:hover,
footer a:active,
footer a:focus 					{color: white;}

.agb .agb,
.links .links,
.impressum .impressum,
.newsletter .newsletter,
.datenschutz .datenschutz {cursor: default; color: #e4636b; font-weight: bold;}

.agb .agb:hover,
.links .links:hover,
.impressum .impressum:hover,
.newsletter .newsletter:hover,
.datenschutz .datenschutz:hover {text-decoration: none;}

.footer-separator {margin: 0 0.1em;}
footer nav a:hover {text-decoration: underline;}

.meta {flex-grow: 1;}
.social {
	  flex-grow: auto;
	 flex-shrink: 1;
}

.social {text-align: right; padding: 0; margin: 0;}
.social li {border: none; padding: 0; height: 3rem; padding: 0 !important;}
.social svg {height: 3rem; width: 3rem; }



@media screen and (max-width: 480px)
{
	footer .meta					{width: auto;}
	footer .meta li 				{border-right: none; padding: 0.5rem 0.35rem; display: block; width: auto; float: none;}
}


/*
.social .a:hover {fill:blue;}
*/

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


/* -------------------------------------------------------------------------*/
/* Footer push */
/* -------------------------------------------------------------------------*/
header,
footer	{-webkit-box-flex: 0; -webkit-flex: none; -ms-flex: none; flex: none;}
body 
{
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-webkit-flex-direction:column;
	-ms-flex-direction:column;
	flex-direction:column;
	height:100%;
}
main
{
	-webkit-box-flex:1;
	-webkit-flex:1 0 auto;
	-ms-flex:1 0 auto;
	flex:1 0 auto;
	width:100%;
	padding-top: 2rem;
}
main::after
{
	content:'\00a0';display:block;margin-top:1.5em;height:0;visibility:hidden
}


/* Kontaktformular Google Map */
#gmap_canvas {height: 400px; margin-bottom: 3rem;}



/* Mail protection */
.codedirection { unicode-bidi:bidi-override; direction: rtl; }

.inner img {max-width: 100%;}
.stretch {width: 100%; height: auto; margin: 3rem 0 2rem 0;}

.mood {margin: 7rem 0 1rem 0 !important;}

@media screen and (max-width: 480px)
{
	.stretch {display: none;}
}

form {margin: 4rem 0;}
form ul {margin: 0; padding: 0; list-style: none;}
form li {margin-bottom: 0.5rem;}
input[type=text],
input[type=email],
input[type=number],
textarea {width: 100%; border: 1px solid transparent; background: rgba(188,188,188,0.20); padding: 0.5rem 0.4rem; line-height: 1; border-radius: 0.3rem;}


input:focus,
textarea:focus {border: 1px solid rgba(255,126,0,1.00)}

input[type=submit]	{margin-top: 1em; padding: 0.4rem 1rem; width: 100%; border: none; border: 2px solid #268e05; color: #268e05; background: rgba(38,142,5,0.1);  border-radius: 0.3rem;}
input[type=submit]:hover {background: #268e05; color: white; cursor: pointer;}

select {padding: 0.25rem; width: 100%; line-height: 1; height: 2rem;}
fieldset.radio,
fieldset.checkbox {margin-top: 0.5rem; margin-bottom: 1rem;}
fieldset.radio,
fieldset.checkbox  p {margin-bottom: 0.5rem;}
fieldset.radio span {display: inline-block; width: 7rem;}
fieldset.radio label {margin-left: 1rem;}
fieldset.radio input,
fieldset.checkbox input {margin-right: 0.25rem; border: 1px solid red;}
:focus
{
	outline-color: transparent;
	outline-style: none;
}


@media screen and (-webkit-min-device-pixel-ratio: 0)
{
	select {
   border: 1px solid #555;
   padding: 0.5em;
   font-size: 15px;
   line-height: 1.2em;
   background: #fff;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
   -webkit-appearance: none;
   -webkit-box-shadow: 1px 1px 1px #fff;
   -webkit-border-radius: 0.5em;
 }
}

fieldset.select 	{margin-bottom: 2rem;}
fieldset.text li	{margin-bottom: 1rem;}
fieldset.button 	{text-align: right;}





/*
input:required,
textarea:required {}
*/
.kontakt .required {}

.message	{border: 1px solid #666; padding: 0.75rem 1em 1em 80px; margin: 1em auto; min-height: 80px; font-weight: 500; border-radius: 0.3rem;}
.ok		{border-color: #268e05; color: #268e05; background: rgba(38,142,5,0.1) url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzYgMzYiPjxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBmaWxsPSIjMjY4ZTA1IiBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIGQ9Im0xMSAyMGw1LjMgNS4zIDkuOS0xNSIvPjwvZz48L3N2Zz4=') 10px 10px no-repeat; background-size: 60px 60px;}
.error	{border-color: #cc0000; color: #cc0000; background: #ffdcdc url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzYgMzYiPjxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBmaWxsPSIjYzAwIiBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiLz48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiPjxwYXRoIGQ9Ik0gMjUuOCwxMC4yIDkuNSwyNi41Ii8+PHBhdGggZD0ibTEwLjEgMTAuMWwxNi40IDE2LjQiLz48L2c+PC9nPjwvc3ZnPg==') 10px 10px  no-repeat; background-size: 60px 60px;}
.warning	{border-color: #ff9900; color: #ff9900; background: #ffedd2 url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzYgMzYiPjxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBmaWxsPSIjZjkwIiBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIGQ9Im0xOCA0LjV2MTkiLz48Y2lyY2xlIGZpbGw9IiNmZmYiIGN4PSIxOCIgY3k9IjI5IiByPSIyIi8+PC9nPjwvc3ZnPg==') 10px 10px no-repeat; background-size: 60px 60px;}
.comment	{border-color: #00d1ff; color: #00d1ff; background: #d4f7ff url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzYgMzYiPjxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+PHBhdGggZmlsbD0iIzAwZDFmZiIgZD0iTTAsMThDMCw4LjEsOC4xLDAsMTgsMHMxOCw4LjEsMTgsMThzLTguMSwxOC0xOCwxOFMwLDI3LjksMCwxOHoiLz48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIGQ9Im04LjggMTcuN2gxOCIvPjwvZz48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiPjxwYXRoIGQ9Im0xOC44IDkuN2w4IDgiLz48cGF0aCBkPSJtMjYuOCAxNy43bC04IDgiLz48L2c+PC9zdmc+') 10px center no-repeat; background-size: 60px 60px;}

a[href$='.pdf'] {background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOTUuNCAyODcuMyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjk1LjQgMjg3LjMiPjxwYXRoIGZpbGw9IiNmMDQ5MjMiIGQ9Im0xNTYuNSA2NS4yYy0yLjkgMTIuMy01LjkgMjQuNi04LjggMzYuOS0uNSAyLjItMSA0LjQtMiA2LjQtMiA0LTEuMiA3LjQgMS4zIDExIDUgNy4yIDkuNiAxNC41IDE0LjQgMjEuOCA5LjIgMTQgMjMuNyAyOS4zIDI4LjggMzMuOC43LjYgMS45IDEuMSAyLjggMSAyNi41LTQuMiA0Ni40LTQuMiA0Ni40LTQuMiAxMi4zLjcgMjguNS44IDQyLjUgNy45IDMwLjcgMTUuNiA4LjMgNjAuMS01OC41IDI2LjQtMTEuOC02LjQtMjIuOC0xMy45LTMyLjktMjIuOS0uNy0uNi0yLjItLjYtMy4yLS40LTI3IDQuOS01My41IDExLjktNzkuNSAyMC44LTEuNi41LTIuNSAxLjUtMy40IDIuOS03LjEgMTEuNC0xNCAyMy0yMS42IDM0LjEtMzkuNSA1Ny44LTc0LjYgNTQtODIuNyAzMSAuMi01LjMtMS4zLTEwLjggOS44LTIyLjUgMTUtMTUuOSA0My45LTMxIDY2LjMtMzkuNyA0LjctMS44IDguNy00LjIgMTAuMy05LjMuMi0uNy41LTEuNC45LTIgMTAuNi0yMC43IDE5LjUtMzUuOSA0MC05NC40IDEuMy0zLjYuNi02LjMtMS40LTktLjMtLjktLjQtMS45LS44LTIuOC02LjItMTUuMi0xMC43LTMwLjktMTIuOC00Ny4yLTEuMi0xMy40LTEuNy0zNC4xIDkuNi00MS40IDE1LjktMTAuNCA0NiAxLjkgMzQuNSA2MS44bS0xNC45IDU2LjJjLTkgMjYtMTguOSA1MS4yLTMyIDc1LjYgMjQuOC04LjIgNDkuNC0xNC43IDc0LjgtMTkuNS0xNy0xNi43LTMwLjgtMzUuNS00Mi44LTU2LjFtLTYzLjMgOTMuNWMtNCAxLjEtNDguNSAxOS44LTY1LjMgMzkuMS0xMC4xIDExLjUtOC40IDE3LjYtNC41IDIyIDcuNiA4LjUgMjAuMSAxIDI4LjYtNi43IDE3LTE1LjQgMjkuMS0zNC41IDQxLjItNTQuNG0xMTguNS0zMy43YzE1LjkgMTMuNiAzMyAyMy45IDUzLjEgMjguNCA2LjMgMS40IDEyLjYgMS4yIDE4LjUtMiA1LjEtMi44IDcuNy03LjIgNy43LTEzLjEgMC01LjYtMi42LTkuOC03LjQtMTIuMy0yLjYtMS40LTUuNS0yLjUtOC40LTMtMjEuMS0zLjQtNDItMS41LTYzLjUgMm0tNjUuNi04OS41YzUuMi0xNy42IDExLjQtMzguMiAxMy01OS43LjUtNi4zLjQtMTIuNS0yLTE4LjUtMS44LTQuNS01LTcuNS0xMC4xLTcuNy05LjYtLjQtMTIuNyA4LjYtMTQuMiAxOC42LTEuNSA5LjctLjMgMTkuNCAxLjQgMjkuMSAyLjUgMTMgNi41IDI1LjQgMTEuOSAzOC4yIi8+PC9zdmc+') left center no-repeat; background-size: 1em 1em; padding-left: 1.2em;}

.message h1 {margin: 0 !important;}

.lead {font-size: 130%; font-weight: 200;}

@media screen and (max-width: 480px)
{
	h2 {}
	.lead {font-size: 120%;}
}
.js-warning {padding: 0.5em 10%; line-height: 1.2; background: #BB0003; color: white;
	-webkit-box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.js-warning a, .js-warning a:visited {color: white;}
.js .js-warning {display: none;}
/*
a[href$='.vcf'] {background: url(../img/vcard.png) center left no-repeat; margin-top: 1em; display: block; height: 24px; padding-left: 38px}
*/

/* --------------------------------------------------------------------------------------- */
/* Icon Font */
/* --------------------------------------------------------------------------------------- */
@font-face {
      font-family: 'fontello';
      src: url('./font/fontello.eot?45584418');
      src: url('./font/fontello.eot?45584418#iefix') format('embedded-opentype'),
           url('./font/fontello.woff?45584418') format('woff'),
           url('./font/fontello.ttf?45584418') format('truetype'),
           url('./font/fontello.svg?45584418#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }



   .demo-icon
    {
      font-family: "fontello";
      font-style: normal;
      font-weight: normal;
      speak: none;

      display: inline-block;
      text-decoration: inherit;
      width: 1em;
      margin-right: .2em;
      text-align: center;
      /* opacity: .8; */

      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;

      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;

      /* Animation center compensation - margins should be symmetric */
      /* remove if not needed */
      margin-left: .2em;

      /* You can be more comfortable with increased icons size */
      /* font-size: 120%; */

      /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;

      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-download-alt:before { content: '\e800'; } /* '' */
.icon-export:before { content: '\e801'; } /* '' */
.icon-location:before { content: '\e802'; } /* '' */
.icon-map:before { content: '\e803'; } /* '' */
.icon-map-1:before { content: '\e804'; } /* '' */

a.location {text-decoration: none; font-size: 80%;}
/* --------------------------------------------------------------------------------------- */




/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.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:
 * https://www.drupal.org/node/897638
 */

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

/*
 * Hide visually and from screen readers, 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.
 */

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

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after,
    *:first-letter,
    *:first-line {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-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 that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

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

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

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

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

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

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

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