/* home */

.full-content {

    width: 100%;

    float: left;

}

#content,
#primary,
.content-box {

    width: 100%;

    float: left;

}

.home #row-wrap-content {

    float: left;

    width: 100%;

}

.row {

    float: left;

    width: 100%;

}

/*  About */

.about-heading {

    margin-bottom: 30px;

    float: left;

    width: 100%;

}

.home h2.title {

    margin-bottom: 10px;

    margin-top: 45px;

    font-size: 36px;

}

.title {

    font-weight: 500;

    color: #3c4858;

    text-decoration: none;

}

.description {

    color: #4a4a4a;

}

h5.description {

    width: 80%;

    margin: 0 auto;

    font-size: 20px;

    line-height: 2em;

}

.about-body,
.about-footer {

    float: left;

    width: 100%;

}

.column-about {

    float: left;

    width: 23.5%;

    margin-right: 2%;

}

.column-about:last-child {

    margin-right: 0;

}

.info {

    padding: 5px 0;

}

.info .info-title {

    color: #3c4858;

    margin: 30px 0 15px;

    font-size: 22px;

}

#about .info p {

    color: #4a4a4a;

    margin: 0 0 10px;

    font-size: 16px;

    line-height: 25px;

}

.column-content {

    float: left;

    width: 42%;

    box-sizing: border-box;

    padding: 0 15px;

}

.coloumn-image {

    width: 58%;

    float: right;

}

#about .about-footer .info {

    padding: 20px 0 10px;

}

.info-horizontal {

    float: left;

    width: 100%;

}

.info-horizontal .icon {

    float: left;

    width: 15%;

    text-align: center;

}

.info-horizontal .description {

    float: left;

    width: 85%;

}

.info-horizontal .info-title {

    margin: 0 0 5px 0;

}

.about-footer .coloumn-image {

    margin-top: 100px;

}

.coloumn-image .img-thumbnail {

    background-color: #fff;

    border: 1px solid #ddd;

    max-width: 100%;

    padding: 4px;

    box-sizing: border-box;

}



/* Blog */

#blog {

    margin-top: 35px;

    background-color: #fafafa;

    padding-bottom: 40px;

}

.blog-heading {

    float: left;

    width: 100%;

    margin-bottom: 30px;

}

.blog-body {

    float: left;

    width: 100%;

}

.bx-wrapper .bx-viewport {

    background-color: #fafafa !important;

    box-shadow: none !important;

    border: none !important;

    left: 0 !important;

}

.card-excerpt p {
    overflow: hidden;
    height: 173px;
}

.blog-slider .card {

    float: left;

    width: 100%;

    margin-bottom: 30px;

}

.blog-slider .card .card-blog {

    background: #fff none repeat scroll 0 0;

    color: rgba(0, 0, 0, 0.87);

    display: inline-block;

    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);

}

.blog-slider .card:hover .card-blog {

    box-shadow: 0px 0px 20px 0px rgba(145, 88, 217, 0.7);

}

.card-blog .card_image {

    overflow: hidden;

    position: relative;
    height: 315px;
}

.card-blog .card_image img {

    border-top-left-radius: 3px;

    border-top-right-radius: 3px;

    pointer-events: none;

    object-fit: scale-down;
    min-height: 100% !important;

    transition: all 0.5s ease-in-out 0s;

}

.card:hover .card-blog .card_image img {

    transition: all 0.5s ease-in-out 0s;

    transform: scale(1.1);

    -webkit-transform: scale(1.1);

    -ms-transform: scale(1.1);

}

.card_content {

    padding: 15px 30px;

}

p.category {

    margin: 0;

}

p.category a {

    margin: 10px 0;

    font-size: 14px;

    color: #03a9f4;

}

p.time {

    background: url("images/fa-clock-o.png") no-repeat 0 50%;

    padding-left: 20px;

    vertical-align: middle;

}

h4.card-title {

    margin: 10px 0;

}

h4.card-title a,
h4.card-title a:hover {

    font-weight: 700;

    font-size: 18px;

    color: #3c4858;

    text-decoration: none;

    display: block;

}

.card-decription {

    color: #999999;

}



/* Clients */

#clients {

    position: relative;

    background-image: url("images/bg2.jpg");

    background-size: cover;

    color: #fff;

    margin-top: 0;

    padding: 70px 0;

}

#clients::before {

    background-color: rgba(57, 58, 183, 0.7);

    bottom: 0;

    content: "";

    left: 0;

    position: absolute;

    right: 0;

    top: 0;

}

.clients-heading,
.clients-footer {

    float: left;

    width: 100%;

}

#clients .title,
#clients .description {

    color: #fff;

    position: relative;

}

.clients-body {

    float: left;

    width: 100%;

    margin-bottom: 16px;

    padding: 20px;

    box-sizing: border-box;

}

.clients-text {

    float: left;

    width: 40%;

    padding-bottom: 30px;

    position: relative;

}

#clients .clients-text h2 {

    margin: 20px 0 10px 0;

    font-size: 36px;

}

#clients .clients-text p {

    font-size: 16px;

}

.clients-footer-slider {

    float: right;

    width: 50%;

}

.clients-footer-slider .owl-carousel .owl-stage-outer {

    border-radius: 5px;

    background: #fff none repeat scroll 0 0;

}

.review-info {

    color: #3e3e3e;

    padding: 40px;

    border-radius: 5px;

}

#clients .review-info .img-circle {

    border-radius: 50%;

    max-width: 4rem;

    height: 4rem;

    display: inline-block;

}

.review-content blockquote {

    padding: 10px 20px;

    margin: 0 0 20px;

    font-size: 17px;

}

.review-content .review-author {

    font-size: 16px;

}

#clients .owl-theme .owl-dots {

    display: inline-block;

    left: 0;

    margin: 0 7px;

    position: relative;

    top: 5px;

    vertical-align: middle;

    width: 100%;

}

.clients-footer-slider .owl-theme .owl-dots .owl-dot span {

    width: 6px;

    background: #fff none repeat scroll 0 0;

    opacity: 0.5;

    transition: 0.5s;

    height: 10px;

    border-radius: 5px;

    display: block;

    outline: 0 none;

}

.clients-footer-slider .owl-theme .owl-dots .owl-dot.active span,
.clients-footer-slider .owl-theme .owl-dots .owl-dot:hover span {

    height: 20px;

    background: #fff none repeat scroll 0 0;

    opacity: 1;

    width: 6px;

}



/* Trial */

#trial {

    background-color: #00a3d3;

    color: #fff;

    padding: 40px 0;

}

.wrap-trial {

    float: left;

    width: 100%;

}

.trial-left {

    float: left;

    width: 65%;

}

.trial-right {

    float: left;

    width: 35%;

}

h2.trial-title {

    font-size: 36px;

    margin: 20px 0 10px;

}

.btn-default,
.btn-default:hover {

    padding: 18px 36px;

    box-sizing: border-box;

    background-color: #9158d9;

    color: #ffffff;

    border: none;

    border-radius: 5px;

    text-transform: uppercase;

    position: relative;

    font-weight: 400;

    cursor: pointer;

    float: none;

}

.trial-btn,
.trial-btn:hover {

    margin-top: 20px;

    background-color: #fbc02d;

}

/*Responsive*/

@media only screen and (max-width: 800px) {

    .home h2.title,

    #clients .clients-text h2 {

        margin-bottom: 5px;

        margin-top: 20px;

        font-size: 28px;

    }

    h5.description {

        width: 80%;

        margin: 0 auto;

        font-size: 16px;

        line-height: 1.7em;

    }

    .info .info-title {

        font-size: 20px;

    }

    h5.description {

        font-size: 15px;

    }

    #about .info p {

        margin: 0 0 5px;

        font-size: 15px;

        line-height: 20px;

    }

    #about .about-footer .info {

        padding: 10px 0 0;

    }

    .card_content {

        padding: 10px;

    }

    .clients-body {

        float: left;

        width: 100%;

        margin-bottom: 0;

        padding: 0 0 10px;

        box-sizing: border-box;

    }

    .review-info {

        padding: 20px 10px;

    }

    .review-content blockquote {

        font-size: 15px;

        margin-bottom: 10px;

    }

    #clients {

        padding: 30px 0;

    }

    .about-footer .coloumn-image {

        margin-top: 20px;

    }

    #blog {

        margin-top: 15px;

        padding-bottom: 15px;

    }

}

@media only screen and (max-width: 768px) {



    .column-content h2.title,
    .clients-text {
        text-align: center
    }

    h5.description {

        width: 100%;

        margin: 0 auto;

        font-size: 15px;

        line-height: 1.7em;

        text-align: justify;

    }

    #about .info p {

        font-size: 15px;

    }



}

@media only screen and (max-width: 767px) {

    .inner-container {

        padding: 0px 10px !important;

    }


}

@media only screen and (max-width: 640px) {

    .column-content,
    .coloumn-image,
    .clients-text,
    .clients-footer-slider,
    .trial-left,
    .trial-right {
        width: 100%;
        float: left
    }

    .about-body {

        display: flex;

        justify-content: space-between;

        flex-wrap: wrap;

    }

    .column-about {
        width: 49%;

        margin-right: 0;
    }



    h5.description {

        width: 100%;

        font-size: 14px;

    }

    .home h2.title {
        font-size: 28px;
        margin-top: 20px
    }

    .column-content {
        padding: 0;
    }

    .info .info-title {

        color: #3c4858;

        margin: 0px 0 5px;

        font-size: 20px;

    }

    .home h2.title,

    #clients .clients-text h2 {

        margin-bottom: 5px;

        margin-top: 15px;

        font-size: 22px;

    }



}

@media only screen and (max-width: 400px) {

    .column-about {
        width: 100%;
        float: left;
        margin: 0;
    }

}