@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");

.enlaces-sin-estilos{
	text-decoration: none;
	color: inherit;

    text-decoration-color: #FDD596;
}

.enlaces-sin-estilos:hover{
	text-decoration: none;
	color: inherit;
    
    text-decoration-color: #FDD596;
}

.box__comicImg {    
	object-fit: cover;
}

.ModalCL-2__image {    
    object-fit: cover;
}

.NumberPage__index:hover { 
    background-color: whitesmoke;
}

.ModalConfirmacion .modal-dialog {
	margin: 15rem auto;
  	width: 500px;
}

.ModalConfirmacion .modal-content {
  	margin: 15rem auto;
  	min-height: 313px;
  	width: 500px;
}

.ModalConfirmacion .modal-body {
  	display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;
  	-webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ModalConfirmacion .modal-title{
		font-family: "yellow";
	    font-size: 26px;
	    font-weight: 400;
	    padding-left: 28px;
	    color: #000;
	    margin-bottom: 0;
    	line-height: 1.5;
	}

.ModalConfirmacion .modal-header h5 {
    padding-left: 0;
}

.ModalConfirmacion .modal-content{
	padding-left: 30px;
	padding-right: 30px;
	border-radius: 10px
}

.ModalConfirmacion .modal-body{
	padding: 0;
}

.ModalConfirmacion .modal-header .close {
   	padding: 1rem 0rem;
   	margin-right: -32px;
}

.ModalConfirmacion .modal-content::after {
	content: url(/static/img/raya-amarilla.svg);
	position: relative;
	height: 30px;
	bottom: -15px;
}

.ModalConfirmacion .close {
	color: #000;
	opacity: 1;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 6px;
}

.ModalConfirmacion__question {
  	font-family: "Roboto", sans-serif;
  	font-size: 18px;
  	font-weight: 600;
}

.ModalConfirmacion__question:hover {
  	cursor: default;
}

.ModalConfirmacion__button-close {
  	width: 150px;
  	height: 50px;
  	font-family: "Roboto", sans-serif;
  	font-weight: 600;
  	font-size: 16px;
  	color: #fff;
  	background-color: #33333c;
  	border: 0px solid transparent;
  	border-radius: 40px;
  	margin-right: 5px;
}

.ModalConfirmacion__button-close:active {
  	-webkit-transform: translateY(1px);
    transform: translateY(1px);
}

.ModalConfirmacion__button-close:focus {
  	background-color: #000;
  	outline: 0px;
}

.ModalConfirmacion__button-save {
  	width: 230px;
  	height: 50px;
  	font-family: "Roboto", sans-serif;
  	font-weight: 600;
  	font-size: 16px;
  	color: #000;
  	background-color: #ff4a50;
  	border: 0px solid transparent;
  	border-radius: 40px;
  	margin-left: 5px;
}

.ModalConfirmacion__button-save:active {
  	-webkit-transform: translateY(1px);
    transform: translateY(1px);
}

.ModalConfirmacion__button-save:focus {
  	background-color: #fd383f;
  	outline: 0px;
}

.ModalConfirmacion .modal-footer{
	border-top: 0px solid transparent;
	padding-bottom: 0px;
	padding-right: 14px;
	margin-bottom: -2px;
	margin-left: auto !important;
}

.ModalConfirmacion .modal-header h5{
	padding-left: 0;
}

.ModalConfirmacion .modal-body{
	padding-left: 0;		
}

/* Inicio - Modal para reportar contenido */
.ModalRT .modal-content {
    border-radius: 16.66px;
    padding-left: 24px;
    padding-right: 18px;
}

.ModalRT .modal .close{
    color: #000;
    font-size: 2.5rem;
}

.ModalRT .modal-header .close{    
    font-weight: 700;
    color: #000;
    opacity: 1;
    font-size: 2.5rem;
    padding-top: 0px;
    padding-right: 0px;
    margin-right: -20px;
    line-height: 1;
}

.ModalRT .modal-dialog{
    margin: 10rem auto;
}

.ModalRT .modal-header {
    padding-top: 20px;
    padding-bottom: 10px;
}

.ModalRT .modal-title {
    font-family: "yellow";
    font-size: 26px;
    font-weight: 400;
    padding-left: 28px;
    color: #000;
    text-transform: uppercase;
}

.ModalRT .modal-body{
    margin-top: 22px;
    margin-bottom: 22px;
    padding-left: 22px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
}

.ModalRT__form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.ModalRT__label {
    padding-left: 22px;
    font-size: 16px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
}

.ModalRT__input {
    width: 630px;
    height: 43.5px;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    padding-left: 23px;
    color: #808080;
    font-family: "Roboto", sans-serif;
}

.ModalRT__input {
    border: 1px solid #CCCCCC;
    color: #808080;
    font-family: "Roboto", sans-serif;
}

.ModalRT__input::placeholder {
    color: #CCCCCC;
}

.ModalRT__input::-webkit-input-placeholder {
    color: #CCCCCC;
}

.ModalRT__textarea {
    margin-top: 20px;
    padding-top: 10px;
    padding-left: 23px;
    width: 630px;
    height: 202.5px;
    color: #808080;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
}

.ModalRT__button-close {
    width: 150px;
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #fff;
    background-color: #33333c;
    border: 0px solid transparent;
    border-radius: 40px;
    margin-right: 5px;
}

.ModalRT__button-save {
    width: 230px;
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #33333c;
    background-color: #fbb71c;
    border: 0px solid transparent;
    border-radius: 40px;
    margin-left: 5px;
}

.ModalRT .modal-footer {
    padding-top: 20px;
    padding-bottom: 0px;    
    margin-left: 20px !important;
    margin-right: 20px !important;
    margin-bottom: 0;
    border-top: 1px solid #dee2e6;
    padding-right: 20px;
}

.ModalRT .modal-footer > *{    
    margin: 0 7px;    
}

@media (min-width: 482px) and (max-height: 800px){
    .ModalRT .modal-dialog, .ModalRT .modal-dialog {
        margin-top: 50px;
    }
}

/* Fin - Modal para reportar contenido */

.ReviewList__media_estrella {
	width: 16px;
    height: 16px;
    background-image: url(/static/img/Objeto/media-amarilla.svg);
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-size: contain;
}

.slide-fade-enter-active {
    transition: all .8s ease;
}

.slide-fade-leave-active {
    transition: all .1s cubic-bezier(1.0, 0.5, 0.8, 1.0);/* Elementos que estan activos antes de la transicion */
}

.slide-fade-enter, .slide-fade-leave-to
    /* .slide-fade-leave-active below version 2.1.8 */ {
    transform: translateX(10px);
    opacity: 0;
}

.List__icon-x:hover, .List__icon-x:active {
    opacity: 1;
    width: 12.5px;
}

.List__icon-x {
  background-color: transparent;
  background-image: url(/static/img/best90sBattle/SVG/X.svg);
  background-repeat: no-repeat;
  position: relative;
  opacity: 0.3;       
  top: -5px;
  border: 0px solid transparent;
  color: #4FA2D2;
  width: 12px;
  height: 12px;
  padding: 0px;
  margin-right: 0px;
  margin-left: 10px; 
}

.ReviewList__estrella_fraccion_1 {
    background-image: url(/static/img/Objeto/estrella_01.svg) !important;
}

.ReviewList__estrella_fraccion_2 {
    background-image: url(/static/img/Objeto/estrella_02.svg) !important;
}

.ReviewList__estrella_fraccion_3 {
    background-image: url(/static/img/Objeto/estrella_03.svg) !important;
}

.ReviewList__estrella_fraccion_4 {
    background-image: url(/static/img/Objeto/estrella_04.svg) !important;
}

.ReviewList__estrella_fraccion_5 {
    background-image: url(/static/img/Objeto/estrella_05.svg) !important;
}

.ReviewList__estrella_fraccion_6 {
    background-image: url(/static/img/Objeto/estrella_06.svg) !important;
}

.ReviewList__estrella_fraccion_7 {
    background-image: url(/static/img/Objeto/estrella_07.svg) !important;
}

.ReviewList__estrella_fraccion_8 {
    background-image: url(/static/img/Objeto/estrella_08.svg) !important;
}

.ReviewList__estrella_fraccion_9 {
    background-image: url(/static/img/Objeto/estrella_09.svg) !important;
}
  
  
  
  /* Agregado el 10-05-2021 */
  
.Body__container {
    background-color: #fff;
    color: #33333c;
    padding-left: 18px;
    padding-bottom: 40px;
    width: 1200px;
}
.NavBar__container {
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #CCCCCC;
}

.NavBar__container .navbar {
    padding: 0px;
}

.NavBar__container .navbar-expand-lg .navbar-nav {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

.NavBar__links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.NavBar__container .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 19.3px;
    padding-left: 19.3px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: "Signika", sans-serif;
    font-size: 15px;
    color: #404040;
}

.NavBar__container .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 19.3px;
    padding-left: 19.3px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: "Signika", sans-serif;
    font-size: 15px;
    color: #404040;
}

.NavBar__container .active {
    color: #4FA2D2 !important;
}

.NavBar__form {
    padding-right: 0px;
    margin-right: -12px;
}

.NavBar__input {
    width: 253px;
    height: 43.6px;
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    border: 1px solid #cccccc;
    border-radius: 8px;
    padding-left: 14px;
}

.NavBar__form .fa-search::before {
    color: #808080;
    font-size: 20px;
    display: block;
    position: relative;
    right: 35px;
}

.NavBar__input:hover, .NavBar__input:active, .NavBar__input:focus {
    border: 1px solid #07b6f0;
    outline: 0px;
}

/*
.dropdown {
    
    padding-top: 9.5px;
    padding-bottom: 18.5px;    
}
*/

.dropdown a {
    color: #808080;
    font-family: "Roboto", sans-serif;
    text-decoration: none;
}

.dropdown-toggle {
    font-size: 16px;
}

.List {
    margin-bottom: 40px;
}

.List .row {
    margin-left: -20.1px;
}

.List .col {
    padding-left: 12px;
    padding-right: 12px;
    height: 175px;
}

.List .card {
    border: 0px solid transparent;
}

.List .card-title {
    font-size: 15px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    color: #000;
    margin-bottom: 3px;


    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.List .card-img-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
    border-radius: 5px;
    -webkit-box-shadow: -16px 14px 10px -11px rgb(122 122 122 / 68%);
    box-shadow: -16px 14px 10px -11px rgb(122 122 122 / 68%);
}

.List .card-comic1 {
    height: 153px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    border-radius: 5px;
    left: 0px;
    z-index: 4;
    background-color: #3f3e3e;
    box-shadow: 2px 3px 5px 0px rgb(0 0 0 / 70%);
    -webkit-box-shadow: 2px 3px 5px 0px rgb(0 0 0 / 70%);
    -moz-box-shadow: 2px 3px 5px 0px rgba(0, 0, 0, 0.7);
}

.card-comic1 {
    display: flex;
}

.List .card-opacity {
    height: 153px;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: 0.8;
    border-radius: 5px;
}        





.NumberPage {
    width: 100%;
}

.NumberPage__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.NumberPage>ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.NumberPage__button {
    margin-right: 11px;
    margin-left: 11px;
    color: #FBB71C;
    font-size: 17px;
    font-family: "Signika", sans-serif;
}

.NumberPage__index {
    width: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 50%;
    font-size: 17px;
    font-family: "Signika", sans-serif;
    color: #000;
}

.NumberPage__active {
    background-color: #FBB71C;
}

.NumberPage__index:hover {
    background-color: whitesmoke;
    cursor: pointer;
    text-decoration: none;
}

.boton_amarrillo {
    
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 9px;
    color: #33333c;
    background-color: #fbb71c;
    border: 0px solid transparent;
    border-radius: 40px;
    padding: 3px 27.76px;
}

.scrollbar::-webkit-scrollbar {
    width: 24px;
    border: none;
    overflow-x: hidden;        
}

/* barra */
.scrollbar::-webkit-scrollbar-thumb {
    background-color: #999999;
    background-clip: padding-box;
    border-left: 6px solid #ffffff;
    border-right: 6px solid #ffffff;
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    border-radius: 8px !important;
}

.scrollbar::-webkit-scrollbar-button:single-button {            
    background-color: white;
    display: block;
    border-style: solid;
    border-color: white;
    height: 13px;
    width: 13px;
    padding: 5;
}

/*
.scrollbar::-webkit-scrollbar-track {
    border: 1px solid #CCCCCC;
}
*/

.scrollbar::-webkit-scrollbar-button:vertical:increment {
    background-image: url(/imagenes/flecha_abajo_scroll.svg);
    background-position: center;
    background-repeat:no-repeat;    
}

.scrollbar::-webkit-scrollbar-button:vertical:decrement {
    background-image: url(/imagenes/flecha_arriba_scroll.svg);
    background-position: center;
    background-repeat:no-repeat;
}

.Button__add {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    top: -50px;
    left: 1040px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 121px;
    height: 40px;
    background-color: #4FA2D2;
    border: 1px solid #4FA2D2;
    border-radius: 5px;
    color: #ffffff;
    font-family: "Signika", sans-serif;
    font-size: 15px;
    font-weight: 500;
}

.Button__add:active, .Button__add:focus {
    background-color: #03b5fc;
    outline: 0px;
}

.boton_azul{
    display: -webkit-box;
    display: -ms-flexbox;            
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    
    background-color: #4FA2D2;
    border: 1px solid #4FA2D2;
    border-radius: 5px;
    color: #ffffff;
    font-family: "Signika", sans-serif;
    font-size: 15px;
    font-weight: 500;
}

.mTop__100 {
    margin-top: 100px;
}

.breadCrumb {
    background-color: #f2f2f2;
}

.breadcrumb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: #e9ecef;
    border-radius: .25rem;
}

.breadCrumb .breadcrumb {
    margin: 0;
    background-color: #f2f2f2;
    padding: .3rem 1rem;
}

.breadcrumb-item {
    display: -ms-flexbox;
    display: flex;
}

.breadCrumb .breadcrumb li {
    font-family: "Signika", sans-serif;
    text-transform: uppercase;
    color: #808080;
    font-size: 14px;
}

.breadCrumb .breadcrumb li a {
    text-decoration: none;
    color: #808080;
}

.backGround {
    width: 100%;
    background-image: url(/static/img/fondo/dadada.svg);
    background-size: 7px 7px;
    background-repeat: repeat space;
}

.Title__titleEstrellaContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 2px solid #E4E4E4;
}

.Title__title {
    font-family: "yellow";
    font-size: 60px;
    font-weight: 400;
    line-height: 55px;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-right: 15px;
}

.Title__subtitle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    padding-top: 9px;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0px;
    margin-top: 0px;
}

.Title__container {
    color: #33333c;
    padding-left: 6px;
    height: 90px;
    padding-top: 25px;
}

.Title__container {
    padding-bottom: 120px;
    padding-right: 20px;
    padding-left: 20px;
}

/*
.container {
    padding-top: 25px;
}
*/

.Padding__L0 {
    padding-left: 0px !important;
}

.dropdown-toggle::after{
    display:none;
}

.dropdown-item {
    display: inline-block;
    width: 85%;
}

.direccion_orden {
    display: contents;
}

img.pre-cargar-imagen{
    opacity: 0;
}

img.pre-cargar-imagen:not(.initial) {
    transition: opacity 0.4s;
}

.pre-cargar-imagen.initial,
.pre-cargar-imagen.loaded,
.pre-cargar-imagen.error {
    opacity: 1;
}  

@media (min-width: 1500px){
    .container {
        background-color: transparent;
        padding-bottom: 36px;
        max-width: 1230px;
    }
}

/* Modal Agregar Lista lectura,critica de comic */
.Modal-Anadir-Lista .modal-dialog {
    min-width: 717px;
    margin: 10rem auto;
}
.Modal-Anadir-Lista .modal-dialog {
    width: 612.79px !important;
    min-width: 612.79px !important;
}

.Modal-Anadir-Lista .modal-content {
    width: 717px;
    padding-left: 24px;
    padding-right: 18px;
    border-radius: 10px;
}

.Modal-Anadir-Lista .modal-content {
    border-radius: 16.66px;
    width: 100%;
    min-height: auto;
}

.Modal-Anadir-Lista .modal-header {
    padding: 11px 10px 0px 10px;
    margin-left: 0;
}

.Modal-Anadir-Lista .modal-title {
    font-family: "yellow";
    font-size: 26px;
    font-weight: 400;
    padding-left: 28px;
    color: #000;
    line-height: 1.5;
    text-transform: uppercase;
}

.Modal-Anadir-Lista .modal-title {
    padding: 0;
}

.Modal-Anadir-Lista.modal .close {
    color: #000;
    opacity: 1;
    font-size: 2.5rem;
    padding-top: 0px;
    padding-right: 0px;
    margin-right: -20px;
    line-height: 1;
    margin-left: auto !important;
}

.Modal-Anadir-Lista .modal-body {
    margin-top: 24.60px;
    padding: 0 11px 0 11px;
    color: #808080;
    display:block;
}

.Modal-Anadir-Lista .anadir-lista-selectores {
    grid-template-columns: 133px 145px 112px 99px;
    display: grid;
    column-gap: 18.75px;
    padding-bottom: 15px;
}

.Modal-Anadir-Lista .selector {
    position: relative;
}

.ModalCL-1__dropdown {
    width: 154px;
    height: 45px;
    padding-left: 20px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    color: #808080;
    font-family: "Roboto", sans-serif;
}

.ModalCL-1__dropdown {
    width: 100%;
    padding: 0 10px;
    border-radius: 5.5px;
}

.Modal-Anadir-Lista .primer-elemento-select {
    color: #a5adad !important;
    opacity: 0.7;
}

.Modal-Anadir-Lista .anadir-lista-selectores .ModalCL-1__dropdown {
    background: url(/imagenes/comic-combo-flecha.svg) no-repeat calc(100% - 11px) white;
    background-size: 16px 9px;
}

.ModalCL-1__dropdown option {
    color: #808080;
    outline: 0px;
    border: 1px solid #CCCCCC;
}

.ModalCL-1__input {
    width: 107px;
    height: 45px;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    padding-left: 20px;
    margin-right: 10px;
    margin-left: 10px;
    color: #808080;
    font-family: "Roboto", sans-serif;
}

.ModalCL-1__input {
    width: 100%;
    margin: 0px;
    padding: 0 10px;
}

.ModalCL-1__checkbox-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 23px;
    padding-top: 28px;
}

.Modal-Anadir-Lista .ModalCL-1__checkbox-container {
    padding: 7px 0;
}

.Modal-Anadir-Lista .Lista_Review__TextArea {
    margin: 0;
    width: 100%;
    height: 143px;
    min-height: 143px;
    border-radius: 5.6px;
    border: 1px solid #D9D9D9;
    padding: 10px;
    font-family: 'Roboto';
}

.Modal-Anadir-Lista .Lista_Review__TextArea {
    font-family: 'Roboto','FontAwesome';
}

.Modal-Anadir-Lista .anadir-lista-fecha-lectura {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
}

.Modal-Anadir-Lista .anadir-lista-fecha-lectura>ul>li>span {
    padding-right: 4px;
}
.ModalCL-1__input {
    width: 107px;
    height: 45px;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    padding-left: 20px;
    margin-right: 10px;
    margin-left: 10px;
    color: #808080;
    font-family: "Roboto", sans-serif;
}

.ModalCL-1__input {
    width: 100%;
    margin: 0px;
    padding: 0 10px;
}

.Modal-Anadir-Lista .anadir-lista-fecha-lectura .ModalCL-1__input {
    width: 42px;
    height: 26px;
    border-radius: 5.5px;
    font-size: 12px;
    text-align: center;
}

.Modal-Anadir-Lista .anadir-lista-comic-campo-anio {
    font-size: 12px !important;
    padding-left: 4px;
    padding-right: 6px;
    text-align: center;
}

.Modal-Anadir-Lista .anadir-lista-checkbox {
    display: flex;
    justify-content: space-between;
    padding-top: 19px;
    padding-bottom: 3px;
}

.Modal-Anadir-Lista .modal-body {
    margin-top: 24.60px;
    padding: 0 11px 0 11px;
    color: #808080;
}

.ModalCL-1__checkbox {
    opacity: 0;
}

.ModalCL-1__checkbox {
    display: contents;
}

.ModalCL-1__checkbox-Label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 15px;
    font-family: "Signika", sans-serif;
}

.ModalCL-1__checkbox-Label {
    font-family: 'Roboto';
    color: #808080 !important;
    font-size: 16px;
}

.ModalCL-1__checkbox-Label {
    font-family: 'Signika';
}

.ModalCL-1__checkbox + label {
    height: 16px;
    line-height: 18px;
    color: #404040;
    padding-left: 19px;
    vertical-align: middle;
    cursor: pointer;
    -webkit-transition: background 300ms ease-in-out, color 300ms ease-in-out;
    transition: background 300ms ease-in-out, color 300ms ease-in-out;
    background-image: url(/static/img/iconos/check-desactivadoChico.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
}

.ModalCL-1__checkbox:checked + label {
    background-image: url(/static/img/iconos/check-activadoChico.png);
    background-repeat: no-repeat;
    color: #4fa2d2;
}

.Modal-Anadir-Lista .ModalCL-1__checkbox + label {
    background-image: url(/imagenes/comic-check-sin-seleccion.svg);
    padding-left: 28px;
    height: 17px;
}

.Modal-Anadir-Lista .ModalCL-1__checkbox:checked + label {
    background-image: url(/imagenes/comic-check-seleccion.svg);
}

.Modal-Anadir-Lista .modal-footer {
    margin: 0 !important;
    padding: 0;
    position: relative;
    height: 22px;
    border-top:1px solid #dee2e6;
}

.Modal-Anadir-Lista .modal-content::after {
    content: url(/static/img/raya-amarilla.svg);
    position: relative;
    height: 30px;
    bottom: -15px;
}

.ModalCL-1__button-save {
    width: 230px;
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #000;
    background-color: #fbb71c;
    border: 0px solid transparent;
    border-radius: 40px;
    margin-left: 5px;
}

.Modal-Anadir-Lista .modal-footer > * {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 7.5px !important;
    margin-right: 7.5px !important;
}

.Modal-Anadir-Lista .ModalCL-1__button-save {
    width: 155.63px;
    height: 43.08px;
    border-radius: 17.63px;
    position: absolute;
    top: 18px;
    right: 26px;
    z-index: 1;
}
/* Fin Modal Agregar Lista lectura,critica de comic */    

[v-cloak] > * { display:none; }
[v-cloak]::before { content: ""; }

.dropdown.newHeader__left__dropdown{
    padding-top: 0px;
    padding-bottom: 0px;
}

.dropdown.newHeader__left__inbox{
    padding-top: 0px;
    padding-bottom: 0px;   
}

.dropdown.web__container{
    padding-top: 0px;
    padding-bottom: 0px;      
}

.puntero_enlace{
    cursor: pointer !important;
}

.puntero_enlace *{
    cursor: pointer !important;
}

/* Estilos para la paginacion */
.NumberPage__button.flecha-doble-izquierda {
    width: 13px;
    margin-top: 2px;
}

.NumberPage__button.flecha-izquierda {
    width: 7.38px;
    margin-top: 2px;
}

.NumberPage__button.flecha-izquierda.der {
    transform: rotateY(180deg);
    margin-bottom: 2px;
}

.NumberPage__button.flecha-doble-izquierda.der {
    transform: rotateY(180deg);
    margin-bottom: 2px;
}
/* Fin Estilos para la paginacion */

.ModalEliminarComentario .modal-dialog {
    margin: 15rem auto;
    width: 500px;
}

.ModalEliminarComentario .modal-content{
    width: 717px;
    padding-left: 24px;
    padding-right: 18px;
    border-radius: 10px;
}

.ModalEliminarComentario .modal-content {
    border-radius: 16.66px;
    width: 100%;
}

.ModalEliminarComentario .modal-content {
    margin: 15rem auto;
    min-height: 313px;
    width: 500px;
}

.ModalEliminarComentario .modal-header {    
    margin-left: 0px;
}    

.ModalEliminarComentario .modal-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ModalEliminarComentario .modal-title {
    font-family: "yellow";
    font-size: 26px;
    font-weight: 400;
    padding-left: 28px;
    color: #000;
    line-height: 1.5;
}
.ModalEliminarComentario .modal-header h5 {
    padding-left: 0;
    padding-top: 0;
}

.ModalEliminarComentario .modal-body {
    padding-left: 0;
}

.ModalEliminarComentario .modal-footer {
    border-top: 0px solid transparent;
    padding-bottom: 0px;
    padding-right: 14px;
    margin-bottom: -2px;
    margin-left: auto !important;
    margin-right: 20px;
}

.ModalEliminarComentario .modal-header {
    padding-top: 20px;
    padding-bottom: 10px;
}

.ModalEliminarComentario .modal-body {
    padding-left: 22px;
    padding-top: 0px;
    margin-top: 44px;
    padding-bottom: 0px;
    padding-right: 0px;
}

.ModalEliminarComentario .modal-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ModalEliminarComentario .modal-body {
    padding-left: 0;
}

.ModalEliminarComentario {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0;
}

.ModalEliminarComentario.modal .close {
    color: #000;
    opacity: 1;
    font-size: 40px;    
    padding-right: 0px;
    margin-right: -16px;
    font-weight:700;
    padding-top: 20px;
}

.ModalEliminar__button-close {
    width: 150px;
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #fff;
    background-color: #33333c;
    border: 0px solid transparent;
    border-radius: 40px;
    margin-right: 5px;
}

.ModalEliminar__button-save {
    width: 230px;
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #000;
    background-color: #ff4a50;
    border: 0px solid transparent;
    border-radius: 40px;
    margin-left: 5px;
}

/* Barra de chat de la parte inferior */
.barra-usuario-chats{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    column-gap: 5px;
    font-family: 'Roboto';
    font-size:13px;
    align-items: flex-end;
    padding: 0 5px;
    height:0;
    z-index: 5;
}
.barra-usuario-chats .chat-usuario{
    width: 340px;
}

.barra-usuario-chats figure{
    margin:0;
}

.barra-usuario-chats .cabecera-chat{
    display: flex;
    padding: 10px 10px;
    background-color: #f5f5f5;
    border-color: #ddd;
    /*min-width: 340px;*/
    justify-content: space-between;
}

.barra-usuario-chats .opciones-ventanas-chat{
    display: flex;
    column-gap: 10px;
}

.chat-usuario .informacion-usuario{
    display: flex;
    column-gap: 10px;
}

.chat-usuario .informacion-usuario figure img{
    width:22px;
    height:22px;
    object-fit: cover;
    border-radius:50%;
}
.chat-usuario .informacion-usuario .nombre-usuario{
    font-weight: bold;
}

.barra-usuario-chats .chat-usuario{
    background-color:white;
    border-color: #ddd;
    padding: 0;
    margin-bottom: 0;
}

.barra-usuario-chats .chat-usuario li{
    list-style: none;
    position: relative;
    /*width: 282px;*/
}

.barra-usuario-chats .mensajes{
    height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid #ddd;
    padding:10px;
   
}

.barra-usuario-chats .mensajes:last-child input,.barra-usuario-chats .mensajes:last-child textarea{
    width: 100%;
    border: 0.6px solid #908D8D;
    border-radius: 4px;
    
    box-shadow: 2px 2px 2px #e4e4e4;
    padding-left: 5px;
    color: #a5adad;                
}

.barra-usuario-chats .contenidos-mensajes{
    display: flex;
    row-gap: 10px;
    flex-direction: column-reverse;
    padding-bottom: 10px;
    overflow: auto;    
    overflow-x: hidden;
    height: inherit;
    padding-left: 0;
}

.contenidos-mensajes .mensaje-usuario ul,.contenidos-mensajes .mensaje-otro-usuario ul{
    display: flex;
    flex-direction: row;
    /*justify-content: space-between;*/
    column-gap:5px;
    padding-left: 0;
}


.contenidos-mensajes .informacion-mensaje{        
    display: flex;
    flex-direction: column;
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 4px;
    border-collapse: 5px;
    padding: 5px;
    max-width: 273px;
}

.contenidos-mensajes .informacion-mensaje span:first-child{
    word-break: break-all;    
}

.contenidos-mensajes .mensaje-otro-usuario{
    text-align: -webkit-right;
    text-align: -moz-right;
}

.contenidos-mensajes .tiempo{
    font-size: 11px;
    color: #C1C1C1;
    
}

.contenedor-mensajes .bi-check2::before{
    vertical-align: -3px;
}

.contenidos-mensajes .mensaje-usuario figure.imagen-usuario img,.contenidos-mensajes .mensaje-otro-usuario figure.imagen-usuario img{
    width:31px;
    height:29px;
    object-fit: cover;
    border-radius: 4px;;
}

.contenedor-mensajes .informacion-mensaje .image {
    max-width: 100%;
    display: block;
    box-sizing: border-box;
}

.contenedor-mensajes .informacion-mensaje .image>img {
    /*
    width: -webkit-fill-available;
    width: -moz-available;
    */
    width: 100px;
}

.area-auto-ajustable{
    max-height: 87px;
    min-height: 16px !important;
    width:100%;
}

.area-auto-ajustable:focus{
    border:1px solid #29acf8 !important;
}

.chat-usuario.tiene-mensajes-nuevos{
    border-top: 3px solid #fbb71c;
    margin-bottom: -3px;
}

.chat-usuario .icono-puntos .dropdown-menu.show{
    max-width: 200px;
}

.chat-usuario .icono-puntos .dropdown-menu.show  .dropdown-item{
    width: 100%;
}

.chat-usuario .icono-puntos .dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #007bff !important;
}

.chat-usuario .mensajes .spinner-border{
    position: absolute;
    right: 5px;
    top: 5px;
}

.barra-usuario-chats .contenidos-mensajes{
    
    margin: 0 -6px;
    padding: 1px 6px;
    
    margin-bottom: 10px;
    height: auto;
}

.barra-usuario-chats .contenedor-mensajes{
    min-width: 318px;
}

.barra-usuario-chats .contenidos-mensajes{
    scrollbar-width: thin;
    scrollbar-color: #33333c white;
}




textarea.area-auto-ajustable{
    resize: none;
}


.contenedor-comentario-usuario{            
    border: 0.6px solid #908D8D;
    border-radius: 4px;
    width: 100%;
    min-height: 26px;
    max-height: 87px;
    overflow-x: auto;
    box-shadow: 2px 2px 2px #e4e4e4;

    color: #a5adad;
}

.contenedor-comentario-usuario>.comentario-usuario {
    display: block;
    width: 100%;
    overflow: hidden;
    resize: none;
    min-height: 24px;
    padding-left: 5px;
    border:none;
    padding-top: 2px;
}

.contenedor-comentario-usuario>.comentario-usuario[contenteditable]:focus {
    /*border: 1px solid #29acf8 !important;*/
    outline: 0px solid transparent;   
}

.contenedor-comentario-usuario:focus-within {
    border: 1px solid #29acf8 !important;
    /*background-color:red;*/
}

.contenedor-comentario-usuario>.comentario-usuario[contenteditable]:empty::before{
    content: "Escribir mensaje";
    color:rgb(117, 117, 117);
}

.barra-usuario-chats .chat-usuario .mensajes li {    
    min-height: 31px;
}

.barra-usuario-chats .contenidos-mensajes .spinner-border.spinner-border-sm{
    position: relative;
}

.barra-usuario-chats .contenidos-mensajes .contenedor-icono-carga{
    display: flex;
    justify-content: center;
    margin: 5px 0;
}

.area-chats-usuario{
    display:none;
}

/* Fin barra de chat de la parte inferior */


/* Para colocar el footer siempre en la parte inferior */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.backGround{
    flex: 1 0 auto;
}

footer{
    flex-shrink: 0;
}
/* Fin: para colocar el footer siempre en la parte inferior */

/* Actualizacion para modales confirmacion en chats */
.ModalEliminar.confirmacion-eliminacion .modal-content {            
    padding-left: 24px;
    padding-right: 18px;
    border-radius: 10px;
}

.ModalEliminar.confirmacion-eliminacion .modal-content {
    border-radius: 16.66px;
    width: 100%;
}

.ModalEliminar.confirmacion-eliminacion .modal-content {
    margin: 15rem auto;
    min-height: 313px;
    width: 500px;
}

.ModalEliminar.confirmacion-eliminacion .modal-header {
    padding-top: 20px;
    padding-bottom: 10px;
}

.ModalEliminar.confirmacion-eliminacion .modal-title {
    font-family: "yellow";
    font-size: 26px;
    font-weight: 400;
    padding-left: 28px;
    color: #000;
}

.ModalEliminar.confirmacion-eliminacion .modal-header h5 {
    padding-left: 0;
}

.ModalEliminar.confirmacion-eliminacion .modal-body {
    padding-left: 22px;
    padding-top: 0px;
    margin-top: 44px;
    padding-bottom: 0px;
    padding-right: 0px;
}

.ModalEliminar.confirmacion-eliminacion .modal-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ModalEliminar.confirmacion-eliminacion .modal-body {
    padding-left: 0;
    margin-top: 0;
}

.ModalEliminar__question {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 600;
}

.ModalEliminar.confirmacion-eliminacion.modal .close {
    color: #000;
    opacity: 1;
    font-size: 2.5rem;
    padding-top: 0px;
    padding-right: 0px;
    margin-right: -20px;
}

.ModalEliminar.confirmacion-eliminacion .modal-footer {
    padding-top: 20px;
    padding-bottom: 0;
    padding-right: 0;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ModalEliminar.confirmacion-eliminacion .modal-footer {
    border-top: 0px solid transparent;
    padding-bottom: 0px;
    padding-right: 14px;
    margin-bottom: -2px;
    margin-left: auto !important;
}

.ModalEliminar.confirmacion-eliminacion .modal-footer > * {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 7.5px !important;
    margin-right: 7.5px !important;
}

.ModalEliminar.confirmacion-eliminacion .modal-content::after {
    content: url(/static/img/raya-amarilla.svg);
    position: relative;
    height: 30px;
    bottom: -15px;
}
/* Fin Actualizacion para modales confirmacion en chats */


/* cajas de errores de campos */
.error-campo{
    border:1px solid #808080;
    border-radius:4px;
    padding: 6.5px 6px 8px 6px;
    font-size: 14px;
    color:#474747;
    box-shadow: 3px 3px 4px #D7D7D7;
    width: max-content;
    display: flex;
    column-gap: 7px;
    align-items: end;
    position: absolute;
    background-color: white;
    left: 10px;
    top: 7px;
    z-index: 1;
    font-family:"Roboto"
}

.error-campo::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 5px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: #808080 transparent;
    display: block;
    width: 0;
}

.error-campo::after {
    content: "";
    position: absolute;
    top: -7px;
    left: 5px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: white transparent;
    display: block;
    width: 0;
}

.error-campo figure{
    width:17px;
    height:17px;
    background-color:#FFA300;
    margin:0;
    color:white;
    border-radius:3px;
    text-align: center;
    font-size: 16px;
}

.contenedor-errores{
    position: relative;
}

.error-campo span{
    line-height: 14px;
}


/* Notificaciones de la cabecera */
.inbox-notificaciones-pie{
    display: flex;
    justify-content: space-between;
    padding: 5px 10px;
    font-family: 'Signika';
    font-size:15px;
    /*position: fixed;*/
    bottom: 0;
    width: 100%;
}

.inbox-containerBox .newHeader__inbox-number{
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%,-50%);
}

.inbox-box .scrollbar {
    background-color: white;
    display: flex;
    flex-direction: column;
}

.inbox-header-container .filtro_activo{
    font-weight:500;
}

.inbox-information .inbox-paragraph.contenido-mensaje-chat{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-all;
}

.inbox-box .newHeader__dropdown-option.inbox-mesaggeBox{
    height:76px;
}

.contenido-inbox-revisado{
    color: #a8b2b2;
    opacity: 0.7;   
}

.inbox-box .inbox-messageTitle{
    position: relative;
}

.inbox-box .indicador-mensaje_nuevo{
    background-color: #4FA2D2;
    color: white;
    min-width: 19px;
    border-radius: 50%;
    min-height: 19px;
    text-align: center;
    font-size: 13px;            
    vertical-align: middle;
    display: table-cell;
    position: absolute;
    top: 0;
    right: -20px;
}

.dropdown-menu.newHeader__dropdown-container.show{
    height: auto;
}


/* Modal para cambio de usuario */
.modal-cambiar-cuenta .buscador-area-1 {
    margin-top: 0;
    padding-left: 0;
    position: relative;
    list-style: none;
}

.modal-cambiar-cuenta .modal-content .contenedor-buscador{
    padding: 0;
    margin-bottom: 0;
}

.modal-cambiar-cuenta .modal-content::after {
    content: url(/static/img/raya-amarilla.svg);
    position: relative;
    height: 30px;
    bottom: -15px;
}

.modal-cambiar-cuenta .buscador-area-1 input {
    width: 100%;
    border: 0.6px solid #908D8D;
    border-radius: 10.5px;
    height: 43.55px;
    box-shadow: 2px 2px 2px #e4e4e4;
    padding-left: 14px;
    color: #a5adad;
    font-size: 15px;
    font-family: 'Signika';
    font-size: 18px;
}

.modal-cambiar-cuenta .buscador-area-1 .icono-buscar {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
}

.modal-cambiar-cuenta .buscador-area-1 input::placeholder {
    color: #D9D9D9;
    opacity: 1;
}

.modal-cambiar-cuenta .modal-title{
    font-family: "yellow";
}

.modal-cambiar-cuenta .modal-title {
    padding-top: 0;
    line-height: 1.5;
    padding-left: 0;
    font-size: 25px;
}

.modal-cambiar-cuenta .modal-header {
    padding-top: 12px;
    padding-left: 4px;
    padding-right: 4px;
}

.modal-cambiar-cuenta .modal-header {
    margin-left: 0px;
}

.modal-cambiar-cuenta .modal-header {
    padding-left: 14px;
    padding-top: 12px;
}

.modal-cambiar-cuenta .modal-header {
    padding-bottom: 10px;
}

.modal-cambiar-cuenta .modal-dialog {
    min-width: 490.27px;
    margin: 10rem auto;
}

.modal-cambiar-cuenta .modal-content {
    min-height: auto;
    width: 490.27px;
    border-radius: 13.5px;
    padding: 0 23px;
}

.modal-cambiar-cuenta .modal-header button {
    font-size: 30px;
    margin-right: -10px;
    line-height: 1;
    padding-top: 4px;            
}        

@media (min-width: 1600px){
    .modal-cambiar-cuenta .modal-dialog {
        max-width: min-content;
    }
}

.modal-cambiar-cuenta .lista-usuarios-like-comentario {
    max-height: 445px;
    overflow: auto;
    margin-top: 8px;
    padding: 0 43px;
    grid-template-columns: 1fr;
    row-gap: 38px;
    display: grid;
    min-height: 220px;
    padding-top: 32px;
    padding-bottom: 32px;
    margin-bottom:0;
}

.modal-cambiar-cuenta .like-usuario-comentario {
    display: grid;
    grid-template-columns: 46px 140px auto;
    column-gap: 10px;
    font-family: 'Roboto';
}

.modal-cambiar-cuenta .imagen-seguidores-siguiendo {
    width: 45.17px;
    height: 45.17px;
    object-fit: cover;
    border-radius: 4.5px;
}

.modal-cambiar-cuenta .informacion-usuario>p:nth-child(1) {
    font-weight: 700;
    color: black;
}

.modal-cambiar-cuenta .informacion-usuario>* {
    margin: 0;
}

.modal-cambiar-cuenta .like-usuario-comentario .seguir {
    border-radius: 10px;
    font-family: 'Roboto';
    width: 143.44px;
    height: 38.82px;
    font-weight: 300;
    font-size: 15px;
    margin-left: auto;
}

.modal-cambiar-cuenta .like-usuario-comentario .seguir {
    border: 1px solid #A3A3A3;
    background-color: white;
    color: black;
    width: 91.58px;
    font-weight: 400;
    box-shadow: 1px 1px darkgrey;
}

.modal-cambiar-cuenta .close {
    color: #000;
    opacity: 1;
    font-size: 2.5rem;
    padding-top: 0px;
    padding-right: 0px;
    margin-right: -20px;
}

.modal-cambiar-cuenta .modal-header{
    border-bottom: none;
}

.texto-tacachado{
    text-decoration: line-through;
    color:#A8B2B2;
}

.mejorar-calidad-imagen{
    -webkit-backface-visibility: hidden;
    -ms-transform: translateZ(0); /* IE 9 */
    -webkit-transform: translateZ(0); /* Chrome, Safari, Opera */
    transform: translateZ(0);
}


/* Ventanas modales y contenidos */
.modal-contenidos-responsive{
    display:none;

    /*position: absolute;*/
    top: 0;
    /*bottom: 0;*/
    left: 0;
    right: 0;
    background-color: #FCFCFC;
    z-index: 1000;

    /*margin-top: 22vw;*/
    padding: 6vw 5vw;

    color:#727272;
    font-size:4.17vw;
    font-family:"Roboto";
    /*height: fit-content;*/
}

.modal-contenidos-responsive input[type=text],.modal-contenidos-responsive input[type=date],.modal-contenidos-responsive input[type=time]{
    height: 10.41vw;
}

.modal-contenidos-responsive .titulo-modal{
    font-family:Yellow;
    color:#33333C;
    font-size:6.04vw;
    min-height: auto;
    line-height: 1;
    text-transform: uppercase;
}

.modal-contenidos-responsive select,.modal-contenidos-responsive input,.modal-contenidos-responsive textarea{
    border:1px solid #EAEAEA;
    border-radius:1vw;
    color:#727272;
}

.modal-contenidos-responsive select{
    color: #C0C5C5;
}

.modal-contenidos-responsive textarea{
    width: 100%;
    height: 25vw;
}

.modal-contenidos-responsive .ocupar-todo-ancho{
    width: 100%;
}

.modal-contenidos-responsive *::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #C0C5C5;
    opacity: 1; /* Firefox */
}

.modal-contenidos-responsive *:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #C0C5C5;
}

.modal-contenidos-responsive *::-ms-input-placeholder { /* Microsoft Edge */
    color: #C0C5C5;
}

.modal-contenidos-responsive  .pie-contenidos-responsive{
    display: flex;
    align-items: center;
    margin-top: 3vw;
    column-gap: 2vw;
}

.modal-contenidos-responsive .botton{
    background-color: #FBB71C;        
    color: white;
    font-weight: 700;
    font-size: 5vw;
    min-height: 11.67vw;
    border-radius: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-contenidos-responsive .contenedor-modal{
    display: flex;
    flex-direction: column;
    row-gap: 6.04vw;
    /*min-height: 67vh;*/
    min-height: calc(100vh - 310px);
}

/* Fin - Ventanas modales y contenidos */

.modal-contenidos-responsive .area-mensajes-error{
    text-align: center;
    color: red;
}

.modal .icono-cerrar-modal{
    display:none;
}

.linea-horizontal{
    content: "";    
    height: 1px;    
    vertical-align: middle;        
    background-color: #D5D5D5;
    width: -webkit-fill-available;
    width: -moz-available;
}

.rotar_180{
    transform: rotate(180deg);
}

.mostrar-solo-responsive{
    display:none !important;
}

.transparencia-fondo-principal{
    background-image: url(/static/img/fondo/dadada.svg);
    background-size: 7px 7px;
    background-repeat: repeat space;
    height: 15px;        
}

.contenido_2_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.contenido_3_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.contenido_4_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.contenido_5_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.contenido_1_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.contenido_11_lineas{
    display: -webkit-box !important;
    -webkit-line-clamp: 11;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.barra-horizontal-degradado{
    height: 9.6px;
    background: rgb(249,248,248);
    background: linear-gradient(180deg, rgba(245,245,245,1) 0%, rgba(255,255,255,1) 100%, rgba(255,255,255,1) 100%);
    width:100%;
}

.siempre-visible{
    display:inline !important;
}

.siempre-ocultar{
    display:none !important;
}

.Modal-Anadir-Lista .modal-footer{
    justify-content: flex-start;
}

.cabecera-area-comentarios{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 115px;
    line-height: 1;
    /*
    height: 50px;
    background-color: #f2f2f2;
    margin-left: -36px;
    padding-left: 20px;
    */
}

.cabecera-area-comentarios .lado-izquierdo-cabecera-area-comentarios{
    /*
    font-size: 18px;
    font-family: "Signika", sans-serif;
    color:black;
    font-weight: 500;
    */
    font-weight: 700;
    font-family: "Roboto";
    font-size: 13px;
    color:#838383;
}

.cabecera-area-comentarios .Comentarios__Checkbox + label{
    font-weight: 700;
    font-family: "Roboto";
    font-size: 13px;
    color:#838383;
}

/* Inicio - Mensajes de advertencia */
.mensaje-advertencia{
    text-align: left;
    word-break: break-word;
}

.informacion-advertencia{
    padding: 0;
    display: flex !important;
    flex-direction: column !important;
    row-gap: 2px;
    margin-top: 12px;
}

.informacion-advertencia .informacion-penalidad{
    list-style: initial;
}

.informacion-advertencia .informacion-penalidad>li{
    list-style: disc;
}

.informacion-advertencia>ul{
    list-style: none;
    padding-left: 20px !important;
    flex-direction: column !important;
}

.informacion-advertencia>ul>li:first-child{
    font-weight: bold;
    list-style: none;
}

.informacion-advertencia>ul>li{
    min-height: auto !important;
}

.informacion-advertencia .informacion-nota{
    margin-top: 20px;
    display: flex !important;
    row-gap: 5px !important;
}

.mensaje-advertencia .mensaje-reconocer-advertencia{
    color: #D86A6A;
    margin-top: 20px;
}

.mensaje-advertencia .boton-reconocer-advertencia{
    background-color: #D86A6A;
    border: none;
    padding: 8px;
    border-radius: 3px;
    margin-bottom: 6px;
}
/* Fin - Mensajes de advertencia */


/* Inicio - Modal de login y registro */
.modal__login{
    z-index: 1050;
}

.modal__login .modal-dialog,.modal__registrar .modal-dialog{
    min-width: inherit;
    margin: auto;
    margin: 0.5rem;
}

.modal__login .modal-content,.modal__registrar .modal-content{
    border-radius: 0.3rem !important;
    width: 100% !important;
    padding:0;
    min-height: auto;
}

.modal__login .modal-body,.modal__registrar .modal-body{
    margin: 0 !important;
}

.modal__login__body{
    padding: 30px 20px !important; 
}

.modal__login.modal .close,.modal__registrar.modal .close {
    margin: 0;
    padding: 0;
    font-size: 0;
}

.modal__login__content::before, .modal__login__content::after, .modal__registrar::before, .modal__registrar::after{
    position: absolute !important;
    content: "" !important;
    width: 8px !important;
    height: 100% !important;
}

#modal_olvidar_contrasena .modal__login__content::before,#modal_olvidar_contrasena .modal__login__content::after{
    width: 6px !important;
}

.modal__login .frm-editar-enviar button[type="submit"],.modal__login .frm-restablecer-contrasena button[type="submit"],.modal__registrar .frm-editar-registrar-modal button[type="submit"]{
    position: relative;
}

.modal__login .frm-editar-enviar button[type="submit"] .spinner-border-sm,.modal__login .frm-restablecer-contrasena button[type="submit"] .spinner-border-sm,.modal__registrar .frm-editar-registrar-modal button[type="submit"] .spinner-border-sm{
    position: absolute;
    left: 25px;
    top: 12px;
    display: none;
}
/* Fin - Modal de login */

.ocultar-scroll::-webkit-scrollbar {
    display:none;
}

.ocultar-scroll{
    scrollbar-width: none;
}


.formulario-agregar-encuesta .respuesta-opcion{
    display: flex;
    align-items: baseline;
}

.formulario-agregar-encuesta .preguntas-encuestas{
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}

.formulario-agregar-encuesta .elemento-pregunta>*{
    padding: 0;
}

.formulario-agregar-encuesta .modal-body{
    padding: 10px 8px;
}

.formulario-agregar-encuesta .modal-body>div{
    display: flex;
    row-gap: 10px;
}

.formulario-agregar-encuesta .opcion-eliminar{
    background-color: red;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: white;
    line-height: 1.4;
    font-size: 13px;
    cursor: pointer;
}

.formulario-agregar-encuesta .preguntas{
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    margin-bottom: 10px;
}

.formulario-agregar-encuesta .elemento-pregunta .opciones-pregunta{
    display: flex;
    align-items: center;
    flex-direction: row;
    column-gap: 20px;
    justify-content: flex-end;
}

.formulario-agregar-encuesta .cabecera-respuestas-pregunta{
    margin-top: 10px;
}

.opciones-pregunta .opcion-pregunta{
    cursor: pointer;
}
/* Fin - Modal para creacion de encuestas*/

/* Botones de vetanas modales */
.botones-modales{
    height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 600;
    font-size: 16px;
    min-width: 150px;
    width: auto;
    padding: 0 15px !important;
    border: 0px solid transparent;
    border-radius: 40px;
    cursor: pointer;
    border:none !important;

    color: #33333c !important;
    background-color: #fbb71c !important;        
}

.botones-modales:hover{
    color: #fff !important;
    background-color: #33333c !important;
}

.botones-modales.boton-cancelar{
    color: #fff !important;
    background-color: #33333c !important;
}

.botones-modales.boton-cancelar:hover{
    color: #33333c !important;
    background-color: #fbb71c !important;
}
/* FIN - Botones de vetanas modales */

/* Boton compartir con facebook */
#fb-share-button {
    background: #3b5998;
    border-radius: 30px;
    font-weight: 600;
    padding: 5px 12px;    
    position: static;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: white;
    cursor:pointer;
}

#fb-share-button:hover {
    cursor: pointer;
    background: #213A6F
}

#fb-share-button svg {
    width: 18px;
    fill: white;
    vertical-align: middle;
    border-radius: 2px
}

#fb-share-button span {
    vertical-align: middle;
    color: white;
    font-size: 14px;
    padding: 0 3px
}

#fb-share-button label{
    margin:0;
}

#fb-share-button *{
    cursor:pointer;
}
/* Fin - Boton compartir con facebook */

/* Inicio - Modal compartir contenido con redes sociales */
#compartir-contenido .modal-content{
    min-height:auto;
}
#compartir-contenido .contenedor-elementos{
    width: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    padding: 15px 0;
}

#compartir-contenido .lista-redes-compartir{
    font-size: 50px;
    display: flex;
    flex-direction: row;
    column-gap: 15px;
}

#compartir-contenido .contenedor-url-compartir{
    padding: 10px 10px 10px 10px;
    border: 1px solid #dee2e6;
    border-radius: 5px;
    display: flex;
    column-gap: 12px;
}

#compartir-contenido .contenedor-url-compartir input{
    width: 100%;
    border: none;
}

#compartir-contenido .contenedor-url-compartir .boton-copiar{
    font-family: 'Roboto';
    border: none;
    padding: 3px 10px;
    font-size: 12px;
    cursor: pointer;
}

#compartir-contenido .lista-redes-compartir>*{
    cursor:pointer;
}

.contenido-comentario .opcion-compartir{
    cursor:pointer;
}

.iconos_debajo_imagen_personaje .estrella_personal_personaje:hover{
    background-image: url(/static/img/Objeto/SVG/icono_favorito.svg);
}

.iconos_debajo_imagen_personaje .odio_personal_personaje:hover{
    background-image: url(/static/img/Objeto/SVG/icono_odio.svg);
}

.estrella_debajo_imagen_personaje_sin_color:hover{
    background-image: url(/static/img/Objeto/SVG/icono_favorito.svg);
}

.odio_debajo_imagen_personaje_sin_color:hover{
    background-image: url(/static/img/Objeto/SVG/icono_odio.svg);
}

/* Inicio - Modal compartir contenido con redes sociales */

/* Inicio - Para que se muestre mensajes de errorr en los formularios */
.elemento-formulario{
    position: relative;
}

.elemento-formulario .errores-elemento-formulario{
    background: black;
    border-radius: 0 5px 5px 5px;
    font-family: Roboto;
    font-size: 12px;
    padding: 5px 12px;
    position: absolute;
    display: flex;
    flex-direction: column;
    top: 0;
    left: calc(100% + 13px);
    width: max-content;
    align-items: baseline;
    color:white;
}

.elemento-formulario .errores-elemento-formulario::after {
    content: "";
    position: absolute;
    top: 0;
    left: -10px;
    border-width: 0 10px 10px 0;
    border-style: solid;
    border-color: black transparent;
    display: block;
    width: 0;
    transform: rotate(180deg);
}

.total-mensajes-error{
    color: white;
    background: black;
    font-family: Roboto;
    position: absolute;
    right: 0;
    border-radius: 5px;
    left: 0;
    top: calc(100% + 16vw );
    flex-direction: column;
    font-size: 2.5vw;
    padding: 1.5vw;
}
/* Fin - Para que se muestre mensajes de errorr en los formularios */

/*Modal reporte general*/
.ModalReporteGeneral .modal-dialog{
    min-width: 717px;
    max-width:auto;
}

.ModalReporteGeneral .modal-content::after {
    content: url(/static/img/raya-amarilla.svg);
    position: relative;
    height: 30px;
    bottom: -15px;
}
/*Fin - Modal reporte general*/

/* Inicio elemento checkbox */
.elemento-checkbox{
    opacity: 0;
}

.elemento-checkbox + label{
    background-image: url(/static/img/fondo/no-selecionado.svg);
    background-repeat: no-repeat;
    height: 16px;
    line-height: 18px;
    padding-left: 19px;
}

.elemento-checkbox:checked + label {
    background-image: url(/static/img/fondo/selecionado.svg);
    background-repeat: no-repeat;        
}
/* Fin elemento checkbox */

.elemento-menu-responsive{
    display: flex;
    column-gap: 5px;
}

.elemento-menu-responsive .numeral-menu-responsive{
    margin: 0;
    background: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    display:none;
}

.contenedor-notificaciones-responsive{
    display: flex;
    flex-direction: column;
    row-gap: 12px;
}

.contenedor-notificaciones-responsive .contenedor-modal{
    font-family: Roboto;
    font-size: 13px;
}

.contenedor-notificaciones-responsive .tab-selector-contenidos{
    display: flex;
    column-gap: 12px;
}

.contenedor-notificaciones-responsive .notificacion{
    display: flex;
    column-gap: 8px;
    font-size: 13px;
    border-top: 1px solid #ECEEF0;
    /*border-bottom: 1px solid #808080;*/
    padding: 12px 0;
}

.contenedor-notificaciones-responsive .notificacion .informacion-notificacion{
    display: flex;
    flex-direction: column;
    width: 100%;
}

.contenedor-notificaciones-responsive .notificacion .nombre-usuario-notificacion{
    color: #4FA2D2;
}

.contenedor-notificaciones-responsive .notificacion .imagen-usuario-notificacion{
    width: 50px;
}

.contenedor-notificaciones-responsive .notificacion .cabecera-notificacion{
    display: flex;
    justify-content: space-between;
}

.contenedor-notificaciones-responsive .contenedor-modal{
    min-height: auto;
}

.contenedor-notificaciones-responsive .contenidos-notificaciones{
    min-height: calc(100vh - 250px);
    /*row-gap: 2.5vw;*/
    display: flex;
    flex-direction: column;
}

.contenidos-notificaciones>:last-child{
    border-bottom: 1px solid #ECEEF0;
}

.tab-selector-contenidos .selector-contenido{
    padding: 1vw;
}

.tab-selector-contenidos .selector-contenido.activo{
    background-color: #4FA2D2;
    color: white;
    border-radius: 4px;
}

.contenedor-notificaciones-responsive .sin-notificaciones{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 65vh;
}

.contenedor-notificaciones-responsive .titulo-modal{
    display: flex;
    justify-content: space-between;
}

.toast-container--fade {
    z-index: 10000 !important;
}

.elemento-linkeable,.elemento-linkeable *{
    cursor: pointer;
}

.hover-imagenes:hover {
    filter: brightness(0.75);
}

.rotar_180{
    transform: rotate(180deg);
}



/*Boton agregar contenido a lista*/
.contenedor-principal-botones-agregar-lista:hover .imagen-contenido{
    filter: brightness(0.75);
}

.contenedor-principal-botones-agregar-lista:hover .boton-agregar-comic-lista{
    display:inline;
}

.contenedor-boton-agregar-contenido{        
    position:relative;
}

.contenedor-boton-agregar-contenido .boton-agregar-comic-lista{
    left: 10%;
    display: inline;
    top: 40%;
    position: absolute;
    display: none;
}

.boton-agregar-comic-lista .boton-agregar-lista {
    height: 36px;
    border: 3px solid white;
    border-radius: 16px;
    color: black;
    text-align: center;
    background-color: white;
    width: 92px;
    font-weight: 700;
    padding-top: 2px;
    text-decoration: none !important;
}

.boton-agregar-comic-lista .boton-agregar-lista:hover {
    background-color: black;
    color: white;
}

.boton-agregar-comic-lista .boton-agregar-lista:before {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 33px;
    border-width: 13px 13px 0;
    border-style: solid;
    border-color: white transparent;
    display: block;
    width: 0;
    border-left-width: 20px;
    border-right-width: 6px;
}

.boton-agregar-comic-lista .boton-agregar-lista:after {
    content: "";
    position: absolute;
    bottom: -5px;
    /* bottom: -8px; */
    /* left: 38px; */
    left: 39px;
    border-width: 8px 8px 0;
    border-style: solid;
    border-color: #fff transparent;
    display: block;
    width: 0;
    border-left-width: 12px;
    border-right-width: 4px;
}

.boton-agregar-comic-lista .boton-agregar-lista:hover:after {
    border-color: black transparent;
}

.sombra-boton-agregar-comic {
    box-shadow: 0px 5px rgb(11, 168, 219);
}

.boton-agregar-lista.sombra-boton-agregar-comic {
    background-color: white !important;
    color: black !important;
}

.boton-agregar-lista.sombra-boton-agregar-comic::before {
    bottom: -15px;
    border-color: #0BA8DB transparent;
}    

.boton-agregar-lista.sombra-boton-agregar-comic::after {
    bottom: -8px;
    border-color: white transparent !important;
}
/*Fin boton agregar contenido a lista*/

/*Lista de proveedores de datos*/
.lista-fuentes-datos{
    font-family: Signika;
    font-size: 14px;
    display: flex;
    column-gap: 5px;
    margin: 5px 26px -5px 26px;
}

.lista-fuentes-datos .elemento-fuente{
    font-weight: 300;
}
/*Fin - Lista de proveedores de datos*/

.contenido-distorsionado{
    filter: blur(10px);
}

.mensaje-contenido-oculto-sin-login{
    position: absolute;
    background-color: white;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 18px;
    border: 1px solid black;
    font-family: 'Roboto';
    font-weight: 600;
}

@media (min-width: 481px) and (max-width: 990px){
    .modal-contenidos-responsive .botton.cerrar {
        width: 100%;
        background-color: black;
        color: white;
        font-size: 25px;
        height: 70px;
        min-height: auto;
    }
}

@media (max-width: 481px){
    .mensaje-contenido-oculto-sin-login{
        border-radius: 1vw;
        font-size: 3.75vw;
        padding: 3vw 6vw;
    }

    .lista-fuentes-datos {
        margin: 0 2.5vw;
        font-size: 2.917vw;            
        column-gap: 1vw;
    }

    .mostrar-solo-responsive{
        display: inherit !important;
    }

    .Title__container{
        width: auto !important;
        position: relative !important;
        height: 29.58vw !important;
        padding-bottom: 25vw !important; 
        padding-top: 4.58vw !important;
    }

    .ModalEliminar .ModalEliminar__button-close{
        width: 36.67vw;
        min-height: 9.375vw;
    }

    .modal .icono-cerrar-modal{            
        display: inline;
        position: absolute;
        right: 0;
        width: 3.75vw;
    }

    .ModalEliminar .modal-footer,.ModalEliminarComentario .modal-footer{
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        flex-direction: row;
        column-gap: 4vw;
    }

    .ModalEliminar .modal-footer button,.ModalEliminarComentario .modal-footer button{
        width: 36.67vw;
        min-height: 9.375vw;
        font-size: 4.17vw;
        height: auto;
    }

    .ModalEliminar .modal-content,.ModalEliminarComentario .modal-content{
        margin: auto 6vw !important;
        width: max-content !important;
        padding: 7.5vw 5.21vw 6.04vw 5.21vw !important;
        border-radius:2.29vw !important;
        min-height: auto !important;
    }

    .ModalEliminar .modal-header,.ModalEliminarComentario .modal-header{
        padding:0;
        position:relative;
    }

    .ModalEliminar .modal-header h5,.ModalEliminarComentario .modal-header h5{
        line-height: 1;
        margin-bottom: 5vw;
        font-size:5.83vw;
    }

    .ModalEliminar .modal-footer>*,.ModalEliminarComentario .modal-footer>*{
        margin:0 !important;
    }
    .ModalEliminar.modal .close,.ModalEliminarComentario.modal .close{
        position: absolute;
        right: 0;
        width: 3.75vw;            
        padding: 0;
        margin: 0;
        top: -2.5vw;
        display:none;
    }

    .ModalEliminar .modal-content::after,.ModalEliminarComentario .modal-content::after{
        display:none;
    }

    .ModalEliminar .modal-body,.ModalEliminarComentario .modal-body{
        max-width: fit-content;
        flex: none;
        margin: 8vw 0;
        min-height: 10vw;
        align-items: flex-start !important;
    }

    .ModalEliminar .ModalEliminar__question,.ModalEliminarComentario .ModalEliminar__question{
        font-size: 4.16vw !important;
        margin-bottom:0;
        width: 77vw;
        word-break: inherit;
    }

    .ModalEliminar .ModalConfirmacion__question{
        font-size: 4.16vw !important;
        width: 77vw;
    }

    .ModalEliminar .modal-dialog{
        margin: 45vw auto !important;
    }

    .ModalEliminarComentario .modal-dialog{
        margin: 45vw auto !important;
    }


    .modal-contenidos-responsive input{
        width:100%;
    }

    .modal-contenidos-responsive input[type='checkbox']{
        width:auto;
    }
    

    .resultado-busqueda-contenido-responsive{
        position: absolute;
        left: 0;
        right: 0;
        display: flex;
        flex-direction: column;
        background-color:#FCFCFC;
        border-radius:1.77vw;
        z-index:1;
        border:1px solid #EAEAEA;
        padding:0 3.33vw;
        font-family: Signika;
        font-size: 3.125vw;
        color: #AAAAAA;
    }

    .resultado-busqueda-contenido-responsive .elemento-busqueda-contenido-responsive{
        display: flex;
        flex-direction: row;
        column-gap: 2.71vw;
        padding: 3.54vw 0;
        border-bottom: 1px solid #EAEAEA;
    }

    .elemento-busqueda-contenido-responsive .imagen-contenido-resultado{
        width: 11.875vw;
    }

    .elemento-busqueda-contenido-responsive .imagen-contenido-resultado img{
        width: inherit;
        height: 17.71vw;
        object-fit: cover;
    }

    .elemento-busqueda-contenido-responsive .informacion-resultado-contenido{
        width: -webkit-fill-available;
        width: -moz-available;
        margin-top: -1vw;
    }

    .informacion-resultado-contenido .cabecera-informacion-resultado-contenido{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        border-bottom: 1px solid #F4C33F;
    }

    .resultado-busqueda-contenido-responsive .elemento-busqueda-contenido-responsive:last-child{
        border-bottom:none;
    }

    .cabecera-informacion-resultado-contenido .titulo-contenido{
        font-size: 3.75vw;
        font-weight: 500;
        color: #33333C;
    }

    .modal-contenidos-responsive .contenidos-seleccionados-buscador{
        display: flex;
        flex-direction: column;
        padding-left: 1.25vw;
        margin-top: -2.5vw;
    }

    .contenidos-seleccionados-buscador .elemento-contenido-seleccionado-buscador{
        display: flex;
        flex-direction: row;
        column-gap: 2.29vw;
        padding: 4.58vw 0;
        border-bottom: 1px solid #AAAAAA;
    }

    .contenidos-seleccionados-buscador .elemento-contenido-seleccionado-buscador:last-child{
        border-bottom: none;
    }

    .elemento-contenido-seleccionado-buscador .imagen-contenido-seleccionado{
        width: 22.71vw;
    }

    .elemento-contenido-seleccionado-buscador .imagen-contenido-seleccionado img{
        width: 22.71vw;
        height: 33.54vw;
        object-fit: cover;
    }

    .elemento-contenido-seleccionado-buscador .informacion-comentario-contenido-seleccionado{
        display: flex;
        flex-direction: column;
        font-family: Signika;
        color: #AAAAAA;
        font-size: 3.125vw;
        width: -webkit-fill-available;
        width: -moz-available;
        margin-top: -1.2vw;
        position: relative;
    }

    .informacion-comentario-contenido-seleccionado .icono-eliminar-contenido-seleccionado{
        width: 2.29vw;
        position: absolute;
        top: 1.2vw;
        right: 0;
    }

    .contenidos-seleccionados-buscador .elemento-contenido-seleccionado-buscador textarea{
        height:17.5vw;
        padding: 1vw 2vw;
        margin: 0;
    }

    .informacion-comentario-contenido-seleccionado .titulo-contenido-seleccionado{
        font-size:3.75vw;
        font-weight: 500;
        color: #33333C;
    }

    .informacion-comentario-contenido-seleccionado .area-comentario-contenido-seleccionado{
        margin-top: 1.7vw;
    }

    .modal-contenidos-responsive .botton {
        background-color: #FBB71C;
        color: white;
        font-weight: 700;
        font-size: 5vw;
        min-height: 11.67vw;
        border-radius: 2.5vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .modal-contenidos-responsive .botton.agregar {
        width: 100%;
    }

    .modal-contenidos-responsive .botton.cerrar {
        width: 100%;
        background-color: black;
        color: white;
    }

    
    .agregar-recomendacion-responsive .area-busqueda-recomendaciones{
        display: flex;
        flex-direction: column;
        row-gap: 2.5vw;
        margin-top: 7vw;
    }

    .area-busqueda-recomendaciones .entrada-busqueda-recomendacion input{
        height:7.92vw;
        color:#C0C5C5;
        font-size:3.33vw;
        padding:0 2.08vw;
    }

    .area-busqueda-recomendaciones .area-entrada-resultados{
        position:relative;
    }

    .area-busqueda-recomendaciones .titulo-area-busqueda{
        font-size:3.54vw;
        font-weight: bold;
    }


    /* vista para agregar lista */
    .vista-agregar-lista-comic-responsive .contenedor-modal{
        column-gap: 6.67vw;
    }

    .vista-agregar-lista-comic-responsive .grupo-entrada-lista{
        display: flex;
        flex-direction: column;
        row-gap: 2.5vw;
    }

    .vista-agregar-lista-comic-responsive .titulo-agregar-lista{
        font-size:3.54vw;
        color:#7A7A7A;
        font-weight:bold;
    }

    .vista-agregar-lista-comic-responsive{
        font-size:3.33vw;
        color:#C0C5C5;
    }

    .vista-agregar-lista-comic-responsive input,.vista-agregar-lista-comic-responsive select{
        height:7.92vw !important;
        padding:0 2.5vw !important;
        width:100%;
    }

    .vista-agregar-lista-comic-responsive .contenedor-modal{
        margin-top: 7vw;
    }

    .vista-agregar-lista-comic-responsive textarea{
        padding:2.5vw !important;
        height:20vw;
    }

    .vista-agregar-lista-comic-responsive .lista-privacidad{
        display: flex;
        flex-direction: row;
    }

    .vista-agregar-lista-comic-responsive .lista-privacidad>*{
        width: 21vw;
        height: 8vw;
        border: 1px solid #EAEAEA;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .vista-agregar-lista-comic-responsive .lista-privacidad>*:first-child{
        border-radius:1.77vw 0 0 1.77vw;
    }

    .vista-agregar-lista-comic-responsive .lista-privacidad>*:last-child{
        border-radius:0 1.77vw 1.77vw 0;
    }

    .vista-agregar-lista-comic-responsive .lista-privacidad .tipo-privacidad-seleccionado{
        background-color: #EAEAEA;
        color: #848484;
    }

    .vista-agregar-lista-comic-responsive .area-buscador-contenido{
        position:relative;
    }

    .vista-agregar-lista-comic-responsive .informacion-resultado-seleccionado{
        display: flex;
        flex-direction: row;
        column-gap: 2.08vw;
    }

    .vista-agregar-lista-comic-responsive .informacion-resultado-seleccionado img{
        width:16.875vw;
        height:24.79vw;
    }

    .vista-agregar-lista-comic-responsive .resultado-seleccionado{
        display: flex;
        flex-direction: column;
        row-gap: 2.5vw;
        border-top: 1px solid #EAEAEA;
        
        padding: 2.29vw 0 2.5vw 0;
    }

    .vista-agregar-lista-comic-responsive .resultado-seleccionado:last-child{
        border-bottom: 1px solid #EAEAEA;
    }

    .vista-agregar-lista-comic-responsive .titulo-resultados-seleccionado{
        font-size: 3.33vw;
        color: #7A7A7A;
    }

    .informacion-resultado-seleccionado .informacion-resultado{
        display: flex;
        flex-direction: column;
        line-height: 1;
        row-gap: 1.5vw;
        font-size: 2.92vw;
        color: #7A7A7A;
        padding-top: 3vw;
    }

    .informacion-resultado .titulo-informacion{
        font-size:3.54vw;
        font-weight: bold;
        padding-bottom: 1vw;
    }

    .vista-agregar-lista-comic-responsive .resultado-seleccionado textarea{
        border-radius: 1.77vw;
        padding: 1.5vw 2.29vw !important;
    }
    /* Fin vista para agregar lista */


    /* buscador cabecera, todo el ancho */
    .cabecera-contenido-responsive {
        margin-bottom: 10px;
        padding: 1.45vw 7.08vw;
        display: flex !important;
        flex-direction: row;
        justify-content: space-between;
        width: 100vw;            
        position: relative;
        background-color: white;
        margin-left: -2.6vw;
    }

    .cabecera-contenido-responsive input {
        width: 81.45vw;
        border: 1px solid #DBDBDB;
        border-radius: 1.67vw;
        height: 6.875vw;
        font-size: 3.125vw;
        color: #DBDBDB;
        padding: 0 7.29vw;
        font-family: Roboto;
    }

    .cabecera-contenido-responsive input::-webkit-input-placeholder{
        color:#DBDBDB;
    }

    .cabecera-contenido-responsive .icono-opciones-filtrado {
        width: 3.33vw;
    }

    .cabecera-contenido-responsive .icono-lupa-buscador {
        width: 2.92vw;
        position: absolute;
        top: 3.5vw;
        left: 9.5vw;
    }

    .vista-filtros .contenedor-modal {
        font-size: 4.375vw !important;
        font-family: Roboto !important;
        color: #A0A0A0 !important;
        row-gap: 0 !important;
        margin-top: -2vw;
    }

    .vista-filtros .elemento-filtro {
        min-height: 9.17vw;
        border-bottom: 1px solid #DBDBDB;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0 4.16vw;
    }

    .vista-filtros input[type="radio"] {
        width: auto;
    }

    .vista-filtros .elemento-filtro:last-child {
        border-bottom: none;
    }
    /* fin - buscador cabecera, todo el ancho */


    /* menu cabecera contenidos responsive */
    .cabecera-menu-perfil{
        display: flex !important;
        font-weight: bold;
        background-color: #F7F7F7;
        height: 7.08vw;
        align-items: center;
        padding: 0 1.45vw;
        column-gap: 3.33vw;
        font-size: 2.71vw;
        font-family: Roboto;
        margin-bottom: 2.92vw;
    }

    .cabecera-menu-perfil>li {
        position: relative;
    }
    .cabecera-menu-perfil>li::after {
        content: '|';
        position: absolute;
        top: -0.1vw;
        right: -1.67vw;
    }

    .cabecera-menu-perfil>li:last-child::after{
        display:none;
    }
    /* Fin - menu cabecera contenidos responsive */

    /* Menu lateral derecho */
    .menu-lateral-derecha{
        position: fixed;
        height: 100vh;
        background-color: #F9F9F9;
        top: 68px;
        right: 0;
        bottom: 300px;
        z-index: 1;
        width: 73vw;
        display: flex;
        flex-direction: column;
        font-family: Roboto;
        font-size: 3.95vw;
        color: #9D9D9D;
        z-index: 1000;
    }

    .menu-lateral-derecha>li {
        min-height: 11.25vw;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #E9E9E9;
        padding: 0 4.79vw;
        justify-content: space-between;
    }

    .menu-lateral-derecha li:last-child{
        border-bottom:none;
    }

    .menu-lateral-derecha .titulo-opciones-ordenamiento {
        font-weight: bold;
        font-size: 3.96vw;
        color: #777777;
    }

    .capa-transparente {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #EBEBEB;
        display: inline;
        opacity: 0.6;
    }
    /* Fin Menu lateral derecho */

    .ocultar-scroll-responsive::-webkit-scrollbar {
        display:none;
    }

    .botones-cabecera.mostrar-solo-responsive {
        display: inline;
        position: absolute;
        top: -25px;
        right: 3.95vw;
    }

    .botones-cabecera .boton-cabecera {
        background-color: #4FA2D2;
        font-family: 'Roboto';
        font-weight: bold;
        color: white;
        font-size: 11px;
        min-width: max-content;
        min-height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 19px;
        border-radius: 4.8px;
        line-height: 1;
    }

    /* Inicio Ventana que se muestra en forma parcial en la pagina */
    .opciones-ordenamiento{
        position: fixed;
        height: 100vh;
        background-color: #F9F9F9;
        top: 68px;
        right: 0;
        bottom: 300px;
        z-index: 1;
        width: 73vw;
        display: flex;
        flex-direction: column;
        font-family: Roboto;
        font-size: 3.95vw;
        color:#9D9D9D;
    }

    .opciones-ordenamiento>li{
        min-height: 11.25vw;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #E9E9E9;
        padding: 0 4.79vw;
        justify-content: space-between;
    }

    .opciones-ordenamiento .titulo-opciones-ordenamiento{
        font-weight: bold;
        font-size: 3.96vw;
        color:#777777;
    }

    .opciones-ordenamiento .icono-direccion-orden{
        width:4.58vw;
    }

    .opciones-ordenamiento .titulo-opciones-ordenamiento {
        font-weight: bold;
        font-size: 3.96vw;
        color: #777777;
    }

    .opciones-ordenamiento .icono-direccion-orden {
        width: 4.58vw;
    }
    /* Fin - Inicio Ventana que se muestra en forma parcial en la pagina */

    /* Modal reponsive para ver mas listas */
    .vista-lista-ver-mas.modal-contenidos-responsive {
        padding-top: 5.2vw;
    }

    .vista-lista-ver-mas.modal-contenidos-responsive .elemento-siguiendo-seguidor {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        font-family: Roboto;
        padding: 2.08vw 0;
        border-bottom: 1px solid #DBDBDB;
    }

    .vista-lista-ver-mas.modal-contenidos-responsive .informacion-siguiendo-seguidor {
        display: flex;
        flex-direction: row;
        column-gap: 2.08vw;
    }

    .vista-lista-ver-mas.modal-contenidos-responsive .informacion-siguiendo-seguidor img {
        height: 10.21vw;
        width: 10.21vw;
        object-fit: cover;
    }

    .vista-lista-ver-mas.modal-contenidos-responsive .lista-siguiendo-seguidores .elemento-siguiendo-seguidor:last-child {
        border-bottom: none;
    }
    /* Fin - Modal reponsive para ver mas listas */


    /*  Modal responsive para agregar comic a lista */
    .agregar-comic-lista-responsive{            
        display: flex;
        flex-direction: column;
        row-gap: 4.6vw;
    }

    .agregar-comic-lista-responsive>*{
        width:100%;
        min-height: 10.41vw;
    }

    .agregar-comic-lista-responsive select{
        width:100%;
        height:10.41vw;
    }

    .agregar-comic-lista-responsive .agregar-comic-lista-capitulo-volumen{
        display: flex;
        column-gap: 3.33vw;
    }

    .agregar-comic-lista-responsive .agregar-comic-lista-capitulo-volumen input{
        width:100%;
        height:10.41vw;
    }

    .agregar-comic-lista-responsive .check-agregar-fecha-lectura{
        margin-top: -7vw;
    }

    .agregar-comic-lista-responsive .fechas-lectura-comic{
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: auto;
    }
    /* Fin - Modal responsive para agregar comic a lista */

    .cabecera-area-comentarios{
        margin-left: 0;
        background-color: #F9F9F9;
        height: 8.33vw;
        padding: 0 2.5vw;
    }

    .cabecera-area-comentarios .lado-izquierdo-cabecera-area-comentarios{
        font-size: 3.33vw;
        line-height: 1;
    }

    .cabecera-area-comentarios .Comentarios__Checkbox-Label {
        font-size: 3.33vw;
        line-height: 1;
        margin: 0;
    }

    .ocultar-responsive{
        display:none !important;
    }

    #Modal__SinSeleccionarForo .modal-content{
        width: 88vw !important;
    }

    .agregar-comic-lista-responsive .fecha_recomendacion{
        display: flex;
    }

    .fecha_recomendacion input[type="text"]{
        text-align:center;
    }

    .modal__login,.modal__registrar{
        z-index: 10500 !important;
    }

    .ModalReport {
        z-index: 1041 !important;
    }

    /* Reponsive para encuestas */
    #vista-cambiar-subseccion.modal-contenidos-responsive {
        padding: 4.16vw 4.58vw;
    }

    .vista-agregar-tema {
        display: flex;
        flex-direction: column;
        row-gap: 3.125vw;
    }

    .vista-agregar-tema .titulo-modal {
        font-family: Roboto;
        font-weight: bold;
        font-size: 3.75vw;
        color: #A0A0A0;
    }

    .vista-agregar-tema .selector-categoria {
        display: flex;
        flex-direction: column;
        font-size: 3.75vw;
        color: #A0A0A0;
    }

    .vista-agregar-tema .cabecera-selector-categoria {
        border: 1px solid #EAEAEA;
        height: 8.85vw;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        border-radius: 1.33vw;
        padding: 0 2.5vw 0 2.92vw;
    }

    .vista-agregar-tema .categorias-subcategorias-temas {
        border-radius: 0 0 2.5vw 2.5vw;
        border: 1px solid #EAEAEA;
        margin-top: -1vw;
        border-top: none;
        padding: 1vw 4.16vw 0 4.16vw;
    }

    .categorias-subcategorias-temas .elemento-categoria-subcategoria {
        min-height: 10.41vw;
        border-bottom: 1px solid #EAEAEA;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0 4.17vw 0 1.67vw;
    }

    .vista-agregar-tema input[type="radio"] {
        width: auto;
    }

    .modal-contenidos-responsive .encuesta {
        display: flex;
        flex-direction: column;
        row-gap: 3vw;
    }

    .modal-contenidos-responsive .encuesta .varios-elementos{
        display: flex;
        flex-direction: row;
        column-gap: 2vw;
    }

    .modal-contenidos-responsive .encuesta .varios-elementos>*{
        width: -webkit-fill-available;
        width: -moz-available;
    }

    .modal-contenidos-responsive .encuesta label{
        margin:0;
    }

    .modal-contenidos-responsive .pregunta-encuesta{
        display: flex;
        flex-direction: column;
        row-gap: 3vw;
    }

    .modal-contenidos-responsive .pregunta-encuesta .respuestas-pregunta{
        display: flex;
        flex-direction: row;
        column-gap: 2vw;
        align-items: center;
    }

    .modal-contenidos-responsive .pregunta-encuesta .eliminar-opcion{
        background-color: red;
        width: 6vw;
        height: 6vw;
        border-radius: 50%;
        color: white;
        text-align: center;
        font-size: 4vw;
    }

    .modal-contenidos-responsive .pregunta-encuesta .respuestas-pregunta>li:first-child{
        width: -webkit-fill-available;
        width: -moz-available;
    }

    .modal-contenidos-responsive .encuesta .opciones-pregunta-encuesta{
        display: flex;
        flex-direction: row;
        column-gap: 3vw;
        justify-content: space-between;
        font-size: 3vw;
    }

    .modal-contenidos-responsive .encuesta .pregunta-encuesta{
        border-bottom: 1px solid #dee2e6;
        border-top: 1px solid #dee2e6;
        padding: 2vw 0;
    }

    .modal-contenidos-responsive .encuesta .opciones-pregunta{
        display: flex;
        justify-content: flex-end;
        font-size: 3vw;
    }
    /* Fin - Reponsive para encuestas */

    /* Inicio - Modal compartir contenido redes sociales */
    #compartir-contenido .modal-content{
        width: 87vw !important;
        padding: 2vw 4vw !important;
    }

    #compartir-contenido .modal-title{
        font-size: 5vw;
        margin: 0;
    }

    #compartir-contenido .modal-body{
        display: contents;
    }

    #compartir-contenido .lista-redes-compartir{
        font-size: 10vw;
        column-gap: 3.125vw;
    }

    #compartir-contenido .contenedor-elementos{
        row-gap: 3.125vw;
        padding: 3.125vw 0;
    }
    /* Fin - Modal compartir contenido redes sociales */

    /*Boton agregar contenido a lista*/
    .contenedor-boton-agregar-contenido .boton-agregar-comic-lista{
        left: 10%;
        display: inline;
        top: 40%;
        position: absolute;
        display: none;
    }

    .boton-agregar-comic-lista {
        top: 13vw;
        left: 3vw;
        font-size: 3.3333vw;
    }

    .boton-agregar-comic-lista .boton-agregar-lista {
        height: 7.5vw;
        border-radius: 3.333vw;
        width: 18.75vw;
        padding-top: 0.4166vw;
    }
    /*Fin boton agregar contenido a lista*/
}

/* Modal de cambio de alias, cambios de ubicacion vertical para pantallas de poca altura*/
@media (min-width: 482px) and (max-height: 750px){
    #modal-cambio-usuario .modal-dialog{
        margin-top: 95px;
    }

    #modal-cambio-usuario .lista-usuarios-like-comentario{
        max-height: 350px;
    }
}

@media (min-width: 1600px){
    .modal__login__body {
        padding: 42px 20px !important;
    }
}

@media (min-width: 576px){
    .modal__login .modal-dialog,.modal__registrar  .modal-dialog{
        margin: 1.75rem auto;
    }
    /*
    .modal__registrar  .modal-dialog{
        margin: 0.5rem;
    }
    */
    
}