menusectionthree/* Desktop
Fonts//

Colors//

font-family: "source-code-pro", monospace;
font-weight: 400;
font-style: normal;

Yellow = #F9ED32
Magenta = #FF0065
Cyan = #00FFFF
Black = #000
White = #FFF
*/

*{
    text-decoration: none; box-sizing: border-box;}
body {
    margin: 0;
    padding: 0;
    background-color: #000000; font-size: 100%;
}
img {max-width: 100%;}

@font-face {
    font-family: 'cyberthic';
    src: url(fonts/cyberthic.otf);
    font-style: normal;
    font-weight: 100;
}

@font-face {
    font-family: 'barmo';
    src: url(fonts/barmo.otf);
    font-style: normal;
    font-weight: 100;
}

a {text-decoration: none;}

/*menu styles */



.menusectionthree {

    width:95%;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    background-image: url(images/Background_Pattern1.png);
    background-attachment: fixed;

    text-align: center;

    margin: auto;

}

.menusectionthree h2 {padding-bottom: 50px;}

.menusectionthree .three img {width: 90%;}

.menusectionthree h2 {

    width: 95%;
    height: 100%;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 50px;
    color:#fff01c;

}

.menusectionthree h5 {

    width: 95%;
    height: 100%;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 70px;
    color:#fff01c;

}

.menumiddle5 .menuleftmiddle .menuthree p {

    color: white;
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;

    text-align: left;

    padding-top: 20px;


}

.menuthree {

    width: 30%;
    padding-bottom: 10px;

    line-height: 30px;;

    align-items: center;
}

.menumiddle5 h3 {
    font-family: 'barmo'; 
    font-weight: 400;
    font-size: 45px;
    line-height: 50px;
    color: #ffffff;
    text-align: left;
}

.menuleftmiddle p {text-align: left;}

.menumiddle5 h4 {
    font-family: 'barmo'; 
    font-weight: 400;
    font-size: 25px;
    line-height: 50px;
    color: #ffffff;
    text-align: left;
}

.menuhero {
    width: 100%;
  height: 100%;
  background-image: url(images/MenuHero.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.menuhero h1 {
    font-size: 30px;
    color: white;
    font-weight: 100;
    font-size: 75px ;
    height: 200px;
    display: flex;
    text-align: right;


    height: 100px;

    text-align: center;
    
}

.menuright {
    
    width:45%;
    max-width: 500px;
    
    margin-top: 60px;
    margin-bottom: 50px;

    text-align: center;
    justify-content: space-around;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.menuright h1 {text-align: center;}

.menuheadtext {
    
    font-family: "source-code-pro", monospace;
    font-weight: 550;
    font-style: normal;
    font-size: 18px;
    line-height: normal;
    color: #ffffff;
}

.menuleftmiddle { 
    width: 100%;
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    justify-content: center;
}

.tabset {margin: auto;}

.menumiddle5 .rightmiddle img {padding-right: 0%;}

.menumiddle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.menumiddle5 h2 {
    font-family: 'barmo';
    font-size: 80px;
    text-align: center;
    color: #F9ED32;
    padding-bottom: 40px;
    padding-top: 30px;
}

.menumiddle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
}

.menumiddle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    color: #ffffff;
    padding-bottom: 75px;
}

/*-----------------about page styles------------------*/

.middle8 .leftmiddle1 {width: 55%;}

.middle8 {
    width:100%;
    height:100%;
    background-image: url(images/BackgroundMiddle1.png);
    background-size: contain;
    background-attachment: fixed;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    color: #ffffff;

    padding-top: 100px;
}

.imgmiddle2 {padding-bottom: 20px;}

.middle8 .leftmiddle1 {padding-top: 200px; padding-left: 20px;}

.middle8 h2 {
    font-family: 'barmo';
    font-size: 50px;

    color: #F9ED32;

    padding-bottom: 75px;
}

.middle8 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    padding-bottom: 75px;
}

.abouthero {
    width: 100%;
  height: 100%;
  background-image: url(images/AboutHeroAbout.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.abouthero h1 {
    font-size: 30px;
    color: white;
    font-weight: 100;
    font-size: 75px ;
    height: 200px;
    display: flex;
    text-align: right;


    height: 100px;

    text-align: center;
    
}




/*-----------------------contact page styles-------------------------------------------- */

.contactleftmiddle h3 {
    font-family: 'barmo';
    font-size: 40px;
    padding-bottom: 30px;
    color: #F9ED32;
}


.contactmiddle2 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    padding-bottom: 75px;
}

.contactmiddle2 {
    width:100%;
    height:100%;
    background-image: url(images/Background_Pattern2.png);
    background-size: contain;
    background-attachment: fixed;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    color: #ffffff;

    padding-top: 10px;

    padding-bottom: 100px;
}

.contactleftmiddle {
    height: 700px;
    padding-top: 100px;
    width: 80%;
}

.contactleftmiddle1 {
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
    padding-top: 100px;
    margin: auto;
    padding: 50px;
    height: 100%;
}

.maps {
    justify-content: center;
    height: 600px;
    width: 90%;
    padding-top: 100px;
    margin: auto;
    padding:10px;
}

.contacthero {
    width: 100%;
  height: 100%;
  background-image: url(images/ContactHeroContact.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.contacthero h1 {
    font-size: 30px;
    color: white;
    font-weight: 100;
    font-size: 65px ;
    height: 200px;
    display: flex;
    text-align: right;


    height: 100px;

    text-align: center;
    
}

.contactleftmiddle { 
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    justify-content: center;
    text-align: center;
}

.contactmiddle5 .rightmiddle img {padding-right: 0%;}

.contactmiddle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    padding-bottom: 30px;

}

.contactleftmiddle h2 {
    font-family: 'barmo';
    font-size: 80px;
    text-align: center;
    color: #F9ED32;
    padding-bottom: 60px;
}

.contactmiddle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
}

/*---events page---*/

.eventsleftmiddle {
    
    justify-content: center;
    width: 80%;
    border-width:10px;
    border-style:solid;
    border-color: #00FFFF;
}

.calendar {justify-content: center; width: 100%;}

.eventhero {
    width: 100%;
  height: 100%;
  background-image: url(images/EventsHeroEvents.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.eventhero h1 {
    font-size: 30px;
    color: white;
    font-weight: 100;
    font-size: 65px ;
    height: 200px;
    display: flex;
    text-align: right;


    height: 100px;

    text-align: center;
    
}

/*-----------------------homepage styles-------------------------------------------- */

.logocta {
    
    height: 100px;
    width: 400px;
    text-align: center;
    align-items: center;

}

header {
    width:100%;
    height: 150px;
    background-color: #000000;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
  }
  
nav .logo {
    width: 290px;
    float: left;
  }

nav ul{
    float: right;
    background-image: url(images/Navbar2.png);
    padding-top: 27px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 40px;
    margin-top: 35px;
    background-repeat: no-repeat;
    background-size:contain;
}

nav li{
    display: inline-block;
    list-style:none;
}

nav li a{
    padding: 0px 30px;
    text-decoration: none;
}

  
nav {
width: 95%;
  display: flex;
  float: right;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  font-family: 'cyberthic';
  font-weight: 400;
  font-style: normal;
  }
  
  nav a:hover {
    color: #00FFFF;
    font-weight: 100;
  }

nav a {
    max-width: 175px;
    font-size: 25px;
 color: #F9ED32;
 text-transform: uppercase;
 font-family: 'cyberthic';
font-weight: 100;
font-style: normal;
}

a .cta {color:#000000}

.border1 {
    background-image: url(images/NavBorder.png);
    width: 100%;
  height: 105px;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;
     float: top;
     clear: top;
 flex-direction: row;
    flex-wrap: wrap;
   
}

.border2 {
    background-image: url(images/Hero\ Border.png);
    width: 100%;
  height: 105px;
  min-width: 50px;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;
     float: bottom;
     clear: bottom;

 flex-direction: row;
    flex-wrap: wrap;
    padding-left: 800px;
}


.hero {
    width: 100%;
  height: 950px;
  background-image: url(images/Hero\ Image\ Desktop.png);

  line-height: 75px;

  background-size: cover;
background-position: center;
background-attachment:fixed;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;

}

.hero h1 {
    font-size: 30px;
    color: white;
    font-weight: 100;
    font-size: 65px ;
    width: 500px;
    height: 200px;
    float: right;
    display: flex;
    text-align: right;
}



.leftmiddle .cta1 :hover {

    background-image: url(images/CTAhover.png);
    color: #000000;

}

.right .cta :hover {

    background-image: url(images/CTAhover.png);
    color: #000000;

}

.cta2 :hover {

    background-image: url(images/CTAhover.png);
    color: #000000;

}

.cta {

    background-image: url(images/CTA1.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    line-height: normal;

    display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 40px;
    color: #000000;
    
    height: 100px;
    width: 400px;
    text-align: center;
    align-items: center;

    float: right;
    display: flex;
}
 

.left {width:50%}

.right {
    
    width:45%;
    max-width: 500px;
    
    margin-top: 200px;
    margin-bottom: 215px;
}
    

.MiddleEndBorder {
    background-image: url(images/MiddleBottomBorder.png);
    width: 100%;
  height: 200px;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;

 flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 100px;
}

.MiddleEndBorder2 {
    background-image: url(images/MiddleEndBorder2.png);
    width: 100%;
  height: 200px;
     background-position: top;
     background-size: cover;
     background-repeat: repeat;

 flex-direction: row;
    flex-wrap: wrap;
}

.NearEndBorder {
    background-image: url(images/NearBottomBorder.png);
    width: 100%;
  height: 100px;
     background-position: top;
     background-size: contain;
     background-repeat: repeat;

     padding-top: 50px;

}

/* Middle Section */

.middle2 {
    width:100%;
    height:100%;
    background-image: url(images/Background_Pattern2.png);
    background-size: contain;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    color: #ffffff;

    padding-top: 100px;

    padding-bottom: 100px;
}

.leftmiddle1 {
    width: 60%;
    max-width: 1200px;
    height: 100%;
    padding-top: 100px;
}

.leftmiddle1 img {width: 90%;}

.imgmiddle2 {padding-bottom: 20px;}

.middle2 .leftmiddle {padding-right: 30px;}


.middle2 h2 {
    font-family: 'barmo';
    font-size: 50px;

    color: #F9ED32;

    padding-bottom: 75px;
}

.middle2 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    padding-bottom: 75px;
}

.middle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    padding-bottom: 75px;
}

.middle2 .rightmiddle {
    
    width: 60%;
    height: 700px;
    align-items: center;
    padding-top: 100px;
    padding-right: 0px;
    }

.middle2 .rightmiddle img {padding-right: 0%;}

.middle5 .rightmiddle img {padding-right: 0%;}

.middle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    padding-bottom: 50px;
}

.middle5 h2 {
    font-family: 'barmo';
    font-size: 50px;
}

.middle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
}

.leftmiddle {

    width: 600px;
    padding-top: 100px;

}

.rightmiddle {

    width: 50%;
    height: 100%;
    align-items: center;
    padding-top: 100px;
    text-align: center;
    
}

.cta1 {

    background-image: url(images/middleCTA.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    line-height: normal;

    display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 40px;
    color:#fff01c;
    
    height: 100px;
    width: 400px;
    text-align: center;
    align-items: center;

    display: flex;
}


/* Section 3 Food and Drink
*/

.sectionfour {

    width:100%;
    height:100%;

    padding-bottom: 100px;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    align-items: center;

}

.sectionfour .three {

    width: 42%;
    padding-bottom: 50px;
    height: 300px;

}

.sectionthree {

    width:100%;
    height:40%;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    background-image: url(images/Background_Pattern1.png);

    text-align: center;

}

.sectionthree h2 {padding-bottom: 50px;}

.sectionthree .three img {width: 90%;}

.sectionthree h2 {

    width: 95%;
    height: 100%;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 50px;
    color:#fff01c;

}

.three p {

    color: white;
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    text-align: center;

    padding-top: 20px;


}

.three2 {display: inline-block;}

.three {

    width: 30%;
    padding-bottom: 10px;

    line-height: 30px;;

    align-items: center;
}

.three .cta2 {align-items: center;}

.three .cta2 {

   border: 20px;

}
   
.three1 {

    width: 27%;
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;

flex-direction: row;
   flex-wrap: wrap;
}

.cta2 {
    background-image: url(images/CTA1.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    line-height: normal;

    display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 40px;
    color:#000000;
    
    height: 100px;
    width: 400px;
    text-align: center;
    align-items: center;

    display: flex;}

.rightmiddle img {

    align-items: center;
}



.imgmid {display: none;}

.MobileMid {display: none;}

footer {

background-color: #F9ED32;
width:100%;
    height:500px;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

}

footer .three {
    
    height: 30%;

    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    color: #000000;

    padding-top: 50px;
}

footer h3 {

    font-family: 'barmo';
    font-size: 30px;

    text-align: center;

}

footer .three p {

    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;

    color: #000000;
}






.EndBorder {
    background-image: url(images/Footer\ Border.png);
    width: 100%;
  height: 100px;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;

 flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: -25px;

    margin-top: 100px;
}

.three .dis {font-size: 10px;}



.FooterButton {

    padding-top: 20px;

    height: 100px;
    width: 100%;

    max-width: 450px;

    text-align: center;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    margin: auto;

}

.facebook {
    background-image: url(images/facebook.png);
    background-size: contain;

    height: 45px;
    width: 45px;

    
    background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        text-align: center;
        align-items: center;

        display: flex;
}

.facebook :hover {

    background-image: url(images/facebookhover.png);
}

.instagram :hover {

    background-image: url(images/instagramhover.png);
}

.discord :hover {

    background-image: url(images/discordhover.png);
}

.twitter :hover {

    background-image: url(images/twitterhover.png);
}

.instagram {
    background-image: url(images/instagram.png);
    background-size: contain;

    height: 45px;
    width: 45px;
    
    background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        text-align: center;
        align-items: center;
    
        display: flex;

}

.discord {
    background-image: url(images/discord.png);
    background-size: contain;

    height: 45px;
    width: 45px;

    background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;
}

.twitter {
    background-image: url(images/twitter.png);
    background-size: contain;

    height: 45px;
    width: 45px;

    background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        text-align: center;
        align-items: center;
    
        display: flex;
}



/* Nav Tab and Phone 
v v v v v v v v v v v
*/

@media screen and (min-width: 900px) and (max-width: 1450px){




    .leftmiddle h2 {font-size: 38px;}

    .leftmiddle p {font-size: 18px;}

    .leftmiddle {
        width: 500px;
    }


    .sectionthree h2 {font-size: 38px;}


}

@media screen and (min-width: 900px) and (max-width: 1050px){



    .leftmiddle h2 {font-size: 34px;}

    .leftmiddle p {font-size: 16px;}

    .leftmiddle {
        width: 400px;
    }

    .middle5 {height: 800px;}

    .sectionthree h2 {font-size: 34px;}

    footer .three p {font-size: 14px;}


}

@media screen and (min-width: 700px) and (max-width: 1050px){

    nav ul {display: none;}

    .three p {font-size: 16px;
    }


}


/* Tablet
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (min-width: 551px) and (max-width: 900px)
{
    body {background-color: rgb(0, 0, 0);}
    
    .hero{
        height: 600px;
        font-size: 40px;
        line-height: 45px;
        background-image: url(images/HeroTab.png);

      }

      nav ul {display: none;}

     

    .right h1 {
        font-size: 40px;
        width: 300px;
        height: 100px;
    }

    .right {
        height: 30px;
        max-width: 300px;
       max-width: none;
       margin-top: 0px;
       padding-right: 30px;
       padding-bottom: 105px;
       padding-top: 125px

    }

    .EndBorder {
        background-image: url(images/Footer\ Border.png);
        width: 100%;
      height: 100px;
         background-position: top;
         background-size: cover;
         background-repeat: no-repeat;
    
     flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: -25px;
    
        margin-top: 50px;
    }

    .cta {

        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        height: 50px;
        width: 200px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;

        
    }

    .border2 { 
        width: 100%;
        height: 50px;
        min-width: 10px;
           background-position: top;
           background-size: cover;
           background-repeat: no-repeat;
           float: bottom;
           clear: bottom;
      
       flex-direction: row;
          flex-wrap: wrap;
          padding-left: 0px;
    }


    .three p {font-size: 14px;}

    .sectionthree h2 {
        
        font-size: 34px;
        text-align: center;
        padding-left: 0px;

    }

    .sectionthree p {font-size: 12px;}

    .cta2 {
        background-image: url(images/CTA1.png);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        height: 50px;
        width: 200px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;
    
    }

    .NearEndBorder {margin-top: 50px; background-repeat: no-repeat;}

    .middle2 p {width: 90%;}


 /* END OF HEAD
–––––––––––––––– */

.middle5 {
    width:100%;
    height:1100px;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.middle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    padding-bottom: 100px;
}

.middle5 h2 {
    font-family: 'barmo';
    font-size: 35px;
}

.middle5 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
}

.middle5 h2 {
    font-family: 'barmo';
    font-size: 35px;
    padding-top: 20px;
}


.leftmiddle {

    width: 90%;
    height: 100%;
    padding-top: 75px;

}

.cta1 {

    background-image: url(images/middleCTA.png);
    background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #fff01c;
        
        height: 50px;
        width: 215px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;
}

.middle5 p {
    height: 100px;
}

.leftmiddle {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;}

.imgmid {
    
    display: block;
    width: 100%;
    align-items: center;
    margin-left: 20px;
 

}

.rightmiddle {display: none;}

.MiddleEndBorder {
    background-image: url(images/MiddleBottomBorder.png);
    width: 100%;
  height: 200px;
     background-position: top;
     background-size: cover;
     background-repeat: no-repeat;

 flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 25px;
}

.NearEndBorder {height: 100%; background-repeat: repeat; padding-top: 50px;}

.sectionfour {
    height: 100px;
    margin-bottom: 0px;
    padding-bottom: 30px;
}
footer {height:100%}

.sectionthree {height: 100%;}

footer .three {height: 50%; width: 90%; margin:auto; padding-top:20px; padding-bottom:10px;}

.middle2 .leftmiddle .imgmid {display: none;}

.leftmiddle p {font-size: 14px;}

.leftmiddle h2 {font-size: 32px;}

.leftmiddle1 {width: 80%;}

footer img {
    width: 80%; 
}

footer .three {text-align: center; justify-content: center; margin: auto; height: 80%;}

footer .three p { font-size: 16px;}

.three .dis {font-size: 10px;}

.middle2 {padding-top: 10px; padding-bottom: 50px;}

.FooterButton {width: 75%; margin: auto;}

.middle2 .leftmiddle1 {justify-content: center; text-align: center; margin: auto; padding-top:50px;}

footer .three .three3 {height: 100%;}

/* Menu Page */

.menumiddle5 h2 {
    font-family: 'barmo';
    font-size: 65px;

    text-align: center;
}

.menumiddle5 .menuleftmiddle .menuthree p {

    color: white;
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;

    text-align: left;

    padding-top: 20px;


}

.menumiddle5 .menuleftmiddle .menuthree {height: 100%;}

.menumiddle5 h3 {
    font-family: 'barmo'; 
    font-weight: 400;
    font-size: 25px;
    line-height: 50px;
    color: #ffffff;
    text-align: left;
}

.menumiddle5 h4 {font-size: 14px; font-weight: 300;}

/*--contact--*/

.contactleftmiddle h3 {
    font-family: 'barmo';
    font-size: 30px;
    padding-bottom: 30px;
    color: #F9ED32;
}


.contactmiddle2 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;

    padding-bottom: 75px;
}

.contactmiddle2 {
    width:100%;
    height:100%;
    background-image: url(images/Background_Pattern2.png);
    background-size: contain;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    color: #ffffff;

    padding-top: 10px;

    padding-bottom: 10px;
}

.contactleftmiddle {
    height: 700px;
    padding-top: 100px;

}

.contactleftmiddle1 {
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 90%;
    padding-top: 100px;
    margin: auto;
    padding: 5px;
}

.maps {
    justify-content: center;
    height: 600px;
    width: 100%;
    padding-top: 100px;
    margin: auto;
    padding: 50px;
}


.contactleftmiddle { 
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    justify-content: center;
}

.contactmiddle5 .rightmiddle img {padding-right: 0%;}

.contactmiddle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.contacthero h1 {
    color: white;
    font-weight: 100;
    font-size: 55px ;
    height: 200px;
    display: flex;
    text-align: right;


    height: 100px;

    text-align: center;
    


}

.contactleftmiddle h2 {font-size: 50px; padding-bottom: 30px;}

.contacthero p {font-size: 14px;}

.middle8 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;

    padding-bottom: 75px;
}

.middle8 {height: 100%; padding-top: 5px;}

.middle8 .leftmiddle1 {width:80%; padding-top: 10px;}

.eventhero {
    width: 100%;
  height: 100%;
  background-image: url(images/EventsHero3.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.abouthero {
    width: 100%;
  height: 100%;
  background-image: url(images/abouthero3.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

}

.menusectionthree h5 {

    width: 95%;
    height: 100%;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 48px;
    color:#fff01c;

}

.menumiddle5 p {font-size: 12px;}





/* Mobile
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 550px)
{

    .right {
        width:300px;
    max-width: none;
    margin-top: 5px;
    margin-bottom: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: none;
    margin-top: none;
    margin-bottom: none;
    text-align: center;
    padding-bottom: 25px;
    padding-top: 155px;;
    }

    .left {display: none;}

    body{background-color: rgb(0, 0, 0);}

    .hero{
        height: 500px;
        font-size: 40px;
        line-height: 10px;

        width: 100%;
        background-image: url(images/hero2.png);
      
        background-size: cover;
      background-position: center;
      background-attachment:scroll;
      
        font-size: 100px;
        text-align: center;
      
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
      
       font-family: 'barmo'; 
      font-weight: 400;
      }

      nav ul {display: none;}

      .hero h1 {
        
        font-size: 30px;
        float: none;
        text-align: none;
        font-weight: 100%;
        width: 100%;
        height: 100%;
        display: flex;
        line-height: 40px;
        text-align: center;
    }



    .hero{
        text-align: center;
        float: center;
    }
      

    .cta {

        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        height: 50px;
        width: 200px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;

        
    }

    .border2 { 
        width: 100%;
        height: 50px;
        min-width: 10px;
           background-position: top;
           background-size: cover;
           background-repeat: no-repeat;
           float: bottom;
           clear: bottom;
      
       flex-direction: row;
          flex-wrap: wrap;
          padding-left: 0px;
    }

    .rightmiddle {display: none;}

    .middle5 {
        width:100%;
        height:100%;
        background-color: #fff01c;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    
    .middle5 h2 {
        font-family: 'barmo';
        font-size: 25px;
    }
    
    .middle5 .leftmiddle p {
        font-family: "source-code-pro", monospace;
        font-weight: 400;
        font-style: normal;
        font-size: 12px;

        width: 100%;
    }
    
    .leftmiddle {
    
        width: 85%;
        height: none;
        padding-top: 20px;
        padding-bottom: 0px;
    }
    
    .cta1 {
    
        background-image: url(images/middleCTA.png);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #fff01c;
        
        height: 50px;
        width: 200px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;
    }
    
    .middle5 p {
        height: 200px;
        padding-bottom: 0px;
    }
    
    .leftmiddle {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;}
    
    .imgmid {
        
        display: block;
        width: 950px;
        align-items: center;
     
    
    }

    .MiddleEndBorder {
        background-image: url(images/MiddleBottomBorder.png);
        width: 100%;
      height: 200px;
         background-position: top;
         background-size: cover;
         background-repeat: no-repeat;
    
     flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: 15px;
    }



    .cta2 {
        background-image: url(images/CTA1.png);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    
        line-height: normal;
    
        display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-around;
    
        font-family: 'barmo';
        font-weight: 400;
        font-style: normal;
        font-size: 20px;
        color: #000000;
        
        height: 50px;
        width: 200px;
        text-align: center;
        align-items: center;
    
        float: right;
        display: flex;
    
    }

    .three1 {display: none;}

    .sectionthree h2 {
        
        font-size: 25px;

        text-align: center;


    
    }

    .three {display: none;}
    
    .MobileMid {
        
        display: block;
    
        height:755px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;

        background-image: url(images/Background_Pattern1.png);
        background-size: contain;

        padding-bottom: 70px;
    }

    .MobileMid1 {

    font-family: "source-code-pro", monospace;
    font-weight: 200;
    font-style: normal;
    font-size: 12px;

    color: #ffffff;

    width:75%;
    height:750px;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    }

    .MobileMid1 {height: 300px;}

    .MobileMid1 p {padding-top: 50px; padding-bottom: 60px; }

    .sectionfour {display: none;}

    .middle2 p {font-size: 12px; height: 10px; padding-bottom: 10px;}

    .middle2 h2 {font-size: 25px; padding-bottom: 20px;}

    .middle2 .leftmiddle1 {
        
        width: 80%;
        height: 100%;
        padding-top: 10px;

        margin: auto;
        text-align: center;

    }

    .middle2 {padding-top: 10px; padding-bottom: 10px;}

    .middle2 .leftmiddle {width:90%;   height: 100%; padding-top: 10px; padding-bottom: 50px; padding-right: 0px;}

    .middle2 h2 {height: 50px}

    .middle2 p {width: 100%; height: 150px;}
    
    .middle2 .imgmiddle2 {width: 100%;}

    footer .three {
        
        display: block; 
        height: 10%; 
        justify-content: center; 
        text-align: center; 
        padding-top: 0px;}

    footer .three p {font-size: 12px; height: 200px;}

    footer .three h3 {font-size: 22px;}

    footer {flex-direction:column;}

    footer {height:100%}

    footer img {width: 90%;}


.three {height: 80%; width: 80%; margin:auto; padding-bottom: 0px;}

    .NearEndBorder {background-repeat: no-repeat; padding-top: 0px;}
    
    .sectionfour .imgmid {display: none;}

    .EndBorder {margin-top: 10px;}

    .three .dis {font-size: 6px; height: 100%; padding-top: 0px;}

.FooterButton {padding-bottom: 10px;}


/* Menu Page */

.menusectionthree {

    width:95%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;

    background-image: url(images/Background_Pattern1.png);

    text-align: center;

    margin: auto;

}

.menuthree {
    
    width: 90%;
margin: auto;}

.menusectionthree h2 {padding-bottom: 40px;}

.menusectionthree .three img {width: 70%;}

.menusectionthree h2 {

    width: 95%;
    height: 100%;
    padding-bottom: 10p;
    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 50px;
    color:#fff01c;

}

.menumiddle5 h3 {
    font-family: 'barmo'; 
    font-weight: 400;
    font-size: 27px;
    line-height: 50px;
    color: #ffffff;
    text-align: left;
}

.menumiddle5 p {
    
    padding-bottom: 10px;
    font-size: 14px;

}

.menuthree {padding-bottom: 30px;}

.menumiddle5 h2 {
    
    font-size: 50px;
    text-align: center;

}

.menumiddle5 h4 {font-size: 18px;}

.menuhero {
    height: 500px;
    font-size: 40px;
    line-height: 10px;

    width: 100%;
    background-image: url(images/MobileMenuHead.png);
  
    background-size: cover;
  background-position: center;
  
  
    font-size: 100px;
    text-align: center;
  
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  
   font-family: 'barmo'; 
  font-weight: 400;
}

.menuright {
    width: 90%;
    max-width: none;
    margin-top: 5px;
    margin-bottom: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: none;
    margin-top: none;
    margin-bottom: none;
    text-align: center;
    margin: auto;

    padding-left: 0px;

    padding-top: 130px;
        padding-bottom: 50px;
}

.menuright h1{

    font-size: 60px;
        float: none;
        text-align: none;
        font-weight: 100%;
        height: 100%;
        display: flex;
        line-height: 40px;
        text-align: center;
        padding-top: 20px;

}

.menuright .menuheadtext {font-size: 14px; padding-top: 10px;}

.menusectionthree h5 {

    width: 95%;
    height: 100%;

    font-family: 'barmo';
    font-weight: 400;
    font-style: normal;
    font-size: 35px;
    color:#fff01c;

    text-align: center;

}

.menumiddle5 h3 {
   line-height: 40px;
}

/*--contact--*/

.contactleftmiddle h3 {
    font-family: 'barmo';
    font-size: 30px;
    padding-bottom: 30px;
    color: #F9ED32;
}


.contactmiddle2 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;

    padding-bottom: 15px;
}

.contactmiddle2 {
    width:100%;
    height:100%;
    background-image: url(images/Background_Pattern2.png);
    background-size: contain;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;

    color: #ffffff;

    padding-top: 10px;

    padding-bottom: 50px;
}

.contactleftmiddle {
    height: 700px;
    padding-top: 100px;

}

.contactleftmiddle1 {
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 90%;
    padding-top: 100px;
    margin: auto;
    padding: 10px;
}

.maps {
    justify-content: center;
    height: 500px;
    width: 100%;
    padding-top: 100px;
    margin: auto;
    padding: 5px;
}

.contacthero {
    width: 100%;
  height: 100%;
  background-image: url(images/ContactHero2.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.contactleftmiddle { 
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    justify-content: center;
}

.contactmiddle5 .rightmiddle img {padding-right: 0%;}

.contactmiddle5 {
    width:100%;
    height:100%;
    background-color: #fff01c;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.contactleftmiddle h2 {font-size: 25px;}

.contactleftmiddle {margin: auto;}

.contactleftmiddle h3 {font-size: 20px;}

.contacthero .menuright h1 {font-size: 50px;}

.middle8 h2 {font-size: 30px; text-align: center; padding-bottom: 0px;}


.middle8 p {
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;

    padding-bottom: 10px;
}

.middle8 {height: 100%; padding-top: 5px;}

.middle8 .leftmiddle1 {width:80%; padding-top: 10px;}

.menumiddle5 .menuleftmiddle .menuthree p {

    color: white;
    font-family: "source-code-pro", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 10px;

    text-align: left;

    padding-top: 20px;


}

.abouthero {
    width: 100%;
  height: 100%;
  background-image: url(images/AboutHero2.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}

.eventhero {
    width: 100%;
  height: 100%;
  background-image: url(images/EventHero2.png);

  line-height: 75px;

  background-size: cover;
background-position: center;

  font-size: 100px;
  text-align: center;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

 font-family: 'barmo'; 
font-weight: 400;
}


.facebook {width: 40px; height: 40px;}

.instagram {width: 40px; height: 40px;}

.discord {width: 40px; height: 40px;}

.twitter {width: 40px; height: 40px;}
}