div#tile-wrappers ul li {
    width: 24%;
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    margin: 2px;
    width: calc(25% - 4px);
}

div#tile-wrappers ul {
    padding: 0;
    list-style: none;
    margin: auto;
    display: table;
    float: none;
    text-align: center;
    width: 100%;
}

.resp-panel article {
    margin-right: 0 !important;
}


/*Tile css*/



#tile-wrapper {
width: 100%
}
#tile-wrapper ul {
display: table;
margin: 0;
padding: 0;
width: 100%;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-Webkit-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
#tile-wrapper ul li {
display: table-cell;
margin: 0;
padding: 5px;
text-align: center;
outline: 1px solid #eee;
vertical-align: middle;
}

.grid-content{ position:relative; height:160px}
.grdi-content {
position: absolute;
    top: 50%;
    transform: translatey(-50%);
    background: rgba(255, 255, 255, 0.5);
    width: 96%;
    left: 2%;
    padding: 15px;
    box-sizing: border-box;
}

.grdi-content h3 {
    color: #19345f !important;
    font-size: 20px !important;
    line-height: 1.2 !important;
    text-align: left;
}

.grdi-content a {
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

@media(max-width:767px){
   #tile-wrappers ul li {
    width: 49% !important;
    
}
}

@media(max-width:480px){
   #tile-wrappers ul li {
    width: 100% !important;
    max-width: 380px !important;
    display: table !important;
    margin: auto;
}


   }
   
   
   @media(max-width:1024px) and (min-width:768px){
       
 
   #tile-wrappers ul li {
    width: 32.5% !important;
    max-width: 380px !important;
   }
   }