/*CUSTOM STYLES*/
html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

/*TYPO*/

/* montserrat-300 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/montserrat-v23-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v23-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v23-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v23-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v23-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v23-latin-300.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/montserrat-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v23-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-700 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/montserrat-v23-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v23-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v23-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v23-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v23-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v23-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-900 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/montserrat-v23-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v23-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v23-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v23-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v23-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v23-latin-900.svg#Montserrat') format('svg'); /* Legacy iOS */
}
*, html {
	font-size: 100%;
	font-family: 'Montserrat' !important;
	font-style: normal;
	font-weight: 400;
}
h1, h2, h3, h4, h5 {
	font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900 !important;
	color: white !important;
}

h1 {
	font-size: 4rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: flex-start;
	align-items: flex-start;
  justify-content: center;
}
h1 span {
	padding: 2% .5% 0 0;
	font-size: 40%;
}
.cd-fixed-background h2 {
    font-size: 2rem;
}
strong {
	font-family: 'Montserrat';
  	font-style: normal;
 	font-weight: 700;
}
a {
	color: #BC9764;
}
button,
a.button {
	border: 1px solid #BC9764;
	background-color: transparent;
	color: #BC9764;
	padding: .5rem 1rem;
	font-size: 80%;
	transition: all .25s ease;
	cursor: pointer;
}
button:focus,
button:hover,
a.button:focus,
a.button:hover {
	background-color: #BC9764;
	color: black;
}
a.button-buy.disabled {
	border: 1px solid gray;
	background-color: transparent;
	color: gray;
}
a.button-buy.disabled:hover,
a.button-buy.disabled:focus {
	border: 1px solid gray;
	background-color: transparent;
	color: gray;
}
a.button-buy {
	border: 1px solid white;
	background-color: transparent;
	color: white;
}
a.button-buy:focus,
a.button-buy:hover {
	background-color: white;
	color: black;
}

ul li {
	padding: 5px 0;
}
select {
  font-size: 1.2rem;
	margin-bottom: 2rem;
}
.logo {
  top: 1rem;
  left: 1rem;
  width: 3rem;
  height: 3rem;
  position: fixed;
	background-color: transparent;
	z-index: 1;
}
.logo img {
	width: 100%;
}
.footer-logo {
	width: 8rem;
	height: 8rem;
	margin-bottom: 2rem;
}
footer {
	background-color: black;
	text-align: center;
	padding:3rem;
}
footer small {
	font-size: 60%;
	color:#BC9764; 
}
footer small a {
	color:#BC9764; 
	text-decoration: underline;
}

.social {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  margin-bottom: 1rem;
}
.social img {
  margin: 0 .5rem;
  height:24px; 
  width:24px;
  opacity: .7;
  transition: opacity .25s ease;
}
.social a:hover img,
.social a:focus img {
  opacity: 1;
}


/***COOKIE BANNER***/
#cookies-eu-banner {
  margin: 0;
    padding: 0;
    overflow: hidden;
    background: rgba(0,0,0,.8);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100vh;
    width:100vw;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}
#cookies-eu-banner p {
    font-size: 50%;
  	width: 100%;
  	max-width: 90%;
    color: #fff;
    padding: 1rem;
    border: 1px solid #fff;
    background-color: #000;
    line-height: 1.2;
}
#cookies-eu-banner a {
  text-decoration: underline;
}
#cookies-eu-accept {
	background-color: #BC9764;
	color: black;
}
#cookies-eu-analytics,
#cookies-eu-accept {
  margin-left: 1rem;
}
#cookies-eu-reject,
#cookies-eu-analytics,
#cookies-eu-accept {
  margin-top: 1rem;
}
#cookies-eu-analytics,
#cookies-eu-reject {
  background-color: transparent;
}
#cookies-eu-analytics:hover,
#cookies-eu-analytics:focus,
#cookies-eu-reject:hover,
#cookies-eu-reject:focus {
  background-color: transparent;
  color: #BC9764;
}

.cd-fixed-background.img-0,
.cd-fixed-background.img-1,
.cd-fixed-background.img-2,
.cd-fixed-background.img-3,
.cd-fixed-background.img-4 {
    background-color: #2A2D34;
}
.cd-fixed-background.img-5,
.cd-fixed-background.img-6 {
  background-color: #28384c;
  padding:0;
}
.cd-fixed-background.img-7,
.cd-fixed-background.img-8,
.cd-fixed-background.img-9 {
    background-color: #BC9764;
}
.cd-fixed-background.img-5 p,
.cd-fixed-background.img-6 p {
  padding: 0 5%;
}
.cd-fixed-background.img-5 h2,
.cd-fixed-background.img-6 h2 {
  padding: 3rem 5% 0;
}
.cd-fixed-background p {
    color: #BC9764;
    font-size: 1.2rem;
}
.cd-fixed-background ul {
    font-size: 1rem;
}
.cd-fixed-background .cd-content::after {
    padding: 95% 0;
    margin: 3rem auto 0;
}
.cd-fixed-background.img-0 .cd-content::after {
    padding: 52% 0;
    margin: 3rem auto 0;
}
.cd-fixed-background.img-9 {
  padding: 5%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}
.cd-fixed-background.img-9 .cd-content {
  padding: 5%;
  width: 100%;
}
.cd-fixed-background.img-9 .cd-content:after {
  padding: 0;
  margin: 0;
}
ul,
#kaufen.cd-fixed-background p {
    color: black;
}

.cd-fixed-background.img-0 .cd-content::after {
  background: url("../img/img-mobile-0.jpg") no-repeat;
  background-size: 100% auto;
}
.cd-fixed-background.img-5 .cd-content::after {
  background: url("../img/img-mobile-5.jpg") no-repeat;
  background-size: 100% auto;
}
.cd-fixed-background.img-6 .cd-content::after {
  background: url("../img/img-mobile-6.jpg") no-repeat;
  background-size: 100% auto;
}
.cd-fixed-background.img-7 .cd-content::after {
  background: url("../img/img-mobile-7.jpg") no-repeat;
  background-size: 100% auto;
}
.cd-fixed-background.img-8 .cd-content::after {
  background: url("../img/img-mobile-8.jpg") no-repeat;
  background-size: 100% auto;
}

/*SHOPDROPDOWN*/
.shop-dropdown.light {
  border: 1px solid #BC9764;
  color: #BC9764;
}
.shop-dropdown {
  font-size: 80%;
  border: 1px solid #000;
  color: #000;
  text-decoration: none;
  position: relative;
  padding: .5rem 1rem;
  display: inline-block;
  cursor: pointer;
}
.shop-dropdown ul {
  display: none;
  opacity: 0;
  position: absolute;
  top: 36px;
  left: -1px;
  border: 1px solid #BC9764;
  transition: opacity .25s ease;
}
.shop-dropdown:focus ul,
.shop-dropdown:hover ul,
.shop-dropdown.active ul {
  display: block;
  opacity: 1;
}
.shop-dropdown ul li {
  border-bottom: 1px solid #BC9764;
  background-color: black;
  transition: background .25s ease;
}
.shop-dropdown ul li:focus,
.shop-dropdown ul li:hover {
  background-color: white;
}
.shop-dropdown ul li a {
  display: block;
  padding: .5rem 1rem;
  color: #BC9764;
  text-decoration: none;
  font-size: 1rem;
  transition: color .25s ease;
}
.shop-dropdown ul li:focus a,
.shop-dropdown ul li:hover a {
  color: #000;
}

/*VIDEO*/
.video-wrapper {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  -ms-align-items: center;
  align-items: center;
}
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*MEDIA QUERIES*/
/*@media only screen and (min-width: 768px) {*/
@media screen and (min-width: 40em) {
  .cd-fixed-background p {
    margin-bottom: 2rem;
  }
	.cd-fixed-background {
		height:auto;
		min-height: 100%;
	}
  .cd-fixed-background.img-0 {
		background-image: url("../img/img-0.jpg");
	}
	.cd-fixed-background.img-5 {
		background-image: url("../img/img-5.jpg");
	}
	.cd-fixed-background.img-6 {
		background-image: url("../img/img-6.jpg");
	}
	.cd-fixed-background.img-7 {
		background-image: url("../img/img-7.jpg");
	}
	.cd-fixed-background.img-8 {
		background-image: url("../img/img-8.jpg");
	}
	.cd-fixed-background .cd-content {
	  width: 100%;
	  position: relative;
	  left:0;
	  top: 0;
	  bottom: auto;
	  -webkit-transform: none;
	  -moz-transform: none;
	  -ms-transform: none;
	  -o-transform: none;
	  transform: none;
	}
}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  .logo {
    top: 1rem;
    left: 1rem;
    width: 5rem;
    height: 5rem;
  }
  .cd-fixed-background .cd-content {
    width: 100%;
    left: 0;
    padding:10% 50% 10% 10%;
  } 
  .cd-fixed-background h2 {
    font-size: 3rem;
  }
  .cd-fixed-background {
    background-position: 70% center;
  } 
  .cd-fixed-background.img-5 {
    background-position: center center;
  }
}

@media screen and (min-width: 64em) {
  .logo {
    top: 1rem;
    left: 1rem;
    width: 5rem;
    height: 5rem;
  }
  .cd-fixed-background .cd-content {
    width: 100%;
    left: 0;
    padding:10% 50% 10% 10%;
  } 
  .cd-fixed-background.img-9 .cd-content {
    padding: 10%;
  }
  .cd-fixed-background ul,
  .cd-fixed-background p {
    font-size: 1.5rem;
  }
  h1 {
    font-size: 6rem;
    justify-content: flex-start;
  }
  h1 span {
    padding: 1.3% .5% 0 0;
    font-size: 40%;
  }
  .cd-fixed-background h2 {
    font-size: 3rem;
  }
  #cookies-eu-banner p {
    max-width: 50%;
    font-size: 75%;
  }

}

@media only screen and (min-width: 75em) {
  .logo {
    top: 2rem;
    left: 2rem;
    width: 8rem;
    height: 8rem;
  }
}





