html,
body {
    margin: 0;
    padding: 0;
}

.header {
    width: 100%;
    height: 60px;
    background: #81baff;

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

    position: relative;
}

.headerlogo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%)
}

.headerlogo img {
    display: block;
    height: 45px;
    width: auto;
}

.headernav {
    margin-left: auto;
    margin-right: 40px;

    display: flex;
    gap: 30px;
}

.headernav a {
    color: white;
    text-decoration: none;
}

.heroimg img{
    display: block;
    width: 100%;
    hight: auto;
}