@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800&family=Open+Sans:wght@400;600;700&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*mobile*/
body {
    background-color: #F8F2EF;
}

header {
    background-color: #F8F2EF;
    padding: 1em;
    box-shadow: 0px 0px 10px #707070;
    z-index: 8000;
    position: sticky;
    top: 0;
}

a {
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
}

li {
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
p {
    margin-left: 1em;
    margin-right: 1em;
}

h1,
h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
}

p {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}


footer {
    background-color: #503B93;
    color: #ffffff;
    padding: 1.5em;
    margin-top: 2.5em;
}

footer ul {
    margin-left: 1.4em;
    margin-right: 1.4em;
    margin-top: 3.5em;
}

footer ul li {
    margin-top: 0.5em;
}

footer ul li a {
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
}

/*aca va javascript intercamnbiar con .hamburgesa */
.novisible {
    display: none;
}

.contenedoranav {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0.4em;
}

.logobibliotecasmoviles {
    max-width: 100%;
    width: 8em;
}

#contenedorbibliotecas {
    text-align: center;
}

.lupa {
    display: flex;
    align-items: baseline;
    margin: 0;
    color: #503B93;
}

.buscador {
    background-color: transparent;
    border-style: none;
    outline: none;
    border-bottom: 0.1em solid black;
    height: 1.3em;
    align-items: flex-start;
}

#llamarmenu,
#llamarusuario {
    border: transparent;
    color: #503B93;
    background: transparent;
    cursor: pointer;
    transition: all 0.4s ease-out;
}

#llamarusuario .icono-usuario {
    width: 20px;
    max-width: 100%;
    height: 100%;
}

.lupa img {
    width: 20px;
    max-width: 100%;
    height: 100%;
}

/* aca va javascript intercambiar con .novisible*/
.hamburguesa {
    color: #FC463E;
    transition: all 0.3s ease-out;
    z-index: 9990;
    top: 2.5em;
    right: 1em;
    position: fixed;
}

/* #llamarmenu */
.fondomenu {
    padding: 0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    top: 3.3rem;
    right: 1rem;
    cursor: pointer;
    transition: all 0.3s ease-out;
    position: fixed;
    background-color: rgba(80, 59, 147, 0.6);
    border-radius: 50%;
    z-index: 8000;
}

/*-----icono menu desplegado------*/
.menudesplegado {
    position: relative;
}

.menudesplegado ul {
    position: absolute;
    right: 4rem;
    visibility: visible;
    opacity: 100%;
    transition: all .5s .2s ease;
    display: block;
    width: 150px;
}

.menudesplegado ul li {
    margin-bottom: 2.5em;
    z-index: 9990;
}

.menudesplegado ul li a {
    color: #ffffff;
    font-weight: 800;
    font-size: 20px;
}

.menudesplegado .cruz {
    color: #ffffff;
    z-index: 9990;
    top: 2.7em;
    right: 1em;
    position: fixed;
}

.menudesplegado #llamarmenu {
    position: fixed;
}

.menudesplegado #llamarmenu .fondomenu {
    border-radius: 0;
    width: 200vw;
    height: 200vw;
    top: 0em;
    right: 0em;
    background-color: rgba(80, 59, 147, 0.9);
}

/*-----icono usuario cerrado------*/
#llamarusuario .fondoiconousuario {
    background-color: transparent;
    border-radius: 50%;
    padding: 0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    top: 4.3rem;
    left: 1rem;
    cursor: pointer;
    transition: all 0.3s ease-out;
    position: fixed;
}

/*-----icono usuario desplegado------*/

.usuariodesplegado #llamarusuario .fondoiconousuario {
    border-radius: 0;
    width: 200vw;
    height: 180vw;
    top: 0rem;
    left: 0rem;
    background-color: rgba(248, 245, 255, 0.945);
    z-index: 8000;
    position: absolute;
    top: -6rem;
    left: -2rem;
}

.usuariodesplegado {
    position: relative;
}

.usuariodesplegado .iconocruzvioleta {
    z-index: 9990;
    top: 5em;
    left: 2.5em;
    width: 20px;
    position: fixed;
}

.usuariodesplegado div {
    position: absolute;
    top: 0.5em;
    left: 1.5rem;
    visibility: visible;
    opacity: 100%;
    transition: all .5s .2s ease;
    width: 250px;
    z-index: 8800;
}

.usuariodesplegado div h2 {
    color: #F58551;
    font-weight: 800;
    font-size: 20px;
    margin-bottom: 0.5em;
}

.usuariodesplegado div p {

    font-weight: 700;
    color: #606060;
    font-size: 14px;
}

.usuariodesplegado div figure{
    display: flex;
    justify-content: center;
    margin-top: 1em;
    margin-bottom: 1em;
}

.usuariodesplegado div figure img {
    width: 225px;
    height: 100%;
    max-width: 100%;
}

.usuariodesplegado div ul {
    justify-content: center;
    padding-top: 0.5em;
}

.usuariodesplegado div ul li {
    display: flex;
    margin-bottom: 1em;
    align-items: center;
    justify-content: center;
}

.usuariodesplegado div ul li a {
    color: #503B93;
}

.usuariodesplegado div ul li figure {
    margin: 0em 1em 0em 0em;
}

.usuariodesplegado div ul li figure img {
    width: 40px;
    height: 100%;
    max-width: 100%;
}

/*--------------------------------------------------------------------------------------------------*/
/*-----css index mobile------*/
section h1 {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    color: #503B93;
}

.tapaslibros img {
    width: 150px;
    height: 100%;
    text-align: center;
}

section figure {
    display: flex;
    justify-content: center;
}

section>p:first-of-type {
    font-weight: 700;
    color: #606060;
    margin-bottom: 1em;
    margin-left: 1.5em;
}
.seccionindex h1{
    color: #ffffff;
}
.contenedormeme img {
    width: 365px;
    height: 100%;
    max-width: 100%;
}

.primerpindex {
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 1em;
    margin-left: 1.5em;
}
.contenedoratituloindex div{
    padding: 1em 0em 0.5em 0em;
    margin-bottom: 1em;
}

section h3 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    color: #F58551;
    margin: 0.5em 0 0.3em 1em;
}

section h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #503B93;
    margin-bottom: 0.3em;
}

.contenedorlibro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #ffffff;
    background-position: center;
    margin: 0em 1.5em 2em 1.5em;
}

.contenedorlibro a {
    background-color: #F58551;
    color: #ffffff;
    border-radius: 16px;
    padding: 0.4em 1em;
    margin-bottom: 2em;
}

.contenedorlibro div {
    text-align: center;
    margin-bottom: 1.5em;
}

.contenedorlibro p {
    color: #503B93;
    margin: 0em 1em 1em 1em;
}

.contenedorlibro figure {
    text-align: center;
    padding: 10px;
    background-color: #F58551;
}

.botonvioleta {
    text-align: center;
    margin-bottom: 2em;
    margin-top: 1.5em;
}

.botonvioleta a {
    background-color: #503B93;
    color: #ffffff;
    font-size: 16px;
    padding: 0.4em 1em;
    border-radius: 16px;
}

article h2 {
    margin-bottom: 1em;
    color: #ffffff;
    padding: 0.5em 0em;
}

.tituloh2index {
    background-color: #F58551;
}

.indexarticlep {
    font-weight: 700;
    color: #606060;
    margin: 0em 0em 1em 1.5em;
}

.cajaubicaciones {
    background-color: #ffffff;
    box-shadow: 0px 0px 10px #707070;
}

.contenedorubicacionesindex {
    display: flex;
    justify-content: center;
    margin-bottom: 2em;
}

article h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    color: #606060;
    padding-top: 1.5em;
    margin: 0em 0em 1em 1.5em;
}

.cajaubicaciones ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 1em;
}

.cajaubicaciones ul li {
    margin: 1em;
    justify-content: center;
}

.contenedorubicacion {
    background-color: #ffffff;
    box-shadow: 0px 0px 10px #707070;
    margin: 1em 0em 1em 0em;

}

/*antes era .contenedorubicacion div- y le saque el div para centrar todo el li porque no se centraba la p con toda la caja*/
.contenedorubicacion {
    text-align: center;
}

.contenedorubicacion h3 {
    margin: 0em 0em 1em 0em;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 12px;
    color: #F58551;
}

.contenedorubicacion figure {
    padding: 1.5em 1.2em;
}

.contenedorubicacion figure img {
    width: 100px;
    height: 100%;
}

.contenedorubicacion div p {
    font-size: 10px;
    width: 12em;
    padding: 0em 0em 1em 1.7em;
}

/*cosas de agenda*/

#agenda h1 {
    background-color: #F58551;
    color: white;
    padding: 1em;
    margin: 0;
}

#agenda > h3{
    color: #606060;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 1em;
    margin-left: 1.4em;
}
.n{
    background-color: #F58551;
}

.ubicacionagenda {
    background-color: white;
    margin: 1em 1.5em 1em 1.5em;
    padding: 1em 1em 1.5em 1em;
    text-align: center;
    box-shadow: 0px 0px 10px #707070;
}

.ubicacionagenda img {
    width: 100px;
    height: 100%;
}

.ubicacionagenda p {
    color: #606060;
}

.calendarioh2 {
    background-color: #F58551;
    padding: 0.3em 0 0.3em 1em;
    margin: 0 0 1em 0;
    text-align: left;
}

/*calendario*/
.calendarioprueba{
    width: 18em;
    margin: auto;
    box-shadow: 0px 0px 10px #707070;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}
.margenleft{
    display: flex;
    justify-content: center;
}
.botones{
    position: absolute;
    font-family: monospace;
    font-weight: bold;
    font-size: 33px;
    text-align: center;
    color: rgb(102, 102, 102);
    top: 0.5em;
    cursor: pointer;
}
.botonizquierda{
    right: 25px;
}
.botonderecha{
    right: 48px;
}
.mesesoctnovdic {
    width: 100%;
    margin:auto;
    padding: 0.5em 1.5em 1em 1em;
    background-color: white;
}

.mesesoctnovdic h3{
    margin: 0.8em 0 0.5em 0.3em;
}
.numeroscalendario *:not(.dianombre, .sept, .fechadecine, .fechajornada, .fechataller) {
    color: #503B93;
    background-color: rgba(246, 247, 251, 0);
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    line-height: 3em;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*lista de calendario*/
.numeroscalendario {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

.sept {
    color: #EFEFEF;
    background-color: rgba(246, 247, 251, 0);
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    line-height: 3em;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*fin de grilla*/

.dianombre {
    color: #BDBDBD;
}

.numeroscalendario li {
    margin: 0.2em;
}

.fechadecine {
    background-color: #F58551;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    line-height: 3em;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fechataller {
    background-color: #FFBA42;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    line-height: 3em;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fechajornada {
    background-color: #fc463ecc;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    line-height: 3em;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

#refes{
    display: flex;
    justify-content: space-between;
    margin:2em 2em 2em 2em;
    color: white;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 13px;
}

.naranja {
    background-color: #F58551;
    border-radius: 30px;
    padding: 0.4em;
}

.amarillo {
    background-color: #FFBA42;
    border-radius: 30px;
    padding: 0.4em;
}

.rosa {
    background-color: rgba(252, 70, 62, 0.8);
    border-radius: 30px;
    padding: 0.4em;
}

/*fin calendario*/

.soloh2 {
    background-color: #503B93;
    padding: 1em 1em 1em 1em;
    margin: 2em 0 0 0;
}


#figure article div figure {
    background-color: #F6F7FB;
}


.pelidetalles {
    background-color: #F58551;
    margin:auto;
    padding: 0 0 2em 0;
    width: 80%; 
}

.botoncontamemas {
    text-align: right;
    margin-right: 1em;
}

.botoncontamemas a {
    font-size: 16px;
    color: white;
    background-color: #503B93;
    text-align: center;
    padding: 0.4em 1em;
    border-radius: 16px;
}

.portadapelicula img {
    width: 250px;
    max-width: 100%;
    height: 100%;
    padding-top: 1em;
    padding-bottom: 1em;
}
.mesirve{
    margin: 1em 0 1em 0;
}
.cajaimgtalleres img {
    width: 360px;
    max-width: 100%;
    height: 100%;
}

.pelidetalles h3 {
    color: white;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 24px;
    margin-left: 0.7em;
}
.pelidetallescartelera h3 {
    color: white;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 24px;
    margin-left: 0.45em;
}

.sabado {
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding-left: 0em;
    font-size: 16px;
}
.sabado2{
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding:0;
    margin: 0;
}

.hbold {
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    padding-left: 0em;
}

.hbold2{
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    margin: 0;
    padding: 0;
}
.mesirve h3{
    margin-left:0.8em;
}
/*cartelera*/
.iconovolver {
    margin: 0 0 1em 0.7em;
}
.v {
    background-color: #503B93;
}


.tvioleta h1 {
    font-size: 40px;
    color: white;
    margin: 0;
    padding:0.5em 0 0.5em 0.5em;
}

.tvioleta h2 {
    font-size: 25px;
    padding:0.5em 0 0.5em 0.8em;
    margin: 0;
    color: white;
}

.portada img {
    width: 287px;
    margin-top: 1em;
}
.phomero img{
    width: 360px;
}

.cineh {
    color: white;
    background-color: #503B93;
    margin: 0 1.5em 0 1.5em;
    padding: 0.3em 0 0.3em 0.7em;
}

.listadetalle {
    background-color: #F58551;
    color: white;
    padding: 0.8em 0 0.8em 0.85em;
    margin: 0 1.75em 0 1.75em;
}

.lamary {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 25px;
    margin: 0;
    padding: 0;
}

#textodetalle p{
    max-width: 18em;
    margin: 1em 0 1em 1.7em;
    color: #606060;
}
.hdosdetalle{
    background-color: #503B93;
    color: white;
    padding: 0.8em;
    margin: 0;
}
.contenedormapa img {
    width: 306px;
    max-width: 100%;
    height: 100%;
    margin: 2em 0 2em 0;
}

.fondonaranja{
    background-color: #F58551;
    margin: 0 1.7em 0 1.7em;
    padding-bottom: 0.7em;
}

.phcuatro{
    color: white;
    background-color: #503B93;
    margin: 2.5em 0 0.5em 0;
    padding: 0.3em 0 0.3em 0.7em;
}
.desactivarh h4{
    display: none;
}

.fondonaranja div figure {
    background-color: #F58551;
    padding-top: 2em;
}

.fondonaranja div figure img {
    width: 200px;
    max-width: 100%;
    height: 100%;
    box-shadow: 0px 0px 10px #707070;
}

.hbold3{
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    margin: 0 0 0 0.9em;
    padding: 0;
}
.sabado3{
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding:0;
    margin: 0 0 0 0.9em;
}

#separadas ul li {
    margin-top: 1.2em;
}

/*fin de cosas de cartelera*/

/*footer*/
.cajacontacto {
    display: flex;
    flex-direction: row;
    margin: 0em;
    justify-content: space-between;
    margin-bottom: 1.5em;
}

.contactotipografia {
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
}

.bibliotecastipografia {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
}

.contenedorredessociales img {
    width: 70px;
    height: 100%;
}

#logoacumar {
    width: 180px;
    height: 100%;
    margin-bottom: 2em;
}

/*fin footer*/

/*---------acumar.html------------*/
.seccionacumar .tituloindexh1 {
    background-color: #503B93;
    padding: 0.5em;
}

.seccionacumar h1 {
    color: #ffffff;
}

.seccionacumar figure img {
    width: 360px;
    max-width: 100%;
    height: 100%;
}

.fondoparrafo {
    background-color: #ffffff;
    box-shadow: 0px 0px 10px #707070;
    padding-bottom: 1.5em;
    margin-right: 1.5em;
    margin-left: 1.5em;
}

.fondoparrafo h3 {
    padding-top: 1.5em;
}

.parrafovioleta {
    font-family: 'Open Sans', sans-serif;
    color: #503B93;
    font-weight: 400;
}

#video {
    display: flex;
    justify-content: center;
}

.videoloop {
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    display: flex;
    justify-content: center;
}

section video {
    width: 310px;
    max-width: 100%;
    height: 100%;
}

/*acumar.html*/

/*perfil.html*/
.cajaperfil {
    background-color: #503B93;
    padding-bottom: 1.5em;
    border-bottom-right-radius: 100px;
    border-bottom-left-radius: 100px;
}

.cajaperfil figure {
    background-color: #503B93;
    display: flex;
}

.cajaperfil figure img {
    padding-top: 1em;
    height: 100%;
    width: 200px;
}

.cajaperfil h1 {
    font-family: 'Montserrat', sans-serif;
    color: #F58551;
    font-weight: 800;
    text-align: center;
}

.cajaperfil h2 {
    font-family: 'Montserrat', sans-serif;
    color: #F58551;
    font-weight: 800;
    text-align: center;
    margin-bottom: 1em;
}

.cajaperfil a {
    display: flex;
    justify-content: center;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    padding-top: 2em;
}

.perfilboton {
    margin-bottom: 2em;
    text-align: center;
}

.perfilboton h3 {
    color: #503B93;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    background-color: #ffffff;
    border-radius: 20px;
    padding: 0.2em 2em;
    display: inline;
}

.titulonaranja {
    background-color: #F58551;
}

.titulonaranja h2 {
    margin-top: 2em;
    margin-bottom: 1em;
    color: #ffffff;
    padding: 0.4em 0em;
}

.titulovioleta {
    background-color: #503B93;
}

.titulovioleta h2 {
    margin-top: 2em;
    margin-bottom: 1em;
    color: #ffffff;
    padding: 0.4em 0em;
}

.tipoh5 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #606060;
    padding-bottom: 1.5em;
    text-align: center;
}
.contenedormibiblio h3{
    margin-bottom: 1em;
}
.contenedormibiblio ul li {
    background-color: #ffffff;
    margin-bottom: 2em;
    margin-left: 1em;
    margin-right: 1em;
}

.contenedormibiblio ul li figure {
    background-color: #F6F7FB;
    box-shadow: 0px 0px 10px #707070;
}

.contenedormibiblio ul li figure img {
    width: 170px;
    max-width: 100%;
    height: 100%;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
}

.contenedormibiblio ul li h4 {
    text-align: center;
    color: #503B93;
}

.loselegidos ul li {
    background-color: #ffffff;
    box-shadow: 0px 0px 10px #707070;
    margin: 0 1em 2em 1em;
    padding-bottom: 1em;
}

.loselegidos ul li figure {
    background-color: #F58551;
}

.loselegidos ul li h4 {
    text-align: center;
    color: #503B93;
}

.loselegidos ul li h3 {
    text-align: center;
}

.loselegidos ul li p {
    color: #503B93;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    text-align: center;
}

.loselegidos figure img {
    width: 250px;
    height: 100%;
    max-width: 100%;
    padding-top: 1em;
    padding-bottom: 1em;
}

.cajabotonnaranja {
    margin-top: 1em;
    margin-bottom: 2em;
    text-align: center;
}

.botonnaranja {
    background-color: #F58551;
    color: #ffffff;
    padding: 0.4em 2em;
    border-radius: 16px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
}


/*---------CSS-CATALOGO-----------*/
/*---------filtros visibles-----------*/
.contenedorfiltros {
    background-color: rgba(255, 255, 255, 0.884);
    border-color: #707070;
    position: absolute;
    right: 0em;
}

.contenedorfiltros #titulofiltro h2 {
    font-family: 'Montserrat', sans-serif;
    color: #F58551;
    font-weight: 700;
    margin: 0em 0em 1em 4em;
    padding-top: 2.5em;
}

.contenedorfiltros .cajasdefiltro {
    background-color: #ffffff;
    border-radius: 16px;
    margin: 0em 1.5em 1.5em 5em;
    box-shadow: 0px 0px 10px #707070;
    padding: 1em 1em 1em 0em;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    color: #503B93;
}

.contenedorfiltros .cajasdefiltro input {
    margin: 0em 0.4em 1em 1.7em;
}

.contenedorfiltros .cajasdefiltro .contenidofiltros {
    margin-left: 1.7em;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    color: #503B93;
}

.contenedorfiltros .cajasdefiltro h4 {
    margin-left: 1.5em;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #503B93;
}

/*---------fin filtros visibles-----------*/
.catalogoeiconofiltro {
    display: flex;
    justify-content: space-between;
}

#contenedoriconofiltro {
    z-index: 7000;
}

#botonfiltro {
    background-color: transparent;
    border-color: transparent;
    margin-right: 1.5em;
    cursor: pointer;
    transition: all 0.4s ease-out;
}

#botonfiltro img {
    width: 25px;
    max-width: 100%;
    height: 100%;
    padding-top: 1.5em;
}

#titulocatalogo h1 {
    margin-top: 0.5em;
    margin-left: 0.5em;
    color: #F58551;
    font-size: 30px;
}

.librosfisicosdigitales {
    display: flex;
    justify-content: space-between;
    margin: 0em 1em 2em 1em;
}

#librosseleccionados a {
    border-bottom: solid 0.2em #F58551;
}

.librosfisicosdigitales a {
    font-family: 'Montserrat', sans-serif;
    color: #503B93;
    font-weight: 700;
    font-size: 18px;
}

#librosnoseleccionados a {
    color: #B4A5E3;
}

.cajacatalogolibros ul li {
    background-color: #ffffff;
    margin: 0em 1em 2em 1em;
    box-shadow: 0px 0px 10px #707070;
    text-align: center;
    padding-bottom: 0.2em;
}

.cajacatalogolibros ul li figure {
    background-color: #F6F7FB;
    box-shadow: 0px 0px 10px #707070;
}

.cajacatalogolibros ul li figure img {
    width: 180px;
    max-width: 100%;
    height: 100%;
    padding: 1em 0em 1em 0em;
}

.iconocorazon {
    width: 30px;
    max-width: 100%;
    padding: 1.5em 0em 0.5em 0em;
}

.cajacatalogolibros ul li h4 {
    font-weight: 700;
    font-size: 18px;
}

.cajacatalogolibros ul li h5 {
    padding-bottom: 1em;
}

.botonnaranjacatalogo {
    text-align: center;
    margin-bottom: 2em;
}

.botonnaranjacatalogo a {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: #ffffff;
    align-items: center;
    background-color: #F58551;
    padding: 0.4em 2em;
    border-radius: 20px;
}

.botonespaginascatalogo {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
}

.botonespaginascatalogo {
    text-align: center;
}

.botonactivado {
    background-color: #503B93;
    border-radius: 20px;
    margin-right: 0.5em;
}

.botonactivado a {
    color: #ffffff;
    padding: 0.5em;
}

.botondesactivado {
    background-color: #DBE0F8;
    border-radius: 20px;
    margin-right: 0.5em;
}

.botondesactivado a {
    color: #503B93;
    padding: 0.5em 0.4em;
}

#catalogovermas {
    color: #606060;
}

/*---------CSS-detalle de libro -------*/

.iconovolver img {
    width: 20px;
    max-width: 100%;
    height: 100%;
    padding-top: 1.5em;
    margin-left: 1em;
}

.tapaelcolordelrio {
    margin-top: 1em;
    margin-bottom: 1em;
}

.tapaelcolordelrio img {
    width: 300px;
    max-width: 100%;
    height: 100%;
}

.memededetallelibro img {
    width: 300px;
    max-width: 100%;
    height: 100%;
}

.secciondetallelibro h1 {
    font-size: 30px;
}

.secciondetallelibro h2 {
    margin-left: 1.7em;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 1em;
    color: #F58551;
}

.cuatroestrellas {
    display: block;
    margin-left: 1.7em;
    margin-bottom: 0.5em;
}

.cuatroestrellas img {
    width: 100px;
    max-width: 100%;
    height: 100%;
}

.secciondetallelibro>p:first-of-type {
    color: #606060;
    margin-left: 1.7em;
}

.parrafodetallelibro {
    color: #606060;
    margin-left: 1.7em;
    margin-bottom: 1em;
}

.botondescargar {
    text-align: center;
    margin: 2em 0em 2.5em 0em;
}

.botondescargar a {
    color: #ffffff;
    font-size: 16px;
    background-color: #503B93;
    padding: 0.4em 2em;
    border-radius: 16px;
}

.formulariopedirlibro h3 {
    color: #503B93;
    margin-left: 1.5em;
}

.botonpedirlibro {
    text-align: center;
}

.botonpedirlibro a {
    color: #ffffff;
    font-size: 16px;
    background-color: #503B93;
    padding: 0.4em 2em;
    border-radius: 16px;
}

.cajabuscarubicacionlibro {
    display: flex;
    margin: 1em 2em 2em 1.7em;
    color: #989898
}

.cajabuscarubicacionlibro input:enabled {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 19.5px;
    color: #F58551;
    border: solid 1px #F58551;
    width: 265px;
}

.botonformulariobusqueda img {
    width: 40px;
    max-width: 100%;
    height: 100%;
}

.titulonaranja h2 {
    margin-left: 1.2em;
}

.formularioreseña h4 {
    margin-left: 1.7em;
    color: #606060;
    font-size: 15px;
}

.estrellasgrises {
    display: block;
    margin: 0.5em 0em 0.5em 1.7em;
}

.estrellasgrises img {
    width: 150px;
    max-width: 100%;
    height: 100%;
}

.formularioreseña textarea {
    margin: 1em 0em 0.5em 1.9em;
    width: 310px;
    height: 120px;
    padding: 1em;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #989898;
}

.formularioreseña input {
    background: #F58551;
    color: #ffffff;
    padding: 0.4em 2em;
    border-radius: 20px;
    border: transparent;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

.comentariosusuarios li {
    background-color: #ffffff;
    border-radius: 40px;
    box-shadow: 0px 0px 10px #707070;
    margin: 2em 1.5em 0em 1.5em;
}

.usuarios img {
    padding-top: 2.5em;
    height: 100%;
}

.estrellasusuaria {
    display: block;
    margin: 1em 0em 0em 1em;
}

.estrellasusuaria img {
    width: 150px;
    max-width: 100%;
    height: 100%;
}

.estrellasusuario {
    display: block;
    margin: 1em 0em 0em 1em;
}

.estrellasusuario img {
    width: 85px;
    max-width: 100%;
    height: 100%;
}

.formularioreseña div {
    text-align: center;
}

.comentariosusuarios h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: #F58551;
    margin-left: 1em;
}

.comentariosusuarios p {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #606060;
    font-size: 16px;
    padding-bottom: 2.5em;
}

/*---------ACA EMPIEZA CSS DE PANTALLA INICIAR SESION----------*/
.iniciosesion {
    background-color: #F58551;
}

.doggg {
    width: 245px;
    ;
}

.iniciobody main section {
    display: flex;
    justify-content: center;
}

.perri {
    background-color: #F8F2EF;
    margin: 1em 1.5em 1.5em 1.5em;
    border-radius: 2em;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1em;
}

.iniciobody {
    background-color: #F58551;
}

.figdog {
    background-color: #F8F2EF;
}

.forminicio {
    margin: auto;
}

.inicioh {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: #F58551;
    font-size: 28px;
    margin: auto;
    margin-top: 0.5em;
}

.huno {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: #F58551;
    margin: auto;
    padding-top: 0.5em;
}

.hdos {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: #503B93;
    margin: 0em 1em 0em 2em;
    padding-top: 0em;
}

.casilleroinicio {
    border-color: #503B93;
    border-style: solid;
    outline: none;
    margin: 1em 0 0 0;
    padding: 0.5em;
    width: 18.7em;
    background-color: transparent;
}

.hdos{
    margin: auto;
}

.forminicio div {
    text-align: start;
    margin-top: 1em;
}

.forminicio div a {
    background: #503B93;
    color: #ffffff;
    border: none;
    font-size: 12pt;
    padding: 0.2em 1em 0.2em 1em;
    text-align: center;
    border-radius: 1em;
    font-weight: 700;
}

.perri .material-icons {
    font-weight: 800;
    color: #503B93;
    padding-left: 1em;
    margin-left: auto;
}
/*----------ACA EMPIEZA CSS DE REGISTRATE----------*/
.olvidocontra {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 10pt;
    color: #503B93;
    text-align: start;
    margin-left: auto;
    padding: 1em 0em 1em 0em;
}

.crea {
    padding: 0;
    margin: auto;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: #F58551;
}

/*---------CSSDONALIBRO-----------*/
.btniniciar {
    background: #503B93;
    color: #ffffff;
    border: none;
    font-size: 12pt;
    padding: 0.2em 1em 0.2em 1em;
    text-align: center;
    border-radius: 1em;
    font-weight: 700;
    margin: 1em 0em 0em 0em;
}

.formdona {
    background-color: #F8F2EF;
    margin: 0 0 0 3em;
}

.bak {
    background: #F8F2EF;
}

.bak img {
    width: 360px;
    max-width: 100%;
    height: 100%;
}

.artubicacion {
    margin: 1em;
    padding: 0;
}

.ubicaciondos {
    background-color: #ffffff;
    margin: 1em;
    padding: 0;
    justify-content: center;
    text-align: center;
    box-shadow: 0px 0px 10px #707070;
    width: 280px;
}

.ubicaciondos figure {
    padding-top: 1em;
    padding-bottom: 1em;
}

.padrelista{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.non {
    margin: 0;
    color: #503B93;
}

.modancho {
    width: 100px;
    max-width: 100%;
    height: 100%;
}

.modcolor {
    background-color: #F8F2EF;
}

.donate {
    background-color: #F8F2EF;
}

.secdona {
    background-color: #F8F2EF;
}

.pdos {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding-bottom: 0.5em;
}
/*---------a partir de 450-----------------------*/
@media screen and (min-width: 28em){
    .donate{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .inicioh{
        margin: auto;
    }
    .casilleroinicio {
        margin: 1em 0 0 0;
    }
    .btniniciar{
        margin: 1em 0 0 0;
    }
    .formdona{
        margin: 1em 0 0 0;
    }
    .hdos{
        margin: auto;
    }
    }
/* a partir de los 800px para Tablet*/
@media screen and (min-width: 50em) {
    header {
        padding: 1em 3em;
    }

    footer {
        display: flex;
        justify-content: space-between;
    }

    /* css Menu cerrado para tablet*/
    .hamburguesa {
        right: 2em;
    }

    #llamarmenu .fondomenu {
        right: 2.5rem;
    }

    /* css Menu desplegado para tablet*/
    .menudesplegado #llamarmenu .fondomenu {
        width: 50vw;
        height: 100vw;
    }

    /* css usuario desplegado para Tablet*/
    .usuariodesplegado #llamarusuario .fondoiconousuario {
        width: 45vw;
        left: -4rem;
    }

    .usuariodesplegado .iconocruzvioleta {
        width: 15px;
    }

    .usuariodesplegado div {
        left: 0rem;
    }

    .usuariodesplegado div h2 {
        font-size: 18px;
    }

    .usuariodesplegado div p {
        font-size: 10px;
        margin-left: 2em;
    }
    .usuariodesplegado div figure img{
        width: 210px;
    }
    .usuariodesplegado div ul li figure img {
        width: 25px;

    }

    /* -----------css index para Tablet-----------*/

    .contenedoratituloindex {
        display: flex;
        justify-content: space-between;
        margin-bottom: 2.5em;
    }

    .v {
        background-color: #503B93;
    }
    .contenedoratituloindex div{
        padding: 0em;
        margin-bottom: 0em;
    }
    .tituloindexh1 h1 {
        color: #ffffff;
        margin-top: 2.5em;
    }

    .primerpindex {
        color: #ffffff;
        margin-left: 1.5em;
        margin-right: 1.5em;
    }

    .contenedorememe img {
        width: 600px;
        max-width: 100%;
    }

    .primerulindex {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    article p {
        margin-bottom: 1.5em;
    }

    .cajaubicaciones {
        width: 800px;
    }

    .cajaubicaciones ul {
        margin-bottom: 1.5em;
    }

    .cajaubicaciones ul li {
        justify-content: space-between;
    }

    .contenedorlibro {
        width: 215px;
        justify-content: space-between;
    }

    .contenedorlibro div {
        margin-left: 2em;
        margin-right: 2em;
    }

    .contenedorlibro p {
        font-size: 15px;
    }

    /* ------css catalogo para Tablet------*/
    .seccioncatalogo {
        display: flex;
        justify-content: center;
    }

    #titulocatalogo h1 {
        margin-left: 0em;
    }

    .librosfisicosdigitales {
        margin-left: 1.5em;
        margin-right: 8.2em;
        justify-content: start;
    }

    .librosfisicosdigitales li {
        margin-right: 2em;
    }

    .catalogoeiconofiltro {
        justify-content: start;
        margin-left: 1.5em;
    }

    #botonfiltro {
        display: none;
    }

    .contenedorfiltros {
        display: flex;
        flex-direction: column;
        width: 230px;
        background-color: transparent;
        position: relative;
        right: 1em;
    }

    .contenedorfiltros .cajasdefiltro {
        margin-left: 4em;
        width: 188px;
        font-size: 14px;
        padding: 1em 0em 1em 0em;
    }

    .contenedorfiltros #titulofiltro h2 {
        margin-left: 3em;
    }

    .cajacatalogolibros ul {
        display: flex;
        flex-wrap: wrap;
        margin-left: 0.5em;
    }

    .cajacatalogolibros ul li {
        margin-left: 1em;
        margin-right: 2em;
        width: 225px;
    }

    .titulonaranja h2 {
        margin-left: 1.3em;
    }

    .estrellasgrises {
        margin-top: 1em;
    }

    .estrellasgrises img {
        width: 200px;
    }

    /* -----css detalle libro Tablet-------*/
    .iconovolver img {
        margin-left: 1.5em;
    }

    .secciondetallelibro {
        display: flex;
        justify-content: space-evenly;
    }

    .tapaelcolordelrio {
        margin-bottom: 1.5em;
    }

    .sinopsisyform {
        width: 400px;
    }

    .parrafodetallelibro {
        margin-right: 0em;
    }

    .botondescargar {
        margin-bottom: 3.2em;
    }

    .cajabuscarubicacionlibro {
        justify-content: space-between;
    }

    .cajabuscarubicacionlibro input:enabled {
        width: 350px;
    }

    .formularioreseña textarea {
        width: 92%;
        margin-bottom: 1em;
        font-size: 18px;
    }

    .formularioreseña h4 {
        margin-top: 1em;
        font-size: 20px;
    }

    .estrellasgrises {
        margin-left: 2em;
    }

    .comentariosusuarios {
        display: flex;
        justify-content: space-evenly;
        margin-top: 1.5em;
    }

    .comentariosusuarios li {
        margin: 0em 1.7em 0em 1.7em;
        padding: 0em 0.5em 0em 0.5em;
        width: 340px;
    }

    footer ul {
        justify-content: flex-start;
        margin: 3em 0em 3em 0em;
    }

    .contenedorredessociales img {
        width: 68px;
    }

    /*css tablet perfil*/
    .cajaperfil {
        padding-bottom: 1em;
        border-bottom-right-radius: 200px;
        border-bottom-left-radius: 200px;
    }

    .perfilboton {
        margin-left: 15em;
        margin-right: 15em;
    }

    .loselegidos ul li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 0em;
        margin-right: 4.7em;
        margin-left: 4.7em;
    }

    .loselegidos li div {
        width: 400px;
    }

    .loselegidos figure img {
        padding-left: 1em;
        padding-right: 1em;
    }

    .titulovioleta h2 {
        margin-left: 1.5em;
        font-weight: 800;
    }

    .titulonaranja h2 {
        margin-left: 1.5em;
    }
    .contenedormibiblio h3{
        margin-left: 2em;
    }
    .contenedormibiblio ul {
        justify-content: space-evenly;
        display: flex;
        flex-wrap: wrap;
    }

    .contenedormibiblio ul li {
        width: 270px;
    }

    .loselegidos ul li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 0em;
        margin-right: 4.7em;
        margin-left: 4.7em;
    }

    .loselegidos li div {
        width: 400px;
    }

    .loselegidos figure img {
        padding-left: 1em;
        padding-right: 1em;
    }

    .titulovioleta h2 {
        margin-left: 1.5em;
        font-weight: 800;
    }

    .titulonaranja h2 {
        margin-left: 1.5em;
    }

    /*tablet acumar*/
    .seccionacumar .tituloindexh1 {
        padding: 0em;
    }

    .seccionacumar figure {
        display: flex;
        justify-content: start;
    }

    .seccionacumar figure img {
        width: 500px;
        flex-wrap: wrap;
    }

    .seccionacumar h1 {
        flex-wrap: wrap;
        max-width: 16em;
    }

    #video {
        display: flex;
        justify-content: center;
    }

    section video {
        width: 600px;
    }

    /* ------- CSS jacqui para TABLET -------*/
    .perri {
        display: flex;
        flex-direction: row;
        justify-content: center;
        margin: 0em 3em 0em 3em;
        padding-top: 2.5em;
        margin-top: 2em;
    }

    .perri .material-icons {
        margin-right: 1em;
        padding-left: 0em;
        margin-bottom: auto;
    }

    .doggg {
        width: 16em;
        height: 17em;
    }

    .donate {
        display: flex;
        flex-direction: row;
        justify-content: center;
        margin-right: 3em;
        margin-left: 3em;
    }

    .formdona {
        padding-top: 1.5em;
        width: 300px;
        margin: 0 0 0 3em;
    }

    .bak img {
        width: 300px;
    }

    .secdona {
        margin-top: 1em;
    }

    .padrelista {
        display: flex;
        flex-direction: row;
        margin-left: 0em;
    }

    .olvidocontra {
        margin: auto;
    }

      /*---------------------------------------------
acá va la agenda y cartelera------------------------
----------------------------------------------------*/

.cajaagenda{
    margin: 0.5em 1.8em 3.5em 2em;
}
.cajaagenda ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#agenda > h3{
    margin-left: 3.5em;
}
.cajaagenda ul li{
    width: 43%;
}
.calendarioh2{
    padding: 0.5em 0 0.5em 2.2em;
}

.calendarioprueba{
    width: 36em;
}

.botonizquierda{
    right: 50px;
}
.botonderecha{
    right: 80px;
}

.mesesoctnovdic h3{
    font-size: 25px;
}
.dianombre{
    text-align: left;
}
.numeroscalendario li {
    margin: 0.5em 0 0.5em 0.5em;
    font-size: 19px;
}



#refes{
    justify-content: space-evenly;
    font-size: 18px;
}
.soloh2{
    padding-left: 2.4em;
}
#figure article ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}
#figure article ul li{ /*este es de las peliculas*/
    width: 48%;
}
.mesirve figure{
    background-color: #F6F7FB;
}


.pelidetalles h3 {
    font-size: 24px;
    margin-left: 0.5em;
}
.pelidetalles h5{
    margin-left: 0.7em;
}

/*este es de taller y jornada*/
#figure article div ul li{
    width: 40%;
}
.mesirve h3{
    margin-left: 0.5em;
}


/*cartelera*/
.iconovolver{
    margin-left: 1.8em;
}
.tvioleta{
    max-width: 25em;
}
.dicaprio img{
    margin-left: 10em;
    width: 200px;
}
.portada img, .cineh, .listadetalle{
    width: 690px;
    margin: auto;
}
#textodetalle p{
    max-width: 43em;
    margin: auto;
}
.hdosdetalle{
    margin-top: 2em;
    padding-left: 2.1em;
}
.contenedormapa img{
    width: 43em;
    margin-left: 0.3em;
}
.rotar{
    flex-direction: row-reverse;
    align-items: center;
    background-color: #503B93;
}

.rotar figure img{
    width: 63em;
    margin: 0;
}
.rotar h2{
    font-size: 40px;
    margin-top:0;
    padding-left: 1em;
}
.fondonaranja{
    display: flex;
    flex-wrap: wrap;
    flex-direction:row-reverse;
    justify-content:space-between;
    align-items: center;
    padding-bottom: 1.8em;
    width: 43em;
    margin: auto;
}

.phcuatro{
    display: none;
}
.desactivarh h4{
    font-size: 22px;
    display: block;
    color: white;
    background-color: #503B93;
    width: 31.28em;
    margin:auto;
    padding: 0.3em 0 0.3em 2em;
}

.pelidetallescartelera h3{
    font-size: 37px;
    max-width: 7em;
    margin: 0 0 0 1.1em;
}
.hbold3{
    font-size: 20px;
    margin-left: 2.1em;
}
.sabado3{
    font-size: 18px;
    margin-left: 2.4em;
}

.portadanaranja{
    margin-right: 3em;
}
}

/* a partir de los 1200px para laptops y desktops*/
@media screen and (min-width: 75em) {

    /* css menu header para Desktops*/
    footer {
        padding: 2.5em;
    }

    .logobibliotecasmoviles {
        width: 10em;
    }

    .contenedoranav nav {
        align-self: center;
    }

    .contenedoranav nav ul {
        display: flex;
    }

    .contenedoranav nav ul li {
        margin-left: 3em;
    }

    .contenedoranav nav ul li a {
        color: #FC463E;
        font-weight: 700;
    }

    .lupa {
        width: 300px;
    }

    .buscador {
        width: 250px;
        font-size: 14px;
    }

    .hamburguesa {
        display: none;
    }

    #llamarmenu .fondomenu {
        background-color: transparent;
    }

    /* css usuario desplegado para Desktops*/

    .usuariodesplegado div h2 {
        font-size: 22px;
    }

    .usuariodesplegado #llamarusuario .fondoiconousuario {
        width: 30vw;

    }

    .usuariodesplegado div p {
        font-size: 12px;
    }

    .usuariodesplegado div figure img {
        width: 205px;
    }

    /*-------- css index para desktops----------*/
    .contenedoratituloindex {
        justify-content: center;
        background-color: #503B93;
    }

    .contenedorememe img {
        width: 400px;
    }

    .tituloindexh1 {
        width: 400px;
    }

    .primerpindex {
        font-size: 18px;
        line-height: 1.5em;
    }

    .contenedorlibro {
        width: 315px;
        margin: 0em 2.5em 2em 2.5em;
    }

    .tapaslibros img {
        width: 170px;
    }

    .contenedorlibro div {
        margin-left: 4em;
        margin-right: 4em;
    }

    .tituloh2index h2 {
        margin-left: 1.7em;
    }

    .indexarticlep {
        margin-left: 2.5em;
        margin-right: 2.5em;
        font-size: 17px;
        line-height: 1.5em;
    }

    .cajaubicaciones {
        width: 900px;
    }

    .cajaubicaciones h4 {
        margin: 0em 2.5em 0em 2.5em;
        font-size: 17px;
    }

    .cajaubicaciones ul li {
        width: 170px;
        height: 200px;
    }

    .contenedorubicacion h3 {
        margin: 0em 0.5em 0em 0.5em;
        font-size: 16px;
    }

    /* -------css catalogo --------*/
    .catalogoeiconofiltro {
        margin-left: 7.4em;
    }

    .contenedorfiltros {
        right: 1em;
    }
   
    .contenedorfiltros #titulofiltro h2 {
        margin-left: 4em;
    }

    .contenedorfiltros .cajasdefiltro {
        width: 220px;
        font-size: 18px;
        margin-left: 5em;
    }

    .cajacatalogolibros ul {
        margin-right: 2em;
        justify-content: flex-end;
    }

    .cajacatalogolibros ul li {
        width: 230px;
    }

    .librosfisicosdigitales {
        justify-content: start;
        margin-left: 7.4em;
    }

    .librosfisicosdigitales li {
        margin-right: 3em;
    }

    /* -----css detalle libro para desktops-------*/
    .iconovolver img {
        margin-left: 2.7em;
    }

    .tapalibroymeme {
        width: 500px;
    }

    .sinopsisyform {
        width: 650px;
    }

    .secciondetallelibro {
        margin-left: 2em;
        margin-right: 2em;
    }

    .cajabuscarubicacionlibro input:enabled {
        width: 600px;
    }

    .titulonaranja h2 {
        margin-left: 2.5em;
    }

    .formularioreseña h4 {
        margin-left: 2.8em;
    }

    .estrellasgrises {
        margin-left: 3.2em;
    }

    .formularioreseña textarea {
        margin-left: 3em;
        width: 90%;
    }

    .comentariosusuarios li {
        width: 500px;
    }

    /* css perfil desktop*/
    .cajaperfil {
        border-bottom-right-radius: 500px;
        border-bottom-left-radius: 500px;
        padding-bottom: 0.5em;
    }

    .cajaperfil figure {
        background-color: transparent;
        border-radius: none;
    }

    .perfilboton {
        margin-left: 30em;
        margin-right: 30em;
    }

    .titulonaranja h2 {
        margin-left: 2em;
    }

    .loselegidos ul {
        display: flex;
        flex-wrap: wrap;
    }
    .contenedormibiblio h3{
        margin-left: 2.5em;
    }
    .contenedormibiblio ul {
        justify-content: space-between;
        margin-left: 2em;
        margin-right: 2em;
    }

    .contenedormibiblio ul li {
        width: 300px;
    }

    .titulovioleta h2 {
        margin-left: 2em;
    }


    .loselegidos ul {
        justify-content: space-between;
        margin-left: 1.5em;
        margin-right: 1.5em;
    }

    .loselegidos ul li {
        align-items: center;
        width: 500px;
        margin-left: 2em;
        margin-right: 2em;
    }

    .loselegidos ul li div {
        width: 250px;
    }

    .loselegidos ul li figure {
        width: 400px;
        padding-top: 0.4em;
        padding-bottom: 0.4em;
    }

    .loselegidos ul li figure img {
        width: 300px;
    }


    /*acumar desktop*/
    .seccionacumar figure img {
        width: 600px;
    }

    .videoloop video {
        width: 600px;
    }

    .fondoparrafo {
        margin-left: 2.6em;
        margin-right: 2.6em;
    }

    /* ------- CSS jacqui para Desktop -------*/
    .iniciobody main section {
        display: flex;
        justify-content: center;
    }

    .perri {
        padding: 3em 0em 3em 0em;
        margin: 3em 0em 2em 0em;
        width: 70%;
        border-radius: 2em;
        align-items: center;
    }

    .figdog {
        margin-left: 6em;
    }

    .forminicio {
        width: 45%;
    }

    .forminicio div {
        margin-left: 2.5em;
    }

    .forminicio input[type=submit] {
        margin-left: 6em;
        margin-top: 1em;
    }

    .perri .material-icons {
        align-self: baseline;
    }

    .olvidocontra {
        margin-left: 3em;
    }

    .huno {
        margin: 0em 1em 0em 2.5em;
    }

    .hdos {
        margin: 0.3em 1em 0em 2.5em;
    }

    .inicioh {
        font-size: 28px;
        margin: 0 1em 0 1.3em;
    }

    .casilleroinicio {
        width: 20em;
        margin: 1em 0em 0em 3em;
    }

    .donate {
        margin-top: 5em;
        margin-bottom: 4em;
    }

    .padrelista {
        justify-content: center;
    }

    .formdona {
        padding-left: 2em;
        width: 400px;
    }

    .formdona input[type=submit] {
        margin-left: 2.5em;
        margin-top: 1em;
    }

    .modcolor ul li figure {
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }

    .crea {
        margin: 0em 0em 0em 2.5em;
    }

/*---------------------------------------------
acá va la agenda y cartelera------------------------
----------------------------------------------------*/
.n{
    background-color: #F58551;
}
.cajaagenda{
    margin-left: 2.1em;
    margin-right: 2em;
}

.cajaagenda ul li{
    width: 29%;
    margin-top: 2em;
}

#refes{
    justify-content: center;
}
#refes li{
    margin-left: 1em;
}
#figure article{
    margin-bottom: 2em;
}
#figure article ul li{ /*este es de las peliculas*/
    width: 25%;
}

.pelidetalles h3{
    font-size: 21px;
    padding-left: 0em;
    margin-left: 0.8em;
}
.hbold{
    font-size: 16px;
    padding-left: 0.3em;
}
.sabado{
    font-size: 15px;
    padding-left: 0.4em;
}
.tallerjornada {
    display: flex;
}
.soloh2{
    margin-top: 0;
}
.barra{
    margin-left: 1.4em;
    width: 90%;
}
.barra2{
    margin-left: 1.5em;
    width: 90%;
}

.tallerjornada div ul li{
    width: 50%;
}

.mesirve h3{
    font-size: 20px;
}

/*------cartelera-------*/

.iconovolver a img{
    margin-left: 1.5em;
}
.dicaprio img{
    width: 300px;
}
.portada img{
    width: 1000px;
}
.cineh, .listadetalle{
    width: 100%;
    padding: 0.4em 0 0.4em 1.1em;
    font-size: 35px;
}

.lamary{
    font-size: 45px;
}
.hbold2{
    font-size: 20px;
}
.sabado2{
    font-size: 18px;
}
#textodetalle p{
    margin: 1em 2em 0 2.5em;
    max-width: 77em;
}

#separadas ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin:0 5em 0 0;
}
#separadas ul li{
    width: 42%;
    margin: auto;
}
.fondonaranja{
    margin-bottom: 1em;
    width: 34em;
}
.desactivarh h4{
    width: 100%;
    margin: 0 15em 0 0;
}
.pelidetallescartelera{
   display: flex;
   flex-direction: column;
}
.pelidetallescartelera h3{
    margin-left: 1.5em;
    margin-bottom: 0.5em;
    font-size: 28px;
}
}

/*media query 1800 desktop*/
@media screen and (min-width: 106em) {
    header {
        padding: 1em 5em;
    }

    footer {
        padding: 2.5em 5em
    }

    .lupa {
        width: 700px;
    }

    .usuariodesplegado #llamarusuario .fondoiconousuario {
        left: -6rem;
    }

    /*------Index css -------*/

    .tituloh2index h2 {
        margin-left: 4em;
    }

    .indexarticlep {
        margin-left: 5.5em;
        margin-right: 5em;
    }

    .contenedormeme img{
        width: 400px;
    }

    .cajaubicaciones {
        width: 1000px;
    }
  
    /*------Catalogo css ------*/
    #titulofiltro h2 {
        margin-left: 1.5em;
    }

    .catalogoeiconofiltro {
        margin-left: 9.5em;
    }

    .cajacatalogolibros ul li {
        width: 300px;
    }

    .librosfisicosdigitales {
        margin-left: 9.5em;
    }

    .librosfisicosdigitales li {
        margin-right: 5em;
    }
    
    /*------Detalle Libro css -------*/
    .titulonaranja h2 {
        margin-left: 3.5em;
    }

    .formuldetallelibro {
        display: flex;
    }

    .estrellasgrises {
        margin-left: 5em;
    }

    .formularioreseña {
        width: 37%;
    }

    .formularioreseña textarea {
        width: 550px;
        height: 300px;
        margin-left: 4.5em;
    }

    .formularioreseña h4 {
        margin-left: 4.2em;
    }

    .comentariosusuarios li {
        width: 475px;
    }

    /* desktop acumar*/
    .seccionacumar figure img {
        width: 700px;
        max-width: 100%;
        height: 100%;
    }

    .fondoparrafo {
        margin: 2.5em 5em;
        padding: 2em 5em;

    }

    .fondoparrafo h3 p {
        padding: 1em 5em;
        font-size: 20px;
    }

    #video {
        display: flex;
        justify-content: center;
    }

    section video {
        width: 800px;
        max-width: 100%;
        height: 100%;
    }

    .videoloop {
        margin-top: 1.5em;
        margin-bottom: 1.5em;
    }

    /* desktop perfil*/
    .contenedormibiblio ul {
        display: flex;
        margin-left: 2em;
        margin-right: 2em;
        justify-content: center;
    }
    .contenedormibiblio h3{
        margin-left: 4.5em;
    }
    .contenedormibiblio ul li {
        width: 30%;
    }

    .contenedormibiblio ul li figure img {
        width: 250px;
    }

    .titulonaranja h2 {
        margin-left: 3.5em;
    }

    .titulovioleta h2 {
        margin-left: 2.5em;
    }

    .perri {
        width: 50%;
    }

    .figdog {
        margin-left: 0em;
    }

    /* desktop dona tu libro*/
    .inicioh {
        font-size: 30px;
    }

    .bak img {
        width: 500px;
    }

    .casilleroinicio {
        padding: 1em;
        width: 22em;
    }

    .formdona input[type=submit] {
        margin-left: 2.5em;
        margin-top: 2em;
    }
    .inicioh {
        margin: 0 1em 0 1.3em;
    }

}