/*
  Estilos adaptados para Material-design-lite
  autor: Carlos Freitas

*/

/* Animação*/
  *{
   
  /*  transition: all 800ms cubic-bezier(0.530, -0.545, 0.650, 0.995) !important;  custom 
    transition-timing-function: ease-in-out !important;*/
  }

  .transition{
 
        -webkit-transition: all 400ms cubic-bezier(1.000, 0, 0.320, 1); /* older webkit */
        -webkit-transition: all 400ms cubic-bezier(1.000, -0.045, 0.320, 1.270); 
           -moz-transition: all 400ms cubic-bezier(1.000, -0.045, 0.320, 1.270); 
             -o-transition: all 400ms cubic-bezier(1.000, -0.045, 0.320, 1.270); 
                transition: all 400ms cubic-bezier(1.000, -0.045, 0.320, 1.270); /* custom */

        -webkit-transition-timing-function: cubic-bezier(1.000, 0, 0.320, 1); /* older webkit */
        -webkit-transition-timing-function: cubic-bezier(1.000, -0.045, 0.320, 1.270); 
           -moz-transition-timing-function: cubic-bezier(1.000, -0.045, 0.320, 1.270); 
             -o-transition-timing-function: cubic-bezier(1.000, -0.045, 0.320, 1.270); 
                transition-timing-function: cubic-bezier(1.000, -0.045, 0.320, 1.270); /* custom */
  }

  .card-rotate{
  
       /*transition-timing-function: ease-in-out !important; /* custom */*/
      -ms-transform: rotate(7deg); /* IE 9 */
      -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
       transform: rotate(7deg);
      }
  
  .animation-card{
      -webkit-transform: scale(0);
      transform: scale(0); 
  }


 
   ::-webkit-scrollbar{width:10px;height: 0px; } 
  /*::-webkit-scrollbar-track {cursor: move;}
  /*::-webkit-scrollbar-thumb{background-color: rgba(0,0,0,0.4);}  */
  

h4{
      color: #2e1803;
      font-size: 14px;
      line-height:100%;
      opacity: 0.74;
      filter: alpha(opacity=74); /* For IE8 and earlier */

}
a { color: inherit; } 

.demo-layout-transparent .mdl-layout__header,
.demo-layout-transparent .mdl-layout__drawer-button {color: white;}

/*.demo-layout-transparent {background: url('../images/fundo-donacarlota-cartao.jpg') center / cover;}*/
.mdl-layout__content{background: url('../images/fundo-donacarlota-cartao-pc.jpg') center / cover;}
  
.page-content{ vertical-align:middle; padding:0px; padding-top:10px; }
 

 /* Menu Lateral*/
  .contato{
  padding-left: 10px; 

  }
  .contato a{
    text-decoration: none;
   }

  .icon{
    padding: 10px 5px 10px 10px;


  }
  .icon img{
    width: 30px;
    height: 30px
  }

/*
   CARDS
*/
.mdl-card__title{
  padding: 14px;
}
.demo-card-wide.mdl-card {width: 150px; color:#b3d4fc;}
.mdl-card__title img{
  text-align: center;
  vertical-align: middle;
}
.mdl-card__supporting-text {
    font-size: 13px;
    line-height: 8px;
    /*overflow: hidden;*/
    padding: 0px;
    width: auto;

}
.mdl-card__supporting-text h4{
    text-align: center;
    padding: 0px 10px 0px 10px;
    margin:0px;

    font-size: 15px;

}

/* FIM CARDS*/


/*  Scrolling */

#cards-brigadeiros{
  overflow: auto;
  /*overflow-y: hidden;*/
  width: 100%;
  height: 230px;
  display: inline-block;

}


.lista-brigadeiros{
   width: 160px;
}

.lista-brigadeiros li{
  list-style: none;
  display: inline-block;
  padding-right: 2px; 
  cursor:pointer;

}



/* Navegação Scrolling*/

.btnBack{
  position: absolute;
  top:180px;
  background: rgba(0,0,0,0.1);
  left:0px;
  width: 40px;
  height: 70px;
  display: inline-block;
  cursor: pointer;
  z-index: 10;
  border-radius: 2px;
}
.btnForward{
  position: absolute;
  top:180px;
  left:88%;
  left: calc(100% - 50px);
  background: rgba(0,0,0,0.1);
  width: 60px;
  height: 90px;
  display: inline-block;
  cursor:pointer;
  z-index: 10;
  border-radius: 2pX;

}
.btnBack ,.btnForward img{

  padding-top: 20px;
  vertical-align: middle;
  text-align: center;
}

.btnBack:hover{
 background: rgba(0,0,0,0.4);
}

.btnForward:hover{
 background: rgba(0,0,0,0.4);
}



/*Painel Descrição do Produto*/

.painel-descricao{
  
  background: rgba(255,255,255,1);
  position: relative;
  margin-top: 10px; 
  margin-bottom: 10px;
  transform: scale(0);
  
  height: auto;
  min-height: 100px;
  
  max-width:500px;
  width: 70%;
  padding: 30px 40px;
 }

 
.texto-descricao{
  /*height: auto;*/
  min-height: 70px;
  text-align: left;
  /*background: orange;*/
 
}


  #text-desc{
    text-align: justify;
    padding: 2px;
    font-weight: normal;
    /*margin-top: 5px;*/
    font-family: Roboto !important;
    font-size: 11pt !important;
    font-weight: 250 !important;
   /* font-stretch: condensed !important;*/
    /*opacity: 0.74;
    filter: alpha(opacity=74);*/ /* For IE8 and earlier */
    line-height: 20px;
  }

.table-valor table{
      float: right;
      /*background: blue;*/
 }

/*.table-valor table td:first-child{
  width: 50%;
  
}*/

.table-valor td{
   padding: 0px;
   margin: 0px;
   vertical-align: middle;
   height: 15px;
   /*background: blue;*/
   border-bottom: 1px solid #EEEEEE;

    
}
.table-valor td h4{
   padding: 0px;
   margin: 0px;
   font-size: 12px;
   font-weight: normal;
    /*margin-top: 5px;*/
  font-family: Roboto !important;
  font-size: 10pt !important;
  font-weight: 250 !important;
}

.valor{
  color:red;
  font-size: 16px;
  font-weight: bold;

}
#icon-valor img{
  opacity: 0.54;
  filter: alpha(opacity=54); /* For IE8 and earlier */
  width: auto;
  display: none;
}



/*  Dados Rodape*/

footer{
  position: absolute;
  bottom:0px;
  z-index: 3;
}

.footer-dados{
  background:rgba(0,0,0,0.4);
  width: 100%;
  height:50px;
  padding: 10px
}
footer h6{
  color:rgba(255,255,255,0.7);
  margin:0px;
  font-size: 11px;
  line-height: 13px;
}
footer h6:last-child{
  font-size: 14px;
  line-height: 16px;
}


/*  Button Colored FAB*/

button i{
  color:white;
  fill:white;
}

#contato{
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 12;
}
/* Button Socia*/
.button-whatsapp,.button-facebook,.button-local,.button-phone{
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 11;
}

/* Fixando valores*/
.footer-ajuste{
  position: relative;
}
.descricao-ajuste{
   position: relative;
   left: 0px;
   top:0px;
   margin-top: 0px;
   z-index: 7;
   padding: 10px 10px;
   min-height: 100px;
   height: auto;
}



/* mobile-small */
@media all and (min-height: 0px) and (max-height: 380px) and (orientation: landscape) {
        /*  Dados Rodape*/

      footer{
       position: relative;
      }

      .footer-dados{
        /*background:rgba(0,0,0,0.7);*/
        background: #424242;
      }

      /*Painel descrição*/
       .painel-descricao{
            width: 47%;
            position: absolute;
            left:2500px;
            right: 0px;
            top:110px;
            z-index: 7;
            padding: 10px 10px;
            min-height: 150px;
            height: auto;
         
        }

        #text-desc{
            text-align: justify;
            padding: 0px;
            font-weight: normal;
            margin-top: 2px;

              line-height: 18px;
              font-size: 10pt !important;
              font-weight: 320 !important;
             /* font-stretch: condensed !important;*/
              /*opacity: 0.74;
              filter: alpha(opacity=74);*/ /* For IE8 and earlier */
          }
          #icon-valor img{
            opacity: 0.54;
            filter: alpha(opacity=54); /* For IE8 and earlier */
            width: auto;
            display: block;
          }
     

    
}

/* mobile-small */
@media all and (min-height: 0px) and (max-height: 526px) and (orientation: portrait) {
        /*  Dados Rodape*/

      footer{
       /*position: relative;*/
      }

      .footer-dados{
        /*background:rgba(0,0,0,0.7);*/
        background: #424242;

      }

     /*Painel descrição*/
       /*.painel-descricao{*/

          /*position: relative;*/
          /*left: 0px;*/
          /*top:0px;*/
          /*margin-top: 0px;*/
          /*z-index: 7;*/
         
          /*padding: 10px 10px;*/
          /*min-height: 100px;*/
          /*height: auto;*/
         
        /*}*/

        #text-desc{
            text-align: justify;
            padding: 0px;
            font-weight: normal;
            margin-top: 5px;

              line-height: 18px;
              font-size: 10pt !important;
              font-weight: 320 !important;
             /* font-stretch: condensed !important;*/
              /*opacity: 0.74;
              filter: alpha(opacity=74);*/ /* For IE8 and earlier */
          }
        

     
     

}

/* mobile-large */
@media all and (min-height: 526px) and (max-height: 800px) and (orientation: portrait)  { 
        /*::-webkit-scrollbar{width:10px;height: 0px; } */
       /*.page-content{padding-top:70px;  }*/

      /* Itens Cards*/


        #cards-brigadeiros{
             padding-left: 50px;
             width: 100%;
             height: 230px;
             background: transparent;
             z-index: 1;
        }

      /*Painel descrição*/

          .painel-descricao{
            width: 75%;
            max-height: auto;
            /*position: absolute;*/
            left: 0px;
            margin-top: 15px; 
            /*top:330px;*/
            padding: 10px 20px;
            
            min-height: 100px;
            height: Calc(200px - 1em);
          
          }

           #text-desc{
            text-align: justify;
            padding: 0px;
            font-weight: normal;
            margin-top: 5px;

              line-height: 18px;
              font-size: 10pt !important;
              font-weight: 350 !important;
             /* font-stretch: condensed !important;*/
              /*opacity: 0.74;
              filter: alpha(opacity=74);*/ /* For IE8 and earlier */
          }

          
         
          /* Footer*/

           footer{
            background: red;

           }
          .footer-dados{
            background:rgba(0,0,0,0.6);
            /*background: pink;*/
            width: 100%;
            height:50px;
            padding: 10px
          }
        
                    

     
    
}

 
/* mobile-small-landscape */
@media all and (min-width: 0px) and (max-width: 480px) and (orientation: landscape) { }
/* mobile-large-landscape */
@media all and (min-width: 481px) and (orientation: landscape) { }
/* tablet-small-landscape */
@media all and (min-width: 600px) and (max-width: 960px) and (orientation: landscape) { }
/* tablet-large-landscape */
@media all and (min-width: 961px) and (orientation: landscape) { }
/* tablet-small */
@media all and (max-height: 728px) and (orientation:portrait) {
      .mdl-layout__content{ background: url('../images/fundo-donacarlota-cartao-mobile.jpg') center / cover;}
 }
/* tablet-large */
@media all and (min-width: 601px) and (max-width: 840px) and (orientation : portrait) { }
/* desktop-x-small-landscape */
@media all and (min-width: 0px) and (max-width: 480px) and (orientation: landscape) { }
/* desktop-x-small */
@media all and (min-width: 0px) and (max-width: 480px) and (max-aspect-ratio: 4/3) { }
/* desktop-small-landscape */
@media all and (min-width: 481px) and (max-width: 840px) and (orientation: landscape) { }
/* desktop-small */
@media all and (min-width: 481px) and (max-width: 840px) and (max-aspect-ratio: 4/3) { }
/* desktop-medium-landscape */
@media all and (min-width: 841px) and (max-width: 1280px) and (orientation: landscape) { }
/* desktop-medium */
@media all and (min-width: 841px) and (max-width: 1280px) and (max-aspect-ratio: 4/3) { }
/* desktop-large */
@media all and (min-width: 1281px) and (max-width: 1600px) {}
/* desktop-xlarge */
@media all and (min-width: 1601px) and (max-width: 1920px) {}