﻿/*-----------------------------------------------------------------------------------*//*  PHONE
/*-----------------------------------------------------------------------------------*/
@media(max-width: 767px)
{/* Bottom Mobile Menu */
    .mobile-bottom-navbar .navbar-toggle
    {
        top: -22px;
        float: initial;
        margin: 0;
        padding: 12px;
        border: solid 1.8px #ccc;
        border-radius: 10px;
        background-color: #fb8a2f!important;
        box-shadow: 0 2px 2px 0 #555;
    }
    .mobile-bottom-navbar .navbar-brand
    {
        display: inline;
        height: 60px;
        width: 20%;
        font-size: 12px;
        text-align: center;
        color: #000000eb;
        text-transform: uppercase;
    }
    .mobile-bottom-navbar .navbar-brand .glyphicon, .mobile-bottom-navbar .fas, .mobile-bottom-navbar .far, .mobile-bottom-navbar .fab
    {
        margin: auto;
        color: #000;
        margin-bottom: 2px;
        display: block;
    }
    .mobile-bottom-navbar .navbar-toggle .icon-bar
    {
        background-color: #fff;
    }
    .mobile-bottom-navbar .navbar-nav
    {
        background-color: #fff;
        text-align: center;
    }
    .mobile-bottom-navbar .navbar-nav u
    {
        text-underline-position: under;
    }
    .mobile-bottom-navbar .navbar-nav>li
    {
        display: inline-grid;
        width: 32%;
    }
    .mobile-bottom-navbar .navbar-nav>li>a:hover
    {
        background-color: #eee;
        text-decoration: none;
    }
    .mobile-bottom-navbar .navbar-nav>li>a
    {
        text-transform: uppercase;
        padding: 35px 0;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        color: #000000eb;
    }
    .mobile-bottom-navbar .navbar-collapse
    {
        background-color: #eee;
    }
    .mobile-bottom-navbar .navbar-collapse .collapse .in i.far
    {
        font-size: 30px;
    }
    .mobile-bottom-navbar .navbar-brand:hover, .navbar-default .navbar-brand:focus
    {
        background-color: #eee;
        text-decoration: none;
    }
    .navbar-toggle .icon-bar:nth-of-type(2)
    {
        top: 1px;
    }
    .navbar-toggle .icon-bar:nth-of-type(3)
    {
        top: 2px;
    }
    .navbar-toggle .icon-bar
    {
        position: relative;
        transition: all 500ms ease-in-out;
    }
    .navbar-toggle.active .icon-bar:nth-of-type(1)
    {
        top: 6px;
        transform: rotate(45deg);
    }
    .navbar-toggle.active .icon-bar:nth-of-type(2)
    {
        background-color: transparent;
    }
    .navbar-toggle.active .icon-bar:nth-of-type(3)
    {
        top: -6px;
        transform: rotate(-45deg);
    }
}