@font-face{
	font-family: "myfont";
	src: url("../font/barlow/Barlow-Regular.otf") format("opentype");
}
@font-face{
	font-family: "belinda";
	src: url("../font/belinda/belinda.otf") format("opentype");
}
@font-face{
	font-family: "myfont1";
	src: url("../font/couture/couture-bld.otf") format("opentype");
}
@font-face{
	font-family: "kghappy";
	src: url("../font/kghappy/KGHAPPY.ttf") format("opentype");
}
@font-face{
    font-family: "raleway";
    src: url("../font/raleway/Raleway-Medium.ttf") format("opentype");
}
@font-face{
	font-family: "barlowconden";
	src: url("../font/barlow/BarlowCondensed-Regular.otf") format("opentype")
}
@font-face{
	font-family: "barlowcondenextra";
	src: url("../font/barlow/BarlowCondensed-ExtraLight.otf") format("opentype");
}
@font-face{
	font-family: "damion";
	src: url("../font/damion/Damion-Regular.ttf") format("opentype");
}
@font-face{
	font-family: "enriqueta";
	src: url("../font/enriqueta/Enriqueta-Regular.ttf") format("opentype");
}
body{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	border: 0;
	font-size: 16px;
}
::-webkit-scrollbar { 
    display: none; 
}
html{
    scroll-behavior: smooth;
    width: 100%;
    height: 100%;
}
nav{
	opacity: 0.8;
	background-color: white;
	top: 10%; 
	padding-left: 0%;
	padding-right: 0.5%;
    right: 0.5%; 
	width: 15%;
    position: fixed; 
    margin-right: 0.1%;
    z-index: 50; 
    height: auto;
}
nav ul{
	list-style-type: none;
	margin: 16px 0 5px;
}
nav li{
	height: auto;
	min-height: 30px;
}
li{
	min-height:30px;
	height:30px;
}
.list1{
	color: #b0a594;
}
nav a{
	text-decoration: none;
	text-transform: uppercase;
	font-family: myfont;
	color: black;
	letter-spacing: 0.05em;
	font-weight: bold;
}
nav a:hover{
	text-decoration: none;
	text-transform: uppercase;
	font-family: myfont;
	color: #b0a594;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
}
.hastage{
	top: 43%; 
	left: 0px; 
	width: 40%; 
	position: fixed; 
	transform: rotate(270deg); 
	margin-left:-15%;
	z-index: 50; 
}
.hastage .font_hastage{
	line-height:1.2em;
	letter-spacing: 0.05em; 
	text-align:right; 
	font-size: 350%;
	font-weight: bold;
	font-family: myfont;
}
.quote{
	left: 10%; 
	width: 50%; 
	position: absolute; 
	top: 10.5%;
}
.quote .font_quote{
	font-size: 120%;
	font-style: italic;
	line-height:1.1em;
	letter-spacing:0.23em;
	font-family:didot-w01-italic,serif;
	font-weight:bold;
}
.marquee{
	width: 40%;
	overflow: hidden;
	white-space: nowrap;
}
.marquee .font_quote{
	display: inline-block;
	padding-left: 100%;
	animation: marquee-scroll 9s linear infinite;
	will-change: transform;
}
@keyframes marquee-scroll{
	from{
		transform: translate3d(0, 0, 0);
	}
	to{
		transform: translate3d(-100%, 0, 0);
	}
}
@media (prefers-reduced-motion: reduce){
	.marquee .font_quote{
		padding-left: 0;
		animation: none;
	}
}
.container{
	display: block;
	width: 70%;
	margin-left: 15%;
	margin-right: 15%;
}

.bgBottom{
	height: 35vh;
	background-color: #61343E;
}
.inner{
	padding-top: 1%;
	margin: 0 auto;
}
.bgBottom p{
	font-family: myfont;
	font-size: 180%;
	font-weight: bold;
	letter-spacing: 0.05em;
}
.bgBottom hr{
	border: 0;
	width: 22%;
	height: 5px;
	background-color: black;
}
.bgBottom table{
	padding-top: 1%;
}
.bgBottom td{
	text-transform: uppercase;
	color: white;
	font-family: myfont;
	font-size: 120%;
	letter-spacing: 0.05em;
	font-weight: bold;
}
footer{
	background-color : rgba(250, 250, 250, 1);
	text-align: center;
	padding-top: 3%;
	padding-bottom: 2%;
	font-family: courier;
}
@media (max-width: 1024px){
	.responsive .hastage{
		position: static;
		width: auto;
		margin: 0;
		padding: 88px 6% 0;
		transform: none;
		background-color: #f6f3e5;
	}
	.responsive .hastage .font_hastage{
		margin: 0;
		text-align: left;
		font-size: clamp(2rem, 9vw, 3.5rem);
		line-height: 1.1;
		letter-spacing: 0.02em;
		overflow-wrap: anywhere;
	}
	.responsive .quote{
		position: static;
		width: auto;
		padding: 12px 6% 0;
		background-color: #f6f3e5;
	}
	.responsive .quote .marquee{
		width: 100%;
	}
	.responsive .quote .font_quote{
		margin: 0;
		font-size: 100%;
		letter-spacing: 0.18em;
	}
	.responsive .container{
		width: 88%;
		margin-left: 6%;
		margin-right: 6%;
	}
	.responsive .bgBottom{
		height: auto;
		padding: 32px 0 40px;
	}
	.responsive .bgBottom table,
	.responsive .bgBottom tbody{
		display: block;
		width: 100%;
	}
	.responsive .bgBottom tr{
		display: flex;
		flex-wrap: wrap;
		gap: 12px 40px;
	}
	.responsive .bgBottom td{
		display: block;
		padding: 0;
		line-height: 1.3;
	}
}
@media (max-width: 600px){
	.responsive .bgBottom tr{
		flex-direction: column;
		gap: 14px;
	}
	.responsive .bgBottom td{
		padding-left: 16px;
		border-left: 3px solid #b0a594;
	}
}