@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/bebas-neue-v2-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/bebas-neue-v2-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/bebas-neue-v2-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/bebas-neue-v2-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/bebas-neue-v2-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/bebas-neue-v2-latin-regular.svg#BebasNeue') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/oswald-v35-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/oswald-v35-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/oswald-v35-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/oswald-v35-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/oswald-v35-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/oswald-v35-latin-regular.svg#Oswald') format('svg'); /* Legacy iOS */
}
html {
  scroll-behavior: smooth;
}

body {
  background-color: #0B0703;
  color: #f8f9fa;
  font-family: 'Oswald', serif;
  font-size: 24px;
}
H1, H2, H3, H4 {
  font-family: 'Bebas Neue', serif;
}
H1 {
  font-size: 5.5rem;
  line-height: 1em;
  padding-top: 0.5em;
}
.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,.9) !important;
    border-color: rgba(255,255,255,.6) !important;
}
.navbar-toggler {
	font-size: 1.5rem !important;
}
#navbarstart {
	background-color: rgba(11,7,3,.95) !important;
	padding-left: 15px;
    border: 1px solid #a1a1a1 !important;
}
.nav-link, .linkw {
    color: rgba(255,255,255,.9) !important;
}
#partner img { max-width: 100%; height: auto; }
#partner img.partnerstart, #partner:hover img.partnerover { display: block; }
#partner img.partnerover, #partner:hover img.partnerstart { display: none; }
.frame {
	text-align: center;	
	position: relative;
	cursor: pointer;	
	perspective: 500px; 
}
.frame img {
	width: 300px;
	height: 300px;
}
.frame .details {
	width: 70%;
	height: 80%;	
	padding: 5% 8%;
	position: absolute;
	content: "";
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotateY(90deg);
	transform-origin: 50%;
	background: rgba(255,255,255,0.9);	
	opacity: 0;
	transition: all 0.4s ease-in;
	
}
.frame:hover .details {
	transform: translate(-50%, -50%) rotateY(0deg);
	opacity: 1;
}

.gtop {
	background-image: url("/images/background.png");
	background-size: auto;
	background-repeat: no-repeat;
}
.dasistdrin{
	background-image: url("/images/dasistdrin_gin.gif");
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain;
}

.dasistdrinb{
	background-image: url("/images/inhalt_berry_gin.gif");
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain;
}
.container {
  border-right: 2px solid #fff;
  border-left: 2px solid #fff;
}

.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.topgin {
	background-image: url("/images/top_slait_back.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.topginq {
	background-image: url("/images/top_slait_backq.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.partnerh {
	background-image: url("/images/partner_back.gif");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.p_image {
    width: 100%;
    overflow: hidden
}

.p_image img {
    width: 100%;
    transition: all 1s ease-in-out
}

.p_image:hover img {
    transform: scale(1.1, 1.1);
    cursor: pointer
}

@media (max-width: 500px) {
	body {
	  font-size: 18px;
	}
	H1 {
	  font-size: 3.5rem;
	  padding-top: 0.5em;
	}
    
	.dasistdrin {
		background-image: none;
	}
	.dasistdrinb {
		background-image: none;
	}
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
  font-size: 3.5rem;
}

.body {
  font-size: 3.5rem;
}
.berryfarb {
	color: #E03289;
}

}