/* defaults */
html {
	height: 100%;
	font-size: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
body, h1, h2, p, a, img, video, canvas, form, input, textarea {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	text-decoration: none;
}
p {
	line-height: 1.5em;
}
a {
	color: inherit;
	font-weight: bold;
}
body {
	min-height: 100%;
	-moz-font-feature-settings: 'kern';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: #e5e5e5;
	color: Black;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
}
@font-face {
	font-family: Sidore;
	src: url(Sidore.woff);
	font-style: normal;
}
h1, h2 {
	font-family: Sidore;
	font-size: 3em;
	font-weight: normal;
	cursor: default;
}
@media (max-width: 1023px) {
	body {
		font-size: 14px;
	}
	h1, h2 {
		font-size: 2em;
	}
}



.fullwindow {
	position: relative;
	width: 100%;
	height: 100vh;
}
.absolute {
	position: absolute;
	left: 0;
	top: 0;
}
.overflow {
	overflow: hidden;
}



.craftorchestra {
	position: fixed;
	right: 20px;
	top: 20px;
	width: 80px;
	height: 80px;
	background: center center / contain no-repeat url(images/craftorchestra.svg);
	-webkit-animation: 60s linear craftorchestra infinite;
	animation: 60s linear craftorchestra infinite;
}
@-webkit-keyframes craftorchestra {
	from { -webkit-transform: rotate(0) } to { -webkit-transform: rotate(360deg) }
}
@keyframes craftorchestra {
	from { transform: rotate(0) } to { transform: rotate(-360deg) }
}
.box-back,
.box-front {
	position: absolute;
	left: 50%;
	top: 0;
	height: 100vh;
	opacity: 1;
	-webkit-transition: opacity .5s, -webkit-transform .5s;
	transition: opacity .5s, transform .5s;
}
.box-front {
	pointer-events: none;
}
.box-back::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 80vmin;
	height: 80vmin;
	margin-top: -40vmin;
	margin-left: -40vmin;
	background: center bottom / contain no-repeat url(images/box-back.png);
}
.box-front::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 80vmin;
	height: 80vmin;
	margin-top: -40vmin;
	margin-left: -40vmin;
	background: center bottom / contain no-repeat url(images/box-front.png);
}
.box-front::after {
	content: "";
	position: absolute;
	left: 0;
	top: calc(50vh + 21.25vmin);
	width: 20vmin;
	height: 10vmin;
	margin-left: -10vmin;
	background: center center / contain no-repeat url(images/logo.svg);
	opacity: .7;
}
.box-hide {
	-webkit-transform: translateY(10%);
	transform: translateY(10%);
	opacity: 0
}
.tinctures {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.tincture {
	position: absolute;
	left: 50%;
	top: 0;
	width: 15.77vmin;
	height: 66.4vmin;
	opacity: 1;
	-webkit-transition: opacity .5s;
	transition: opacity .5s;
}
.bottle {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.tinctures .bottle {
	top: calc(50vh - 40vmin);
	-webkit-transition: margin-top .2s;
	transition: margin-top .2s;
}
.tinctures .bottle:hover {
	margin-top: 1vmin;
	-webkit-transform: none !important;
	transform: none !important;
}
.tinctures .bottle-jingle:hover {
	margin-top: -5vmin;
	-webkit-transform: none !important;
	transform: none !important;
}
.label {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 36.2195%;
	-webkit-transform: translateY(127%);
	transform: translateY(127%);
	background: white;
}
.label::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / cover url(images/bottle-shadow.png);
}
/* background images */
.tincture-gdanskvodka .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-gdanskvodka.png);
}
.tincture-gdanskvodka .label {
	background: 0 center / auto 100% no-repeat url(images/label-gdanskvodka.png);
}
.tincture-grapebrandy .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-grapebrandy.png);
}
.tincture-grapebrandy .label {
	background: 0 center / auto 100% no-repeat url(images/label-grapebrandy.png);
}
.tincture-apricottincture .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-apricottincture.png);
}
.tincture-apricottincture .label {
	background: 0 center / auto 100% no-repeat url(images/label-apricottincture.png);
}
.tincture-plumtincture .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-plumtincture.png);
}
.tincture-plumtincture .label {
	background: 0 center / auto 100% no-repeat url(images/label-plumtincture.png);
}
.tincture-grapechacha .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-grapechacha.png);
}
.tincture-grapechacha .label {
	background: 0 center / auto 100% no-repeat url(images/label-grapechacha.png);
}
.tincture-calvados .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-calvados.png);
}
.tincture-calvados .label {
	background: 0 center / auto 100% no-repeat url(images/label-calvados.png);
}
.tincture-monkey47gin .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-monkey47gin.png);
}
.tincture-monkey47gin .label {
	background: 0 center / auto 100% no-repeat url(images/label-monkey47gin.png);
}
.tincture-peartincture .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-peartincture.png);
}
.tincture-peartincture .label {
	background: 0 center / auto 100% no-repeat url(images/label-peartincture.png);
}
.tincture-applepommo .bottle::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: center center / contain no-repeat url(images/bottle-applepommo.png);
}
.tincture-applepommo .label {
	background: 0 center / auto 100% no-repeat url(images/label-applepommo.png);
}
/* bottle animation */
.party .bottle {
	-webkit-animation: 4s ease-in-out party-tincture infinite;
	animation: 4s ease-in-out party-tincture infinite;
}
@-webkit-keyframes party-tincture {
	20% { -webkit-transform: translate(0, 0) rotate(0) }
	25% { -webkit-transform: translate(0.75%, -2.5%) rotate(0.2deg) }
	30% { -webkit-transform: translate(3%, 0) rotate(0.8deg) }
	40% { -webkit-transform: translate(-3%, 0) rotate(-0.8deg) }
	47.5% { -webkit-transform: translate(1.5%, 0) rotate(0.4deg) }
	55% { -webkit-transform: translate(-0.75%, 0) rotate(-0.2deg) }
	60% { -webkit-transform: translate(0, 0) rotate(0) }
}
@keyframes party-tincture {
	20% { transform: translate(0, 0) rotate(0) }
	25% { transform: translate(0.375%, -2.5%) rotate(0.1deg) }
	30% { transform: translate(1.5%, 0) rotate(0.4deg) }
	40% { transform: translate(-1.5%, 0) rotate(-0.4deg) }
	47.5% { transform: translate(0.75%, 0) rotate(0.2deg) }
	55% { transform: translate(-0.375%, 0) rotate(-0.1deg) }
	60% { transform: translate(0, 0) rotate(0) }
}
.party .tincture-gdanskvodka .bottle {
	-webkit-animation-delay: 1.3s;
	animation-delay: 1.3s;
}
.party .tincture-grapebrandy .bottle {
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s;
}
.party .tincture-apricottincture .bottle {
	-webkit-animation-delay: 0.8s;
	animation-delay: 0.8s;
}
.party .tincture-plumtincture .bottle {
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}
.party .tincture-grapechacha .bottle {
	-webkit-animation-delay: 1.2s;
	animation-delay: 1.2s;
}
.party .tincture-calvados .bottle {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
.party .tincture-monkey47gin .bottle {
	-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
}
.party .tincture-peartincture .bottle {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
.party .tincture-applepommo .bottle {
	-webkit-animation-delay: 0.75s;
	animation-delay: 0.75s;
}
/* opacity */
.party .tincture-gdanskvodka,
.party .tincture-grapebrandy,
.party .tincture-apricottincture,
.party .tincture-plumtincture,
.party .tincture-grapechacha {
	opacity: 0.65;
}
/* positioning */
.tincture.tincture-gdanskvodka {
	margin-left: -22.75vmin;
}
.tincture.tincture-grapebrandy {
	margin-left: 7.25vmin;
}
.tincture.tincture-apricottincture {
	margin-left: -29.75vmin;
}
.tincture.tincture-plumtincture {
	margin-left: -7.785vmin;
}
.tincture.tincture-grapechacha {
	margin-left: 14.25vmin;
}
.tincture.tincture-calvados {
	margin-left: -33.25vmin;
}
.tincture.tincture-monkey47gin {
	margin-left: -16.25vmin;
}
.tincture.tincture-peartincture {
	margin-left: 0.75vmin;
}
.tincture.tincture-applepommo {
	margin-left: 17.75vmin;
}



/* discover */
.discover {
	position: relative;
	width: 100%;
	padding: 200px 100px 0 100px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.discover:first-of-type {
	padding-top: 100px;
}
.discover:last-of-type {
	padding: 100px;
}
.logo {
	position: relative;
	left: 50%;
	margin-left: -50px;
	margin-bottom: 25px;
	width: 100px;
	height: 50px;
	background: center center / contain no-repeat url(images/logo.svg);
}
.discover h2 {
	max-width: 900px;
	margin: 25px auto 35px auto;
	text-align: center;
}
.discover p {
	max-width: 900px;
	margin: 0 auto 1em auto;
	text-align: center;
}
.discover p:last-of-type {
	margin: 0 auto;
}
.discover p span {
	font-family: Sidore;
}
.discover video,
.discover .video-plum {
	display: block;
	position: relative;
	margin: 45px auto 0 auto;
	width: 100%;
	max-width: 900px;
	object-fit: cover;
}
.discover .video-plum video {
	margin: 0;
	max-width: auto;
}
.discover .tincture {
	position: relative;
	left: auto;
	margin: 0 auto;
	width: 700px;
	height: 166.4634px;
}
.discover .bottle {
	left: calc(50% - 100px);
	top: 50%;
	width: 166.4634px;
	height: 700px;
	-webkit-transform: translate(-50%, -50%) rotate(-90deg);
	transform: translate(-50%, -50%) rotate(-90deg);
}
.discover .tincture-peartincture .bottle,
.discover .tincture-plumtincture .bottle,
.discover .tincture-apricottincture .bottle,
.discover .tincture-gdanskvodka .bottle {
	left: calc(50% + 100px);
	-webkit-transform: translate(-50%, -50%) rotate(90deg);
	transform: translate(-50%, -50%) rotate(90deg);
}
.discover .label {
	background-repeat: repeat-x;
}



@media (max-width: 1023px) {
	.craftorchestra {
		right: 12.5px;
		top: 12.5px;
	}
	.discover {
		padding: 100px 25px 0 25px;
	}
	.discover:first-of-type {
		padding-top: 50px;
	}
	.discover:last-of-type {
		padding: 100px 25px 25px 25px;
	}
	.discover h2 {
		margin: 25px auto 15px auto;
	}
	.discover video,
	.discover .video-plum {
		margin: 20px auto 0 auto;
	}
	.discover .video-plum video {
		margin: 0;
	}
	.discover .bottle,
	.discover .tincture-peartincture .bottle,
	.discover .tincture-plumtincture .bottle,
	.discover .tincture-apricottincture .bottle,
	.discover .tincture-gdanskvodka .bottle {
		left: 50%;
	}
}
@media (max-width: 750px) {
	.discover .tincture {
		position: relative;
		left: 50%;
		margin: 0;
		margin-left: -15vmin;
		width: 30vmin;
		height: 126.1538vmin;
		-webkit-transform: none !important;
		transform: none !important;
	}
	.discover .bottle,
	.discover .tincture-peartincture .bottle,
	.discover .tincture-plumtincture .bottle,
	.discover .tincture-apricottincture .bottle,
	.discover .tincture-gdanskvodka .bottle {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		-webkit-transform: none !important;
		transform: none !important;
	}
}



/* video */
#video {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	object-fit: cover;
}
#video:-webkit-full-screen {
	width: 100%;
	height: 100%;
}

.stories-container {
	position: relative;
	width: 100%;
	height: 100vh;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	background-color: white;
}
.stories-center {
	position: relative;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100vh;
}
.stories-video {
	position: relative;
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100vh;
	object-fit: cover;
}
.stories-playpause {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.stories-playpause-hide {
	display: none;
}
.play::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 60px;
	height: 60px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: rgba(0, 0, 0, 0.55);
	-webkit-backdrop-filter: saturate(180%) blur(17.5px);
	backdrop-filter: saturate(180%) blur(17.5px);
}
.play::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 0;
	height: 0;
	-webkit-transform: translate(-33%, -50%);
	transform: translate(-33%, -50%);
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent;
	border-left: 20px solid white;
}

/* controls only for plum */
.plum-choices {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.plum-choices-show {
	display: block;
}
.plum-choice-1 {
	position: absolute;
	left: 10.625%;
	top: 25%;
	width: 26.25%;
	height: 50%;
	cursor: pointer;
}
.plum-choice-2 {
	position: absolute;
	left: 36.875%;
	top: 25%;
	width: 26.25%;
	height: 50%;
	cursor: pointer;
}
.plum-choice-3 {
	position: absolute;
	left: 63.125%;
	top: 25%;
	width: 26.25%;
	height: 50%;
	cursor: pointer;
}
.plum-choices-show .plum-choice-circle {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: #ff4f4f;
	-webkit-animation: 2s ease-in-out plum-choice infinite;
	animation: 2s ease-in-out plum-choice infinite;
}
@-webkit-keyframes plum-choice {
	0% { width: 10px; height: 10px; opacity: .5; } 80% { width: 80px; height: 80px; opacity: .5; } 95% { width: 90px; height: 90px; opacity: 0; } 100% { width: 10px; height: 10px; opacity: 0; }
}
@keyframes plum-choice {
	0% { width: 10px; height: 10px; opacity: .5; } 80% { width: 80px; height: 80px; opacity: .5; } 95% { width: 90px; height: 90px; opacity: 0; } 100% { width: 10px; height: 10px; opacity: 0; }
}