﻿.highlightContainer {
    text-align: center;
    padding-top: 17rem;
    padding-bottom: 6rem;
    position: relative;
}

.highlightContainer {
    position: relative;
    z-index: 2;
}

.highlightOuterCont {
    position: relative;
    overflow: hidden;
}

.higlightTitle {
    position: relative;
    padding: 0 0 2.5rem 0;
}

    .higlightTitle .innerBlock {
        margin: auto auto;
        position: relative;
        z-index: 8;
        line-height: 12px;
    }

    .higlightTitle:after,
    .higlightTitle:before {
        position: absolute;
        content: "";
        border-top: 3px solid #e9e9e0;
        display: block;
        z-index: 9;
        width: 33%;
        bottom: 66px;
    }

    .higlightTitle:after {
        right: 0;
    }

.highlightContainer .innerBlock > span.span-header {
    text-align: center;
    font-size: 2rem;
    text-transform: capitalize;
    color: #fff;
	position: relative;
    top: -1.25rem;
}


.highlightContainer .higlightTitle .innerBlock > span.span-header::before {
    content: "";
    background-image: url(../images/conmee-Icon-white.png);
    position: absolute;
    left: 50%;
    width: 100px;
    display: block;
    height: 41px;
    width: 41px;
    background-repeat: no-repeat;
    top: -48px;
    transform: translate(-50%);
}

.highlightContainer .highlight-img-text {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}

.highlightContainer .owl-item a.highlight-card .highlight-text {
    position: absolute;
    bottom: 0;
    text-align: center;
    width: 100%;
    height: 108px;
}

.highlightContainer .owl-item:nth-child(odd) a.highlight-card .highlight-text {
    background-color: rgba(47,102,80, 0.6);
}

.highlightContainer .owl-item:nth-child(even) a.highlight-card .highlight-text {
    background-color: rgba(36,102,164, 0.6);
}

.highlightContainer .owl-item:nth-child(odd) a.highlight-card:hover .highlight-text {
    background-color: rgba(47,102,80, 1);
}

.highlightContainer .owl-item:nth-child(even) a.highlight-card:hover .highlight-text {
    background-color: rgba(36,102,164, 1);
}

.highlightContainer .highlight-text .card-title {
    color: #FFF;
    margin: 0 auto;
    font-size: 1.25rem;
    font-weight: 600;
    padding: 2.4rem 0 1rem 0rem;
    text-transform: capitalize;
    letter-spacing: 0.5px;
}

.highlightContainer .highlight-img {
    overflow: hidden;
}

    .highlightContainer .highlight-img img {
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

.highlightContainer .highlight-card:hover .highlight-img img {
    -webkit-transform: scale(1.2) rotate( -7deg);
    -moz-transform: scale(1.2) rotate(-7deg);
    -ms-transform: scale(1.2) rotate(-7deg);
    -o-transform: scale(1.2) rotate(-7deg);
    transform: scale(1.2) rotate( -7deg);
}

.highlightContainer .owl-prev span,
.highlightContainer .owl-next span {
    color: #FFF;
}

    .highlightContainer .owl-prev span:hover,
    .highlightContainer .owl-next span:hover {
        color: #2f6650;
    }

.highlightContainer .owl-nav {
    position: absolute;
    top: 38%;
    transform: translateY(38%);
    height: inherit;
    width: 100%;
}

.highlightContainer .owl-prev,
.highlightContainer .owl-next {
    position: absolute;
    height: 73px;
    width: 77px !important;
    background-color: #246098 !important;
    color: #fff !important;
    outline: none !important;
}
#highlightContainer .owl-carousel.Highlight-carousel
{
    width:77%;
    margin:0 auto;
}
.highlightContainer .owl-prev {
    left: -14.7%;
    transform: translateX(-14.7%);
    -webkit-border-radius: 0 50% 50% 0;
    -moz-border-radius: 0 50% 50% 0;
    border-radius: 0 50% 50% 0;
}

.highlightContainer .owl-next {
    right: -14.7%;
    transform:translateX(14.7%);
    -webkit-border-radius: 50% 0% 0% 50%;
    -moz-border-radius: 50% 0% 0% 50%;
    border-radius: 50% 0% 0% 50%;
}

.Highlight-carousel .owl-prev:hover,
.Highlight-carousel .owl-next:hover {
    background: #2f6650 !important;
    color: #FFF !important;
}

.highlightContainer .owl-prev i,
.highlightContainer .owl-prev span.i,
.highlightContainer .owl-next i,
.highlightContainer .owl-next span.i{
    font-size: 1.5rem;
    font-weight: bold;
}

.highlightContainer .highlight-2 .card-title {
    width: 63%;
}

.highlightOuterContList .row {
    margin-left: -15px;
    margin-right: -15px;
}

.highlightOuterContList .card-text {
    color: #353535;
    font-size: 1rem;
    font-weight: 400;
    min-height: 45px;
}

.highlightOuterContList .card-title {
    font-size: 1.125rem;
    color: #00a69c;
}

.highlightOuterContList .card:hover .card-title {
    color: #fcb712;
}

.highlightOuterContList .card-body span {
    font-size: 0.875rem;
    font-weight: 600;
}

    .highlightOuterContList .card-body span i {
        font-size: 0.75rem;
    }

@media only screen and (max-width:1700px) {
    /*#highlightContainer .owl-carousel.Highlight-carousel {
        width: 92%;
        margin: 0 auto;
    }*/
}

@media only screen and (max-width:1500px) {
    .highlightContainer .highlight-text .card-title {
        font-size: 1.125rem;
    }

    .higlightTitle:after, .higlightTitle:before {
        width: 29%;
    }
}

@media only screen and (max-width:1400px) {
    .highlightContainer .highlight-text .card-title {
        width: 94%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 63%;
    }
}

@media only screen and (max-width:1300px) {
    .highlightContainer .highlight-text .card-title {
        width: 70%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 57%;
    }

    .higlightTitle:after, .higlightTitle:before {
        width: 25%;
    }
}

@media only screen and (max-width:1190px) {
    .highlightContainer h2 {
        font-size: 1.8rem;
    }
}

@media only screen and (max-width:1160px) {
    .highlightContainer .highlight-text .card-title {
        width: 75%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 60%;
    }
}

@media only screen and (max-width:1050px) {
    .highlightContainer .highlight-text .card-title {
        width: 87%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 63%;
    }
}

@media only screen and (max-width:1023px) {
    #highlightContainer .owl-carousel.Highlight-carousel {
        /*width: 85%;
        margin: 0 auto;*/
    }

    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.6rem;
    }
}

@media only screen and (max-width:1100px) {
    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.7rem;
    }
}

@media only screen and (max-width:991px) {
    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.5rem;
    }

        .highlightContainer h2 span {
            font-size: 1.125rem;
        }

    .higlightTitle:after, .higlightTitle:before {
        width: 22%;
    }
}

@media only screen and (max-width:860px) {
    .highlightContainer .highlight-text .card-title {
        width: 75%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 60%;
    }
}

@media only screen and (max-width:800px) {
    .highlightContainer .highlight-text .card-title {
        width: 80%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 63%;
    }
}

@media only screen and (max-width:767px) {
    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.4rem;
    }

        .highlightContainer h2 span {
            font-size: 1.1rem;
        }

    .highlightContainer .highlight-text .card-title {
        width: 94%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 63%;
    }

    #highlightContainer .owl-carousel.Highlight-carousel {
        /*width: 80%;
        margin: 0 auto;*/
    }

    .higlightTitle:after, .higlightTitle:before {
        width: 18%;
    }
    .highlightContainer .owl-prev i,
	.highlightContainer .owl-prev span.i,
	.highlightContainer .owl-next i,
	.highlightContainer .owl-next span.i
    {
        font-size:1.2rem;
    }
    .highlightContainer .owl-prev, .highlightContainer .owl-next
    {
        height: 53px;
    width: 67px !important;
    }
}

@media only screen and (max-width:700px) {

    .highlightContainer .highlight-text .card-title {
        width: 50%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 40%;
    }
}

@media only screen and (max-width:600px) {

    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.3rem;
    }

        .highlightContainer h2 span {
            font-size: 1rem;
        }

    .highlightContainer .highlight-text .card-title {
        width: 65%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 45%;
    }

    #highlightContainer .owl-carousel.Highlight-carousel {
        width: 64%;
        margin: 0 auto;
    }
    
    .highlightContainer .owl-prev, .highlightContainer .owl-next {
        height: 51px;
        width: 57px !important;
    }

        .highlightContainer .owl-prev i,
		.highlightContainer .owl-prev span.i,
		.highlightContainer .owl-next i,
		.highlightContainer .owl-next span.i {
            font-size: 1.2rem;
        }
    .highlightContainer .owl-prev {
    left: -24.7%;
    transform: translateX(-24.7%);
}

.highlightContainer .owl-next {
    right: -24.7%;
    transform:translateX(24.7%);
}
}

@media only screen and (max-width:500px) {

    .highlightContainer .innerBlock > span.span-header {
        font-size: 1.2rem;
    }

        .highlightContainer h2 span {
            font-size: 0.9rem;
        }

    .highlightContainer .highlight-text .card-title {
        width: 80%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 55%;
    }



}
@media only screen and (max-width:450px) {
    .highlightContainer .owl-prev i,
	.highlightContainer .owl-prev span.i,
	.highlightContainer .owl-next i,
	.highlightContainer .owl-next span.i
    {
        font-size:14px;
    }
    .highlightContainer .owl-prev, .highlightContainer .owl-next
    {
        height: 47px;
    width: 52px !important;
    }
}
@media only screen and (max-width:400px) {
    .highlightContainer .innerBlock > span.span-header.span-header {
    font-size: 15px;
}
    .higlightTitle:after, .higlightTitle:before {
    width: 13%;
}
    .highlightContainer .highlight-text .card-title {
        width: 94%;
    }

    .highlightContainer .highlight-2 .card-title {
        width: 63%;
    }

    .highlightContainer .highlight-text .card-title {
        font-size: 1rem;
    }
}
