:root{
    --verde: #4f884a;
    --azul: #1f3049;
    --azul2: #051b35;
}

/* Global */
.ready-btn,
.ab-btn,
.system-btn,
.hire-btn, 
.side-btn,
#submit-contact{
    border: 1px solid var(--verde);
    background: var(--verde);
    transition: .5s ease-in-out;
}
.ready-btn:hover,
.ab-btn:hover,
.system-btn:hover,
.hire-btn:hover,
.side-btn:hover,
#submit-contact:hover{
    border: 1px solid var(--verde);
    background: transparent;
    color: #fff;
}
.system-btn:hover,
.side-btn:hover,
#submit-contact:hover{
    color: var(--verde);
}
.ready-btn{
    text-transform: none;
    width: 240px;
}
#scrollUp{
    background-color: var(--verde);
}
.single-icon i{
    background-color: var(--verde);
    border: 1px solid var(--verde);
}
/* Menu */
.topbar-area{
    background: var(--azul);
}
.header-area.stick{
    background: #141414;
}
.header-area.stick .main-menu ul.navbar-nav li a{
    color: #fff;
}
.header-area .flex-row{
    display: flex;
    align-items: center;
}
.header-area .flex-row .flex-col{
    display: flex;
    align-items: center;
}
.navbar.navbar-default{
    text-align: right;
    width: 100%;
}
.topbar-left li{
    color: #fff;
}
.topbar-left ul li a i{
    color: var(--verde);
}
.top-social ul li a:hover{
    background: var(--verde);
}
.main-menu ul.nav li a:hover, .main-menu ul.nav li:hover ul.sub-menu li a:hover{
    color: var(--verde);
}
.topbar-left .link{
    display: inline-block;
    margin-right: 10px;
}
.topbar-left .link:last-child{
    margin-left: 10px;
    margin-right: 0;
}
.main-menu ul.nav > li> a::after{
    display: none;
}
.header-right-link ul li a{
    background: var(--verde);
    border-radius: 8px;
    border: 1px solid var(--verde);
    color: #fff;
    font-size: 18px;
    padding: 8px 20px;
    display: block;
}
#changeLogo{
    width: 100px;
    height: auto;
}

.left-menu ul li a:hover{
    background: var(--verde);
}
.left-menu ul li.active a{
    background: var(--verde) none repeat scroll 0 0;
}


/* Slider Home */
.intro-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-next:hover, .intro-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-prev:hover{
    background: var(--verde);
    border: 1px solid var(--verde);
}
.layer-2 p{
    font-size: 30px;
    line-height: normal;
}
.intro-content::after{
    display: none;
}
.slider-content{
    z-index: 2;
}
.slider-content .title2 .strong{
    font-weight: 800;
}
.slider-content .title2 .color{
    color: var(--verde);
}
.slider-images{
    position: relative;
}
.slider-images:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(31 48 73 / 20%);
    z-index: 1;
}

/* Nosotros */
#nosotros .support-services::after{
    background: var(--azul);
}
#nosotros .support-services .list{
    list-style: disc;
    text-align: left;
}
#nosotros .support-services .list span{
    color: var(--verde);
    font-weight: 600;
}
#nosotros .support-services:hover .list{
    color: #fff;
}

/* Call to action */
#callToAction1{
    background: url(../archivos/renta-de-oficinas-cdmx.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
#callToAction1:before{
    background: transparent;
}

#clientes{
    background: #f7f7f7;
}

/* Contacto section */
.office-city .phone a{
    color: #444;
}
.contact-icon .single-icon{
    display: flex;
}


/* Contacto Interior */
.d-none{
    display: none;
}
#contactInterior{
    padding: 70px 0;
}
#contactInterior .headerTitle{
    position: relative;
}
#contactInterior .headerDescription{
    position: relative;
}
#submit-contact{
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    padding: 8px 20px;
}

/* Map section */
.map-section{
    margin-top: 40px;
}
.map-section h5{
    text-align: center;
    font-size: 23px;
    margin-bottom: 20px;
    color: #444;
}

/* Footer */
.footer1::after{
    display: none;
}
.footer-area-bottom{
    background: #141414;
}
.footer-area-bottom .flex-row{
    display: flex;
    align-items: center;
}
.footer-area-bottom .left{
    text-align: left;
}
.footer-area-bottom .center{
    text-align: center;
}
.footer-area-bottom .right{
    text-align: right;
}
.footer-area-bottom .copyright p{
    margin-bottom: 0;
}
.footer-area-bottom .copyright p a{
    margin-left: 10px;
    color: var(--verde);
}
.footer-area-bottom .social-links a{
    color: #fff;
    margin: 0 5px;
}
@media screen and (max-width: 764px) {
    .footer-area-bottom .left,
    .footer-area-bottom .center,
    .footer-area-bottom .right{
        text-align: center;
        margin-bottom: 35px;
    }
    .footer-area-bottom .right{
        margin-bottom: 0;
    }

}

/*  */
.page-area{
    background: none;
    position: relative;
}
.page-area:after{
    z-index: 2;
    background: rgba(4,23,46, 0.80) none repeat scroll 0 0;
}
.page-area .overlay{
    position: relative;
}
.page-area .overlay:before{
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(4,23,46, 0.80);
}
.page-area .bckgdTop{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1;
}
.page-area .breadcrumb{
    position: relative;
    z-index: 3;
}
#tableSection{
    padding: 70px 0;
}
#tableSection .titleTable{
    text-align: center;
    font-size: 24px;
    margin-bottom: 20px;
    color: #444;
    font-weight: 600;
}
#tableSection .tableProduct .headers {
    background-color: var(--azul) !important;
}
#tableSection .tableProduct .headers td {
    color: #ffffff;
    border: 1px solid var(--verde) !important;
    padding: 3px;
}
#tableSection .tableProduct tr {
    background-color: rgba(0, 0, 0, 0) !important;
    border: 1px solid var(--azul);
}
#tableSection .tableProduct tr td {
    border: 1px solid var(--azul);
    line-height: normal;
    padding: 3px;
    text-align: center;
}
#tableSection .tableProduct tr.color {
    background-color: rgba(27, 117, 186, 0.05) !important;
    color: var(--azul);
}
