.span22_bg {
                    max-width: 280px;
                    min-width: 280px;
                }
             @media (min-width: 1200px){
                [class*="span"] {
                    float: left;
                    min-height: 1px;
                    margin-left: 30px;
                }
             }
             .span22_bg > a:hover
             {
                   text-decoration:none !important;
              }
             
              a.info-box.text
             {
                 text-decoration:none !important;
                 
                 }
             
             a .info-box
             {
                 text-decoration:none !important;
                 cursor:pointer;
                 }
            
            .info-box {
                box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
                height: 100px;
                display: flex;
                cursor: default;
                background-color: #fff;
                position: relative;
                overflow: hidden;
                margin-bottom: 30px;
            }
            /*------ BACKGROUND CARDS ------*/

            .bg-pink {
                background-color: #E91E63 !important;
                color: #fff;
            }
            
            .bg-light-green {
                background-color: #8BC34A !important;
                color: #fff;
            }
            
            .bg-cyan {
                background-color: #00BCD4 !important;
                color: #fff;
            }
            
            .bg-orange {
                background-color: #FF9800 !important;
                color: #fff;
            }
            
            .bg-lime {
                background-color: #CDDC39 !important;
                color: #fff;
            }
            
            .bg-green {
                background-color: #4CAF50 !important;
                color: #fff;
            }
            
            .bg-teal {
                background-color: #009688 !important;
                color: #fff;
            }
            
            .bg-indigo {
                background-color: #3F51B5 !important;
                color: #fff;
            }
            
            .bg-brown {
                background-color: #795548 !important;
                color: #fff;
            }
            
            .bg-blue-grey {
                background-color: #607D8B !important;
                color: #fff;
            }
            
            .bg-red {
                background-color: #F44336 !important;
                color: #fff;
            }
            
            .bg-amber {
                background-color: #FFC107 !important;
                color: #fff;
            }
            /*------ #BACKGROUND CARDS ------*/
            
            .info-box .icon {
                display: inline-block;
                text-align: center;
                background-color: rgba(0, 0, 0, 0.12);
                width: 80px;
            }
            
            .icon i
            {
                width: auto;
                font-size: 4em;
                line-height: 1.67em;
                height: auto;
                }
              
             .info-box.hover-zoom-effect .icon i {
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                -webkit-transition: all 0.3s ease;
                transition: all 0.3s ease;
            }
            .info-box.hover-zoom-effect:hover .icon i
            {
                opacity: 0.4;
                -moz-transform: rotate(-32deg) scale(1.4);
                -ms-transform: rotate(-32deg) scale(1.4);
                -o-transform: rotate(-32deg) scale(1.4);
                -webkit-transform: rotate(-32deg) scale(1.4);
                transform: rotate(-32deg) scale(1.4);
             }
                
              

            .info-box .content 
            {
                width: 64%;
                display: inline-block;
                padding: 7px 10px;
            }
            .info-box .content .text {
                font-size: 16px;
                margin-top: 11px;
                font-weight: bold;
                color: #555;
            }
            .info-box .content .number {
                font-weight: normal;
                font-size: 26px;
                margin-top: 8px;
                color: #555;
            }
            .bg-amber .content .text, .bg-amber .content .number, .bg-red .content .text, .bg-red .content .number, .bg-blue-grey .content .text, .bg-blue-grey .content .number, .bg-brown .content .text, .bg-brown .content .number, .bg-indigo .content .text, .bg-indigo .content .number, .bg-teal .content .text, .bg-teal .content .number, .bg-green .content .text, .bg-green .content .number, .bg-pink .content .text, .bg-pink .content .number, .bg-light-green .content .text, .bg-light-green .content .number, .bg-cyan .content .text, .bg-cyan .content .number, .bg-orange .content .text, .bg-orange .content .number, .bg-lime .content .text, .bg-lime .content .number {
                color: #fff !important;
            }
            .info-box.hover-expand-effect:after {
                  background-color: rgba(0, 0, 0, 0.05);
                  content: ".";
                  position: absolute;
                  left: 80px;
                  top: 0;
                  width: 0;
                  height: 100%;
                  color: transparent;
                  -moz-transition: all 0.95s;
                  -o-transition: all 0.95s;
                  -webkit-transition: all 0.95s;
                  transition: all 0.95s; }

                .info-box.hover-expand-effect:hover:after {
                  width: 100%; }