/*
Theme Name: Iconica
Author: GWP Inc.
Description: Iconica Child Theme
Version: 1.0
Template: bootstrap-component-blox
*/

:root {
    --ico-blue: #002859;
    --ico-navy: #142137;
    --ico-accent: #f9bbac;
    --ico-dark: #36454f;
    --ico-font-family: 'Montserrat', sans-serif;
}

/* ===== Global ===== */

html,
body {
    overflow-x: hidden;
    font-family: var(--ico-font-family);
}

a,
a:hover {
    text-decoration: none;
}

p {
    line-height: 2em;
    font-size: 14px;
}

h2 {
    font-size: 1.7rem;
}

/* ===== Custom Classes ===== */

.ls-large {
    letter-spacing: 10px;
}

.ls-small {
    letter-spacing: 3px;
}

.text-shadow {
    text-shadow: 2px 2px 7px rgb(0 0 0 / 80%);
}

.lh-large {
    line-height: 1.8em;
}

.mw-1000 {
    max-width: 1000px;
}

.fw-100 {
    font-weight: 100;
}

.fw-200 {
    font-weight: 200;
}

.fw-300 {
    font-weight: 300;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}

.p-6 {
    padding: 100px;
}

.p-lg-6 {
    padding-top: 100px!important;
    padding-bottom: 100px!important;
}

.ps-30p {
    padding-left: 30%;  
}

.pe-30p {
    padding-right: 30%;  
}

.h-600 {
    height: 600px;
}

.bg-cover {
    background-size: cover;
    background-position: top center;
}

.mh-600 {
    min-height: 600px;
}

#ico-gallery .col:hover i {
    -webkit-transform: translatey(-50%) translatex(-50%);
        -ms-transform: translatey(-50%) translatex(-50%);
            transform: translatey(-50%) translatex(-50%);
    opacity: 1;
}

#ico-gallery .col:hover .overlay {
    opacity: 1;
    -webkit-transition: all 3s;
    -o-transition: all 3s;
    transition: all 3s;
}

#ico-gallery i {
    position: absolute;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    top: 50%;
    left: 50%;
    -webkit-transform: translatey(200%) translatex(-50%);
        -ms-transform: translatey(200%) translatex(-50%);
            transform: translatey(200%) translatex(-50%);
    color: #fff;
    opacity: 0;
    z-index: 99;
}

#ico-gallery .overlay {
    background: rgba(0,0,0,0.3);
    position: absolute;
    height: calc(100% - 40px);
    width: calc(100% - 40px);
    top: 20px;
    left: 20px;
    opacity: 0;
}

/* ===== Text Color ===== */

.ico-text-blue {
    color: var(--ico-blue);
}

.ico-text-navy {
    color: var(--ico-navy);
}

.ico-text-accent {
    color: var(--ico-accent);
}

.ico-text-dark {
    color: var(--ico-dark);
}

/* ===== Background Color ===== */

.ico-bg-blue {
    background: var(--ico-blue);
}

.ico-bg-navy {
    background: var(--ico-navy);
}

.ico-bg-accent {
    background: var(--ico-accent);
}

.ico-bg-dark {
    background: var(--ico-dark);
}

.ico-bg-black {
    background: #000;
}

/* ===== Buttons ===== */

.btn {
    border-radius: 0;
    font-size: 14px;
    text-transform: uppercase;
    min-width: 200px;
    padding: 10px;
    letter-spacing: 3px;
    font-weight: 300;
}

.ico-btn-navy-outline {
    background: #fff;
    border: 1px solid var(--ico-navy);
    color: var(--ico-navy);
}

.ico-btn-navy-outline:hover {
    background: rgba(0,0,0,0.05);
}

.ico-btn-blue {
    background: var(--ico-blue);
    color: var(--ico-accent);
    border: 1px solid var(--ico-blue);
}

.ico-btn-blue:hover {
    color: var(--ico-blue);
    background: #fff;
    border: 1px solid var(--ico-blue);
}

.ico-btn-navy {
    background: var(--ico-navy);
    color: var(--ico-accent);
}

/* ===== Navbar ===== */

#navbar-main-menu .current-menu-item a,
#navbar-main-menu .current-menu-parent a {
    border-bottom: 1px solid var(--ico-accent);
}

#navbar-main-menu .current-menu-parent .sub-menu a,
#menu-item-25 a{
    border-bottom: none!important;
}

.home .sticky-wrapper {
    display: none;
}

.home #ico-navbar {
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 1)));
    background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0) 0% 0%, rgba(0, 0, 0, 1) 100%);
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0% 0%, rgba(0, 0, 0, 1) 100%);
    background-color: transparent;
}

#ico-navbar {
    background-color: var(--ico-navy);
}

.scrolled #ico-navbar {
    background-color: var(--ico-navy);
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
    background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0) 0% 0%, rgba(0, 0, 0, 0) 100%);
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0% 0%, rgba(0, 0, 0, 0) 100%);
}

#ico-logo {
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.scrolled #ico-logo {
    width: 150px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

#ico-navbar .nav-link {
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    margin-left: 20px;
    margin-right: 20px;
    letter-spacing: 3px;
}

#ico-navbar .sub-menu {
    background: transparent;
    border: 0;
    background: var(--ico-navy);
    padding-top: 20px;
    padding-bottom: 20px;
}

#toggler:focus, 
#toggler:active {
    outline: 0;
}

#toggler span {
    width: 30px;
    height: 1px;
    display: block;
    background-color: #fff;
    margin: 7px 0;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

#toggler span:nth-child(1) {
    -webkit-transform: translatey(8px) rotate(-45deg);
        -ms-transform: translatey(8px) rotate(-45deg);
            transform: translatey(8px) rotate(-45deg);
}
#toggler span:nth-child(2) {
    opacity: 1;
    width: 0;
}
#toggler span:nth-child(3) {
    -webkit-transform: translatey(-8px) rotate(45deg);
        -ms-transform: translatey(-8px) rotate(45deg);
            transform: translatey(-8px) rotate(45deg);  
}

#toggler.collapsed span {
    -webkit-transform: translatey(0) rotate(0deg);
        -ms-transform: translatey(0) rotate(0deg);
            transform: translatey(0) rotate(0deg);
    opacity: 1;
    width: 30px;   
}

/* ==== Header ===== */

#ico-main-header .swiper-wrapper {
    height: 100vh;
}

#ico-main-header h1,
#ico-main-header .autoplay{
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

#ico-logo {
    width: 250px;
}

#ico-main-header {
    background-size: cover!important;
    background-repeat: no-repeat;
}

.swiper-pagination-bullet {
    font-size: 25px;
    background: rgba(255,255,255,.5)!important;
    width: 15px;
    height: 15px;
}

.swiper-pagination-bullet:hover {
    cursor: pointer;
}

#ico-text-animation-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translatex(-50%) translatey(-50%);
        -ms-transform: translatex(-50%) translatey(-50%);
            transform: translatex(-50%) translatey(-50%);
    max-width: 1400px;
    width: 80%;
    text-align: center;
    z-index: 999;
    margin: auto;
}

/* ==== Our Clients ===== */

.ico-connecting-lines .col {
    border-bottom: 2px solid var(--ico-accent);
    position: relative;
}

.ico-connecting-lines .col:before {
   content: ''; 
   width: 2px;
   background: var(--ico-accent);
   height: 70px;
   top: 0;
   position: absolute;
   left: 50%;
   -webkit-transform: translatex(-50%);
       -ms-transform: translatex(-50%);
           transform: translatex(-50%);
}

.ico-connecting-lines .col:nth-child(1):after {
    content: '';
    height: 2px;
    background: #fff;
    position: absolute;
    top: 0;
    left: calc(0% - 1px);
    width: 50%;
}

.ico-connecting-lines .col:nth-child(4):after {
    content: '';
    height: 2px;
    background: #fff;
    position: absolute;
    top: 0;
    left: calc(50% + 1px);
    width: 50%;
}

/* ===== About ===== */

.ico-name-line {
    position: relative;
}

#ico-about .col-lg-6:first-child .ico-name-line:after {
    content: '';
    background: #fff;
    position: absolute;
    width: 200px;
    height: 1px;
}

#ico-about .col-lg-6:last-child .ico-name-line:before {
    content: '';
    background: #fff;
    position: absolute;
    width: 200px;
    height: 1px;
    left: -200px;
}

#ico-about .h-600 {
    height: 600px;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
}

/* ===== Clients ===== */

#ico-clients {
    border-top: 1px solid var(--ico-navy);
}

#ico-clients p:last-child {
    margin-bottom: 0;
}

#ico-clients .col-lg-6:first-child .ico-name-line:before {
    content: '';
    background: var(--ico-accent);
    position: absolute;
    width: 1000px;
    left: -1000px;
    height: 1px;
}

#ico-clients .col-lg-6:last-child .ico-name-line:after {
    content: '';
    background: var(--ico-accent);
    position: absolute;
    width: 1000px;
    right: -1000px;
    height: 1px;
}

/* ===== Footer ===== */

#footer-widgets,
#footer-widgets .container-fluid {
    padding-left: 0!important;
    padding-right: 0!important;
}

#ico-footer i:hover {
    color: var(--ico-accent);
}

#footer-widgets h4 {
    font-size: 12px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 200;
    padding-bottom: 10px;
    position: relative;
    display: inline-block;
}

#footer-widgets h4:after {
    content: '';
    background: var(--ico-accent);
    height: 1px;
    width: 50px;
    position: absolute;
    bottom: 0;
    right: 0;
}

#footer-widgets ul {
    padding-left: 0!important;
}

#footer-widgets li {
    list-style: none;
    font-size: 11px;
    color: rgba(255,255,255,0.8);
    font-weight: 300;
}

#footer-widgets li a {
    color: rgba(255,255,255,0.8);
}

.ico-icons i {
    color: #fff;
    font-size: 18px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    border-radius: 50px;
    border: 2px solid #fff;
    height: 33px;
    width: 33px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

/* ===== Contact ===== */

.has-form input {
    border: none!important;
    padding: 30px!important;
    margin-bottom: 20px!important;
}

.has-form select {
    border: none!important;
    height: 60px!important;
}

.has-form textarea {
    border: none!important;
    padding: 30px!important;
}

.has-form input::-webkit-input-placeholder, 
.has-form textarea::-webkit-input-placeholder{
    color: var(--ico-navy)!important;
}

.has-form input::-moz-placeholder, .has-form textarea::-moz-placeholder{
    color: var(--ico-navy)!important;
}

.has-form input:-ms-input-placeholder, .has-form textarea:-ms-input-placeholder{
    color: var(--ico-navy)!important;
}

.has-form input::-ms-input-placeholder, .has-form textarea::-ms-input-placeholder{
    color: var(--ico-navy)!important;
}

.has-form input::placeholder,
.has-form textarea::placeholder{
    color: var(--ico-navy)!important;
}

.has-form .wpforms-submit {
    background: var(--ico-blue)!important;
    color: #fff!important;
    padding: 12px 40px!important;
    font-size: 12px!important;
    text-transform: uppercase!important;
    letter-spacing: 3px!important;
}

.wpforms-confirmation-container-full {
    background: #fff!important;
    border: 1px solid var(--ico-navy)!important;
    text-align: center!important;
}

@media (max-width: 1400px) {
    
    .ps-30p,
    .pe-30p{
        padding-left: 0%;
        padding-right: 0%;
    }
    
}

@media (max-width: 992px) {
    
    #ico-main-header .swiper-wrapper {
        height: 400px;
    }
    
    .home .sticky-wrapper {
        display: block;
    }
    
    #ico-navbar {
        background-color: var(--ico-navy);
        background-image: none;
    }
    
    #ico-navbar .nav-link {
        margin-left: 10px;
        margin-right: 10px;
    }
    
    .p-lg-6 {
        padding-top: auto!important;
        padding-bottom: auto!important;
    }
    
    .p-6 {
        padding: 40px;
    }
    
    .ls-large {
        letter-spacing: 5px;
    }
    
    .lh-large {
        line-height: 1.4em;
    }
    
    h2 {
        font-size: 1.5rem;
    }
    
    #footer-widgets h4:after {
        content: '';
        left: 0;
    }
    
    #ico-about .col-lg-6:first-child .ico-name-line:after{
        content: '';
        background: #fff;
        position: absolute;
        width: 200px;
        height: 1px;
        left: -200px;
    }
    
    .h-600,
    #ico-about .h-600 {
        height: 400px;
    }
    
    .mh-600 {
        min-height: 400px;
    }
    
    #footer-widgets li {
        font-size: 14px;
    }
    
    .home #ico-navbar {
        background-image: none;
        background-color: var(--ico-navy);
    }
    
    #ico-logo {
        width: 180px;
    }
    
    #navbar-main-menu .current-menu-item a,
    #navbar-main-menu .current-menu-parent a {
        border-bottom: none;
    }
    
}

@media (max-width: 768px) {}

@media (max-width: 576px) {}