/*============================================================
    CSS TABLE OF CONTENTS
==============================================================
    01. GENERAL CSS STYLE
    02. START BOOTSTRAP NAVIGATION OVERRIDES CSS STYLE
    03. START CONTACT FORM AREA CSS STYLE
    04. START FOOTER AREA CSS STYLE
    05. START BREADCRUMB CSS STYLE
    06. START SINGLE PROJECT PAGE CSS STYLE
    07. START GUTENBERG CSS STYLE
=============================================================*/
/*
* -------------------------------------------------------------
*    01. GENERAL CSS STYLE
* -------------------------------------------------------------
*/
body {
    width: 100%;
    height: 100%;
    color: #666;
    font-size: 14px;
    letter-spacing: 1px;
    background-color: #fff;
}
html,
body {
    height: 100%
}
img {
    max-width: 100%;
    height: auto
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    color: #333;
    letter-spacing: 1px;
    text-transform: uppercase;
}
a {
    text-decoration: none;
    -webkit-transition: all 0.36s;
    transition: all 0.36s;
}
a:hover,
a:focus {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none
}
p {
    line-height: 2
}
ul,
li {
    margin: 0;
    padding: 0;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
.section-padding {
    padding: 80px 0
}
.section-gray {
    background: #f6f6f6 none repeat scroll 0 0
}
.section-title {
    margin-bottom: 50px !important
}
.section-title h2 {
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
    font-size: 34px;
}
.section-title h2:after {
    border-bottom: 2px solid #555;
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    width: 10%;
}
.section-title p {
    background: #ffff95 none repeat scroll 0 0;
    color: #000;
    display: inline-block;
    margin: 0;
    padding: 0 10px;
}
.button {
    text-transform: uppercase;
    display: inline-block;
    padding: 10px 15px;
    position: relative;
    font-weight: 700;
    font-size: 12px;
    color: #333;
    letter-spacing: 1px;
    background: transparent;
    border: 2px solid #333;
    margin-right: 10px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0px);
    transform: translateZ(0px);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color;
    transition-property: color;
    vertical-align: middle;
    -webkit-transition: 0.36s;
    transition: 0.36s;
}
.button:before {
    background: #ffff95 none repeat scroll 0 0;
    position: absolute;
    content: "";
    z-index: -1;
    bottom: 0;
    right: 0;
    left: 0;
    top: 0;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.button:hover,
.button:focus {
    color: #000
}
.button:hover.button:before {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.preloader {
    -moz-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-pack: center;
    background: #333 none repeat scroll 0 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
}
.spinner {
    font-size: 10px;
    height: 70px;
    margin: 0 auto;
    text-align: center;
    width: 100px;
}
.spinner > div {
    animation: 1.2s ease-in-out 0s normal none infinite running sk-stretchdelay;
    background-color: #ffff95;
    display: inline-block;
    height: 100%;
    width: 10px;
}
.spinner .rect2 {
    animation-delay: -1.1s;
}
.spinner .rect3 {
    animation-delay: -1s;
}
.spinner .rect4 {
    animation-delay: -0.9s;
}
.spinner .rect5 {
    animation-delay: -0.8s;
}
@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
    }
    20% {
        transform: scaleY(1);
    }
}
@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
    }
    20% {
        transform: scaleY(1);
    }
}
.owl-carousel .item {
    display: block;
    width: 100%;
    height: auto;
}
/*
* -------------------------------------------------------------
*    01. / END GENAREL CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    02. START BOOTSTRAP NAVIGATION OVERRIDES CSS STYLE
* -------------------------------------------------------------
*/
.header-top-area {
    position: relative;
    width: 100%;
    z-index: 999;
    -webkit-transition: all 0.36s ease-out;
    transition: all 0.36s ease-out;
}
.sticky-wrapper {
    position: absolute;
    width: 100%;
    z-index: 999;
}
.navbar-default {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    border-radius: 0;
    margin-bottom: 0;
    -webkit-transition: all 0.36s ease-in-out 0s;
    transition: all 0.36s ease-in-out 0s;
    width: 100%;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    background-color: transparent
}
.navbar-brand {
    height: auto;
    padding: 0;
}
.navbar-brand h1 {
    color: #fff;
    font-size: 26px;
    line-height: 22px;
    padding: 30px 0;
    margin: 0;
    text-transform: capitalize;
    -webkit-transition: all 0.36s ease-in-out 0s;
    -o-transition: all 0.36s ease-in-out 0s;
    transition: all 0.36s ease-in-out 0s;
}
.navbar-brand>img {
    margin: 15px 0;
    -webkit-transition: all 0.36s ease-in-out 0s;
    -o-transition: all 0.36s ease-in-out 0s;
    transition: all 0.36s ease-in-out 0s;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: #fff
}
.navbar-default .navbar-collapse {
    max-height: 500px;
    overflow-x: hidden;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #fff
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #333
}
.mainmenu li a {
    color: #fff !important;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 13px;
    padding: 30px 15px;
    -webkit-transition: all 0.36s ease-in-out 0s;
    transition: all 0.36s ease-in-out 0s;
}
.mainmenu ul.nav.navbar-nav li a:hover {
    color: #ffff95 !important
}
.navbar-default .navbar-toggle {
    background: #fff none repeat scroll 0 0
}
.is-sticky .header-top-area {
    background: #fff;
    box-shadow: 0px 3px 4.7px 0.3px rgba(0, 0, 0, 0.24);
}
.is-sticky .mainmenu ul.nav.navbar-nav li a {
    padding: 20px 15px;
    color: #666 !important;
}
.is-sticky .mainmenu ul.nav.navbar-nav li a:hover,
.is-sticky .mainmenu ul.nav.navbar-nav li a:focus {
    color: #333 !important;
}
.is-sticky .navbar-brand h1 {
    color: #333;
    font-size: 24px;
    padding: 20px 0;
}
.is-sticky .navbar-brand>img { margin: 5px 0; }
.mainmenu ul li {
    position: relative
}
.mainmenu ul.sub-menu li a {
    color: #333 !important
}
.mainmenu ul li ul {
    background: #fff none repeat scroll 0 0;
    right: 0;
    position: absolute;
    top: 120%;
    width: 210px;
    z-index: 2;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    padding: 10px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    z-index: 9;
    text-transform: none;
    -webkit-transition: .4s;
    transition: .4s
}
.mainmenu ul li ul.sub-menu {
    padding: 10px;
}
.mainmenu ul li ul li {
    display: block;
}
.mainmenu ul li ul li a {
    display: block;
    text-align: left;
    padding: 5px 10px !important;
    line-height: 30px;
}
.mainmenu ul.nav.navbar-nav ul.sub-menu li a:hover {
    color: #333 !important
}
.mainmenu ul li ul li:hover > a,
.mainmenu ul li ul li.current_page_item > a,
.mainmenu ul li ul li.current-page-ancestor > a {
    background-color: #f3f2f2;
}
.mainmenu ul > li > ul > li > ul {
    right: 100%;
    top: 200%;
}
.mainmenu ul > li:nth-last-child(1) ul > li > ul,
.mainmenu ul > li:nth-last-child(2) ul > li > ul,
.mainmenu ul > li:nth-last-child(3) ul > li > ul,
.mainmenu ul > li:nth-last-child(4) ul > li > ul,
.mainmenu ul > li:nth-last-child(5) ul > li > ul,
.mainmenu ul > li > ul > li > ul > li > ul {
    right: 100%;
    left: auto;
    margin-right: 10px
}
.mainmenu ul > li:nth-last-child(1) > ul > li > ul > li > ul,
.mainmenu ul > li:nth-last-child(2) > ul > li > ul > li > ul,
.mainmenu ul > li:nth-last-child(3) > ul > li > ul > li > ul,
.mainmenu ul > li:nth-last-child(4) > ul > li > ul > li > ul,
.mainmenu ul > li:nth-last-child(5) > ul > li > ul > li > ul {
    right: 100%;
    left: auto;
    margin-right: 10px
}
.mainmenu ul > li:hover > ul {
    top: 100%;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
}
.mainmenu ul > li:hover > ul > li:hover > ul,
.mainmenu ul > li:hover > ul > li:hover > ul > li:hover > ul {
    top: -1px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
}
/*
* -------------------------------------------------------------
*    02. / END BOOTSTRAP NAVIGATION OVERRIDES CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    03. START CONTACT FORM AREA CSS STYLE
* -------------------------------------------------------------
*/
.form-control {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-color: -moz-use-text-color -moz-use-text-color #999;
    border-style: none none solid;
    border-width: 0 0 1px;
    border-radius: 0;
    box-shadow: none;
    font-size: 16px;
    margin: 10px 0;
    height: 45px;
    padding: 0;
    -webkit-transition: all 0.36s ease 0s;
    transition: all 0.36s ease 0s;
}
.form-control::-moz-placeholder {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.form-control:hover,
.form-control:focus {
    background: transparent;
    border-color: -moz-use-text-color -moz-use-text-color #ffff95;
    border-style: none none solid;
    border-width: 0 0 1px;
    border-radius: 0;
    box-shadow: none;
    outline: 0 none;
}
.contact-area .button:hover,
.contact-area .button:focus {
    background: #ffff95 none repeat scroll 0 0;
    color: #000;
}
/*
* -------------------------------------------------------------
*    03. / END CONTACT FORM AREA CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    04. START FOOTER AREA CSS STYLE
* -------------------------------------------------------------
*/
.copyright {
    background: #333;
    padding: 30px 0;
    color: #fff;
}
.copyright p {
    margin: 0
}
/*
* -------------------------------------------------------------
*    04. / END FOOTER AREA CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    05. START BREADCRUMB CSS STYLE
* -------------------------------------------------------------
*/
.profi-breadcrumb-area {
    background-position: center !important;
    background-size: cover !important;
    position: relative;
    background: #999;
    padding: 150px 0 120px;
    z-index: 1;
}
.profi-breadcrumb-area:after {
    background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: -1;
}
.profi-breadcrumb-area,
.profi-breadcrumb-area a {
    color: #fff
}
.profi-breadcrumb-area h1 {
    margin-bottom: 15px;
    font-weight: 900;
    color: #fff;
}
.profi-breadcrumb-area span[typeof="ListItem"] {
    display: inline-block;
    padding: 0 10px;
    -webkit-transition: .36s;
    transition: .36s
}
.profi-breadcrumb-area span[typeof="ListItem"] a:hover {
    color: #ffff95
}
.profi-internal-area.section-enable-padding {
    padding: 80px 0
}
/*
* -------------------------------------------------------------
*    05. / END BREADCRUMB CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    06. SINGLE PROJECT PAGE CSS STYLE
* -------------------------------------------------------------
*/
.details-single-project {
    margin: 30px 0 20px
}
.about-single-project h4,
.details-single-project h4,
.related-projects h4 {
    margin-bottom: 15px;
    padding-bottom: 10px;
    position: relative;
    display: inline-block;
}
.about-single-project h4:after,
.details-single-project h4:after,
.related-projects h4:after {
    position: absolute;
    content: "";
    background: #ffff95;
    width: 60px;
    height: 4px;
    top: 28px;
    left: 0;
}
.details-single-project h4 {
    margin-bottom: 20px
}
.details-single-project li {
    color: #555;
    font-size: 14px;
    padding: 0 0 10px 0;
}
.details-single-project li a,
.details-single-project li i {
    margin-right: 10px;
    color: #333;
}
.related-projects {
    margin-top: 40px
}
.related-projects h4 {
    margin-bottom: 0
}
/*
* -------------------------------------------------------------
*    06. / END PROJECT PAGE CSS STYLE
* -------------------------------------------------------------
*/

/*
* -------------------------------------------------------------
*    07. START GUTENBERG CSS STYLE
* -------------------------------------------------------------
*/
.alignfull,
.alignwide {
    margin-left: calc( -100vw / 2 + 100% / 2);
    margin-right: calc( -100vw / 2 + 100% / 2);
    max-width: 100vw;
}
/*
* -------------------------------------------------------------
*    07. / END GUTENBERG CSS STYLE
* -------------------------------------------------------------
*/