/* 
========================================================================================================================== 
        General
========================================================================================================================== 
*/
/* para que quede bonito el back login */
body.view-registration,
body.view-login,
body.view-reset,
body.view-remind {
        background-image: url('../images/bg-image-padel.webp');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-attachment: fixed;
}

.view-login .container .container-inner .row {
        display: flex;
        justify-content: center;
        align-items: center;
}

body.view-login.site #sp-main-body #sp-component {
        background: rgba(255, 255, 255, 0.9) !important;
        border-radius: 16px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        padding: 40px;
        backdrop-filter: blur(6px);
}

/* quitar el passkey */
.btn.btn-secondary.w-100.plg_system_webauthn_login_button {
        display: none;
}

.controls .login .btn.btn-primary {
        width: 100%;
}

/* 
========================================================================================================================== 
        menu
========================================================================================================================== 
*/
/* que cambie el color al bajar */
body.predefined-header2.site header#sp-header.header-sticky {
        background-color: rgb(0 0 0 / 80%) !important;
        position: fixed !important;
}

/* 
========================================================================================================================== 
        PAGINA DE INICIO
========================================================================================================================== 
*/
/* marcos imagen padel */
.padel-img-1 .sppb-img-responsive {
        border: 25px solid #fff;
}

.image-overly .sppb-addon-single-image-container,
.image-overly .sppb-img-container,
.image-overly .sppb-testimonial-carousel-img-wrap {
        background-color: #2181ffa8;
}

/* 
========================================================================================================================== 
        Reservas
========================================================================================================================== 
*/
/* 
========================================================================================================================== 
        Partidos
========================================================================================================================== 
*/
/* 
========================================================================================================================== 
        El club
========================================================================================================================== 
*/
/* menu arriba de otro color */
body.itemid-241.predefined-header2 header#sp-header,
body.itemid-113.predefined-header2 header#sp-header {
        background-color: rgb(0 0 0) !important;
}

/* 
========================================================================================================================== 
        Contacto
========================================================================================================================== 
*/
/* 
========================================================================================================================== 
        Bottom & Footer
========================================================================================================================== 
*/
/* sp-section-5 poner fondo negro */
#sp-section-5 {
        background-color: black;
}

#sp-section-5 .sppb-img-responsive {
        margin: auto;
        display: block;
        width: 70%;
}

/* alinear copy y legal */
#sp-footer #sp-footer2 a {
        color: #fff;
}


/* 
========================================================================================================================== 
        Responsive
========================================================================================================================== 
*/
@media (max-width: 2560px) {}

@media (max-width: 1800px) {}

@media (max-width: 1700px) {}

@media (max-width: 1614px) {}

@media (max-width: 1459px) {}

@media (max-width: 1440px) {}

@media (max-width: 1399px) {}

@media (max-width: 1199px) {
        #sppb-addon-1586955728135 .sppb-addon-content {
                display: flex;
                flex-wrap: wrap;
                justify-content: flex-end;
                gap: 5px;
                margin: 0;
        }

        #sppb-addon-1586955728135 .sppb-btn {
                margin: 0;
                flex: 1 1 auto;
                max-width: 120px;
                font-size: 14px;
                padding: 5px 10px;
                text-align: center;
        }
}

@media (max-width: 1144px) {}

@media (max-width: 1024px) {}

@media (max-width: 991px) {}

@media (max-width: 899px) {}

@media (max-width: 768px) {}

@media (max-width: 767px) {
        #sppb-addon-1586955728135 .sppb-addon-content {
                display: flex;
                flex-wrap: nowrap;
                justify-content: flex-end;
                gap: 5px;
                margin: 0;
        }

        #sppb-addon-1586955728135 .sppb-btn {
                flex: 1 1 auto;
                max-width: 100px;
                font-size: 12px;
                padding: 4px 6px;
                white-space: nowrap;
                text-align: center;
                border: none;
                font-size: 14px !important;
        }

        #sp-header .container {
                display: flex;
                align-items: center;
                justify-content: space-between;
                flex-wrap: nowrap;
        }

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

@media (max-width: 738px) {}

@media (max-width: 698px) {}

@media (max-width: 600px) {}

@media (max-width: 575px) {}

@media (max-width: 550px) {}

@media (max-width: 500px) {}

@media (max-width: 425px) {}

@media (max-width: 375px) {}

@media (max-width: 320px) {}