.home{
    background-image: url("../img/gm289.jpg");
    background-position: center;
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 0;
}
body{
    background: var(--main-bg-color);
}

:root {
    --main-bg-color: #1d1c1c;
    --main-txt-color: #feffdc; 
    --second-accent-color:#aa2425;
  }

  #menuToggle
  {
    display: block;
    position: relative;
    top: 50px;
    left: 50px;
    
    z-index: 1;
    
    -webkit-user-select: none;
    -moz-user-select: none;
     -ms-user-select: none;
         user-select: none;
  }
  
  #menuToggle a
  {
    text-decoration: none;
    color: var(--main-bg-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 800;
    text-transform: uppercase;

    -webkit-transition: color 0.3s ease;
    
    transition: color 0.3s ease;
  }
  
  #menuToggle a:hover
  {
    color: var(--second-accent-color);
  }
  
  
  #menuToggle input
  {
    display: block;
    width: 40px;
    height: 32px;
    position: absolute;
    top: -7px;
    left: -5px;
    cursor: pointer;
    opacity: 0; 
    z-index: 2; 
    
    -webkit-touch-callout: none;
  }
 
  #menuToggle span
  {
    display: block;
    width: 33px;
    height: 4px;
    margin-bottom: 5px;
    position: relative;
    
    background: var(--main-txt-color);
    border-radius: 3px;
    
    z-index: 1;
    
    -webkit-transform-origin: 4px 0px;
    
            transform-origin: 4px 0px;
    
    -webkit-transition: background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease,
                -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease,
                -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease;
    
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease,
                -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
  }
  
  #menuToggle span:first-child
  {
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
  }
  
  #menuToggle span:nth-last-child(2)
  {
    -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
  }

  #menuToggle input:checked ~ span
  {
    opacity: 1;
    -webkit-transform: rotate(45deg) translate(-2px, -1px);
            transform: rotate(45deg) translate(-2px, -1px);
    background: #232323;
  }
  
  #menuToggle input:checked ~ span:nth-last-child(3)
  {
    opacity: 0;
    -webkit-transform: rotate(0deg) scale(0.2, 0.2);
            transform: rotate(0deg) scale(0.2, 0.2);
  }
  
  #menuToggle input:checked ~ span:nth-last-child(2)
  {
    -webkit-transform: rotate(-45deg) translate(0, -1px);
            transform: rotate(-45deg) translate(0, -1px);
  }
  #menu
  {
    position: absolute;
    width: 60px;
    margin: -100px 0 0 -50px;
    padding: 35px;
    padding-top: 125px;
    
    background: var(--main-txt-color);
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    /* to stop flickering of text in safari */
    
    -webkit-transform-origin: 0% 0%;
    
            transform-origin: 0% 0%;
    -webkit-transform: translate(-100%, 0);
            transform: translate(-100%, 0);
    
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
  }

  #menu li
  {
    padding: 10px 0;
    font-size: 22px;
  }

  #menuToggle input:checked ~ ul
  {
    -webkit-transform: none;
            transform: none;
  }
#nolinepls{
    text-decoration: none;

}
.gracelogo {
    font-family:'againts';
    font-size: 4em;
    color: var(--main-txt-color);
    text-align: center;
    margin: 0 auto;
    font-weight: 100;
    padding-left: 95px;   
}
h1{
    font-weight: 100;
}
h3 {
    color: var(--second-accent-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    text-align:center;
}
p{
    color: var(--main-txt-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 600;
}

h2 {
    font-family: 'againts';
    font-size: 2em;
    color: var(--main-txt-color);
    text-align: center;
}
article{
   width: 100%;
}

img.raincoatgirl{
    text-align: center;
    margin: 0 auto;
    display: block;
}
svg.drumgirls{
    fill: var(--main-txt-color);
    height:3em;
    padding-left:2em;
    padding-right:2em;
}
a.materialb{
    color: var(--main-txt-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    padding: 8px 12px;
    margin-top: 10px;
    border: 2px solid #feffdc;
    display:inline-block;
    text-decoration: none;
    vertical-align: center;
}
a.materialb:hover{
    color: var(--second-accent-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 300;
    padding: 8px 12px;
    margin-top: 10px;
    border: 2px solid var(--second-accent-color);
    display:inline-block;
    text-decoration: none;
    vertical-align: center;
}
.oneshow {
    width:40%;
    margin: 0 auto;
    padding: 25px 0px;
}

#lastshow {
    padding-bottom: 8em;
    padding-top: 6em;
    text-align: center;
}
#specialspace{
    padding: 5px;
    font-family: 'Nunito Sans', sans-serif;

}
a.cutelink{
    color: var(--main-txt-color);
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;

}
a.cutelink:hover{
    color: var(--second-accent-color);
}
.single {
    padding: 20px;
    text-align: center;
}
#specialbutton {
    font-family: 'Nunito Sans', sans-serif;
    padding: 6px 8px;
    background: var(--main-txt-color);
    color: --main-bg-color;
    font-weight: 400;
  }
svg:hover{
    fill: var(--second-accent-color);
}
@font-face {
    font-family: 'againts';
    src: url("../fonts/againts.woff2") format('woff2'),
         url("../fonts/againts.woff") format('woff'),
         url("../fonts/againts.otf") format('truetype');
    font-weight: normal;
    font-style: normal;
}
footer{
    position: relative;
    bottom: 0;
    text-align:center;
    width:100%;
}
.contenttt{
    min-height: 80%;
}
.smaller{
    max-width:980px;
    text-align:center;
    margin:0 auto;
    padding-bottom: 3em;
    padding-top: 4em;
}
.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
}
.resp-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
#bigred {
    background: var(--second-accent-color);
    width:100%;
}
.togetherness {
    background: #fff;
    margin: 0 auto;
}
.biography{
    color: var(--main-bg-color);
    padding: 25px;
}
 .gmcenter {
     text-align: center;
     padding-top: 15px;

}

@media only screen and (min-width: 576px) {
     .oneshow {
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        width:100%;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
        .place{
            padding: 0 2em;
        }
        
        #moveit {
            margin-left: 25px;
        }
       
  }



  @media only screen and (min-width: 768px) {
    .singleworld {
        -ms-flex-flow: wrap;
            flex-flow: wrap;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;  
        -webkit-box-pack:center;  
            -ms-flex-pack:center;  
                justify-content:center;

    }
    .single {
        width: 24%;
    }
    .togetherness{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
    }
    .biography,.gmcenter{
        width: 45%;
        -ms-flex-item-align: center;
            -ms-grid-row-align: center;
            align-self: center;
    }
    
  }
  @media only screen and (min-width: 1128px) {
   
    .single {
        width: 18%;
    }
    
  }
    
    
}#