/*
Theme Name: Creote Child
Theme URI: 
Description: A child theme of Creote
Author: 
Author URI: 
Template: creote
Version: 1.0.0
Text Domain: creote-child
*/

/* Add your custom styles below this line */

/* ---------- LGS vs RCC comparison ---------- */
  .compare-table{width:100%; border-collapse:collapse; margin-top:8px;}
  .compare-table th, .compare-table td{
    padding:18px 20px; text-align:left; border-bottom:1px solid #DEDAD0; font-size:14.5px;
  }
  .compare-table thead th{
    font-family: "Spartan", sans-serif!important; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
    color:#6B7280; border-bottom:2px solid #0b1420; padding-bottom:14px;
  }
  .compare-table thead th.col-lgs{color:var(--steel);}
  .compare-table thead th.col-rcc{color:#9A8266;}
  .compare-table td.metric{font-weight:600; color:var(--ink); font-family: "Spartan", sans-serif!important;}
  .compare-table td.col-lgs{color:#1F4E6E; background:rgba(46,111,158,0.05); font-weight:500;}
  .compare-table td.col-rcc{color:#7A6852; background:rgba(154,130,102,0.06);}
  @media (max-width:680px){
    .compare-table{font-size:13px;}
    .compare-table th, .compare-table td{padding:12px 10px;}
  }

    .header_content_collapse{
            .navigation_menu{
                float: right;
               .navbar_nav{ 
                  padding: 0; 
                  margin: 0px;
                 li{
                     position: relative;
                     margin-right:20px;
                     padding: 20px 0px;
                     margin-bottom: 0px!important;
                     display: inline-block;
                     transition: 0.5s ease-in-out;
                     -ms-transition: 0.5s ease-in-out;
                    -moz-transition: 0.5s ease-in-out;
                    -o-transition: 0.5s ease-in-out;
                    &.dropdown{
                        margin-right: 40px;
                    }
                    &.dropdown.mega_menu{
                        margin-right: 27px;  
                    }
                    .dropdown-btn{
                        position: absolute;
                        right: -31px;
                        top: 0;
                        bottom: 0;
                        margin: auto;
                        height: 40px;
                        width: 40px;
                        line-height: 40px;
                        text-align: center;
                        span:before{
                            font-family: 'FontAwesome';
                            color: var(--text-color-light);
                            font-weight: 400;
                        }
                    }
                    &.mega_menu{
                        a.nav-link{
                            span.fa-angle-down{
                                display: inline-block;
                                margin-left: 6px;
                                color: var(--text-color-light);
                                top: 1px;
                                position: relative;
                                &::before{
                                    font-weight: 400;
                                    font-family: 'fontawesome';
                                }
                            }
                        }
                        .dropdown-btn{
                            display: none;
                        }
                        .dropdown-menu{
                            background: transparent!important;
                            padding: 0px!important;
                            box-shadow: none!important;
                            z-index: 999;
                        }
                    }
                     a.nav-link{
                         font-size:15px;
                         line-height: 26px;
                         padding: 0;
                         font-weight: 600;
                         color: var(--menu-color);
                         font-family: var(--creote-family-one);
                         transition: 0.5s ease-in-out;
                         -ms-transition: 0.5s ease-in-out;
                        -moz-transition: 0.5s ease-in-out;
                        -o-transition: 0.5s ease-in-out;
                         &:hover{
                             color:var(--menu-active-color);
                         }
                     }
                     &:last-child{
                         margin-right: 0px;
                     }
                     &.active {
                         a.nav-link{
                            color:var(--menu-active-color); 
                         }
                         .dropdown-btn{
                             span{
                                color:var(--menu-active-color);
                                &:before{
                                    color:var(--menu-active-color);
                                }
                             }
                         }
                         &.mega_menu{
                            a.nav-link{
                                span.fa-angle-down{
                                    color:var(--menu-active-color);
                                }
                            }
                        }
                     }
                     .dropdown-menu{
                        transition: top .3s ease 0s,opacity .3s;
                        -ms-transition: top .3s ease 0s,opacity .3s;
                        -moz-transition: top .3s ease 0s,opacity .3s;
                        -o-transition: top .3s ease 0s,opacity .3s;
                        position: absolute;
                        top: 40%;
                        left: 8px;
                        width: 220px;
                        padding:13px 25px;
                        -webkit-transform: scaleX(0);
                        -ms-transform: scaleX(0);
                        transform: scaleX(0);
                        background-color: #fff;
                        margin-top: 23px;
                        box-shadow: var(--box-shadow);
                        border: 0px;
                        border-radius: 10px;
                        display: block!important;
                        z-index: 999;

                        &::before{
                            content: '';
                            width: 100%;
                            height: 40px;
                            position: absolute;
                            background-color: transparent;
                            left: 0;
                            top: -25px;
                        }
                        li{
                            display: block; 
                            padding: 5px 0px;  
                            margin: 0!important;
                           
                            a.nav-link{
                                color:var(--text-color-dark)!important; 
                                font-size: 15px;
                                line-height: 25px;
                                font-weight: 400;
                                font-family: var(--creote-family-two);
                                display: block;
                                white-space: inherit; 
                            }
                        }
                        li ,
                        ul li ,
                        ul li ,  ul li ,
                        ul li ,  ul li ,  ul li {
                            -webkit-transition-delay: .1s;
                            transition-delay: .1s;
                        
                    }   
                    .dropdown-btn{
                        right: -25px;
                        transform: rotate(-90deg);
              
                         span:before{
                            color: var(--text-color-dark);
                         }
                    }
                    .dropdown-menu{
                        left: 205px;
                        margin-top: -22px;
                        opacity: 1;
                        &::before{
                            left: -35px;
                            height: 60px;
                        }
                        .dropdown-menu{
                            .dropdown-menu{
                                left: -40px;
                                margin-top: 10px;
                            }
                        }
                    }
                  }
               }
               li.mega_menu {
                   .dropdown-menu{
                    width: calc(100% - 0%);
                       left: 0;
                       margin-left: auto;
                       margin-right: auto;
                       right: 0;
                       transition: top .5s ease 0s,opacity .5s;
                       -ms-transition: top .5s ease 0s,opacity .5s;
                       -moz-transition: top .5s ease 0s,opacity .5s;
                       -o-transition: top .5s ease 0s,opacity .5s;
                       .elementor-section-wrap{
                           .menu{
                               padding-left: 0px;
                               li{
                                position: relative;
                                    a{
                                        display: block;
                                        font-size: 15px;
                                        line-height: 26px;
                                        color: var(--menu-color);
                                        font-weight: 400;
                                   
                                    }
                               }
                           }
                           .footer_widgets .fo_wid_title h2{
                               font-weight: 600;
                               font-size: 16px;
                               line-height: 26px!important;
                           }
                       }
                   }
                   .elementor-section-full_width{
                    .elementor-container{
                        max-width: 100%;
                    }}
                   &:hover{
                    .dropdown-menu {
                        top: 71%!important;
                    }
                   }
               }
               
               li:hover > {
                .dropdown-menu {
                    opacity: 1;
                    z-index: 9999;
                    top: 87%;
                    transform: scaleX(1);
                    -ms-transform: scaleX(1);
                    -moz-transform: scaleX(1);
                    -o-transform: scaleX(1);
                   
                }
             }
             li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li  ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li ,
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li {
                -webkit-transition: all .2s cubic-bezier(.4,.28,.31,1.28) 0s;
                transition: all .2s cubic-bezier(.4,.28,.31,1.28) 0s;
                opacity: 0;
                visibility: hidden;
                -webkit-transform: translateY(5px);
                transform: translateY(5px);
                -webkit-transition-delay: .19s;
                transition-delay: .19s;
             }
             li:hover  .dropdown-menu  li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu  li:hover .dropdown-menu  li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li  {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li{
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
             li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu li {
                opacity: 1;
                visibility: visible;
                -webkit-transform: translateY(0);
                transform: translateY(0);
             }
           
           
        }
    }
}