/** * Skin advanced
	* @author Blancks
*/

/** * Parametri di default nella pagina
*/
body {
	/*background-color: #2a6a8e;*/
	background-color: transparent;
	color: #fff;
	font-family: Trebuchet MS, Georgia;
	size: 12px;
	line-height: 12px;
	overflow: hidden;
}

body.main_body {
	/*background-color: #f39d00;*/
	background-color: transparent;
	margin: 0;
}

body.transparent_body {
	background-color: transparent;
	background-image: none;
	margin: 0;
}

div,
ul,
li {
	margin: 0;
	padding: 0;
}

.blank {
	clear: both;
}

a,
a:visited {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: inherit;
	text-decoration: none;
}

div.form_field table {
	margin: 5px auto;
}

input,
select {
	width: 99%;
}

/*input[type='submit']{
	background:transparent;
	border:none;
	color: #0f2b50;
	font-weight: bolder;
	font-style: normal;
	width:auto;
	cursor: pointer;
}*/

.btn-primary {
	color: #0f2b50;
	font-weight: bolder;
	font-style: normal;
	width: auto;
	cursor: pointer;
}

input[type='submit']:hover {
	color: #363636;
}

div.form_label {
	font-size: 12px;
	font-weight: bolder;
	text-align: center;
}

div.form_info {
	font-size: 12px;
	margin-bottom: 15px;
}

select.day,
select.month,
select.year {
	width: 60px;
	display: inline-block;
}

/** * Stile dei messaggi d'avviso dell'engine */
div.warning,
div.error {
	background-color: #911010;
	background-repeat: repeat;
	font-size: 12px;
	font-family: Georgia;
	color: #fff;
	text-align: center;
	margin: 15px;
	padding: 10px;
	border: solid 1px #000;
	box-shadow: inset 0 0 2px 2px rgba(255, 255, 255, 0.2);

	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}

div.link_back {
	text-align: center;
	background-color: #d1d1d1;
	padding: 2px;
}



/** * Logout */
div.logout_box {
	margin: 20px auto;
	padding: 10px;
	text-align: center;
	background-color: black;
	border: solid 1px #333;
	-moz-border-radius: 5px;
	/* Bordi arrotondati */
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
}

div.logout_box a {
	text-decoration: underline;
	font-style: italic;
}

.logout_body {
	background-color: #3d3d3d;
}

.logout_text {
	color: gold;
	font-family: Trebuchet MS;
	font-size: 14px;
}

/*** TITOLO SEZIONI VERO ***/

.page_title {
	height: auto;
}

.titolopopup {
	font-family: 'Bebas Neue';
	color: #fff;
	font-size: 30px;
	letter-spacing: 1px;
	line-height: 40px;
	height: 40px;
}

.titolopopupocchiello {
	font-family: Georgia;
	font-style: italic;
	font-size: 12px;
	text-transform: none;
	color: #f7ca77;
}


/** * Titoli delle sezioni
*/
div.innertube h2,
div.output h2 {
	font-size: 14px;
	font-weight: bolder;
	margin-top: 0;
}


/** * Stile dei contenitori grigi con i bordini arrotondati
*/

/** PERGAMENA LOCATION **/

div.pagina_info_location {
	height: 530px;
}

div.page_title_loc {
	width: 100%;
	text-align: center;
	color: #3d3d3d;
	position: absolute;
	top: 33px;
	font-family: 'Bebas Neue';
	font-size: 24px;
}

div.info_image {
	text-align: center;
	width: 200px;
	height: 150px;
	border: 1px solid black;
	position: absolute;
	left: 35px;
	top: 65px;
}

img.immagine_luogo {
	width: 200px;
	height: 150px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}


div.box_stato_luogo {
	text-align: center;
	color: #3d3d3d;
	font-size: 12px;
	line-height: 15px;
	font-family: Georgia;
	font-style: italic;
	width: 230px;
	height: 220px;
	background-color: rgba(201, 175, 125, 0);
	position: absolute;
	left: 11px;
	bottom: 30px;
	padding: 10px;
	overflow: auto;
}

div.divider {
	width: 250px;
	height: 1px;
	position: absolute;
	left: 11px;
	top: 256px;
	border-top: 1px dashed #3d3d3d;
}

div.meteobox {
	width: 200px;
	height: 30px;
	position: absolute;
	left: 35px;
	top: 220px;
	background-color: rgba(201, 175, 125, 0.5);
	border: 1px solid #978158;
}

div.meteo,
div.meteo_date {
	text-align: center;
	font-size: 13px;
	line-height: 15px;
	font-family: Georgia;
	color: #000;
	font-weight: 400;
}


/**----**/



div.msgs,
div.presenti,
div.output {
	padding: 25px;
}

div.menu {
	position: absolute;
	top: 317px;
	width: 300px;
	display: inline;
}

div.output {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0px;
	left: 0px;
	width: auto;
	overflow: auto;
	text-align: center;
}

div.popup {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}

@media (max-width : 499px) {
	div.popup {
		overflow-x: scroll;
	}
}

@media (max-height: 820px) {
  .sidebuttons {
    justify-content: space-around;
    gap:0px;
  }
}

div.pagina_servizi_adm_gilde {
	padding: 20px;
}


/** * Informazioni con anteprima luogo
*/




/** * Frame Messaggi
*/
iframe.iframe_messaggi {
    width: 159px;
	height: 68px;
	margin-top: 14px;
    margin-left: -18px;
}


div.pagina_messaggi {
	text-align: center;
	font-size: 14px;
}

div.pagina_messaggi a,
div.pagina_messaggi a:visited {
	text-decoration: none;
	color: #444;
}

div.messaggio_forum_nuovo a,
div.messaggio_forum_nuovo a:visited {
	font-weight: bolder;
	font-style: italic;
	color: #111;
}


/** * Men� di gioco
*/
select#gotomap {
	display: block;
	width: 160px;
	margin: 0 auto 15px auto;
}

div.pagina_gestione div.link_menu {}


div.menu div.link_menu {
	display: inline-block;
}

div.link_menu a {
	display: inline-block;
}

div.link_menu a:hover {}

div.link_menu a.sprite {
	display: block;
	width: 50px;
	height: 50px;
	background: no-repeat top left;
}

div.link_menu a.sprite:hover {
	background-position: 0 100%;
}


/** * Mappa cliccabile */

/** * Posizionamento mappa cliccabile
*/
div.mappaclick_map {
	margin: 20px auto;
}


/** * Link testuali sulla mappa */
div.mappaclick_map a {
	font-size: 13px;
	font-weight: bolder;
}

/** * stile della tooltip di descrizione sulla mappa
*/
div#descriptionLoc {
	position: absolute;
	width: 200px;
	background-color: #cfcfcf;
	padding: 20px;
	font-size: 12px;
	border: solid 1px #666;
	font-family: Verdana, Sans;
	text-align: left;

	-moz-border-radius: 5px;
	/* Bordi arrotondati */
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;

	display: none;
	/*NON TOCCARE* Di configurazione: nasconde la tip in partenza */
	z-index: 9999;
	/*NON TOCCARE* Di configurazione: mostra la tooltip sopra gli altri link */
}

/** Button opw*/
.btn-opw {
	background: url("/imgs/icons/buttontool.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	border: none;
	align-content: center !important;
	text-align: center !important;
	min-width: 170px;
}




/** * Stili relativi all'elenco delle mappe in basso
*/
div.mappaclick_more {
	padding-top: 10px;
}

div.mappaclick_more a {
	padding: 8px;
	margin-right: 10px;
}



/** * Messages center
*/
div.elenco_record_gioco {
	padding: 20px;
}

div.elenco_record_gioco table {
	width: 100%;
	-moz-border-radius: 5px;
	/* Bordi arrotondati */
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
}

div.elementi_elenco {
	padding-top: 5px;
	text-align: center;
	background-color: #3897cd;
}

div.elementi_elenco2 {
	padding-top: 5px;
	text-align: center;
	background-color: transparent;
}

div.titoli_elenco {
	font-size: 13px;
	font-weight: bolder;
}

img.colonna_elengo_messaggi_icon {
	width: 30px;
	height: 30px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}

div.controlli_elenco {
	width: 60px;
}

div.controllo_elenco {
	width: 45px;
	height: 15px;
	display: flex;
	justify-content: center;
}



/** * Ambientazione/Regolamento */
div.user_ambientazione div.elementi_elenco,
div.servizi_abilita div.elementi_elenco {
	text-align: left;
	padding: 5px;
}

div.user_ambientazione td.casella_titolo div.elementi_elenco,
div.servizi_abilita td.casella_titolo div.elementi_elenco {
	font-size: 14px;
	font-weight: bolder;
	padding: 2px 0 2px 10px;
}




/** * Generico per elenchi, bacheche, regolamento, ambientazione etc */
div.capitolo_elenco {
	font-weight: bolder;
	font-size: 13px;
	text-align: left;
	padding: 5px 5px 5px 20px;
}

div.elementi_elenco {
	min-height: 22px;
}

td.casella_elemento,
div.elementi_elenco {
	font-size: 12px;
}

td.casella_elemento,
div.icone_elenco {
	font-size: 12px;
	background-color: #3897cd;
	text-align: center;
}



div.controllo_elenco input[type='image'] {
	height: 15px;
	width: 15px;
	display: block;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}


div.elementi_elenco a {
	font-weight: bolder;
}


div.elementi_elenco a:hover {
	text-decoration: none;
}



/** * Stile tabelle nei moduli di gestione */
div.elenco_record_gestione table {
	width: 95%;
	margin: 10px auto;
}


/** * Accorgimenti Layout */

/** * Allineamento verticale delle colonne
*/
#framecontentLeft,
#framecontentRight {
	display: table;
}

#framecontentRight {
	background: url('imgs/frame_dx.jpg') no-repeat;
	border-left: 3px solid #000;
}


/** * margine delle colonne */
div.innertube {
	margin: 0;
	vertical-align: middle;
}

.table1 {
	border: 0;
	border-radius: 5px;
	width: auto;
	margin: auto auto auto;
	margin-bottom: 15px;
	font-size: 12px;
	font-family: Trebuchet MS;
}

.table2 {
	border: 1px solid #143154;
	background-color: #a5bad3;
	margin: auto;
	width: 90%;
}

.timpoimp {
	font-variant: small-caps;
	font-size: 14px;
	font-family: Georgia;
	color: #3cb9dd;
	letter-spacing: 1px;
	text-align: center;
}

.td1 {
	text-align: left;
	font-family: "Optima";
	color: #f3d400;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0, 0.4);
	font-size: 14px;
	font-style: normal;
	padding: 5px 5px 5px 5px;
}

.td2 {
	text-align: left;
}

.td3 {
	text-align: center;
	height: 20px;
}

.divtaglie {
	width: 100%;
	min-height: 594px;
	background-color: #d8bc87;
	box-shadow: inset 0 0 0 1px #6f4b25, inset 0 0 0 2px #b9a070, inset 0 0 0 4px #c9af7d;
	background-image: url('imgs/bgcarta.png');
	background-repeat: repeat;
	background-size: 256px 256px
}


.tabletaglie {
	width: 100%;
	border: 0;
	font-size: 15px;
	line-height: 25px;
}

.tdtaglie1 {
	color: #3d3d3d;
	font-style: italic;
	font-weight: bolder;
	font-size: 13px;
}


.tdtaglie {
	color: #3d3d3d;
	font-size: 15px;
}

.tdtaglie:hover {
	background-color: rgba(255, 255, 255, 0.15);
}

input.scheda,
select.scheda {
	text-align: center;
	width: 160px;
	padding: 6px;
	border-radius: 5px;
	border: 0;
	background-color: #225979;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.1);
	color: #fff;
}



#ob1 {
	display: flex;
	width: 90px;
	height: 90px;
	top: 15px;
	left: 18%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#ob1:hover,
#ob1:focus,
#ob1:active {
	-webkit-transform: scale(1.1) rotate(2deg);
	transform: scale(1.1) rotate(2deg);
}




#ob2 {
	display: flex;
	width: 90px;
	height: 90px;
	top: -75px;
	left: 30%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#ob2:hover,
#ob2:focus,
#ob2:active {
	-webkit-transform: scale(1.1) rotate(-6deg);
	transform: scale(1.1) rotate(-6deg);
}

#ob3 {
	display: flex;
	width: 90px;
	height: 90px;
	top: -165px;
	left: 42%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}

#ob3:hover,
#ob3:focus,
#ob3:active {
	-webkit-transform: scale(1.1) rotate(4deg);
	transform: scale(1.1) rotate(4deg);
}

#ob4 {
	display: flex;
	width: 90px;
	height: 90px;
	background-size: 90px 90px;
	background-repeat: no-repeat;
	top: -255px;
	left: 54%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#ob4:hover,
#ob4:focus,
#ob4:active {
	-webkit-transform: scale(1.1) rotate(-5deg);
	transform: scale(1.1) rotate(-5deg);
}

#ob5 {
	display: flex;
	width: 90px;
	height: 90px;
	top: -345px;
	left: 66%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#ob5:hover,
#ob5:focus,
#ob5:active {
	-webkit-transform: scale(1.1) rotate(4deg);
	transform: scale(1.1) rotate(4deg);
}

#ob6 {
	display: flex;
	width: 90px;
	height: 90px;
	top: -435px;
	left: 78%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#ob6:hover,
#ob6:focus,
#ob6:active {
	-webkit-transform: scale(1.1) rotate(-7deg);
	transform: scale(1.1) rotate(-7deg);
}



#ob7 {
	display: flex;
	width: 90px;
	height: 90px;
	background-size: 90px 90px;
	background-repeat: no-repeat;
	top: -525px;
	left: 90%;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
}

#ob7:hover,
#ob7:focus,
#ob7:active {
	-webkit-animation-name: bob-float, bob;
	animation-name: bob-float, bob;
	-webkit-animation-duration: .3s, 1.5s;
	animation-duration: .3s, 1.5s;
	-webkit-animation-delay: 0s, .3s;
	animation-delay: 0s, .3s;
	-webkit-animation-timing-function: ease-out, ease-in-out;
	animation-timing-function: ease-out, ease-in-out;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-direction: normal, alternate;
	animation-direction: normal, alternate;
}


@-webkit-keyframes bob {
	0% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}

	50% {
		-webkit-transform: translateY(-4px);
		transform: translateY(-4px);
	}

	100% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}
}

@keyframes bob {
	0% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}

	50% {
		-webkit-transform: translateY(-4px);
		transform: translateY(-4px);
	}

	100% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}
}

@-webkit-keyframes bob-float {
	100% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}
}

@keyframes bob-float {
	100% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}
}

/* attenzione ad usare la classe fade, confligge con bootstrap */
.fade {}

.fade div {}

/* Usato fadeoblo per riferirmi agli oblo nell'header del gioco. Dovuto cambiare la classe fade affincheé non confliggesse con bootstrap e jquery ui*/
.fadeoblo {
	display: block;
}

.fadeoblo div {
	display: none;
	position: absolute;
	top: 0;
	bottom: 0;
}

#range {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#container {
	position: absolute;
	height: 1080px;
}

#mappa {
	background-image: url("imgs/main/mappe/mappa.png");
	background-repeat: no-repeat;
	background-position: top left;
	height: 1080px;
	width: 7000px !important;
	position: absolute;
	z-index: 1;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}


#xxxframecontentBottom {
	background-color: #9c0909;
	background-image: url('imgs/main/bg.png');
	background-size: 1px 4px;
	background-repeat: repeat;
	width: 100%;
	height: 5%;
	position: fixed;
	z-index: 0;
	bottom: 0;
	left: 0;
	-webkit-box-shadow: 10px 10px 15px 19px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 10px 10px 15px 19px rgba(0, 0, 0, 0.75);
	box-shadow: 10px 10px 15px 19px rgba(0, 0, 0, 0.75);
}

#xxxframecontentBottom:before {
	content: "";
	display: block;
	width: 100%;
	height: 2px;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	position: absolute;
	z-index: 0;
	background: rgba(255, 255, 255, 1);
	background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 246, 194, 1) 12%, rgba(255, 215, 35, 1) 27%, rgba(237, 174, 98, 1) 48%, rgba(204, 116, 8, 1) 51%, rgba(255, 206, 0, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(12%, rgba(255, 246, 194, 1)), color-stop(27%, rgba(255, 215, 35, 1)), color-stop(48%, rgba(237, 174, 98, 1)), color-stop(51%, rgba(204, 116, 8, 1)), color-stop(100%, rgba(255, 206, 0, 1)));
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 246, 194, 1) 12%, rgba(255, 215, 35, 1) 27%, rgba(237, 174, 98, 1) 48%, rgba(204, 116, 8, 1) 51%, rgba(255, 206, 0, 1) 100%);
	background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 246, 194, 1) 12%, rgba(255, 215, 35, 1) 27%, rgba(237, 174, 98, 1) 48%, rgba(204, 116, 8, 1) 51%, rgba(255, 206, 0, 1) 100%);
	background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 246, 194, 1) 12%, rgba(255, 215, 35, 1) 27%, rgba(237, 174, 98, 1) 48%, rgba(204, 116, 8, 1) 51%, rgba(255, 206, 0, 1) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 246, 194, 1) 12%, rgba(255, 215, 35, 1) 27%, rgba(237, 174, 98, 1) 48%, rgba(204, 116, 8, 1) 51%, rgba(255, 206, 0, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffce00', GradientType=0);

}

#avatarouter {
	display: inline-block;
	width: 144px;
	height: 144px;
	background-image: url(imgs/console.png);
	background-repeat: no-repeat;
	position: fixed;
	z-index: 9;
	left: 4px;
	bottom: 8px;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}


#avatarouter:hover,
#avatarouter:focus,
#avatarouter:active {
	-webkit-transform: rotate(30deg);
	transform: rotate(30deg);
}


#avatarcont {
	width: 144px;
	height: 144px;
	position: fixed;
	z-index: 8;
	left: 4px;
	bottom: 8px;
}

#avatarinner {
	width: 98px;
	height: 98px;
	overflow: hidden;
	position: relative;
	top: 23px;
	left: 23px;
	border-radius: 70px;
	z-index: 8;
}

#statusbox {
	width: 100%;
	height: 5px;
	border: 1px solid inset rgba(0, 0, 0, 0.3);
	position: fixed;
	z-index: 2;
	top: 4px;
	left: 0;
}


#flexcontainer {
	display: inline-flex;
	flex-flow: row wrap;
	/*flex flow non funziona se non mettiamo display: flex su ogni items. Strano però, essendo dentro a un flex container, dovrebbero tutti essere flex items.*/
	justify-content: space-evenly;
	width: 100%;
	height: 50px;
	position: relative;
	top: 0px;
}

#ccontainer {
	display: inline-flex;
	flex-flow: row wrap;
	/*flex flow non funziona se non mettiamo display: flex su ogni items. Strano però, essendo dentro a un flex container, dovrebbero tutti essere flex items.*/
	justify-content: space-evenly;
	background-image: url('imgs/main/bg_ccontainer.png');
	background-size: 32px 50px;
	background-repeat: repeat-x;
	width: 100%;
	height: 50px;
}


.marquee {
	height: 20px;
	overflow: hidden;
}

.marquee p {
	position: relative;
	width: 100%;
	height: 100%;
	margin: 15px;
	line-height: 20px;
	text-align: center;
	white-space: nowrap;
	font-family: 'Roboto', sans-serif;
	size: 20px;
	color: #fff;
	text-shadow: rgb(0, 0, 0) 1px 0px 0px,
		rgb(0, 0, 0) 0.533333px 0.833333px 0px,
		rgb(0, 0, 0) -0.416667px 0.916667px 0px,
		rgb(0, 0, 0) -0.983333px 0.133333px 0px,
		rgb(0, 0, 0) -0.65px -0.75px 0px,
		rgb(0, 0, 0) 0.283333px -0.966667px 0px,
		rgb(0, 0, 0) 0.966667px -0.283333px 0px;
	letter-spacing: 1.8px;
	/* Starting position */
	-moz-transform: translateX(100%);
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	/* Apply animation to this element */
	-moz-animation: scroll-left 40s linear infinite;
	-webkit-animation: scroll-left 40s linear infinite;
	animation: scroll-left 40s linear infinite;
}

/* Move it (define the animation) */
@-moz-keyframes scroll-left {
	0% {
		-moz-transform: translateX(100%);
	}

	100% {
		-moz-transform: translateX(-100%);
	}
}

@-webkit-keyframes scroll-left {
	0% {
		-webkit-transform: translateX(100%);
	}

	100% {
		-webkit-transform: translateX(-100%);
	}
}

@keyframes scroll-left {
	0% {
		-moz-transform: translateX(100%);
		/* Browser bug fix */
		-webkit-transform: translateX(100%);
		/* Browser bug fix */
		transform: translateX(100%);
	}

	100% {
		-moz-transform: translateX(-100%);
		/* Browser bug fix */
		-webkit-transform: translateX(-100%);
		/* Browser bug fix */
		transform: translateX(-100%);
	}
}

#breaking {
	position: fixed;
	min-width: 2000px;
	z-index: 4;
	top: 18px;
	left: -1px;
}


/*	   .box {position: relative;color: #fff;border: 1px solid #000;padding: 2px;border-radius: 8px 6px 8px 6px;background: linear-gradient(to bottom, #ffeea0 0%, #ffd514 30%, #ffba00 40%, #cd6f00 45%, #ffae00 64%, #ffd100 77%, #ffe570 82%, #ffe570 100%);}

		   .box::before {
		   content: "";
		   display: block;
		   width: 14px;
		   height: 14px;
		   position: absolute;
		   z-index: 2;
		   background-image: url("imgs/swirl.svg");
		   top: -1px;
		   right: -1px;
		   }

		   .box::after {
		   content: "";
		   display: block;
		   width: 14px;
		   height: 14px;
		   position: absolute;
		   z-index: 2;
		   background-image: url("imgs/swirl.svg");
		   bottom: -1px;
		   left: -1px;
		   transform:rotate(180deg);
		   -ms-transform: rotate(180deg);
		   -webkit-transform: rotate(180deg);
		   } */

#menu_icon {
	position: absolute;
	left: 50%;
	margin-left: -80px;
	top: 50%;
	width: 185px;
	height: 208px;

}

.wcircle-menu-item {
	display: inline-block;
	width: 200px;
	height: 50px;
	margin-left: -75px;
	background-image: url(imgs/spider_icon.png);
	background-repeat: no-repeat;
}

.wcircle-menu-item:hover,
.wcircle-menu-item:focus,
.wcircle-menu-item:active {
	margin-left: -72px;
}

.loc {
	width: 163px;
	height: 16px;
	background-color: #3d3d3d;
	position: absolute;
	left: 5px;
	top: 4px;
	text-align: center;
	color: #fff;
	font-family: Verdana;
	font-size: 10px;
	line-height: 16px;
}

.thumbloc {
	width: 158px;
	height: 20px;
	background-color: rgba(0, 0, 0, 0);
	position: absolute;
	right: 4px;
	bottom: 4px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}


div.assistenza {
	position: fixed;
	right: 20px;
	bottom: 20px;
}




.boxciurma {
	background-color: #2a6a8e;
	width: 804px;
	height: 594px;
	border: 1px solid #000;
	box-shadow: inset 0px 0px 0px 2px #f3d400;
	border-radius: 10px;
	position: absolute;
	left: 50%;
	margin-left: -402px;
	top: 50px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;

}

.containerciurma {
	width: 800px;
	height: 590px;
	position: absolute;
	top: 2px;
	left: 2px;
	background-image: url('bgs.png');
	background-repeat: repeat;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border-radius: 8px;
}



.pergamociurma {
	position: absolute;
	top: 7px;
	left: 7px;
	width: 484px;
	height: 60px;
	background-color: #cdcdcd;
	box-shadow: inset 0 0 2px 3px rgba(0, 0, 0, 0.2);
	border: 1px solid #72330a;
	border-radius: 6px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	background-image: url('wood.png');
	background-repeat: repeat;
}

/***	.pergamonameciurma {
	width: 470px;
	height: 46px;
	position: absolute;
	top: 3px;
	left: 14px;
	color: transparent;
	font-family: 'Targa';
	text-transform: uppercase;
	line-height: 46px;
	font-size: 28px;
	letter-spacing: 1px;
	  -webkit-background-clip: text;
	  background-clip: text;
	text-align: center;
	text-stroke: 1px #000;
	-webkit-text-stroke: 1px #000;
	font-weight: 1000;
	background-image: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
	background-image: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(1%, rgba(255,255,255,1)), color-stop(14%, rgba(255,246,194,1)), color-stop(40%, rgba(255,216,35,1)), color-stop(50%, rgba(208,115,1,1)), color-stop(100%, rgba(255,204,0,1)));
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
	background-image: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
	background-image: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
	background-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
	} ***/


/* Add this attribute to the element that needs a tooltip 
[data-tooltip] {
	z-index: 2;
	cursor: pointer;
}

/* Hide the tooltip content by default 
[data-tooltip]:before,
[data-tooltip]:after {
	visibility: hidden;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	pointer-events: none;
}

/* Position tooltip above the element 
[data-tooltip]:before {
	position: absolute;
	bottom: 110%;
	left: 50%;
	margin-bottom: 5px;
	margin-left: -32px;
	padding: 8px;
	width: 50px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background-color: #fa2323;
	color: #fff;
	content: attr(data-tooltip);
	text-align: center;
	font-size: 10px;
	line-height: 10px;
	font-family: Verdana;
	box-shadow: 0 0 0 2px #c60b0b inset, 0 0 0 4px #e51919 inset;
	-webkit-animation-name: data-float, data;
	animation-name: data-float, data;
	-webkit-animation-duration: .3s, 1.5s;
	animation-duration: .3s, 1.5s;
	-webkit-animation-delay: 0s, .3s;
	animation-delay: 0s, .3s;
	-webkit-animation-timing-function: ease-out, ease-in-out;
	animation-timing-function: ease-out, ease-in-out;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-direction: normal, alternate;
	animation-direction: normal, alternate;
}

/* Triangle hack to make tooltip look like a speech bubble 
[data-tooltip]:after {
	position: absolute;
	bottom: 110%;
	left: 50%;
	margin-left: -5px;
	width: 0;
	border-top: 5px solid #c60b0b;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	content: " ";
	font-size: 0;
	line-height: 0;
	-webkit-animation-name: data-float, data;
	animation-name: data-float, data;
	-webkit-animation-duration: .3s, 1.5s;
	animation-duration: .3s, 1.5s;
	-webkit-animation-delay: 0s, .3s;
	animation-delay: 0s, .3s;
	-webkit-animation-timing-function: ease-out, ease-in-out;
	animation-timing-function: ease-out, ease-in-out;
	-webkit-animation-iteration-count: 1, infinite;
	animation-iteration-count: 1, infinite;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-direction: normal, alternate;
	animation-direction: normal, alternate;
}

/* Show tooltip content on hover 
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
	visibility: visible;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
}

@-webkit-keyframes data {
	0% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}

	50% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	100% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}

@keyframes data {
	0% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}

	50% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	100% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}

@-webkit-keyframes data-float {
	100% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}

@keyframes data-float {
	100% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}

*/
[data-tooltip] {
	--arrow-size: 5px;
	position: relative;
	z-index: 10;
  }
  
  /* Positioning and visibility settings of the tooltip */
  [data-tooltip]:before,
  [data-tooltip]:after {
	position: absolute;
	visibility: hidden;
	opacity: 0;
	left: 50%;
	bottom: calc(100% + var(--arrow-size));
	pointer-events: none;
	transition: 0.2s;
	will-change: transform;
  }
  
  /* The actual tooltip with a dynamic width */
  [data-tooltip]:before {
	content: attr(data-tooltip);
	padding: 10px 18px;
	min-width: 50px;
	max-width: 300px;
	width: max-content;
	height: fit-content;
	width: -moz-max-content;
	border-radius: 6px;
	font-size: 14px;
	background-color: #fa2323;
	background-image: linear-gradient(30deg,
	  rgba(133, 50, 36, 0.44),
	  rgba(133, 50, 36, 0.44),
	  rgba(133, 50, 36, 0.44));
	box-shadow: 0px 0px 24px rgba(255, 0, 0, 0.2);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	
	color: #fff;
	text-align: center;
	white-space: pre-wrap;
	transform: translate(-50%,  calc(0px - var(--arrow-size))) scale(0.5);
  }
  
  /* Tooltip arrow */
  [data-tooltip]:after {
	content: '';
	border-style: solid;
	border-width: var(--arrow-size) var(--arrow-size) 0px var(--arrow-size); /* CSS triangle */
	border-color: rgba(192, 47, 47, 0.9) transparent transparent transparent;
	transition-duration: 0s; /* If the mouse leaves the element, 
								the transition effects for the 
								tooltip arrow are "turned off" */
	transform-origin: top;   /* Orientation setting for the
								slide-down effect */
	transform: translateX(-50%) scaleY(0);
  }
  [data-tooltip-color="blue"]:before {
	background-color: #23f3fa;
	background-image: linear-gradient(30deg,
			rgba(36, 133, 133, 0.44),
			rgba(59, 68, 75, 0.44),
			rgba(60, 82, 88, 0.44));
	box-shadow: 0px 0px 24px rgba(0, 238, 255, 0.2);
  }
  [data-tooltip-color="blue"]:after {
	border-color: rgba(47, 134, 192, 0.9) transparent transparent transparent;
  }
  
  /* Tooltip becomes visible at hover */
  [data-tooltip]:hover:before,
  [data-tooltip]:hover:after {
	visibility: visible;
	opacity: 1;
  }
  /* Scales from 0.5 to 1 -> grow effect */
  [data-tooltip]:hover:before {
	transition-delay: 0.3s;
	transform: translate(-50%, calc(0px - var(--arrow-size))) scale(1);
  }
  /* 
	Arrow slide down effect only on mouseenter (NOT on mouseleave)
  */
  [data-tooltip]:hover:after {
	transition-delay: 0.5s; /* Starting after the grow effect */
	transition-duration: 0.2s;
	transform: translateX(-50%) scaleY(1);
  }
  /*
	That's it for the basic tooltip.
  
	If you want some adjustability
	here are some orientation settings you can use:
  */
  
  /* LEFT */
  /* Tooltip + arrow */
  [data-tooltip-location="left"]:before,
  [data-tooltip-location="left"]:after {
	left: auto;
	right: calc(100% + var(--arrow-size));
	bottom: 50%;
  }
  
  /* Tooltip */
  [data-tooltip-location="left"]:before {
	transform: translate(calc(0px - var(--arrow-size)), 50%) scale(0.5);
  }
  [data-tooltip-location="left"]:hover:before {
	transform: translate(calc(0px - var(--arrow-size)), 50%) scale(1);
  }
  
  /* Arrow */
  [data-tooltip-location="left"]:after {
	border-width: var(--arrow-size) 0px var(--arrow-size) var(--arrow-size);
	border-color: transparent transparent transparent rgba(192, 47, 47, 0.9);
	transform-origin: left;
	transform: translateY(50%) scaleX(0);
  }
  [data-tooltip-location="left"]:hover:after {
	transform: translateY(50%) scaleX(1);
  }
  
  
  
  /* RIGHT */
  [data-tooltip-location="right"]:before,
  [data-tooltip-location="right"]:after {
	left: calc(100% + var(--arrow-size));
	bottom: 50%;
  }
  
  [data-tooltip-location="right"]:before {
	transform: translate(var(--arrow-size), 50%) scale(0.5);
  }
  [data-tooltip-location="right"]:hover:before {
	transform: translate(var(--arrow-size), 50%) scale(1);
  }
  
  [data-tooltip-location="right"]:after {
	border-width: var(--arrow-size) var(--arrow-size) var(--arrow-size) 0px;
	border-color: transparent rgba(192, 47, 47, 0.9) transparent transparent;
	transform-origin: right;
	transform: translateY(50%) scaleX(0);
  }
  [data-tooltip-location="right"]:hover:after {
	transform: translateY(50%) scaleX(1);
  }
  
  
  
  /* BOTTOM */
  [data-tooltip-location="bottom"]:before,
  [data-tooltip-location="bottom"]:after {
	top: calc(100% + var(--arrow-size));
	bottom: auto;
  }
  
  [data-tooltip-location="bottom"]:before {
	transform: translate(-50%, var(--arrow-size)) scale(0.5);
  }
  [data-tooltip-location="bottom"]:hover:before {
	transform: translate(-50%, var(--arrow-size)) scale(1);
  }
  
  [data-tooltip-location="bottom"]:after {
	border-width: 0px var(--arrow-size) var(--arrow-size) var(--arrow-size);
	border-color: transparent transparent rgba(192, 47, 47, 0.9) transparent;
	transform-origin: bottom;
  }
  [data-tooltip-location="bottom"]:after,
  [data-tooltip-color="blue"][data-tooltip-location="bottom"]:after {
	border-width: 0px var(--arrow-size) var(--arrow-size) var(--arrow-size);
	border-color: transparent transparent rgba(47, 163, 192, 0.9) transparent;
	transform-origin: bottom;
  }
 

.legnoext {
	width: 100%;
	min-height: 50px;
	background-image: url('imgs/wood.png');
	background-repeat: repeat;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border: 1px solid #000;
	border-radius: 8px 8px 0 0;
	margin: auto;
}

.legnoext1 {
	width: 698px;
	min-height: 50px;
	background-image: url('imgs/wood.png');
	background-repeat: repeat;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border: 1px solid #000;
	border-radius: 8px 8px 0 0;
	margin: auto;
}

.legnoext2 {
	background-image: url('imgs/gruppi/bg.png');
	background-repeat: repeat;
	width: 698px;
	min-height: 50px;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border: 1px solid #000;
	border-radius: 8px 8px 0 0;
	margin: auto;
}

.legnoext3 {
	background-image: url('imgs/gruppi/bgvt.png');
	background-repeat: repeat;
	background-color: #296368;
	width: 698px;
	min-height: 50px;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border: 1px solid #000;
	border-radius: 8px 8px 0 0;
	margin: auto;
}


.legnoext4 {
	background-image: url('imgs/gruppi/bgoff.png');
	background-size: 3px 3px;
	background-color: #3d3d3d;
	width: 698px;
	min-height: 50px;
	background-repeat: repeat;
	box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.4);
	border: 1px solid #000;
	border-radius: 8px 8px 0 0;
	margin: auto;
}



.carta {
	width: 658px;
	height: auto;
	padding: 10px;
	position: relative;
	margin-top: 10px;
	left: 10px;
	margin-bottom: 10px;
	background-color: #d8bc87;
	box-shadow: inset 0 0 0 1px #6f4b25, inset 0 0 0 2px #b9a070, inset 0 0 0 4px #c9af7d;
	background-image: url('imgs/bgcarta.png');
	background-repeat: repeat;
	background-size: 256px 256px;
}

.carta1 {
	width: 98%;
	height: auto;
	padding: 1%;
	position: relative;
	margin:1%;
	background-color: #d8bc87;
	box-shadow: inset 0 0 0 1px #6f4b25, inset 0 0 0 2px #b9a070, inset 0 0 0 4px #c9af7d;
	background-image: url('imgs/bgcarta.png');
	background-repeat: repeat;
	background-size: 256px 256px;
}

.intest {
	width: 406px;
	text-align: center;
	font-size: 27px;
	letter-spacing: 1px;
	height: 25px;
	line-height: 30px;
	color: #3d3d3d;
	font-family: 'Bebas Neue';
}

.listone {
	width: 100%;
	border-collapse: collapse;
}

.listone th {
	font-family: Georgia;
	color: #a60909;
	font-size: 11px;
	border-bottom: 1px dashed #3d3d3d;
	text-align: center;
	height: 20px;
	line-height: 20px;
}

.listone td {
	height: 33px;
	line-height: 33px;
	font-family: Georgia;
	font-size: 13px;
	color: #3d3d3d;
}


.nomec {
	min-width: 180px;
}


.timgciurma {
	float: left;
	position: relative;
	top: 3px;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}

.tnomec {
	min-width: 150px;
	font-style: italic;
}

.tfamac {
	width: 104px;
	text-align: center;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
}

.tfamac img {
	position: relative;
	top: 4px;
}

.tpoterec,
.tsoldic,
.tpgc,
.ttipoc {
	text-align: center;
}

.tipolista {
	width: 100%;
	height: 60px;
	position: relative;
	line-height: 36px;
	left: 10px;
	margin-top: 2px;
	text-align: center;
	font-size: 18px;
}

.tipolista img {
	position: relative;
	top: 7px;
}


.base_taglie {
	width: 129px;
	height: 191px;
	position: absolute;
	z-index: 9999;
}

.base_taglie:hover {
	box-shadow: 0px 0px 15px #f4f1d3;
}








.sidebuttons {
	width: 60px;
	height: 90%;
	position: fixed;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-end;
	gap: 14px;
	z-index: 10;
	top: 54px;
	right: 0;
}

.besci {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_escih.png);
	background-repeat: no-repeat;
	position: relative;
}

.besci:hover {
	background-image: url(imgs/bottone_esci.png);
	background-repeat: no-repeat;
	width: 140px;
}

.bforum {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_forum.png);
	background-repeat: no-repeat;
	position: relative;
}

.bforum:hover {
	background-image: url(imgs/bottone_forumh.png);
	background-repeat: no-repeat;
	width: 140px;
}

.bonline {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_online.png);
	background-repeat: no-repeat;
	position: relative;
}

.bonline:hover {
	background-image: url(imgs/bottone_onlineh.png);
	background-repeat: no-repeat;
	width: 140px;
	z-index: 11;
}

.bgruppi {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_gruppi.png);
	background-repeat: no-repeat;
	position: relative;
}

.bgruppi:hover {
	background-image: url(imgs/bottone_gruppih.gif);
	background-repeat: no-repeat;
	width: 140px;
}

.bguida {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_guida.png);
	background-repeat: no-repeat;
	position: relative;

}

.bguida:hover {
	background-image: url(imgs/bottone_guidah.png);
	background-repeat: no-repeat;
	width: 140px;
}

.binfo {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_info.png);
	background-repeat: no-repeat;
	position: relative;
}

.binfo:hover {
	background-image: url(imgs/bottone_infoh.gif);
	background-repeat: no-repeat;
	width: 140px;
}

.btools {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_tools.png);
	background-repeat: no-repeat;
	position: relative;
}

.btools:hover {
	background-image: url(imgs/bottone_toolsh.png);
	background-repeat: no-repeat;
	width: 140px;
}

.bquest {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_quest.png);
	background-repeat: no-repeat;
	position: relative;
}

.bquest:hover {
	background-image: url(imgs/bottone_questh.gif);
	background-repeat: no-repeat;
	width: 140px;
}

.bquest>a {
	opacity: 0;
}

.bposta {
	width: 60px;
	height: 59px;
	background-image: url(imgs/bottone_posta.png);
	background-repeat: no-repeat;
	position: relative;
}

.bposta:hover {
	background-image: url(imgs/bottone_postah.gif);
	background-repeat: no-repeat;
	width: 140px;
}

.bpostanew {
	width: 140px;
	height: 59px;
	background-image: url(imgs/posta_mex.gif);
	background-repeat: no-repeat;
	position: relative;
}


#timone {
	width: 41px;
	height: 41px;
	position: fixed;
	z-index: 8;
	left: 130px;
	bottom: 130px;
	background-image: url(imgs/timone.png);
	background-repeat: no-repeat;

}

/* 12/2019
 * Edit by Truerick
 * Per definire meglio alcuni spazi nella gestione del mercato creo delle classi ad-hoc */
.v-spacer {
	margin: 10px 0;
	border-bottom: 1px solid #fff;
}

table.marketManagement {
	width: 650px;
	margin: 0 auto;
}

table.marketManagement,
table.marketManagement th,
table.marketManagement td {
	border: 1px solid #fff;
}

table.marketManagement th {
	background: #fff;
	color: #245E7F;
}

table.marketManagement th,
table.marketManagement td {
	padding: 3px 0;
}

.mapIsland.unavailable {
	cursor: not-allowed;
	opacity: .7;
}

.wcircle-menu {
	display: none;
}

.wcircle-menu-item {
	cursor: pointer;
	z-index: 999;
}

.pagina_gestione_mappe .map_items {
	width: 33%;
	float: left;
}

.pagina_gestione_mappe input[type="checkbox"] {
	display: inline-block;
	width: 50px;
}

.pagina_gestione_mappe_accessi .del {
	cursor: pointer;
	color: red;
}

.pagina_gestione_mappe_accessi select {
	width: auto !important;
	display: inline-block;
}

#youShallNotPass {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 360px;
	height: 60px;
	margin-left: -180px;
	margin-top: -30px;
	text-align: center;
	line-height: 30px;
	font-size: 20px;
	background: #D78500;
	color: #000;
	border-radius: 12px;
	border: 2px solid #8C2F09;
	padding: 30px 0;
}

.unchainedIsland {
	cursor: pointer;
	width: 125px;
	height: 17px;
	background-image: url(imgs/main/island_tag.png);
	margin: auto;
	margin-top: 20px;
	background-repeat: no-repeat;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	font-family: 'Novinik';
	font-size: 8px;
	text-align: center;
	line-height: 18px;
	text-transform: uppercase;
}

.chainedIsland {
	width: 125px;
	height: 17px;
	background-image: url(imgs/main/island_tag_locked.png);
	background-repeat: no-repeat;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	font-family: 'Novinik';
	font-size: 8px;
	text-align: center;
	line-height: 18px;
	text-transform: uppercase;
}

.logquestcontainer {
	background-image: url(imgs/main/bg_grey_logquest.png);
	background-size: 26px 13px;
	background-repeat: repeat;
	width: 100%;
	height: 592px;
	overflow-y: auto;
	overflow-x: hidden;
}

.logquestbox {
	margin: auto;
	width: 100%;
}

.logquesttitle {
	margin: auto;
	width: 800px;
	height: 35px;
	text-align: center;
	margin-top: 27px;
	margin-bottom: 17px;
	font-family: 'Bernard';
	text-transform: uppercase;
	font-size: 35px;
	letter-spacing: 1px;
	color: #9e2121;
	border-bottom: 1px dashed #3d3d3d;
}

.stripfama {
	text-align: center;
	height: 17px;
	line-height: 17px;
	display: flex;
	justify-content: center;
	margin-top: 5px;
	margin-bottom: 5px;
}

.link_back_posta {
	width: 200px;
	height: 39px;
	background-image: url(imgs/mercato/box_tornaindietro.png);
	background-repeat: no-repeat;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 39px;
	font-family: 'Bernard';
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: auto;
}

.link_back_posta:active {
	position: relative;
	top: 2px;
}

.container {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100vw;
	height: 100svh;
	overflow: hidden;
}

.items {
	height: 100%;
	width: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	cursor: move;
	transition: all 0.2s;
	will-change: transform;
	background: transparent;
	flex-grow: 1;

}

.maps {
	height: 3240px;
	width: 7000px;
	background-image: url("/themes/advanced/imgs/maps/mappa.png");
	background-repeat: no-repeat;
}

.island {
	background-repeat: no-repeat;
	background-size: contain;
	width: fit-content;
	height: fit-content;
}

.statusbox {
	background-image: url('/themes/advanced/imgs/main/bg_ccontainer.png');
	background-size: 32px 50px;
	background-repeat: repeat-x;
	width: 100%;
	height: 50px;
	flex-shrink: 0;
}