/*!
    Theme Name: WP DOGWOOD Theme
    Author: Boldwerks
    Description: A custom WordPress theme designed and developed specifically for Hangerlok
    Version: 1.0
*/
*,*:before,*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block;
}

body {
    line-height: 1
}

blockquote,q {
    quotes: none
}

blockquote:before,blockquote:after,q:before,q:after {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

strong,b {
    font-weight: 700
}

em,i {
    font-style: italic
}

input {
    outline: none;
    border: none;
    border-radius: 0
}

html {
    overflow-x: hidden
}

body {
    background: #fff;
    font-family: "Lato",helvetica,arial,sans-serif;
    font-size: 1.25rem;
    line-height: 2rem;
    color: #222;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden
}

.home-images {
  max-height: 250px!important;
  height: 300px!important;
  display: block!important;
}

#home-images {
  max-height: 250px!important;
  height: 300px!important;
  display: block!important;
}

.container {
    width: 95%;
    max-width: 1440px;
    margin: 0 auto;
    position: relative
}

.right {
    float: right
}

.left {
    float: left
}

.clear {
    clear: both
}

.clearfix:after {
    content: "";
    display: block;
    clear: both
}

.half {
    width: 48%
}

@media (max-width: 1000px) {
    .half {
        width:100%;
        float: none
    }
}

.none {
    display: none
}

a {
    color: red;
    text-decoration: none;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out
}

a:hover {
    color: #222;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out
}

a img {
    outline: none;
    border: none
}

iframe {
    max-width: 100%
}

h1,.h1 {
    font-family: "Open Sans",verdana,tahoma,sans-serif;
    font-size: 2.5rem;
    line-height: 1.1em;
    color: #222;
    font-weight: 400
}

@media (max-width: 1000px) {
    h1,.h1 {
        font-size:2rem
    }
}

@media (max-width: 700px) {
    h1,.h1 {
        font-size:1.5rem
    }
}

h2,.h2 {
    font-size: 24px;
    line-height: 34px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #4f4a34;
    text-align: center;
    padding-bottom: 30px;
    margin: 0 auto;
    font-weight: bold;
}

@media (max-width: 1000px) {
    h2,.h2 {
        font-size:1.6rem
    }
}

@media (max-width: 700px) {
    h2,.h2 {
        font-size:1.4rem
    }
}

h3,.h3 {
    font-family: "Oswald",verdana,tahoma,sans-serif;
    font-size: 1.25rem;
    color: #222;
    font-weight: bold;
}

h4,.h4 {
    font-family: "Oswald",verdana,tahoma,sans-serif;
    font-size: 1.5rem;
    line-height: 1.1em;
    color: #222;
    font-weight: 400
}

.alignleft {
    float: left;
    margin: 5px 50px 25px 0
}

.alignright {
    float: right;
    margin: 5px 0 25px 50px
}

.mobile-nav-container {
    background: #000;
    width: 95%;
    height: 100%;
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 1100;
    overflow: scroll;
    padding: 20px;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out
}

.mobile-nav-container.active {
    right: 0
}

.mobile-nav-container .close {
    display: block;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 20px
}

.mobile-nav-container .mobile-nav ul {
    list-style: none
}

.mobile-nav-container .mobile-nav ul li {
    border-bottom: 1px solid rgba(255,255,255,0.25);
    padding: 5px 0;
    position: relative
}

.mobile-nav-container .mobile-nav ul li a {
    color: #fff
}

.mobile-nav-container .mobile-nav ul li ul {
    display: none;
    padding: 0 0 0 10px
}

.mobile-nav-container .mobile-nav ul li ul.active {
    display: block
}

.mobile-nav-container .mobile-nav ul li ul li:last-child {
    border: none
}

.mobile-nav-container .mobile-nav ul li .carrot {
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    display: block;
    position: absolute;
    top: 5px;
    right: 5px
}

.content {
    padding: 80px 0 40px
}

.content h1,.content h2,.content h3,.content h4,.content h5,.content h6 {
    margin: 0 0 20px
}

.content p,.content form,.content iframe,.content blockquote,.content hr {
    margin: 0 0 40px
}

.content ul,.content ol {
    margin: 0 0 40px 30px
}

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

@media (max-width: 700px) {
    .content img {
        display:block;
        float: none;
        margin: 0 auto 20px
    }
}

.image-callout {
    position: relative
}

.image-callout.image-left .image {
    left: 0;
    right: inherit
}

.image-callout.image-left .sub-content {
    float: right
}

.image-callout .image {
    background-size: cover;
    background-position: center center;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

@media (max-width: 1000px) {
    .image-callout .image {
        position:relative;
        width: 100%;
        height: 250px
    }
}

.image-callout .sub-content {
    width: 48%;
    max-width: 650px;
    padding: 80px 0
}

@media (max-width: 1000px) {
    .image-callout .sub-content {
        float:none;
        width: 100%;
        max-width: 100%
    }
}

.form-callout {
    position: relative;
    padding: 80px 0 160px
}

.form-callout .container {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (max-width: 1000px) {
    .form-callout .container {
        -webkit-box-pack:center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.form-callout .container .sub-content {
    width: calc(100% - 565px)
}

@media (max-width: 1000px) {
    .form-callout .container .sub-content {
        width:100%
    }
}

.form-callout .container .sub-content .image {
    background-size: cover;
    background-position: center center;
    height: 250px;
    border-radius: 10px;
    margin: 0 0 50px
}

.form-callout .container .form-container {
    width: 500px;
    max-width: 100%
}

.gform_wrapper ul,.content form ul,form:not(.searchform) ul {
    display: -webkit-box !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.gform_wrapper ul li,.content form ul li,form:not(.searchform) ul li {
    width: 100%
}

.gform_wrapper ul li.third,.content form ul li.third,form:not(.searchform) ul li.third {
    width: 33%
}

@media (max-width: 1000px) {
    .gform_wrapper ul li.third,.content form ul li.third,form:not(.searchform) ul li.third {
        width:50%
    }
}

@media (max-width: 700px) {
    .gform_wrapper ul li.third,.content form ul li.third,form:not(.searchform) ul li.third {
        width:100%
    }
}

.gform_wrapper ul li.two-thirds input,.content form ul li.two-thirds input,form:not(.searchform) ul li.two-thirds input {
    width: 66% !important
}

@media (max-width: 1000px) {
    .gform_wrapper ul li.two-thirds input,.content form ul li.two-thirds input,form:not(.searchform) ul li.two-thirds input {
        width:50% !important
    }
}

@media (max-width: 700px) {
    .gform_wrapper ul li.two-thirds input,.content form ul li.two-thirds input,form:not(.searchform) ul li.two-thirds input {
        width:100% !important
    }
}

.gform_wrapper ul li.gsection,.content form ul li.gsection,form:not(.searchform) ul li.gsection {
    border: none;
    margin: 0;
    padding: 0
}

.gform_wrapper ul li.gsection h2,.content form ul li.gsection h2,form:not(.searchform) ul li.gsection h2 {
    font-size: 1rem
}

.gform_wrapper ul li .ginput_container_radio input[type="text"],.content form ul li .ginput_container_radio input[type="text"],form:not(.searchform) ul li .ginput_container_radio input[type="text"] {
    width: 90% !important;
    height: 35px;
    font-size: 1rem !important
}

.gform_wrapper label,.content form label,form:not(.searchform) label {
    font-size: .9375rem !important;
    font-weight: 400 !important
}

.gform_wrapper .ginput_complex label,.content form .ginput_complex label,form:not(.searchform) .ginput_complex label {
    font-size: .75rem !important
}

.gform_wrapper input[type="text"],.gform_wrapper input[type="email"],.gform_wrapper input[type="tel"],.gform_wrapper input[type="number"],.gform_wrapper input[type="password"],.gform_wrapper input[type="url"],.gform_wrapper textarea,.gform_wrapper select,.content form input[type="text"],.content form input[type="email"],.content form input[type="tel"],.content form input[type="number"],.content form input[type="password"],.content form input[type="url"],.content form textarea,.content form select,form:not(.searchform) input[type="text"],form:not(.searchform) input[type="email"],form:not(.searchform) input[type="tel"],form:not(.searchform) input[type="number"],form:not(.searchform) input[type="password"],form:not(.searchform) input[type="url"],form:not(.searchform) textarea,form:not(.searchform) select {
    background: #fff;
    width: 100% !important;
    height: 55px;
    outline: none;
    border: 1px solid #000;
    padding: 0 20px !important;
    font-family: "Lato",helvetica,arial,sans-serif;
    font-size: 1.25rem
}

.gform_wrapper textarea,.content form textarea,form:not(.searchform) textarea {
    padding: 20px !important;
    height: 200px
}

.gform_wrapper input[type="submit"],.content form input[type="submit"],form:not(.searchform) input[type="submit"] {
    cursor: pointer;
    padding: 0;
    min-width: 200px;
    height: 55px;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out
}

.gform_wrapper input[type="submit"]:hover,.content form input[type="submit"]:hover,form:not(.searchform) input[type="submit"]:hover {
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out
}

.content .feat-image {
    background-size: cover;
    background-position: center center;
    width: 555px;
    height: 440px;
    border-radius: 10px;
    margin: 0 50px 25px 0
}

@media (max-width: 1300px) {
    .content .feat-image {
        width:450px
    }
}

@media (max-width: 1000px) {
    .content .feat-image {
        float:none;
        margin: 0 0 25px
    }
}

@media (max-width: 700px) {
    .content .feat-image {
        width:100%;
        height: 300px
    }
}

.content .blog-cta {
    background: #000;
    color: #fff;
    border-radius: 10px;
    overflow: hidden;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.content .blog-cta .image {
    background-size: cover;
    background-position: center center;
    width: 415px
}

@media (max-width: 1000px) {
    .content .blog-cta .image {
        width:100%;
        height: 250px
    }
}

.content .blog-cta .sub-content {
    width: calc(100% - 505px);
    padding: 35px 35px 35px 0
}

@media (max-width: 1000px) {
    .content .blog-cta .sub-content {
        width:100%;
        padding: 30px
    }
}

.content .blog-cta .sub-content h2 {
    position: relative;
    color: #fff;
    font-size: 2.5rem
}

.content .blog-cta .sub-content h2:before {
    content: "";
    background: #000;
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -40px
}

@media (max-width: 1300px) {
    .content .blog-cta .sub-content h2:before {
        display:none
    }
}

.content .post {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0 50px;
    margin: 0 0 50px;
    border-bottom: 2px solid #000
}

.content .post .feat-image-post {
    background-size: cover;
    background-position: center center;
    display: block;
    width: 515px;
    max-width: 100%;
    height: 420px;
    border-radius: 10px
}

@media (max-width: 700px) {
    .content .post .feat-image-post {
        height:300px
    }
}

.content .post .feat-image-post:hover {
    opacity: .8
}

.content .post .sub-content {
    width: calc(100% - 555px)
}

@media (max-width: 1000px) {
    .content .post .sub-content {
        width:100%;
        margin: 20px 0 0
    }
}

.content .navigation span {
    display: inline-block;
    margin: 0 10px 0 0
}

.content .navigation a {
    margin: 0 10px 0 0;
    display: inline-block
}

/*Font Family*/
/* Gotham */
@font-face {
    font-family: 'Gotham Pro';
    src: url('fonts/GothamPro-Black.woff2') format('woff2'),
        url('fonts/GothamPro-Black.woff') format('woff'),
        url('fonts/GothamPro-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Pro';
    src: url('fonts/GothamPro-Italic.woff2') format('woff2'),
        url('fonts/GothamPro-Italic.woff') format('woff'),
        url('fonts/GothamPro-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'My Font';
    src: url('fonts/MyFontBold.woff2') format('woff2'),
        url('fonts/MyFontBold.woff') format('woff'),
        url('fonts/MyFontBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Pro';
    src: url('fonts/GothamPro-Light.woff2') format('woff2'),
        url('fonts/GothamPro-Light.woff') format('woff'),
        url('fonts/GothamPro-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Pro';
    src: url('fonts/GothamPro-Medium.woff2') format('woff2'),
        url('fonts/GothamPro-Medium.woff') format('woff'),
        url('fonts/GothamPro-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham Pro';
    src: url('fonts/GothamPro-Medium.woff2') format('woff2'),
        url('fonts/GothamPro-Medium.woff') format('woff'),
        url('fonts/GothamPro-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* Myriad Pro */

@font-face {
    font-family: 'Myriad Pro';
    src: url('fonts/MyriadPro-Regular.woff2') format('woff2'),
        url('fonts/MyriadPro-Regular.woff') format('woff'),
        url('fonts/MyriadPro-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}





/* BODY */
html {
    scroll-behavior: smooth;
}

html, body {
    font-family: 'Gotham Pro';

}

.container {
    width: 85%;
    margin: 0 auto;
}

img{
    max-width: 100%;
}

.logo img {
    max-width: 300px;
}

/* HEADER */

.mobile-menu {
    display: none;
}

.site-header {
    position: relative;
    padding: 20px 0px;
}

.main-logo {
  /*display: flex;
    justify-content: center;*/
}

.company-number {
    display: flex;
    margin-top: 15px;
    justify-content: center;
    vertical-align: middle;
    align-items: center;
}

.phone-icon {
    display: flex;
    align-items: center;
}

.phone-numb {
    margin-left: 7px;
}

.header-options {
    position: absolute;
    right: 5%;
    top: 7px;
}

.get-quote {
    text-align: center;
}

.get-quote a.button, .get-quote a {
    background: #ee2b37;
    color: white;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    line-height: 34px;
    border: 2px solid #ee2b37;
}

.get-quote a.button:hover, .get-quote a:hover {
    background: white;
    color: #ee2b37;
    transition: ease 0.5s;
}

.phone-numb > a {
    color: #4f4a34;
    font-size: 21px;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.phone-numb > a:hover {
    color: #ee2b37;
    transition: ease 0.5s;
}


/* FOOTER */

.footer-grid {
    display: flex;
    justify-content: center;
}

.footer {
    border-top: 5px solid #ee2b37;
    background: #f8f9fa;
}

.phone-numb-footer > a {
    color: #4f4a34;
    font-size: 21px;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.footer-contact-number {
    display: flex;
    vertical-align: middle;
    align-items: center;
    padding-top: 80px;
    padding-bottom: 10px;
}

.phone-numb-footer {
    margin-left: 7px;
}

.phone-icon-footer {
    display: flex;
    align-items: center;
}

.phone-numb-footer > a:hover {
    color: #ee2b37;
    transition: ease 0.5s;
}

.company-address {
    color: #4f4a34;
    font-size: 15px;
    font-weight: bold;
    line-height: 30px;
    text-align: right;
    letter-spacing: 0.05em;
    padding-bottom: 25px;
}

.copyrights {
    color: #07090a;
    font-size: 9px;
    font-weight: bold;
    line-height: 22px;
    letter-spacing: 0.075em;
}

.footer-logo {
    margin: 0px 40px;
}

.footer-logo img {
    max-width: 250px;
}

.company-logos {
    display: flex;
    align-items: center;
    padding-top: 40px;
}

.company-logos > img {
    margin: 0px 7px;
}

.socialmedia-text {
    color: #4f4a34;
    font-size: 12px;
    line-height: 34px;
    font-weight: bold;
    padding-bottom: 10px;
    text-align: center;
    padding-top: 15px;
}

.social-media-links {
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-media-links > a {
    color: white;
    background: #a51e36;
    height: 35px;
    width: 35px;
    margin: 0px 7px;
    text-align: center;
    border: 2px solid #a51e36;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-media-links > a:hover {
    color: #a51e36;
    background: white;
    transition: ease 0.5s;
}

.footer-logo > img {
    vertical-align: middle;
}


/* Hero */

.home-slide-title {
    font-size: 81px;
    line-height: 100px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    padding: 163px 0px;
    letter-spacing: 0.05em;
    
    text-shadow: 0px 0px 11px rgba(0, 0, 0, 1);
}

.home-slide {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* DESCRIPTION BLOCK */

.description-block-title, .project-block-title {
    font-size: 29px;
    line-height: 34px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #4f4a34;
    text-align: center;
    padding-bottom: 30px;
    max-width: 560px;
    margin: 0 auto;
    font-weight: bold;
}

.descriptiob-block-grid {
    padding-top: 55px;
}

.description-block-wrap {
    padding-bottom: 75px;
    border-bottom: 8px solid #ee2b37;
}

.description-block-content > p {
    font-size: 17px;
    line-height: 25px;
    text-align: center;
    color: #4f4a34;
    font-family: 'Myriad Pro' !important;
}

.description-block-content {
    max-width: 775px;
    margin: 0 auto;
}

.quote-section {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 40px;
}

.quote-contact-number {
    display: flex;
    align-items: center;
}

.quote-phone-icon {
    display: flex;
    align-items: center;
    padding-right: 10px;
}

.quote-button > a {
    background: #ee2b37;
    color: white;
    padding: 12px 35px;
    font-size: 19px;
    line-height: 34px;
    letter-spacing: 0.05em;
    font-weight: bold;
    border: 2px solid #ee2b37;
}

.quote-button > a:hover {
    color: #ee2b37;
    background: white;
    transition: ease 0.5s;
}

.quote-button {
    padding-right: 35px;
}

.quote-phone-numb > a {
    color: #4f4a34;
    font-size: 22px;
    line-height: 34px;
    letter-spacing: 0.05em;
    font-weight: bold;
}

.quote-phone-numb > a:hover {
    color: #ee2b37;
    transition: ease 0.5s;
}

.quote-phone-numb {
    display: flex;
    align-items: center;
}

/* Instagram Feed */

#insta-feed-heading{
    color: #4f4a34;
    font-size: 29px;
    padding-top: 40px;
    line-height: 34px;
    letter-spacing: 0.05em;
    font-weight: bold !important;
    font-family: 'Gotham Pro' !important;
    padding-bottom: 20px;
}

#sb_instagram #sbi_load .sbi_load_btn {
    background: #ee2b37;
    border-radius: unset;
    border: 2px solid #ee2b37 !important;
}

#sb_instagram #sbi_load .sbi_load_btn:hover {
    background: white;
    color: #ee2b37;
}

#sb_instagram .sbi_follow_btn a {
    background: #303f49;
    border: 2px solid #303f49;
}

#insta-feed-section #sb_instagram .sbi_follow_btn a:hover {
    background: white !important;
    color: #303f49 !important;
    box-shadow: unset !important;
}

.insta-feed-row {
    background: #f8f9fa;
}


/* TESTIMONIALS */

.testimonials-wrap {
    padding-top: 65px;
    padding-bottom: 55px;
    background: #ee2b37;
}

.quotes > p {
    font-size: 21px;
    line-height: 34px;
    color: white;
    font-weight: bold;
    text-align: center;
}

.quotes {
    max-width: 930px;
    margin: 0 auto;
}

.quotes-title > h4 {
    color: #ed9ba9;
    text-align: center;
    font-size: 21px;
    line-height: 34px;
    padding-top: 20px;
    font-family: 'Gotham Pro' !important;
    font-weight: 300 !important;
}

/* FORM */

div#gform_wrapper_1 {
    border: 3px solid #cfcfcf;
    padding: 0 35px;
    padding-top: 10px;
    padding-bottom: 30px;
    background: #f8f9fa;
    max-width: 800px;
    margin: 0 auto;
}

#quotation input {
    height: 35px !important;
    background: #f8f9fa !important;
    border: 2px solid #929091 !important;

}

#quotation select {
    height: 35px !important;
    background: #f8f9fa !important;
    border: 2px solid #929091 !important;
}

#quotation textarea {
    background: #f8f9fa !important;
    border: 2px solid #929091 !important;
}

div#quotation {
    padding-bottom: 115px;
    padding-top: 50px;
}


#quotation input#gform_submit_button_1 {
    background: #ee2b37 !important;
    color: white !important;
    border: 2px solid #ee2b37 !important;
    text-transform: uppercase !important;
    font-size: 19px !important;
    line-height: 34px !important;
    font-weight: bold !important;
    letter-spacing: 0.05em !important;
    height: 45px !important;
}

#quotation input:hover{
    background: white !important;
}

#quotation input:focus{
    background: white !important;
}

#quotation input#gform_submit_button_1:hover {
    background: white !important;
    color: #ee2b37 !important;
    transition: ease 0.5s !important;
}

#quotation select:hover{
    background: white !important;
}

#quotation select:focus{
    background: white !important;
}

#quotation textarea:hover{
    background: white !important;
}

#quotation textarea:focus{
    background: white !important;
}


h1#form-heading {
    color: #4f4a34;
    font-size: 29px;
    line-height: 34px;
    letter-spacing: 0.05em;
    padding-bottom: 25px;
    font-family: 'Gotham Pro' !important;
    font-weight: bold !important;
}

div#form-text p {
    font-size: 17px;
    line-height: 25px;
    color: #4f4a34;
    font-family: 'Gotham Pro' !important;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 20px;
}



/* RESPONSIVE */

@media all and (max-width: 1200px){

    .home-slide-title {
        font-size: 65px;
    }
}



@media all and (max-width: 1000px){

    .home-slide-title {
        font-size: 50px;
        line-height: 1;
        padding: 130px 0px;
    }

    .main-logo > a > img {
        width: 80%;
        display: block;
        margin: 0 auto;
    }

    div#sb_instagram {
        height: auto !important;
    }

    .quotes > p {
        font-size: 20px;
        line-height: 30px;
    }

    .phone-numb > a {
        font-size: 20px;
    }

    .get-quote a.button {
        font-size: 19px;
    }

    .phone-numb-footer > a {
        font-size: 20px;
    }


    .main-logo {
        justify-content: left;
    }

    .footer-logo {
        display: none;
    }

    .footer-grid {
        justify-content: space-around;
        position: relative;
        padding-bottom: 40px;
    }

    .copyrights {
        position: absolute;
        bottom: 15px;
        left: 50%;
        transform: translateX(-50%);
    }

    div#quotation {
        padding-bottom: 70px;
    }

    .description-block-wrap {
        padding-bottom: 60px;
    }

    .description-block-title {
        font-size: 26px;
    }

    h1#insta-feed-heading {
        font-size: 26px;
    }

    h1#form-heading {
        font-size: 26px;
    }

    .quote-button > a {
        font-size: 18px;
    }

    .quote-phone-numb > a {
        font-size: 20px;
    }

    #quotation input#gform_submit_button_1 {
        font-size: 18px !important;
        height: 40px !important;
    }

    .quotes-title > h4 {
        font-size: 20px;
    }

    .testimonials-wrap {
        padding-top: 55px;
        padding-bottom: 45px;
    }

    .descriptiob-block-grid {
        padding-top: 45px;
    }

    .description-block-wrap {
        padding-bottom: 50px;
    }
}


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

    .container{
        width: 90%;
        margin: 0 auto;
    }

    .header-options {
        display: none;
    }

    .main-logo > a > img {
        width: 50%;
    }

    .main-logo {
        justify-content: center;
    }

    .home-slide-title {
        font-size: 30px;
        padding: 50px 0px;
    }

    .description-block-title {
        font-size: 18px;
        line-height: 1;
        padding-bottom: 15px;
    }

    .descriptiob-block-grid {
        padding-top: 25px;
    }

    .description-block-content > p {
        font-size: 16px;
        line-height: 17px;
    }

    .quote-section {
        display: block;
        padding-top: 20px;
    }

    .quote-button {
        padding: 0px;
        text-align: center;
        margin-bottom: 5px;
    }

    .quote-button > a {
        font-size: 14px;
        padding: 6px 30px;
    }

    .quote-contact-number {
        justify-content: center;
    }

    .quote-phone-numb > a {
        font-size: 16px;
    }

    .quote-phone-icon > img {
        width: 80%;
    }

    .description-block-wrap {
        padding-bottom: 20px;
    }

    .quote-phone-icon {
        padding-right: 0px;
    }

    h1#insta-feed-heading {
        font-size: 18px;
        line-height: 1;
        padding-top: 30px;
        padding-bottom: 10px;
    }

    .testimonials-wrap {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .quotes > p {
        font-size: 16px;
        line-height: 1.5;
    }

    .quotes-title > h4 {
        font-size: 16px;
        line-height: 1.5;
        max-width: 260px;
        margin: 0 auto;
    }

    div#quotation {
        padding-top: 25px;
        padding-bottom: 35px;
    }

    h1#form-heading {
        font-size: 20px;
        line-height: 1;
        padding-bottom: 15px;
    }

    div#form-text p {
        font-size: 16px;
        line-height: 1.5;
        padding-bottom: 0px;
    }

    #quotation input#gform_submit_button_1 {
        font-size: 14px !important;
    }

    .footer-grid {
        display: block;
    }

    .footer-contact-number {
        padding-top: 40px;
        justify-content: center;
    }

    .phone-numb-footer > a {
        font-size: 16px;
    }

    .company-address {
        text-align: center;
        line-height: 1.5;
        font-size: 14px;
    }

    .company-logos {
        justify-content: center;
        padding-top: 15px;
    }

    .footer-grid {
        padding-bottom: 80px;
    }

    .copyrights {
        text-align: center;
        line-height: 1.5;
        bottom: 25px;
    }

    div#gform_wrapper_1 {
        padding: 0px 10px;
        padding-top: 10px;
        padding-bottom: 30px;
    }
}

/**
 * New customization code
 */

.custom-menu { position: absolute; bottom: 40px; right: 5%; }
.custom-menu ul, .custom-menu li {list-style: none;}
.custom-menu li:first-child {background: none; padding-left: 0; margin-left: 0;}
.custom-menu li {float: left; background: url('./images/menu_icon.png') no-repeat left center; background-size: 25px; margin-left: 5px; padding-left: 40px; padding-right: 10px;}
.custom-menu li a { text-transform: uppercase; color: #3b3f27; font-size: 18px; font-family: 'Gotham Pro'; font-weight: 500;}
.custom-menu li a:hover {color: #ee2b37;}


.header-sticky { position: fixed; background: rgba(255,255,255,0.9); width: 100%; height: 80px; top: 0px; left: 0px; right: 0px; border-bottom: 3px solid #ee2b37; z-index: 999999; display: none;}
.admin-bar .header-sticky {top: 32px;}
.header-sticky-logo, .header-sticky-menu { float: left; }
.header-sticky-contact {float: right;}
.header-sticky-logo img{max-width: 100%; width: 36px; margin-top: 10px;}
.header-sticky-menu ul, .header-sticky-menu li {list-style: none;}
.header-sticky-menu li {float: left; margin: 23px 0px 23px 25px;}
.header-sticky-menu li a { text-transform: uppercase; color: #3b3f27; font-size: 21px; font-family: 'Gotham Pro'; font-weight: 500;}
.header-sticky-contact {margin: 14px;}
.sticky-phone-icon , .header-sticky-contact .get-quote {display: inline-block;}
.sticky-phone-icon {position: relative; top: 8px;}
.header-sticky-contact .get-quote {margin: 0 0 0 10px;}

.completed-projects {padding-top: 25px;}
.white-popup {
  position: relative;
  background: #f8f9fa;
  padding: 20px;
  width: auto;
  max-width: 600px;
  margin: 20px auto;
}
#quoteForm li, #quoteForm ul {list-style: none;}
#quoteForm div#gform_wrapper_1 {border: 0 none;}
#quoteForm input[type="submit"] {
    margin-top: 15px;
    font-family: 'Gotham Pro';
    text-transform: uppercase;
    color: #fff;
    background: #ee2b37;
}
#quoteForm .validation_message {color: red; font-size: 10px;}
#quoteForm .mfp-title {color: #3b3f27; font-family: 'Gotham Pro'; text-transform: uppercase; }
#quoteForm .ginput_container > span {float: left; width: 49%;}
#quoteForm .ginput_container > span:nth-child(odd) {margin-right: 2%;}
.project-block-wrap {
    padding: 50px 0;
}
.completed-project-slider img {object-fit: cover;}
.completed-project-slider-footer {position: relative;}
.completed-project-slider-action {display: flex; justify-content: center; padding: 15px 0 0;}
.completed-project-slider-action div {cursor: pointer; float: left; color: #ee2b37; font-family: 'Gotham Pro'; font-weight: 500;}
.completed-project-slider-action div:hover {color: #3b3f27;}
.completed-project-slider-action #slick-next {background: url('./images/menu_icon.png') no-repeat left center; background-size: 30px; margin-left: 5px; padding-left: 35px;  }
.completed-project-slider-btn a {display: inline-block; background: #3b3f27; color: #fff; font-family: 'Gotham Pro'; font-size: 15px; line-height: 35px; padding:0 10px; }
.completed-project-slider-btn a:hover {background:#ee2b37;}
.completed-project-slider-btn {position: absolute; right: 0; top: 11px;}

.project-block-project-grid .project_list img {object-fit: cover; width: 100%;}
.project-block-project-grid .project_list {margin-bottom: 25px;}
.project-block-project-grid .project_list h3, .project-block-project-list .project_list h3 {overflow: hidden; text-overflow: ellipsis;}
.project-block-project-grid .project_list h3 a, .project-block-project-list .project_list h3 a {color: #3b3f27; font-family: 'Gotham Pro'; font-weight: 500; text-transform: capitalize;  white-space: nowrap;  font-size: 16px;}
.project-block-project-grid .project_list h3 a:hover, .project-block-project-list .project_list h3 a:hover {color: #3b3f27;}
.project-block-project-page {display: flex; justify-content: space-between;}
.project_list_img {position: relative;}
.project_list_img .project-share {position: absolute; right: 10px; top: 10px; width: 30px; height: 30px; border-radius: 15px; background: rgba(0, 0, 0, 0.6); color: #fff; cursor: pointer; text-align: center; font-size: 16px;}
.project_list_img .project-share i{ display: inline-block; padding: 6px 0 0 4px; }
.project-share-list {display: flex; justify-content: center;}
.project-share-list-item {width: 30px; height: 30px; font-size: 16px; color: #fff; background: #3b3f27; border-radius: 15px; text-align: center; cursor: pointer; margin-left: 10px; line-height: 30px;}
.project-share-list-item:first-child {margin-left: 0px;}
.project-share-list-item:hover {background: #ee2b37;}
.project-share-list-item a, .project-share-list-item a:hover {color: #fff;}
.project_list .tippy-box, .project-block-project-filter-one .tippy-box  {background: #e7e7e7;}
.project_list .tippy-arrow, .project-block-project-filter-one .tippy-arrow  {color: #e7e7e7;}

.project-block-project-list .project_list {position: relative; min-height: 140px; padding-left: 155px; margin-bottom: 20px;}
.project-block-project-list .project_list_img {position: absolute; left: 0; top: 0;}
.project-block-project-list .project_list_img img {width: 140px; height: 140px;}
.project-block-project-list p {color: #666; font-family: 'Gotham Pro'; font-weight: 500; font-size: 14px; line-height: 24px;}
.project-block-project-list p span, .project-block-project-list p a {background: #e7e7e7; color: #666; display: inline-block; padding: 0px 5px; cursor: pointer; border-radius: 3px;}
.project-block-project-list p span:hover, .project-block-project-list p a:hover {background: #c3c3c3; color: #666;}
.tagpara {margin-bottom: 5px;}

.project-block-project-filter {display: flex; justify-content: center; margin: 5px 0 35px;}
.project-block-project-filter-one div, .project-block-project-show-type {float: left;}
.project-block-project-filter-one, .project-block-project-filter-two {background: #e7e7e7;}
.project-block-project-filter-one {margin-right: 20px;}
.project-block-project-filter-one .project-block-project-filter-label, .project-block-project-filter-one .project-block-project-filter-menu {padding: 10px 15px; font-size: 15px; color: #666; font-family: 'Gotham Pro';}
.project-block-project-filter-one .project-block-project-filter-label {color: #999;}
.project-block-project-filter-one .project-block-project-filter-menu {cursor: pointer;}
.project-block-project-filter-one .project-block-project-filter-menu:hover, .project-block-project-filter-one .project-block-project-filter-menu.active {background: #c3c3c3;}
.project-block-project-show-type a {padding: 10px 15px; color: #666; display: block; }
.project-block-project-show-type a:hover {color: #666;}
.project-block-project-show-type:hover, .project-block-project-show-type.active {background: #c3c3c3;}

.project_drop_filter {padding: 15px;}
.project_drop_filter h4 {font-size: 15px; font-family: 'Gotham Pro'; font-weight: 600; color: #333; margin: 0 0 20px;}
.project_drop_filter ul li, .project_drop_filter ul {list-style: none;}
.project_drop_filter ul li {float: left; width: 50%; line-height: 25px;}
.project_drop_filter ul li a {display: block; font-size: 13px; color: #666; font-family: 'Gotham Pro';}
.project_drop_filter ul li a:hover, .project_drop_filter ul li.active a {color: #222;}

.project-block-project-filter-close a {color: #666; padding: 10px 15px; display: block;}
.project-block-project-filter-close a:hover {color: #666;}

.project_empty {background: #e7e7e7; text-align: center; padding: 10px; font-family: 'Gotham Pro'; color: #666; font-size: 16px; }

.project_detail {margin: 0 0 25px; }
.project_detail_slider {position: relative;}
.project_detail_slider_item {padding: 0 10px;}
.project_detail_slider_item img {width: 100%; object-fit: cover;}
.project_detail_slider .slick-slide {opacity: 0.3;}
.project_detail_slider .slick-slide.slick-center {opacity: 1;}
.project_detail_slider_action {display: none;}
.project_detail_slider:hover .project_detail_slider_action {display: block;}
#detail-slick-previous {position: absolute; font-size: 18px; left: 0; top: 47%; width: 30px; height: 50px; text-align: center; line-height: 50px; font-size: 26px; cursor: pointer;}
#detail-slick-next {position: absolute; font-size: 18px; right: 0; top: 47%; width: 30px; height: 50px; text-align: center; line-height: 50px; font-size: 26px; cursor: pointer;}

.project_detail_related > h3 {text-align: center;}
.project_touch {padding: 50px 0; text-align: center; color: #666;}
.project_detail_desc {margin-top: 30px;}
.project_detail_desc p {font-family: 'Gotham Pro'; color: #666; font-size: 14px; line-height: 24px;}

.project_extra {margin: 30px 0 0; position: relative; padding-right: 300px;}
.project_extra h3#insta-feed-heading {text-transform: uppercase; font-size: 24px;}
.project_extra p {font-family: 'Gotham Pro'; color: #666; font-size: 14px; line-height: 24px; margin-bottom: 10px;}
.project_extra p label {min-width: 105px; display: inline-block;}
.project_extra p a {background: #e7e7e7; display: inline-block; padding: 0px 5px; cursor: pointer; border-radius: 3px; color: #666;}
.project_extra p a:hover {background: #c3c3c3; color: #666;}

.project_extra_right {width: 300px; text-align: center; position: absolute; right: 0; top: 0; background: #f3f3f3;}
.project_extra_right_main h4 {ont-family: 'Gotham Pro'; color: #666; font-size: 40px; font-weight: 700; text-transform: uppercase; text-align: center; }
.project_extra_right_main p {ont-family: 'Gotham Pro'; color: #666; font-size: 16px; text-transform: capitalize; margin: 15px 0; text-align: center;} 
.project_extra_right_main ul, .project_extra_right_main li{ list-style: none; }
.project_extra_right_main ul {display: flex; justify-content: center;}
.project_extra_right_main li {margin-left: 10px;}
.project_extra_right_main li:first-child { margin-left: 0px; }
.project_extra_right_main li button {background: transparent; border: 1px solid #999; width: 12px; height: 12px; border-radius: 50%; text-indent: -99999px;}
.project_extra_right_main li.slick-active button {background: #999;}
@media (min-width: 1200px) {
    .project-block-project-grid .project_list {float: left; width: 23.5%; margin-right: 2%;}
    .project-block-project-grid .project_list:nth-child(4n) {margin-right: 0;}
}
@media (max-width: 1199px) {
    .main-logo {
        justify-content: left; 
    }
    .main-logo > a > img {
        width: 80%;
    }
    .header-options {top: 40px; right: 0;}
    .custom-menu {right: 0;}
    
}

@media(max-width:1199px) and (min-width:992px) {
    .project-block-project-grid .project_list {float: left; width: 32%; margin-right: 2%;}
    .project-block-project-grid .project_list:nth-child(3n) {margin-right: 0;}
}

@media (max-width:991px) {
    .custom-menu {bottom: 30px;}
    .header-sticky-contact {display: none;}
    .project-block-project-list .project_list {padding-left: 0;}
    .project-block-project-list .project_list_img {position: static;}
    .project-block-project-list .project_list_img img {width: 100%; height: auto;}
    .project_extra {padding-right: 0px;}
    .project_extra_right {width: 100%; margin-top: 30px; position: static;}
}

@media(max-width:991px) and (min-width:768px) {
     .project-block-project-grid .project_list {float: left; width: 49%; margin-right: 2%;}
     .project-block-project-grid .project_list:nth-child(2n) {margin-right: 0;}
}

@media (max-width: 767px) {
    .admin-bar .header-sticky {top: 0px;}
    .main-logo {
        justify-content: center;
    }
    .project-block-project-grid .project_list {width: 100%; margin-right: 0}
    .custom-menu {position: static; display: flex; margin: 20px 0 0; justify-content: center;}
    .project-block-project-filter-one .project-block-project-filter-label {display: none;}
    #detail-slick-previous, #detail-slick-next {top: 40%;}
} 

/*
.custom-menu {
  display: none!important;
}

.header-sticky {
  display: none!important;
}*/

.project-block-wrap {
  display: none!important;
}
h3 {
  font-size: 22px;
  font-weight: bold;
  font-family: 'Gotham Pro' !important;
  color: rgb(79, 74, 52);
}
p, li {
    font-size: 17px;
    line-height: 25px;
    color: #4f4a34;
    font-family: 'Myriad Pro' !important;
}
li {
  margin-left: 20px;
  line-height: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  font-weight: bold;
}

.hero-banner h2.vc_custom_heading {
  display: block;
  background: #4d4a36;
  color: #fff!important;
  max-width: 800px;
  min-height: 50px;
  padding: 10px;
  margin-top: 320px;
  margin-bottom: 0px;
}



.vc_row.vc_row-o-full-height {
  
}