@import url(https://fonts.googleapis.com/css?family=Raleway:400,900,700,600,500,300,200,100,800);

.blog_sections {
    padding: 0 0;
    font-family: Nunito,sans-serif
}

.blog_body p {
    font-size: 13px
}

.ion-minus {
    padding: 0 10px
}

#blog {
    background-color: #fff
}

.card .card-block .card-text {
    height: 100px;
    margin-top: 20px
}

#blog .carousel-indicators {
    bottom: -60px
}

    #blog .carousel-indicators li {
        background-color: #5db4c0;
        height: 13px;
        width: 13px;
        margin: 5px
    }

        #blog .carousel-indicators li.active {
            background-color: #888383
        }

#blog .card-block {
    padding: 10px;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal
}

#blog .card {
    background-color: #fff;
    border: none;
    margin: 20px 0
}

#blog .card-block:hover {
    border: 1px solid #b8202f
}

.btn.btn-default {
    background-color: #fff;
    color: #b8202f;
    border-color: #b8202f;
    width: 109.5px;
    height: 38px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    position: relative
}

    .btn.btn-default:hover {
        background-color: #b8202f;
        color: #fff
    }

.header_title {
    color: #b8202f
}

.underline-small {
    color: #b8202f;
    display: inline-block;
    position: relative
}

    .underline-small::after {
        content: '';
        height: 2px;
        width: 150px;
        background: #b8202f;
        position: absolute;
        left: calc(50% - 30%);
        bottom: -5px
    }

.banner-text {
    color: #b8202f;
    position: absolute;
    top: 150px;
    left: 174px;
    display: block;
    opacity: 1
}

.text-center {
    text-align: center
}

.banner-text-white {
    color: #fff;
    font-weight: 700;
    position: absolute;
    top: 150px;
    left: 174px;
    display: block
}

.banner-bg {
    background: rgba(0,0,0,.5)
}

.card-title {
    font-size: 16px;
    font-weight: 700;
    padding-top: 20px
}

.text-date {
    font-size: 13px;
    margin-top: 10px;
    margin-bottom: -5px
}

.service-type {
    color: #b8202f;
    font-weight: 700
}

.blog_sections .hero__banner__sec {
    background: url(../../images/blog/blog2.webp) center center;
    background-size: cover;
    width: 100%;
    height: auto
}

@media only screen and (min-width:1400px) {
    .hero__banner__sec {
        background: url(../../images/blog/blog2.webp) center center;
        background-size: cover;
        width: 100%;
        height: auto
    }

    .bg-black-opacity {
        background-color: rgba(0,0,0,.85)
    }

    .bg-black-opacity-light {
        background-color: rgba(0,0,0,.5)
    }

    #shade {
        height: 550px
    }
}

@media only screen and (min-width:1200px) {
    .hero__banner__sec {
        background: url(../../images/blog/blog2.webp) center center;
        background-size: cover;
        width: 100%;
        height: auto
    }

    .bg-black-opacity {
        background-color: rgba(0,0,0,.85)
    }

    .bg-black-opacity-light {
        background-color: rgba(0,0,0,.5)
    }

    #shade {
        height: 550px
    }
}

@media only screen and (min-width:320px)and (max-device-width :577px) {
    .hero__banner__sec {
        background: url(../../images/blog/blog1.webp) center center;
        background-size: cover;
        width: 100%;
        height: auto;
        background-position: top
    }

    .bg-black-opacity {
        background-color: rgba(0,0,0,.85)
    }

    .bg-black-opacity-light {
        background-color: rgba(0,0,0,.5)
    }

    #shade {
        height: 300px
    }
}

@media only screen and (min-device-width :768px) and (max-device-width :1024px) {
    .hero__banner__sec {
        background: url(../../images/blog/blog1.webp) center center;
        background-size: cover;
        width: 100%;
        height: auto;
        background-position: top
    }

    .bg-black-opacity {
        background-color: rgba(0,0,0,.85)
    }

    .bg-black-opacity-light {
        background-color: rgba(0,0,0,.5)
    }

    #shade {
        height: 550px
    }
}

@media only screen and (min-device-width :768px) and (max-device-width :1024px) and (-webkit-min-device-pixel-ratio:2) {
    .hero__banner__sec {
        background: url(../../images/blog/blog1.webp) center center;
        background-size: cover;
        width: 100%;
        height: auto;
        background-position: top
    }

    .bg-black-opacity {
        background-color: rgba(0,0,0,.85)
    }

    .bg-black-opacity-light {
        background-color: rgba(0,0,0,.5)
    }

    #shade {
        height: 550px
    }
}