/*--------------- Base ---------------*/
@font-face {
    font-family: Roboto;
    src: url(Fonts/Roboto-Regular.ttf);
}
@font-face {
    font-family: Roboto;
    src: url(Fonts/Roboto-Bold_1.ttf);
    font-weight: bold;
}
@font-face {
    font-family: Roboto;
    src: url(Fonts/Roboto-Light_1.ttf);
    font-weight: lighter;
}
@font-face {
    font-family: Roboto;
    src: url(Fonts/Roboto-MediumItalic_1.ttf);
    font-style: italic;
}
@font-face {
    font-family: Roboto;
    src: url(Fonts/Roboto-Regular.ttf);
    /*font-style: 300;*/
}

body, button, input, optgroup, select, textarea, p, a{
    font-family: Roboto;
}
body,.bg-okticket{
    background-color: #1E1E1E !important;
    color: white;
    font-family: Roboto;
}
input:-webkit-autofill,
input:-webkit-autofill:focus {
    transition: background-color 600000s 0s, color 600000s 0s;
}
input[data-autocompleted] {
    background-color: transparent !important;
}
.tituloeventoindex{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    /*overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;*/
}

/*------------ Menu -----------------*/
.bg-ok-button{
    background-color: #f2cc30;
    color: #000000;
    border: none;
}
.bg-ok-button-red{
    background-color: #dc5353;
    color: #fff;
    border: none;
}
/*------------- Auth -------------------*/
.input-bg-Okticket{
    background-color: #383737;
    border: none !important;
}
.input-bg-Okticket:focus{
    border-color: #f2cc30;
    --tw-ring-color: #f2cc30;
}
.botonauth{
    text-align: center !important;    
}
.bg-zinc-500{
    background-color: rgb(161 161 170);
}
.mx-8{
    margin-left: 10rem;
    margin-right: 10rem;
}	
.pt-10{
    padding-top: 2.5rem; /* 40px */
    padding-bottom: 2.5rem; /* 40px */
}
.EventImage{
    max-width: 800px;
}

/*----------- Input -----------------*/
.input-bg-left-input{
    background-color: #383737;    
}
.max-w-300{
    max-width: 300px;
}

/*--------Tabla Border --------------*/
.border-Start{
    border: 2px solid #fff !important;
    border-top: 0 !important;
    border-left: 0 !important;    
}
.border-End{
    border: 2px solid #fff !important;
    border-top: 0 !important;
    border-right: 0 !important;    
}


/*-------- index --------------*/
.custom-height {
    height: 13rem; /* Para pantallas pequeñas */
}
.showimgbanner{
    display: block !important;
}.showimgbanner2{
    display: none !important;
}.showimgbanner3{
    display: none !important;
}

/*---------Polityce ---------------*/
.terms {
    width: 100%;
}
@media (min-width: 640px) {
    .custom-height {
        height: 24rem; /* Para pantallas medianas */
    }
    .showimgbanner{
        display: none !important;
    }.showimgbanner2{
        display: block !important;
    }.showimgbanner3{
        display: none !important;
    }
    .terms {
        width: 70%;
    }
}
@media (min-width: 976px) {
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .lg\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .lg\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}
@media (min-width: 1024px) {
    .custom-height {
        height: 32rem; /* Para pantallas grandes */
    }
    .showimgbanner{
        display: none !important;
    }.showimgbanner2{
        display: none !important;
    }.showimgbanner3{
        display: block !important;
    }
}