:root {
    --orange: #F28E1C;
    --blue: #3DA2DF;
    --green: #64974f;
    --melon: #FFD2C1;
    --darkmelon: #CD5124;
}

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

body{
    font-family: 'lato', sans-serif !important;
}

.lato-alt{
    font-family: 'lato' !important;
}

/* Backgrounds */
.bg-orange {
    background-color: var(--orange);
}

.bg-blue {
    background-color: var(--blue);
}

.bg-green {
    background-color: var(--green);
}

.bg-melon {
    background-color: var(--melon);
}

.bg-darkmelon {
    background-color: var(--darkmelon);
}

/* Text colors */
.text-orange {
    color: var(--orange);
}

.text-blue {
    color: var(--blue);
}

.text-green {
    color: var(--green);
}

.text-melon {
    color: var(--melon);
}

.text-darkmelon {
    color: var(--darkmelon);
}

/* Borders */
.border-orange {
    border-color: var(--orange);
}

.border-blue {
    border-color: var(--blue);
}

.border-green {
    border-color: var(--green);
}

.border-melon {
    border-color: var(--melon);
}

.border-darkmelon {
    border-color: var(--darkmelon);
}

#harry {
    object-position:0 5%;
}