/*XTRA-Small devices (landscape phones, 576px and up)*/
@media (min-width: 0px) and (max-width: 575.8px) {
    .navbar-User .navbar-toggler {
        border: 2px solid var(--color-brown-bold) !important;
        padding-bottom: 6px !important;
        margin-top: 25px;
        padding-top: 4px !important;
        color: var(--color-brown-bold);
    }

    .navbar-toggler:active {
        border: 2px solid var(--color-brown) !important;
        background-color: var(--color-brown);
        color: white;
    }

    .navbar-toggler p {
        display: inline;
        font-size: 13px;
        vertical-align: middle;
        font-weight: bold;
        text-transform: uppercase;
    }

    .navbar-toggler i {
        vertical-align: middle;
    }

    .navbar-toggler:hover {
        border: 2px solid var(--color-orange) !important;
        background-color: var(--color-orange);
        color: var(--color-orange);
    }

    #Logo {
        margin-top: 15px;
    }

    header {
        height: 99px;
    }

    #navbarSupportedContent .navbar-nav {
        position: absolute;
        right: 16px;
        bottom: 0;
        top: 80px;
        z-index: 99;
        background-color: white;
        width: 95%;
        text-align: right;
        height: auto;
        display: block;
    }

        #navbarSupportedContent .navbar-nav li {
            background-color: white;
        }

    #navbarSupportedContent .nav-link:hover {
        background-color: var(--color-brown-bold);
    }

    .dropdown-menu {
        text-align: right;
    }

    .navbar-nav .show {
        background-color: #e5e0c9;
        border: 0;
        text-align: right;
        padding: 0;
    }

    header .dropdown-item:hover {
        background-color: #d0c8a2;
    }

    .dropdown-menu a {
        padding-top: 10px;
        padding-bottom: 10px;
        color: #5b5b5b;
    }

    form {
        margin-top: 0;
    }

    #navbarSupportedContent ul {
        right: 10px;
    }

    .icono-accion-uno {
        width: 25%;
        margin: 0px 4px 0px 0px;
    }

    .icono-accion-dos {
        width: 30%;
        margin: 0px 4px 0px 0px;
    }

    .icono-accion-tres {
        width: 25%;
        margin: 0px 4px 0px 0px;
    }
    .navbar-collapse ul {
        width: 190px;
    }
}
/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {
    .navbar-User .navbar-toggler {
        border: 2px solid var(--color-brown-bold) !important;
        padding-bottom: 6px !important;
        margin-top: 25px;
        padding-top: 4px !important;
        color: var(--color-brown-bold);
    }

    .navbar-toggler:active {
        border: 2px solid var(--color-brown) !important;
        background-color: var(--color-brown);
        color: white;
    }

    .navbar-toggler p {
        display: inline;
        font-size: 13px;
        vertical-align: middle;
        font-weight: bold;
        text-transform: uppercase;
    }

    .navbar-toggler i {
        vertical-align: middle;
    }

    .navbar-toggler:hover {
        border: 2px solid var(--color-orange) !important;
        background-color: var(--color-orange);
        color: var(--color-orange);
        
    }

    #navbarSupportedContent .navbar-nav {
        position: absolute;
        right: 16px;
        bottom: 0;
        top: 70px;
        z-index: 99;
        background-color: white;
        width: 95%;
        text-align: right;
        height: auto;
        display: block;
    }

        #navbarSupportedContent .navbar-nav li {
            background-color: var(--color-brown);
        }

    #navbarSupportedContent .nav-link:hover {
        background-color: var(--color-brown-bold);
    }

    .dropdown-menu {
        text-align: right;
    }

    .navbar-nav .show {
        background-color: #e5e0c9;
        border: 0;
        text-align: right;
        padding: 0;
    }

    header .dropdown-item:hover {
        background-color: #d0c8a2;
    }

    .dropdown-menu a {
        padding-top: 10px;
        padding-bottom: 10px;
        color: #5b5b5b;
    }

    #navbarSupportedContent ul {
        right: 10px;
    }
    .navbar-collapse ul {
        width: 190px;
    }
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .navbar-User .navbar-toggler {
        border: 2px solid var(--color-brown-bold) !important;
        padding-bottom: 6px !important;
        margin-top: 25px;
        padding-top: 4px !important;
        color: var(--color-brown-bold);
    }

    .navbar-toggler:active {
        border: 2px solid var(--color-brown) !important;
        background-color: var(--color-brown);
        color: white;
    }

    .navbar-toggler p {
        display: inline;
        font-size: 13px;
        vertical-align: middle;
        font-weight: bold;
        text-transform: uppercase;
    }

    .navbar-toggler i {
        vertical-align: middle;
    }

    .navbar-toggler:hover {
        border: 2px solid var(--color-orange) !important;
        background-color: var(--color-orange);
        color: var(--color-orange);
    }

    #navbarSupportedContent .navbar-nav {
        position: absolute;
        right: 16px;
        bottom: 0;
        top: 70px;
        z-index: 99;
        background-color: white;
        width: 95%;
        text-align: right;
        height: auto;
        display: block;
    }

        #navbarSupportedContent .navbar-nav li {
            background-color: var(--color-brown);
        }

    #navbarSupportedContent .nav-link:hover {
        background-color: var(--color-brown-bold);
    }

    .dropdown-menu {
        text-align: right;
    }

    .navbar-nav .show {
        background-color: #e5e0c9;
        border: 0;
        text-align: right;
        padding: 0;
    }

    header .dropdown-item:hover {
        background-color: #d0c8a2;
    }

    .dropdown-menu a {
        padding-top: 10px;
        padding-bottom: 10px;
        color: #5b5b5b;
    }
    .navbar-collapse ul {
        width: 190px;
    }
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
}

@media (min-width: 1200px) and (max-width:1311px) {
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
}