:root {
 --color-yellow-pastel: #f5efb2;
 --color-sky-blue: #68c4e1;
 --color-bright-yellow: #f9d338;
 --color-pink: #f45699;
 --color-black: #191919;
 --color-white: #ffffff;
 --color-verde-whatsapp:#00a884;
 --color-aqua: #79ba9b;
}
html, body {
	overflow: hidden;
	position: relative;
	height: 100%;
	width: 100%
}
.h3, h3 {
	font-size: 1.4rem;
}
form.form-horizontal {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
img.anteprimaImmagine {
	width: 150px;
	height: 150px;
	border-radius: 50%;
}
.hide_form {
	position: absolute;
	z-index: -1000;
	left: -10000;
	opacity: 0;
}
#form_area_personale {
}
.landing-window {
	z-index: 2;
	display: flex;
	flex: none;
	flex-direction: column;
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	background-color: var(--color-white);
	border-radius: 3px;/* box-shadow: 0 17px 50px 0 rgba(11, 20, 26, .19), 0 12px 15px 0 rgba(11, 20, 26, .24); */
}
.landing-wrapper {
	padding: 0;
}
.landing-wrapper-before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 222px;/* background-color: #000000; */
}
#form_area_personale {
	width: 100%;
	/* padding: 15px; */
	margin-bottom: 60px;/* margin-top: 137px; */
	/* padding-top: 10px; */
}
.avatar_icon {
	text-align: center;
}
.avatar_icon label {
	display: none;
}
.modificaimmagine {
	z-index: 1;
	right: calc(50% - 66px);
	top: calc(50% - 68px);
	background: #f9d338;
	padding: 10px;
	width: 100%;
	cursor: pointer;
}
.container {
	width: 100%;
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
}
/*LOGIN*/

.xm2024-btn-container {
	background-color: var(--color-white);
	border: solid 2px var(--color-black);
	;
	box-shadow: -8px 11px var(--color-black);
	;
	;
	color: var(--color-black);
	;
	border-radius: 50px!important;
	transition: cubic-bezier(1, -0.27, 0.18, 1.37) .6s;
	font-weight: 800;
	text-transform: uppercase;
	padding: 10px;
	padding-left: 18px;
	padding-right: 18px;
}
.xm2024-btn-container span {
	font-weight: 700!important;
	letter-spacing: 0!important;
	font-family: 'GraphikLCG-Bold' !important;
}
.xm2024-btn-container:hover {
	background-color: var(--color-black);
	;
	border: solid 2px var(--color-black);
	;
	box-shadow: 8px 11px var(--color-black);
	;
	color: var(--color-white);
!important;
	/* font-size: 1.8em; */
	border-radius: 50px!important;
}
#login_game form.form-signin {
	width: 378px;
	padding: 15px;
	padding-top: 35px;/* margin-bottom: 60px; */
}
#login_game .container {
	display: flex;
	justify-content: center;
	padding-bottom: 0;
	padding-top: 0px;
	height: calc(100% - 63px);
}
 login_game# .form-signin {
 width: 100%;
 max-width: 330px;
 padding: 15px;
}
.btn-whatsapp {
	background-color: var(--color-verde-whatsapp); /* Verde WhatsApp */
	/* Per assicurarsi che il bordo sia dello stesso colore */
	color: var(--color-white);
}
.btn-whatsapp .fa-whatsapp {
	margin-right: 5px; /* Spazio tra l'icona e il testo */
}
.styleImg {
	display: flex;
	width: 100%!important;
	flex: 0 0 100%;
	max-width: 100%;
	flex-direction: column;
	align-items: center;
	align-content: center;
	padding-bottom: 13px;
	margin-top: 7px;
	border-radius: 10px;
}
.multicheck.styleImg .form-check {
	/* display: flex; */
	/* flex-wrap: wrap; */
	padding: 0;
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); /* Adatta dinamicamente il numero di colonne */
	width: 100%;
}
.multicheck.styleImg .form-check .form-check-input {
	/* opacity: 0; */
	top: 2px;
	left: 2px;
	margin: auto;
	opacity: 0;
}
.multicheck.styleImg .form-check .form-check-label {
	background: var(--color-white);
	/* min-width: 86px; */
	height: 107px;
	margin: 3px;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	border: 1px solid #d2d2d2;
	padding: 6px;
	justify-content: center;
	padding-right: 5px;
	padding-left: 5px;
	text-align: center;
	line-height: 1.2em;
	position: relative;
	border-radius: 11px;
	overflow: hidden;
	font-size: .8em;
}
.multicheck.styleImg .form-check .img_bkg {
	width: calc(100% - 8px);
	height: calc(100% - 40px);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-color: var(--color-white);
	margin-bottom: 4px;
}
.styleImg.styleIcon .big {
	font-size: 30px;
}
.multicheck.styleIcon .form-check .form-check-label {
	height: auto;
}
.form-check-label.attivo {
	border-color: var(--color-sky-blue)!important;
	box-shadow: -5px 7px var(--color-sky-blue)!important;
}
.progress {
	position: relative;
	width: 100%;
	height: 24px;
	background-color: var(--color-yellow-pastel); /* Colore di sfondo della barra statica */
	overflow: visible;
	top: 19px;
	border-radius: 50px;
	box-shadow: 8px 11px var(--color-black);
}
.progress-bar {
	height: 100%;
	background-color: var(--color-pink); /* Colore della barra mobile */
	transition: width 0.5s ease-in-out; /* Animazione di transizione */
	position: relative;
	overflow: visible;
	border-radius: 50px;
	min-width: 32px!important;/* background-color: var(--color-sky-blue); */
}
.target-circle, .totalepunti {
	position: absolute;
	bottom: -8px; /* Posiziona i cerchi sotto la barra */
	width: 40px;
	height: 40px;
	border-radius: 50%; /* Rende i div circolari */
	background-color: var(--color-yellow-pastel); /* Colore dei cerchi */
	color: black;
	display: flex; /* Per allineare il testo al centro */
	align-items: center;
	font-size: 15px;
	font-weight: 700;
	padding-right: 10px;
	justify-content: flex-end;
}
.target-circle {
	right: -20px; /* Fissa il cerchio fisso alla destra della barra */
}
.progress-circle {
	right: 0; /* Posiziona il cerchio mobile sulla barra */
	background-color: var(--color-pink); /* Colore del cerchio mobile */
}
.target-circle.target {
}
.totalepunti {
	right: -20px;
	background: var(--color-pink);
	color: white;
	z-index: 1;
}
.disable_user.invisible {
	position: absolute;
	z-index: -10000;
	left: -10000px;
}
label.control-label {
}
.form-group.styleImg > label, .titleUser {
	font-size: 1rem;
	font-weight: 800;
	text-transform: uppercase;
	background-color: var(--color-white);
	/* border: solid 2px var(--color-black); */
	/* box-shadow: -8px 11px var(--color-black); */
	color: var(--color-sky-blue);
	border-radius: 50px !important;
	transition: cubic-bezier(1, -0.27, 0.18, 1.37) .6s;
	/* font-weight: 800; */
	/* text-transform: uppercase; */
	padding: 10px;
	padding-left: 18px;
	padding-right: 18px;
}
.landing-header {
	width: 100%;
	right: 0;
	top: 62px;
	height: 72px;
	background: border-box;
	z-index: 5;
	background: var(--color-bright-yellow);
	padding-right: 42px;
	padding-left: 42px;
	top: 0;
	max-width: 1114px;
}
.titleprogresspunti {
	width: 100%;
	margin-left: 4px;
	margin-right: 4px;
	text-align: center;
}
span#numberwzz {
 font-size: .8rem;
	border-radius: 4px;
	border: solid 1px #c1c1c1;
	background: whitesmoke;
	font-weight: 500;
	padding: 5px;
	padding-right: 14px;
	padding-left: 14px;
	color: #616161;
	display: inline-block;
}
.avatar_icon {
	margin-top: 14px;
}
span#numberwzz i {
	color: var(--color-verde-whatsapp);
	margin-right: 4px;
	font-weight: 600;
}
.select2-container .select2-selection--single {
	height: calc(2.25rem + 2px); /* Altezza standard dei campi Bootstrap */
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 2.25rem; /* Allineamento del testo verticalmente */
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: calc(2.25rem + 2px); /* Altezza della freccia */
}
 input.select2-search__field:focus-visible {
 border: 0;
 outline: none;
}
label.error {
	color: #df367e;
	margin-right: 6px;
}
.form-control.error {
	background: #f4569938;
}
.select2.select2-container {
	width: 100%!important;
	border: #ced4da;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background-color: var(--color-sky-blue);
}
span.select2-selection.select2-selection--single {
	border: 1px solid #ced4da;
}
/*MENU*/
.bg-dark {
	background-color: var(--color-bright-yellow) !important;
	/* padding: 0; */
	padding-top: 0;
	padding-bottom: 0;
}
.navbar-brand {
	font-size: 24px;
}
.navbar-nav .nav-link {
	font-size: 18px;
}
.scoreData {
	width: 48px;
	position: absolute;
	text-align: right;
}
.navbar-dark .navbar-toggler {
	color: rgb(255 255 255 / 75%);
	border-color: rgb(0 0 0 / 25%);
	background: transparent;
}
.navbar-dark .navbar-brand {
	color: var(--color-black);
}
.navbar-dark .navbar-nav .nav-link {
	color: rgb(0 0 0 / 70%);
}
.navbar-brand img {
	height: 62px;
	padding-bottom: 0px;
	padding-top: 6px;
}
.navbar-brand {
	padding: 0;
	margin: 0;
}
ul.navbar-nav.ml-auto {
/* margin-bottom: 34px; */
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
	color: var(--color-white);
	background-color: var(--color-pink);
	border-color: var(--color-pink);
}
.btn-primary.focus, .btn-primary:focus {
	color: var(--color-black)!important;
	background-color: #fff;
	border-color: unset;
	box-shadow: unset;
	box-shadow: -8px 11px var(--color-black);
}
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
	box-shadow: -8px 11px var(--color-black);
}
.disclamer_punti {
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 24px;
	background-color: var(--color-black);
	text-align: center;
	border-radius: 50px;
	margin-top: 8px;
	color: #fff;
	margin-bottom: 34px;
	flex-direction: column;
	padding-left: 30px;
	padding-right: 30px;
	position: relative;
}
.disclamer_punti i {
	margin-top: 7px;
}
.arrow_baloon {
	width: 30px;
	height: 30px;
	/* background: #1d1d1b; */
	position: absolute;
	bottom: -30px;
	right: 57px;
	border-top: var(--color-black) solid 30px;
	border-bottom: #00000000 solid 0px;
	border-left: #00000000 solid 0px;
	border-right: #00000000 solid 29px;
}
a.whatsapp-dropdown {
	display: none;
}
i#resetAvatar {
	background: var(--color-white);
	position: absolute;
	border: 1px solid #d7d7d7;
	padding: 11px;
	width: 39px;
	height: 40px;
	top: -7px;
	right: calc( 50% - 74px);
	border-radius: 50px;
	background: #fffffff2;
	cursor: pointer;
}
div#alertUP {
	font-size: .8em;
	margin-top: 5px;
}
/*LOGIN*/
#login_game {
	background-color: var(--color-yellow-pastel);
}
#login_game input {
	background: var(--color-pink);
	border-color: #1d1d1b;
}
#login_game input#password {
	background: var(--color-sky-blue);
}
 #login_game ::placeholder {
 color:var(--color-white)!important; /* Colore del placeholder */
}

  /* Cambiare colore del placeholder per Webkit (Chrome, Safari, Edge) */
#login_game ::-webkit-input-placeholder {
 color:var(--color-white)!important;
}

  /* Cambiare colore del placeholder per Mozilla Firefox */
#login_game :-moz-placeholder {
 color: var(--color-white)!important;
}

  /* Cambiare colore del placeholder per Internet Explorer 10+ */
#login_game :-ms-input-placeholder {
 color:var(--color-white)!important;
}

  /* Cambiare colore del placeholder per Firefox con pseudo-classe futura */
#login_game ::-moz-placeholder {
 color:var(--color-white)!important;
}
a.whatsapp {
	color: var(--color-verde-whatsapp);
	font-weight: 600;
}
/*FOOTERBAR*/

.footer-bar {
	display: flex;
	justify-content: space-around;
	align-items: center;
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 60px;
	background-color: var(--color-black);
	border-top: 1px solid #444;
	z-index: 1;
}
.footer-item, .footertopitem {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: var(--color-white);
	text-align: center;
	font-size: 12px;
	padding: 8px;
	padding-bottom: 6px;
	position: relative;
}
.footer-item i, .footertopitem i {
	font-size: 20px;
	margin-bottom: 5px;
}
/* Color Palette */
.footer-item:nth-child(1) i {
	color: var(--color-yellow-pastel); /* Color from the palette */
}
.footer-item:nth-child(2) i {
	color: var(--color-pink); /* Color from the palette */
}
.footer-item:nth-child(3) i {
	color: var(--color-bright-yellow); /* Color from the palette */
}
.footer-item:nth-child(4) i {
	color: var(--color-verde-whatsapp); /* Color from the palette */
}
.footer-item span {
	color: var(--color-white);
}
.mainframe {
	overflow-y: auto;
	overflow-x: hidden;
	height: calc(100% - 132px);
	/* padding-top: 77px; */
	padding-bottom: 100px;
}
.fixed-top {
	position: relative;
}
.col-md-12.account_bar {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 10px;
}
/*.savedataAccount {
    position: fixed;
    bottom: 64px;
    left: 0;
}*/


.alert-danger {
	color: #f45699;
	background-color: #fbe6ef;
	border-color: #fde0ec;
}
.alert-success {
	color: #1d1d1b;
	background-color: #d7eff7;
	border-color: #7ecce4;
}
label.missing-points {
	color: #68c4e1;
	font-size: 13px!important;
	font-weight: 400!important;
	text-transform: none!important;
}
.form-group.checkbox {
	border: solid 10px #fff;
	display: flex;
	align-content: flex-start;
	align-items: flex-start;
	justify-content: flex-start;
	flex-direction: column;
	margin-bottom: 0px;
	/* padding-right: 2px; */
    /* margin-left: 1px; */
	padding: 14px;
	margin-right: -1px;
	background: aliceblue;
	border-bottom-width: 2px;
	border-top-width: 2px;
}
.biografia .form-group {
	margin: 0px;
}
.checkbox .missing-points, .textareaSimple .missing-points {
	/* position: absolute; */
	bottom: -15px;
}
.form-group.textareaSimple {
	margin-bottom: 30px;
}
.login_provvisorio .login_0 {
	display: none;
}
.login_provvisorio .baloon_0 {
	display: block!important;
}
.game .landing-header {
	display: flex;
	padding-left: 3px;
	padding-right: 3px;
	align-content: center;
	justify-content: space-between;
}
.game .landing-header .progress {
	/* margin-left: 4px; */
    /* margin-right: 4px; */
	top: 2px;
}
.totals-container {
	display: flex;
	justify-content: space-around;
	margin-bottom: 20px;
}
.total-circle {
	width: 50%;
	height: 84px;
	border-radius: 99px;
	background-color: var(--color-sky-blue);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
	text-align: center;
	box-shadow: 8px 11px var(--color-black);
	border: solid #222;
	margin-right: 18px;
}
.total-circle span {
	font-size: 28px;
	font-weight: bold;
	color: #fff;
}
.summary-container {
	display: flex;
	flex-wrap: wrap;
	gap: 13px;
	justify-content: center;
	row-gap: 18px;
	padding-right: 4px;
}
.summary-block {
	width: calc(33.333% - 20px);
	background-color: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	/* overflow: hidden; */
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 5px;
	transition: transform 0.2s;
	box-shadow: 8px 11px var(--color-black);
	border: solid #222;
	position: relative;
	padding-bottom: 13px;
	cursor: default;
	user-select: none;
}
#listapremi .summary-block:hover {
	transform: none;
}
.summary-block img {
	width: 100%;
	height: 150px;
	object-fit: cover;
	position: absolute;
	left: 0;
	top: 0;
}
#listapremi .summary-block img {
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.summary-block h3 {
	margin: 10px 0;
	font-size: .8em;
	color: #333;
}
.boxImgSummary {
    position: relative;
    width: 100%; /* o una larghezza specifica, es. 300px */
    /* padding-bottom: 100%; */ /* Questo crea un rapporto di aspetto 1:1 */
    background: var(--color-yellow-pastel);
    height: 150px;
}
#listapremi h3 {
    font-size: 1em;
    font-weight: 900;
}
.summary-block p {
	margin: 1px 0;
	font-size: .8em;
	color: #000000;
	font-weight: 800;
}
.punteggio .progress-bar {
	/* color: black; */
	background-color: var(--color-sky-blue);
}
.game .progress-bar {
	font-weight: 700;
	font-size: 14px;
}
.titlePnt {
	padding-top: 6px;
	font-size: .9em;
}
@media (max-width: 768px) {
.summary-block {
	width: calc(50% - 14px);
}
}
div#avatar img {
	border-radius: 50%;
	max-width: 59px;
	height: auto;
	/* padding: 6px; */
    /* box-shadow: 4px 6px #ffffff; */
	border: 2px solid #fff;
	margin-left: 12px;
	margin-right: 7px;
}
div#avatar {
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: center;
}
.boxheader {
	display: flex;
	/* overflow: hidden; */
	background: var(--color-bright-yellow);
	box-shadow: 0px 0 10px 0px var(--color-white);
	justify-content: center;
	align-content: center;
	align-items: center;
}
div#creditiTotali {
	background-color: var(--color-pink);
	margin-right: 19px;
	margin-left: 10px;
}
.total-circle p {
	font-size: .8em;
	margin-bottom: 0;
}
.bubble-menu {
	display: none;
	position: absolute;
	bottom: 74px; /* Position above the footer */
	right: 4px;
	/* transform: translateX(-50%); */
	background-color: #f5efb2;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	z-index: 1;
	font-size: 1.4em;
	/* left: -49px; */
	box-shadow: 2px 2px 0px 5px #000000;
	/* color: #222; */
}
.bubble-arrow {
	position: absolute;
	bottom: -14px;
	/* left: 50%; */
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 19px solid transparent;
	border-right: 3px solid transparent;
	border-top: 19px solid #f5efb2;
	right: 8px;
}
.bubble-content {
	padding: 16px;
	text-align: center;
	min-width: 179px;
	position: relative;
	text-align: end;
}
.bubble-content a {
	display: block;
	color: #000000;
	text-decoration: none;
	margin: 10px 0;
	font-weight: 800;
}
.bubble-content a:hover {
	text-decoration: underline;
}
.bubble-arrow.shadow {
	border-left: 20px solid transparent;
	border-right: 2px solid transparent;
	border-top: 25px solid #000000;
	right: 6px;
	bottom: -25px;
}
#numberwzz {
	color: #27ab88;
	font-weight: 700;
}
.titlePnt span {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: var(--color-yellow-pastel);
	padding: 2px;
	border-radius: 50%;
	font-size: .9em;
}
.login_true .landing-header {
	padding-left: 22px;
}
.summary-block[data-stato='3'] {
	background: var(--color-sky-blue);
}
.summary-block[data-esito='1'] {
	background: var(--color-aqua);
}
.summary-block[data-stato='null'] {
	background: #fff;/* opacity: 0.6; */
	filter: grayscale(100%);
}
.summary-block[data-stato='1'][data-esito='0'] {
	background: var(--color-pink);
}
su questo vorrei aggiungere una spuunta verde in alto a destra del div usando un icona bootstrap far .summary-block[data-esito='1'] {
	background: var(--color-bright-yellow);
}
.summary-block i {
	position: absolute;
	top: -8px;
	right: -6px;
	font-size: 36px;
	background-color: var(--color-verde-whatsapp);
	border-radius: 50%;
	color: var(--color-black);
	z-index: 1;
}
.summary-block .fa-clock {
	background: #fff;
}
.summary-block .fa-times-circle {
	color: var(--color-bright-yellow);
	background: #f45699;
}
.summary-block[data-stato='0'][data-esito='0'] {
	background: var(--color-yellow-pastel);
}
.summary-block[data-stato='0'][data-esito='0'] i {
	background: var(--color-bright-yellow);/* color: var(--color-verde-whatsapp); */
}
.summary-block[data-stato='null'][data-active='1'] {
	filter: none;
	background: #f9d338;
	/* color: #fff; */
}
.summary-block .fa-check-circle.new {
	background: azure;
	color: var(--color-pink);
}
.btmess.vai, div.buttonInner {
	background-color: var(--color-white);
	border: solid 2px var(--color-black);
	box-shadow: 4px 4px var(--color-black);
	color: var(--color-black);
	border-radius: 50px !important;
	transition: cubic-bezier(1, -0.27, 0.18, 1.37) .6s;
	font-weight: 800;
	text-transform: uppercase;
	padding: 7px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: .8em;
}
.scade {
	line-height: normal;
	margin-top: 6px;
}
.footer-bar.topfooter {
    position: relative;
    background: none;
    border: 0;
    /* background: var(--color-black); */
    color: var(--color-black);
    padding: 10px;
    margin-bottom: 9px;
}

.footer-bar.topfooter span,.footer-bar.topfooter i {
    color: var(--color-black)!important;
}
.datainfo {
    display: flex;
    background: var(--color-yellow-pastel);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    border-radius: 8px;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 11px;
    display: none;
    left: 0;
    z-index: 1;
    overflow-y: auto;
    padding-top: 16px;
    padding-bottom: 20px;
}
#listapremi .datainfo, #punteggiBadge .datainfo {
    right: 0;
    left: 0px;
    top: 72px;
    bottom: 60px;
    position: fixed;
    z-index: 2;
    height: auto;
    /* display: block; */
    border-radius: 0;
    overflow-y: auto;
    padding-top: 35px;
    padding-bottom: 35px;
}

.form-group.savedataAccount {
    position: absolute;
    bottom: 59px;
    width: 100%;
    left: 0;
    z-index: 1;
}

div.buttonInner {
    margin-top: 14px;
    font-size: .7em;
    background-color: var(--color-aqua);
}

.boxImgSummary::before {
         /* Emoji di clessidra */
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         font-size: 1.5em; /* Dimensione dell'emoji */
         content: "\f254"; /* Codice unicode dell'icona clessidra di FontAwesome */
         font-family: 'Font Awesome 5 Free';';;
}
#listapremi .boxImgSummary {
    padding-bottom: 100%;
}
.contentalert #alert {
    margin: 0;
    max-width: 400px;
    margin: auto;
    margin-bottom: 7px;
}
.sponsor_preferiti label.form-check-label span {
    display: none;
}
#listapremi p.puntiMin {font-weight: 500;}

#listapremi .Min.puntiMin strong {
    background: beige;
    padding: 3px;
    display: inline-block;
    border: solid 3px;
    border-radius: 51px;
    padding-left: 7px;
    padding-right: 8px;
    margin-bottom: 6px;
    box-shadow: 2px 3px var(--color-black);
    font-size: 1.1em;
    font-weight: 900;
}
#listapremi img.qrPremio {
    position: relative;
    height: 250px;
    width: 250px;
    object-fit: unset;
    max-width: 300px;
    max-height: 100%;
    padding: 20px;
    background: #fff;
    border: 6px solid#fff;
    border-radius: 21px;
}

.boxQrcode {
    /* background: azure; */
    padding: 8px;
	display:none;
	
}
.summary-block[data-stato='disponibile'] {
    background: var(--color-pink);
}
.summary-block[data-stato='nondisponibile'] {
    background: var(--color-yellow-pastel);
    /* color: #fff; */
}
.summary-block[data-stato='terminato'] {
    /* background: var(--color-pink); */
    filter: grayscale(.8);
    opacity: .6;
}

[data-stato="nondisponibile"] .qrGen {
    display: none!important;
}
[data-stato='disponibile'] .datainfo {
    background: var(--color-pink);
}
.content_badge {
    display: flex;
    /* gap: 13px; */
    text-align: center;
    flex-wrap: wrap;
    width: 100%;
}

.item_badge {
    width: 25%;
    padding: 2.5%;
    /* filter: grayscale(1); */
    padding-bottom: 9px;
    position: relative;
}

@media (min-width: 992px) {
    .item_badge{
        width: 12.5%;
    }
}

.box_item {
    position: relative;
    width: 100%;
    padding-bottom: 100%;
    padding: 6px;
    padding-bottom: calc(100% + -5px);
    filter: grayscale(1);
}

.box_item img {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    border-radius: 81px;
    /* padding: 6px; */
}
.title_badge {
    line-height: normal;
    font-size: .8em;
    margin-right: -8px;
    margin-left: -8px;
    padding-top: 17%;
}

.item_badge[data-stato="1"] .box_item {
    filter: none;
}

.item_badge[data-stato="1"] img {
    border: solid;
    border-color: var(--color-bright-yellow);
}
.punti_bdg {
    background: #ededed;
    padding: 0px;
    display: inline-block;
    /* border: solid 1px; */
    border-radius: 51px;
    padding-left: 5px;
    padding-right: 6px;
    margin-bottom: 4px;
    box-shadow: 1px 1px var(--color-black);
    font-size: .9em;
    font-weight: 500;
    width: 71px;
    position: absolute;
    margin: auto;
    bottom: -12px;
    left: 0;
    right: 0;
    z-index: 0;
}

#punteggiBadge [data-stato="1"] .punti_bdg {
    background: var(--color-bright-yellow);
}
div#gallerybox {
    /* overflow-x: auto; */
    display: flex;
    margin: auto;
    /* justify-content: center; */
    /* width: fit-content; */
}
#gallerybox .gallery-item {
    position: relative;
    display: block;
    margin: 6px;
    /* max-width: 111px; */
    /* max-height: 150px; */
    z-index: 0;
}
#gallerybox .caption {
    text-align: center;
    margin-top: 5px;
    font-size: 12px;
    font-weight: 700;
}
#gallerybox .score {
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    padding: 5px;
    border-radius: 3px;
}
#gallerybox .score-and-delete {
    position: absolute;
    top: 5px;
    right: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
}
#crollgallerybox {
    overflow-x: scroll;
    display: flex;
    /* padding-top: 31px; */
}
#crollgallerybox .delete-icon {
    background-color: rgb(242 109 68 / 82%);
    color: white;
    padding: 5px;
    border-radius: 3px;
    margin-left: 2px;
}
#gallerybox img {width: 109px;height: 109px;object-fit: cover;}
.galleryUser {
    width: 100%;
}
.galleryUser .titleUser {
    padding-top: 31px;
    text-align: center;
}
/*CLASSIFICA*/
.box_itemclassifica {
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    padding-left: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    position: relative;
}

.item_classifica {
    /* margin-bottom: 6px; */
}

.title_classifica {width: 100%;padding-right: 10px;padding-left: 16px;font-weight: 600;}

.punti_classifica {
    padding-right: 21px;
    padding-left: 10px;
    font-weight: 900;
    width: 126px;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    align-content: center;
}

.box_itemclassifica .avatar {
    width: 50px;
    /* height: 40px; */
    border-radius: 100px;
    overflow: hidden;
    /* display: block; */
    /* padding-left: 11px; */
}


    .row-odd {
        background-color: var(--color-bright-yellow);
    }
    .row-even {
        background-color: var(--color-yellow-pastel);
    }
    .current-user {
        border: 5px solid var(--color-white); /* Evidenzia l'utente corrente con un bordo dorato */
        background: var(--color-pink);
    }
.box_itemclassifica .avatar img {
    width: 100%;
    height: 100%;
    /* padding: 6px; */
}
.punti_classifica .badge {
    font-size: 1.5em;
    /* position: absolute; */
    /* top: -15px; */
    /* left: 25px; */
    margin: 0px;
    /* padding: 6px; */
    padding-top: 0;
    margin-right: 0px;
    padding-right: 0px;
    padding-left: 0;
}
.badgeclass .punti_classifica {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
}
.succerimento {
    font-size: .8em;
    opacity: .5;
    padding-bottom: 6px;
    color: #fff;
}
span.posizione {
    /* width: 16px; */
    display: inline-block;
    /* border-radius: 50px; */
    padding: 4px;
    margin-right: 9px;
    font-weight: 900;
    color: var(--pink);
    text-shadow: 1px 1px 0px var(--color-black);
}

.current-user span.posizione {
    color: var(--color-sky-blue);
}
.Risc_0 {
    display: none;
}

.riscossioni.Risc_1 {
    /* width: 40px; */
    height: 40px;
    background-color: #000000;
    position: absolute;
    z-index: 1;
    color: #fff;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    padding: 13px;
    top: 59px;
}
.gost {
	display: none;
}