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

html {
	overflow: hidden;
}




/* Text styles */
.title {
	margin: 0 auto 0 10%;
	font-size: 3vw;
	position: relative;
	color: #424242;
}

.title--centered {
	width: 100%;
	text-align: center;
}

.js .title--centered {
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.title--right {
	width: 100%;
	text-align: right;
}

.js .title--right {
	-webkit-justify-content: flex-end;
	-ms-flex-pack: flex-end;
	justify-content: flex-end;
}

.title--style-1 {
	font-family: 'Helvetica', 'Airal', sans-serif;
	font-weight: 400;
}

.title--style-2 {
	font-family: 'Fascinate Inline', cursive;
	font-weight: 400;
}

.title--style-3 {
	font-family: 'Pangolin', cursive;
	font-weight: 400;
}

.title--style-4 {
	font-family: 'Secular One', sans-serif;
	font-weight: 400;
}

.title--style-5 {
	font-family: 'Elsie Swash Caps', serif;
	font-weight: 400;
}

.title--style-6 {
	font-family: 'Lobster', cursive;
	font-weight: 400;
}

.title--style-7 {
	font-family: 'Pacifico', cursive;
	font-weight: 400;
}

.title--style-8 {
	font-family: 'Sacramento', serif;
	font-weight: 400;
}

.title--style-9 {
	font-family: 'Rye', cursive;
	font-weight: 400;
}

.title--style-10 {
	font-family: 'Dancing Script', cursive;
	font-weight: 400;
}

.title--style-11 {
	font-family: 'Amatic SC', cursive;
	font-weight: 400;
}

.title--style-12 {
	font-family: 'Satisfy', cursive;
	font-weight: 400;
}

.title--style-13 {
	font-family: 'Neucha', serif;
	font-weight: 400;
}

.title--style-14 {
	font-family: 'Chewy', cursive;
	font-weight: 400;
}

.title--style-15 {
	font-family: 'Cookie', cursive;
	font-weight: 400;
}

.title--style-16 {
	font-family: 'Bad Script', cursive;
	font-weight: 400;
}

.title--style-17 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
}

.title--style-18 {
	font-family: 'Noto Sans', sans-serif;
	font-weight: 400;
}

.title--style-19 {
	font-family: 'Baloo Da', cursive;
	font-weight: 400;
}

.title--style-20 {
	font-family: 'Lateef', cursive;
	font-weight: 400;
}

.title--style-21 {
	font-family: 'Comic Sans MS', cursive, sans-serif;
	font-weight: 400;
}



[class*="letter"] {
	display: block;
	position: relative;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
	white-space: pre;
}



/* Slideshow */
.slideshow {
	margin-top: 3em;
}

.slideshow,
.slide {
	position: relative;
	width: 100%;
	height: 5em;
	text-align: center;
}

.slide {
	padding: 0 6vw;
}

.js .slide {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

.js .slide:not(.slide--current) {
	position: absolute;
	top: 0;
	pointer-events: none;
	opacity: 0;
}


.letter-effect {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

@media screen and (orientation: landscape) and (max-width: 767px) {
	.slideshow {
		margin-top: 1vw;
	}
	.slide .slideshow {
		height: 5vw;
	}
}

@media screen and (max-width: 479px) {
	.title {
		font-size: 5vw;
	}
}