/*
================================
Construction Plus css stylesheet
================================
*/


/*Page loader css*/

.no-js #loader {
    display: none;
}

.js #loader {
    display: block;
    position: absolute;
    left: 100px;
    top: 0;
}

.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999999999999;
    background: url('../images//Preloader_10.gif') center no-repeat #fff;
}


/*page loader css end*/

.marginPadding-remove {
    padding: 0px;
    margin: 0px;
}


/*Home three header start*/

.home-three-template {
    min-height: 950px;
    position: relative;
}


/* Home three header end*/


/* topbar start*/

.top-horizontal-bar {
    min-height: 10px;
    background: #111F29;
    position: absolute;
    z-index: 999;
    padding: 0px;
    margin: 0px;
}

.topbar-wrapper-section {
    position: relative;
    padding: 0px
}

.topbar-wrapper {
    background: #111F29;
    min-height: 50px;
    padding: 0px;
    margin: 0px;
    max-width: 55%;
    float: right;
}

.topbar-container {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    padding-right: 0px
}

.topbar {
    background: #111F29;
    height: 50px;
    z-index: 999999;
    padding-right: 0px
}

.topbar a {
    line-height: 50px;
}

.link-nav li:nth-child(1) {
    width: 60px;
}

@media screen and (max-width: 776px) {
    .link-nav {
        display: none;
    }
}


/* search box css*/

#transparent-navigation {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999
}

.search-box-home-one {
    position: absolute !important;
    right: 14%;
    top: 15%;
    z-index: 999999;
}

.navbar-collapse {
    position: relative;
}

@media (min-width: 800px) and (max-width: 1000px) {
    .navbar-right {
        position: absolute;
        right: -23px;
    }
    .navbar-nav li a {
        font-size: 13px;
    }
}

.search-box-home-one-wrapper {
    position: absolute !important;
    right: -56px;
}

.search-box-home-one-wrapper .searchbox {
    background: #fff;
}

.search-box-home-one-wrapper .searchbox-input {
    background: #fff;
    position: relative;
    top: -15px;
}

.search-box-home-one-wrapper .searchbox-open .searchbox-input {
    position: relative;
    top: -15px;
}

.search-box-home-one-wrapper .searchbox-icon,
.searchbox-submit .search-box-home-one-wrapper {
    background: #fff;
    border: none;
}

.search-box-home-one-wrapper .searchbox-icon i {
    color: #111F29;
    font-size: 14px;
}

.searchbox {
    position: relative;
    min-width: 50px;
    width: 0%;
    height: 50px;
    float: right;
    overflow: hidden;
    border-left: 1px solid #162835;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
}

.social-icon .searchbox {
    position: relative;
    min-width: 50px;
    width: 0%;
    height: 50px;
}

.search-box-home-one-wrapper .searchbox {
    overflow: hidden;
    border-left: none;
}

.search-box-home-one-wrapper .searchbox-input {
    color: #000;
}

.searchbox-input {
    top: 0;
    right: 0;
    border: 0;
    outline: 0;
    background: #111F29;
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0px 55px 0px 20px;
    font-size: 20px;
    color: #fff;
}

.searchbox-input::-webkit-input-placeholder {
    color: #5B6D71;
}

.searchbox-input:-moz-placeholder {
    color: #5B6D71;
}

.searchbox-input::-moz-placeholder {
    color: #5B6D71;
}

.searchbox-input:-ms-input-placeholder {
    color: #5B6D71;
}

.searchbox-icon,
.searchbox-submit {
    width: 50px;
    height: 50px;
    display: block;
    position: absolute;
    top: 0;
    font-size: 22px;
    right: 0;
    padding: 18px;
    margin: 0;
    border-left: 3px solid #0F1B24;
    outline: 0;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
    color: #dcddd8;
    background: #111F29;
}

.search-box-home-one-wrapper .searchbox-open {
    width: 400px
}

.searchbox-open {
    width: 100%;
}

.byline {
    position: absolute;
    top: 150px;
    left: 30%;
    text-align: center;
    font-size: 18px;
}

.byline a {
    text-decoration: none;
    color: #5B6D71;
}


/*search form css end*/

.topbar i {
    width: 24px;
    height: 24px;
    background: #0D1725;
    font-size: 14px;
    color: #BCCAD3;
    text-align: center;
    line-height: 24px;
    border-radius: 30px;
}

.topbar:before {
    content: 'hello';
    min-height: 50px;
    width: 100%;
    background: #111F29;
    float: left;
    transform: skewX(24deg);
    position: absolute;
    left: -25px;
    border: 10px solid #111F29;
    border-radius: 0px 0px 0px 7px;
    color: transparent;
}

.top-bar-info {
    list-style: none;
    float: left;
    margin: 0px;
    padding: 0px;
}

.top-bar-info .contact-one i,
.top-bar-info .contact-two i,
.top-bar-info .contact-three i {
    color: orange;
    font-size: 18px;
    float: left;
    height: 50px;
    line-height: 50px;
    margin-left: 5px;
}

.top-bar-info .contact-one p,
.top-bar-info .contact-two p,
.top-bar-info .contact-three p {
    color: #BCCAD3;
    line-height: 50px;
    height: 50px
}

.top-bar-info .contact-one {
    width: 160px;
    text-align: center;
    border-right: 1px solid #172A38;
    float: left;
}

.top-bar-info .contact-two {
    width: 250px;
    text-align: center;
    border-left: 1px solid #0C171E;
    border-right: 1px solid #172A38;
    float: left;
    padding-left: 13px;
}

.top-bar-info .contact-three {
    width: 200px;
    text-align: center;
    border-left: 1px solid #0C171E;
}

.top-bar-info .contact-three i {
    margin-left: 18px;
}

.top-bar-info li {
    display: inline-block;
    height: 50px
}

.topbar-social-icon .search {
    width: 57px;
}

.topbar-social-icon .search .searchbox-open {
    width: 400px;
}

.topbar-social-icon {
    float: right;
    list-style: none;
    height: 50px;
    line-height: 50px;
}

.topbar-social-icon li {
    display: inline-block;
}

.topbar-social-icon li a {
    line-height: 50px;
    height: 50px;
    float: left;
}

.topbar-social-icon li a i {
    background: #0D1725;
    width: 24px;
    height: 24px;
    float: left;
    border-radius: 30px;
    line-height: 24px;
    text-align: center;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    color: #BCCAD3;
    font-size: 14px;
}


/* social icon*/

.social-icon {
    padding: 0px;
}

.social-icons {
    display: table-cell;
    vertical-align: middle;
    padding: 0;
    float: left;
    z-index: 9;
    position: relative;
}

.social-icons-items {
    display: table-cell;
    vertical-align: middle;
    padding: 0;
    float: left;
    z-index: 9;
    position: relative;
    width: 100%
}

.social-icons li {
    display: inline-block;
    opacity: 1;
    margin-left: 7px;
}

.contact-icon-three {}

.contact-icon-three {
    border-left: 1px solid #0C171E;
}

#top-info .contact-icon-three i {
    float: left;
    line-height: 50px;
    background: transparent;
    font-size: 18px;
    color: #FAB702
}

#top-info .contact-icon-three p {
    float: right;
    line-height: 50px;
    color: #BCCAD3
}

#top-info .contact-icon-two i {
    line-height: 50px;
    background: transparent;
    font-size: 18px;
    color: #FAB702
}

#top-info .contact-icon-two p {
    float: right;
    line-height: 50px;
    margin-right: 10px;
    color: #BCCAD3
}

#top-info .contact-icon-two {
    border-left: 1px solid #0C171E;
    border-right: 1px solid #172A38;
}

#top-info .contact-icon-one i {
    float: left;
    line-height: 50px;
    background: transparent;
    font-size: 18px;
    color: #FAB702;
}

#top-info .contact-icon-one p {
    float: left;
    line-height: 50px;
    color: #BCCAD3
}

#top-info .contact-icon-one {
    width: 165px;
    margin-left: 45px;
    border-right: 1px solid #172A38;
}

#top-info .contact-icon-two {
    width: 226px;
    text-align: center;
}

#top-info {
    list-style: none;
    margin: 0;
    padding: 0;
}

#top-info li {
    display: inline-block;
    position: relative;
    z-index: 9999;
    float: right;
    width: 163px;
    height: 50px;
    padding-left: 12px;
}

.contact-icon-three {
    display: inline-block;
    width: 173px;
    position: relative;
    z-index: 9999;
    float: right;
    width: 202px;
    height: 50px;
}


/*Index Template 02 topbar flat CSS start*/

.topbar-flat {
    background: #111F29;
    min-height: 50px;
    height: 50px;
}

.topbar-flat .col-sm-12 {
    height: 50px;
}

.topbar-flat .social-icon a {
    width: 33px;
    text-align: center;
    padding: 0px;
}

.topbar-flat .social-icon .search {
    float: right;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    height: 50px;
}

.topbar-flat .social-icon .searchbox-input {
    height: 46px;
}

.home-three-template .topbar-flat {
    z-index: 99999;
    position: relative;
}

.topbar-flat-wrapper {
    padding: 0px;
}

.topbar-flat .contact-icon-one {
    display: flex;
    border-right: 1px solid #172A38
}

.topbar-flat .contact-icon-one i {
    margin: auto;
    color: #F6C002;
    line-height: 50px;
    font-size: 18px;
}

.topbar-flat .contact-icon-two {
    display: flex;
    border-left: 1px solid #0E1A22;
    border-right: 1px solid #162835
}

.topbar-flat .contact-icon-two i {
    margin: auto;
    color: #F6C002;
    font-size: 18px;
}

.topbar-flat .contact-icon-three {
    display: flex;
    border-left: 1px solid #0E1A22
}

.topbar-flat .contact-icon-three i {
    margin: auto;
    color: #F6C002;
    line-height: 50px;
    font-size: 18px;
}

.topbar-flat .social-icon {
    padding: 0px;
    float: right;
    text-align: right;
}

.topbar-flat .social-icon a {
    line-height: 50px;
    position: relative;
    right: 71px;
}

.topbar-flat .social-icon i {
    width: 24px;
    height: 24px;
    background: #0D1725;
    text-align: center;
    line-height: 24px;
    border-radius: 30px;
    color: #8996A0;
    font-size: 14px;
}

.topbar-flat .search-icon {
    height: 50px;
    line-height: 50px;
    float: right;
    border-left: 1px solid #0E1B23;
    width: 37px;
}


/*Index Template 02 topbar flat CSS end */


/* Navigation  start*/

@media (max-width: 767px) {
    .affix {
        position: static;
    }
}

.navbar-nav a {
    text-shadow: none;
}

.primary-nav {
    background: #fff;
    border: none;
    border-radius: 0px;
    min-height: 80px;
    margin-bottom: 0px;
}

.primary-nav .navbar-toggle {
    background: #0C253C;
    position: absolute;
    right: 10px;
    border-radius: 0px;
    margin: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.sticky-wrapper {
    position: relative;
    z-index: 999
}

.is-sticky .primary-nav {
    border-bottom: 3px solid #FAB702
}

.primary-nav .navbar-toggle .icon-bar {
    background: #fff;
}

.primary-nav .navbar-nav li {
    min-height: 80px;
    background: transparent;
    line-height: 80px;
}

#skew-header .link-nav li:nth-child(3) {
    width: 18px;
}

#skew-header .nav-primary .link-nav li:nth-child(1) i {
    border-left: 1px solid #000;
    width: 44px;
    float: left;
    position: relative;
    top: 3px;
}

#skew-header .link-nav li:nth-child(2) i {
    border-color: #000
}

#skew-header .nav-primary .link-nav li:nth-child(1) i:hover {
    color: #FAB702;
}

.caret-right {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-left: 4px solid;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
}

.primary-nav .navbar-nav li a {
    min-height: 80px;
    background: transparent;
    line-height: 80px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    color: #5E6D77;
}

.primary-nav .navbar-nav .dropdown-menu {
    padding-top: 0px;
    min-width: 300px;
    left: 0;
    padding-bottom: 0px;
    border: 0px;
    box-shadow: 0px 0px -11px 9px;
    border-top: 2px solid;
}

.primary-nav .navbar-nav .dropdown-menu .dropdown-menu {
    left: 100%;
    box-shadow: 0px 0px -11px 9px;
    top: -1px;
    margin-top: 0px;
}

#modern-dark .primary-nav .navbar-nav .dropdown-menu .dropdown-menu,
#modern-dark-transparent .primary-nav .navbar-nav .dropdown-menu .dropdown-menu,
#transparent-navigation .primary-nav .navbar-nav .dropdown-menu .dropdown-menu {
    top: -2px;
}

.primary-nav .navbar-nav .dropdown-menu li a {
    min-height: 50px;
    background: #fff;
    line-height: 50px;
    padding-top: 0px;
}

.primary-nav .navbar-nav .dropdown-menu li {
    min-height: 50px;
    background: #fff;
    line-height: 50px;
    padding-top: 0px;
    padding-bottom: 0px;
}


/*Dropdown code*/

@media (min-width: 979px) {
    ul.nav li.dropdown:hover> ul.dropdown-menu {
        display: block;
    }
}

@media (min-width: 979px) {
    ul.nav li.dropdown .dropdown-submenu:hover> ul.dropdown-menu {
        display: block;
    }
}

.dropdown-submenu> a::before {
    line-height: 58px;
    margin-top: 21px;
}


/*Dropdown code*/


/*Menu hover color */

@media screen and (max-width: 800px) {
    .navbar-header {
        height: 90px;
    }
}

.primary-nav .navbar-nav> li> a:hover,
.navbar-default .navbar-nav> li> a:focus {
    background-color: #fff;
    color: #FAB702;
}

.primary-nav .navbar-nav li.active a {
    color: #FAB702;
}

.navbar-brand {
    padding: 6px;
}

.primary-nav .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999
}

.affix .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-modern .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-dark-color .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-tranparent-dark .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-tranparent-light .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-light-color .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-modern-dark-transparent .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-modern-light-transparent .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

@media screen and (max-width: 320px) {
    .navbar-brand img {
        width: 107px;
    }
}

.link-nav {
    margin-left: 38px;
}

.link-nav li i {
    color: #111F29
}

.link-nav li a:hover i {
    color: #FAB702 !important
}

#transparent-navigation .link-nav li a:hover i {
    border-color: #fff
}

.link-nav li a {
    padding: 0px;
}

.link-nav li:nth-child(2) {
    width: 42px;
}

.search-icon-nav .link-nav li:nth-child(2) {
    width: 12px;
}

.link-nav li:nth-child(3) {
    width: 16px;
}

.link-nav li:nth-child(1) i {
    border-left: 1px solid;
    width: 32px;
    position: relative;
    right: 0px;
}

.nav-primary .link-nav li:nth-child(1) i {
    border-left: 1px solid;
    width: 32px;
    float: left;
    position: relative;
    top: 3px;
    right: 11px;
}


}
.nav-modern-light-transparent .link-nav li:nth-child(1) i {
    width: 32px;
    float: left;
    position: relative;
    top: 3px;
    right: 11px;
}
.search-icon-nav .link-nav li:nth-child(1) i {
    border-left: 0px solid;
    width: 32px;
    border-right: 1px solid #fff
}
#flat-header .search-icon-nav .link-nav li:nth-child(1) i {
    border-left: 0px solid;
    width: 39px;
    border-right: 1px solid #000
}
.nav-light-color .link-nav li:nth-child(1) i {
    border-right: 1px solid #000;
    width: 38px;
    border-left: none;
}
.link-nav li:nth-child(2) i {
    border-right: 1px solid;
    width: 25px
}
#modern-dark .link-nav li:nth-child(2) i {
    border-color: #5E6D77
}
#modern-header .link-nav li:nth-child(2) i {
    border-color: #000
}
.search-icon-nav .link-nav li:nth-child(2) i {
    border-right: 0px solid;
    width: 0px
}
.primary-nav .navbar-nav li.active .dropdown-menu a {
    color: #5E6D77;
    border-bottom: 1px solid #ACB7BD
}
.primary-nav .navbar-nav .dropdown-menu a {
    color: #5E6D77;
    border-bottom: 1px solid #ACB7BD
}
.primary-nav .navbar-nav li.active .dropdown-menu a:hover {
    color: #FAB702;
}
.primary-nav .navbar-nav li .dropdown-menu a:hover {
    color: #FAB702;
}
.primary-nav .navbar-nav li .dropdown-menu a {
    border-top: 0px solid;
    border-left: 0px solid;
    border-bottom: 1px solid #3f8995
}
.primary-nav .navbar-nav li .dropdown-menu li:last-child a {
    border-bottom: none;
}
#modern-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

/*Menu hover color*/
.nav-cart-icon li a i {
    color: #111F29;
    font-size: 14px;
}
.nav-cart-icon li:nth-child(1) i {
    border-right: 1px solid black;
    width: 32px;
}
.nav-cart-icon li:nth-child(2) i {
    border-right: 1px solid black;
    width: 32px;
}
.template-two-nav .nav-cart-icon li:nth-child(2) i {
    border-right: 0px solid black;
    width: 0px;
}

/*Menu transparent*/
.nav-transparent .link-nav li:nth-child(1) i {
    border-left: none;
    border-right: 1px solid;
    padding-right: 18px;
}
.nav-transparent .link-nav {
    text-align: right;
}
.nav-transparent .link-nav li:nth-child(2) {
    width: 20px;
}
.nav-transparent {
    background: transparent;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999999;
    top: 0px;
}
.is-sticky .nav-transparent {
    background: #fff
}
@media screen and (max-width: 760px) {
    .nav-transparent {
        position: relative !important;
    }
    
    .nav-transparent-wrapper {
        padding: 0px;
    }
}
.nav-transparent .navbar-nav {
    background: transparent;
    margin-right: 4px
}
.nav-transparent .navbar-nav li {
    background: transparent;
}
.nav-transparent .navbar-nav li a {
    background: transparent;
    color: #ADBFCD;
    font-family: 'Roboto', sans-serif;
    font-weight: 500
}
.is-sticky .nav-transparent .navbar-nav li a {
    color: #5E6D77;
}
.nav-transparent .navbar-nav li a:hover {
    background: transparent;
}
.nav-transparent .navbar-nav li a i {
    background: transparent;
    color: #fff;
}
.is-sticky .nav-transparent .navbar-nav li a i {
    color: #111111;
}
.nav-transparent button {
    background: #fff;
    color: #000
}
.nav-transparent button .icon-bar {
    background: #000
}
.nav-transparent .navbar-nav li .dropdown-menu li a {
    background: transparent;
    color: #5E6D77;
}
@media screen and (max-width: 1000px) {
    .topbar-flat {
        display: none;
    }
    
    .nav-transparent {
        background: transparent;
        position: absolute;
        left: 0;
        z-index: 999999;
        right: 0;
        top: 0;
    }
}
@media screen and (max-width: 760px) {
    .navbar-collapse {
        background: rgba(255, 255, 255, .8);
        ;
        position: absolute;
        z-index: 999;
        width: 100%;
    }
    
    .navbar-collapse .navbar-nav li a {
        color: #000 !important;
        background: transparent;
    }
    
    .navbar-collapse .navbar-nav li {
        color: #000 !important;
        background: transparent;
    }
    
    .navbar-nav {
        margin-top: 0px;
    }
    
    .nav-modern-dark .navbar-nav li a {
        background: rgba(0, 0, 0, .8) !important;
    }
    
    .nav-tranparent-dark .navbar-collapse {
        background: rgba(255, 255, 255, .8) !important;
    }
    
    .nav-dark-color .navbar-collapse .navbar-nav li a {
        background: rgba(17, 17, 17, .7);
    }
    
    .nav-dark-color .navbar-collapse .navbar-nav li {
        background: transparent;
    }
    
    .nav-dark-color .navbar-collapse .navbar-nav {
        background: transparent;
    }
}
.navbar-brand,
.navbar-nav> li> a {
    text-shadow: unset;
}
.navbar-nav> li> a:hover {
    text-shadow: unset;
}
.navbar-nav .active a {
    text-shadow: unset;
}

/*Nav light color*/
.nav-light-color {
    background: #DFE2FF
}
.nav-light-color .container {
    padding-right: 0px;
}
.nav-light-color .navbar-collapse {
    padding-right: 0px;
}
.nav-light-color .navbar-nav {
    background: #DFE2FF;
    margin-right: 16px;
}
.nav-light-color .navbar-nav li a {
    background: #DFE2FF
}
.nav-light-color .navbar-nav li a:hover {
    background: #DFE2FF;
    color: #FAB702
}
@media screen and (max-width: 800px) {
    .nav-light-color .navbar-nav {
        background: transparent;
    }
    
    .nav-light-color .navbar-nav li {
        background: transparent;
    }
    
    .nav-light-color .navbar-nav li a {
        background: rgba(223, 226, 255, .7)
    }
}
.nav-light-color .navbar-nav .dropdown-menu li {
    background: #DFE2FF
}
.nav-light-color .navbar-nav .dropdown-menu li a {
    background: #DFE2FF
}

/*Nav light color*/
.nav-dark-color {
    background: #111111
}
.nav-dark-color .navbar-nav {
    background: #111111
}
.nav-dark-color .navbar-nav li a {
    background: #111111;
    color: #F0F5F8
}
.nav-dark-color .navbar-nav li a:hover {
    background: #111111;
    color: #FAB702
}
.nav-dark-color .navbar-nav .dropdown-menu li {
    background: #111111
}
.nav-dark-color .navbar-nav .dropdown-menu li a {
    background: #111111
}
.nav-dark-color .navbar-nav li a i {
    background: #111111;
    color: #F0F5F8
}
.nav-dark-color .navbar-nav li a:hover i {
    background: #111111;
    color: #F0F5F8
}
.nav-dark-color button {
    background: #fff;
    color: #000
}
.nav-dark-color button .icon-bar {
    background: #000
}
@media screen and (max-width: 820px) {
    .nav-dark-color .navbar-collapse .navbar-nav li a {
        color: #fff !important;
    }
    
    .nav-dark-color .navbar-collapse .navbar-nav li a:hover {
        color: #F9C502 !important;
    }
}

/* menu dark */
#dark-header .primary-nav {
    background: #000;
    height: 83px
}
#dark-header .search-icon-nav .link-nav li i {
    color: #5E6D77;
    border-color: #5E6D77
}
#dark-header .search-icon-nav .link-nav li:nth-child(1) i {
    width: 37px;
    background: transparent;
}
#dark-header .primary-nav .navbar-nav li a:hover {
    background: #000;
}
#dark-header .primary-nav .navbar-nav li a {
    background: #000;
}
@media screen and (max-width: 768px) {
    #dark-header .primary-nav .navbar-nav li a {
        background: transparent;
    }
}
#dark-header .primary-nav .navbar-nav li .dropdown-menu a {
    background: #000
}

/* menu dark transparent*/
#dark-header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99
}
#dark-header-transparent .primary-nav {
    background: rgba(0, 0, 0, .7);
    height: 83px
}
#dark-header-transparent .search-icon-nav .link-nav li i {
    color: #5E6D77;
    border-color: #5E6D77
}
#dark-header-transparent .search-icon-nav .link-nav li:nth-child(1) i {
    width: 37px
}
#dark-header-transparent .primary-nav .navbar-nav li a:hover {
    background: transparent;
}
#dark-header-transparent .primary-nav .navbar-nav li a {
    background: transparent;
}
@media screen and (max-width: 768px) {
    #dark-header-transparent {
        position: initial;
    }
    
    #dark-header-transparent .primary-nav {
        background: #000
    }
    
    #dark-header-transparent .primary-nav .navbar-nav li a {
        background: transparent;
    }
}
#dark-header-transparent .primary-nav .navbar-nav li .dropdown-menu a {
    background: #000
}

/* menu light transparent*/
#light-header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99
}
#light-header-transparent .primary-nav {
    background: rgba(255, 255, 255, .7);
    height: 83px
}
#light-header-transparent .search-icon-nav .link-nav li i {
    color: #5E6D77;
    border-color: #5E6D77
}
#light-header-transparent .search-icon-nav .link-nav li:nth-child(1) i {
    width: 35px
}
#light-header-transparent .primary-nav .navbar-nav li a:hover {
    background: transparent;
}
#light-header-transparent .primary-nav .navbar-nav li a {
    background: transparent;
}
@media screen and (max-width: 768px) {
    #light-header-transparent {
        position: initial;
    }
    
    #light-header-transparent .primary-nav {
        background: #fff;
        height: 80px
    }
    
    #light-header-transparent .navbar-header {
        height: 80px;
    }
    
    #light-header-transparent .primary-nav .navbar-nav li a {
        background: transparent;
    }
}
#light-header-transparent .primary-nav .navbar-nav li .dropdown-menu a {
    background: #fff
}

/*Menu transparent light*/
.nav-tranparent-light .link-nav li:nth-child(1) i {
    border-left: none;
    border-right: 1px solid;
    padding-right: 18px;
}
.nav-tranparent-light .link-nav {
    text-align: right;
}
.nav-tranparent-light .link-nav li:nth-child(2) {
    width: 20px;
}
.nav-tranparent-light {
    background: rgba(255, 255, 255, .6);
    position: absolute;
    left: 0;
    z-index: 99999;
    right: 0;
    top: 50px;
}
.nav-tranparent-light .navbar-nav {
    background: transparent;
    margin-right: 3px
}
.nav-tranparent-light .navbar-nav li {
    background: transparent;
}
.nav-tranparent-light .navbar-nav li a {
    background: transparent;
    color: #425053;
    font-weight: 500
}
.nav-tranparent-light .navbar-nav li a:hover {
    background: transparent;
}
.nav-tranparent-light .navbar-nav li a i {
    background: transparent;
    color: #000;
}
.nav-tranparent-light button {
    background: #fff;
    color: #000
}
.nav-tranparent-light button .icon-bar {
    background: #000
}
.nav-tranparent-light .navbar-nav li .dropdown-menu li a {
    background: transparent;
    color: #000;
}
@media screen and (max-width: 1000px) {
    .topbar-flat {
        display: none;
    }
    
    .nav-tranparent-light {
        background: transparent;
        position: absolute;
        left: 0;
        z-index: 999999;
        right: 0;
        top: 0;
    }
}
@media screen and (max-width: 800px) {
    .nav-tranparent-light .navbar-collapse {
        background: #fff
    }
    
    .nav-tranparent-light .navbar-collapse .navbar-nav li a {
        color: #000 !important;
    }
}

/*Nav transparent dark */

/*Menu transparent light*/
.nav-tranparent-dark .link-nav li:nth-child(1) i {
    border-left: none;
    border-right: 1px solid;
    padding-right: 18px;
}
.nav-tranparent-dark .link-nav {
    text-align: right;
}
.nav-tranparent-dark .link-nav li:nth-child(2) {
    width: 20px;
}
.nav-tranparent-dark {
    background: rgba(0, 0, 0, .6);
    position: absolute;
    left: 0;
    z-index: 99999;
    right: 0;
    top: 50px;
}
.nav-tranparent-dark .navbar-nav {
    background: transparent;
}
.nav-tranparent-dark .navbar-nav li {
    background: transparent;
}
.nav-tranparent-dark .navbar-nav li a {
    background: transparent;
    color: #fff;
}
.nav-tranparent-dark .navbar-nav li a i {
    background: transparent;
    color: #fff;
}
.nav-tranparent-dark button {
    background: #fff;
    color: #000
}
.nav-tranparent-dark button .icon-bar {
    background: #000
}
.nav-tranparent-dark .navbar-nav li .dropdown-menu li a {
    background: transparent;
    color: #000;
}
.nav-tranparent-dark .navbar-nav li a:hover {
    background: transparent;
}
@media screen and (max-width: 1000px) {
    .topbar-flat {
        display: none;
    }
    
    .nav-tranparent-dark {
        background: rgba(0, 0, 0, .6);
        position: absolute;
        left: 0;
        z-index: 999999;
        right: 0;
        top: 0;
    }
}
@media screen and (max-width: 800px) {
    .nav-tranparent-dark .navbar-collapse {
        background: #fff
    }
    
    .nav-tranparent-dark .navbar-collapse .navbar-nav li a {
        color: #000 !important;
    }
    
    .nav-tranparent-dark .navbar-collapse .navbar-nav li a i {
        color: #000 !important;
    }
}

/*nav modern css*/
#modern-header .is-sticky {
    height: 80px
}
#modern-header .primary-nav {
    top: 20px;
}
@media screen and (max-width: 800px) {
    .nav-modern {
        width: 100%;
        top: 0;
        z-index: 9999999
    }
    
    .nav-modern button {
        background: #fff;
        color: #000
    }
    
    .nav-modern button .icon-bar {
        background: #000
    }
}

/*nav modern white link*/
.nav-modern .link-nav li {
    width: 50px !important;
    float: left;
}
.nav-modern .link-nav li:nth-child(1) a i {
    border-right: 1px solid #000;
    border-left: none;
}
.nav-modern .link-nav li:nth-child(3) form {
    border: none;
}
.nav-modern .link-nav li:nth-child(3) form i {
    position: absolute;
    left: 0;
    font-size: 15px;
    top: 20px;
}
.nav-modern .link-nav li:nth-child(3) form i:hover {
    color: #FAB702;
}
.nav-modern .link-nav li:nth-child(3) .searchbox-open {
    width: 400px
}
.nav-modern .link-nav li:nth-child(3) .searchbox-open .searchbox-input {
    position: absolute;
}
.nav-modern .searchbox-icon,
.searchbox-submit {
    background: #fff;
    border: none;
}
.nav-modern .link-nav {
    margin-right: 0px
}
@media screen and (max-width: 992px) {
    #modern-header .nav-modern-wrapper {
        width: 100%;
        padding: 0px;
    }
    
    #modern-header .nav-modern-wrapper nav {
        top: 0;
    }
    
    #modern-header {
        position: initial;
    }
}

/*nav modern white link end*/

/*nav modern dark*/
#modern-dark {
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}
#modern-dark .is-sticky {
    height: 80px
}
#modern-dark .primary-nav {
    top: 20px;
}
.nav-modern-dark {
    background: #000
}
@media screen and (max-width: 800px) {
    .nav-modern-dark {
        width: 100%;
        top: 0;
        z-index: 9999999
    }
    
    .nav-modern-dark button {
        background: #fff;
        color: #000
    }
    
    .nav-modern-dark button .icon-bar {
        background: #000
    }
}
.nav-modern-dark .link-nav li {
    width: 50px !important;
    float: left;
}
.nav-modern-dark .link-nav li a i {
    color: #5E6D77
}
.nav-modern-dark .link-nav li:nth-child(1) a i {
    border-right: 1px solid #5E6D77;
    border-left: none;
}
.nav-modern-dark .link-nav li:nth-child(3) form {
    border: none;
}
.nav-modern-dark .link-nav li:nth-child(3) form i {
    position: absolute;
    left: -8px;
    font-size: 16px;
    top: 53%;
    transform: translateY(-50%);
    color: #5E6D77
}
.nav-modern-dark .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    background: transparent;
}
.nav-modern-dark .navbar-nav .dropdown-menu li a {
    background: #000;
}
.nav-modern-dark .link-nav li:nth-child(3) .searchbox-open {
    width: 400px
}
.nav-modern-dark .link-nav li:nth-child(3) .searchbox-open .searchbox-input {
    position: absolute;
}
.nav-modern-dark .searchbox-icon,
.searchbox-submit {
    background: #000;
    border: none;
}
.nav-modern-dark .link-nav {
    margin-right: 0px
}
@media screen and (max-width: 992px) {
    #modern-dark .nav-modern-wrapper {
        width: 100%;
        padding: 0px;
    }
    
    #modern-dark .nav-modern-wrapper nav {
        top: 0;
    }
    
    #modern-dark {
        position: initial;
    }
}
.nav-modern-dark .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.nav-modern-dark .link-nav li:nth-child(3) i {
    width: 32px;
    float: left;
    position: relative;
    top: 3px;
    right: 11px;
}

/*nav modern dark transparent*/
#modern-dark-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}
#modern-dark-transparent .is-sticky {
    height: 80px
}
#modern-dark-transparent .primary-nav {
    top: 20px;
}
.nav-modern-dark-transparent {
    background: rgba(0, 0, 0, .6);
}
@media screen and (max-width: 800px) {
    .nav-modern-dark-transparent {
        width: 100%;
        top: 0;
        z-index: 9999999
    }
    
    .nav-modern-dark-transparent button {
        background: #fff;
        color: #000
    }
    
    .nav-modern-dark-transparent button .icon-bar {
        background: #000
    }
}
.nav-modern-dark-transparent .link-nav li {
    width: 50px !important;
    float: left;
}
.nav-modern-dark-transparent .link-nav li a i {
    color: #5E6D77
}
.nav-modern-dark-transparent .link-nav li:nth-child(1) a i {
    border-right: 1px solid #5E6D77;
    border-left: none;
}
.nav-modern-dark-transparent .link-nav li:nth-child(2) a i {
    border-right: 1px solid #5E6D77;
    border-left: none;
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) form {
    border: none;
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) form i {
    position: absolute;
    left: -8px;
    font-size: 16px;
    top: 53%;
    transform: translateY(-50%);
    color: #5E6D77
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) form i:hover {
    color: #FAB702;
}
.nav-modern-dark-transparent .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    background: transparent;
}
.nav-modern-dark-transparent .navbar-nav .dropdown-menu li a {
    background: #000;
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) .searchbox-open {
    width: 400px
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) .searchbox-open .searchbox-input {
    position: absolute;
}
.nav-modern-dark-transparent .searchbox-icon,
.searchbox-submit {
    background: transparent;
    border: none;
}
.nav-modern-dark-transparent .link-nav {
    margin-right: 0px
}
.nav-modern-dark-transparent .searchbox-input {
    background: transparent;
}
.nav-modern-dark-transparent .searchbox-open {
    background: #000
}
@media screen and (max-width: 992px) {
    #modern-dark-transparent .nav-modern-wrapper {
        width: 100%;
        padding: 0px;
    }
    
    #modern-dark-transparent .nav-modern-wrapper nav {
        top: 0;
    }
    
    #modern-dark-transparent {
        position: initial;
        height: 76px;
    }
    
    .nav-modern-dark-transparent .navbar-nav li a {
        color: #fff;
    }
}
.nav-modern-dark-transparent .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.nav-modern-dark-transparent .link-nav li:nth-child(3) i {
    width: 32px;
    float: left;
    position: relative;
    top: 3px;
    right: 11px;
}

/*nav modern light transparent*/
#modern-light-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}
#modern-light-transparent .is-sticky {
    height: 80px
}
#modern-light-transparent .primary-nav {
    top: 20px;
}
.nav-modern-light-transparent {
    background: rgba(255, 255, 255, .6);
}
@media screen and (max-width: 800px) {
    .nav-modern-light-transparent {
        width: 100%;
        top: 0;
        z-index: 9999999
    }
    
    .nav-modern-light-transparent button {
        background: #fff;
        color: #000
    }
    
    .nav-modern-light-transparent button .icon-bar {
        background: #000
    }
}
.nav-modern-light-transparent .link-nav li {
    width: 50px !important;
    float: left;
}
.nav-modern-light-transparent .link-nav li a i {
    color: #5E6D77
}
.nav-modern-light-transparent .link-nav li:nth-child(1) a i {
    border-right: 1px solid #5E6D77;
    border-left: none;
}
.nav-modern-light-transparent .link-nav li:nth-child(2) a i {
    border-right: 1px solid #5E6D77;
    border-left: none;
}
.nav-modern-light-transparent .link-nav li:nth-child(3) form {
    border: none;
}
.nav-modern-light-transparent .link-nav li:nth-child(3) form i {
    position: absolute;
    left: -8px;
    font-size: 16px;
    top: 53%;
    transform: translateY(-50%);
    color: #5E6D77
}
.nav-modern-light-transparent .link-nav li:nth-child(3) form i:hover {
    color: #FAB702;
}
.nav-modern-light-transparent .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    background: transparent;
}
.nav-modern-light-transparent .navbar-nav .dropdown-menu li a {
    background: #fff;
}
.nav-modern-light-transparent .link-nav li:nth-child(3) .searchbox-open {
    width: 400px
}
.nav-modern-light-transparent .link-nav li:nth-child(3) .searchbox-open .searchbox-input {
    position: absolute;
}
.nav-modern-light-transparent .searchbox-icon,
.searchbox-submit {
    background: transparent;
    border: none;
}
.nav-modern-light-transparent .link-nav {
    margin-right: 0px
}
.nav-modern-light-transparent .searchbox-input {
    background: transparent;
}
.nav-modern-light-transparent .searchbox-open {
    background: #000
}
@media screen and (max-width: 992px) {
    #modern-light-transparent .nav-modern-wrapper {
        width: 100%;
        padding: 0px;
    }
    
    #modern-light-transparent .nav-modern-wrapper nav {
        top: 0;
    }
    
    #modern-light-transparent {
        position: initial;
        height: 76px;
    }
    
    .nav-modern-light-transparent .navbar-nav li a {
        color: #000;
    }
}
.nav-modern-light-transparent .navbar-brand img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.nav-modern-light-transparent .link-nav li:nth-child(3) i {
    width: 32px;
    float: left;
    position: relative;
    top: 3px;
    right: 11px;
}

/* Main Slider CSS Start*/
.carousel-caption {
    text-shadow: unset;
}
.carousel-caption h1 {
    color: #fff;
    font-size: 45px;
    font-family: 'Oswald', sans-serif;
    line-height: 52px;
    text-shadow: unset;
}
.carousel-caption h1 span {
    color: #FAB702
}
.carousel-caption h2 {
    color: #FAB702;
    font-size: 36px;
    font-family: 'Oswald', sans-serif;
}
.carousel-caption p {
    font-size: 18px;
}
.carousel-caption .btn-slide {
    width: 243px;
    height: 60px;
    background: #FAB702;
    color: #fff;
    border-bottom: none;
    border-radius: 0px;
    padding: 0px;
    text-transform: uppercase;
    font-weight: bold;
    margin-top: 50px;
    font-family: 'Roboto', sans-serif;
}
.carousel-caption .btn-slide:hover {
    color: #111F29
}
.carousel-caption .btn-slide span {
    width: 188px;
    border-right: 1px solid #EEAA04;
    float: left;
    padding: 0px;
    min-height: 58px;
    line-height: 58px;
    font-family: 'Roboto', sans-serif
}
.carousel-caption .btn-slide i {
    padding-left: 17px !important;
    min-height: 57px;
    float: left;
    padding: 0px;
    border-left: #F9C502 1px solid;
    line-height: 57px;
}
@media screen and (max-width: 778px) {
    .carousel-caption h1 {
        color: #fff;
        font-size: 22px;
        font-family: 'Oswald', sans-serif;
        line-height: 28px;
        text-shadow: unset;
    }
    
    .carousel-caption p {
        font-size: 14px;
    }
}
.main-slider .carousel-control.right,
.main-slider .carousel-control.left {
    background-image: none;
    height: 53px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    float: left;
    padding: 0px;
}
.main-slider .carousel-indicators {
    display: none;
}
.main-slider .carousel-inner img {
    width: 100%;
    max-height: 750px;
    filter: brightness(70%);
    min-height: 750px
}
@media screen and (max-width: 800px) {
    .main-slider .carousel-inner img {
        width: 100%;
        min-height: 400px;
        max-height: 400px;
    }
    
    .carousel-caption .btn-slide i {
        display: none;
    }
    
    .carousel-caption .btn-slide {
        width: 170px;
        height: 40px;
        line-height: 40px;
        margin-top: 0px;
    }
    
    .carousel-caption .btn-slide span {
        width: auto;
        border-right: 0px solid #EEAA04;
        float: unset;
        padding: 0px;
        min-height: auto;
        line-height: unset;
    }
}
.main-slider .carousel-control span {
    position: relative;
    font-size: 31px;
    color: #FAB702;
    border: 1px solid #FAB702;
    border-radius: 45px;
    width: 57px;
    height: 57px;
    line-height: 56px;
    text-align: center;
    padding: 7px;
}
@media screen and (max-width: 320px) {
    .main-slider .carousel-control span {
        font-size: 26px;
    }
}
.carousel-caption {
    top: 50%;
    bottom: 0;
    padding: 0px;
    transform: translateY(-50%);
}
@media (min-width: 800px) {
    .slide-section {
        max-height: 750px;
    }
}
.slide-section-align-left .carousel-caption {
    text-align: left;
    height: 279px;
}
@media screen and (max-width: 778px) {
    .slide-section-align-left .carousel-caption {
        text-align: left;
        height: auto;
    }
}

/* Main Slider CSS End*/

/* Welcome Section CSS start*/
.welcome-section {
    margin-top: 100px;
    text-align: center;
    padding-bottom: 100px;
}
.welcome-section .welcome-caption {
    text-align: center;
}
.welcome-section .welcome-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
}
.welcome-section .welcome-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
    font-size: 24px;
}
.welcome-section .welcome-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.welcome-section .welcome-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 334px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
.welcome-section .welcome-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.welcome-content p {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #5E6D77;
    text-align: center;
    max-width: 923px;
    margin: 0 auto;
}
@media screen and (max-width: 320px) {
    .welcome-section .welcome-caption h4 {
        font-size: 14px;
        text-align: center;
    }
}
.signeture {
    margin-top: 40px;
}
.signeture h4 {
    font-size: 14px;
    color: #2C3841;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    margin-top: 20px;
}
.signeture h4 span {
    font-size: 14px;
    color: #FABC16;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
}

/* Welcome Section CSS end*/

/*Welcome section Template three css start*/
.welcome-section-temp-three .welcome-caption {
    text-align: center;
    margin-top: 100px;
}
.welcome-section-temp-three .welcome-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
    font-size: 24px;
}
.welcome-section-temp-three .welcome-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
}
.welcome-section-temp-three .welcome-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.welcome-section-temp-three .welcome-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 334px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.welcome-section-temp-three .welcome-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.welcome-section-temp-three {
    padding-bottom: 100px;
}
.welcome-section-temp-three .welcome-text p {
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    text-align: justify;
}
.welcome-section-temp-three .welcome-text a {
    min-width: 185px;
    min-height: 50px;
    padding: 0px;
    background: #FAB702;
    color: #fff;
    border: none;
    border-radius: 0px;
    margin-top: 30px;
}
.welcome-section-temp-three .welcome-text a:hover {
    color: #111F29
}
.welcome-section-temp-three .welcome-text a span {
    min-width: 137px;
    min-height: 50px;
    line-height: 50px;
    margin: 0px;
    padding: 0px;
    float: left;
    font-weight: bold;
    border-right: 1px solid #F2AF03
}
.welcome-section-temp-three .welcome-text a i {
    line-height: 50px;
}
.welcome-section-temp-three .welcome-feature ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}
.welcome-section-temp-three .welcome-feature ul li {
    text-align: center;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(1) {
    border-right: 1px solid #EEF2F5;
    border-bottom: 1px solid #EEF2F5;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(1) h4 {
    margin-bottom: 40px;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(2) h4 {
    margin-bottom: 40px;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(3) h4 {
    margin-bottom: 40px;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(2) {
    border-right: 1px solid #EEF2F5;
    border-bottom: 1px solid #EEF2F5;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(3) {
    border-bottom: 1px solid #EEF2F5
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(4) {
    border-right: 1px solid #EEF2F5;
    padding-top: 50px;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(5) {
    border-right: 1px solid #EEF2F5;
    padding-top: 50px;
}
.welcome-section-temp-three .welcome-feature ul li:nth-child(6) {
    padding-top: 50px;
}
.welcome-section-temp-three .welcome-feature ul li i {
    font-size: 26px;
    color: #5E6D77;
}
.welcome-section-temp-three .welcome-feature ul li h4 {
    font-size: 18px;
    color: #111F29;
    font-weight: bold;
}
@media screen and (max-width: 992px) {
    .welcome-feature {
        margin-top: 70px;
    }
}

/*Welcome section themplate three css end*/

/* Service Section CSS start*/
.service-section {
    background: #F0F5F8;
    padding-bottom: 100px;
}
.service-section img {
    min-height: 256px;
    max-height: 256px;
    min-width: 100%;
    max-width: 100%
}
@media screen and (max-width: 320px) {
    .service-section img {
        min-height: auto;
        max-height: auto;
        max-width: 100%;
        margin-bottom: 15px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .service-section img {
        min-height: auto;
        max-height: auto;
        max-width: 100%;
        margin-bottom: 15px;
        width: 100%;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .service-section img {
        min-height: auto;
        max-height: auto;
        max-width: 100%;
        margin-bottom: 30px;
        width: 100%;
        min-height: 346px;
    }
}
.service-section .service-caption {
    text-align: center;
    margin-top: 100px;
}
.service-section .service-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
    font-size: 24px;
}
.service-section .service-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
}
.service-section .service-caption h2 span {
    padding: 0px;
}
.service-section .service-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 256px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
@media screen and (max-width: 320px) {
    .service-section .service-caption h4 {
        font-size: 14px;
        text-align: center;
    }
}
.service-section .service-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px
}
.workingSkill {
    display: flex;
    margin-top: 21px;
}
.workingSkill h4 {
    flex: 1;
    max-width: 177px;
    font-size: 14px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif
}
.workingSkill .progress {
    flex: 1;
    max-width: 590px;
    height: 10px;
    border-radius: 0px;
    padding: 0px;
    margin-bottom: 0px;
    margin-top: 12px;
    box-shadow: none;
    background: #D3DCE1
}
.workingSkill .progress-bar {
    max-width: 590px;
    height: 10px;
    background: #FAB702;
    box-shadow: none;
}
.ratingStar {
    display: flex
}
.ratingStar h4 {
    flex: 1;
    max-width: 177px;
    font-size: 14px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
}
.ratingStar .starrr {
    flex: 1;
    color: #FABC16;
    font-size: 14px;
    line-height: 35px;
}
.starrr span {
    margin-left: 5px;
}
.more {
    color: #A5B5BF;
    font-family: 'Roboto', sans-serif;
}
.more span a {
    color: #FABC16;
    font-family: 'Roboto', sans-serif;
}
@media screen and (max-width: 320px) {
    .workingSkill h4,
    .ratingStar h4 {
        font-size: 11px;
    }
    
    .more {
        font-size: 12px;
    }
}
.service-section ul {
    margin-bottom: 50px;
}
.service-section ul li i {
    width: 100%;
    font-size: 30px;
    float: left;
    text-align: center;
    color: #1d165c;
    margin-bottom: 40px;
    margin-top: 20px;
}
.service-section ul li {
    padding: 0px;
}
@media screen and (max-width: 320px) {
    .service-section ul li {
        padding: 0px;
        border-bottom: 1px solid #d3d3d3;
        padding-top: 15px;
        height: 130px;
    }
    
    .service-section ul li a {
        font-size: 10px
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .service-section ul li {
        padding: 0px;
        border-bottom: 1px solid #d3d3d3;
        padding-top: 15px;
        height: 130px;
    }
    
    .service-section ul li a {
        font-size: 10px
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .service-section ul li {
        padding: 0px;
        border-bottom: 1px solid #d3d3d3;
        padding-top: 15px;
        height: 136px;
    }
    
    .service-section ul li a {
        font-size: 10px
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .service-section ul li {
        padding: 0px;
        border-bottom: 1px solid #d3d3d3;
        padding-top: 15px;
        height: 130px;
    }
    
    .service-section ul li a {
        font-size: 10px
    }
}
.service-section ul li a {
    padding: 0px;
    width: 100%;
    font-family: 'Roboto', sans-serif;
    float: left;
    border: none;
}
.service-section ul li a:hover {
    background: transparent;
    border: none;
    border-bottom: 1px solid #1d165c;
}
.service-section ul li a span {
    width: 100%;
    text-align: center;
    color: #5E6D77;
    float: left;
    font-weight: bold;
    margin-bottom: 30px;
    font-family: 'Roboto', sans-serif;
}
.nav-tabs> li.active> a,
.nav-tabs> li.active> a:hover,
.nav-tabs> li.active> a:focus {
    color: #111F29;
    background-color: transparent;
    border: 1px solid #1d165c;
    /*
   border-left: 0px;
   border-top: 0px;
   border-right: 0px;
*/
}
.nav-tabs .active a span {
    color: #111F29;
    background-color: transparent;
}
.nav-tabs>li>a:hover i,
.nav>li>a:focus i,
.nav>li>a:hover i {
    ;
    color: #1d165c;
}
.nav-tabs> li.active> a i,
.nav-tabs> li.active> a:hover i,
.nav-tabs> li.active> a:focus i {
    color: #1d165c;
}
.nav-tabs> li.active> a {
    color: #000;
}
.nav-tabs .active a {
    color: #000 !important;
}
.nav-tabs>li>a:hover span,
.nav>li>a:focus span,
.nav>li>a:hover span {
    color: #10283F;
}
.service-tab p {
    color: #5E6D77;
    font-size: 14px;
    text-align: justify;
}
@media screen and (max-width: 320px) {
    .service-tab p {
        font-size: 12px;
    }
}

/* Service Section CSS end*/

/* Service section Template three css start*/
.service-section-template-three .service-caption {
    text-align: center;
    margin-top: 100px;
    margin-bottom: 90px;
}
.service-section-template-three .service-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
}
.service-section-template-three .service-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
}
.service-section-template-three .service-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.service-section-template-three .service-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 330px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
@media screen and (max-width: 992px) {
    .service-section-template-three .service-item a {
        float: none;
    }
    
    .service-item p {
        width: 100%;
        margin: auto;
    }
}
.service-section-template-three .service-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 5px;
}
.service-section-template-three {
    background: #F0F5F8;
    padding-bottom: 40px;
}
.service-page {
    background: #fff;
}
.service-section-template-three .service-item i:first-child {
    font-size: 36px;
}
.service-section-template-three .service-item h4 {
    margin-top: 40px;
}
.service-section-template-three .service-item a:hover i {
    color: #FAB702;
}
.service-section-template-three .service-item a i:last-child {
    width: 30px;
    height: 30px;
    float: left;
    color: #111F29;
    text-align: center;
    line-height: 30px;
    border-radius: 30px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
.service-section-template-three .service-item a:hover i:last-child {
    background: orange;
    width: 30px;
    height: 30px;
    float: left;
    color: #fff;
    text-align: center;
    line-height: 30px;
    border-radius: 30px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
.service-item {
    text-align: center;
    margin-bottom: 59px;
}
.service-item .top-icon {
    font-size: 36px;
    color: #5E6D77;
    margin-bottom: 30px;
}
.service-item h4 {
    font-size: 18px;
    color: #111F29;
    margin-bottom: 30px;
    font-weight: bold
}
.service-item p {
    font-size: 14px;
    color: #5E6D77;
    margin-bottom: 30px;
}
.service-item i {
    font-size: 14px;
    color: #5E6D77;
}
.service-item a {
    float: left;
}
.service-item a:hover {
    text-decoration: none;
}

/* Service section Template three css end*/

/* Consult Section CSS start*/
.consult-section {
    background: url('../images/application-bg.png');
}
.appContent h2 {
    font-size: 24px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
}
.appContent p {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
}
.appContent {
    margin: auto;
    height: auto;
    padding-bottom: 42px;
}
.appContentContainer {
    display: flex;
    padding-top: 40px;
}
.btn-bookNow {
    width: 222px;
    height: 60px;
    background: #0C253C;
    border-radius: 0px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    font-family: 'Roboto', sans-serif
}
.btn-bookNow:hover {
    color: #F8B708;
    transition: .1s all ease-in;
}
.btn.focus,
.btn:focus {
    color: #fff;
}
.btn-bookNow span {
    width: 174px;
    height: 60px;
    line-height: 60px;
    float: left;
    padding: 0px;
}
.btn-bookNow i {
    height: 57px;
    line-height: 60px;
    width: 43px;
    float: left;
    padding: 0px;
    border-left: 2px solid #091D30;
}
.appBtnContainer {
    padding-top: 60px;
}
@media screen and (max-width: 320px) {
    .appBtnContainer {
        padding-top: 0px;
        margin-bottom: 60px
    }
    
    .appContentContainer {
        display: block;
    }
    
    .btn-bookNow i {
        display: none;
    }
    
    .btn-bookNow {
        width: 170px;
    }
    
    .btn-bookNow span {
        width: 100%;
        height: auto;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .appBtnContainer {
        padding-top: 0px;
        margin-bottom: 60px
    }
    
    .appContentContainer {
        display: block;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .appBtnContainer {
        padding-top: 0px;
        margin-bottom: 60px
    }
    
    .appContentContainer {
        display: block;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .appBtnContainer {
        padding-top: 0px;
        margin-bottom: 60px
    }
    
    .appContentContainer {
        display: block;
    }
}

/* Consult Section CSS end*/

/* Feature section css start */
.feature-section {
    margin-top: 108px;
    padding-bottom: 97px;
}
@media (min-width: 480px) and (max-width: 992px) {
    .feature-section .feature-item {
        width: 61%;
        margin: auto;
        float: none;
        height: 164px
    }
    
    .feature-section-transparent .feature-item {
        width: 51%;
        margin: auto;
        float: none;
        height: 164px
    }
}
.feature-section span i {
    font-size: 24px;
    width: 60px;
    height: 60px;
    float: left;
    background: #F0F5F8;
    border-radius: 50px;
    text-align: center;
    line-height: 60px;
}
.feature-section p {
    max-width: 302px;
    float: left;
    position: relative;
    margin-left: 85px;
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
}
.feature-section h4 {
    font-size: 18px;
    font-weight: bold;
    position: relative;
    left: 26px;
    top: 10px;
}
@media screen and (max-width: 320px) {
    .feature-section h4 {
        font-size: 14px;
        font-weight: bold;
        position: relative;
        left: 0px;
        top: 10px;
        float: left;
    }
    
    .feature-section span i {
        font-size: 18px;
        width: 40px;
        height: 40px;
        line-height: 40px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .feature-section h4 {
        font-size: 18px;
        font-weight: bold;
        position: relative;
        left: 0px;
        top: 10px;
        float: left;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .feature-section h4 {
        font-size: 18px;
        font-weight: bold;
        position: relative;
        left: 0px;
        top: 10px;
        width: 88px;
        float: left;
    }
}

/* Feature section css end */

/* Feature section transparent css start */
.feature-section-transparent {
    padding-bottom: 97px;
}
.feature-section-transparent span {
    width: 60px;
    height: 60px;
    float: left;
    background: #F0F5F8;
    border-radius: 50px;
    text-align: center;
    line-height: 60px;
}
.feature-section-transparent span i {
    font-size: 24px;
    text-align: center;
    line-height: 60px;
}
.feature-section-transparent p {
    max-width: 302px;
    float: left;
    position: relative;
    margin-left: 85px;
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
}
.feature-section-transparent h4 {
    font-size: 18px;
    font-weight: bold;
    position: relative;
    left: 26px;
    top: 10px;
}
@media screen and (max-width: 320px) {
    .feature-section-transparent h4 {
        font-size: 18px;
        font-weight: bold;
        position: relative;
        width: 100%;
        left: 0px;
        top: 10px;
        float: left;
        margin-left: 10px
    }
    
    .feature-section-transparent span {
        width: 60px;
        height: 60px;
        float: left;
        background: #F0F5F8;
        border-radius: 91px;
        text-align: center;
        line-height: 60px;
    }
    
    .feature-section-transparent p {
        margin-left: 0px
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .feature-section-transparent h4 {
        font-size: 18px;
        font-weight: bold;
        position: relative;
        width: 100%;
        left: 0px;
        top: 10px;
        float: left;
        margin-left: 10px
    }
    
    .feature-section-transparent span {
        width: 60px;
        height: 60px;
        float: left;
        background: #F0F5F8;
        border-radius: 91px;
        text-align: center;
        line-height: 60px;
    }
    
    .feature-section-transparent p {
        margin-left: 0px
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .feature-section-transparent h4 {
        font-size: 18px;
        font-weight: bold;
        position: relative;
        width: 100%;
        left: 0px;
        top: 10px;
        float: left;
        margin-left: 10px
    }
    
    .feature-section-transparent span {
        width: 60px;
        height: 60px;
        float: left;
        background: #F0F5F8;
        border-radius: 91px;
        text-align: center;
        line-height: 60px;
    }
    
    .feature-section-transparent p {
        margin-left: 0px
    }
}

/* Feature section transparent css end */

/* video section css start */
.top-banner-video {
    min-height: 880px !important;
}
.video-section {
    position: relative;
    width: 100%;
    min-height: 653px;
    overflow: hidden;
    padding: 0px;
}
#video-elem {
    min-width: 100%;
    position: absolute;
    top: 0;
    min-height: 100%;
    background-size: cover;
    width: auto;
    object-fit: cover;
}
.top-banner-video #video-elem {
    min-height: 880px;
}
.video-wrapper {
    position: relative;
    padding: 0px;
}
.video-section-text-center .video-text-wrapper {
    text-align: center;
}
.video-text-wrapper {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    text-align: left
}
.video-text-wrapper h1 {
    color: #fff;
    font-size: 36px;
    font-family: 'Roboto', sans-serif
}
.video-text-wrapper h1 span {
    color: #FAB702;
    font-size: 36px;
    font-family: 'Roboto', sans-serif;
    text-transform: none;
}
.video-text-wrapper h1 em {
    color: #fff;
    font-size: 56px;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
}
.top-banner-video h1 em {
    color: #FAB702;
    font-size: 56px;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
}
.video-text-wrapper .sub-title {
    color: #fff;
    font-style: italic;
    font-size: 18px;
    text-transform: none;
}
.video-section-text-center .video-text-wrapper p {
    margin: auto;
    margin-top: 50px;
    margin-bottom: 50px;
}
.video-text-wrapper p {
    color: #fff;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    margin-top: 50px;
    max-width: 900px;
}
.video-text-wrapper button {
    background: #D9A719;
    color: #fff;
    width: 49px;
    height: 39px;
    border: none;
    margin-bottom: 20px;
}
.video-text-wrapper span {
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 500
}
@media screen and (max-width: 320px) {
    .video-text-wrapper h1 {
        font-size: 26px;
    }
    
    .video-text-wrapper h1 em {
        font-size: 42px;
    }
    
    .video-text-wrapper h1 span {
        font-size: 27px;
    }
    
    .video-text-wrapper .sub-title {
        color: #fff;
        font-style: italic;
        font-size: 12px;
    }
    
    .video-text-wrapper p {
        font-size: 11px;
    }
    
    .video-text-wrapper span {
        font-size: 11px;
    }
    
    .video-section-text-center .video-text-wrapper p {
        margin-top: 31px;
        margin-bottom: 26px;
    }
}
.center-block-btn {
    width: 100%;
    margin-top: 50px;
}
.pause {
    display: none;
}
.video-dark {
    filter: brightness(50%);
}

/* video section css end */

/* video section css left align start */
.video-section-left-align .vertical-align {
    flex-direction: row;
}
.video-section-left-align .vertical-align> [class^="col-"],
.video-section-left-align .vertical-align> [class*=" col-"] {
    align-items: center;
    justify-content: center;
    /* Optional, to align inner items 
                              horizontally inside the column */
}

/**
 *  Do NOT include this part into your stylesheet.
 *  "flex: 1" or "flex-grow: 1" is added to make the inner div
 *  - Which is also a flex-item - take up all the horizontal space
 *  available space inside the flex container (.col-* elements)
 */
.video-section-left-align .vertical-align> [class^="col-"]> div,
.video-section-left-align .vertical-align> [class*=" col-"]> div {
    /* flex: 1; */
    
    flex-grow: 1;
}
.video-section-left-align {
    position: relative;
    width: 100%;
    min-height: 653px;
    overflow: hidden;
    padding: 0px;
}
#video-elem {
    min-width: 100%;
    position: absolute;
    top: 0;
    min-height: 100%;
    background-size: cover;
    width: auto;
    object-fit: inherit;
}
video::-webkit-media-controls {
    display: none;
}
.video-overlay {
    position: relative;
}
.video-overlay-content {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
}
.video-section-left-align .video-text {
    text-align: left;
}
.video-overlay:hover {
    opacity: 1;
}
.video-section-left-align .video-overlay h1 {
    font-size: 36px;
    color: #fff;
    text-align: left;
}
.video-section-left-align .video-overlay i {
    color: #fff;
    word-spacing: 4px;
    text-align: left;
}
.video-overlay h1 em {
    font-style: normal;
    font-size: 56px;
}
.video-overlay h1 span {
    color: #FABC16;
}
.video-section-left-align .video-overlay p {
    font-size: 14px;
    color: #fff;
    text-align: left;
    margin: 0px;
    max-width: 829px;
    margin-top: 77px;
}
.video-section-left-align .video-overlay button {
    text-transform: uppercase;
    font-size: 14px;
    margin: 0px;
    text-align: left;
    margin-top: 65px;
    width: 49px;
    height: 39px;
    border-radius: 0px;
    border: none;
    background: #D9A719;
    color: #fff;
    margin-bottom: 23px;
}
.video-section-left-align .video-overlay button i {
    float: left;
    margin-left: 11px;
}
.video-section-left-align .video-overlay .center-block-btn span {
    color: #fff;
    font-weight: bold;
}

/* video section left align css end */

/* video section css top banner start */
.video-section-top-banner .vertical-align {
    flex-direction: row;
}
.video-section-top-banner .vertical-align> [class^="col-"],
.video-section-top-banner .vertical-align> [class*=" col-"] {
    align-items: center;
    justify-content: center;
    /* Optional, to align inner items 
                              horizontally inside the column */
}

/**
 *  Do NOT include this part into your stylesheet.
 *  "flex: 1" or "flex-grow: 1" is added to make the inner div
 *  - Which is also a flex-item - take up all the horizontal space
 *  available space inside the flex container (.col-* elements)
 */
.video-section-top-banner .vertical-align> [class^="col-"]> div,
.video-section-top-banner .vertical-align> [class*=" col-"]> div {
    /* flex: 1; */
    
    flex-grow: 1;
}
.video-section-top-banner {
    width: 100%;
    min-height: 653px;
    overflow: hidden;
    padding: 0px;
    position: absolute;
    top: 0
}
#video-element {
    background: transparent;
    width: auto;
    object-fit: cover;
}
.video-section-top-banner video {
    max-width: 100%;
    min-height: 880px;
    position: unset;
}
.video-center-item-wrapper {
    margin: auto;
}
.video-section-banner video {
    max-width: 100%
}
.video-section-banner {
    padding: 0px
}
video::-webkit-media-controls {
    display: none;
}
.video-section-top-banner .video-overlay {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    margin-top: 0%;
    opacity: 1;
    z-index: 999999;
    display: flex;
}
.video-section-left-align .video-text {
    text-align: left;
}
.video-overlay:hover {
    opacity: 1;
}
.video-section-top-banner .video-overlay h1 {
    font-size: 36px;
    color: #fff;
    text-align: left;
}
.video-section-top-banner .video-overlay i {
    color: #fff;
    word-spacing: 4px;
    text-align: left;
}
.video-overlay h1 em {
    font-style: normal;
    font-size: 56px;
}
.video-overlay h1 span {
    color: #FABC16;
}
.video-section-top-banner .video-overlay p {
    font-size: 14px;
    color: #fff;
    text-align: left;
    margin: 0px;
    max-width: 829px;
    margin-top: 77px;
}
.video-section-top-banner .video-overlay button {
    text-transform: uppercase;
    font-size: 14px;
    margin: 0px;
    text-align: left;
    margin-top: 65px;
    width: 49px;
    height: 39px;
    border-radius: 0px;
    border: none;
    background: #D9A719;
    color: #fff;
    margin-bottom: 23px;
}
.video-section-top-banner .video-overlay button i {
    float: left;
    margin-left: 11px;
}
.video-section-top-banner .video-overlay .center-block-btn span {
    color: #fff;
    font-weight: bold;
}

/* video section top banner css end */
.portfolio-single-section .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 80px;
    font-size: 24px;
}
.portfolio-single-section .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-single-section .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 304px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.portfolio-single-section .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.portfolio-single-img img {
    min-width: 100%;
    min-height: 300px;
    max-height: 300px;
}
@media screen and (max-width: 320px) {
    .portfolio-single-img img {
        min-width: 100%;
        min-height: auto;
        max-height: auto;
        margin-bottom: 40px;
    }
}
@media screen and (max-width: 950px) {
    .portfolio-single-img img {
        margin-bottom: 40px;
    }
}
.portfolio-single-section {
    margin-top: 100px;
    margin-bottom: 50px;
}
.related-item {
    margin-bottom: 100px;
}
.related-item h2 {
    margin: 0px;
    text-align: left;
    margin-bottom: 50px;
    font-size: 18px;
    font-weight: bold;
}
.portfoli-single-content h2 {
    font-size: 18px;
    color: #000;
    font-weight: bold;
    margin: 0px;
    margin-bottom: 32px;
}
@media screen and (max-width: 320px) {
    .portfoli-single-content h2 {
        font-size: 15px;
        color: #000;
        font-weight: bold;
        margin: 0px;
        margin-bottom: 21px;
        margin-top: 27px;
    }
    
    .portfoli-single-content p {
        font-size: 12px;
        color: #5E6D77;
        line-height: 20px;
    }
}
.btn-live {
    width: 180px;
    height: 50px;
    background: #FAB702;
    line-height: 50px;
    border-radius: 0px;
    border: none;
    color: #fff;
    line-height: 50px;
    padding: 0px;
    font-weight: bold;
    margin-top: 32px;
}
.portfoli-single-content p {
    font-size: 14px;
    color: #5E6D77
}

/* portfolio section css start */
.portfolio-three-column-section .portfolio-caption {
    text-align: center;
    margin-top: 100px;
    margin-bottom: 50px;
}
.portfolio-three-column-section .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 50px;
    font-size: 24px;
}
.portfolio-three-column-section .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-three-column-section .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 187px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
@media screen and (max-width: 320px) {
    .portfolio-three-column-section .portfolio-caption h4 {
        font-size: 14px;
        text-align: center;
    }
}
.portfolio-three-column-section .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.portfolio-three-column-section .portfolio-items .portfolio-item .hover-div {
    background: rgba(250, 188, 22, .9);
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    opacity: 0;
    margin-right: 15px;
    display: flex;
    transition: .3s all ease-in;
    height: 100%;
}
.portfolio-three-column-section .portfolio-items .hover-div:hover {
    background: rgba(250, 188, 22, .9);
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    opacity: 1;
    margin-right: 15px;
    display: flex;
    transition: .3s all ease-in;
    height: 100%;
}
.portfolio-three-column-section .portfolio-items .portfolio-item img:hover {
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.portfolio-rel-div img {
    min-width: 100%;
    min-height: 300px;
    max-height: 300px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
@media (max-width: 400px) {
    .portfolio-rel-div img {
        min-width: 100%;
        min-height: auto;
        max-height: auto
    }
}
.portfolio-three-column-section .nav-pills {
    width: 100%;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-three-column-section .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-three-column-section .nav-pills li a {
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 500
}
@media screen and (max-width: 320px) {
    .portfolio-three-column-section .nav-pills li a {
        font-size: 11px;
    }
}
.portfolio-three-column-section .nav-pills li a:hover {
    color: #FAB702
}
.portfolio-three-column-section .nav-pills li a {
    background: transparent;
    color: #5E6D77;
}
.portfolio-three-column-section .btn-port {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
    font-family: 'Roboto', sans-serif;
}
@media screen and (max-width: 320px) {
    .portfolio-three-column-section .btn-port {
        font-size: 11px;
        width: 166px;
        height: 50px;
    }
    
    .portfolio-three-column-section .btn-port span {
        border: none;
    }
    
    .portfolio-three-column-section .btn-port i {
        display: none;
    }
}

/*portfolio hover start*/
.pic {
    max-width: 100%;
    min-height: 291px;
    position: relative;
    overflow: hidden;
    margin: 0px;
    display: inline-block;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden
}
@media screen and (max-width: 320px) {
    .pic {
        max-width: 100%;
        min-height: auto;
        height: auto;
    }
    
    .pic .pic-image {
        height: auto;
        min-height: auto
    }
    
    .portfolio-three-column-section .pic-caption-item i {
        width: 30px;
        height: 30px;
        border-radius: 34px;
        line-height: 30px;
    }
    
    .portfolio-three-column-section .pic-caption-item h3 {
        font-size: 12px;
    }
}
.pic-3d {
    -webkit-perspective: 500;
    -webkit-transform-style: preserve-3d
}
.pic-caption {
    cursor: pointer;
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(250, 188, 22, .9);
    padding: 10px;
    text-align: center;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    display: flex;
}
.pic-caption-item {
    margin: auto;
}
.pic-image {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    min-height: 298px;
}
.pic:hover .pic-image {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1)
}
.pic-title {
    font-size: 1.8em
}
.pic .pic-image,
.pic-caption,
.pic:hover .pic-caption,
.pic:hover img,
a,
a:hover {
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}
.pic:hover .bottom-to-top,
.pic:hover .come-right {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
.bottom-to-top {
    top: 0;
    left: 0%;
}
.pic:hover .bottom-to-top {
    top: 0;
    left: 0
}
.top-to-bottom {
    bottom: 50%;
    left: 0
}
.pic-3d {
    -webkit-perspective: 500;
    -webkit-transform-style: preserve-3d
}
.come-right {
    -webkit-transform: rotateY(-90deg) rotateX(-90deg);
    -ms-transform: rotateY(-90deg) rotateX(-90deg);
    transform: rotateY(-90deg) rotateX(-90deg);
    left: 0;
    top: 0
}
.pic:hover .come-right {
    -webkit-transform: rotateY(0) rotateX(0);
    -ms-transform: rotateY(0) rotateX(0);
    transform: rotateY(0) rotateX(0)
}
.portfolio-three-column-section .pic-caption-item i {
    width: 50px;
    height: 50px;
    float: left;
    border: 1px solid #fff;
    line-height: 50px;
    padding: 0px;
    border-radius: 34px;
    color: #fff;
}
.portfolio-three-column-section .pic-caption-item h3 {
    font-size: 18px;
    color: #fff;
}

/*portfolio-hover end*/
.portfolio-three-column-section .btn-port:hover {
    color: #111F29;
    transition: .1s all ease-in;
}
.portfolio-three-column-section .btn-port span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px
}
.portfolio-three-column-section .btn-port i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-three-column-section .portfolio-items .portfolio-item .hover-div i {
    color: #fff;
    border: 1px solid;
    width: 40px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    border-radius: 30px;
}
.portfolio-three-column-section .portfolio-items .portfolio-item .hover-div h3 {
    color: #fff;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
}
.portfolio-three-column-section .portfolio-items .portfolio-item .portfolio-rel-div {
    position: relative;
    display: block;
    overflow: hidden;
}
.portfolio-three-column-section .portfolio-item {
    margin-bottom: 30px;
}
.hover-div {
    display: flex;
    text-align: center;
}
.hover-div-content {
    margin: auto;
}

/*portfolio four section*/
.portfolio-four-column-section {
    padding: 0px;
}
.portfolio-four-column-section .portfolio-caption {
    text-align: center;
    margin-top: 100px;
    margin-bottom: 50px;
}
.portfolio-four-column-section .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 50px;
    font-size: 24px;
}
.portfolio-four-column-section .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-four-column-section .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 187px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.portfolio-four-column-section .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.portfolio-four-column-section .portfolio-items .portfolio-item .hover-div p {
    color: #fff;
}
.portfolio-four-column-section .portfolio-item {
    position: relative;
}
.portfolio-four-column-section .hover-div .hover-div-content h3 {
    font-size: 24px;
}
.portfolio-four-column-section .hover-div .btn-link {
    padding: 0px;
}
.portfolio-four-column-section .hover-div {
    position: absolute;
    top: 0;
    background: rgba(250, 183, 2, .7);
    height: 100%;
    opacity: 0;
}
.portfolio-four-column-section .portfolio-item:hover .hover-div {
    opacity: 1
}
.portfolio-four-column-section .portfolio-item .pic-image {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    transition: all .5s ease;
}
.portfolio-four-column-section .portfolio-item:hover .portfolio-rel-div img {
    transform: scale(1.1);
    transition: all .5s ease;
}
.portfolio-four-column-section .hover-div-content {
    margin: auto;
    width: 91%;
    text-align: left;
}
@media (max-width: 400px) {
    .portfolio-four-column-section .portfolio-rel-div img {
        min-width: 100%;
        min-height: auto;
        max-height: auto
    }
}
.portfolio-four-column-section .nav-pills {
    width: 100%;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-four-column-section .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-four-column-section .nav-pills li a {
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 500
}
.portfolio-four-column-section .nav-pills li a {
    background: transparent;
    color: #5E6D77;
}
.portfolio-four-column-section .btn-port {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 70px;
    font-family: 'Roboto', sans-serif;
}
.portfolio-four-column-section .btn-port:hover {
    color: #111F29;
    transition: .1s all ease-in
}
.portfolio-four-column-section .btn-port span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px
}
.portfolio-four-column-section .btn-port i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-four-column-section .portfolio-items .portfolio-item .hover-div i {
    color: #fff;
    border: 1px solid;
    width: 40px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    border-radius: 30px;
}
.portfolio-four-column-section .portfolio-items .portfolio-item .hover-div h3 {
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: bold;
}
.portfolio-four-column-section .portfolio-items .portfolio-item .portfolio-rel-div {
    position: relative;
    display: block;
    overflow: hidden;
    text-decoration: none;
}
@media screen and (max-width: 400px) {
    .portfolio-four-column-section .portfolio-items .portfolio-item .hover-div {
        padding: 40px;
        width: 100%
    }
    
    .portfolio-four-column-section .portfolio-items .portfolio-item .hover-div p {
        display: none;
    }
}
.portfolio-four-column-section .portfolio-item {
    margin-bottom: 0px;
    padding: 0px;
}

/*Portfolio two column*/
.portfolio-two-column .portfolio-caption {
    text-align: center;
    margin-top: 100px;
    margin-bottom: 90px;
}
.portfolio-two-column .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
}
.portfolio-two-column .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-two-column .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 200px;
    margin: 0 auto;
    text-align: left;
}
.portfolio-two-column .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px
}
.portfolio-two-column .portfolio-items .portfolio-item .hover-div {
    background: rgba(250, 188, 22, .9);
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    display: none;
    margin-right: 15px;
    height: 100%;
}
.portfolio-two-column .portfolio-items .portfolio-item:hover .hover-div {
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    display: flex;
    margin-right: 15px;
    height: 100%;
}
.portfolio-two-column .portfolio-items .portfolio-item:hover img {
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.portfolio-two-column .nav-pills {
    width: 100%;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-two-column .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-two-column .nav-pills li a {
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
}
.portfolio-two-column .btn-port {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
}
.portfolio-two-column .btn-port span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px
}
.portfolio-two-column .btn-port i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-two-column .portfolio-items .portfolio-item .hover-div i {
    color: #fff;
    border: 1px solid;
    width: 40px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    border-radius: 30px;
}
.portfolio-two-column .portfolio-items .portfolio-item .hover-div h3 {
    color: #fff;
    font-size: 18px;
}
.portfolio-two-column .portfolio-items .portfolio-item .portfolio-rel-div {
    position: relative;
    display: block;
    overflow: hidden;
}
.portfolio-two-column .portfolio-item {
    margin-bottom: 30px;
}
.portfolio-two-column .portfolio-item img {
    min-width: 100%;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.portfolio-two-column .hover-div {
    display: flex;
    text-align: center;
}
.portfolio-two-column .hover-div-content {
    margin: auto;
}

/*Portfolio two column*/
.portfolio-one-column .portfolio-items h2 {
    font-size: 24px;
    font-weight: bold;
    margin: 0px;
    margin-bottom: 40px;
}
.portfolio-one-column .portfolio-items p {
    max-width: 372px;
    text-align: justify;
    margin-bottom: 23px;
    color: #5E6D77
}
.portfolio-one-column .portfolio-items .btn-portfolio {
    border: 1px solid;
    width: 200px;
    float: left;
    height: 50px;
    text-align: center;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    background: #0C253C;
    border: none;
    border-radius: 0px;
    font-weight: bold;
    text-transform: uppercase;
}
.portfolio-one-column .portfolio-items .btn-portfolio:hover {
    background: #FAB702
}
.portfolio-one-column .portfolio-items .btn-portfolio i {
    margin-left: 20px;
}
.portfolio-one-column .portfolio-caption {
    text-align: center;
    margin-top: 100px;
    margin-bottom: 90px;
}
.portfolio-one-column .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
}
.portfolio-one-column .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-one-column .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 200px;
    margin: 0 auto;
    text-align: left;
}
.portfolio-one-column .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px
}
.portfolio-one-column .portfolio-items .portfolio-item .hover-div {
    background: rgba(250, 188, 22, .9);
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    display: none;
    margin-right: 15px;
    height: 100%;
}
.portfolio-one-column .portfolio-items .portfolio-item:hover .hover-div {
    position: absolute;
    top: 0;
    min-width: auto;
    overflow: hidden;
    width: auto;
    left: 0;
    right: 0;
    margin-left: 13px;
    display: flex;
    margin-right: 15px;
    height: 100%;
}
.portfolio-one-column .portfolio-items .portfolio-item:hover img {
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.portfolio-one-column .nav-pills {
    width: 100%;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-one-column .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-one-column .nav-pills li a {
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
}
.portfolio-one-column .btn-port {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
}
.portfolio-one-column .btn-port span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px
}
.portfolio-one-column .btn-port i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-one-column .portfolio-items .portfolio-item .hover-div i {
    color: #fff;
    border: 1px solid;
    width: 40px;
    height: 40px;
    float: left;
    text-align: center;
    line-height: 40px;
    border-radius: 30px;
}
.portfolio-one-column .portfolio-items .portfolio-item .hover-div h3 {
    color: #fff
}
.portfolio-one-column .portfolio-items .portfolio-item .portfolio-rel-div {
    position: relative;
    display: block;
    overflow: hidden;
}
.portfolio-one-column .portfolio-item {
    margin-bottom: 30px;
}
.portfolio-one-column .portfolio-item img {
    min-width: 100%;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.portfolio-one-column .hover-div {
    display: flex;
    text-align: center;
}
.portfolio-one-column .hover-div-content {
    margin: auto;
}

/*Portfolio masonry css without gap start*/
.portfolio-masonry-section .grid-item {
    padding: 0px;
}
.portfolio-masonry-section .grid-item-content {
    height: 300px;
    margin-bottom: 0px;
    position: relative;
    overflow: hidden;
}
.portfolio-masonry-section .grid-item-content--height2 {
    height: 500px;
}
@media screen and (max-width: 320px) {
    .portfolio-masonry-section .grid-item-content--height2 {
        height: auto;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .portfolio-masonry-section .grid-item-content--height2 {
        height: auto;
    }
}
@media screen and (max-width: 480px) {
    .portfolio-masonary {
        padding: 0px;
    }
}
.portfolio-masonry-section .portfolio-masonary .grid-item-content img {
    height: 100%;
    width: 100%;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.portfolio-masonry-section-gap .portfolio-masonary .grid-item-content img {
    height: 100%;
    width: 100%
}
.portfolio-masonry-section-gap .grid-item-content {
    height: 300px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}
.portfolio-masonry-section-gap .grid-item-content--height2 {
    height: 500px;
    overflow: hidden;
}
@media screen and (max-width: 320px) {
    .portfolio-masonry-section-gap .grid-item-content {
        height: auto;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .portfolio-masonry-section-gap .grid-item-content {
        height: auto;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .portfolio-masonry-section-gap .grid-item-content {
        height: auto;
    }
}
.portfolio-masonry-section .portfolio-masonary .grid-item-content img {
    height: 100%;
    width: 100%
}
@media screen and (max-width: 992px) {
    .portfolio-masonry-section .portfolio-masonary .grid-item-content img {
        height: 100%;
    }
}
.portfolio-hover {
    background: rgba(246, 184, 16, .9);
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    opacity: 0;
    width: 100%;
}
.portfolio-masonary .grid-item-content:hover .portfolio-hover {
    opacity: 1
}
.portfolio-masonary .grid-item-content:hover img {
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.portfolio-hover .hover-content {
    margin: auto;
    text-align: center;
    color: #fff
}
.portfolio-hover .hover-content a {
    border: 1px solid;
    width: 50px;
    color: #fff;
    height: 50px;
    line-height: 50px;
    border-radius: 30px;
    padding: 0px;
    text-decoration: none;
}
.portfolio-masonry-section {
    margin-top: 100px
}
.portfolio-masonry-section .nav-pills {
    text-align: center;
    width: 100%;
    margin-bottom: 50px;
}
.portfolio-masonry-section .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-masonry-section .nav-pills li a {
    color: #5E6D77;
    font-size: 14px;
}
.portfolio-masonry-section .nav-pills li a:hover {
    background: transparent;
    color: #FABB0B
}
.portfolio-masonry-section button {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
}
.portfolio-masonry-section button span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    text-align: center;
}
.portfolio-masonry-section button i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-masonry-section .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
    font-size: 24px;
}
.portfolio-masonry-section .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-masonry-section .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-masonry-section .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    font-family: 'Roboto', sans-serif;
    max-width: 198px;
    margin: 0 auto;
    text-align: left;
}
.portfolio-masonry-section .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px
}
.portfolio-masonry-section-gap {
    margin-top: 100px
}
.portfolio-masonry-section-gap .nav-pills {
    text-align: center;
    width: 100%;
    margin-bottom: 50px;
}
.portfolio-masonry-section-gap .nav-pills li {
    display: inline-block;
    float: none;
}
.portfolio-masonry-section-gap .nav-pills li a {
    color: #5E6D77;
    font-size: 14px;
}
.portfolio-masonry-section-gap .nav-pills li a:hover {
    background: transparent;
    color: #FABB0B
}
.portfolio-masonry-section-gap button {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
}
.portfolio-masonry-section-gap button span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    text-align: center;
}
.portfolio-masonry-section-gap button i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.portfolio-masonry-section-gap .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
    font-size: 24px;
}
.portfolio-masonry-section-gap .portfolio-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 60px;
}
.portfolio-masonry-section-gap .portfolio-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.portfolio-masonry-section-gap .portfolio-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    font-family: 'Roboto', sans-serif;
    max-width: 198px;
    margin: 0 auto;
    text-align: left;
}
.portfolio-masonry-section-gap .portfolio-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px
}

/*portfolio masonry css end*/

/* Testimonial CSS start */
.testimonial-section {
    background: #F0F5F8;
    padding-bottom: 100px;
}
.testimonial-section .testimonial-caption {
    text-align: center;
    margin-top: 100px;
}
.testimonial-section .testimonial-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 37px;
    font-size: 24px;
}
.testimonial-section .testimonial-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.carousel .item .container {
    padding: 0px;
}
.testimonial-section .testimonial-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 275px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
@media screen and (max-width: 320px) {
    .testimonial-section .testimonial-caption h4 {
        font-size: 14px;
        text-align: center;
    }
}
.testimonial-section .testimonial-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 30px;
}
.demo-section .portfolio-item h3 {
    text-transform: uppercase;
    font-size: 18px;
}
.header-parallax {
    background: url('../images/commercial-video-bg.jpg');
    min-height: 350px;
    background-attachment: fixed;
    display: flex;
    position: relative;
    border-bottom: 30px solid rgb(9, 24, 43)
}
.header-parallax:after {
    width: 100px;
    height: 100px;
    background: rgb(9, 24, 43);
    position: absolute;
    text-align: center;
    display: block;
    left: 50%;
    content: '';
    bottom: -50px;
    margin-left: -50px;
    transform: rotate(45deg);
    z-index: -1;
}
.header-parallax .header-caption {
    margin: auto;
    text-align: center;
}
.header-parallax .header-caption i {}
.header-parallax .header-caption p {
    color: #fff;
    max-width: 695px;
    text-align: center;
    font-size: 18px;
}
.header-parallax h2 {
    color: #fff;
    font-size: 60px;
    font-family: 'Roboto', sans-serif;
    text-align: center;
}
@media screen and (max-width: 400px) {
    .header-parallax h2 {
        font-size: 30px;
        text-align: center;
    }
}
.header-section {
    margin-bottom: 100px;
}
.header-section img {
    border: 5px solid #09182B;
    transform: scale(1);
    transition: .3s all ease;
    box-shadow: 0px 8px 7px 1px #999999;
}
.header-section img:hover {
    transform: scale(1.1);
    transition: .3s all ease
}
.site-feature {
    background: #BDC9D7;
    padding-top: 100px;
    padding-bottom: 100px;
}
.site-feature-item h3,
.site-feature-item h4 {
    font-family: 'Roboto', sans-serif
}
.site-feature-item {
    text-align: center;
    margin-bottom: 30px;
}
.site-feature h2 {
    text-align: center;
    font-weight: bold;
    margin-bottom: 100px;
    color: #003366
}
.header-section {
    margin-top: 100px
}
.header-section h3 {
    font-size: 18px;
    text-align: center;
}
.testimonials .carousel .testi-slide {
    color: #5E6D77;
    font-size: 14px;
    margin: 0px auto;
    max-width: 783px;
    line-height: 26px;
    padding: 0px;
    font-style: italic;
}
@media screen and (max-width: 320px) {
    .testimonials .carousel .testi-slide {
        font-size: 11px;
    }
}
.testimonials .carousel a img {
    width: 60px;
    height: 60px;
    margin-bottom: 13px;
}
.testimonials .carousel a {
    width: 100px;
    padding: 0px;
    border-radius: 0px;
    background: transparent !important;
    float: left;
    text-align: center;
}
.testimonials .carousel a:hover {
    background: transparent
}
.testimonials .carousel a {
    background: transparent
}
.testimonials .carousel .active {
    background: transparent
}
.test-item-desig {
    font-family: 'Roboto', sans-serif;
}
.testimonial-section i {
    color: #5E6D77;
    font-size: 24px;
}
@media screen and (max-width: 320px) {
    .testimonial-section i {
        font-size: 18px;
    }
}
.testimonials .carousel li {
    float: left;
    max-width: 100px;
}
.testimonials .controls {
    display: flex;
}
.testimonials .carousel ul {
    margin: auto;
}
@media screen and (max-width: 778px) {
    .testimonials .carousel ul {
        text-align: center;
    }
    
    .testimonials .carousel ul li {
        display: inline-block;
        float: none;
    }
}
.control-container {
    margin-top: 51px;
}
.testimonials .carousel a img {
    border-radius: 30px;
    opacity: .4;
}
.test-item-desig .desigName {
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
}
@media screen and (max-width: 320px) {
    .testimonials .carousel li {
        float: left;
        min-width: 200px;
        margin-bottom: 16px;
    }
    
    .testimonials .carousel a {
        min-width: 200px
    }
    
    .testimonials .carousel .test-item-desig {
        width: 100%;
        float: left;
    }
    
    .test-item-desig .desigColor {
        width: 100%
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .testimonials .carousel li {
        float: left;
        margin-bottom: 16px;
        min-width: 140px;
    }
    
    .testimonials .carousel a {
        min-width: 140px
    }
    
    .testimonials .carousel .test-item-desig {
        width: 100%;
        float: left;
    }
    
    .test-item-desig .desigColor {
        width: 100%
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .testimonials .carousel li {
        float: left;
        min-width: 148px;
        margin-bottom: 16px;
    }
    
    .testimonials .carousel a {
        min-width: 140px
    }
    
    .testimonials .carousel .test-item-desig {
        width: 100%;
        float: left;
    }
    
    .testimonials .carousel a img {
        width: 60px;
        height: 60px;
        margin-bottom: 13px;
        float: left;
        text-align: center;
        margin: auto;
        position: relative;
        left: 50%;
        transform: translateX(-50%) !important;
    }
}
@media (min-width: 480px) and (max-width: 992px) {}
@media screen and (max-width: 320px) {
    .test-item-desig .desigName {
        font-size: 11px;
    }
}
.test-item-desig {
    font-family: 'Roboto', sans-serif;
    margin: 0px;
    margin-top: 16px;
}
.test-item-desig .desigColor {
    text-align: center;
    color: #5E6D77;
    padding: 0px;
    margin: 0px;
    max-width: 100%;
    font-size: 12.5px
}
@media screen and (max-width: 320px) {
    .test-item-desig .desigColor {
        font-size: 13px;
        float: none;
    }
}
.testimonials .carousel .active .test-item-desig {
    opacity: 1;
}
.testimonials .carousel .active img {
    opacity: 1;
}
.testimonials .carousel .test-item-desig {
    opacity: 0;
}

/* Testimonial CSS End */

/* Testimonial theme three CSS start */
.testimonial-section-template-three {
    background: #F0F5F8;
    padding-bottom: 100px;
}
.testimonial-section-template-three .testimonial-caption {
    text-align: center;
    margin-top: 100px;
}
.testimonial-section-template-three .testimonial-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 56px;
}
.testimonial-section-template-three .testimonial-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.carousel .item .container {
    padding: 0px;
}
.testimonial-section-template-three .testimonial-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 330px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.testimonial-section-template-three .testimonial-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 30px;
}
.testimonial-section-template-three .carousel .testi-slide {
    color: #5E6D77;
    font-size: 14px;
    margin: 0px auto;
    max-width: 783px;
    line-height: 26px;
    padding: 0px;
}
.testimonial-section-template-three .carousel a img {
    width: 60px;
    height: 60px
}
.testimonial-section-template-three .carousel a {
    width: 100px;
    padding: 0px;
    border-radius: 76px;
    float: left;
    display: flex;
    text-align: center;
}
@media screen and (max-width: 778px) {
    .testimonial-section-template-three .carousel a {
        display: block;
        width: 100%
    }
    
    .testimonial-section-template-three .carousel .test-item-desig {
        text-align: center !important;
        margin-top: 8px;
    }
    
    .testimonial-section-template-three .test-item-desig .desigName {
        float: left;
        width: 100%;
    }
    
    .testimonial-section-template-three .test-item-desig .desigColor {
        text-align: center !important;
        width: 100% !important
    }
}
.testimonial-section-template-three .carousel a:hover {
    background: transparent
}
.testimonial-section-template-three .carousel a {
    background: transparent;
}
.testimonial-section-template-three .carousel .active {
    background: transparent
}
.testimonial-section-template-three .test-item-desig {
    font-family: 'Roboto', sans-serif;
    min-width: 200px !important;
    height: 100px !important;
    padding-top: 10px;
}
.testimonial-section-template-three .testimonial-section i {
    color: #5E6D77;
    font-size: 24px;
}
.testimonial-section-template-three h2 i {
    color: #5E6D77;
}
.testimonial-section-template-three .carousel li {
    display: inline-block;
    float: none;
    min-width: 210px;
}
.testimonial-section-template-three .controls {
    display: unset;
}
.testimonial-section-template-three .carousel ul {
    text-align: center;
}
.testimonial-section-template-three .control-container {
    margin-top: 51px;
}
.testimonial-section-template-three .carousel a img {
    border-radius: 30px;
    opacity: .4;
}
.testimonial-section-template-three .test-item-desig .desigName {
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
}
.testimonial-section-template-three .test-item-desig {
    font-family: 'Roboto', sans-serif;
    margin: 0px;
    float: left;
    margin-top: 16px;
}
@media screen and (max-width: 320px) {
    .testimonial-section-template-three .carousel li {
        float: left;
        overflow: hidden;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .testimonial-section-template-three .carousel li {
        float: left;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .testimonial-section-template-three .carousel li {
        float: left;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .testimonial-section-template-three .carousel li {
        float: none;
    }
}
.testimonial-section-template-three .test-item-desig .desigColor {
    float: left;
    text-align: left;
    color: #5E6D77;
    padding: 0px;
    margin: 0px;
    max-width: 100%;
    font-size: 13px;
    width: 125px;
}
.testimonial-section-template-three .carousel .active .testimonial-section-template-three .test-item-desig {
    opacity: 1;
    margin: 0px;
    text-align: left;
    float: left;
    background: transparent;
    min-width: 100%;
    margin: auto;
    margin-left: 10px;
}
.testimonial-section-template-three .carousel .active img {
    opacity: 1;
}
.testimonial-section-template-three .carousel .test-item-desig {
    opacity: .4;
    text-align: left;
    float: left;
    background: transparent;
    min-width: 100%;
    margin: auto;
    margin-left: 10px;
}

/* Testimonial theme three CSS End */

/*shop css start*/
.shop-section-upper-part {
    padding-bottom: 100px;
}
.shop-section-upper-part .shop-caption {
    text-align: center;
    margin-top: 100px;
}
.shop-section-upper-part .shop-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 56px;
}
.shop-section-upper-part .shop-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.shop-section-upper-part .shop-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 411px;
    margin: 0 auto;
    text-align: left;
}
.shop-section-upper-part .shop-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px;
    margin-left: 30px;
}
.shop-section-upper-part h3 {
    color: #111F29;
    font-size: 18px;
    font-family: 'Roboto', sans-serif
}
.shop-section-upper-part h3 a {
    color: #111F29;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
}
.shop-section-upper-part p {
    color: #555E64;
    font-size: 14px;
    font-family: 'Roboto', sans-serif
}
.shop-section-upper-part .price {
    width: 100px;
    height: 42px;
    float: left;
    background: #0C253C;
    padding: 0px;
    color: #fff;
    line-height: 42px;
    text-decoration: none;
    text-align: center;
}
.shop-section-upper-part .cart {
    width: 127px;
    height: 42px;
    float: left;
    background: #FAB702;
    padding: 0px;
    color: #fff;
    line-height: 42px;
    text-align: center;
    margin-left: 10px;
    text-decoration: none;
}
.shop-section-upper-part .cart:hover {
    color: #0C253C
}
@media screen and (max-width: 500px) {
    .shop-cart {
        overflow-x: scroll;
    }
    
    .shop-cart table .empty {
        display: none;
    }
}
.shop-cart table tr td {
    line-height: 50px;
}
@media screen and (max-width: 448px) {
    .shop-cart table tr td {
        float: left;
        width: 100%;
    }
}
.shop-cart table .cross i {
    color: #E2E8ED;
    cursor: pointer;
}
.shop-cart table .empty {
    border: none;
}
.shop-cart table input {
    border: none;
}
.shop-cart table tr {
    border-bottom: 1px solid #DDDDDD
}
@media screen and (max-width: 448px) {
    .shop-cart table tr {
        width: 100%;
        float: left;
    }
    
    .shop-cart .table > thead > tr > th {
        width: 100%;
        float: left;
    }
}
.shop-cart table .total-section {
    border-bottom: none;
}
.shop-cart table .total-section td {
    border-bottom: 1px solid #DDDDDD;
}
.shop-cart table td {
    color: #5E6D77
}
.shop-cart table .total-section .empty {
    border-bottom: none;
}
.shop-cart table .total-section .sub-total {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    color: #000;
}
.shop-cart table .total-section .total {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    color: #000;
}
.shop-cart table .total-section .total span {
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    color: #C0C7CA;
    margin-left: 20px
}
@media screen and(max-width: 448px) {
    .shop-cart table tr td {
        float: left;
        width: 100%
    }
    
    .shop-cart table tr {
        float: left;
        width: 100%
    }
}
.shop-cart .btn-cart {
    width: 227px;
    height: 60px;
    background: #FAB702;
    border-radius: 0px;
    border: none;
    border-radius: 0px;
    float: right;
    padding: 0px;
    margin-top: 30px;
    color: #fff;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 100px
}
.shop-cart .btn-cart span {
    width: 177px;
    height: 60px;
    line-height: 60px;
    float: left;
    border-right: 1px solid #F1AE03;
}
.shop-cart {
    margin-top: 100px
}
.shop-cart .btn-cart i {
    float: left;
    line-height: 60px;
    margin-left: 20px;
}
@media screen and (max-width: 500px) {
    .shop-cart .btn-cart {
        float: left;
    }
}
.shop-section-upper-part .favorite {
    width: 42px;
    height: 42px;
    float: left;
    background: transparent;
    padding: 0px;
    color: #555E64;
    line-height: 42px;
    text-align: center;
    border: 1px solid #D3DCE1;
    margin-left: 10px
}
.shop-section-upper-part img {
    width: 100%;
    height: 335px;
}
@media (min-width: 320px) and (max-width: 480px) {
    .shop-section-upper-part .col-xs-12 {
        margin-bottom: 100px;
    }
    
    .shop-section-upper-part img {
        width: 100%;
        height: auto;
    }
}
@media screen and (max-width: 320px) {
    .shop-section-upper-part .col-xs-12 {
        margin-bottom: 100px;
    }
    
    .shop-section-upper-part .cart {
        margin-bottom: 50px;
        margin-left: 0px;
        margin-top: 10px;
    }
    
    .shop-section-upper-part .favorite {
        margin-top: 10px;
    }
    
    .shop-section-upper-part img {
        width: 100%;
        height: auto;
    }
}
.shop-section-middle {
    background: #F0F5F8;
}
.shop-section-middle img {
    width: 100%;
    min-height: 280px
}
@media screen and (max-width: 320px) {
    .shop-section-middle img {
        width: 100%;
        min-height: auto
    }
}

/*shop middle part*/
.shop-section-middle {
    padding-bottom: 100px;
}
.shop-section-middle .shop-caption {
    text-align: center;
    margin-top: 100px;
}
.shop-section-middle .shop-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 56px;
}
.shop-section-middle .shop-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.shop-section-middle .shop-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 391px;
    margin: 0 auto;
    text-align: left;
}
.shop-section-middle .shop-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px;
    margin-left: 30px;
}
.shop-section-middle h3 {
    color: #111F29;
    font-size: 18px;
    font-family: 'Roboto', sans-serif
}
.shop-section-middle h3 a {
    color: #111F29;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
}
.shop-section-middle p {
    color: #555E64;
    font-size: 14px;
    font-family: 'Roboto', sans-serif
}
.shop-section-middle .price {
    width: 100px;
    height: 42px;
    float: left;
    background: #0C253C;
    padding: 0px;
    text-decoration: none;
    color: #fff;
    line-height: 42px;
    text-align: center;
    position: absolute;
    bottom: 0;
    right: 0;
}
.shop-section-middle .shop-img {
    position: relative;
    height: 100%;
    float: left;
    margin-bottom: 50px;
    width: 100%;
}
.shop-section-lower .shop-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 343px;
}
@media screen and (max-width: 920px) {
    .shop-section-middle .shop-img {
        margin-top: 50px;
        width: 100%;
    }
}
.shop-section-middle .cart {
    width: 127px;
    height: 42px;
    float: left;
    background: #FAB702;
    padding: 0px;
    color: #fff;
    line-height: 42px;
    text-align: center;
    text-decoration: none;
}
.shop-section-middle .cart:hover {
    color: #000;
}
.shop-section-middle .favorite {
    width: 42px;
    height: 42px;
    float: left;
    background: transparent;
    padding: 0px;
    color: #555E64;
    line-height: 42px;
    text-align: center;
    border: 1px solid #D3DCE1;
    margin-left: 10px
}
.shop-section-middle .favorite:hover {
    background: #555E64;
    color: #fff
}
.shop-section-lower {
    background: transparent;
}
.shop-section-lower .col-md-3 {
    margin-bottom: 50px;
}
@media screen and (max-width: 320px) {
    .shop-section-middle .cart {
        width: 91px;
        height: 37px;
        float: left;
        background: #FAB702;
        padding: 0px;
        color: #fff;
        line-height: 37px;
        text-align: center;
        text-decoration: none;
        font-size: 11px;
    }
    
    .shop-section-middle .favorite {
        width: 38px;
        height: 38px;
        float: left;
        background: transparent;
        padding: 0px;
        color: #555E64;
        line-height: 42px;
        text-align: center;
        border: 1px solid #D3DCE1;
        margin-left: 10px;
        margin-bottom: 11px;
    }
}
#bx-pager a {
    list-style: none;
}
.bx-wrapper {
    max-width: 100%;
    margin-bottom: 11px;
}
.bx-wrapper img {
    max-width: 100%;
    max-height: 300px;
    min-width: 100%
}
.bx-wrapper .bx-viewport {
    box-shadow: unset;
}
#bx-pager a li {
    display: inline;
}
#bx-pager a li img {
    width: 100px;
    margin: 3px;
    min-height: 106px;
}
.bx-controls-direction {
    display: none;
}
@media screen and (max-width: 320px) {
    .bx-wrapper {
        height: 142px;
    }
}
.single-item-desc .price s {
    font-size: 18px;
    color: #111F29
}
.single-item-desc .price span {
    font-size: 30px;
    color: #111F29;
    font-weight: bold;
    margin-left: 14px;
    margin-right: 18px;
}
.single-item-desc .description {
    margin-top: 30px;
    margin-bottom: 30px;
    text-align: justify;
}
.single-item-desc h3 {
    font-size: 18px;
    color: #111F29;
    font-weight: bold
}
.single-item-desc h3 a {
    font-size: 18px;
    color: #111F29;
    font-weight: bold;
    text-decoration: none;
}
.single-item-desc .price em {
    font-size: 18px;
    color: #FAB702;
    font-weight: bold;
    font-style: normal;
}
.single-item-desc .price .description {
    font-size: 14px;
    color: #555E64
}
.single-item-desc h4 {
    font-size: 14px;
    color: #111F29;
    font-weight: bold;
    width: 98px;
    float: left;
    line-height: 40px;
    padding: 0px;
    margin: 0px;
}
.single-item-desc input {
    width: 91px;
    height: 42px;
    border: 1px solid #EAEFF1;
    padding-left: 12px;
}
.single-item-desc .quantity {
    width: 100%;
}
.single-item-desc .cart {
    width: 127px;
    height: 42px;
    float: left;
    background: #FAB702;
    padding: 0px;
    color: #fff;
    line-height: 42px;
    text-align: center;
    margin-top: 20px;
    text-decoration: none;
}
.single-item-desc .cart:hover {
    color: #000;
}
.single-item-desc .favorite {
    width: 42px;
    height: 42px;
    float: left;
    background: transparent;
    padding: 0px;
    color: #555E64;
    line-height: 42px;
    text-align: center;
    border: 1px solid #D3DCE1;
    margin-left: 10px;
    margin-top: 20px;
}
.single-item-desc .favorite:hover {
    background: #98A0A7;
    color: #fff
}
.product-details ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
    margin-top: 50px;
}
.product-details ul li .name {
    color: #111F29;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    width: 147px;
    float: left;
}
.product-details ul li .value {
    color: #555E64;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
}
.product-details ul li {
    line-height: 30px;
}
.product-details p {
    font-weight: 14px;
    color: #555E64;
    margin-top: 30px;
}
.shop-single-item {
    padding-bottom: 100px;
    margin-top: 100px;
}
.product-details ul li a {
    color: #000;
}
.product-details ul li a:hover {
    background: transparent;
    color: #FAB702
}
.product-details ul .active a {
    background: transparent;
    color: #FAB702
}

/*shop css end*/

/*shop car css start*/
@media screen and (max-width: 700px) {
    .product-caption {
        display: none;
    }
}
.shopping-cart {
    margin-top: 80px
}
.product-caption label:nth-child(1) {
    height: 50px;
    width: 4%;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption label:nth-child(2) {
    height: 50px;
    width: 7%;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption label:nth-child(3) {
    height: 50px;
    width: 38%;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption label:nth-child(4) {
    height: 50px;
    width: 16%;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption label:nth-child(5) {
    height: 50px;
    width: 16%;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption label:nth-child(6) {
    height: 50px;
    line-height: 50px;
    font-size: 14;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
}
.product-caption {
    border-bottom: 3px solid #E4EAED
}
.product-items {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 3px solid #E4EAED;
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif
}
.product-items .product-remove-icon {
    width: 4%;
    height: 50px;
    line-height: 50px;
    cursor: pointer;
}
.product-items .product-image {
    width: 7%;
    height: 50px;
    line-height: 50px
}
.product-items .product-image img {
    min-width: 50px;
    max-height: 50px;
    min-height: 50px;
}
.product-name {
    width: 38%;
}
.product-price {
    width: 16%;
    height: 50px;
    line-height: 50px
}
.product-name {
    height: 50px;
    line-height: 50px
}
.product-quantity {
    width: 16%;
    height: 50px;
    line-height: 50px
}
.product-quantity input {
    width: 82px;
    height: 37px;
    border: 1px solid #ACBBCC;
    color: #5E6D77;
    padding-left: 12px;
}
.shopping-cart .checkout {
    width: 227px;
    height: 60px;
    background: #FAB702;
    border-radius: 0px;
    border: none;
    border-radius: 0px;
    float: right;
    padding: 0px;
    margin-top: 30px;
    color: #fff;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 100px;
}
.shopping-cart .checkout:hover {
    color: #111F29
}
.shopping-cart .checkout span {
    width: 177px;
    height: 60px;
    line-height: 60px;
    float: left;
    border-right: 1px solid #F1AE03
}
.shopping-cart .checkout i {
    float: left;
    ;
    line-height: 60px;
    margin-left: 20px;
}
.product-sub-total {
    padding-top: 20px;
}
.product-sub-total .empty {}
.product-sub-total .product-sub-total-right .subtotal {
    padding: 0px;
    width: 43%;
    color: #0D1725;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif
}
.product-sub-total-right {
    border-bottom: 3px solid #E4EAED;
    padding-top: 9px;
    padding-bottom: 20px;
}
.product-sub-total .subtotal span {
    text-transform: none;
    color: #5E6D77;
    font-weight: normal;
    margin-left: 12px;
}

/*shop cart css end*/

/*Testimonial Single CSS start*/
.testimonial-single-slide {
    padding-bottom: 110px;
}
.testimonial-single-slide .testimonial-caption {
    text-align: center;
    margin-top: 100px;
}
.testimonial-single-slide .testimonial-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 56px;
}
.testimonial-single-slide .testimonial-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.carousel .item .container {
    padding: 0px;
}
.testimonial-single-slide .testimonial-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 307px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
.testimonial-single-slide .testimonial-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px;
    margin-left: 30px;
}
.testimonials h3 {
    margin-top: 25px;
}
#testimonials-row {
    max-width: 900px;
    min-height: 314px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    padding-top: 50px;
    border-image: url('../images/testi-2-bg.png') 1;
}
#testimonials-row img {
    width: 80px;
    height: 80px;
}
.testimonial-single-slide .testimonials i {
    color: #5E6D77;
    font-size: 24px;
}
@media screen and (max-width: 768px) {
    .testimonial-single-slide .testimonials i {
        margin-top: 20px
    }
}
.testimonial-single-slide .testimonials h3 {
    font-size: 14.4px;
    color: #000;
    font-family: 'Roboto', sans-serif;
}
.testimonial-single-slide .testimonials h3 span {
    font-weight: bold;
}
.testimonial-single-slide .item img {
    text-align: center;
}
.testimonial-single-slide .item .col-md-2 {
    padding: 0px;
    max-width: 12%
}
@media screen and (max-width: 400px) {
    .testimonial-single-slide .item .col-md-2 {
        max-width: unset;
    }
}
.testimonial-single-slide .testimonials h4 {
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
}
.testimonial-single-slide .testimonials p {
    font-size: 14px;
    color: #5E6D77;
    font-style: italic;
    margin-top: 20px;
}
.testimonial-single-slide .carousel-indicators {
    display: none;
}
.testimonial-single-slide .slide {
    min-height: 257px;
}
.testimonial-single-slide .slide .testimonials {
    padding-right: 0px;
}
.testimonial-single-slide .column {
    padding-right: 0px;
}
.testimonial-single-slide .right {
    float: right;
    position: absolute;
    bottom: 0;
    right: 0;
    top: 95%;
    background: #fff;
    width: 30px;
    text-decoration: none;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #C4CBD0;
    border: 1px solid;
    border-radius: 20px;
}
.testimonial-single-slide .left {
    float: left;
    position: absolute;
    bottom: 0;
    left: 0;
    top: 95%;
    text-decoration: none;
    background: #fff;
    width: 30px;
    height: 30px;
    text-align: center;
    color: #C4CBD0;
    line-height: 30px;
    border: 1px solid;
    border-radius: 20px;
}

/*Testimonial Single CSS end*/

/* Team section css start*/
.team-item {
    display: block;
    position: relative;
    max-width: 100%;
    text-align: center;
    text-decoration: none;
    margin-bottom: 80px;
}
.team-section .team-social-icon {
    text-align: center;
    margin-top: 8px;
}
.team-section img {
    min-width: 100%;
    max-width: 100%;
}
@media screen and (max-width: 320px) {
    .team-section .team-item-container {
        margin-bottom: 70px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .team-section .team-item-container {
        margin-bottom: 70px;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .team-section .team-item-container {
        margin-bottom: 70px;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .team-section .team-item-container {
        margin-bottom: 70px;
    }
}
.team-item-container .pic-caption {
    cursor: pointer;
    position: absolute;
    width: 100%;
    height: 33%;
    left: 0px;
    bottom: 0;
    background: rgba(250, 188, 22, .9);
    text-align: center;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    display: flex;
    top: unset;
    bottom: -120px;
}
.team-item-container .pic:hover .pic-caption {
    top: unset;
    opacity: 1;
    bottom: 0px;
}
.team-item-container .pic .pic-image,
.pic-caption,
.pic:hover .pic-caption,
.pic:hover img,
a,
a:hover {
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
.demo-section {
    margin-bottom: 100px;
}
.demo-section .portfolio-item a img {
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    height: 200px;
    box-shadow: 0px 8px 7px 1px #999999;
}
@media screen and (max-width: 400px) {
    .demo-section .portfolio-item a img {
        height: auto;
    }
}
.team-name-wrapper {
    margin: auto;
}
.team-section .col-md-3:hover .team-name {
    opacity: 1;
}
.team-name h4 {
    color: #111F29;
    text-align: center;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 4px;
    margin-top: 24px;
}
.team-name h4:hover {
    text-decoration: unset !important;
}
.team-name h4 span {
    color: #111F29;
    text-align: center;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
}
.team-name .desig {
    text-align: center;
    font-size: 14px;
    color: #fff;
    font-family: 'Roboto', sans-serif
}
.team-social-icon {
    margin: auto;
    width: 120px;
}
.team-social-icon a i {
    color: #111F29;
    font-size: 14px;
    width: 24px;
    height: 24px;
    float: left;
    border-radius: 30px;
    line-height: 24px;
}
.team-social-icon a:hover i {
    color: #FAB702;
    font-size: 14px;
    width: 24px;
    height: 24px;
    float: left;
    background: #fff;
    border-radius: 30px;
    line-height: 24px;
}

/*Team section css end*/

/*Team section theme three start*/
.team-template-three .team-caption {
    text-align: center;
    margin-top: 100px;
}
.team-template-three .team-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 71px;
}
.team-template-three .team-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.team-template-three .team-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 352px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.team-template-three .team-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 30px;
}
.team-template-three {
    padding: 0px;
    background: #F0F5F8;
    padding-bottom: 100px;
}
.team-template-three-wrapper {
    margin: 0px;
    padding: 0px;
}
@media (min-width: 1200px) and (max-width: 1900px) {
    .team-template-three-wrapper {
        width: 85%;
    }
}
@media (min-width: 1900px) and screen {
    .team-template-three-wrapper {
        width: 85%;
    }
}
.team-template-three-wrapper {
    width: 85%
}
@media screen and (max-width: 992px) {
    .team-template-three-wrapper {
        width: 100%
    }
}
.team-template-three-wrapper .team-container {
    margin: 0px;
    padding: 0px;
}
.team-template-three-wrapper li img {
    max-width: 100% !important;
    height: auto;
    min-width: 100%;
}
.nav-tabs> li> a {
    border: none;
}
.team-template-three-wrapper .nav-tabs li:hover {
    filter: brightness(95%);
    border-bottom: 10px solid #FAB702;
}
.team-template-three-wrapper .nav-tabs li.active {
    filter: brightness(95%);
    border-bottom: 9px solid #FAB702
}
.team-template-three-wrapper .nav-tabs .nav-tabs {
    border-bottom: none;
}
.team-template-three-wrapper .team-container ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.team-template-three-wrapper .team-container ul li {
    margin: 0px;
    padding: 0px;
    display: inline;
}
.team-template-three-wrapper .working-skill-sec li {
    display: flex !important;
}
.team-template-three-wrapper .working-skill-sec li span {
    flex: 1;
    max-width: 170px;
    color: #536577;
    font-size: 14px;
    font-family: 'Roboto', sans-serif
}
.team-template-three-wrapper .working-skill-sec li .prog-bar {
    flex: 1;
}
.team-template-three-wrapper .working-skill-sec .progress {
    max-height: 10px;
    border-radius: 0px;
    box-shadow: unset;
    background: #D3DCE1
}
.team-template-three-wrapper .working-skill-sec .progress-bar {
    background: #FAB702;
    box-shadow: unset;
}
.team-template-three-wrapper .team-container ul li a {
    margin: 0px;
    padding: 0px;
}
.team-template-three-wrapper .team3-des .designation {
    color: #5E6D77;
    font-size: 14px;
    font-family: 'Roboto', sans-serif
}
.team-template-three-wrapper .team3-des p {
    color: #5E6D77;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    margin-top: 25px;
}
#team3-social-links li a {
    color: #0C253C;
    font-size: 14px;
    width: 33px;
    float: left;
}
#team3-social-links li a i {
    width: 20px;
    height: 20px;
    border-radius: 20px;
    text-align: center;
    line-height: 20px
}
#team3-social-links li a:hover i {
    background: #FAB702;
    color: #fff;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    text-align: center;
    line-height: 20px
}
.team3-skill h5 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #111F29;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 28px;
    margin-bottom: 19px;
}
.team-item-content {
    padding: 0px;
}
.team-container .nav-tabs {
    height: 357px;
}
.team-container .nav-tabs li {
    height: 357px;
}
.team-container .nav-tabs li img {
    height: 347px;
}
@media screen and (max-width: 992px) {
    .team-container .nav-tabs {
        height: auto;
    }
    
    .team-container .nav-tabs li {
        height: auto;
    }
    
    .team-container .nav-tabs li img {
        height: auto;
    }
}

/*Team section theme three end*/

/*project content css start*/
.project-content {
    background: url('../images/project-done.png');
    min-height: 495px;
    color: #fff;
    padding: 100px;
}
.project-content-abs {
    min-height: 495px;
    color: #fff;
    transform: translateY(60px);
}
.project-section {
    position: relative;
    overflow: hidden;
}
.project-items {
    min-height: 121px;
    line-height: 129px;
}
@media screen and (max-width: 320px) {
    .project-items {
        text-align: center;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .project-items {
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .project-items {
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .project-items {
        text-align: center;
    }
}
.project-abs {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    padding-right: 0px;
}
.project-item i {
    font-size: 24px;
    width: 50px;
    height: 50px;
    border: 1px solid #fff;
    text-align: center;
    line-height: 50px;
    border-radius: 50px;
}
.project-item .project-number {
    font-size: 24px;
    color: #F8B502;
    font-family: 'Oswald', sans-serif;
    margin-left: 14px;
}
.project-item em {
    font-size: 24px;
    color: #F8B502;
    font-style: normal;
}
.project-item .project-name {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    margin-left: 20px;
}
@media screen and (max-width: 320px) {
    .project-item i {
        font-size: 14px;
        width: 30px;
        height: 30px;
        line-height: 30px;
    }
    
    .project-item .project-number {
        font-size: 14px;
    }
    
    .project-item .project-name {
        font-size: 11px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .project-item i {
        font-size: 18px;
        width: 40px;
        height: 40px;
        line-height: 40px;
    }
    
    .project-item .project-number {
        font-size: 18px;
    }
    
    .project-item .project-name {
        font-size: 11px;
    }
}
@media (min-width: 480px) and (max-width: 768px) {}
@media (min-width: 480px) and (max-width: 992px) {}

/*project content css end*/

/* Newsletter Section css start*/
.newsletter-section {
    text-align: left;
    background: #F0F5F8;
    min-height: 495px;
    padding-left: 80px;
    padding-top: 60px;
}
@media screen and (max-width: 320px) {
    .newsletter-section {
        padding-left: 0px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .newsletter-section {
        padding-left: 0px;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .newsletter-section {
        padding-left: 0px;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .newsletter-section {
        padding-left: 0px;
    }
}
.newsletter-section .newsletter-caption {
    float: left;
}
.newsletter-section .newsletter-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: left;
    font-size: 24px;
}
.newsletter-section .newsletter-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.newsletter-section .newsletter-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 367px;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.newsletter-section .newsletter-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px;
    margin-left: 0px;
}
@media screen and (max-width: 320px) {
    .newsletter-section .newsletter-caption {
        float: none;
        max-width: 555px;
    }
    
    .newsletter-section .newsletter-caption h2 {
        text-align: center;
    }
    
    .newsletter-section .newsletter-caption h4 {
        max-width: 555px;
        text-align: center;
        font-size: 11px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .newsletter-section .newsletter-caption {
        float: none;
        max-width: 555px;
    }
    
    .newsletter-section .newsletter-caption h2 {
        text-align: center;
    }
    
    .newsletter-section .newsletter-caption h4 {
        max-width: 555px;
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .newsletter-section .newsletter-caption {
        float: left;
        max-width: 555px;
    }
    
    .newsletter-section .newsletter-caption h2 {
        text-align: center;
    }
    
    .newsletter-section .newsletter-caption h4 {
        max-width: 555px;
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .newsletter-section .newsletter-caption {
        float: left;
        min-width: 100%;
        margin-bottom: 50px
    }
    
    .newsletter-section .newsletter-caption h2 {
        text-align: center;
    }
    
    .newsletter-section .newsletter-caption h4 {
        max-width: 100%;
        text-align: center;
        font-size: 15px;
    }
    
    .newsletter-section {
        min-height: 437px;
    }
}
.newsletter-section .email {
    margin-top: 70px;
    padding: 0px;
    max-width: 555px;
    min-height: 60px;
    float: right;
    border-radius: 0px;
    border: 1px solid #DAE2E7;
    background: transparent;
    box-shadow: none;
    text-align: center;
}
.btn-email {
    min-height: 60px;
    background: orange;
    min-width: 100%;
    border-radius: 0px;
    margin-top: 20px;
    color: #fff;
    font-weight: bold;
    float: right;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif
}
.btn-email:hover {
    transition: .1s all ease-in
}
@media screen and (max-width: 320px) {
    .newsletter-section .email {
        float: left;
    }
    
    .btn-email {
        max-width: 555px;
        float: left;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .newsletter-section .email {
        float: left;
    }
    
    .btn-email {
        max-width: 555px;
        float: left;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .newsletter-section .email {
        float: left;
    }
    
    .btn-email {
        max-width: 555px;
        float: left;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .newsletter-section .email {
        float: none;
        margin: auto;
    }
    
    .email-section form {
        text-align: center;
    }
    
    .btn-email {
        float: none;
        margin: auto;
        min-width: 555px;
    }
}
.newsletter-section .email-section {
    padding: 0px;
    margin: 0px;
}

/* Newsletter section css end*/

/* blog section css start*/
.blog-section {
    padding-bottom: 100px;
    margin-top: 70px;
}
.blog-section .blog-caption {
    text-align: center;
    margin-top: 50px;
}
.blog-section .blog-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 71px;
    font-size: 24px;
}
.blog-section .blog-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.blog-section .blog-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 273px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
.blog-section .blog-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px;
    margin-left: 30px;
}
.blog-text {
    background: #F0F5F8
}
.blog-col-6-1 {
    padding: 10px;
}
.blog-col-6-2 {
    padding: 10px;
}
.blog-img {
    padding: 0px;
}
.blog-img img {
    min-width: 100%;
    min-height: 383px;
}
.blog-text {
    padding: 25px;
}
.blog-text .date {
    color: #5E6D77;
    font-size: 14px;
    text-transform: uppercase;
    margin-top: 27px;
}
.blog-text h2 a {
    font-size: 18px;
    color: #111F29;
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    font-weight: bold;
}
.blog-text .blog-content {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #5E6D77;
    margin-top: 26px;
}
.blog-text .btn-blog {
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0px;
    margin-top: 20px;
    margin-bottom: 12px;
}
.blog-text .btn-blog:hover {
    color: #111F29;
}
.blog-text .btn-blog:hover i {
    color: #111F29;
}
.blog-text .btn-blog i {
    margin-left: 10px;
}

/*blog themplate three start*/
.blog-template-three {
    padding-bottom: 100px;
    margin-top: 70px;
}
.blog-template-three .blog-caption {
    text-align: center;
    margin-top: 50px;
}
.blog-template-three .blog-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 71px;
    font-size: 24px;
}
.blog-template-three .blog-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.blog-template-three .blog-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 273px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
.blog-template-three .blog-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 30px;
}
.blog-template-three {
    padding: 0px;
    padding-bottom: 100px;
}
.blog-template-three .blog-wrapper {
    float: right;
    margin: 0px;
}

/*.blog-template-three .blog-wrapper .blog-item{

   background: url('../images/blog-bg.jpg');
}

*/
.blog-template-three .blog-wrapper .blog-item h3 a {
    font-size: 18px;
    color: #111F29;
    font-weight: bold;
}
.blog-template-three .blog-wrapper .blog-item h3 a {
    text-decoration: none;
}
.blog-template-three .blog-wrapper .blog-item h5 {
    font-size: 14px;
    color: #5E6D77;
    margin-top: 20px;
    margin-bottom: 30px;
}
.blog-template-three .blog-wrapper .blog-item span {
    font-size: 14px;
    color: #111F29;
    text-transform: uppercase;
    font-weight: 500;
}
.blog-template-three .blog-wrapper .blog-item p {
    font-size: 14px;
    color: #5E6D77;
    max-width: 900px;
    margin-bottom: 38px;
}
.blog-template-three .blog-wrapper .blog-item .blog-btn {
    text-decoration: none;
    color: #5E6D77;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 24px;
    float: left;
}
.blog-template-three .blog-wrapper .blog-item .blog-btn:hover {
    color: #111F29;
}
.blog-template-three .blog-wrapper .blog-content {
    padding-right: 0px;
    border-bottom: 1px solid #D3DCE1;
    padding-left: 8px;
}
.blog-template-three .blog-wrapper .blog-content:last-child {
    padding-right: 0px;
    border-bottom: 0px solid #D3DCE1;
    padding-left: 8px;
}
.blog-template-three .blog-wrapper .blog-item:hover {
    background: url('../images/blog-bg.jpg');
    min-height: 100%;
    float: left;
    min-width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.blog-standard .blog-content-items img {
    width: 100%;
    max-height: 350px;
}
.blog-standard .blog-content-item .btn {
    float: right;
}
.blog-template-three .blog-wrapper .blog-item:hover h3 {
    color: #fff;
}
.blog-template-three .blog-wrapper .blog-item:hover h5 {
    color: #fff;
}
.blog-template-three .blog-wrapper .blog-item:hover h5 span {
    color: #fff;
}
.blog-template-three .blog-wrapper .blog-item:hover p {
    color: #fff;
}
.blog-template-three .blog-wrapper .blog-item:hover a {
    color: #fff;
}
.blog-template-three .blog-wrapper .blog-item {
    min-height: 100%;
    float: left;
    min-width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 37px;
    padding-top: 14px;
}
@media screen and (max-width: 400px) {
    .blog-template-three .blog-wrapper .blog-item {
        padding-left: 15px;
    }
}

/*Masonry Blog*/
@media (min-width: 420px) and (max-width: 768px) {
    .blog-masonry .grid-item {
        margin-top: 0px;
        height: 600px;
        float: left;
    }
    
    .blog-masonry .grid-item-content--height1 img {
        min-height: auto
    }
}
@media (min-width: 320px) and (max-width: 420px) {
    .blog-masonry .grid-item {
        margin-top: 0px;
        height: 500px;
        float: left;
    }
}
@media screen and (max-width: 320px) {
    .blog-masonry .grid-item {
        margin-top: 0px;
        height: 500px;
        float: left;
    }
}
.blog-masonry .blog-caption {
    text-align: center;
    margin-top: 100px;
}
.blog-masonry .blog-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 0px;
    font-size: 24px;
}
.blog-masonry .blog-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.blog-masonry .blog-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 268px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.blog-masonry .blog-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px;
    margin-left: 30px;
}
.blog-masonry .blog-cat-nav {
    margin-bottom: 70px;
    margin-top: 50px;
    padding-left: 35px;
}
.blog-masonry .nav-pills {
    margin-top: 30px;
    text-align: center;
}
.blog-masonry .nav-pills li {
    float: none;
    display: inline-block;
}
.blog-masonry .nav-pills li a {
    color: #5E6D77;
    font-size: 14px;
}
.blog-masonry .nav-pills a:hover {
    background: transparent;
    color: #F5B50D;
}
.blog-masonry .nav-pills .active a {
    background: transparent;
    color: #F5B50D;
}
.nav-pills> li.active> a,
.nav-pills> li.active> a:focus,
.nav-pills> li.active> a:hover {
    background: transparent;
    color: #F5B50D;
}
.blog-masonry .blog-cat-nav h4 {
    font-weight: bold;
    font-size: 18px;
    margin-left: 14px;
}
@media screen and (max-width: 320px) {
    .blog-masonry .blog-cat-nav {
        margin-bottom: 0px;
        margin-top: 50px;
        padding-left: 16px;
    }
    
    .blog-masonry .nav-pills li a {
        color: #5E6D77;
        font-size: 12px;
    }
}
.blog-masonry .btn-load-more {
    width: 214px;
    height: 50px;
    background: #FABC16;
    border: 0px;
    border-radius: 0px;
    line-height: 50px;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    margin-top: 70px;
    margin-bottom: 100px;
}
.blog-masonry .btn-load-more:hover {
    color: #000;
}
.blog-masonry .btn-load-more span {
    width: 166px;
    height: 50px;
    float: left;
    border-right: 1px solid #EEAA04;
    line-height: 50px;
    padding: 0px;
}
.blog-masonry .btn-load-more i {
    width: 46px;
    height: 50px;
    float: left;
    border-left: 1px solid #FAC002;
    line-height: 50px;
    padding: 0px;
}
.blog-masonry .grid-item-content {
    height: 300px;
    margin-bottom: 30px;
    position: relative;
}
@media screen and (max-width: 768px) {
    .blog-masonry .grid-item-content {
        position: initial !important;
    }
    
    .blog-masonry .grid-item {
        position: initial !important;
    }
}
.blog-masonry .grid-item-content h2 {
    font-size: 18px;
    color: #111F29
}
.blog-masonry .grid-item-content h2 a {
    color: #111F29;
    font-weight: bold;
    text-decoration: none;
}
@media screen and (max-width: 320px) {
    .blog-masonry .grid-item-content h2 a {
        font-size: 14px;
    }
    
    .blog-masonry .container {
        padding: 0px;
    }
    
    .blog-masonry .btn-load-more i {
        display: none;
    }
    
    .blog-masonry .btn-load-more {
        width: 165px;
        font-size: 12px;
        float: left;
    }
}
.blog-masonry .grid-item-content .btn {
    width: 134px;
    height: 40px;
    line-height: 40px;
    background: #111F29;
    padding: 0px;
    color: #fff;
    font-weight: bold;
    border-radius: 0px;
}
.blog-masonry .grid-item-content .btn:hover {
    background: #FAB702
}
.blog-masonry .grid-item-content--height2 {
    height: 420px;
}
.blog-masonry p {
    color: #6E767C;
}
.blog-masonry p span {
    color: #000
}
.blog-masonry .grid-item-content--height1 {
    height: 520px;
}
.blog-masonry .grid-item-content--height1 img {
    min-height: 300px;
    width: 100%
}
.blog-masonry .grid-item-content--height2 img {
    min-height: 200px;
    width: 100%;
}
@media screen and (max-width: 768px) {
    .blog-masonry .grid-item-content--height2 img {
        min-height: auto;
    }
}
@media screen and (max-width: 420px) {
    .blog-masonry .grid-item-content--height1 img {
        min-height: auto;
        height: auto
    }
    
    .blog-masonry .grid-item-content--height2 img {
        min-height: auto;
        height: auto;
    }
    
    .blog-masonry .grid-item-content--height1 {
        margin-top: 50px
    }
    
    .blog-masonry p {
        font-size: 12px;
    }
    
    .blog-masonry .grid-item-content .btn {
        font-size: 12px;
    }
    
    .blog-masonry .container-fluid {
        padding: 0px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .blog-masonry .grid-item-content--height1 img {
        min-height: auto;
        width: 100%;
        height: auto !important;
    }
    
    .blog-masonry .grid-item-content--height2 img {
        min-height: auto;
        width: 100%;
        height: auto !important;
    }
    
    .blog-masonry .grid-item-content--height1 {
        margin-top: 50px
    }
    
    .blog-masonry .grid-item-content .btn {
        font-size: 12px;
    }
    
    .blog-masonry p {
        font-size: 12px;
    }
}
@media screen and (max-width: 998px) {
    .blog-masonry .grid-item-content--height1 img {
        min-height: auto;
        width: 100%;
        height: auto;
        margin-top: 50px
    }
    
    .blog-masonry .grid-item-content--height2 img {
        min-height: auto;
        width: 100%;
        height: auto;
        margin-top: 50px
    }
}
@media (min-width: 768px) and (max-width: 1200px) {
    .blog-masonry .grid-item-content--height1 img {
        margin-top: 50px
    }
    
    .blog-masonry .grid-item-content--height2 img {
        margin-top: 50px
    }
}
@media (min-width: 320px) and (max-width: 768px) {
    .blog-masonry .grid-item:nth-child(1) img {
        margin-top: 0px;
        margin-bottom: 0px
    }
    
    .blog-masonry .grid-item:nth-child(2) img {
        margin-top: 0px;
        margin-bottom: 0px
    }
    
    .blog-masonry .grid-item-content--height1 img {
        margin-top: 50px;
        height: 300px
    }
    
    .blog-masonry .grid-item-content--height2 img {
        margin-top: 50px;
        height: 300px
    }
}

/*Blog masonry end*/
.pagination-section nav ul {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #D7DFE4
}
.pagination-section nav ul li {
    display: inline-block;
    float: none;
    max-height: 29px;
}
.pagination-section nav ul li a {
    min-height: 34px;
    border-radius: 0px;
    border: none;
    color: #6E757B;
}
.pagination> li:last-child> a,
.pagination> li:last-child> span {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.pagination> li:first-child> a,
.pagination> li:first-child> span {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.pagination-section nav ul li a:hover {
    border-bottom: 1px solid #FABD19;
    background: transparent;
}

/* blog section css end*/

/* 5 columns grid for 'md' and 'lg' screens
   @tatygrassini start
*/
@media (min-width: 992px) {
    .col-md-1-5 {
        width: 20%;
        padding: 10px
    }
    
    .col-md-2-5 {
        width: 40%;
        padding: 10px
    }
    
    .col-md-3-5 {
        width: 60%;
        padding: 10px
    }
    
    .col-md-4-5 {
        width: 80%;
        padding: 10px
    }
    
    .col-md-5-5 {
        width: 100%;
        padding: 10px
    }
}
@media (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        padding: 10px
    }
    
    .col-lg-2-5 {
        width: 40%;
        padding: 10px
    }
    
    .col-lg-3-5 {
        width: 60%;
        padding: 10px
    }
    
    .col-lg-4-5 {
        width: 80%;
        padding: 10px
    }
    
    .col-lg-5-5 {
        width: 100%;
        padding: 10px
    }
}

/* Demo only, no need for this */
.show-grid [class^=col-] span,
.container-fluid .show-grid [class^=col-] {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #eee;
    background-color: rgba(86, 61, 124, .15);
    text-align: center;
    border: 1px solid #ddd;
    border: 1px solid rgba(86, 61, 124, .2);
}

/* 5 columns grid for 'md' and 'lg' screens
   @tatygrassini end
*/

/*Fun fact css start*/
.fun-fact {
    background: url('../images/fun-fact.png');
    min-height: 400px;
}
.fun-fact-items {
    display: flex;
    min-height: 400px;
}
.fun-fact-item {
    margin: auto;
}
.fun-fact-item i {
    font-size: 24px;
    color: #fff;
    width: 50px;
    height: 50px;
    float: left;
    border: 1px solid;
    text-align: center;
    line-height: 50px;
    border-radius: 30px;
}
.fun-fact-item .timer {
    font-size: 24px;
    color: #FAB702;
    font-family: 'Oswald', sans-serif;
    margin: 0px;
}
.fun-fact-item h3 {
    font-size: 24px;
    color: #FAB702;
    float: left;
    width: 100%;
    font-family: 'Oswald', sans-serif;
    padding: 0px;
}
.fun-fact-item h3 em {
    font-style: normal;
    font-family: 'Roboto';
    font-weight: bold;
}
.fun-fact-item span {
    font-size: 14px;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    margin-left: 20px;
}

/*Fun fact css end*/

/* Plan item section css start*/
.plan-section {
    padding-bottom: 100px;
}
.plan-section .plan-caption {
    text-align: center;
    margin-top: 100px;
}
.plan-section .plan-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 71px;
    font-size: 24px;
}
.plan-section .plan-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.plan-section .plan-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 249px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif;
}
.plan-section .plan-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 5px;
    margin-right: 10px;
    margin-left: 30px;
}
.plan-section .plan-item {
    background: #fff;
    border: 1px solid #CCD2D7;
    max-width: 360px;
    margin: 15px;
    padding: 0px
}
@media screen and (max-width: 480px) {
    .plan-section .plan-item {
        margin: 0px;
    }
}
.plan-section .plan-item .plan-item-content {
    display: flex;
    padding: 0px
}
.plan-section .plan-item .upper {
    border-bottom: 1px solid #D3DCE1;
    margin: auto;
    margin: auto;
    min-width: 87%;
    text-align: center;
}
.plan-section .plan-item .upper h2 {
    font-size: 18px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    margin-top: 43px;
}
.plan-section .plan-item .upper h1 {
    font-size: 48px;
    color: #111F29;
    font-family: 'Roboto', sans-serif;
}
.plan-section .plan-item .upper p {
    font-size: 14px;
    color: #5E6D77;
    font-family: 'Roboto', sans-serif;
    margin-top: 13px;
    margin-bottom: 37px;
}
.plan-section .plan-item .middle {
    margin: auto;
    margin-top: 27px;
    text-align: center;
}
.plan-section .plan-item .middle ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}
.plan-section .plan-item .middle ul li {
    line-height: 50px;
    color: #5E6D77;
    font-size: 14px;
    font-size: 'Roboto', sans-serif;
}
.plan-section .plan-item .middle ul li strike {
    color: #9CA7B0;
}
.plan-section .plan-item-content .lower {
    margin: auto;
}
@media screen and (max-width: 320px) {
    .plan-section {
        text-align: center;
    }
    
    .plan-section .plan-item {
        float: none;
        display: inline-block;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .plan-section {
        text-align: center;
    }
    
    .plan-section .plan-item {
        float: none;
        display: inline-block;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .plan-section {
        text-align: center;
    }
    
    .plan-section .plan-item {
        float: none;
        display: inline-block;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .plan-section {
        text-align: center;
    }
    
    .plan-section .plan-item {
        float: none;
        display: inline-block;
    }
}
.btn-plan {
    min-width: 257px;
    height: 60px;
    float: left;
    background: #0C253C;
    color: #fff;
    padding: 0px;
    border-radius: 0px;
    margin-top: 40px;
    margin-bottom: 53px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    letter-spacing: .5px;
}
.btn-plan span {
    min-width: 202px;
    height: 58px;
    float: left;
    border-right: 1px solid #0E2C46;
    line-height: 60px;
}
.btn-plan i {
    width: 50px;
    height: 58px;
    float: left;
    border-left: 1px solid #091C2E;
    line-height: 60px;
}

/*plan hover*/
.plan-item:hover .upper {
    border-bottom: 1px solid #FAB702;
    min-width: 100%;
    color: #fff;
    background: #FAB702;
}
.plan-item:hover .upper h2 {
    color: #fff;
}
.plan-item:hover .upper h1 {
    color: #fff;
}
.plan-item:hover .upper p {
    color: #fff;
}
.plan-item:hover .btn-plan {
    color: #fff;
    background: #FAB702;
}
.plan-item:hover .btn-plan span {
    border-color: transparent;
}
.plan-item:hover .btn-plan i {
    border-color: transparent;
}
.plan-item.active {
    border: none;
    box-shadow: 0px 0px 13px 1px #C5CCD1;
}
.plan-item.active .upper {
    border-bottom: 1px solid #FAB702;
    min-width: 100%;
    color: #fff;
    background: #FAB702;
}
.plan-item.active .upper h2 {
    color: #fff;
}
.plan-item.active .upper h1 {
    color: #fff;
}
.plan-item.active .upper p {
    color: #fff;
}
.plan-item.active .btn-plan {
    color: #fff;
    background: #FAB702;
}
.plan-item.active .btn-plan span {
    border-color: #ECA804
}
.plan-item.active .btn-plan i {
    border-color: #FAC802
}

/* Plan item section css end*/

/*Subscribe section css start*/
.subscribe-section {
    background: url('../images/sub-bg.png');
    min-height: 360px;
    background-attachment: fixed;
}
.sub-caption-sec {
    display: flex;
    min-height: 360px;
}
.sub-caption-sec .subs-caption {
    margin: auto;
}
.sub-form-sec {
    min-height: 360px;
    display: flex;
}
.sub-form-sec form {
    margin: auto;
    width: 100%;
}
@media screen and (max-width: 320px) {
    .sub-form-sec form {
        margin: inherit;
        width: 100%;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .sub-form-sec form {
        margin: auto;
        width: 100%;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .sub-form-sec form {
        margin: auto;
        width: 80%;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .sub-form-sec form {
        margin: auto;
        width: 80%;
    }
}
.sub-form-sec input {
    max-width: 355px;
    min-height: 60px;
    border: 1px solid #F0D076;
    border-radius: 0px;
    color: #fff;
    background: transparent;
}
.sub-form-sec input::-webkit-input-placeholder {
    /* WebKit, Blink, Edge */
    
    color: #fff;
}
.sub-form-sec input:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    
    color: #fff;
    opacity: 1;
}
.sub-form-sec input::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    
    color: #fff;
    opacity: 1;
}
.sub-form-sec input:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    
    color: #fff;
}
.sub-form-sec input:focus {
    outline: none;
    box-shadow: none;
    border: 1px solid #F0D076;
}
.sub-form-sec button {
    min-width: 197px;
    min-height: 60px;
    margin: auto;
    border: 0px;
    background: #FFFFFF;
    color: #EBB116;
    font-weight: bold;
    border-radius: 0px;
    text-transform: uppercase;
}
.sub-form-sec button:hover {
    background: #fff;
    color: #111F29;
}
@media screen and (max-width: 320px) {
    .sub-form-sec button {
        min-width: 100%;
        min-height: 44px;
    }
}
.sub-caption-sec .subs-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    font-size: 24px;
}
.sub-caption-sec .subs-caption h2 span {
    color: #FFF;
    padding: 0px;
}
.sub-caption-sec .subs-caption h4 {
    font-size: 18px;
    color: #fff;
    font-style: italic;
    max-width: 100%;
    font-family: 'Roboto', sans-serif;
    text-align: left;
}
.sub-caption-sec .subs-caption h4:before {
    content: '___';
    position: relative;
    bottom: 8px;
    letter-spacing: 5px;
    color: #fff;
    margin-right: 3px;
}
@media screen and (max-width: 320px) {
    .sub-form-sec {
        display: block;
    }
    
    .sub-form-sec button {
        margin-top: 20px;
        font-size: 12px;
    }
    
    .sub-caption-sec .subs-caption h4 {
        font-size: 12px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .sub-caption-sec .subs-caption h4 {
        font-size: 12px;
        text-align: center;
    }
    
    .sub-form-sec {
        display: block;
        min-height: 200px
    }
    
    .sub-form-sec button {
        margin-top: 20px;
        font-size: 12px;
        min-width: 100%
    }
    
    .sub-caption-sec {
        min-height: 200px
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .sub-form-sec {
        display: block;
    }
    
    .sub-form-sec button {
        margin-top: 20px
    }
}
@media (min-width: 768px) and (max-width: 992px) {
    .sub-form-sec {
        display: block;
        min-height: 163px
    }
    
    .sub-form-sec input {
        max-width: 358px;
        min-height: 60px;
        border: 1px solid #F0D076;
        border-radius: 0px;
        color: #fff;
        background: transparent;
        margin: auto;
        float: left;
    }
    
    .sub-form-sec button {
        min-width: 197px;
        min-height: 60px;
        margin: auto;
        border: 0px;
        background: #FFFFFF;
        color: #EBB116;
        font-weight: bold;
        border-radius: 0px;
        text-transform: uppercase;
        float: left;
        margin-top: 0px;
    }
    
    .sub-caption-sec {
        min-height: 200px
    }
}
@media screen and (max-width: 768px) {
    .sub-form-sec {
        display: block;
        min-height: 200px
    }
    
    .sub-form-sec input {
        max-width: 100%;
        min-height: 60px;
        border: 1px solid #F0D076;
        border-radius: 0px;
        color: #fff;
        background: transparent;
        margin: auto;
        float: left;
        margin-bottom: 30px;
    }
    
    .sub-form-sec button {
        min-width: 100%;
        min-height: 60px;
        margin: auto;
        border: 0px;
        background: #FFFFFF;
        color: #EBB116;
        font-weight: bold;
        border-radius: 0px;
        text-transform: uppercase;
        float: left;
        margin-top: 0px;
    }
    
    .sub-caption-sec {
        min-height: 200px
    }
}

/*subscribe section css end*/

/*Blog home three css start*/
.blog-home-three-col {
    padding-bottom: 100px;
}
.blog-home-three-item img {
    min-width: 100%;
    min-height: 240px;
    height: 240px
}
@media screen and (max-width: 992px) {
    .blog-home-three-item img {
        min-width: 100%;
        min-height: auto;
        max-height: auto
    }
    
    .blog-home-three-item {
        margin-bottom: 80px
    }
}
.blog-home-three-item h4 {
    font-size: 18px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    margin-top: 45px;
    margin-bottom: 20px;
}
.blog-home-three-item h4 a {
    font-size: 18px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    margin-top: 45px;
    margin-bottom: 20px;
    color: #111111
}
.blog-home-three-item h5 {
    margin-bottom: 26px;
}
.blog-home-three-item p {
    color: #5E6D77;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    text-align: justify;
    margin-bottom: 40px
}
.blog-home-three-item h5 span {
    font-size: 14px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
}
.blog-home-three-item a {
    color: #5E6D77;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
}
.blog-home-three-item a:hover {
    color: #111F29;
    text-decoration: none;
}
.blog-home-three-item a i {
    margin-left: 10px;
}
.blog-home-three-col .blog-caption {
    text-align: center;
    margin-top: 100px;
}
.blog-home-three-col .blog-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 71px;
    font-size: 24px;
}
.blog-home-three-col .blog-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.blog-home-three-col .blog-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 268px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.blog-home-three-col .blog-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px;
    margin-left: 30px;
}

/*Blog home three css end*/

/* Page header css start */
.page-header {
    background: url('../images/header-bg.png');
    min-height: 250px;
    text-align: center;
    margin-top: 0px;
    padding: 0px;
    margin-bottom: 0px;
}
.page-header .page-header-wrapper {
    display: flex;
    min-height: 250px;
}
.page-header-wrapper h3 {
    color: #fff;
    font-size: 30px;
    text-transform: uppercase;
}
.page-header-wrapper p {
    color: #fff;
    font-size: 24px;
}
.page-header-wrapper .page-header-content {
    margin: auto;
}
.page-header-wrapper .page-header-content h2 {
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    color: #fff;
}
.page-header-wrapper .page-header-content h4 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #fff;
}

/* Page header css end */
.page {
    margin-top: 100px;
    margin-bottom: 100px;
}
.page h2 {
    font-weight: bold;
    font-size: 24px;
    margin-bottom: 30px
}
.page p {
    text-align: justify;
}

/*page header primary color*/
.page-header-primary {
    background: #F49800;
    min-height: 250px;
    text-align: center;
    margin-top: 0px;
    padding: 0px;
}
.page-header-primary .page-header-wrapper {
    display: flex;
    min-height: 250px;
}
.page-header-primary .page-header-wrapper .page-header-content {
    margin: auto;
}
.page-header-primary .page-header-wrapper .page-header-content h2 {
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    color: #fff;
}
.page-header-primary .page-header-wrapper .page-header-content h4 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #fff;
}

/*page header secondary color*/
.page-header-secondary {
    background: #314451;
    min-height: 250px;
    text-align: center;
    margin-top: 0px;
    padding: 0px;
}
.page-header-secondary .page-header-wrapper {
    display: flex;
    min-height: 250px;
}
.page-header-secondary .page-header-wrapper .page-header-content {
    margin: auto;
}
.page-header-secondary .page-header-wrapper .page-header-content h2 {
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    color: #fff;
}
.page-header-secondary .page-header-wrapper .page-header-content h4 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #fff;
}

/*page header light color*/
.page-header-light {
    background: #DFE2FF;
    min-height: 250px;
    text-align: center;
    margin-top: 0px;
    padding: 0px;
}
.page-header-light .page-header-wrapper {
    display: flex;
    min-height: 250px;
}
.page-header-light .page-header-wrapper .page-header-content {
    margin: auto;
}
.page-header-light .page-header-wrapper .page-header-content h2 {
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    color: #0C253C;
}
.page-header-light .page-header-wrapper .page-header-content h4 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #0C253C;
}

/*page header dark color*/
.page-header-dark {
    background: #11181C;
    min-height: 250px;
    text-align: center;
    margin-top: 0px;
    padding: 0px;
}
.page-header-dark .page-header-wrapper {
    display: flex;
    min-height: 250px;
}
.page-header-dark .page-header-wrapper .page-header-content {
    margin: auto;
}
.page-header-dark .page-header-wrapper .page-header-content h2 {
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    color: #fff;
}
.page-header-dark .page-header-wrapper .page-header-content h4 {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #fff;
}

/*Blog CSS start*/
.blog-section .blog-content-item h2 a {
    color: #111F29;
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: bold;
    margin-top: 35px;
    margin-bottom: 20px;
    text-decoration: none;
}
.blog-section .blog-content-item h3 a {
    color: #111F29;
    font-family: 'Roboto';
    font-size: 18px;
    font-weight: bold;
    margin-top: 35px;
    margin-bottom: 20px;
    text-decoration: none;
}
.blog-section .blog-content-item h4 {
    color: #6E767C;
    font-family: 'Roboto';
    font-size: 14px;
    font-style: normal;
}
.blog-section .blog-content-item h4 span {
    color: #111F29;
    font-family: 'Roboto';
    font-size: 14px;
}
.blog-section .blog-content-item p {
    color: #6E767C;
    font-family: 'Roboto';
    font-size: 14px;
    margin-top: 31px;
    text-align: justify;
    margin-bottom: 29px;
}
.blog-section .blog-content-item .btn {
    width: 146px;
    height: 42px;
    padding: 0px;
    border: none;
    border-radius: 0px;
    background: #111F29;
    font-weight: bold;
    color: #fff;
    line-height: 42px;
}
.blog-section .blog-content-item .btn:hover {
    background: #FAB702
}
.blog-section .blog-content-item .btn i {
    margin-left: 10px;
}
@media screen and (max-width: 320px) {
    .blog-section .blog-content-item h3 a {
        font-size: 14px;
    }
    
    .blog-section .blog-content-item h4 {
        font-size: 12px;
    }
    
    .blog-section .blog-content-item h4 span {
        font-size: 12px;
    }
    
    .blog-section .blog-content-item p {
        font-size: 12px;
    }
    
    .blog-section .blog-content-item .btn {
        font-size: 12px;
    }
}
.blog-section .blog-content-item {
    padding-bottom: 50px;
    position: relative;
    margin-top: 50px;
    border-bottom: 1px solid #DBE2E6
}
.blog-section .blog-content-item:last-child {
    border-bottom: 0px solid
}
.blog-section .blog-content-item .date {
    width: 57px;
    height: 77px;
    background: #FAB702;
    line-height: 77px;
    text-align: center;
    position: absolute;
    color: #fff;
    top: 0;
}
.blog-section .blog-content-item .date h2 {
    font-size: 24px;
    color: #fff;
    font-weight: bold;
    margin: 0px;
    line-height: 40px;
}
.blog-section .blog-content-item .date h4 {
    font-size: 18px;
    color: #fff;
    margin: 0px;
}
@media screen and (max-width: 320px) {
    .blog-section .blog-content-item .date {
        width: 47px;
        height: 59px;
        line-height: 59px;
    }
    
    .blog-section .blog-content-item .date h2 {
        font-size: 18px;
    }
    
    .blog-section .blog-content-item .date h4 {
        font-size: 14px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .blog-section .blog-content-item .date {
        width: 47px;
        height: 59px;
        line-height: 59px;
    }
    
    .blog-section .blog-content-item .date h2 {
        font-size: 18px;
    }
    
    .blog-section .blog-content-item .date h4 {
        font-size: 14px;
    }
}

/*Blog sidebar*/
.blog-section .blog-sidebar {
    margin-top: 50px;
}
.blog-section .blog-sidebar form {
    border-bottom: 1px solid #DDE4E8;
    float: left;
    width: 100%;
    height: 30px;
    padding-left: 10px
}
.blog-section .blog-sidebar form input {
    border: 0px solid;
    min-width: 90%;
}
.blog-section .blog-sidebar form button {
    float: right;
    background: transparent;
    border: none;
}
.blog-section .blog-sidebar .latest-post-section {
    margin-top: 106px;
}
.blog-section .blog-sidebar .latest-post-section h4 {
    margin-bottom: 50px;
    font-size: 18px;
    font-weight: bold;
}
.latest-item-left img {
    width: 80px;
    height: 80px;
}
@media screen and (max-width: 320px) {
    .blog-section .blog-sidebar .latest-post-section h4 {
        font-size: 13px;
    }
}
.blog-section .blog-sidebar .latest-post-item {
    display: flex;
    margin-bottom: 30px;
}
.blog-section .blog-sidebar .latest-post-item .latest-item-right h4 {
    margin: 0px;
    margin-top: 10px;
}
.blog-section .blog-sidebar .latest-post-item .latest-item-right h4 a {
    color: #111F29;
    text-decoration: none;
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
}
.blog-section .blog-sidebar .latest-post-item .latest-item-right p {
    color: #6E767C
}
@media screen and (max-width: 320px) {
    .blog-section .blog-sidebar .latest-post-item .latest-item-right h4 a {
        font-size: 13px;
    }
}
.blog-section .blog-sidebar .latest-post-item .latest-item-left {
    width: 25%
}
.blog-section .blog-sidebar .latest-post-item .latest-item-right {
    width: 75%;
    padding-left: 12px
}
.blog-section .blog-sidebar .archive-section {
    margin-top: 60px;
}
.blog-section .blog-sidebar .archive-section h4 {
    margin-bottom: 45px;
    font-size: 18px;
    font-weight: bold;
}
@media screen and (max-width: 320px) {
    .blog-section .blog-sidebar .archive-section h4,
    .blog-section .blog-sidebar .tag-section h4 {
        font-size: 13px !important;
    }
}
.blog-section .blog-sidebar .archive-items ul {
    list-style: none;
    padding-left: 25px;
    margin: 0px;
}
.blog-section .blog-sidebar .archive-items ul li {
    line-height: 30px;
}
.blog-section .blog-sidebar .archive-items ul li a {
    color: #5E6D77;
    font-size: 14px;
    margin-left: 15px;
}
@media screen and (max-width: 320px) {
    .blog-section .blog-sidebar .archive-items ul li a {
        font-size: 11px;
    }
}
.blog-section .blog-sidebar .tag-section {
    margin-top: 70px;
}
.blog-section .blog-sidebar .tag-section h4 {
    margin-bottom: 45px;
    font-size: 18px;
    font-weight: bold;
}
.blog-section .blog-sidebar .tag-section .tag-item a {
    border: 1px solid #D3DCE1;
    color: #5E6D77;
    border-radius: 0px;
    padding: 14px;
    margin: 3px;
    font-size: 14px;
    font-family: 'Roboto', sans-serif
}
.blog-section .blog-sidebar .tag-section .tag-item a:hover {
    background: #5E6D77;
    color: #fff;
}
.blog-single blockquote {
    padding-left: 32px;
    display: flex;
    font-size: 16px;
    font-style: italic;
    color: #5E6D77;
    border: none;
}
.blog-single blockquote i {
    width: 46px;
    font-size: 24px;
}
.blog-single blockquote span h4 {
    float: right;
    font-size: 18px;
    color: #000 !important;
    font-weight: bold;
    margin-top: 34px;
}
.blog-single blockquote span h4 span {
    color: #ABB3B8 !important;
    font-weight: normal;
}
.blog-section .social-items span {
    float: left;
    font-weight: bold;
    color: #27343D;
    font-family: 'Roboto', sans-serif;
}
.blog-section .social-items ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
    float: left;
    margin-left: 17px;
}
@media screen and (max-width: 320px) {
    .blog-section .social-items ul {
        margin-left: 0px;
        margin-top: 10px;
    }
    
    .blog-section .blog-content-item blockquote h4 span {
        font-size: 12px;
        width: 100%;
        float: left;
    }
    
    .blog-section .blog-content-item h2 a {
        font-size: 13px;
    }
}
.blog-section .social-items ul li {
    display: inline;
}
.blog-section .social-items ul li a i {
    color: #5E6D77;
    font-size: 14px;
}
.blog-section .social-items ul li a {
    width: 25px;
    text-align: center;
    float: left;
}
.social-items {
    padding: 0px;
}
.commenter-img {
    padding: 0px
}
.commenter-comment {
    padding: 0px;
}
@media screen and (max-width: 992px) {
    .commenter-comment {
        margin-top: 30px
    }
}
.commenter-comment h4 {
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    color: #111F29
}
.commenter-comment p {
    margin-top: 22px;
    font-size: 14px;
    color: #5E6D77
}
.commenter-comment p a {
    color: #5E6D77;
    font-size: 14px;
    margin-left: 22px;
}
.commenter-comment .date a span {
    color: #5E6D77;
    font-size: 14px;
    margin-right: 15px;
}
.comment-section {
    margin-top: 90px;
}
.comment-section h4 {
    font-size: 14px;
    font-weight: bold;
    font-family: 'Roboto', sans-serif
}
.comment-section .comment-item img {
    width: 60px;
    height: 60px;
    border-radius: 40px;
}
.comment-section .comment-item {
    padding-bottom: 25px;
    margin-top: 25px;
    margin-bottom: 21px;
    border-bottom: 1px solid #D3DCE1;
    float: left;
}
.comment-item:last-child {
    border-bottom: none;
}
@media screen and (max-width: 320px) {
    .comment-section h4 {
        font-size: 12px;
        font-weight: bold;
        font-family: 'Roboto', sans-serif;
        margin-top: 21px;
    }
    
    .commenter-comment p {
        margin-top: 22px;
        font-size: 11px;
        color: #5E6D77;
        line-height: 20px;
    }
}
.form-left-part {
    padding: 0px
}
.form-left-part input {
    width: 100%;
    min-height: 39px;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    margin-top: 30px;
    border-bottom: 1px solid #D3DCE1;
}
.form-right-part {
    min-height: 180px;
}
.form-right-part textarea {
    width: 100%;
    min-height: 180px;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    border-bottom: 1px solid #D3DCE1;
    margin-top: 27px;
}
.comment-form-section form .btn-submit {
    min-width: 217px;
    min-height: 50px;
    padding: 0px;
    text-align: center;
    line-height: 50px;
    color: #fff;
    background: #0C253C;
    font-weight: bold;
    float: left;
    border: none;
    border-radius: 0px;
    margin-top: 30px;
}
.comment-form-section form .btn-submit:hover {
    color: #FAB702
}
.comment-form-section form .btn-submit i {
    margin-left: 20px
}
@media screen and (max-width: 320px) {
    .comment-form-section form .btn-submit i {
        display: none;
    }
    
    .comment-form-section form .btn-submit {
        min-width: 150px;
        min-height: 40px;
        padding: 0px;
        line-height: 40px;
        margin-top: 30px;
        font-size: 11px;
    }
    
    .blog-section .blog-sidebar .latest-post-item .latest-item-right {
        margin-left: 12px;
    }
    
    .blog-single blockquote {
        padding-left: 0px;
        font-size: 13px;
    }
}
@media (min-width: 448px) and (max-width: 992px) {
    .blog-section .blog-sidebar .latest-post-section {
        margin-top: 60px;
    }
    
    .blog-section .blog-sidebar .tag-section {
        margin-top: 9px;
    }
}
@media screen and (max-width: 320px) {
    .blog-section .blog-sidebar .latest-post-item .latest-item-left {
        width: 100%;
    }
    
    .blog-section .blog-sidebar .latest-post-item .latest-item-right h4 a {
        font-size: 9px;
    }
    
    .blog-section .blog-sidebar .latest-post-item .latest-item-right p {
        color: #6E767C;
        font-size: 10px;
    }
}

/*Blog CSS end*/

/*Contact css start*/
.contact-section {
    position: relative;
    margin-top: 100px;
    margin-bottom: 100px;
}
.contact-section-left {
    background: #F0F5F8;
    min-height: 545px
}
.contact-section-abs {
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}
.contact-section-abs .section-contact-items .section-contact-item {
    margin-top: 60px;
    min-height: 117px;
}
.contact-section-abs .section-contact-items .section-contact-item i {
    height: 95px;
    float: left;
    width: 30px;
    font-size: 24px;
    color: #111F29
}
.contact-section-abs .section-contact-items .section-contact-item h4 {
    font-size: 14px;
    color: #111F29;
    font-weight: bold;
    margin: 0px;
    height: 39px;
    float: left;
    margin-left: 12px;
}
.contact-section-abs .section-contact-items .section-contact-item li {
    color: #5E6D77;
    font-size: 14px;
    width: 184px;
}
.contact-section-abs .section-contact-items .section-contact-item ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    float: left;
    margin-top: 32px;
    position: relative;
    right: 15px;
}
@media screen and (max-width: 320px) {
    .contact-section-left {
        min-height: auto;
    }
    
    .contact-section-abs {
        position: initial;
        padding: 0px;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item li {
        font-size: 10px
    }
    
    .section-contact-items {
        background: #F0F5F8;
        margin-bottom: 100px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item i {
        height: 20px;
        width: 100%;
        text-align: center;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item h4 {
        height: 22px;
        width: 100%;
        text-align: center;
        margin-top: 22px;
        margin-left: 0px;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item ul {
        width: 100%;
        text-align: center;
        right: 0;
        margin-top: 10px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item li {
        width: 100%;
        text-align: center;
    }
    
    .section-contact-form {
        padding: 0px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .contact-section-left {
        min-height: auto;
    }
    
    .contact-section-abs {
        position: initial;
    }
    
    .section-contact-items {
        background: #F0F5F8;
        margin-bottom: 100px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item i {
        height: 20px;
        width: 100%;
        text-align: center;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item h4 {
        height: 20px;
        height: 22px;
        width: 100%;
        text-align: center;
        margin-top: 22px;
        margin-left: 0px;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item ul {
        width: 100%;
        text-align: center;
        right: 0;
        margin-top: 10px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item li {
        width: 100%;
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .contact-section-left {
        min-height: auto;
    }
    
    .contact-section-abs {
        position: initial;
    }
    
    .section-contact-items {
        background: #F0F5F8;
        margin-bottom: 100px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item i {
        height: 20px;
        width: 100%;
        text-align: center;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item h4 {
        height: 22px;
        width: 100%;
        text-align: center;
        margin-top: 22px;
        margin-left: 0px;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item ul {
        width: 100%;
        text-align: center;
        right: 0;
        margin-top: 10px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item li {
        width: 100%;
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .contact-section-left {
        min-height: auto;
    }
    
    .contact-section-abs {
        position: initial;
    }
    
    .section-contact-items {
        background: #F0F5F8;
        margin-bottom: 100px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item i {
        height: 20px;
        width: 100%;
        text-align: center;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item h4 {
        height: 22px;
        width: 100%;
        text-align: center;
        margin-top: 22px;
        margin-left: 0px;
    }
    
    .contact-section-abs .section-contact-items .section-contact-item ul {
        width: 100%;
        text-align: center;
        right: 0;
        margin-top: 10px
    }
    
    .contact-section-abs .section-contact-items .section-contact-item li {
        width: 100%;
        text-align: center;
    }
}
.section-contact-form h4 {
    font-size: 18px;
    font-weight: bold;
    color: #091C2E;
    margin: 0px;
}
@media screen and (max-width: 320px) {
    .section-contact-form h4 {
        margin-left: 15px
    }
}
.section-contact-form form input {
    min-width: 100%;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #F3F6F7;
    padding: 16px;
    padding-top: 14px;
    margin-top: 17px;
}
.section-contact-form form textarea {
    min-width: 100%;
    min-height: 215px;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    border-bottom: 1px solid #F3F6F7;
    padding-left: 18px;
    padding-top: 21px;
}
.section-contact-form a {
    width: 217px;
    height: 50px;
    padding: 0px;
    float: left;
    background: #0C253C;
    color: #fff;
    font-weight: bold;
    border: none;
    border-radius: 0px;
    margin-top: 47px;
}
.section-contact-form a:hover {
    color: #FAB702;
}
.section-contact-form a span {
    width: 170px;
    height: 50px;
    padding: 0px;
    float: left;
    border-right: 1px solid #091C2E;
    text-align: center;
    line-height: 50px;
}
.section-contact-form a i {
    height: 50px;
    line-height: 50px;
    float: left;
    text-align: center;
    width: 44px;
}
@media screen and (max-width: 320px) {
    .section-contact-form a i {
        display: none;
    }
    
    .section-contact-form a span {
        width: 170px;
        height: 50px;
        padding: 0px;
        float: left;
        border-right: 1px solid #091C2E;
        text-align: center;
        line-height: 50px;
    }
    
    .section-contact-form a {
        width: 170px;
        height: 50px;
    }
}

/*Contact css end*/

/*Contact classic css*/
.contact-classic-section {
    margin-top: 89px;
    margin-bottom: 70px;
}
.contact-classic-section h4 {
    font-size: 18px;
    font-weight: bold;
    margin: 0px;
    padding: 0px;
    margin-bottom: 25px;
}
.contact-classic-section p {
    text-align: justify;
    color: #6E767C
}
.contact-classic-map {
    margin-bottom: 100px;
}
.contact-classic-section .contact-items .contact-item i {
    float: left;
    font-size: 24px;
    color: #111F29;
    height: 39px;
    line-height: 39px;
}
.contact-classic-section .contact-items .contact-item h4 {
    font-size: 14px;
    color: #111F29;
    font-weight: bold;
    margin: 0px;
    line-height: 39px;
    height: 39px;
    float: left;
    margin-left: 12px;
}
.contact-classic-section .contact-items .contact-item p {
    float: left;
    font-size: 12px;
    margin: 0px;
    padding: 14px;
}

/* section map css*/
.section-map {
    padding: 0px;
}
.section-map iframe {
    position: relative;
    top: 7px;
}
.contact-classic-section .contact-items .contact-item {
    padding: 0px;
}
.contact-classic-section .contact-items .contact-item:nth-child(1) p {
    padding-left: 0px
}
.contact-classic-section .contact-items .contact-item:nth-child(2) p {
    padding-left: 0px
}
@media screen and (max-width: 768px) {
    .contact-classic-section .contact-items .contact-item:nth-child(2) p {
        padding-left: 0px;
        margin-left: 0px !important;
        padding: 0px;
        margin-left: 30px;
        width: 100%;
        text-align: left;
        height: auto;
        line-height: 36px;
    }
    
    .contact-classic-section .contact-items .contact-item:nth-child(1) p {
        padding-left: 0px;
        margin-left: 0px !important;
        padding: 0px;
        margin-left: 30px;
        height: auto;
        width: 100%;
        text-align: left;
        line-height: 36px;
    }
    
    .contact-classic-section .contact-items .contact-item:nth-child(3) p {
        padding-left: 0px;
        margin-left: 0px !important;
        padding: 0px;
        margin-left: 30px;
        height: auto;
        width: 100%;
        text-align: left;
        line-height: 36px;
    }
}

/*About section css*/
.about-section {
    margin-top: 100px;
    margin-bottom: 100px;
}
.about-section .about-caption {
    text-align: left;
}
.about-section .about-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: left;
    margin-bottom: 44px;
    margin-top: 0px;
}
.about-section .about-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.about-section .about-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 416px;
    text-align: left;
    margin-top: 0px;
}
.about-section .about-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
.about-section .social-item a i {
    font-size: 14px;
    color: #091C2E
}
.about-section .social-item a {
    width: 24px;
    float: left;
    text-align: left;
    height: 24px;
    text-align: xe;
    text-align: center;
    line-height: 24px;
    border-radius: 20px;
    margin-right: 14px;
}
.about-description .social-item {
    margin-top: 26px;
}
@media screen and (max-width:450px) {
    .about-section .about-caption h4 {
        font-size: 14px;
        max-width: 84%;
        text-align: center;
    }
    
    .about-section .about-caption h2 {
        text-align: center;
        font-size: 20px;
    }
}
.about-section .social-item a:hover {
    background: #FAB702;
    width: 24px;
    float: left;
    text-align: left;
    height: 24px;
    text-align: xe;
    text-align: center;
    line-height: 24px;
    border-radius: 20px;
    margin-right: 14px;
}
.about-section .social-item a:hover i {
    color: #fff;
}
.about-section .working-skill .col-md-2 {
    padding: 0px;
}
.about-section .working-skill h4 {
    font-size: 14px;
    color: #5E6D77;
    margin: 0px;
}
.about-section .upper-part {
    margin-bottom: 70px;
}
.about-section .upper-part p {
    text-align: justify;
    margin-top: 25px;
    color: #5E6D77
}
.about-section h3 {
    font-size: 18px;
    color: #0C253C;
    font-weight: bold;
    padding-left: 12px;
    margin-bottom: 53px;
}
.about-section .working-skill .progress {
    max-width: 76%;
    background: #D3DCE1;
    height: 10px;
    border-radius: 0px;
    box-shadow: unset;
}
.about-section .working-skill .progress-bar {
    background: #FAB702;
    box-shadow: unset;
}
@media screen and (max-width: 430px) {
    .about-section .upper-part p {
        font-size: 11px;
        line-height: 19px;
    }
    
    .about-section .upper-part {
        margin-bottom: 21px;
    }
    
    .about-section h3 {
        font-size: 14px;
        margin-bottom: 20px;
    }
}
.about-feature-section .about-caption {
    margin-bottom: 0px;
}
.about-feature-section {
    padding-bottom: 100px;
}
.about-feature-section .about-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 44px;
    margin-top: 0px;
}
.about-feature-section .feature-item {
    margin-top: 50px;
}
.about-feature-section .about-caption h2 em {
    color: #FAB702;
    padding: 0px;
    font-style: normal;
}
.about-feature-section .about-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 332px;
    margin: 0px auto;
    font-weight: normal;
    position: relative;
    top: 0px;
    bottom: 14px;
    margin-bottom: 12px;
}
.about-feature-section .about-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 6px;
    margin-right: 10px
}
@media screen and (max-width: 320px) {
    .about-feature-section .about-caption {
        width: 100%;
        float: left;
        height: 100px;
    }
    
    .about-feature-section .about-caption h4 {
        min-width: 100%;
        float: left;
        text-align: center;
        font-size: 14px;
    }
    
    .about-feature-section .about-caption h2 {
        width: 100%;
        float: left;
        font-size: 18px;
    }
    
    .about-img img {
        width: 100%;
    }
    
    .working-skill-bar {
        padding: 0px;
        margin-top: 20px
    }
    
    .feature-section p {
        max-width: 302px;
        float: left;
        position: relative;
        margin-left: 20px;
        font-size: 11px;
        color: #5E6D77;
        font-family: 'Roboto', sans-serif;
        text-align: justify;
        line-height: 20px;
        margin-top: 17px;
    }
    
    .feature-section h4 {
        margin-top: 0px;
        margin-left: 20px;
    }
    
    .fun-fact-item .timer {
        float: left;
        width: 100%;
        font-size: 18px;
    }
    
    .fun-fact-item span {
        float: left;
        width: 100%;
        margin-left: 0px;
        margin-top: 18px;
        font-size: 11px;
    }
    
    .about-feature-section .row {
        width: 100%;
        margin: auto;
    }
    
    .about-section .about-description {
        margin-top: 50px
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .about-feature-section .about-caption {
        width: 100%;
        float: left;
        height: 100px;
    }
    
    .about-feature-section .about-caption h2 {
        width: 100%;
        float: left;
    }
    
    .about-feature-section .about-caption h4 {
        min-width: 100%;
        float: left;
        text-align: center;
    }
    
    .about-img img {
        width: 100%;
    }
    
    .working-skill-bar {
        padding: 0px;
        margin-top: 20px
    }
    
    .feature-section p {
        max-width: 302px;
        float: left;
        position: relative;
        margin-left: 85px;
        font-size: 14px;
        color: #5E6D77;
        font-family: 'Roboto', sans-serif;
        text-align: justify;
    }
    
    .feature-section h4 {
        margin-top: 0px;
        margin-left: 20px;
    }
    
    .fun-fact-item .timer {
        float: left;
        width: 100%;
        font-size: 18px;
    }
    
    .fun-fact-item span {
        float: left;
        width: 100%;
        margin-left: 0px;
        margin-top: 18px;
        font-size: 11px;
    }
    
    .about-feature-section .row {
        width: 100%;
        margin: auto;
    }
    
    .about-section .about-description {
        margin-top: 50px
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .about-feature-section .about-caption {
        width: 100%;
        float: left;
        height: 100px;
    }
    
    .about-feature-section .about-caption h2 {
        width: 100%;
        float: left;
    }
    
    .about-feature-section .about-caption h4 {
        min-width: 100%;
        float: left;
        text-align: center;
    }
    
    .about-img img {
        width: 100%;
    }
    
    .working-skill-bar {
        padding: 0px;
        margin-top: 20px
    }
    
    .feature-section p {
        max-width: 302px;
        float: left;
        position: relative;
        margin-left: 85px;
        font-size: 14px;
        color: #5E6D77;
        font-family: 'Roboto', sans-serif;
        text-align: justify;
    }
    
    .feature-section h4 {
        margin-top: 0px;
        margin-left: 20px;
    }
    
    .fun-fact-item .timer {
        float: left;
        width: 100%;
        font-size: 18px;
    }
    
    .fun-fact-item span {
        float: left;
        width: 100%;
        margin-left: 0px;
        margin-top: 18px;
        font-size: 11px;
    }
    
    .about-feature-section .row {
        width: 100%;
        margin: auto;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .about-feature-section .about-caption {
        width: 100%;
        float: left;
        height: 100px;
    }
    
    .about-feature-section .about-caption h4 {
        min-width: 100%;
        float: left;
        text-align: center;
    }
    
    .about-feature-section .about-caption h2 {
        width: 100%;
        float: left;
    }
    
    .about-img img {
        width: 100%;
    }
    
    .working-skill-bar {
        padding: 0px;
        margin-top: 20px
    }
    
    .feature-section p {
        max-width: 302px;
        float: left;
        position: relative;
        margin-left: 85px;
        font-size: 14px;
        color: #5E6D77;
        font-family: 'Roboto', sans-serif;
        text-align: justify;
    }
    
    .feature-section h4 {
        margin-top: 0px;
        margin-left: 20px;
    }
    
    .fun-fact-item i {
        font-size: 18px;
        width: 40px;
        height: 40px;
        line-height: 40px;
        border-radius: 30px;
    }
    
    .fun-fact-item .timer {
        float: left;
        width: 100%;
        font-size: 18px;
    }
    
    .fun-fact-item span {
        float: left;
        width: 100%;
        margin-left: 0px;
        margin-top: 18px;
        font-size: 11px;
    }
    
    .about-feature-section .row {
        width: 51%;
        margin: auto;
    }
    
    .about-feature-section .feature-item {
        width: 100%
    }
    
    .about-section .about-description {
        margin-top: 100px
    }
}

/*Team section css*/
.team-section {
    padding-bottom: 100px;
}
.team-section .team-caption {
    text-align: center;
    margin-top: 100px;
}
.team-section .team-caption h2 {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    margin-bottom: 70px;
    font-size: 24px;
}
.team-section .team-caption h2 span {
    color: #FAB702;
    padding: 0px;
}
.team-section .team-caption h4 {
    font-size: 18px;
    color: #5E6D77;
    font-style: italic;
    max-width: 282px;
    margin: 0 auto;
    text-align: left;
    font-family: 'Roboto', sans-serif
}
.team-section .team-caption h4:before {
    content: '___';
    letter-spacing: 5px;
    position: relative;
    bottom: 7px;
    margin-right: 10px;
    margin-left: 30px;
}
.team-section h3 {
    color: #0C253C;
    font-size: 18px;
}
.team-section {
    text-align: center;
}
.team-section h3 span {
    font-weight: bold
}
.team-section .team-item .social-icons-items a i {
    font-size: 14px;
    color: #0C253C;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 18px;
}
.team-section .team-item img {
    border-bottom: 10px solid #FAB702
}
.team-section .team-item .social-icons-items a:hover i {
    background: #FAB702;
    color: #fff;
}

/* Client logo css start*/
.clientLogo-section {
    background: #111F29
}
.clientLogo-section ul {
    list-style: none;
    margin: 0px;
    padding: 0px
}
.clientLogo-section ul li {
    display: flex;
    float: left;
    min-height: 200px;
}
@media screen and (max-width: 778px) {
    .clientLogo-section ul {
        text-align: center;
    }
    
    .clientLogo-section ul li {
        min-height: 141px;
        float: none;
        display: inline-flex;
        width: 173px
    }
}
.clientLogo-section ul li img {
    margin: auto;
}
.clientLogo-section ul li img:hover {
    filter: brightness(3);
    cursor: pointer;
    transition: .2s all ease
}
@media screen and (max-width: 320px) {
    .clientLogo-section ul li {
        min-height: 141px;
        width: 100%;
    }
    
    .clientLogo-section ul li img {
        width: 92px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .clientLogo-section ul li {
        min-height: 141px;
    }
    
    .clientLogo-section ul li img {
        width: 92px;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .clientLogo-section ul li {
        min-height: 141px;
    }
    
    .clientLogo-section ul li img {
        width: 92px;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .clientLogo-section ul li {
        min-height: 141px;
        width: 173px
    }
    
    .clientLogo-section ul li img {
        width: 92px;
    }
}

/* Client logo css end*/

/*Sign up section css*/
.signup-container .signup-overlay {
    height: 900px
}
.signup-container {
    height: 900px
}
.signup-overlay {
    background: url('../images/login-bg.jpg');
    height: 600px;
    z-index: 0;
    position: relative;
    top: 0;
    background-size: cover;
    background-position: center;
}
.signup-section-wrapper {
    margin: 0px;
    padding: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    background-position: center;
    background-size: cover;
    background: transparent;
    position: relative;
}
.signup-section {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin: auto;
    left: 0;
    right: 0;
}
.signup-section fieldset {
    color: #5E6D77
}
.signup-item h3 {
    font-size: 18px;
    color: #131E24;
    font-weight: bold;
    margin-bottom: 45px;
    margin-top: 33px;
}
.signup-section fieldset label {
    color: #5E6D77
}
.signup-section form .month,
.signup-section form .date,
.signup-section form .year {
    color: #5E6D77;
}
.signup-section fieldset legend {
    width: 97%;
    margin: 8px;
    margin-bottom: 15px;
    color: #5E6D77
}
.signup-item {
    max-width: 43%;
    padding: 50px;
    margin: auto;
    background: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    border-radius: 4px;
    padding-bottom: 80px;
    box-shadow: 0px 0px 20px 0px #5E6D77;
}
@media screen and (max-width: 448px) {
    .signup-item {
        padding: 10px !important;
        height: auto !important;
    }
    
    .signup-section {
        padding: 0px
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    .signup-item {
        max-width: 52%
    }
}
@media (min-width: 768px) and (max-width: 992px) {
    .signup-item {
        max-width: 65%
    }
}
@media (min-width: 500px) and (max-width: 768px) {
    .signup-item {
        max-width: 82%
    }
}
@media screen and (max-width: 500px) {
    .signup-item {
        max-width: 100%
    }
    
    .signup-item .signup {
        float: left !important;
    }
}
@media screen and (max-width: 420px) {
    .signup-item {
        padding: 28px;
        height: 442px;
    }
}
.login-section label {
    color: #5E6D77;
    font-size: 14px;
    text-transform: uppercase;
}
.login-section .signup-item {
    max-width: 62%;
    padding: 21px;
    margin: auto;
    background: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    min-width: 33%;
}
.signup-item input {
    min-height: 54px;
    border-radius: 4px;
    font-family: 'fontAwesome';
    font-size: 18px;
}
.form-control:focus {
    box-shadow: unset;
}
.signup-item .form-check-input {
    min-height: auto;
}
.form-check-input[type="checkbox"] {
    width: 11px;
    height: 11px;
    border: 1px solid #808080;
    background: #FFF;
}
.checkboxFive {
    width: auto;
    margin: 0px;
    position: relative;
    margin-bottom: 20px;
    margin-top: 20px;
}
.checkboxFive span {
    margin-left: 10px;
    height: 20px;
    position: relative;
    top: -6px;
}
.checkboxFive label {
    cursor: pointer;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0;
    left: 0;
    background: #fff;
    border: 1px solid #ddd;
}
.checkboxFive label:after {
    opacity: 0;
    content: '';
    position: absolute;
    width: 9px;
    height: 5px;
    background: transparent;
    top: 6px;
    left: 7px;
    border: 3px solid #FAB702;
    border-top: none;
    border-right: none;
    transform: rotate(-45deg);
}

/**
 * Create the hover event of the tick
 */
.checkboxFive label:hover::after {
    opacity: 0.5;
}

/**
 * Create the checkbox state for the tick
 */
.checkboxFive input[type=checkbox]:checked + label:after {
    opacity: 1;
}
#checkboxFiveInput {
    min-height: auto
}
.form-check-label {
    font-size: 14px;
}
.signup-item button {
    width: 200px;
    min-height: 50px;
    border-radius: 0px;
    border: none;
    background: #F9C502;
    text-transform: uppercase;
    font-size: 14px;
    border-radius: 37px;
}
.signup-item .signup {
    color: #000;
    text-decoration: none;
    float: right;
    height: 50px;
    line-height: 50px;
    text-transform: uppercase;
}
.signup-item button:hover {
    background: #131E24
}
.signup-item .signup:hover {
    color: #959595;
}

/* Footer css start*/
.footer-section {
    background: url('../images/footer-bg.png');
    background-size: cover;
    background-repeat: repeat-x;
}
@media screen and (max-width: 320px) {
    .footer-section {
        padding-left: 11px;
    }
}
.footer-item-one {
    min-height: 400px;
    display: flex;
}
.footer-item-one-content {
    margin: auto;
    min-width: 209px;
    min-height: 250px;
}
.footer-item-one-content p {
    color: #8EA1AC
}
.footer-item-one h2 {
    font-size: 18px;
    font-family: 'Oswald', sans-serif;
    color: #8ea1ae;
    margin-bottom: 30px;
    margin-top: 0px;
}
@media screen and (max-width: 320px) {
    .footer-item-one-content {
        margin: unset;
        min-width: 209px;
        min-height: unset;
    }
    
    .footer-item-one {
        min-height: 400px;
        display: flex;
        padding: 0px;
    }
    
    .footer-item-one-content p {
        font-size: 11px;
    }
    
    .footer-item-one ul li a {
        font-size: 11px;
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .footer-item-one {
        min-height: auto;
        margin-top: 65px;
    }
    
    .footer-item-one-content {
        margin: unset;
        min-width: 209px;
        min-height: unset;
        display: block;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .footer-item-one {
        min-height: auto;
        margin-top: 65px;
        display: block
    }
    
    .footer-item-one-content {
        margin: unset;
        min-width: 209px;
        min-height: unset;
        text-align: center;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .footer-item-one {
        min-height: auto;
        margin-top: 65px;
        display: block
    }
    
    .footer-item-one-content {
        margin: auto;
        min-width: 209px;
        min-height: auto;
    }
}
.footer-item-one .footer-item-one-content ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.footer-item-one ul i {
    color: #FAB702;
    font-size: 14px;
}
.footer-item-one ul a {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #8ea1ae;
    margin-left: 20px;
    text-decoration: none;
}
.footer-item-one ul a:hover {
    color: #B0BFC8
}
.footer-item-one ul li {
    line-height: 26px;
}
.footer-item-three {
    min-height: 400px;
    display: flex;
}
.footer-item-three .footer-item-one-content {
    margin: auto 16px;
    min-width: 209px;
}
.footer-item-three h2 {
    font-size: 18px;
    font-family: 'Oswald', sans-serif;
    color: #8ea1ae;
    margin-bottom: 30px;
    margin-top: 0px;
}
@media screen and (max-width: 480px) {
    .footer-item-three .footer-item-one-content {
        float: left;
        min-width: unset;
        margin-top: 58px;
    }
}
@media (min-width: 480px) and (max-width: 778px) {
    .footer-item-three .footer-item-one-content {
        margin: auto;
        min-width: unset;
    }
}
.footer-item-three .footer-item-one-content ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.footer-item-three ul i {
    color: #8EA1AE;
    font-size: 14px;
}
.footer-item-three ul a {
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #8ea1ae;
    margin-left: 20px;
    text-decoration: none;
}
@media screen and (max-width: 320px) {
    .footer-item-three ul a {
        font-size: 11px;
    }
}
.footer-item-three ul a:hover {
    text-decoration: none;
    color: #748692;
}
.footer-item-three ul li {
    line-height: 30px;
}
.footer-item-four {
    min-height: 378px;
    display: flex;
    padding-left: 0px;
    padding: 0px
}
.footer-item-four .footer-item-four-content {
    margin: auto 0px;
    min-width: 209px;
}
.footer-item-four img {
    min-height: 74px;
    min-width: 100%;
    max-height: 74px;
}
@media screen and (max-width: 320px) {
    .footer-item-four img {
        min-height: 80px;
        min-width: 100%;
        max-height: 80px;
        max-width: 100%
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .footer-item-four img {
        min-height: auto;
        min-width: 100%;
        max-height: auto;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .footer-item-four img {
        min-height: auto;
        min-width: 100%;
        max-height: auto;
    }
}
@media (min-width: 480px) and (max-width: 992px) {
    .footer-item-four img {
        min-height: auto;
        min-width: 100%;
        max-height: auto;
    }
}
.footer-item-four .col-md-4 {
    padding-left: 0px;
    margin-bottom: 14px;
}
.footer-item-four a {
    position: relative;
    padding: 0px;
    display: flex;
    text-decoration: none;
    width: 100%;
}
.footer-item-four .col-md-4:hover .hover-div {
    opacity: 1
}
.footer-item-four .btn-link {
    text-decoration: none;
}
.footer-item-four .hover-div {
    background: rgba(248, 183, 8, .6);
    position: absolute;
    */width: 100%;
    left: 0;
    min-height: 100%;
    opacity: 0;
    top: 0;
    right: 0;
    margin-left: 0px;
    margin-right: 14px;
}
.footer-item-four .hover-div i {
    margin: auto -16px;
    border: 1px solid #fff;
    text-decoration: none;
    padding: 7px;
    color: #fff;
    border-radius: 20px;
}
.footer-item-four h2 {
    font-size: 18px;
    font-family: 'Oswald', sans-serif;
    color: #8ea1ae;
    margin-bottom: 41px;
    margin-top: 0px;
}
@media screen and (max-width: 992px) {
    .footer-item-four h2 {
        margin-top: 26px;
    }
}
@media (min-width: 480px) and (max-width: 778px) {
    .footer-item-four h2 {
        text-align: center;
    }
}
@media screen and (max-width: 480px) {
    .footer-item-four h2 {
        text-align: left;
    }
    
    .footer-item-three {
        min-height: auto
    }
}
.footer-item-four .portfolio-rel-div img {
    min-height: 80px;
}
.intagram-item {
    margin: 0px;
    padding: 0px;
}
.intagram-item img {
    margin: 10px;
}
.instagram-item .portfolio-rel-div .hover-div {
    position: absolute;
    top: 0;
}
.footer-item-four-content .portfolio-item {
    margin-bottom: 0px;
    padding: 6px;
}

/* Footer Bottom css start*/
.footer-bottom-section {
    min-height: 100px;
    background: #111F29
}
.footer-bottom-section p span {
    color: #FAB702
}
.footer-bottom-section p {
    color: #51606A;
    line-height: 100px;
}
@media screen and (max-width: 320px) {
    .footer-bottom-section p {
        line-height: 20px;
        font-size: 11px;
        transform: translateY(85%);
    }
}

/*Footer classic*/
.footer-item-one form input {
    width: 100%;
    background: #131E24;
    border: 0px solid #5E6D77;
}
.footer-item-one form textarea {
    width: 100%;
    color: #fff;
    background: #131E24;
    border: 1px solid #5E6D77;
}
.footer-item-one form a {
    color: #5E6D77;
    margin-top: 10px;
    font-family: 'Roboto', sans-serif;
    float: left;
    text-decoration: none;
    cursor: pointer;
}
.footer-item-one form a:hover {
    color: #FAB702
}

/*footer classic*/
.footer-item-one .about-item {
    min-width: 100%;
    padding: 0px;
    float: left;
    display: flex;
    max-height: 100px;
    margin-top: 20%;
    border-bottom: 1px solid #5E6D77
}
.footer-item-one .about-item h3 {
    color: #5E6D77;
    padding: 0px;
    margin: 0px;
    font-size: 18px;
    padding-left: 13px;
    margin-right: 13px;
    height: 86px;
    border-right: 1px solid #5E6D77;
    font-family: 'Oswald', sans-serif;
    text-align: center;
}
.footer-item-one-content {
    padding: 0px
}
@media screen and (max-width: 320px) {
    .footer-item-one-content {
        margin: auto;
        min-width: initial;
    }
}
.form-control {
    box-shadow: unset;
    transition: unset;
}

/* Footer css end*/

/*preview page css*/
.index-page-banner {
    background: url('../images/preview-banner.jpg');
    min-height: 600px;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    display: flex;
    position: relative;
    background-position: center;
}
.demo-header {
    margin-top: 8%;
}
.index-page-banner:after {
    content: '';
    width: 100%;
    height: 206px;
    position: absolute;
    bottom: 0;
    background: rgb(250, 183, 27);
    bottom: -100px;
    left: 0px;
    transform: rotate(0deg);
    z-index: -1;
    display: block;
    border-bottom: 10px solid #FF9900
}
.index-page-banner .banner-text {
    position: absolute;
    top: 30%;
    color: #d1cdcd;
    text-align: center;
    transform: translateY(-50%);
    left: 0;
    right: 0;
}
.index-page-banner .banner-text h1 {
    font-size: 57px;
}
.index-page-banner .banner-text h3 {
    font-size: 30px;
}
@media screen and (max-width: 500px) {
    .index-page-banner .banner-text h1 {
        font-size: 26px;
    }
    
    .index-page-banner .banner-text h3 {
        font-size: 18px;
    }
}
.site-item {
    position: absolute;
    bottom: 0;
    padding-top: 30px;
    padding-bottom: 30px;
    width: 100%;
    left: 0;
    background: rgba(0, 0, 0, .4);
}
.site-item .counters {
    text-align: center;
}
.site-item .project-number {
    width: 100%;
    float: left;
    color: rgb(234, 105, 66);
    font-size: 36px;
}
.site-item .project-name {
    font-size: 23px;
    color: rgb(234, 105, 66)
}
@media screen and (max-width: 600px) {
    .site-item .project-number {
        font-size: 24px;
    }
    
    .site-item .project-name {
        font-size: 18px;
    }
}
.demo-section .portfolio-item {
    border-bottom: 1px solid rgba(250, 183, 2, .7);
}
.demo-section .portfolio-item img {
    border: 5px solid #09182B
}
.demo-section .portfolio-caption h2 {
    font-family: 'Roboto', sans-serif;
    text-align: center;
    margin-bottom: 50px;
    font-size: 46px;
}
.nav-docs li a {
    color: #111F29;
    font-size: 18px;
}
.nav-docs li a:hover {
    color: #FAB702;
    font-size: 18px;
    background: transparent;
}
.document-sec {
    margin-top: 100px;
    margin-bottom: 100px;
}

/*Responsive design*/
@media screen and (max-width: 320px) {
    .portfolio-four-column-section .portfolio-caption h4,
    .service-section .service-caption h4,
    .testimonial-single-slide .testimonial-caption h4,
    .plan-section .plan-caption h4,
    .welcome-section-temp-three .welcome-caption h4,
    .testimonial-section-template-three .testimonial-caption h4,
    .portfolio-two-column .portfolio-caption h4,
    .portfolio-one-column .portfolio-caption h4,
    .portfolio-single-section .portfolio-caption h4,
    .shop-section-middle .shop-caption h4,
    .shop-section-upper-part .shop-caption h4,
    .team-section .team-caption h4 {
        font-size: 13px;
        text-align: center;
    }
    
    .portfolio-four-column-section .portfolio-caption h2,
    .service-section .service-caption h2,
    .testimonial-single-slide .testimonial-caption h2,
    .plan-section .plan-caption h2,
    .welcome-section-temp-three .welcome-caption h2,
    .testimonial-section-template-three .testimonial-caption h2,
    .portfolio-two-column .portfolio-caption h2,
    .portfolio-one-column .portfolio-caption h2,
    .portfolio-single-section .portfolio-caption h2,
    .shop-section-middle .shop-caption h2,
    .shop-section-upper-part .shop-caption h2,
    .team-section .team-caption h2 {
        font-size: 18px;
    }
    
    .btn-plan i {
        display: none;
    }
    
    .btn-plan {
        min-width: 190px;
    }
    
    .welcome-feature {
        margin-top: 100px;
    }
    
    .portfolio-two-column .btn-port i,
    .portfolio-masonry-section button i,
    .portfolio-masonry-section-gap button i {
        display: none;
    }
    
    .portfolio-two-column .btn-port,
    .portfolio-masonry-section button,
    .portfolio-masonry-section-gap button,
    .portfolio-one-column .portfolio-items .btn-portfolio,
    .portfolio-one-column .btn-port {
        width: 166px;
    }
    
    .portfolio-hover .hover-content i,
    .portfolio-one-column .btn-port i {
        border: 1px solid;
        width: 36px;
        height: 36px;
        line-height: 36px;
        border-radius: 30px;
    }
    
    .portfolio-hover {
        padding: 0px;
    }
    
    .portfolio-hover .hover-content h2 {
        font-size: 14px;
    }
    
    .portfolio-one-column .portfolio-item {
        padding: 0px
    }
    
    .portfolio-three-column-section {
        padding: 0px
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    .portfolio-one-column .portfolio-item {
        padding: 0px;
    }
}
@media (min-width: 480px) and (max-width: 768px) {
    .portfolio-one-column .portfolio-item {
        padding: 0px;
    }
}
.box {
    border: 1px solid #1d165c;
    padding: 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.35), 0 85px 180px 0 #fff, 0 12px 8px -5px rgba(0, 0, 0, 0.85);
    padding: 10px 20px;
    overflow: hidden;
}