/*
    HOJA DE ESTILOS PARA PLANAPP
*/

@import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');


hr.style13 {
    height: 10px;
    border: 0;
    box-shadow: 0 10px 10px -10px #8c8b8b inset;
    margin-bottom: 0px !important;
}

.carouselEvento > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
}

.textoCortado {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


.carouselEvento {
    height: 24rem;
    background-color: transparent !important;
}

.carouselDivEvento {
    margin-top: 40px !important;
}


/* HOJA DE ESTILO PARA LA SELECCION DE REGITRO DE USUARIO */
.divRegistro {
    background-color: #e8e8e8 !important;
    padding: 4rem 2rem;
}

.selectRegistro {
    background-color: white;
    width: 250px;
    height: 250px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}

.tituloRegistro {
    font-size: 22px;
}

.tituloFormulario {
    position: absolute;
    top: 81%;
    left: 5%;
}

.rut-error {
    color: #fff;
    font-weight: bold;
    background-color: red;
    padding: 3px 10px;
    display: inline-block;
    margin-left: 10px;
}


.datepicker {
    background-color: #fefcfc;
    color: #000;
}

.divRegistroCliente {
    background-image: url('Images/Registros/backgroundRegistroCliente.jpeg');
    background-repeat: no-repeat;
    background-position: initial;
    background-size: cover;
}



/* HOJA DE ESTILO PARA LA PAGINA PRINCIPAL DE PROVEEDORES */

/* ESTILOS DE PAGINA DE RESERVA DE SERVICIOS PARA CLIENTES */

.btnServicio {
    float: left;
    left: 940px;
    top: 100px;
    position: absolute;
}


.btnCalificar {
    float: left;
    left: 840px;
    top: 100px;
    position: absolute;
}


.tituloServicio {
    float: left;
    right: 920px;
    top: 50px;
    font-family: 'Quicksand', sans-serif;
    font-size: 30px;
    position: absolute;
}

@media only screen and (min-width:1125px) and (max-width:1180px) {
    .btnServicio {
        float: left;
        left: 790px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:992px) and (max-width:1124px) {
    .btnServicio {
        float: left;
        left: 780px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .btnServicio {
        float: left;
        left: 550px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:556px) and (max-width:767px) {
    .btnServicio {
        float: left;
        left: 370px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:530px) and (max-width:555px) {
    .btnServicio {
        float: left;
        left: 350px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:520px) and (max-width:529px) {
    .btnServicio {
        float: left;
        left: 340px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:495px) and (max-width:519px) {
    .btnServicio {
        float: left;
        left: 320px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:475px) and (max-width:494px) {
    .btnServicio {
        float: left;
        left: 295px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:440px) and (max-width:474px) {
    .btnServicio {
        float: left;
        left: 260px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:420px) and (max-width:439px) {
    .btnServicio {
        float: left;
        left: 240px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:400px) and (max-width:420px) {
    .btnServicio {
        float: left;
        left: 230px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:380px) and (max-width:400px) {
    .btnServicio {
        float: left;
        left: 200px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:360px) and (max-width:379px) {
    .btnServicio {
        float: left;
        left: 190px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:335px) and (max-width:359px) {
    .btnServicio {
        float: left;
        left: 160px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:300px) and (max-width:334px) {
    .btnServicio {
        float: left;
        left: 140px !important;
        top: 100px;
        position: absolute;
    }
}


@media only screen and (min-width:1125px) and (max-width:1180px) {
    .btnCalificar {
        float: left;
        left: 690px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:992px) and (max-width:1124px) {
    .btnCalificar {
        float: left;
        left: 680px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .btnCalificar {
        float: left;
        left: 650px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:556px) and (max-width:767px) {
    .btnCalificar {
        float: left;
        left: 270px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:530px) and (max-width:555px) {
    .btnCalificar {
        float: left;
        left: 250px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:520px) and (max-width:529px) {
    .btnCalificar {
        float: left;
        left: 240px;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:495px) and (max-width:519px) {
    .btnCalificar {
        float: left;
        left: 220px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:475px) and (max-width:494px) {
    .btnCalificar {
        float: left;
        left: 195px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:440px) and (max-width:474px) {
    .btnCalificar {
        float: left;
        left: 160px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:420px) and (max-width:439px) {
    .btnCalificar {
        float: left;
        left: 140px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:400px) and (max-width:420px) {
    .btnCalificar {
        float: left;
        left: 130px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:380px) and (max-width:400px) {
    .btnCalificar {
        float: left;
        left: 100px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:360px) and (max-width:379px) {
    .btnCalificar {
        float: left;
        left: 90px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:335px) and (max-width:359px) {
    .btnCalificar {
        float: left;
        left: 60px !important;
        top: 100px;
        position: absolute;
    }
}

@media only screen and (min-width:300px) and (max-width:334px) {
    .btnCalificar {
        float: left;
        left: 40px !important;
        top: 100px;
        position: absolute;
    }
}