:root
{
    --primary:#6eaadd;
    --secondary:#1d1c51;
    --tertiary:#005234;
    --links:#f4f3e7;
}

body{font-size:0.85rem}
p{font-weight:400;font-size:.9rem;line-height:1.5rem;padding-left:1rem;}

.logo{width:150px;}
.hero{width:100%;}
.flyer{height:30rem}
.band{width:100%;padding:5px 0 0 1rem;}

h3{padding:10px 0 0 1rem;color:var(--primary);}
h4{padding:5px 0 0 1rem;color:var(--secondary);}
h5{padding:5px 0 0 1rem;color:var(--secondary);}
h6{padding:5px 0 0 1rem;color:var(--tertiary);}
b{font-size:.9rem;padding-left:1rem;}
.emphas{font-size:.9rem;font-weight:700;}
a:hover{color:var(--tertiary);}

.paypal{
    padding:.3rem;
    margin-left:-.1rem;
    border-radius:.3rem;
    border:1px solid var(--secondary);
    background-color: yellow;
}



/*nav*/
nav{padding:2rem 0 0 0;}
nav ul{list-style-type:none;padding:0;}

nav a {text-decoration:none;text-align:left;display:block;padding-top:5px;}
nav a:hover{color:red;}

ul{list-style-type: square;color:var(--primary);}
li{line-height:1.5rem;color:var(--primary);}
li a{text-decoration:none;text-align:left;color:var(--primary);}
li a:hover{color:var(--tertiary);}

@media screen and (max-width:768px) {
    body{font-size:.75rem;}
    h3{font-size:.9rem;}
    h4{font-size:.85rem;}
    h5{font-size:.8rem;}
    .logo{width:100px;}
    .flyer{width:100%;height:auto;}
    nav{padding-left:2rem;margin-top:-4rem;}
}

@media screen and (min-width:768px)
{
    nav ul {display:flex;}
    /*nav li{width:10rem;border-right:1px solid black;text-align:center;padding-left:.4rem}*/
    nav li{flex:1 1 0;}
}