@media only screen and (max-width: 991px) {
  
      
      .evento-blocos{
          display: grid !important;
          grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
          grid-gap: 10px;
          max-width: 100%;
          padding: 20px;
          box-sizing: border-box;
      }
  
  }
  @media only screen and (max-width:800px){
      #busca-clubes{
          display:none
      }
      .col-sm-offset-1 {
      margin-left: 0;
  
  }
  }
  
  @media only screen and (max-width: 767px){
      .body{
          font-size: larger;
      }
      .container{
          display: grid !important;


      }
      #info-header{
      display: none;
      }

      /* Fix para abas da agenda e carousel no mobile */
      .aba-shadow {
          display: block !important;
          width: 100%;
      }
      .aba-shadow .nav-tabs.agenda_tab {
          display: flex !important;
          flex-direction: column;
          width: 100%;
      }
      .aba-shadow .nav-tabs.agenda_tab > li {
          width: 100%;
          text-align: center;
      }
      .tab-content {
          display: block !important;
          width: 100%;
          max-width: 100vw;
          margin-left: 0 !important;
          overflow-x: hidden;
      }
      .tab-pane > .col-md-12 {
          padding-left: 0;
          padding-right: 0;
          overflow-x: hidden;
      }
      .tab-pane > .col-md-12 > .container {
          display: block !important;
          max-width: 100%;
          padding-left: 40px;
          padding-right: 40px;
          overflow-x: hidden;
      }
      /* Setas do carousel */
      .agenda-control-right {
          right: 0 !important;
          margin-right: 5px;
      }
      .agenda-control-left {
          left: 0 !important;
          margin-left: 5px;
      }

      }
 @media only screen and (max-width: 500px) {
    .evento-blocos{
        grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
        padding:0px;
    }}
 @media only screen and (max-width: 400px) {
        .evento-blocos{
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            padding:0px;
        }
        .col-md-4.left{
            padding-left: 0px;
            padding-right: 0px
        }
  @media only screen and (max-width: 326px) { 
    .evento-blocos{
    grid-template-columns: 47%47%;
    }
   }    
 }