@charset "utf-8";
/* CSS Document */

.lds-ripple {
	display: inline-block;
	position: absolute;
	left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
	width: 80px; height: 80px;
	z-index: 1;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #fff;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}


.cl-middle
{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	aspect-ratio: 1 / 1; /* Mantiene la forma cuadrada */
}


.cl-collage
{
	position: absolute;
	width: 100%;
	height: 100%;
}
.cl-collage .le
{
	box-shadow: inset 0 0 0 2px #FFF;
	background-color: #EBEBEB;
}
.cl-collage .ig
{
	position: relative;
	height: 100%; width: 100%;
	box-shadow: inset 0 0 0 2px #FFF;
	background-image: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	cursor: pointer;
	display: none;
}

.cl-hidden
{
	position: relative;
	display:  none;
}

.cl-hidden span
{
	position: relative;
	display: block;
}

.cl-min-clge {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 49%;
    aspect-ratio: 1 / 1; /* El alto es un 10% más grande que el ancho */
    margin: 0% 0% 1.5% 1.5%;
    float: left;
	cursor: pointer;
}

/* Elimina el margen para los elementos en el left y right */
.cl-min-clge:nth-child(odd) {
    margin-left: 0;
}

.cl-min-clge:nth-child(even) {
    margin-right: -2%;
}

.cl-min-clge .le
{
	box-shadow: inset 0 0 0 2px #FFF;
	background-color:#EBEBEB;
}
.cl-min-clge .ig
{
	position: relative;
	height: 100%; width: 100%;
	box-shadow: inset 0 0 0 2px #FFF;
	background-image: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	display: none;
}
.cl-min-clge .fav
{
	position: absolute;
	right: 20px; top: 0px;
	width: 35px; height: 35px;
	background-image: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-image:url("../icos/favorite.svg");
	z-index: 1;
}
.cl-min-clge .fav .star
{
	position: relative;
	width: 100%; height: 90%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 50% 50%;
	background-image:url("../icos/star.svg");
}

.cl-CA0-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 100%;
}
.cl-CA0-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA0-c
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}


.cl-CA1-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA1-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA1-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA1-d
{
	position: absolute;
	right: 0px; bottom: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA1-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}





.cl-CA2-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA2-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA2-c
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}

.cl-CA2-d
{
	position: absolute;
	right: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}

.cl-CA2-e
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA2-f
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}





.cl-CA3-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA3-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA3-c
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA3-d
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA3-e
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA3-f
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}





.cl-CA4-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA4-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 66.66%;
}
.cl-CA4-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}
.cl-CA4-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}





.cl-CA5-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA5-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA5-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA5-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA5-e
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA5-f
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA5-g
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}



.cl-CA6-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA6-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA6-c
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA6-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA6-e
{
	position: absolute;
	left: 33.33%; bottom: 33.33%;
	width: 33.33%;
	height: 33.33%;
}





.cl-CA7-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA7-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA7-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA7-d
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 100%;
	height: 33.33%;
}
.cl-CA7-e
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA7-f
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA7-g
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}




.cl-CA8-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA8-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA8-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA8-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA8-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}




.cl-CA9-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA9-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA9-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA9-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA9-e
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA9-f
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA9-g
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}




.cl-CA10-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA10-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA10-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA10-d
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}




.cl-CA11-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA11-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA11-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA11-d
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA11-e
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA11-f
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA11-g
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}




.cl-CA12-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA12-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA12-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA12-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA12-e
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA12-f
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}




.cl-CA13-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA13-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA13-c
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA13-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA13-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 66.66%;
	height: 66.66%;
}



.cl-CA14-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA14-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA14-c
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA14-d
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA14-e
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA14-f
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 100%;
	height: 33.33%;
}







.cl-CA15-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA15-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA15-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}
.cl-CA15-d
{
	position: absolute;
	right: 0px; bottom: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA15-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}


.cl-CA16-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA16-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA16-c
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA16-d
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA16-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 50%;
}


.cl-CA17-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 100%;
	height: 33.33%;
}
.cl-CA17-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}
.cl-CA17-c
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}


.cl-CA18-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA18-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA18-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA18-d
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA18-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 100%;
	height: 33.33%;
}


.cl-CA19-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA19-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA19-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 50%;
}
.cl-CA19-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA19-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}

.cl-CA20-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA20-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA20-c
{
	position: absolute;
	bottom: 0px; left: 0px;
	width: 50%;
	height: 66.66%;
}
.cl-CA20-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}

.cl-CA21-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA21-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA21-c
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA21-d
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA21-e
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 100%;
	height: 33.33%;
}

.cl-CA22-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 100%;
}
.cl-CA22-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA22-c
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}

.cl-CA23-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 100%;
	height: 33.33%;
}
.cl-CA23-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA23-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA23-d
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA23-e
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA23-f
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA23-g
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA24-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA24-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA24-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA24-d
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA24-e
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA24-f
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA24-g
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA25-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA25-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA25-c
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA25-d
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA25-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA26-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA26-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA26-c
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA26-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA26-e
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA26-f
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 100%;
}


.cl-CA27-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-c
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-d
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-e
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-f
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA27-g
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 100%;
	height: 33.33%;
}


.cl-CA28-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA28-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA28-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA28-d
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA28-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA29-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA29-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 100%;
}
.cl-CA29-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA29-d
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA29-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA30-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA30-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA30-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA30-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA31-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA31-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA31-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA31-d
{
	position: absolute;
	left: 33.33%; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA31-e
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}


.cl-CA32-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA32-b
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 66.66%;
	height: 33.33%;
}
.cl-CA32-c
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 66.66%;
	height: 66.66%;
}
.cl-CA32-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 33.33%;
	height: 66.66%;
}


.cl-CA33-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA33-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA33-c
{
	position: absolute;
	left: 33.33%; top: 0px;
	width: 33.33%;
	height: 33.33%;
}
.cl-CA33-d
{
	position: absolute;
	left: 33.33%; top: 33.33%;
	width: 33.33%;
	height: 66.66%;
}
.cl-CA33-e
{
	position: absolute;
	right: 0px; top: 0px;
	width: 33.33%;
	height: 100%;
}


.cl-CA34-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 100%;
}
.cl-CA34-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA34-c
{
	position: absolute;
	right: 0px; top: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA34-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}


.cl-CA35-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 100%;
	height: 33.33%;
}
.cl-CA35-b
{
	position: absolute;
	left: 0px; top: 33.33%;
	width: 50%;
	height: 33.33%;
}
.cl-CA35-c
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 33.33%;
}
.cl-CA35-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 66.66%;
}


.cl-CA36-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 100%;
}
.cl-CA36-b
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 100%;
}
.cl-CA36-c
{
	position: absolute;
	left: 25%; top: 25%;
	width: 50%;
	height: 50%;
}


.cl-CA37-a
{
	position: absolute;
	left: 0px; top: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA37-b
{
	position: absolute;
	left: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA37-c
{
	position: absolute;
	right: 0px; top: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA37-d
{
	position: absolute;
	right: 0px; bottom: 0px;
	width: 50%;
	height: 50%;
}
.cl-CA37-e
{
	position: absolute;
	left: 25%; top: 25%;
	width: 50%;
	height: 50%;
}


.cl-CA38-a {
    position:absolute;
    left:0; top:0;
    width:50%; height:50%;
}
.cl-CA38-b {
    position:absolute;
    right:0; top:0;
    width:50%; height:50%;
}
.cl-CA38-c {
    position:absolute;
    left:0; bottom:0;
    width:50%; height:50%;
}
.cl-CA38-d {
    position:absolute;
    right:0; bottom:0;
    width:50%; height:50%;
}


.cl-CA39-a {
    position:absolute;
    left:0; top:0;
    width:66.66%; height:66.66%;
}
.cl-CA39-b {
    position:absolute;
    right:0; top:0;
    width:33.33%; height:33.33%;
}
.cl-CA39-c {
    position:absolute;
    right:0; top:33.33%;
    width:33.33%; height:33.33%;
}
.cl-CA39-d {
    position:absolute;
    left:0; bottom:0;
    width:66.66%; height:33.33%;
}
.cl-CA39-e {
    position:absolute;
    right:0; bottom:0;
    width:33.33%; height:33.33%;
}



.cl-CA40-a {
    position:absolute;
    left:0; top:0;
    width:33.33%; height:50%;
}
.cl-CA40-b {
    position:absolute;
    left:33.33%; top:0;
    width:33.33%; height:50%;
}
.cl-CA40-c {
    position:absolute;
    right:0; top:0;
    width:33.33%; height:50%;
}
.cl-CA40-d {
    position:absolute;
    left:0; bottom:0;
    width:33.33%; height:50%;
}
.cl-CA40-e {
    position:absolute;
    left:33.33%; bottom:0;
    width:33.33%; height:50%;
}
.cl-CA40-f {
    position:absolute;
    right:0; bottom:0;
    width:33.33%; height:50%;
}



.cl-CA41-a {
    position:absolute;
    left:0; top:0;
    width:60%; height:100%;
}
.cl-CA41-b {
    position:absolute;
    right:0; top:0;
    width:40%; height:33.33%;
}
.cl-CA41-c {
    position:absolute;
    right:0; top:33.33%;
    width:40%; height:33.33%;
}
.cl-CA41-d {
    position:absolute;
    right:0; bottom:0;
    width:40%; height:33.33%;
}

.cl-CA42-a {
    position:absolute;
    left:0; top:0;
    width:33.33%; height:40%;
}
.cl-CA42-b {
    position:absolute;
    left:33.33%; top:0;
    width:33.33%; height:40%;
}
.cl-CA42-c {
    position:absolute;
    right:0; top:0;
    width:33.33%; height:40%;
}
.cl-CA42-d {
    position:absolute;
    left:0; bottom:0;
    width:50%; height:60%;
}
.cl-CA42-e {
    position:absolute;
    right:0; bottom:0;
    width:50%; height:60%;
}


.cl-CA43-a {
    position:absolute;
    left:0; top:0;
    width:100%; height:40%;
}
.cl-CA43-b {
    position:absolute;
    left:0; bottom:0;
    width:20%; height:60%;
}
.cl-CA43-c {
    position:absolute;
    left:20%; bottom:0;
    width:20%; height:60%;
}
.cl-CA43-d {
    position:absolute;
    left:40%; bottom:0;
    width:20%; height:60%;
}
.cl-CA43-e {
    position:absolute;
    left:60%; bottom:0;
    width:20%; height:60%;
}
.cl-CA43-f {
    position:absolute;
    right:0; bottom:0;
    width:20%; height:60%;
}


.cl-CA44-a {
    position:absolute;
    left:0; top:0;
    width:50%; height:40%;
}
.cl-CA44-b {
    position:absolute;
    right:0; top:0;
    width:50%; height:40%;
}
.cl-CA44-c {
    position:absolute;
    left:0; bottom:0;
    width:50%; height:60%;
}
.cl-CA44-d {
    position:absolute;
    right:0; bottom:0;
    width:50%; height:60%;
}


.cl-CA45-a {
    position:absolute;
    left:0; top:0;
    width:50%; height:33.33%;
}
.cl-CA45-b {
    position:absolute;
    left:0; top:33.33%;
    width:50%; height:33.33%;
}
.cl-CA45-c {
    position:absolute;
    left:0; bottom:0;
    width:50%; height:33.33%;
}
.cl-CA45-d {
    position:absolute;
    right:0; top:0;
    width:50%; height:50%;
}
.cl-CA45-e {
    position:absolute;
    right:0; top:50%;
    width:50%; height:25%;
}
.cl-CA45-f {
    position:absolute;
    right:0; bottom:0;
    width:50%; height:25%;
}


.cl-CA46-a {
    position:absolute;
    left:25%; top:25%;
    width:50%; height:50%;
}
.cl-CA46-b {
    position:absolute;
    left:0; top:0;
    width:75%; height:25%;
}
.cl-CA46-c {
    position:absolute;
    right:0; top:0;
    width:25%; height:75%;
}
.cl-CA46-d {
    position:absolute;
    left:0; bottom:0;
    width:25%; height:75%;
}
.cl-CA46-e {
    position:absolute;
    right:0; bottom:0;
    width:75%; height:25%;
}


.cl-CA47-a {
    position:absolute;
    left:0; top:0;
    width:40%; height:100%;
}
.cl-CA47-b {
    position:absolute;
    right:0; top:0;
    width:60%; height:33.33%;
}
.cl-CA47-c {
    position:absolute;
    right:0; top:33.33%;
    width:60%; height:33.33%;
}
.cl-CA47-d {
    position:absolute;
    right:0; bottom:0;
    width:60%; height:33.33%;
}


.cl-CA48-a {
  position: absolute;
  left: 0; top: 0;
  width: 50%; height: 33.33%;
}
.cl-CA48-b {
  position: absolute;
  left: 0; top: 33.33%;
  width: 50%; height: 33.33%;
}
.cl-CA48-c {
  position: absolute;
  left: 0; bottom: 0;
  width: 50%; height: 33.33%;
}
.cl-CA48-d {
  position: absolute;
  right: 0; top: 0;
  width: 50%; height: 50%;
}
.cl-CA48-e {
  position: absolute;
  right: 0; top: 50%;
  width: 50%; height: 25%;
}
.cl-CA48-f {
  position: absolute;
  right: 0; bottom: 0;
  width: 50%; height: 25%;
}


.cl-CA49-a {
    position:absolute;
    left:0; top:0;
    width:50%; height:40%;
}
.cl-CA49-b {
    position:absolute;
    right:0; top:0;
    width:50%; height:40%;
}
.cl-CA49-c {
    position:absolute;
    left:0; bottom:0;
    width:33.33%; height:60%;
}
.cl-CA49-d {
    position:absolute;
    left:33.33%; bottom:0;
    width:33.33%; height:60%;
}
.cl-CA49-e {
    position:absolute;
    right:0; bottom:0;
    width:33.33%; height:60%;
}


/* CA50 con 9 imágenes: cruz + esquinas */

.cl-CA50-a {
  /* imagen central */
  position: absolute;
  left: 25%; top: 0%;
  width: 50%; height: 50%;
}

.cl-CA50-b {
  /* izquierda centro */
  position: absolute;
  left: 0; top: 25%;
  width: 25%; height: 50%;
}

.cl-CA50-c {
  /* derecha centro */
  position: absolute;
  right: 0; top: 25%;
  width: 25%; height: 50%;
}

.cl-CA50-d {
  /* parte baja izquierda-central */
  position: absolute;
  left: 25%; bottom: 0;
  width: 25%; height: 50%;
}

.cl-CA50-e {
  /* parte baja derecha-central */
  position: absolute;
  right: 25%; bottom: 0;
  width: 25%; height: 50%;
}

/* esquinas: 4 imágenes más */
.cl-CA50-f {
  position: absolute;
  left: 0; top: 0;
  width: 25%; height: 25%;
}

.cl-CA50-g {
  position: absolute;
  right: 0; top: 0;
  width: 25%; height: 25%;
}

.cl-CA50-h {
  position: absolute;
  left: 0; bottom: 0;
  width: 25%; height: 25%;
}

.cl-CA50-i {
  position: absolute;
  right: 0; bottom: 0;
  width: 25%; height: 25%;
}

/* ==========================================================
   BRINTAGE COLLAGES - contorno blanco + favorito al borde
   2026-07-06
   Mantiene 2 collages por fila, misma altura proporcional.
   ========================================================== */
.cl-min-clge{
    width:calc((100% - 14px) / 2)!important;
    height:auto!important;
    aspect-ratio:auto!important;
    margin:0 0 14px 0!important;
    padding:0!important;
    border:6px solid #fff!important;
    box-sizing:border-box!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 2px 8px rgba(13,28,45,.06)!important;
    overflow:hidden!important;
    float:left!important;
    display:flex!important;
    flex-direction:column!important;
}
.cl-min-clge .cl-mini-canvas{
    position:relative;
    width:100%;
    aspect-ratio:1 / 1;
    flex:0 0 auto;
    overflow:hidden;
    border-radius:7px 7px 0 0;
    background:#ebebeb;
}
.cl-min-clge:nth-child(odd){
    margin-left:0!important;
    margin-right:0!important;
}
.cl-min-clge:nth-child(even){
    margin-left:14px!important;
    margin-right:0!important;
}
.cl-min-clge .cl-collage,
.cl-min-clge .cl-middle{
    border-radius:7px!important;
    overflow:hidden!important;
}
.cl-min-clge .le,
.cl-min-clge .ig,
.cl-min-clge .imge{
    box-shadow:inset 0 0 0 1.5px #fff!important;
}
.cl-min-clge .fav{
    top:0!important;
    right:0!important;
    width:34px!important;
    height:34px!important;
    z-index:10!important;
    filter:drop-shadow(0 3px 5px rgba(255,72,72,.20))!important;
}


/* ===== Brintage TOP SEMANAL 2026 ===== */
.top-weekly-head{
    position:relative;
    width:100%;
    min-height:126px;
    flex:0 0 auto;
    clear:both;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:8px 18px;
    background:transparent;
    text-align:center;
    z-index:2;
    margin-bottom:8px;
}
.top-weekly-trophy{
    width:36px;
    height:36px;
    background:url("../icos/trophy.svg") center/contain no-repeat;
    margin:0 0 2px;
}
.top-weekly-title-row{
    width:100%;
    display:grid;
    grid-template-columns:minmax(28px,1fr) auto minmax(28px,1fr);
    align-items:center;
    gap:13px;
}
.top-weekly-title-row h1{
    margin:0;
    color:#101625;
    font-family:Arial,Helvetica,sans-serif;
    font-size:22px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.2px;
    white-space:nowrap;
}
.top-weekly-line{
    position:relative;
    display:block;
    height:1.5px;
    background:#2f84f6;
    opacity:.85;
}
.top-weekly-line:first-child:after,
.top-weekly-line:last-child:before{
    content:"";
    position:absolute;
    top:50%;
    width:7px;
    height:7px;
    margin-top:-3.5px;
    border-radius:50%;
    background:#2f84f6;
}
.top-weekly-line:first-child:after{right:-1px}
.top-weekly-line:last-child:before{left:-1px}
.top-weekly-detail{
    height:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    margin-top:2px;
}
.top-weekly-detail i{
    display:block;
    width:22px;
    height:2px;
    border-radius:2px;
    background:#2f84f6;
}
.top-weekly-detail b{
    display:block;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#2f84f6;
}
.top-weekly-head p{
    margin:2px 0 0;
    color:#858b96;
    font-family:Arial,Helvetica,sans-serif;
    font-size:13px;
    line-height:1.25;
    font-weight:400;
}
#favorites{
    padding-top:10px;
    box-sizing:border-box;
}
#favorites > .cl-min-clge:nth-of-type(odd){
    margin-left:0!important;
    margin-right:0!important;
}
#favorites > .cl-min-clge:nth-of-type(even){
    margin-left:14px!important;
    margin-right:0!important;
}
#favorites .cl-min-clge{
    height:auto;
    aspect-ratio:auto;
    overflow:hidden;
    border-radius:13px;
    background:#fff;
    box-shadow:0 4px 14px rgba(32,78,135,.09);
}
#favorites .cl-mini-canvas{
    position:relative;
    width:100%;
    aspect-ratio:1/1;
    overflow:hidden;
    background:#ebebeb;
}
#favorites .cl-min-clge .fav{
    display:none!important;
}
.top-weekly-rank{
    --rank-border:#4fa6f8;
    --rank-fill:rgba(255,255,255,.96);
    --rank-text:#2f84f6;
    --rank-shadow:rgba(47,132,246,.16);
    position:absolute;
    top:8px;
    right:8px;
    width:30px;
    height:30px;
    z-index:12;
    pointer-events:none;
    font-family:Arial,Helvetica,sans-serif;
}
.top-weekly-rank b{
    position:relative;
    z-index:2;
    width:100%;
    height:100%;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    border:2px solid var(--rank-border);
    border-radius:50%;
    background:var(--rank-fill);
    color:var(--rank-text);
    box-shadow:
        0 3px 8px var(--rank-shadow),
        inset 0 0 0 2px rgba(255,255,255,.75);
    font-size:13px;
    line-height:1;
    font-weight:800;
}
.top-weekly-rank-medal:before,
.top-weekly-rank-medal:after{
    content:"";
    position:absolute;
    z-index:1;
    top:10px;
    width:13px;
    height:10px;
    background:var(--rank-border);
    opacity:.92;
    filter:drop-shadow(0 2px 2px var(--rank-shadow));
}
.top-weekly-rank-medal:before{
    left:-8px;
    clip-path:polygon(0 18%,100% 0,82% 100%,0 82%);
    transform:rotate(-8deg);
}
.top-weekly-rank-medal:after{
    right:-8px;
    clip-path:polygon(0 0,100% 18%,100% 82%,18% 100%);
    transform:rotate(8deg);
}
.top-weekly-rank-1{
    --rank-border:#d2a43a;
    --rank-fill:#fff9e9;
    --rank-text:#8b6405;
    --rank-shadow:rgba(184,132,22,.25);
}
.top-weekly-rank-2{
    --rank-border:#aab5c1;
    --rank-fill:#f8fafc;
    --rank-text:#667382;
    --rank-shadow:rgba(91,108,126,.22);
}
.top-weekly-rank-3{
    --rank-border:#bb7950;
    --rank-fill:#fff4ec;
    --rank-text:#875033;
    --rank-shadow:rgba(142,79,43,.22);
}
.top-weekly-rank-standard{
    width:28px;
    height:28px;
}
.top-weekly-rank-standard b{
    border-width:1.5px;
    font-size:12px;
}
.top-weekly-stats{
    height:31px;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:24px;
    padding:0 8px;
    background:#fff;
    color:#687080;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    line-height:1;
}
.top-weekly-stat{
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-width:45px;
    justify-content:center;
}
.top-weekly-stat b{font-weight:500}
.top-weekly-stat i{
    width:17px;
    height:17px;
    display:block;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
}
.top-weekly-likes i{background-image:url("../icos/like.svg")}
.top-weekly-comments i{background-image:url("../icos/comment.svg")}

@media (max-width:600px){
    .top-weekly-head{min-height:126px;padding-left:13px;padding-right:13px}
    .top-weekly-title-row{gap:10px}
    .top-weekly-title-row h1{font-size:21px}
    .top-weekly-head p{font-size:12.5px}
    #favorites{padding:8px 7px 0}
    #favorites .cl-min-clge{width:48.5%;margin-bottom:2.2%;}
    .top-weekly-stats{gap:17px;font-size:11.5px}
}

/* ===== TOP SEMANAL: adaptación específica para modo FIXED ===== */
@media (min-width:769px){
    #favorites .top-weekly-head{
        min-height:126px;
        padding:12px 18px!important;
        justify-content:center!important;
    }

    #favorites .top-weekly-trophy{
        width:38px;
        height:38px;
        margin-bottom:3px;
    }

    #favorites .top-weekly-title-row{
        max-width:620px;
        gap:16px;
    }

    #favorites .top-weekly-title-row h1{
        font-size:23px;
    }

    #favorites .top-weekly-head p{
        font-size:13px;
        margin-top:3px;
    }
}

/* =========================================================
   BRINTAGE - ENCABEZADO USUARIOS EN LÍNEA
   Cambios limitados exclusivamente a la sección Online.
   ========================================================= */
.online-users-head{
    position:relative;
    width:100%;
    min-height:112px;
    flex:0 0 auto;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:10px 14px 12px;
    background:transparent;
    text-align:center;
    z-index:2;
}
.online-users-title-row{
    width:100%;
    max-width:720px;
    display:grid;
    grid-template-columns:minmax(26px,1fr) 42px auto minmax(26px,1fr);
    align-items:center;
    gap:13px;
}
.online-users-title-row h1{
    margin:0;
    color:#101a35;
    font-family:Arial,Helvetica,sans-serif;
    font-size:22px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.35px;
    white-space:nowrap;
}
.online-users-line{
    position:relative;
    display:block;
    height:1.5px;
    background:#2f84f6;
    opacity:.9;
}
.online-users-line:first-child:after,
.online-users-line:last-child:before{
    content:"";
    position:absolute;
    top:50%;
    width:7px;
    height:7px;
    margin-top:-3.5px;
    border-radius:50%;
    background:#2f84f6;
}
.online-users-line:first-child:after{right:-1px}
.online-users-line:last-child:before{left:-1px}
.online-users-icon{
    width:42px;
    height:42px;
    border-radius:50%;
    position:relative;
    background:#2f84f6;
    box-shadow:0 0 0 7px rgba(47,132,246,.08);
}
.online-users-icon:before{
    content:"";
    position:absolute;
    inset:9px;
    background:#fff;
    -webkit-mask:url("../icos/online.svg") center/contain no-repeat;
    mask:url("../icos/online.svg") center/contain no-repeat;
}
.online-users-head p{
    margin:5px 0 0;
    color:#7b8492;
    font-family:Arial,Helvetica,sans-serif;
    font-size:13px;
    line-height:1.2;
    font-weight:400;
}

/* Estado visible de cada usuario conectado */
#online .on-pos:after{
    content:"";
    position:absolute;
    right:3px;
    top:3px;
    width:11px;
    height:11px;
    border-radius:50%;
    box-sizing:border-box;
    background:#13c94c;
    border:2px solid #fff;
    z-index:5;
}
#online .on-status{
    width:100%;
    margin-top:2px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    color:#0dbf48;
    font-family:Arial,Helvetica,sans-serif;
    font-size:11px;
    line-height:15px;
    white-space:nowrap;
}
#online .on-status i{
    width:5px;
    height:5px;
    flex:0 0 5px;
    border-radius:50%;
    background:#0dbf48;
}

@media (min-width:769px){
    #online .online-users-head{
        min-height:112px;
        padding:12px 18px!important;
    }
    #online .online-users-title-row{
        max-width:650px;
        gap:15px;
    }
    #online .online-users-title-row h1{
        font-size:23px;
    }
}

@media (max-width:600px){
    .online-users-head{
        padding-left:11px;
        padding-right:11px;
    }
    .online-users-title-row{
        grid-template-columns:minmax(18px,1fr) 36px auto minmax(18px,1fr);
        gap:8px;
    }
    .online-users-title-row h1{
        font-size:17px;
        letter-spacing:.1px;
    }
    .online-users-icon{
        width:36px;
        height:36px;
        box-shadow:0 0 0 5px rgba(47,132,246,.08);
    }
    .online-users-icon:before{
    content:"";
    position:absolute;
    inset:9px;
    background:#fff;
    -webkit-mask:url("../icos/online.svg") center/contain no-repeat;
    mask:url("../icos/online.svg") center/contain no-repeat;
}
.online-users-head p{font-size:12px}
    #online .on-status{font-size:10.5px}
}

@media (max-width:360px){
    .online-users-title-row{
        grid-template-columns:minmax(10px,1fr) 32px auto minmax(10px,1fr);
        gap:6px;
    }
    .online-users-title-row h1{font-size:15px}
    .online-users-icon{width:32px;height:32px;}
}