:root {
    --blue: #1976d2;
    --light-blue: #63a4ff;
    --white: #fff;
    --black: #000;
    --pink: #ff4081;
    --dark-purple: #512da8;
    --light-purple: #9575cd;
    --red: #f44336;
    --secondary-color: #0fcaeb;

    --font-roboto: 'Roboto', sans-serif;

}

body {
    font-family: var(--font-roboto);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-color: #f5f5f5;
}

h2 {
    color: var(--red);
  
}

p {
    color: var(--secondary-color);
}

.hero {
    text-align: center;
    background-image: url(https://draxe.com/wp-content/uploads/2022/12/DrAxeEatingCoconutsHeader.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 0%;
    padding-top: 10%;
    width: 100%;
    height: 250px;
}