@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500&family=Quicksand:wght@400;500&display=swap');

body{
    background:#fcfcfd;
    background-image:url("background.png");
    background-size:cover;
    background-attachment:fixed;

    color:#666;
    font-family:'Quicksand',sans-serif;

    margin:0;
}


#container{
    width:1100px;
    margin:auto;
    padding-top:40px;
}


#header{
    height:400px;
    margin-bottom:30px;

    display:flex;
    justify-content:center;
    align-items:center;
}


#focal{
    width:700px;
    height:350px;

    border-radius:25px;

    background:rgba(255,255,255,.6);

    border:1px solid #c6b7e5;

    backdrop-filter:blur(6px);

    display:flex;
    justify-content:center;
    align-items:center;

    color:#8a73b4;

    font-family:'Cormorant Garamond',serif;
    font-size:40px;

    box-shadow:
    0 0 20px rgba(191,174,220,.25);
}


#content{
    display:flex;
    gap:25px;
}


#sidebar{
    width:250px;

    display:flex;
    flex-direction:column;
    gap:20px;
}


#main{
    width:825px;
}


iframe{
    width:100%;
    border:none;

    background:white;

    border-radius:20px;

    box-shadow:
    0 0 12px rgba(0,0,0,.06);
}


#sidebar iframe{
    height:180px;
}


#main iframe{
    height:700px;
}


footer{
    margin-top:25px;

    text-align:center;

    color:#8a73b4;

    font-family:'Cormorant Garamond',serif;
}