/* Mobile header layout: menu left, logo center, phone right */

/* Phone icon on the RIGHT */
.mobile-phone-left {
    float: right !important;
    display: block;
    margin-top: 15px;
    margin-right: 15px;
    margin-left: 0 !important;
}

.mobile-phone-left a {
    color: #fff;
    font-size: 20px;
}

.mobile-phone-left .fa-phone {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Menu button on the LEFT */
.menu_mb {
    float: left !important;
}

/* Logo centered */
.logo {
    text-align: center;
    float: none !important;
    display: block;
    margin: 0 auto;
}

.logo img {
    max-width: 100%;
    height: auto;
    max-height: 50px;
}

/* Hide phone icon on desktop */
@media (min-width: 769px) {
    .mobile-phone-left {
        display: none !important;
    }
}

/* Mobile specific */
@media (max-width: 768px) {
    .main_header .container {
        position: relative;
    }
    
    .mobile-phone-left {
        position: absolute;
        right: 15px;
        top: 10px;
        z-index: 1000;
    }
    
    .menu_mb {
        position: absolute;
        left: 15px;
        top: 10px;
        z-index: 1000;
    }
    
    .logo {
        margin-top: 10px;
        padding: 0 50px;
    }
}

/* Mobile phone icon on the RIGHT */
.mobile-phone-right {
    float: right;
    display: block;
    margin-top: 15px;
    margin-right: 15px;
}

.mobile-phone-right a {
    color: #fff;
    font-size: 20px;
    text-decoration: none;
}

.mobile-phone-right .fa-phone {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 768px) {
    .mobile-phone-right {
        position: absolute;
        right: 15px;
        top: 10px;
        z-index: 1000;
    }
}

@media (min-width: 769px) {
    .mobile-phone-right {
        display: none !important;
    }
}
