@font-face {
  font-family: 'featherly';
  src: url('../fonts/featherly.eot') format('embedded-opentype');
  src: url('../fonts/featherly.otf')  format('opentype'), url('../fonts/featherly.ttf')  format('truetype'), url('../fonts/featherly.svg') format('svg');
}

@font-face {
  font-family: 'featherlyswashes';
  src: url('../fonts/featherlyswashes.eot') format('embedded-opentype');
  src:  url('../fonts/featherlyswashes.otf')  format('opentype'), url('../fonts/featherlyswashes.ttf')  format('truetype'), url('../fonts/featherlyswashes.svg') format('svg');
}


/* Palette URL: http://paletton.com/#uid=14H0u0kpIpqf-x7k-rXsbkmxRfj */

.color-primary-0 { color: #632087 } /* Main Primary color */
.color-primary-1 { color: #915DAD }
.color-primary-2 { color: #753A95 }
.color-primary-3 { color: #4C126C }
.color-primary-4 { color: #360451 }

.rgba-primary-0 { color: rgba( 99, 32,135,1) }  /* Main Primary color */
.rgba-primary-1 { color: rgba(145, 93,173,1) }
.rgba-primary-2 { color: rgba(117, 58,149,1) }
.rgba-primary-3 { color: rgba( 76, 18,108,1) }
.rgba-primary-4 { color: rgba( 54,  4, 81,1) }

body {
  background: url('../images/background.jpg') no-repeat top left fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
body { padding-bottom: 100px; }
h1 {
  color: #4c126c;
  text-align: center;
  margin-top:0px
}

.container {
  margin-bottom:40px
}

.content-container {
  background: rgba(255, 255, 255, 0.9);
  border-radius: 10px;
  margin-top: 40px;
  padding-bottom: 20px;
}

.content-container h1 {
  text-align: center;
}

.navbar-default {
  background-color: #fff;
  border-color: #fff;
}

img {
  margin:auto
}

nav.navbar.navbar-default {
  background: rgba(255, 255, 255, 0.9);
  margin-top: 10px;
}

div.logo {
  font-family: 'featherly';
  font-size: 4em;
  text-align: center;
  color: #4c126c;
  height: 2em;
}

@media only screen and (max-width : 480px) {
  div.logo {
    font-size: 2em;
  }
}

div.logo span.swashes {
  font-family: 'featherlyswashes';
}

div.logo span.heart {
  font-size: 44px;
  margin-left: -24px;
  margin-right: -24px
}

.countdown {
  font-size:2em;
  text-align:center;
  color: #4c126c; 
  margin-top: 20px;
  font-family:'featherly';
  min-height: 2em;
}

@media only screen and (max-width : 480px) {
  div.countdown {
    font-size: 1em;
  }
}

.countdown b {
  color: darkgreen;
}

span.countdown_label {
  min-height: 2em;
}

div.countdown_wrapper {
  display: none;
}

span.jojo:before, span.jojo:after, span.micha:before, span.micha:after {
  font-family: 'featherlyswashes';
}

span.jojo:before {
  content: 'K';
}

span.jojo:after {
  content: 'c';
}

span.micha:before {
  content: 'C';
}

span.micha:after {
  content: 'k';
}

.thumbnail .caption.date_location {
  font-family: 'featherly';
  font-size: 2em;
  color: darkgreen;
  text-align: center;
}

.thumbnail {
    position: relative;
    background: none;
    border: none;
}


.caption {
  position: absolute;
  top: 45%;
  left: 0;
  width: 100%;
}

.date_location {
  display: none;
}

.thumbnail:hover .date_location {
 display: inline;
}

.thumbnail:hover img {
  opacity: 0.3;
}

.location {
  margin: 40px auto;
}

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

#map_frauenkirche, #map_carolaschloesschen {
  width: 50%;
  height: 98%;
  position: absolute;
  top: 5px;
  left: 19px;
  opacity: 0.7;
}

#map_hotels_city_large, #map_hotels_farm_large {
  position:absolute;
  top:0px;
  left:0px;
  height:100%
}

.hotels-row {
  margin-bottom:20px;
}
/*
@media only screen and (min-width: 320px) {
#map_frauenkirche {
  background: url(https://maps.googleapis.com/maps/api/staticmap?center=51.0520122,13.741598&zoom=12&size=130x153&maptype=roadmap&style=feature:all%7Cvisibility:simplified&key=AIzaSyArEWe0HVFzD__SWY-cVxNPiz_-eau1I0c)
}
}
@media only screen and (min-width: 768px) {
#map_frauenkirche {
  background: url(https://maps.googleapis.com/maps/api/staticmap?center=51.0520122,13.741598&zoom=12&size=317x396&maptype=roadmap&style=feature:all%7Cvisibility:simplified&key=AIzaSyArEWe0HVFzD__SWY-cVxNPiz_-eau1I0c)
}
}
@media only screen and (min-width: 1170px) {
#map_frauenkirche {
  background: url(https://maps.googleapis.com/maps/api/staticmap?center=51.0520122,13.741598&zoom=12&size=185x225&maptype=roadmap&style=feature:all%7Cvisibility:simplified&key=AIzaSyArEWe0HVFzD__SWY-cVxNPiz_-eau1I0c)
}
}

#map_carolaschloesschen {
  background: url(https://maps.googleapis.com/maps/api/staticmap?center=Dresden&zoom=13&size=700x300&maptype=roadmap&key=AIzaSyArEWe0HVFzD__SWY-cVxNPiz_-eau1I0c)
}
*/
#map_hotels_city_large {
  width: 100%;
}

#map_hotels_farm_large {
  width: 100%;
  height: 280px;
}

#map_hotels_city_small, #map_hotels_farm_small {
  width: 100%;
  height: 500px;
}

.hotel-description-container {
  padding: 10px;
  margin: -1px -15px 0px 0px;
 }

@media (min-width : 992px) {
.hotel-description-container {
  background-color: rgba(255, 255, 255, 0.7);
 }
}

 .map-icon-frauenkirche {
   
 }

@media only screen and (min-width : 801px) {
  .location h2 {
    margin-top: 0px;
  }
}

.geschenk-titel {
  padding-bottom: 9px;
  margin: 0px 0px 0px 0px;
}

.progress {
  margin-top:10px;
}

.progress-bar-info {
background-color: #9abd4e;
}

ul.cart {
  list-style-type: none;
  padding-left: 0px;
}

li.item{
box-shadow: 0 1px 0 #e1e5e8;
padding-bottom: 0;
padding-left: 15px;
background-color: #ffffff;
margin-bottom: 11px;
height: 65px;
padding-right: 15px;
padding-top: 10px
}

li span.quantity {
color: #632087;
font-size: 18px;
font-weight: bold;
float: left;
width: 42px;
padding-left: 7px;
}

li span.title {
color: #727578;
font-size: 16px;
font-weight: bold;
float: left;
}

li span.price {
font-size: 18px;
font-weight: bold;
float: right;
padding-right:10px;
}

li.gift-basket {
  font-size: 18px;
}

.navbar-brand {
  font-size: 24px;
}

p.lead {
  font-size: 18px;
}

div.price-column {
  margin-bottom:14px;
}

div.button-column a {
  margin-bottom:15px;
}

#grid .col-xs-1,#grid  .col-sm-1,#grid  .col-md-1,#grid  .col-lg-1,#grid  .col-xs-2,#grid  .col-sm-2,#grid  .col-md-2,#grid  .col-lg-2,#grid  .col-xs-3,#grid  .col-sm-3,#grid  .col-md-3,#grid  .col-lg-3,#grid  .col-xs-4,#grid  .col-sm-4,#grid  .col-md-4,#grid  .col-lg-4,#grid  .col-xs-5,#grid  .col-sm-5,#grid  .col-md-5,#grid  .col-lg-5,#grid  .col-xs-6,#grid  .col-sm-6,#grid  .col-md-6,#grid  .col-lg-6,#grid  .col-xs-7,#grid  .col-sm-7,#grid  .col-md-7,#grid  .col-lg-7,#grid  .col-xs-8,#grid  .col-sm-8,#grid  .col-md-8,#grid  .col-lg-8,#grid  .col-xs-9,#grid  .col-sm-9,#grid  .col-md-9,#grid  .col-lg-9,#grid  .col-xs-10,#grid  .col-sm-10,#grid  .col-md-10,#grid  .col-lg-10,#grid  .col-xs-11,#grid  .col-sm-11,#grid  .col-md-11,#grid  .col-lg-11,#grid  .col-xs-12,#grid  .col-sm-12,#grid  .col-md-12,#grid  .col-lg-12 {
padding-left: 0px; 
padding-right: 0px
}
#grid .thumbnail {
  margin-bottom: 0px;
  padding: 2px;
  position: relative
}
#grid {
  margin-top:20px;
}

/*
*,
*:before,
*:after {
    box-sizing: border-box;
  }
*/
/*
.photos.row {
  -moz-column-width: 19em;
  -webkit-column-width: 19em;
          
  -moz-column-gap: 1em;
  -webkit-column-gap: 1em;
}

.item {
  display: inline-block;
  width: 100%;
}*/
#grid {}
.column { float: left; }
.size-1of1 { width: 100%; }
.size-1of2 { width: 50%; }
.size-1of3 { width: 25%; }

.carousel-control.left,.carousel-control.right{
  background-image:none;
  margin-top:10%;
  width:5%;
}
#imagelightbox
{
  position: fixed;
  z-index: 9999;
  -ms-touch-action: none;
  touch-action: none;
box-shadow: 0 0 300px 200px rgba( 0, 0, 0, .75 );
}

#imagelightbox-loading, #imagelightbox-loading div {
  border-radius: 50%;
}
#imagelightbox-loading
{
  width: 2.5em; /* 40 */
  height: 2.5em; /* 40 */
  background-color: #444;
  background-color: rgba( 0, 0, 0, .5 );
  position: fixed;
  z-index: 10003;
  top: 50%;
  left: 50%;
  padding: 0.625em; /* 10 */
  margin: -1.25em 0 0 -1.25em; /* 20 */
  -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
  box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
}
#imagelightbox-loading div
{
width: 1.25em; /* 20 */
height: 1.25em; /* 20 */
background-color: #fff;
-webkit-animation: imagelightbox-loading .5s ease infinite;
animation: imagelightbox-loading .5s ease infinite;
}
@-webkit-keyframes imagelightbox-loading
{
from { opacity: .5; -webkit-transform: scale( .75 ); }
50%  { opacity: 1;  -webkit-transform: scale( 1 ); }
to   { opacity: .5; -webkit-transform: scale( .75 ); }
}
@keyframes imagelightbox-loading
{
from { opacity: .5; transform: scale( .75 ); }
50%  { opacity: 1;  transform: scale( 1 ); }
to   { opacity: .5; transform: scale( .75 ); }
}

/* ACTIVITY INDICATION */

#imagelightbox-loading,
#imagelightbox-loading div
  {
    border-radius: 50%;
  }
#imagelightbox-loading
  {
    width: 2.5em; /* 40 */
    height: 2.5em; /* 40 */
    background-color: #444;
    background-color: rgba( 0, 0, 0, .5 );
    position: fixed;
    z-index: 10003;
    top: 50%;
    left: 50%;
    padding: 0.625em; /* 10 */
    margin: -1.25em 0 0 -1.25em; /* 20 */
    -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
    box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
  }
#imagelightbox-loading div
  {
  width: 1.25em; /* 20 */
  height: 1.25em; /* 20 */
  background-color: #fff;
  -webkit-animation: imagelightbox-loading .5s ease infinite;
  animation: imagelightbox-loading .5s ease infinite;
}

@-webkit-keyframes imagelightbox-loading
  {
    from { opacity: .5; -webkit-transform: scale( .75 ); }
    50%  { opacity: 1;  -webkit-transform: scale( 1 ); }
    to   { opacity: .5; -webkit-transform: scale( .75 ); }
  }
@keyframes imagelightbox-loading
  {
    from { opacity: .5; transform: scale( .75 ); }
    50%  { opacity: 1;  transform: scale( 1 ); }
    to   { opacity: .5; transform: scale( .75 ); }
  }

/* "CLOSE" BUTTON */

#imagelightbox-close
  {
    width: 2.5em; /* 40 */
    height: 2.5em; /* 40 */
    text-align: left;
    background-color: #666;
    border-radius: 50%;
    position: fixed;
    z-index: 10002;
    top: 2.5em; /* 40 */
    right: 2.5em; /* 40 */
    -webkit-transition: color .3s ease;
    transition: color .3s ease;
    border:none;
  }
#imagelightbox-close:hover,
#imagelightbox-close:focus { background-color: #111; }
#imagelightbox-close:before,
#imagelightbox-close:after
  {
    width: 2px;
    background-color: #fff;
    content: '';
    position: absolute;
    top: 20%;
    bottom: 20%;
    left: 50%;
    margin-left: -1px;
  }
#imagelightbox-close:before
  {
    -webkit-transform: rotate( 45deg );
    -ms-transform: rotate( 45deg );
    transform: rotate( 45deg );
  }
#imagelightbox-close:after
  {
    -webkit-transform: rotate( -45deg );
    -ms-transform: rotate( -45deg );
    transform: rotate( -45deg );
  }
  /* NAVIGATION */

  		#imagelightbox-nav
  		{
  			background-color: #444;
  			background-color: rgba( 0, 0, 0, .5 );
  			border-radius: 20px;
  			position: fixed;
  			z-index: 10001;
  			left: 50%;
  			bottom: 3.75em; /* 60 */
  			padding: 0.313em; /* 5 */

  			-webkit-transform: translateX( -50% );
  			-ms-transform: translateX( -50% );
  			transform: translateX( -50% );
  		}
  			#imagelightbox-nav button
  			{
  				width: 1em; /* 20 */
  				height: 1em; /* 20 */
  				background-color: transparent;
  				border: 1px solid #fff;
  				border-radius: 50%;
  				display: inline-block;
  				margin: 0 0.313em; /* 5 */
  			}
  			#imagelightbox-nav button.active
  			{
  				background-color: #fff;
  			}


  		/* ARROWS */

  		.imagelightbox-arrow
  		{
  			width: 3.75em; /* 60 */
  			height: 7.5em; /* 120 */
  			background-color: #444;
  			background-color: rgba( 0, 0, 0, .5 );
  			vertical-align: middle;
  			display: none;
  			position: fixed;
  			z-index: 10001;
  			top: 50%;
  			margin-top: -3.75em; /* 60 */
        border:none;
  		}
  		.imagelightbox-arrow:hover,
  		.imagelightbox-arrow:focus	{ background-color: rgba( 0, 0, 0, .75 ); }
  		.imagelightbox-arrow:active { background-color: #111; }

  			.imagelightbox-arrow-left	{ left: 2.5em; /* 40 */ }
  			.imagelightbox-arrow-right	{ right: 2.5em; /* 40 */ }

  			.imagelightbox-arrow:before
  			{
  				width: 0;
  				height: 0;
  				border: 1em solid transparent;
  				content: '';
  				display: inline-block;
  				margin-bottom: -0.125em; /* 2 */
  			}
  				.imagelightbox-arrow-left:before
  				{
  					border-left: none;
  					border-right-color: #fff;
  					margin-left: -0.313em; /* 5 */
  				}
  				.imagelightbox-arrow-right:before
  				{
  					border-right: none;
  					border-left-color: #fff;
  					margin-right: -0.313em; /* 5 */
  				}

  		#imagelightbox-loading,
  		#imagelightbox-overlay,
  		#imagelightbox-close,
  		#imagelightbox-caption,
  		#imagelightbox-nav,
  		.imagelightbox-arrow
  		{
  			-webkit-animation: fade-in .25s linear;
  			animation: fade-in .25s linear;
  		}
  			@-webkit-keyframes fade-in
  			{
  				from	{ opacity: 0; }
  				to		{ opacity: 1; }
  			}
  			@keyframes fade-in
  			{
  				from	{ opacity: 0; }
  				to		{ opacity: 1; }
  			}

  		@media only screen and (max-width: 41.250em) /* 660 */
  		{
  			#container
  			{
  				width: 100%;
  			}
  			#imagelightbox-close
  			{
  				top: 1.25em; /* 20 */
  				right: 1.25em; /* 20 */
  			}
  			#imagelightbox-nav
  			{
  				bottom: 1.25em; /* 20 */
  			}

  			.imagelightbox-arrow
  			{
  				width: 2.5em; /* 40 */
  				height: 3.75em; /* 60 */
  				margin-top: -2.75em; /* 30 */
  			}
  			.imagelightbox-arrow-left	{ left: 1.25em; /* 20 */ }
  			.imagelightbox-arrow-right	{ right: 1.25em; /* 20 */ }
  		}

  		@media only screen and (max-width: 20em) /* 320 */
  		{
  			.imagelightbox-arrow-left	{ left: 0; }
  			.imagelightbox-arrow-right	{ right: 0; }
  		}
[data-columns]::before {
  display: block;
  visibility: hidden;
  position: absolute;
  font-size: 1px;
}

#pinBoot {
  position: relative;
  max-width: 100%;
  width: 100%;
  margin-left: 2px;
}

img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.white-panel {
  position: absolute;
  background: white;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
  padding: 0px;
}
/*
* stylize any heading tags withing white-panel below
* */

.white-panel h1 {
  font-size: 1em;
}
.white-panel h1 a {
  color: #A92733;
}

.white-panel:hover {
  margin-top: -5px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#grid {
 width: 100%;
}
.grid-sizer,
.grid-item { 
  width: 25%; 
}
.grid-item a img {
  border: 1px solid #fff;
}
/* 2 columns */
.grid-item--width2 { width: 40%; }

.xc1 {
  max-height: 1000px;
}

.video {
  margin-top: 20px;
}