/*-----------------------------------------------------------------------------------
    Template Name: Bolse
    Template URL: http://ideaz13.com/
    Description: This is html5 template
    Author: uXpart
    Author URI: http://ideaz13.com/
    Version: 1.0
-----------------------------------------------------------------------------------
    CSS INDEX
    ===================
    1. Theme Default CSS (body, link color, section etc)
       1.1 Top Header CSS (top-header, shirnk menu, Humburger, social Icon)
       1.2 Banner Area CSS (modal video, video-title)
       1.3 Service Area CSS
       1.4 Portfolioes Area CSS
       1.5 Process Area CSS
       1.6 Sucess Area CSS
       1.7 Team Area CSS
       1.8 Client Sayes CSS
       1.9 Brand Area CSS
       1.10 Creative Blog CSS
       1.11 Contact CSS
       1.12 Google Map CSS
       1.13 Footer Area CSS
    2. Blog
       2.1 Blog Banner CSS
       2.2 Blog Nav CSS
       2.3 Pagination Nav CSS
    ===================
-----------------------------------------------------------------------------------*/


/*----------------------------------------*/


/*  1. Theme default CSS
/*----------------------------------------*/

html,
body {
    height: 100%;
    image-rendering: -moz-crisp-edges;
    /* Firefox */
    image-rendering: -o-crisp-edges;
    /* Opera */
    image-rendering: -webkit-optimize-contrast;
    /* Webkit (non-standard naming) */
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
    /* IE (non-standard property) */
    scroll-behavior: smooth;
}

.floatleft {
    float: left
}

.floatright {
    float: right
}

.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px
}

.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px
}

.aligncenter {
    display: block;
    margin: 0 auto 15px
}

a:focus {
    outline: 0px solid
}

img {
    max-width: 100%;
    height: auto
}

.fix {
    overflow: hidden
}

p {
    margin: 0 0 15px;
    color: #000;
    font-size: 13px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 10px;
}

a {
    transition: all 0.3s ease 0s;
    text-decoration: none;
}

a:hover {
    color: #666666;
    text-decoration: none;
}

a:active,
a:hover {
    outline: 0 none;
    color: #757575;
}

.clear {
    clear: both
}

body {
    font-family: 'Montserrat', sans-serif;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

.no-border-r {
    border-right: 0px;
}

.m-bt-20 {
    margin-bottom: 20px;
}

.margin-0 {
    margin: 0;
}


/*button*/

.btn-center {
    text-align: center;
    margin: 50px 0 100px 0;
}

.btn {
    -moz-user-select: none;
    background-image: none;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 17px;
    font-weight: normal;
    line-height: 1.42857;
    margin: 10px 0;
    padding: 14px 50px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.btn:focus {
    color: #FFF;
    outline-offset: 0;
}

.btn-red {
    background-color: #f5734f;
    color: #fff;
}

.btn-red:hover {
    background-color: #484747;
    color: #fff;
    transition: 0.3s;
}

.btn-grey {
    background-color: #484747;
    color: #fff;
}

.btn-grey:hover {
    background-color: #CF694D;
    color: #fff;
    transition: 0.3s;
}


/*----------------------------------------*/


/*  1.1  Top Header CSS (top-header, shirnk menu, Humburger, social Icon)
/*----------------------------------------*/


/*top-header*/

.header-area {
    position: relative;
}

.brand {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 36px;
    color: #fff;
    letter-spacing: 2px;
    position: absolute;
    z-index: 50000;
}

.main-nav>a:hover,
a:focus {
    color: #ffffff;
    text-decoration: none;
}

.hamburger-right {
    float: right;
}


/*shirnk menu*/

header {
    float: left;
    width: 100%;
    position: fixed;
    z-index: 10;
    padding: 45px 0;
    display: block;
}

header a {
    color: #fff;
    text-decoration: none;
    font-size: 1.5em;
}

header a.active,
header a:hover {
    color: #b5b5b5;
}

header li {
    margin-right: 20px;
}


/* header large */

header.large {
    background: transparent;
}

header.small {
    background: rgba(31, 31, 31, 0.9);
    padding: 0;
}

header.small .brand {
    font-size: 1em;
}


/* Transitions */

header,
nav,
img,
li {
    transition: .7s all;
    -moz-transition: .7s all;
    -webkit-transition: .7s all;
    -o-transition: .7s all;
}


/*Menu*/

img.logo {
    float: left;
}

.main-nav {
    width: 100%;
    margin: 0 auto;
    padding-top: 12px;
    padding-bottom: 12px;
    position: relative;
}

.main-nav ul {
    margin-top: 20px;
    float: right;
    list-style: outside none none;
    margin: 0;
    padding: 0
}

.main-nav ul li {
    display: inline;
    line-height: 65px;
}

/*social Icon*/

.social-area {
    height: 258px;
    overflow: hidden;
    position: relative;
}

ul.social-icon {
    float: right;
    position: absolute;
    bottom: 6%;
    right: 0;
}

ul.social-icon li {
    margin: 0;
    padding: 0 13px;
}

ul.social-icon li:last-child {
    margin: 0;
    padding: 0;
}

ul.social-icon li a i:hover {
    color: rgba(244, 70, 22, 0.7);
    transition: all 0.3s ease 0s;
    text-decoration: none;
}

.social-icon>li {
    display: block;
    float: left;
    list-style: outside none none;
}


/*----------------------------------------*/


/*  1.2  Banner Area CSS (modal video, video-title)
/*----------------------------------------*/


/*banner area*/

.banner-area {
    position: relative;
    z-index: 1;
    min-height: 590px;
    background: url("img/banner-img.jpg") no-repeat scroll center center /cover;
    ;
}

.banner-area::after {
    background-color: #000000;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    opacity: 0.45;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}


/*video-title*/

.video-title {
    position: absolute;
    top: 30%;
    left: 0%;
    width: 100%;
    z-index: 4;
}

.video-title h2 {
    color: #fff;
    font-size: 42px;
    font-weight: bold;
    line-height: 1.2;
}

.video-title i {
    font-size: 60px;
    color: #fff;
}

.video-title a:hover {
    color: #ccc;
}

.icon-circel i {
    border-radius: 50%;
    border: 2px solid #fff;
    font-size: 26px;
    text-align: center;
    padding: 10px 8px 10px 12px;
    float: left;
}

.icon-circel i:hover {
    background: rgba(255, 255, 255, 0.95);
    color: #f5734f;
    border: 2px solid rgba(255, 255, 255, 0.95);
    transition: all 0.5s ease 0s;
    text-decoration: none;
}

.icon-circel {
    margin-top: 50px;
}

.icon-circel p {
    float: left;
    padding: 12px 14px 14px 14px;
    color: #fff;
    font-size: 18px;
}


/*----------------------------------------*/


/*  1.3 Service Area CSS
/*----------------------------------------*/

.service-area {
    background: #fff;
}

.heading-area {
    padding: 60px 0 36px 0;
}

.heading h2 {
    font-size: 40px;
}

.heading h4 span {
    color: rgba(51, 51, 51, 0.7);
    letter-spacing: 4px;
}

.heading h4 {
    color: #666666;
    letter-spacing: 0px;
    font-weight: bold;
}

.heading-details {
    line-height: 25px;
    font-size: 18px;
    letter-spacing: 0.8px;
}

.heading-details li {
    margin-top: 10px;
}

.details-area {
    padding-bottom: 50px;
}

.single-item {
    margin: 40px 0 0 0;
}

.single-item i {
    font-size: 44px;
    color: #3d3d3d;
}

.single-item>h4 {
    text-transform: uppercase;
    text-align: left;
    padding: 20px 0 4px 0;
    letter-spacing: 2px;
}

.single-item p {
    text-align: left;
    line-height: 34px;
    color: #212121;
    font-weight: 400;
    font-size: 18px;
}


/*----------------------------------------*/


/*  1.4 Portfolioes Area CSS
/*----------------------------------------*/

.portfolioes-area {
    background: #f8f8f8;
    overflow: hidden;
}

.portfolio-holder {
    margin: 0 -10px;
    overflow: hidden;
}

.portfolio-holder>.col-md-2 {
    width: 20%;
    padding: 10px;
}

.single_our_work {
    overflow: hidden;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: relative;
}

.single_our_work img {
    width: 100%;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

.single_our_work figure {
    margin-bottom: 0;
}

.sing_work_text_link {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    color: #fff;
    background: rgba(224, 53, 0, 0.6);
    -webkit-transition: .5s;
    transition: .3s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
}

.sing_work_content_wrap {
    display: table;
    height: 100%;
    width: 100%;
}

.sing_work_content {
    display: table-cell;
    vertical-align: middle;
}

.sing_link_img a {
    color: #fff;
    display: inline-block;
    font-size: 34px;
    transition: all 0.3s ease 0s;
}

.sing_link_img a:hover {
    color: #ccc;
}

.single_our_work:hover .sing_link_img a.search {
    -webkit-animation: slideInDown 800ms ease-in-out;
    animation: slideInDown 800ms ease-in-out;
}

.single_our_work:hover .sing_link_img a.link {
    -webkit-animation: slideInDown 800ms ease-in-out;
    animation: slideInDown 800ms ease-in-out;
}

.single_our_work:hover {
    background: #ff5f83;
    color: #fff;
}

.single_our_work:hover .sing_work_text_link {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
}

.load-item {
    display: none;
}

.load-more {
    margin: 40px 0 0;
    text-align: center;
}


/*----------------------------------------*/


/*  1.5 Process Area CSS
/*----------------------------------------*/

.process-area {
    background: #fff;
}


/*----------------------------------------*/


/*  1.6 Sucess Area CSS
/*----------------------------------------*/

.success-area {
    background: rgba(0, 0, 0, 1);
    position: relative;
    z-index: 1
}

.success-area::after {
    background: rgba(0, 0, 0, 0) url("img/success-bg.jpg") no-repeat scroll center center /cover;
    ;
    bottom: 0;
    content: "";
    display: block;
    opacity: 0.4;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.secess-holder>li {
    border-right: 3px solid #ccc;
    color: #fff;
    float: left;
    margin: 10.6% 0;
    padding: 0 60px;
    text-align: center;
    text-transform: uppercase;
}

.secess-holder>li h1 {
    font-size: 58px;
    font-weight: bold;
}

.secess-holder>li:last-child {
    border-right: 0px;
}


/*----------------------------------------*/


/*  1.7 Team Area CSS
/*----------------------------------------*/

.single-team {
    position: relative;
    margin: 0 auto;
    padding: 30px 0 0 0;
    max-width: 1000px;
    list-style: none;
    text-align: center;
}

.single-team figure {
    cursor: pointer;
    overflow: hidden;
    position: relative;
}

.single-team figure img {
    position: relative;
    display: block;
}

.single-team figure figcaption {
    padding: 2em;
    color: #fff;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.single-team figure figcaption::before,
.single-team figure figcaption::after {
    pointer-events: none;
}

.single-team figure figcaption,
.single-team figure figcaption>a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Anchor will cover the whole item by default */

.single-team figure figcaption>a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.single-team figure h4 {
    word-spacing: -0.15em;
    font-weight: 300;
}

.single-team figure h4,
.single-team figure p {
    margin: 0;
}

.single-team figure p {
    font-size: 68.5%;
    letter-spacing: 13px;
}


/*Effect*/

figure.effect-zoe figcaption {
    top: auto;
    top: 0;
    left: 0;
    padding: 1em;
    background: rgba(245, 115, 79, 0.8);
    color: #3c4a50;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
}

figure.effect-zoe h4 {
    text-align: center;
}

figure.effect-zoe p.icon-links a {
    color: #3c4a50;
    font-size: 1.4em;
}

figure.effect-zoe:hover p.icon-links a:hover,
figure.effect-zoe:hover p.icon-links a:focus {
    color: #252d31;
}

figcaption>.caption-details {
    bottom: 10%;
    left: 0;
    position: absolute;
    width: 100%;
}

figcaption>.caption-details h2 a {
    text-align: center;
}

figure.effect-zoe p.icon-links a span::before {
    padding: 8px 10px;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

figure.effect-zoe h4,
i {
    display: inline-block;
    color: #fff;
}

figure.effect-zoe:hover figcaption {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

p.icon-links a i:hover {
    color: rgba(31, 31, 31, 0.7);
    transition: all 0.3s ease 0s;
    text-decoration: none;
}


/*----------------------------------------*/


/*  1.8 Client Sayes CSS
/*----------------------------------------*/

.client-area {
    background: rgba(0, 0, 0, 1) none repeat scroll 0 0;
    padding: 110px 0;
    position: relative;
    z-index: 1;
    line-height: 2;
    color: #fff;
    clear: both;
}

.client-area::after {
    background: rgba(0, 0, 0, 0) url("img/client-sayes.jpg") no-repeat scroll center center /cover;
    ;
    bottom: 0;
    content: "";
    display: block;
    opacity: 0.3;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.client-sayes {
    position: relative;
    margin-left: 11%;
}

.single-clint-carousel {
    padding-right: 10px;
}

.single-clint-carousel h4 {
    color: #fff;
    text-transform: uppercase;
}

.single-clint-carousel h4 {
    color: #fff;
    text-transform: uppercase;
}

.single-clint-carousel p {
    color: #fff;
    line-height: 30px;
    font-size: 14px;
    letter-spacing: 1px;
}

.client-sayes .owl-controls .owl-prev {
    left: -95px;
    position: absolute;
    top: 18px;
}

.client-sayes .owl-controls .owl-next {
    right: -60px;
    position: absolute;
    top: 18px;
}


/*----------------------------------------*/


/*  1.9 Brand Area CSS
/*----------------------------------------*/

.brand-area {
    background: rgba(255, 255, 255, 1) none repeat scroll 0 0;
    padding: 55px 78px;
}

.brand-single {
    padding: 15px;
    cursor: pointer;
    -webkit-filter: contrast(0%);
    /* Safari 6.0 - 9.0 */
    filter: contrast(0%);
}

.brand-single:hover {
    cursor: pointer;
    -webkit-filter: none;
    /* Safari 6.0 - 9.0 */
    filter: none;
    transform: scale(1.1, 1.1);
    transition: 0.3s;
}


/*----------------------------------------*/


/*  1.10 Creative Blog CSS
/*----------------------------------------*/

.clreative-blog-area {
    background: #f8f8f8 none repeat scroll 0 0;
    height: auto;
    overflow: hidden;
}

.clreative-blog-area .row {
    margin-right: 0;
}

.blog {
    background: #fff;
    padding-bottom: 0 !important;
}

.blog-row1 {
    clear: both;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.blog-row2 {
    clear: both;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.blog-red-line {
    width: 56px;
    height: 2px;
    background: #f5734f;
    position: absolute;
    top: 50%;
    left: 48%;
    z-index: 5;
}

.blog-img {
    width: 50%;
    float: left;
    height: 100%;
}

.blog-details {
    float: left;
    height: auto;
    padding: 4% 31px 0 4%;
    width: 50%;
    overflow: hidden;
}

.blog-details>h4,
h3 {
    /*text-transform: uppercase;*/
}

.blog-details>p {
    color: #95999c;
    font-size: 14px;
    line-height: 30px;
}

.blog-pagination {
    padding: 62px 0 120px 0;
}


/*----------------------------------------*/


/*  1.11 Contact CSS
/*----------------------------------------*/

.contact-info h5 {
    font-size: 11px;
    font-weight: 500;
    margin-bottom: 2px;
}

.contact-info p {
    font-size: 18px;
    color: #000;
    letter-spacing: 1px;
    margin-bottom: 2px;
}

.contact-info a {
    color: #000;
    text-decoration: none;
}


.contact-form {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    font-size: 14px;
    height: 60px;
    line-height: 1.42857;
    padding: 18px 30px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
    margin: 30px 0;
}

.contact-form:focus {
    border-color: #f5734f;
    outline: 0 none;
}

.contact-form-area form>textarea {
    height: 140px;
}


/*----------------------------------------*/


/*  1.13 Footer Area CSS
/*----------------------------------------*/

.footer-top {
    background: #1f1f1f;
}

.footer-brand {
    color: #fff;
    display: block;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: 2px;
    margin: 100px 0;
    text-align: center;
    text-transform: uppercase;
}

.footer-brand a {
    color: #fff;
}

.footer-brand>p.icon-links {
    margin-top: 22px;
}

.footer-brand>p.icon-links>a {
    padding: 0 10px;
}

.footer-bottom {
    background: #F5F5F5;
    font-size: 14px;
    padding-top: 26px;
    color: #000;
    text-align: center;
}


/*----------------------------------------*/


/*  2. Blog CSS
/*----------------------------------------*/


/*----------------------------------------*/


/*  2.1 Blog Banner CSS
/*----------------------------------------*/

.banner-area-blog {
    background: rgba(0, 0, 0, 1);
    position: relative;
    z-index: 1
}

.banner-area-blog::after {
    background: rgba(0, 0, 0, 0) url("img/blog-banner.jpg") no-repeat scroll center center /cover;
    ;
    bottom: 0;
    content: "";
    display: block;
    opacity: 0.60;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.blog-content {
    color: #fff;
    float: left;
    margin: 312px 30% 200px 30%;
    padding: 0 63px;
    text-align: center;
    font-weight: bold;
}

.blog-content h1 {
    font-weight: bold;
    letter-spacing: 3px;
    font-size: 45px;
}

.bedcrumb {
    width: 100%;
    margin: 0 18%;
}

.bedcrumb ul {
    float: none;
}

.bedcrumb ul li {
    float: left;
    display: block;
    padding: 0 3px;
}

.bedcrumb ul li a {
    font-size: 20px;
    color: #fff;
}

.bedcrumb ul li a:hover {
    color: #f5734f;
}


/*----------------------------------------*/


/*  2.2 Blog Nav CSS
/*----------------------------------------*/

.blog-nav {
    background-color: #fff;
    box-shadow: 0px 0px 8px #ececec;
    width: 100%;
    color: #fff;
}

.left-nav {
    float: left;
}

.right-nav {
    float: right;
}

.right-nav,
.left-nav ul li {
    display: inline-block;
    text-transform: uppercase;
    padding: 30px;
}

.right-nav ul li a {
    color: #666666;
}

.left-nav ul li a {
    color: #666666;
}

.left-nav ul li a:hover {
    color: #f5734f;
}

.right-nav ul li a:hover {
    color: #f5734f;
}


/*----------------------------------------*/


/*  2.3 Pagination Nav CSS
/*----------------------------------------*/

.pagination-nav ul li {
    padding: 30px 10px;
    display: inline-block;
    text-align: center;
}

.pagination-nav ul {
    float: none;
}

.pagination-nav {
    display: block;
    width: 100%;
    text-align: center;
    clear: both;
}

.pagination-nav ul li i {
    color: #666666;
}

.pagination-nav ul li i:hover {
    color: #f5734f;
}

.pagination-nav ul li a {
    color: #666666;
}

.pagination-nav ul li a:hover {
    color: #f5734f;
}


/* ADDITION for responsive header */

@media only screen and (max-width: 1020px) {
    .main-nav ul {
        display: none;
    }
}


/* scroll down */

#section07 a {
    padding-top: 80px;
}

#section07 a span {
    position: absolute;
    bottom: -15px;
    left: 50%;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb07 2s infinite;
    animation: sdb07 2s infinite;
    opacity: 0;
    box-sizing: border-box;
}

#section07 a span:nth-of-type(1) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}

#section07 a span:nth-of-type(2) {
    bottom: -30px;
    -webkit-animation-delay: .15s;
    animation-delay: .15s;
}

#section07 a span:nth-of-type(3) {
    bottom: -45px;
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
}

@-webkit-keyframes sdb07 {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes sdb07 {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


/*----------------------------------------*/


/* GD ADDITIONS
/*----------------------------------------*/

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

h5.card-title {
    color: rgba(51, 51, 51, 0.7);
}

button.btn-send {
    border-radius: 0;
    background-color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    color: rgba(51, 51, 51, 0.7);
    border-color: rgba(51, 51, 51, 0.7);
    border: 4px solid;
}

button.btn-send:hover {
    background-color: rgba(51, 51, 51, 0.7);
    color: #fff;
    border-color: rgba(51, 51, 51, 0.7);
}

.successSending,
.errorSending,
.errorValidate,
.errorCaptcha {
    display: none;
}

input.form-control,
select.form-control {
    border-radius: 5px;
    border-color: #fff;
    height: 45px;
    -webkit-box-shadow: 0 0 10px #e2e2e2;
    box-shadow: 0 0 10px #e2e2e2;
}

textarea.form-control {
    border-radius: 5px;
    border-color: #fff;
    -webkit-box-shadow: 0 0 10px #e2e2e2;
    box-shadow: 0 0 10px #e2e2e2;
    height: 100px;
}

.ppolicy-link {
    color: #0099A6;
}

div>video {
    background-image: url('./img/videoBg.png') center center;
}

.feature-video {
    background: url(./img/videoBg.png) center 5px;
    background-size: contain;
    background-repeat: no-repeat;
}

.cta-secondary {
    color: #fff;
    font-size: 1.3em;
    padding: 15px 30px;
    border: #fff 1px solid;
    border-radius: 35px;
    max-width: 250px;
    text-align: center;
    margin-top: 40px;
    text-transform: uppercase;
}

.cta-primary {
    color: #000;
    background-color: #fff;
    font-size: 1.3em;
    padding: 15px 30px;
    border: #000 1px solid;
    border-radius: 35px;
    max-width: 290px;
    text-align: center;
    margin-top: 40px;
    text-transform: uppercase;
    font-weight: 600;
}

.cta-page {
    color: #000;
    font-size: 1.3em;
    padding: 15px 30px;
    border: #000 1px solid;
    border-radius: 35px;
    max-width: 400px;
    text-align: center;
    margin-top: 40px;
    text-transform: uppercase;
    font-weight: 600;
    background: transparent;
}

.sticky {
    position: fixed;
    top: 150px;
    right: -35px;
    display: block;
    z-index: 2;
}

.sticky-mobile{
    position: fixed;
    bottom: 15px;
    right: 15px;
    display: none;
    z-index: 20;
}

.cta-sticky {
    color: #000;
    font-size: 1.3em;
    padding: 15px 50px 15px 30px;
    background: transparent;
    border: #000 1px solid;
    border-radius: 35px;
    max-width: 290px;
    text-align: center;
    margin-top: 40px;
    text-transform: uppercase;
    font-weight: 600;
}

.video-player {
    background-image: url(./img/salesProcessBlur.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    width: 100%;
}

.demos {
    width: 100%;
    padding: 100px;

}

.demos>h3 {
    font-weight: bold;
    text-transform: uppercase;
}

.demos a {
    color: #000;
    text-decoration: none;
}

.detail-heading {
    font-size: 0.9em;
    color: #666666;
    letter-spacing: 0px;
    font-weight: bold;
}

.white-section {
    background: #fff;
    box-shadow: 0 8px 11px -11px grey;
    position: relative;
}

div.news-item {
    min-height: 470px;
    margin-top: 10px;
}

.news-heading {
    min-height: 190px;
}

.news-heading h3 {
    line-height: 30px;
}

.news-desc a {
    font-size: 1.2em;
    text-decoration: none;
    font-weight: bold;
    color: #000;
    position: absolute;
    bottom: 30px;
}

.testimonial p {
    font-size: 1.6em;
}


@media (max-width:320px) {
    /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
}

@media (max-width:600px) {
    /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */
}

@media (max-width:801px) {
    /* tablet, landscape iPad, lo-res laptops ands desktops */
    .banner-area{
        min-height: 700px;
    }
    .demos{
        padding: 75px;
    }
    #contactForm .form-row div{
        margin-bottom: 20px;
    }
    .contact-info{
        margin-top: 100px;
        text-align: left;
    }
    .carousel-control-next{
        display: none;
    }
    .sticky-mobile{
        display: block;
        max-width: 175px;
        font-size: 0.9em;
        padding: 5px;
    }
    .cta-sticky{
        padding: 15px 20px;
        background: #fff;
    }
    .cta-sticky span{
        font-size: 1.3em;
    }
    .cta-page{
        padding: 10px 20px;
    }
}

@media (max-width:480px) {
    /* smartphones, Android phones, landscape iPhone */
    .banner-area{
        min-height: 800px;
    }
    .demos{
        padding: 20px;
    }
    .news-item {
        min-height: 400px;
    }
    .news-heading {
        min-height: 125px;
    }
    .news-desc a{
        margin-bottom: 20px;
    }
    .carousel-control-next{
        display: flex;
    }
    .sticky{
        display: none;
    }
    .sticky-mobile{
        display: block;
        max-width: 175px;
        font-size: 0.9em;
        padding: 5px;
    }
    .cta-sticky{
        padding: 15px 20px;
        background: #fff;
    }
    .cta-sticky span{
        font-size: 1.3em;
    }
    .cta-primary{
        margin-top: 0;
    }
    .cta-page{
        padding: 10px 20px;
    }
}

@media (max-width:1025px) {
    /* big landscape tablets, laptops, and desktops */

}

@media (max-width:1281px) {
    /* hi-res laptops and desktops */

}



/* CSS END
/*----------------------------------------