:root{
	--primary: #fed001;
	--secondary: #d6000f;
	--black: #191818;
	--gray: #a1a1aa;
	--white:#fff;
}

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

html, body {
	width: 100%;
	overflow-x: hidden;
}

body {
	font-family: 'Inconsolata', monospace;
	color: var(--black);
	background: #ffffff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	/*border-bottom:80px solid var(--primary);*/
	background-image:url('../img/tower_bg.jpg');
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size:auto 500px;
}

main{
	padding-bottom:120px;
}

.curtain{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	width:100%;
	height:100vh;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
}

.block{
	display:block !important;
	margin-bottom:18px;
}


h2, .menu__link {
	font-family: 'Poppins', sans-serif;
}

a {
	text-decoration: none;
	color: #000;
	outline: none;
}

a:hover,
a:focus {
	color: #2d2d30;
}

.hidden {
	position: absolute;
	overflow: hidden;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* Icons */
.icon {
	display: block;
	width: 1.5em;
	height: 1.5em;
	margin: 0 auto;
	fill: currentColor;
}

.icon--inline {
	display: inline-block;
	width: 1em;
	height: 100%;
	margin: 0 0.25em 0 0;
}

.form__close {
    margin: 1.25em 0 0 0;
    position: relative;
    display: inline-block;
    height: 0.65em;
    float: left;
    font-weight: bold;
    cursor: pointer;
}

.content.intro {
	/*min-height:100vh;*/
	/*height:100vh;*/
	/*min-height: 50vh;*/
	border-top:8px solid var(--primary);
	border-bottom:8px solid var(--primary);
}

@media screen and (max-width: 768px) {

	.content.intro {
		min-height:100vh;
		height:100vh !important;
	}
}

/* Header */
.codrops-header {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	padding: 5vw;
	pointer-events: none;
}

.codrops-header__title {
	font-size: 1.5em;
	margin: 0;
	padding: 0 1em;
}

/* Top Navigation Style */
.codrops-links {
	position: relative;
	display: flex;
	justify-content: center;
	text-align: center;
	white-space: nowrap;
	font-size: 0.85em;
	border: 2px solid;
}

.codrops-links::after {
	content: '';
	height: 100%;
	width: 2px;
	background: currentColor;
	position: absolute;
	left: 50%;
	margin-left: -1px;
	top: 0;
}

.codrops-icon {
	pointer-events: visible;
	display: inline-block;
	padding: 0.6em;
}

/* Demo links */
.demos {
	flex: none;
	width: 100%;
	padding: 0.75em 0 0 0;
}

.demo {
	font-weight: bold;
	margin: 0 1em 0.5em 0;
	pointer-events: visible;
}

.github {
	pointer-events: visible;
}

.demo--current {
	text-decoration: underline;
}


@media screen and (max-width: 50em) {
	.codrops-header__title,
	.codrops-header__tagline {
		width: 100%;
		padding: 1em 0 0;
	}
	.demo {
		font-size: 1em;
		margin: 0.5em 1em 0.25em 0;
	}

	.form__title,
	.form__section {
		font-size: 0.85em;
	}
	.triggers {
		width: 100%;
		border: 0;
		padding: 0;
		font-size: 0.85em;
	}
	.modal {
		font-size: 0.85em;
	}
	.menu .menu__link {
		font-size: 2em;
	}
	.box {
		padding: 5vw;
		font-size: 0.85em;
	}
	.box--border {
		border: none;
	}
	.dual__content {
		min-height: 200px;
		font-size: 0.85em;
		padding: 1em;
	}
	.dual {
		margin-top: 0;
	}
}

.spacer{
	height:80px;
}

.sp_u {
	display: none;
}

.pc_u {
	display: initial;
}

@media screen and (max-width: 580px) {
	.sp_u {
		display: initial;
	}

	.pc_u {
		display: none;
	}
}


.oubo_button{
	border:3px solid var(--primary);
	padding:12px;

}


.slider-8.slick-slider{
	margin:40px 0;
	padding:0 !important;
}

.slider-8 .slick-slide {
	width: auto;
	height: 250px;
	position: relative;
	overflow: hidden;
}
.slider-8 .slick-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border:2px solid white;
}


.margin-top{
	padding-top:10px;
	margin-top:10px;
}

.margin-bottom{
	padding-bottom:10px;
	margin-bottom:10px;
}

.indent{
	position:relative;
	padding-left:20px;
}

/*.indent::before{*/
/*	content:"++";*/
/*	font-size:0.9em;*/
/*	position:absolute;*/
/*	left:0;*/
/*}*/


.b1_bottom_primary{
	border-bottom:1px solid var(--primary);
}

.b1_bottom_secondary{
	border-bottom:1px solid var(--secondary);
}

.b1_bottom_black{
	border-bottom:1px solid var(--black);
}

.b8_bottom_secondary{
	border-bottom:8px solid var(--secondary);
}

.b8_bottom_primary{
	border-bottom:8px solid var(--primary);
}

.b8_bottom_black{
	border-bottom:8px solid var(--black);
}

.b8_bottom_white{
	border-bottom:8px solid white;
}

.rotate{
	animation:sample 0.1s 1s ease-out forwards;
}

@keyframes sample {
	to {
		transform:rotate(8deg);
	}

}

.spacer{
	height:80px;
	width:100%;
	@media screen and (max-width: 580px) {
		height:60px;
	}
}


#lottie{
	margin:40px auto;
	max-width:580px;
	@media screen and (max-width: 580px) {

	}
}