/*
 Theme Name:   Northern Steel Buildings & Construction
 Description:  child theme
 Author:       Zaptify
 Template:     Divi
 Version:      1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  dsa
*/

/*
======================
====HighLevel Form====
======================
*/
.hl_form-builder--main {
    margin-top: 0px;
    padding: 20px 20px;
}


/*
===============
====GENERAL====
===============
*/
/*  Text Padding */
/*  Remove the H1 bottom padding */
#page-container h1 {
    padding-bottom: 0px!important;
}

/* Add a bottom padding to Blurb H1 */
#page-container .et_pb_blurb h1.et_pb_module_header {
    padding-bottom: .4em!important;
}

/*  Remove the H3 bottom padding */
.zap-text h3:last-child {
    padding-bottom: 0px;
}

.zap-text ul li,
.zap-text ol li{
    padding-bottom: .5em;
}

.zap-text p:last-child {
    padding-bottom: 0;
}

.zap-text p:last-of-type {
    padding-bottom: 0em;
}

.zap-text blockquote p:last-of-type {
    padding-bottom: 0;
}

/*  Blockquote */
.zap-text blockquote {
    background: #edeff7;
    padding: 25px 35px;
    line-height: 1.5em;
    position:relative;
}


.zap-text blockquote:before {
    content: '“';
    position: absolute;
    font-size: 6em;
    opacity:0.5;
    top:.25em;
    left:0;
}

.zap-text blockquote:after {
    content: '”';
    position: absolute;
    font-size: 6em;
    opacity:0.5;
    bottom: -.25em;
    right:0;
}

/* vertical align on column */
.zap-home-section2 .ver-align-center, 
.zp-framing-section2 .ver-align-center, 
.zp-construction-blurbs .ver-align-center,
.zp-commercial-section2 .ver-align-center,
.zp-insulation-system .ver-align-center {
    display:flex;
    flex-direction: column;
    justify-content: center;
}

/*
===============
====HEADER====
===============
*/
/* Header Width */
#page-container .container.clearfix.et_menu_container {
    max-width: 1250px;
    width: 98%;
}

@media (max-width: 980px) {
   #page-container .container.clearfix.et_menu_container {
       width: 85%!important;
   } 
} 

@media (min-width: 1110px){
    #top-menu-nav #top-menu li a{
        font-size: 16px!important;
        }
}

@media (min-width: 980px) and (max-width: 1109px) {
    #top-menu-nav #top-menu li {
        padding-right: 9px!important;
        }
    #top-menu-nav #top-menu li a{
        font-size: 14px!important;
        }
}

/*
==================
==SECONDARY MENU==
==================
*/
/* CTA */
#et-info, #et-secondary-menu ul>li.menu-cta a {
    background: #B9B742;
    color: #202A44;
    padding: 0.5em 1em;  
}

#et-info, #et-secondary-menu ul>li.menu-cta a:hover {
    background:#bababa;   
}

/* Secondary Menu Container Paddings */
#top-header .container {
    padding-bottom: 0.4em;
    padding-top: 0.5em;
}

/* Secondary Header Button Color */
#et-secondary-menu ul>li.menu-cta a {
    color: #fff!important;
    background: #B9B742!important;
}

#et-secondary-menu .menu-cta a:hover {
    background: #bababa!important;       
}

/*
==================
====== HOME ======
==================
*/
/* HOME HERO SECTION */
/* Add top padding to the paragraph */
.zap-home-hero .zap-text p {
    padding-top: .7em;
}

/* HOME SECTION 2 */
 /* keep two columns on tablet view */
@media (min-width: 590px) and (max-width: 980px) {
  .zap-home-section2 .et_pb_row {
      display: flex!important;
  }
  .zap-home-section2 .et_pb_row .et_pb_column {
    margin-right: 5%;
  }
  .zap-home-section2 .et_pb_column .et_pb_module {
      margin-bottom: 10px;
  }
}

.zap-home-section2 h2 {
    padding-bottom: 0px;
}

/* Adjust the font size on tab and mobile */
@media (min-width: 591px) and (max-width: 770px){
  .zap-home-section2 h2 {
      font-size: 22px;
  }
  .zap-home-section2 p {
      font-size: 15px;
      line-height: 1.2em;
  }
  }

/* Adjust the image size on tab and mobile */
@media (min-width: 591px) and (max-width: 1150px){
  .zap-home-section2 
   .et_pb_image {
      width: 100%;
  }
}

/* Adjust image width on large desktop screens */
@media (min-width: 1250px){
  .zap-home-section2 .et_pb_image {
      width: 70%!important;
  }
}

/* HOME "Request an estimate" section */
@media (min-width: 768px) and (max-width: 980px) {
  .zap-home-estimate .et_pb_row {
      display: flex!important;
  }
  .zap-home-estimate .et_pb_row .et_pb_column{
    margin-right: 5%;
  }
}

/* Change to 2 Columns on tablets */
@media (min-width: 678px) and (max-width: 980px){
    .zap-home-blurbs .et_pb_row {
        display: flex;
    }
    .zap-home-blurbs .et_pb_column:first-child {
        padding-right: 10px!important;
    }
}

/*
==================
==BUILDING TYPES==
==================
*/
/* HERO SECTION */
.building-types-hero h1, .zp-hero h1 {
    padding-bottom: 0px;
}

/*  Link Section */
/*  Change to a single column for responsiveness */
@media (min-width:480px) and (max-width: 650px){
  .building-types-2 .et_pb_row {
    display:flex;
    flex-direction:column!important;
  } 
   .building-types-2 .et_pb_column {
    width:100%!important;
  } 
} 

/*  Add a triangle to the module box */
.building-types-2 .zap-triangle:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 25px 30px 25px;
    border-color: transparent transparent #202a44 transparent;
    position:absolute;
    top: -18px;
    left: 20px
}

/*  Increase the blurb image size on hover */
.building-types-2 .et_pb_column .et_pb_image img {
    transition: all 1.2s ease-in-out;
}

.building-types-2 .et_pb_column:hover .et_pb_image img {
    transform: scale(1.2);
}

.building-types-2 .et_pb_image {
    overflow:hidden;
}
/*
===================================
==Commercial Buildings and Others==
===================================
*/
/*  This is a 2nd section below Hero section */
/*  It applies to the following pages: Commercial, Agricultural, Recreational, Workshop, Framing Systems,  */
/*  2 Columns on Tablet */
@media (min-width: 767px) and (max-width: 980px) {
    .ver-align-section .zp-2cols{
        display:flex!important;
    }
    .ver-align-section .et_pb_column:last-child{
       padding-left: 5px!important;
    }
    .ver-align-section .et_pb_column:first-child{
       padding-right: 20px!important;
    }
}

/*  place the image at the center */
@media (min-width: 767px){
    .ver-align-section .ver-align-center {
        display: flex!important;
        flex-direction: column!important;
        justify-content: center!important;
    }
}

.ver-align-section .et_pb_column {
    margin-bottom: 0px!important;
}

/*  Change the font sizes for responsiveness */
@media (min-width: 921px) and (max-width: 1130px) {
    .ver-align-section h3 {
        font-size: 27px!important;
    }
    .ver-align-section p {
        font-size: 16px!important;
        line-height: 1.4em;
    }
}

@media (min-width: 767px) and (max-width: 920px) {
    .ver-align-section h3 {
        font-size: 24px!important;
    }
    .ver-align-section p {
        font-size: 15px!important;
        line-height: 1.3em;
    }
    .ver-align-section .et_pb_divider {
    margin-top: 8px!important;
    margin-bottom: 8px!important;
    }
}

/*
==========================
===DESIGN & ENGINEERING===
==========================
*/

/*  Adjust the images to equal size  */
.zp-design-images 
 .et_pb_module.et_pb_image {
    height: 80%!important;
}

.zp-design-images .et_pb_image .et_pb_image_wrap, 
.zp-design-images .et_pb_image .et_pb_image_wrap img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

/*  Our Design & Engineering Sample Section */
/*  Decrease the bottom margins the images and the title column */

@media (max-width: 980px) {
.zp-design-images .et_pb_module.et_pb_image {
    margin-bottom: 15px;
}
.zp-design-img-title .et_pb_column {
    margin-bottom: 0px;
}
}

/*  Blurb h5 font size */

@media (min-width:480px) and (max-width: 768px){
.zp-design-images h5 {
    font-size: 17px!important;
}
.zp-firewall h5 {
    font-size: 20px!important;
}
}

/*
==================
===CONSTRUCTION===
==================
*/
/* Link Section */
/* 3 columns on responsivess */
@media (min-width: 600px) and (max-width: 980px){
    .zp-construction-links .zp-3cols {
        display: flex;
    }
    .zp-construction-links .et_pb_column {
        padding-right: 10px;
    }
    .zp-construction-links .et_pb_column:last-child {
        padding-right: 0px!important;
    }
    .zp-construction-links h5 {
        font-size: 18px;
    }
    .zp-construction-links .et_pb_column .et_pb_module {
        padding-right: 5px!important;
        padding-left: 5px!important;
    }
}

@media (min-width: 981px) and (max-width: 1200px){
    .zp-construction-links h5 {
        font-size: 22px;
    }
}

/*  Change the icons to numbers on Blurb Modules */
.zp-construction-3 .zp-list-1 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-2 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-3 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-4 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-5 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-6 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-7 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-8 .et_pb_image_wrap:before,
.zp-construction-3 .zp-list-9 .et_pb_image_wrap:before {
    content: '1';
    font-size: 25px;
    font-weight:  bold;
    color: #B9B742;
    display: inline-block;
    transform: translate(20px, 11px);
}

.zp-construction-3 .zp-list-2 .et_pb_image_wrap:before {
    content: '2';
}
.zp-construction-3 .zp-list-3 .et_pb_image_wrap:before {
    content: '3';
}
.zp-construction-3 .zp-list-4 .et_pb_image_wrap:before {
    content: '4';
}
.zp-construction-3 .zp-list-5 .et_pb_image_wrap:before {
    content: '5';
}
.zp-construction-3 .zp-list-6 .et_pb_image_wrap:before {
    content: '6';
    transform: translate(20px,-2px);
}
.zp-construction-3 .zp-list-7 .et_pb_image_wrap:before {
    content: '7';
}
.zp-construction-3 .zp-list-8 .et_pb_image_wrap:before {
    content: '8';
    transform: translate(20px,-1px);
}
.zp-construction-3 .zp-list-9 .et_pb_image_wrap:before {
    content: '9';
    transform: translate(20px,-1px);
}

/*  Change the number icons on mobile  */
@media (max-width: 767px){
  .zp-construction-3 .zp-list-1 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-2 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-3 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-4 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-5 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-6 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-7 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-8 .et_pb_image_wrap:before,
  .zp-construction-3 .zp-list-9 .et_pb_image_wrap:before {
      font-size: 22px;
  }
}

@media (max-width: 980px){
    .zp-construction-3 .zp-list-6 .et_pb_image_wrap:before,
    .zp-construction-3 .zp-list-7 .et_pb_image_wrap:before,
    .zp-construction-3 .zp-list-8 .et_pb_image_wrap:before,
    .zp-construction-3 .zp-list-9 .et_pb_image_wrap:before {
    transform: translate(20px,11px);
    }
}

/*
========================
===PROJECT MANAGEMENT===
========================
*/
/* List section */
/*  text size and line height adjustment on responsiveness  */
@media (min-width: 981px) and (max-width: 1240px){
    .zp-project-lists h1.et_pb_module_header {
        font-size: 17px!important;
        line-height: 1.3em!important;
    }   
    .zp-project-lists p {
        font-size: 15px!important;
        line-height: 1.3em!important;
    }
}

/*  Place the images side by side on tablet */
@media (min-width: 600px) and (max-width: 980px){
    .zp-project-lists .zp-flex {
        display: flex;
    } 
    .zp-project-lists .et_pb_image{
        padding-right: 15px;
    }
}

/*
====================
===STEEL ERECTION===
====================
*/

/*  GALLERY SECTION */
/* Change the height of the right image */
.zp-steel-erection-gallery .et_pb_column.et-last-child .et_pb_image {
  height: 93%;
}

/*
================
===ABOUT PAGE===
================
*/

/*  Link Section */
/*  Place the text and button to the bottom of the columns */
.zp-links .zp-bottom-column {
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
  }
/*  Image Grayscale */
.zp-links .et_pb_column img {
    filter: grayscale(0.5);
  }

/*
  ================
  ===ABOUT US ====
  ================
  */
  /* Second Section - Ajusting text module */
  @media (min-width: 981px) and (max-width: 1200px){
  .zp-about-us-2 p {
      line-height: 1.5em!important;
      font-size: 17px;
  }
  }
  
  .zp-about-us-2 .zp-bottom-column {
      display:flex;
      flex-direction:column;
      justify-content:flex-end;
  }

/*
  =================
  ==BLOG CATEGORY==
  =================
  */
  
  /* Left Align the texts below the image */
.dtb-post-wrap {
      padding-left: 0px!important;
  }
  
 /* Make the text area looks better */
 #main-content .dtb-post-wrap h2.entry-title {
          line-height: 1.2em;
          padding-bottom: 10px;
      }
  #main-content .dtb-post-wrap p.dtb-post-content {
      padding-bottom: 10px;
  }

/* Mobile response */
 @media (max-width: 980px){
     #main-content .dtb-post-wrap h2.entry-title {
         font-size: 22px!important;
     }
 }

 
/*

/*
  ===============
  ==SINGLE POST==
  ===============
  */
#main-content .zp-post-hero h1.entry-title {
    padding-bottom: 10px!important;
}

==============================================
===Zaptify Edits on DIVI LOVER CANVAS CODES===
==============================================
*/
/*  Zaptify Edit on Canvas on canvas-content-1 */
/*  Change font size on desktop right before tablet view */
@media (min-width: 1100px) and (max-width:1300px){
    .zp-canvas-content-1 .et_pb_module p {
        font-size: 17px!important;
        line-height: 1.5em;
    }
}
@media (min-width: 768px) and (max-width:1100px){
    .zp-canvas-content-1 .et_pb_module p {
        font-size: 16px!important;
        line-height: 1.4em;
    }
}
/* Change the title font size */
@media (min-width: 768px) and (max-width: 980px) {
    .zp-canvas-content-1 h3 {
        font-size: 30px!important;
    }
}

@media (max-width: 767px) {
    .zp-canvas-content-1 h3 {
        font-size: 25px!important;
    }
}

/*  Zaptify Edit on Canvas on canvas-features-6  */
/*  3 column blurb module max-width adjustment on tablet */
/*  Page: Steel Buildings,  */
@media (min-width: 768px) and (max-width: 980px){
    .et_pb_section .zp-3col-blurbs .et_pb_blurb {
        max-width: 100%
    }
}

/*
==================
===CANVAS CODES===
==================
*/
/* Canvas Text Module Styles (all Text modules) */
.canvas-text.et_pb_text .et_pb_text_inner a:not(:hover) {
  text-decoration-color: transparent;
}

.canvas-text.et_pb_text .et_pb_text_inner a {
  transition: all .3s ease-in-out;
  text-underline-offset: .2em;
}


/* Canvas Gallery #3 */
.canvas-gallery-3 .et_pb_column .et_pb_image {
  height: 50%;
}

.canvas-gallery-3 .et_pb_column.et-last-child .et_pb_image {
  height: 100%;
}

.canvas-gallery-3 .et_pb_image .et_pb_image_wrap,
.canvas-gallery-3 .et_pb_image .et_pb_image_wrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media (max-width:980px) {
  .canvas-gallery-3 .et_pb_column {
    display: flex;
  }
}


/* Canvas Gallery #4 */
.canvas-gallery-4 .et_pb_column .et_pb_image {
  height: 100%;
}

.canvas-gallery-4 .et_pb_column.et-last-child .et_pb_image {
  height: 50%;
}

.canvas-gallery-4 .et_pb_image .et_pb_image_wrap,
.canvas-gallery-4 .et_pb_image .et_pb_image_wrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media (max-width:980px) {
  .canvas-gallery-4 .et_pb_column {
    display: flex;
  }
}

/* Canvas Gallery #8 */
.canvas-gallery-8 .et_pb_column_1_4 .et_pb_image {
  height: 50%;
}

.canvas-gallery-8 .et_pb_column_1_2 .et_pb_image {
  height: 100%;
}

.canvas-gallery-8 .et_pb_image .et_pb_image_wrap,
.canvas-gallery-8 .et_pb_image .et_pb_image_wrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media (max-width:980px) {
  .canvas-gallery-8 .et_pb_column {
    display: flex;
    flex-wrap: wrap;
  }
}

@media (max-width:479px) {
  .canvas-gallery-8 .et_pb_column_1_4 .et_pb_image {
    flex-basis: 50%;
    height: 100%;
  }
}