* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
:root{
    --background:#8aa0a4 ;
    --accent:#8F5601 ;
    --light: #b4c4e0;
    --dark:#302d43 ;
    --highlight: #b3b3b3;
}
body{
    background:var(--background);
}
.hero {
    position:relative;
    min-height:40vh;
    overflow:hidden;
    display:grid;
    place-items:center;
}
.hero-video video{
    position:absolute;
    inset:0;
    width: 100%;
    height: 100%;
    object-fit:cover;
    object-position: center;
}
.hero-text {
    position: relative;
    color: var(--light);
    text-align: center;
    z-index:1;
    text-shadow: 0 2px 8px;
    margin-top:150px;
    margin-bottom:40px;
    h1{
       font-size: 80px;
       font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    }

}
.hero-video video{
    width:100%;
    height:100%;
    object-fit:cover;
}
.main {
    margin-top: 10px;
    max-width: 1100px;
    margin: 30px auto 0;
}
.main h2 {
    margin-bottom: 10px;
    background: var(--dark);
    padding: 20px;
    border-radius: 100px;
    margin-top: 20px;
    margin-bottom: 10px;
    text-align: center;
    color: var(--light);
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.ratio-16x9{
    width: min(1100px, 100%);
    aspect-ratio: 16/9;
    margin: 30px auto;
    border: 4px solid var(--dark);
    border-radius:100px;

}
.ratio-16x9 iframe{
    width:100%;
    height:100%;
    border:0;
    border-radius:100px;
}
footer{
    text-align:center;
    font-size:20px;
    margin-bottom:20px;
}
