@import"https://fonts.googleapis.com/css2?family=Comic+Neue:ital,wght@0,400;0,700;1,400;1,700&display=swap";*{box-sizing:border-box;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0}body{background-color:#606a78;color:#d5e4e6;height:100vh}main{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;justify-content:center;padding:20px;position:relative}.background{background-image:url(/img/comic.jpg);background-size:contain;background-position:center;filter:blur(2px);opacity:.5;position:fixed;top:0;width:100%;bottom:0;left:0;z-index:-1}.background.background--superman{background-image:url(/img/background.jpg)}.mt-1{margin-top:5px}.mt-5{margin-top:20px}.mb-1{margin-bottom:5px}.mb-5{margin-bottom:20px}.ml-1{margin-left:5px}.mr-1{margin-right:5px}.pointer{cursor:pointer}.hidden{display:none}.text-danger{color:red}.oculto{display:none}.auth__main{align-items:center;display:flex;height:calc(100vh - 50px);justify-content:center;margin:0;width:100%;position:relative}.auth__box-container{background-color:#fff;box-shadow:0 3px #363636;border-radius:2px;padding:20px;width:250px}.auth__title{color:#33383f;margin-bottom:20px}.auth__input{border:0;border-bottom:1px solid #d8d8d8;color:#363636;font-size:16px;margin-bottom:10px;height:20px;width:100%;transition:border-bottom .3s ease}.auth__input:focus{border-bottom:1px solid #606a78;outline:none}.auth__social-networks{align-items:center;display:flex;justify-content:center;flex-direction:column;padding-top:20px;padding-bottom:20px;width:100%}.auth__alert-error{background-color:red;border-radius:5px;color:#fff;display:flex;justify-content:center;margin-bottom:10px;padding:5px}.background{background-image:url(/img/comic.jpg);background-size:contain;background-position:center;filter:blur(2px);opacity:.5;position:fixed;top:0;width:100%;bottom:0;left:0;z-index:-1}.background.background--superman{background-image:url(/img/background.jpg)}.btn{background-color:transparent;border:none;color:#fff;cursor:pointer;font-size:12px;padding:7px 10px;text-decoration:none;transition:color .3s ease}.btn:focus{outline:none}.btn:hover{color:#e6e6e6}.btn-primary{background-color:#606a78;border-radius:2px}.btn-primary:disabled{background-color:#86909e}.btn-primary:hover{background-color:#3e444e}.btn-success{background-color:#090;border-radius:2px}.btn-success:disabled{background-color:#00e600}.btn-success:hover{background-color:#004d00}.btn-danger{background-color:red;border-radius:2px;transition:background-color .3s ease}.btn-danger:hover{background-color:#c00}.btn-block{width:100%}.btn-new{background-color:#090;text-decoration:none}.btn-icon{color:#606a78}.link{color:#363636;text-decoration:none}.link:hover{text-decoration:underline}.comics-app-navbar{background-color:#49515c;box-shadow:0 3px 2px #33383f;display:flex;align-items:center;justify-content:space-between;height:50px;padding:.5em}.comics-app-navbar .comics-app-navbar__user{box-shadow:none;color:#659af0;font-size:1.3em;font-weight:700;text-transform:uppercase}.comics-app-navbar .comics-app-navbar__links{box-shadow:none}.comics-app-navbar .comics-app-navbar__links .nav-link{color:#d8d8d8;margin:0 10px;padding-left:10px;padding-right:10px;text-decoration:none;text-transform:uppercase}.comics-app-navbar .comics-app-navbar__links .nav-link:hover{font-weight:700}.nothing__main-content{align-items:center;background-color:#606a78;color:#fff;display:flex;flex-direction:column;justify-content:center;height:100vh}.nothing__main-content p{text-align:center}.card{background-color:#d8d8d8;border:1px solid #fff;border-radius:10px;color:#474646;display:flex;flex-direction:column;justify-content:space-between;padding:0;position:relative;width:400px}.card__cabecera{padding:0}.card__cabecera img{border-top-left-radius:10px;border-top-right-radius:10px;position:relative;width:398px}.card__contenido{display:flex;flex-direction:column;justify-content:space-around;gap:5px;padding:5px;position:relative}.card__nombre{font-weight:700;font-size:1.2em;text-align:center;width:100%}.card__editorial{background-color:#fff;color:#000;padding:3px;font-size:1em;margin:.5em auto;text-transform:uppercase;width:100%}.card__autores,.card__formato,.card__estado,.card__info{font-size:.9em;font-style:italic}.card__actions{display:flex;flex-direction:row;justify-content:space-between;margin-top:20px}.card__view-summary{background-color:#363636;border:3px solid #fff;border-radius:50px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:24px;height:30px;width:30px;padding:0;margin:0}.card__view-summary:hover{background:#fff;color:#363636}.card__estado{border-radius:50%;border:3px solid #fff;color:#fff;height:30px;width:30px}.card__estado span{display:none}.card__estado.card__estado--pendiente{background-color:red}.card__estado.card__estado--agregado{background-color:#090}.card__sinopsis{background-color:#fff;display:none;margin:10px auto;position:absolute}.card__sinopsis.show{background:#363636;border-radius:10px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;align-items:center;margin:0 auto;font-family:Comic Neue,cursive;font-size:1.2em;opacity:.95;overflow:auto;padding:1em;height:100%;width:100%;z-index:10}.card__sinopsis .card__sinopsis--close{background:#fff;border:1px solid #fff;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin:0;height:40px;width:40px}.card__sinopsis .card__sinopsis--close:hover{background:#363636}.comic-details{display:flex;align-items:flex-start;flex-direction:row;gap:1em;margin:30px auto}.comic-details .comic-details__sidebar{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:10px}.comic-details .comic-details__sidebar>*{flex:1}.comic-details .comic-details__img{background-color:#e6e6e6;border:1px solid #363636;border-radius:5px;display:flex;align-items:center;justify-content:center;padding:3px;min-width:250px;min-height:400px}.comic-details .comic-details__img img{border-radius:3px;object-fit:fill;width:250px}.comic-details .comic-details__estado{display:flex;align-items:center;flex-direction:column;justify-content:center}.comic-details .comic-details__estado>*{flex:1}.comic-details .comic-details__info{flex:1}.comic-details .comic-details-form__group{display:flex;flex-direction:column;gap:3px;margin-bottom:1em}.comic-details .comic-details-form__group .comic__input,.comic-details .comic-details-form__group .comic__textarea{border:none;border-bottom:1px solid #659af0}.comic-details .comic-details-form__group .comic__input:focus,.comic-details .comic-details-form__group .comic__textarea:focus{outline:none}.comic-details .comic-details-form__group label{color:#696969;font-size:.8em;font-weight:700;text-transform:uppercase}.comic-details .comic-details-form__group input{border:none;padding:3px 5px}.comic-details .comic-details-form__nombre .comic__input{color:#b2b2b2;font-size:1.5em;font-weight:700}.comic-details .comic-details-form__sinopsis .comic__textarea{height:150px}.admin-comics{display:flex;flex-direction:column;gap:5px;margin-top:30px}.admin-comics .admin-comics-comic{border:1px solid #363636;border-radius:3px;display:flex;gap:5px;font-size:12px;padding:3px 5px}.admin-comics .admin-comics-comic:hover{background-color:#f2f2f2}.admin-comics .admin-comics-comic .admin-comics-comic__img img{border-radius:5px;height:100px;object-fit:fill;width:75px}.admin-comics .admin-comics-comic .admin-comics-comic__info{flex:1;display:flex;flex-direction:column;gap:10px}.admin-comics .admin-comics-comic .admin-comics-comic__nombre{font-family:Comic Neue,cursive;font-variant:small-caps;font-size:16px;font-weight:700}.admin-comics .admin-comics-comic .admin-comics-comic__estado{height:15px;background-color:#659af0}.admin-comics .admin-comics-comic .admin-comics-comic__estado.admin-comics-comic__estado--pendiente{background-color:red}.admin-comics .admin-comics-comic .admin-comics-comic__estado.admin-comics-comic__estado--agregado{background-color:#090}.controls{background:#788393;display:flex;justify-content:end;margin:5px auto;padding:5px 10px;width:100%}.page-container{background-color:#fff;border:7px solid black;border-radius:5px;color:#363636;margin-top:30px;min-height:250px;padding:10px;position:relative;width:90%}.page-container .page-container__title{background-color:#f8f397;border:7px solid black;border-radius:5px;display:flex;align-items:center;justify-content:center;min-width:100px;padding:5px 10px;position:absolute;top:-30px;right:10px}.page-container .page-container__title h1{color:#33383f;font-family:Comic Neue,cursive;font-variant:small-caps;font-weight:700}
