/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers:
*/

/*********************************************/
/*****                                   *****/
/*****  Documento CSS                    *****/
/*****                                   *****/
/*****  Fecha: 17/01/2019                *****/
/*****  Autor: Lcda. Dayan Betancourt    *****/
/*****                                   *****/
/*********************************************/
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

/*********************************************/
/*****        Etiquetas Globales         *****/
/*********************************************/
html {
    scroll-behavior: smooth;
}
body {
    background-color: #FFFFFF;
    font-family: 'Roboto', sans-serif;
    font-size: 16px !important;
}

p {
    margin-bottom: 0;
}

hr {
    opacity: 0.2;
    border: 1px solid #898989;
}

.bg-rd{
    background-color: #FE375B!important;
}

.bg-rd-sub{
    background-color: #F4F4F4 !important;
}

.white{
    color: white;!important;
    font-weight: bold;!important;
}

h2 {
color: #000000;
font-weight: bold;
}

.btn_back_home {
    background-color: #f8ae70;
    border-color: #f8ae70;
    color: #FFF !important;
    font-weight: 900;
    display: block
}

.display_body_error{
    display: flex;
    justify-content: center;
    height: 800px;
    align-items: center;
    background-color: #5d3964;
    margin-bottom: 5rem;
    margin-top: 3rem;
}

.shadow {
box-shadow: 2px 2px 5px #999;
}

/*********************************************/
/*****              HEADER               *****/
/*********************************************/

header {
    /*background-color: #7a7a7a52;*/
}


/*********************************************/
/*****               MENU                *****/
/*********************************************/

.venue > h1 {
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
}
.venue > p {
    color: #000;
    margin-bottom: 0;
}

.buttons-category a{
    margin-bottom: .3rem;
}

.navbar-container {
    overflow-x: auto; /* Habilita el desplazamiento horizontal */
    white-space: nowrap; /* Evita que los botones se envuelvan a la siguiente línea */
    width: 100%; /* Establece un ancho para el contenedor */
}

.navbar {
    display: inline-flex; /* Hace que los botones estén en línea */
}

.nav-btn {
    background-color: #555;
    color: white;
    border: none;
    padding: 10px 20px;
    margin: 0 5px;
    cursor: pointer;
}

.nav-btn:hover {
    background-color: #777;
}

#navbar-horizontal {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
}

#menu {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    /*overflow-y: visible;*/
}

#navbar-horizontal a {
    margin: 3px;
    flex: 0 0 100px;
    position: relative;
    white-space: nowrap;
}

#menu a {
    margin: 3px;
    flex: 0 0 100px;
    position: relative;
    white-space: nowrap;
}


    /*********************************************/
/*****              CONTENIDO            *****/
/*********************************************/
section {
    margin: 5px 0px;
}

/*********************************************/
/*****              FOOTER               *****/
/*********************************************/
footer {
    color: black;
    font-size: .8rem;
}

.footer > div > p,a {
    margin-bottom: 0;
    color: #898989;
}


/*********************************************/
/*****           MEDIA QUERIES           *****/
/*********************************************/

@media (min-width: 1400px)  {
    .container-custom {
        max-width: 1320px!important;
        width: 100%;
        padding-right: .75rem;
        padding-left: .75rem;
        margin-right: auto;
        margin-left: auto;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    .container-custom {
        max-width: 1140px !important;
        width: 100%;
        padding-right: .75rem;
        padding-left: .75rem;
        margin-right: auto;
        margin-left: auto;
    }
}


@media (min-width: 992px) and (max-width: 1023px ) {
    .container-custom {
        max-width: 960px !important;
        width: 100%;
        padding-right: .75rem;
        padding-left: .75rem;
        margin-right: auto;
        margin-left: auto;
    }
}


@media (min-width: 768px) and (max-width: 1023px) {

}

@media (min-width: 350px) and (max-width: 767px) {
}

@media (max-width: 349px) {
    .buttons-category {
        display: grid!important;
        gap: .45rem !important;
    }
}