/* #region -------------------------- ROOT */
@media only screen and (max-width : 1024px) { 
  :root {
    --h1: 54px;
    --h2: 41px;
    --h3: 32px;
    --h4: 24px;
  }
} 
@media only screen and (max-width : 767px) { 
  :root {
    --h1: 44px;
    --h2: 34px;
    --h3: 28px;
    --h4: 21px;
  }
} 
@media only screen and (max-width : 480px) { 
  :root {
    --h1: 38px;
    --h2: 28px;
    --h3: 21px;
    --h4: 18px;
  }
} 
/* #endregion */

/* #region - -------------------------- GENERAL */
@media only screen and (max-width : 1060px) { 
  section.element .wrap { padding: 30px 0; }
  section.element .nwrap { padding: 0; }
}  
@media only screen and (max-width : 1024px) { 
  .element.no-br br { display: none; }
  header .menu_wrap {
    background: var(--color1);
  }
}  
@media only screen and (max-width : 767px) { 
  .ff-cta .btitle, .ff-cta .dtext {
    margin-bottom: 30px;
  }
  .ff-cta {
    height: unset;
    padding: 30px 0;
  }
  .footer-0 {
    padding: 30px 0;
  }
  header .menu_wrap {
    padding: 15px 0;
  }
  .footer-0 .menu-links.hide-lg.dv {
    display: none;
  }
  .footer-0 .menu-links.is-mobile {
    display: block !important;
    width: 100%;
    border: 1px solid #fff;
    color: #fff;
  }
  .footer-0 .footer-menu.sel-menu {
    width: 100%;
  }
  .footer-0 .menu-links.is-mobile li:before {
    filter: brightness(0) saturate(100%) invert(1);
  }
}
@media only screen and (max-width : 600px) { 
  .footer-0 .dtop .col-md-3 {
    max-width: 100%;
  }
  .footer-0 .menu-links {
    gap: 30px;
  }
  .footer-0 .menu-links .menu-item {
    flex: 0 0 auto;
    max-width: 100%;
    display: block;
    width: 100%;
  }
  .footer-0 .above-top {
    padding-bottom: 30px;
    margin-bottom: 30px;
  }
  .footer-0 .copyright {
    margin-top: 30px;
  }
}
@media only screen and (max-width : 480px) { 
  
}
/* #endregion */

/* #region - -------------------------- OVERALL */
@media only screen and (max-width : 1440px) {
  .colposter-01 .bg-img {
    max-width: 685px;
  }
  .rowposter-02.wbg .bg-img.overlay-bg {
    max-width: 635px;
  }
}
@media only screen and (max-width : 1280px) {
  .rowposter-02.wbg .bg-img.overlay-bg {
    max-width: calc(50% - 85px);
  }
}
@media only screen and (max-width : 1060px) { 
  .heroopt-01 .wrap {
    min-height: 400px;
    padding-bottom: 30px;
  }
  .heroslider-01 .wrap {
    min-height: 810px;
  }
  .contact-01 .wrap {
    padding-top: 220px !important;
  }
  .cardsflex-01 .wrap {
    padding-top: 213px !important;
  }
}
@media only screen and (max-width : 1024px) { 
  .contact-01 .wrap {
    padding-top: 30px !important;
  }
  .contact-01 {
    min-height: 100vh;
  }
  .heroslider-01 .wrap {
    min-height: 600px;
  }
  .js-tabs-01 .col1:before {
    height: 452px;
  }
  .slidercpt-01 .below-wrap {
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 30px;
  }
  .colposter-01 .bg-img {
    max-width: 50%;
  }
  .colposter-01 .dinfo {
    padding: 30px 0;
  }
  .colposter-01 .dinfo:before {
    height: 100%;
    background-size: contain;
  }
  .rowposter-02 {
    padding: 0;
  }
  .cardsflex-01 .wrap {
    padding-top: 30px !important;
  }
  .cardsflex-01 .maintitle {
    margin-bottom: 60px;
  }
  .cardsflex-01 .beforetitle {
    margin-bottom: 30px;
  }
  .our-story .menu_wrap:before {
    bottom: 0;
  }
  .single-projects .wrap,
  .single-projects .post-related {
    padding: 30px 0 !important;
  }
}
@media only screen and (max-width : 991px) { 
  .rowposter-01 .dinfo,
  .rowposter-02 .dinfo {
    max-width: 100%;
  }
  .rowposter-01 .btitle {
    margin-bottom: 30px;
  }
  .rowposter-01 .dtext, 
  .rowposter-01 .btn-loop {
    margin-top: 30px;
  }
  .rowposter-01 img.show-lg {
    height: auto;
    object-fit: contain;
    max-height: 600px;
    z-index: 5;
    position: relative;
  }
  .rowposter-02.wbg .dinfo:before {
    content: unset;
  }
  .rowposter-02 .owl-stage .item .bg-img {
    position: relative;
    background-position: top;
  }
}
@media only screen and (max-width : 800px) {
  .js-tabs-01 .flexic {
    gap: 30px;
    flex-direction: column-reverse;
  }
  .js-tabs-01 .dinfo {
    max-width: 100%;
  }
  .js-tabs-01 .dimage {
    margin: auto !important;
  }
  .js-tabs-01 .mtitle {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
  .js-tabs-01 .dtext,
  .js-tabs-01 .maintitle,
  .js-tabs-01 .nav,
  .js-tabs-01 .beforetitle {
    margin-bottom: 30px !important;
  }
  .js-tabs-01 .col2 {
    width: 100%;
  }
  .js-tabs-01 .nav-item:before,
  .js-tabs-01 .col1:before {
    content: unset;
  }
}
@media only screen and (max-width : 767px) { 
  .heroopt-01 .wrap {
    min-height: 300px;
  }
  .rowmedia-01 .wrap .img-wrapper {
    text-align: center !important;
  }
  .icon-01 .row {
    margin: 30px 0;
  }
  .p-text-01 .col-info:before {
    left: 0;
    bottom: 0;
  }
  .p-text-01 .col-info:after {
    right: 0;
    top: 0;
  }
  .frcontact-01 .row {
    flex-direction: column-reverse !important;
  }
  .frcontact-01 .dinfo,
  .rowicons-01 .dinfo {
    max-width: 100%;
  }
  .frcontact-01 .btitle {
    margin-bottom: 30px;
  }
  .icon-02 .row {
    margin-top: 30px;
  }
  .titler-02 .job-board-wrap {
    margin-top: 30px;
    padding: 30px 0;
  }
  .titler-02 .rtitle {
    padding: 0 30px;
  }
  .titler-02 .jtitle {
    padding: 0 30px 30px;
  }
  .titler-02 .job-item {
    padding: 20px 30px;
  }
  .contact-01 .row h3,
  .contact-01 {
    min-height: unset;
  }
  .contact-01 .row,
  .contact-01 .social-icons,
  .ajaxc-01 .ajax_grid {
    margin-top: 30px;
  }
  .location-01 .dtext,
  .single-projects .post-related .dtitle,
  .single-projects .post-content .post-thumb {
    margin-bottom: 30px;
  }
  .location-01 .bmtext,
  .single-projects .below-wrap {
    margin-top: 30px;
  }
  .heroslider-01 .wrap {
    min-height: 400px;
    align-items: center;
  }
  .heroslider-01 .hero-opt {
    padding: 30px 0;
    max-width: 100%;
  }
  .heroslider-01 .overlay.color,
  .heroslider-01 .overlay.color2,
  .heroslider-01 .overlay.color3,
  .heroslider-01 .overlay.color4 {
    height: 200px;
  }
  .slidercpt-01 .mtitle, 
  .slidercpt-01 .btitle {
    margin-bottom: 30px;
  }
  .colposter-01 .bg-img {
    position: static;
    max-width: 100%;
    height: 100%;
    min-height: 600px;
    margin-left: 15px;
    margin-right: 15px;
  }
  .colposter-01 .bg-img:before, 
  .colposter-01 .bg-img:after,
  .colposter-01 .dinfo:before {
    content: unset;
  }
  .colposter-01 .dinfo {
    padding-bottom: 0;
  }
  .rowicons-01 .icon-wrapper .info {
    margin: auto;
  }
  .cardsflex-01 .flex-item {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
  }
  .cardsflex-01 .flexic {
    margin: 0 !important;
    padding-bottom: 30px;
  }
  .cardsflex-01 .custom-container:not(:last-child) .flexic {
    margin-bottom: 0 !important;
  }
  .cardsflex-01 .flex-item .dimage,
  .cardsflex-01 .flex-item .ititle,
  .cardsflex-01 .flex-item .dtext {
    opacity: 1;
  }
  .cardsflex-01 .dimage {
    max-width: 270px;
    width: 100%;
    height: 170px;
  }
  .cardsflex-01 .flex-item:hover .dimage {
    transform: unset;
  }
  .cardsflex-01 .flex-item:hover .dimage img {
    top: 0;
  }
  .cardsflex-01 .custom-container:before {
    content: unset;
  }
  .cardsflex-01 .flex-item:before {
    content: '';
    width: 100% !important;
    height: 2px !important;
    background: rgba(211, 187, 159, .3) !important;
    position: absolute !important;
    top: 224px !important;
    left: unset !important;
    right: unset !important;
    border-radius: unset !important;
  }
  .ajaxc-01 .dtext:before,
  .icon-02 .maintitle:before,
  .icon-02 .ititle:before,
  .location-01 .mtitle:before,
  .rowicons-01 .item .ititle:before {
    left: 0;
    transform: unset;
  }
  .icon-01 .item:before {
    left: 15px;
    transform: unset;
  }
  .ajaxc-01 .mtitle,
  .ajaxc-01 .dtext,
  .ajaxc-01 .dtext p,
  .icon-02 .maintitle,
  .icon-02 .mtext,
  .icon-02 .mtext p,
  .icon-02 .ititle,
  .icon-02 .dtext,
  .icon-01 .maintitle,
  .icon-01 .mtext,
  .icon-01 .btext,
  .icon-01 .mtext p,
  .icon-01 .btext p,
  .icon-01 .ititle,
  .location-01 .mtitle,
  .location-01 .dtext,
  .location-01 .bmtext,
  .location-01 .dtext p,
  .location-01 .bmtext p,
  .slidercpt-01 .mtitle,
  .slidercpt-01 .btitle,
  .js-tabs-01 .maintitle, 
  .js-tabs-01 .beforetitle,
  .rowicons-01 .item .ititle, 
  .rowicons-01 .item .itext,
  .rowicons-01 .item .itext p {
    text-align: left !important;
  }
  .icon-02 .dinfo,
  .icon-01 .dinfo,
  .rowicons-01 .icon-wrapper .item .info {
    display: flex;
    gap: 30px;
    align-items: center;
  }
  .rowicons-01 .iconwrap {
    flex: 0 0 auto;
  }
  .icon-02 .diconn,
  .icon-01 .diconn {
    margin-bottom: 0;
  }
  .slidercpt-01 .below-wrap {
    justify-content: left;
  }
}
@media only screen and (max-width : 600px) {
  .cardsflex-01 .flex-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .js-tabs-01 .nav {
    justify-content: left;
  }
}
@media only screen and (max-width : 480px) { 
  .frcontact-01 .gform {
    padding: 30px;
  }
  .slidercpt-01 .hidden {
    display: none;
  }
  .slidercpt-01 .post-item:hover .hidden {
    display: block;
  }
  .rowicons-01 .grp-wrap {
    gap: 30px;
  }
  .rowicons-01 .icon-wrapper .item {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .rowicons-01 .icon-wrapper .item .info {
    max-width: 100%;
  }
  .rowicons-01 .grp-wrap:before, .rowicons-01 .grp-wrap:after {
    content: unset;
  }
} 
@media only screen and (max-width : 375px) {
  .rowposter-02 .dtext ul {
    column-count: 1;
  }
}
@media only screen and (max-width : 360px) {
  .titler-02 .job-link {
    flex-wrap: wrap;
  }
}
/* #endregion */