* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    }


   #container {
      width: 100%;
      max-width: 1200px;
      margin: 0px auto;
   }

 
   h3{
      font-family: "Rokkitt", serif;
      font-optical-sizing: auto;
      font-weight: 500;
      font-style: normal;
      margin-bottom: 31px;
   }

   h6{
      color: #BABABA;
      font-family: "Lato", sans-serif;
      font-weight: 500;
      font-style: normal;
   }

   p{
      font-family: "Lato", sans-serif;
      font-weight: 500;
      font-style: normal;
   }


   a:link{
      color: #FFFFFF;
      text-decoration: none;
      font-family: "Lato", sans-serif;
      font-weight: 700;
      font-style: normal;
   }

   a:active {
      color: #000000;
   }

   a:visited {
      color: #ffffff;
   }
   

   header{
      width: 100%;
      max-width: 1200px;
      background-image: url(imgs/img_padrao.jpg);

      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;

      padding: 31px 37px 36px 37px;
   }

   nav{
      max-width: 440px;
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
   }

   nav a:hover{
      color: #000000;
   }

   #menu{
      display: none;
   }

   #moonspell{
      width:100%;
      max-width: 550px;
      margin: 188px 0 152px 325px;
   }



   #box4 {
      width: 1126px;
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      margin-bottom: 206px;
   }

   #slogan{
      font-family: "Lato", sans-serif;
      font-weight: 700;
      font-style: normal;
      margin-bottom: 191px;
   }

   #banda {
      max-width: 550px;
      width: 100%;
      margin: 0 auto;
   }

   #bandatitulo {
      max-width: 550px;
      width: 100%;
      color: #694623;
      font-family: "Rokkitt", serif;
      font-optical-sizing: auto;
      font-weight: 700;
      font-style: normal;
      border-bottom: 7px solid #C39644;
      margin-bottom: 71px;
   }

   .bandatxt {
      max-width: 550px;
      width: 100%;
      line-height: 29px;
      font-family: "Lato", sans-serif;
      font-weight: 500;
      font-style: normal; 
      margin-bottom: 45px;
   }

   #galeria {
      width: 1126px;
      height: 895px;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-content:space-between;
      margin: 0 auto 239px auto
   }

   #galeriatlm {
      display: none;
   }

   #galeriatbl {
      display: none;
   }

   #minigaleria {
      width: 358px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
   }
   

   #banner {
      width: 100%;
      max-width: 1200px;
      margin: 0 auto 145px auto;
   }

   #bannertbl {
      display: none;
   }

   #titulo {
      max-width: 550px;
      width: 100%;
      font-family: "Rokkitt", serif;
      font-optical-sizing: auto;
      font-weight: 700;
      font-style: normal;
      color: #694623;
      text-align: center;
      border-bottom: 7px solid #C39644;
      margin: 0 auto 200px auto;
   }

   #hermitagetitulo{
      font-family: "Rokkitt", serif;
      font-optical-sizing: auto;
      font-weight: 600;
      font-style: normal;
   }

   ol {
      max-width: 543px;
      width: 100%;
      line-height: 36px;
      font-family: "Lato", sans-serif;
      font-weight: 500;
      font-style: normal;
      border-left: 7px solid #C39644;
      padding-left: 30px;
   }


   #bts {
      width: 550px;
      display: flex;
      justify-content: space-between;
      align-items: center;
   }

   #comprar {
      color: #691000;
      width: 358px;
      font-family: "Lato", sans-serif;
      font-weight: 700;
      font-style: normal;
      border: #691000 solid 1px;
      border-radius: 50px;
      padding: 17px 154px;
      transition-duration: 0.4s;
   }
      #comprar:hover {
         text-decoration: none;
         color: #FFFFFF;
         background-color: #691000;
      }

   #btcarrinho {
      max-width: 166px;
      width: 100%;
      border: #691000 solid 1px;
      background-color: #fff;
      border-radius: 50px;
      padding: 17px 71px;
      transition-duration: 0.4s;
   }
   
    
   #btcarrinho:hover {
      text-decoration: none;
         color: #FFFFFF;
         background-color: #691000;
   }
   

   #buytlm {
      display: none;
   }

   #albumtlm {
      display: none;
   }


   #box1 {
      max-width: 1125px;
      width: 100%;
      display: flex;
      justify-content: space-between;
      margin: 0 auto 294px auto;
   }

   #minibox1 {
      max-width: 550px;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;      
   }

   #albumtbl {
      display: none;
   }

   #buytbl {
      display: none;
   }

   #minibox2 {
      width: 550px;
      height: 582px;
      display: flex;
      flex-wrap: wrap;
      align-content: space-between;
      justify-content: space-between   
   }

   footer {
      max-width: 1200px;
      width: 100%;
      background-image: url(imgs/img_padrao.jpg);
      background-repeat: no-repeat;

      display: flex;
      align-items: center;
      justify-content: space-between;

      padding: 41px 44px 31px 37px ;
   }

   #navtlm {
      width: 100%;
      max-width: 394px;
      display: flex;
      justify-content: space-between;
   }

   #navtlm a:hover {
      
     color: #000000;
   
   }

   #social{
      width: 124px;
      display: flex;
      justify-content: space-between;
   }

   #footer2 {
      max-width: 1200px;
      width: 100%;
      background-color: #000000;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 35px 38px ;
   }


/**********************RESPONSIVE TABLET***********************/
@media only screen and (max-width: 720px) {

   header {
      max-width: 720px;
   }

   #moonspell {
      margin: 180px 85px;
   }

   #banda {
      max-width: 720px;
      padding: 0 85px;
   }

   #galeria {
      display: none;
   }

   #galeriatbl {
      max-width: 493px;
      width: 100%;

      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      justify-content: center;
   }

   #menutbl {
      margin-top: 20px;
      margin-bottom: 198px;
   }

   #banner {
      display: none;
   }

   #bannertbl {
      display: block;
      margin-bottom: 162px;
   }

   #titulo {
      max-width: 550px;
      margin-bottom: 130px;     
   }

   #box1 {
      max-width: 720px;
      margin-bottom: 192px;
   }

  ol {
      max-width: 278px;
  }

  #minibox1 {
      margin-left: 50px;
  }

  #albumtbl{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 321px;
    margin-right: 46px;
    margin-bottom: 45px;
  }

  #box2{
      margin-right: 46px;
      margin-top: 100px;
  }

  #minibox2 {
      display: none;
   }

   #buytbl {
      display: block;
      color: #691000;
      max-width: 320px;
      width: 100%;
      font-family: "Lato", sans-serif;
      font-weight: 700;
      font-style: normal;
      border: #691000 solid 1px;
      border-radius: 50px;
      padding: 17px 140px;
      transition-duration: 0.4s;
      text-align: center;
   }

   #buytbl:active {
      text-decoration: none;
      color: #FFFFFF;
      background-color: #691000;
   }

   footer {
      max-width: 720px;
      padding: 70px 40px;
      margin-bottom: 5px;
   }

   #ftlogo {
      display: none;
   }

   #footer2{
      max-width: 720px;
   }
}

/************************RESPONSIVE TLM***********************/

@media only screen and (max-width: 360px) {

   nav{
      display: none;
   }

   #menu{
      display: block;
   }

   #moonspell{
      margin: 100px 0 152px 0px;
      padding: 0px 20px;
   }

   #banda {
      max-width: 360px;
      padding: 0px 20px;
   }

   #bandatitulo {
      max-width: 360px;
  
      margin-bottom: 61px;
   }


   .bandatxt {
      max-width: 360px;
   
      margin-bottom: 40px;
   }


   #galeria {
      display: none;
   }

   #galeriatlm {
      max-width: 360px;
      width: 100%;

      display: flex;
      flex-wrap: wrap;
      justify-content:center ;
   }

   #menub {
      margin: 9px 0px 220px 0px;
   }

   #banner {
      display: none;
   }

   #titulo {
      max-width: 320px;
   
      margin: 0 auto 76px auto;
   }

   #albumtlm {
      display: block;
     max-width: 320px;
      margin: 0 20px 54px 20px;
   }


   #box1 {
      max-width: 360px;
      margin-bottom: 70px;
   }

   #minibox1 {
      max-width: 360px;
      margin: 0 25px;
   }

   #minibox2 {
      display: none;
   }


   ol {
      max-width: 360px;
   }

   #buytlm {
      display: block;
      color: #691000;
      max-width: 320px;
      width: 100%;
      font-family: "Lato", sans-serif;
      font-weight: 700;
      font-style: normal;
      border: #691000 solid 1px;
      border-radius: 50px;
      padding: 17px 140px;
      transition-duration: 0.4s;
      margin-bottom: 240px;
      margin: 0 20px 240px 20px;
      text-align: center;
   }

   #buytlm:active {
      text-decoration: none;
      color: #FFFFFF;
      background-color: #691000;
   
   }

   footer {
      max-width: 360px;
      background-image: url(imgs/img_padrao-tlm.jpg);

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

      padding: 41px 44px 25px 44px ;
   }
   
   #ftlogo {
      display: none;
   }

   #navtlm {
      max-width: 360px;
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      align-content: center;
      order: 2;
      margin-top: 36px;
   }

   #footer2 {
      max-width: 360px;
      flex-direction: column;
   }

   #navtlm a {
      margin-bottom: 20px;
      text-align: center;
   }

  #espaco {
   margin-bottom: 14px;
  }

  #galeriatbl{
   display: none;
  }

  #bannertbl{
   display: none
  }

  #box2 {
   display: none;
  }

}