* {
	margin: 0;
	}

html {
	scroll-behavior: smooth;
}

body { 
	background-color: #212737; 
}

p {
	margin: 0;
	display: inline-block;
}

nav ul {
	display: flex;
	list-style: none;
}

img {
	object-fit: cover;
}

nav a {
	display: inline-block;
	list-style: none;
	text-decoration: none;
}

#box {
	z-index: -1;
}

.link {
	color: #ECC8C9;
}

.img1 {
	position: absolute;
	width: 586px;
	height: 554px;
	left: 1134px;
	top: 271px;
	
	background: url(poster.jpg);
}

.title {
	position: absolute;
	width: 132px;
	height: 38px;
	left: 1004px;
	top: 139px;
	
	font-family: Abril Fatface;
	font-style: normal;
	font-weight: normal;
	font-size: 36px;
	line-height: 49px;
	text-align: center;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	
	color: #FFFFFF;
	z-index: 1;
}

.home1 { 
	transform-origin: 0 0;
	position: fixed;
	width: 67px;
	height: 26px;
	left: 66px;
	top: 193px;
	
	font-family: Open Sans;
	font-style: normal;
	font-weight: 300;
	font-size: 24px;
	line-height: 33px;
	text-align: right;
	
	color: #FFFFFF;
	
	transform: rotate(-90deg);
}

.baa1 { 
    position: fixed;
    width: 172px;
    height: 26px;
    left: 66px;
    top: 493px;
    
    font-family: Open Sans;
    font-style: normal;
    font-weight: 300;
    font-size: 24px;
    line-height: 33px;
    
    color: #FFFFFF;
    
    transform-origin: 0 0;
    transform: rotate(-90deg);
    z-index: 0;
}
.about1 { 
	transform-origin: 0 0;
    position: fixed;
    width: 73px;
    height: 26px;
    left: 66px;
    top: 691px;
    
    font-family: Open Sans;
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 33px;
    text-align: right;
    
    color: #FFFFFF;
    
    transform: rotate(-90deg);
}

.vertical-line { 
	transform-origin: 0 0;
    position: absolute;
    width: 1080px;
    height: 0px;
    left: 150px;
    top: 1080px;
    
    border: 1px solid #FFFFFF;
    transform: rotate(-90deg);
}

.rect-grp1 { 
	opacity:1;
	width:28.284271240234375px;
	height:522.2842407226562px;
	position:fixed;
	left:170px;
	top:146px;
	z-index: 1;
}

#rect1 { 
	transform-origin: 0 0;
	transform: rotate(-45deg);
	opacity:1;
	border:1px solid rgba(255, 255, 255, 1);
	width:20px;
	height:20px;
	position:absolute;
	left:0px;
	top:14.142135620117188px;
}

#rect2 {
	transform-origin: 0 0;
	position: absolute;
	width: 20px;
	height: 20px;
	left: 1px;
	top: 136.1421356201172px;
	
	z-index: 1;
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
}

#scrollMarker { 
	transform-origin: 0 0;
	transform: rotate(-45deg);
	background-color:#ECC8C9;
	opacity:1;
	width:20px;
	height:20px;
	left:1px;
	top:508.1421203613281px;
	position:relative;
	transition: top 1s;
}

#rect3 { 
	position: absolute;
	width: 20px;
	height: 20px;
	left: 1px;
	top: 186.1421356201172px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
	transform-origin: 0 0;
}

#rect4 { 
	position: absolute;
	width: 20px;
	height: 20px;
	left:1px;
	top:236.1421356201172px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
	transform-origin: 0 0;
}

#rect5 { 
	position: absolute;
	width: 20px;
	height: 20px;
	left:1px;
	top:286.1421203613281px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
	transform-origin: 0 0;
}

#rect6 { 
	transform-origin: 0 0;
	position: absolute;
	width: 20px;
	height: 20px;
	left:0px;
	top:336.1421203613281px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
}

#rect7 { 
	position: absolute;
	width: 20px;
	height: 20px;
	left:1px;
	top:386.2842102050781px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
	transform-origin: 0 0;
}

#rect8 { 
	position: absolute;
	width:20px;
	height:20px;
	left:1px;
	top:508.1421203613281px;
	
	border: 1px solid #FFFFFF;
	box-sizing: border-box;
	transform: rotate(-45deg);
	transform-origin: 0 0;
}

.line1 { 
	transform-origin: 0 0;
	transform: rotate(90.00000250447788deg);
	opacity:1;
	border:1px solid rgba(255, 255, 255, 1);
	width:50px;
	height:0px;
	position:absolute;
	left:17px;
	top:50.00004577636719px;
}

.line2 { 
	transform-origin: 0 0;
	transform: rotate(90.00000250447788deg);
	opacity:1;
	border:1px solid rgba(255, 255, 255, 1);
	width:50px;
	height:0px;
	position:absolute;
	left:17px;
	top:422.1421203613281px;
}

.body-text {
	position: absolute;
	width: 586px;
	height: 554px;
	left: 398px;
	top: 271px;
	
	font-family: Open Sans;
	font-style: normal;
	font-weight: 300;
	font-size: 24px;
	line-height: 33px;
	text-align: justify;
	
	color: #FFFFFF;
	
}

#box {
    position: absolute;
    width: 1622px;
    height: 795px;
    left: 248px;
    top: 150px;
    
    border: 4px solid #FFFFFF;
    box-sizing: border-box;
}

#circle {
    position: absolute;
    width: 150px;
    height: 150px;
    left: 983px;
    top: 75px;
    
    background: #ECC8C9;
	border-radius: 50%;
	border: 14px solid #212737;
}

.half-circle {
	position: absolute;
	width: 184px;
	height: 105px;
	left: 980px;
	top: 150px;
	transform: rotate(180deg);
	
	box-sizing: border-box;
	border-top-left-radius: 100px;
	border-top-right-radius: 100px;
	border: 4px solid white;
	border-bottom: 0;
}