@import url('https://fonts.googleapis.com/css2?family=Lemon&display=swap');
*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}
.logo
{
    height: 14vh;
    width: 100%;
    position: fixed;
    top: 0;
}
.logo h1
{
    color: white;
    font-size: 1.4rem;
    display: inline;
    margin-left: 12.7rem;
    font-family: 'Playfair Display', serif;
}
.main 
{
    display: flex;
}
.main .left 
{
    background-color: #2c1e1e;
    align-items: center;
    padding-left: 3rem;
}
.main .right
{
    background-color: #7c573c;
    justify-content: center;
}
.main .main_split 
{
    width: 50%;
    min-height: 100vh;
    display: flex;
    align-items: center;
}
.left .content 
{
    color: white;
}
.content h1 
{
    font-size: 5rem;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: .04rem white;
    letter-spacing: .2rem;
    font-family: 'Lemon', serif;
}
.content p 
{
    color: rgba(255, 255, 255, 0.37);
    font-size: 1.1rem;
    width: 90%;
    margin: 1rem 0;
    line-height: 1.5rem;
}
.content button 
{
    background: #5a4740;
    padding: 0.6rem 1rem;
    border: .2rem solid rgba(255, 255, 255, 0.286);
    font-size: 1rem;
    color: white;
    border-radius: 4rem;
}
.content button a 
{
    color: white;
    text-decoration: none;
}
.content button:hover
{
    background: rgba(255, 255, 255, 0.264);
}
.right img 
{
    height: 68%;
    width: 50%;
    padding-left: 2rem;
}
.middle
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.middle .circle 
{
    width: 9rem;
    height: 9rem;
    background-color: white;
    border-radius: 8rem;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}
.middle .circle:nth-child(1)
{
    background-size: 350%;
}
.middle .circle:nth-child(2)
{
    margin: 2rem 0;
    background-size: 180%;
}
.middle .circle:nth-child(3)
{
    background-size: 350%;
}
.middle .circle::before
{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 8rem;
    border: .25rem dotted white;
    padding: .15rem;
}