@font-face {
	font-family: Fraunces;
	src: url(fonts/Fraunces-ExtraLightItalic.ttf);
}

@font-face {
	font-family: InterLight;
	src: url(fonts/Inter-Light.ttf);
}

@font-face {
	font-family: IBMPlexSerifExtraLightItalic;
	src: url(fonts/IBMPlexSerif-ExtraLightItalic.ttf);
}


.one {
    position: absolute;
    font-family: Fraunces;
    font-size: 100px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:10px;
    left: 50%;
    transform: translate(-50%);
    margin:-20px;
    /*position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:10px;
    left: 50%;
    transform: translate(-50%);
    margin:0;*/
}
.two {
    position: absolute;
    font-family: Fraunces;
    font-size: 95px;
    /*font-size: 60px;*/
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:65px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color: #262626;
}
/*+55*/
.three {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:120px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color: #484848;
}
.four {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:175px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color:#646464;
}
.five {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:230px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color: #8C8C8C ;
}
.six {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:285px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color:#B5B5B5 ;
}
.seven {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:340px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color:#CCCCCC ;
}
.eight {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:395px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color: #E2E2E2;
}
.nine {
    position: absolute;
    font-family: Fraunces;
    font-size: 60px;
    text-align: center;
    letter-spacing: -0.07em;
    padding-top:450px;
    left: 50%;
    transform: translate(-50%);
    margin:0;
    color: #F2F2F2;
}
.proposal{
    position: absolute;
    left: 60%;
    padding-top: 35px;
    width:403.5px;
    height: 564.5px;
}

.info {
    position: absolute;
    font-family: InterLight;
    left: 53%;
    margin-top: 800px;
    padding:0;
    transform: rotate(-90deg);
}
.info:hover {
    animation: spin 1s;
    animation-fill-mode:forwards;
}
@keyframes spin {
    from {transform:rotate(-90deg);}
    to {transform:rotate(0deg);}
}
.blur{
    position: absolute;
    left: 50%;
    margin-top: 600px;
}

.vague {
    position: absolute;
    width: 1404px;
    height: 1435px;
    top: 50%;
    left: 50%; 
    transform: translate(-50%, -50%);
    margin-top: 340px;

}
.information {
    position: absolute;
    font-family: InterLight;
    font-weight: 300;
    font-size: 27px;
    line-height: 106.3%;
    letter-spacing: -0.05em;
    text-align: center;
    top: 50%;
    left: 50%; 
    transform: translate(-50%, -50%);
    margin-top: 1200px;
    margin-left: 40px;
    margin-right: 40px;
    max-width:700px;
    min-width: 500px;
}

.link {	
    position: absolute;
    font-family: IBMPlexSerifExtraLightItalic;
    font-weight: 200;
    font-size: 20px;
    line-height: 100.3%;
    letter-spacing: -0.07em;
    text-decoration-line: underline;
    color: #0000EE;

    top: 50%;
    left: 50%; 
    transform: translate(-50%, -50%);
    margin-top: 1300px;
}

.rect {
    position: absolute;
    width: 500px;
    height: 500px;
    top: 173%;

}

.past {
    position: fixed;
    width: 109.62px;
    height: 57.78px;
    right: 2%;
    top: 48%;
    z-index: 5;
}
.past:hover {
    animation: spin 1s;
}
    @keyframes spin {
        from {transform:rotate(0deg);}
        to {transform:rotate(360deg);}
    }
.blurbig {
    position: absolute;
    top: 50%;
    left: 50%; 
    transform: translate(-50%, -50%);
    margin-top: 1200px;
    margin-left: 40px;
    margin-right: 40px;

}