/* CUSTOM CSS - this is where you add your own css rules !!

***********************************************************/ 

/* ===  Menu categories ===  */

.image-boxes * {
  -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.image-boxes div {
    display: block;
}

.image-boxes a {
    display: block;
    margin-bottom: 20px;
    position: relative;
    margin-bottom: 0!important;
}

.image-boxes span.image-boxes-bg {
    border-bottom-color: #cd2122;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border-bottom-style: solid;
    border-bottom-width: 5px;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    z-index: 1;
}

.image-boxes span.image-boxes-bg:hover {
    border-bottom-style: solid;
    border-bottom-width: 10px;
}

.image-boxes img {
    display: block;
    max-width: 100%;
    height: auto;
    border-style: none;
}

.image-boxes:hover img {
    opacity: .8;
}

.image-boxes h3 {
    text-align: left;
    padding: 0 0px 30px 20px;
    -webkit-transition: padding-bottom .2s ease-out;
    transition: padding-bottom .2s ease-out;
    position: absolute;
    bottom: 0;
    color: #fff;
    width: 100%;
    font-size: 16px;
    margin-bottom: 0;
    padding-bottom: 30px;
    z-index: 0;
    line-height: 1.4;
    font-weight: 400
}

.image-boxes h3:before {
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    content: '';
    position: absolute;
    top: -100%;
    left: 0;
    height: 200%;
    width: 100%;
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,transparent),color-stop(100%,rgba(0,0,0,1)));
    background: -webkit-linear-gradient(top,transparent 0%,rgba(0,0,0,1) 100%);
    background: linear-gradient(to bottom,transparent 0%,rgba(0,0,0,1) 100%);
    opacity: .8;
    -webkit-backface-visibility: hidden;
}

.image-boxes h3 span {
    z-index: 1;
    position: relative;
    -webkit-backface-visibility: hidden;
    text-transform: uppercase;
}

.bg-white {
    background: #ffffff;
    padding: 40px 0 5px;
}


/* ================= */

.statbox {
    min-height: 63px !important;
}

.statbox .fa {
    width: 36px;
    display: block;
    height: 48px;
    float: left;
    color: #8f8f8f;
    font-size: 32px;
    margin-right: 5px;
}

.statsboxes-elm-title {
    font-size: 20px;
    background: white;
    display: inline-block;
    padding: 0 10px;
    color: #595959;
    line-height: 1.5;
    background: none;

    font-family: "Open Sans",Helvetica,Arial,sans-serif;
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
    font-style: normal;
}

.statsboxes-elm-title .statsboxes-elm-titleicon {
    margin-right: 3px;
    margin-top: 7px;
}

.statsboxes-item {
    background: #fff;
    padding: 15px;
    margin-bottom: 25px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1)
}

.statsboxes-img {
    float: left;
    margin-right: 15px;
}

.statsboxes-icon {
    float: left;
    margin-right: 15px;
    font-size: 22px;
    color: #8f8f8f;
    vertical-align: top;
}

.statsboxes-title {
    font-size: 26px;
    font-weight: 400;
    text-transform: uppercase;
    color: #CD2122;
    line-height: 1;
    margin-top: 0;
    font-size: 26px;
}

.statsboxes-content {
    color: #969696;
    margin-bottom: 0;
    margin-top: 0;
    line-height: 1;
    font-weight: 400;
}

.statbox h4 {
    font-size: 26px;
    margin-bottom: 0;
}

.statbox h6 {
    margin: 0 0 0 45px;
    line-height: 14px;
}