html { font-size: 100%; margin: 0; padding: 0;}

body { margin: 0; padding: 0; background-color: #4A3327; background-image: url(/img/img5med\ copy.jpg);}

header {
    background-color:#2e180d;
    display: flex;
height: 3.5rem;
}

h1 {color: white;
font-family:Verdana, Geneva, Tahoma, sans-serif;
font-size: medium;}

p {font-family: Verdana, Geneva, Tahoma, sans-serif;
color: white;
font-size: small;}

div{font-family: "din-condensed", sans-serif;
    font-size: x-large;
    font-weight: 500;
     color: white; margin-left: 1.5rem; margin-top: 1.2rem;}

#logo {margin-left: 1rem;width: 3.5rem; padding-top: 0.5rem;padding-bottom: 0.5rem;}

header div { flex: 3;}

.titlehhh {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

button#menu-button {
    height: 2rem;
    width: 2rem;
    display: block;
    border: none;
    background-image: url(/img/hamburger-svgrepo-com.svg); 
    background-repeat: no-repeat;
    background-size: cover;
}

#menu.show-nav {
    display: block;
    position: absolute;
    z-index: 100;
    top: 0;
    right: 0.5rem;
    height: 17rem;
    background-color: rgb(63 47 40);
    padding: 1rem;
    width: 10rem;
    margin: 0 auto;
    margin-top: 0px;
    border: 1px solid #444;
    margin-top: 0;
}


#menu-button {
    position: absolute;
    right: 0.5rem;
    top: 0.5rem;
    padding: 0;
    background-color: transparent;
    z-index: 10;
}

#menu-button:hover {
    cursor: pointer;
    }

    .hide-text {
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        padding: 0;
    }

    .icon a img {
        width: 2rem;
        height: auto;
    }

    li.icon a {
        display: flex;  /* place logo and span side by side */
        justify-content: start; /* align left */
        align-items: center; /* vertically align */
        
        font-family: arial, helvetica, sans-serif; /* style span text as desired */
        font-weight: bold;
        text-decoration: none;  /* remove underline */
        font-size: 1.5rem;
        margin: 0; 
        height: 1.5rem;
bottom: 8rem;}
    @media only screen and (min-width: 64em) {
        button#menu-button {
            display: none;
        }

        #menu {
            display: flex;
        }
    }

footer {
    background-color: #2e180d;
    
}

.data {
top: 4rem;
size: 2rem;
right: 1rem;
}

.figure {
top: 7rem;
left: 0.4rem;}

li.icon {
    width: 100%;
    height: 1.8rem;
    margin: 1.3rem 0;  /* space apart for easier finger tapping */
  }

  .icon a img {
    width: 2rem;
    height: auto;
}

.contact
{top: 17rem;}




.eras {
    top: 1.3rem;
    left: 0.5rem;
  
}

.home {
    top: 7.4rem;
}

#menu {display: none;}

.concert {
    right:13px ;
margin-bottom: 25px;
margin-top: 25px;}

.hometext {
    margin-top: 25px;
margin-right: 23px;}

.twopac {
left: 13rem;
bottom: 75rem;}

.iftextone {
    margin-top: 15px;
    font-size: x-small;
width: 10rem;}

.twopactext {
    margin-top: 10px;
}

.ifkdottext { margin-top: 15px;
    font-size: x-small;
width: 10rem;}

.kdot {width: 5rem;
    left: 7.5rem;
    bottom: 56rem;}

    .kdotcred {left: 14rem;
    font-size: xx-small;
bottom: 62rem;}

.kdottitle {margin-top: 15px;}

.copyright {font-size: small;
left: 65px;}


.cartititle {
    margin-top: 15px;
}

.cartitext {margin-top: 15px;
    font-size: x-small;
width: 10rem;}

.cartiimg {
    width: 5rem;
    left:3.2rem;
    bottom: 24rem;
}

.carticred {
    font-size: 6px;
bottom: 23.3rem;
right: 1.4rem;}

.erastitleone {
    margin-top: 15px;
margin-bottom: 15px;}

.erastextone {
    font-size: x-small;
margin-right: 23px;}

.erastitletwo {
    margin-top: 15px;
}

.erastexttwo {
    font-size: x-small;
margin-right: 23px;
margin-top: 15px;}

.erastitlethree {
    margin-top: 15px;
}

.erastextthree {
    font-size: x-small;
    margin-right: 23px;
    margin-top: 15px;
}

.erastitlefour {
    margin-top: 15px;
margin-bottom: 15px;}

.erastextfour {font-size: x-small;
margin-right: 23px;
margin-bottom: 15px;}

.sourceseras {
   margin-top: 15px; 
   font-size: 7px;
    margin-right: 23px;
margin-bottom: 15px;}

.datatext {margin-top: 15px;
font-size: small;
margin-right: 23px;}

.graph {
    width: 15rem;
    margin-top: 15px;
left: 1rem;
margin-bottom: 15px;}

.contacttitle {
    margin-bottom: 15px;
}

.contactbutton {
    margin-bottom: 15px;
}

form {
    background-color: #2e180d;
margin-right: 1rem;
margin-bottom: 15px;
padding: 5px;}