/** * Skin Advanced
	* Il presente files regola gli stili CSS della homepage
	* @author Blancks
*/


/** * STILI DEI CONTENUTI DEL SITO */

/** * Titolo del sito
*/
h1{
	margin:0;
	padding:30px 0 0 76px;
	font-size:38px;
	font-family:Myriad Pro,Myriad Web Pro Regular,Lucida Grande,Geneva,Trebuchet MS,sans-serif;
}

/** * Stile del link sul titolo */
h1 a, h1 a:visited, h1 a:hover{
	color:#a28c73;
	text-decoration:none;
}

body.main_body {
	margin:0;
}
/** * Sottotitolo
*/
div.subtitle{
	margin-left:78px;
	color:#a28c73;
	font-size:13px; 
}

/** * Stili del form di login
*/
div.login_form{
	width:200px;
    margin: auto;
    margin-top: 70px;
   
}

/** * stile che ingloba i gruppi label/input
*/
div.login_form div{
	margin-bottom:4px;
   
}

/** * Stile per le label dei form
*/
span.form_label{
	text-align:left;
	font-weight:bolder;
	color: #cecece;
	font-family: 'nyala'; 

}

div.login_form input{
	width:145px;
	margin:0;
    background-color: #40434a;
    color: #cecece;
    border-style: double;
    border-color: #424245;
	font-family: 'nyala'; 

}

/** * Stile per il bottone del login
*/
div.login_form input[type='submit']{
	display:block;
	float:none;
	width:200px;
    margin-top: 10px;
    background-color: #40434a;
    color: #cecece;
    border-style: double;
    border-color: #424245;
}
/* Fonts */

@font-face {
	font-family: Got;
	src: url(../../advanced/fonts/GOT.ttf);
}


@font-face {
	font-family: Nyala;
	src: url(../../advanced/fonts/nyala.ttf);
}

@font-face {
	font-family: Celtica;
	src: url(../../advanced/fonts/Celtica-Book.ttf);
}


/** * Contenuti principali della pagina
*/

/** * Titolo della sezione */
h2{
font-size: 20px;
    font-weight: normal;
    margin: 0;
    text-decoration: underline;
    color: #131520;
    font-family: 'Got';
    text-align: center;

}

/** * Contenuti testuali */
div.content_body p{
	font-size:13px;
	padding:0 10px;
}


div.content_body a{
	color:#cecece;
	text-decoration:underline;
}



/** * Men� di navigazione
*/
div.sidecontent ul{
    margin-left: 15px;
	padding: 5px;
	background-color: transparent;
	list-style-type:none;
}

/** * Contenitore delle voci nel men� 
*/
div.sidecontent ul li{
	margin-bottom:5px; 
}

/** * Link voce men� 
*/
div.sidecontent ul li a, div.sidecontent ul li a:visited{
	width: 200px;
	text-decoration:none;
	display:block;
	font-size:13px;
	padding:2px;
    background-color: #1b2330;
    border-color: #4b4e54 #70747d #4b4e54 #70747d;
    background: linear-gradient(#051120, #1a1f21 10%, #0b0e0d 100%);
   	color: #cecece;
    border: 1px solid #111111;
    margin: auto;
    text-align: center;
    text-transform: uppercase;
    font-family: "GOT";
	letter-spacing: .2rem;
    opacity: 0.7;
}

/** * Link voce men� al passaggio del mouse
*/
div.sidecontent ul li a:hover{
	width: 200px;
    background-color: #252a33;
   	color: #cecece;
    border-color: #4b4e54 #70747d #4b4e54 #70747d;
    background: linear-gradient(#051120, #1a1f21 10%, #0b0e0d 100%);
    text-align: center;
   	font-size:13px;
    text-transform: uppercase;
    font-family: "GOT";
	letter-spacing: .2rem;
    margin: auto;
    opacity: 0.7;
}


/** Stile generico contenitore per altri contenuti nella sidebar 
*/
div.side_modules{
	margin-top: 5px;
    background-color: transparent;
	padding:5px;
	text-align:center;
    margin-right: 10px;
	color: #cecece;
	font-family: 'nyala'; 

}

div.side_modules .form_label{font-size:10px; margin-right:2px;}


/** * Tabella statistiche */
table.statistics{
	text-align:right;
	margin-top:10px;
	font-size:10px;
    background-color:#515a70; /** * Stile di colorazione righe dispari */
}

table.statistics td{padding-right:5px;}

/** * Stile di colorazione per definire le righe pari */
table.statistics tr.pair{
	background-color:#3a476c;
}

/** * Stile per definire il titolo del parametro statistico */
table.statistics td.label{
	font-weight:bolder;
	text-align:left;
	padding:2px;
    background-color: #2f3a57;

}



/** * Recupero password */
div.pass_rec{
margin: auto;
    margin-top: 10px;
    width: 200px;
}

input#passrecovery{
	width:126px;
    background-color: #40434a;
    color: #cecece;
    border-style: double;
    border-color: #424245;
}

div.pass_rec input[type='submit']{margin-top:3px;}



/** * Footer info */
div#footer div{
	background-color:#40434a;
	padding:5px 0 3px 0;
    border-radius: 5px;
}

div#footer p{
	font-size:10px;
	margin:0;
	padding:0 15px 2px 15px;
	text-align:center; 
    
}




/** * LAYOUT SITO */

/** * Struttura contenitore di tutto il sito 
*/
div#main{ 
   width: 100vw; 
    height: 100vh; 
    overflow: hidden; 
    position: relative;
	text-align:center;
    background-image: url('https://theeyrie.altervista.org/themes/homepage/advanced/img/homepage_base.jpg'); 
 	background-repeat: no-repeat;
    background-position: center center;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    text-align: center;
    display: table;
    object-fit: cover;
}


/** * Larghezza della struttura del sito
*/
div#site_width{
	margin:0 auto;
	text-align:left;
}

div.disclaimer_iscrizione {
background: #404147;
color: #cecece;
text-align: justify;
padding: 10px;
border: 1px #cecece solid;

}

div.form_info {
color: #cecece;
}

div.form_label {
color: #cecece;

}

div.form_field {
color: #cecece;

}

div.titoli_elenco {
color: #cecece;

}

div.elementi_elenco {
color: #cecece;

}

div.error {
color: #cecece;

}

div.welcome_message {
color: #cecece;

}

div.username {
color: #cecece;

}

/** * Header
*/
div#header{
	height:180px;
}


/** * Corpo contenuti della pagina
*/
div#content{
	padding:0 60px 10px 60px;
}

/** * Struttura colonna di lato sx
*/
div.sidecontent{
	/*margin-top: -100px;*/
    width: 440px;
    height: 440px;
    background-color: rgba(3, 2, 8, 0.3);
    border-radius: 100%;
    border: 2px solid #1a1a1a;
    box-shadow: 10px 10px 8px #000000;
    display: block;
	margin: auto;
    margin-top: -150px;

}

/** * Struttura corpo contenuti pagina 
*/
div.content_body{
	margin: 20px;
	float:left;
    background-color: transparent;
}


/** * pie di pagina
*/
div#footer{
	height:68px;
	padding:8px 59px 0 59px;
}


/** *** Fine stili regolatori del layout *** */

div.user_ambientazione div.elenco_record_gioco, div.user_regolamento div.elenco_record_gioco {
	height: 500px;
	overflow: auto;
}
div.user_ambientazione div.elenco_record_gioco div.elementi_elenco, div.user_regolamento div.elenco_record_gioco div.elementi_elenco {
	text-align: justify;
}

div.pagina_iscrizione {
	    background: #3d3e40;
    padding: 5px;
    border-radius: 5px;
}


input[type='submit'] {
    display: block;
    float: none;
    width: 200px;
    margin-top: 10px;
    background-color: #40434a;
    color: #cecece;
    border-style: double;
    border-color: #424245;
	font-family: 'nyala';
}

div.button_cont_home{
	display: flex;
	justify-content: center;
}


/** Stile modal scheda */
.ui-widget-header {
	color: #cfcfcf !important;
    font-family: 'Got';
    text-shadow: 1px 1px 6px rgb(0 0 0);
    font-size: 2.7vh;
    text-align: center;
    font-weight: normal !important;
    height: 2vh;
	background: #111111 !important;
	border: 0 !important;
}
	
.ui-widget-content {
}

.ui-widget.ui-widget-content {
	z-index: 9999;
	border: 2px solid black !important;
		 background: #000000 !important;
}

.ui-draggable .ui-dialog-titlebar {
    margin: -3px !important;
}
.ui-dialog .ui-dialog-title {
float: none !important;
}
.ui-dialog .ui-dialog-content {
    margin: 1px !important;
	border-top: 1px solid black !important ;
	 margin-top: 3px !important; 
}


body { background:black;}


.manual_container {
    top: 180px !important;
    margin-left: 200px !important;
    height: 90% !important;
}
body.main_body > div.pagina_iscrizione,
body.main_body > div.user_regolamento {
	box-sizing: border-box;
	width: calc(100% - 24px);
	max-width: 860px;
	margin: 12px auto;
	background: #3d3e40;
	padding: 12px;
	border-radius: 5px;
	color: #cecece;
}

body.main_body > div.pagina_iscrizione .page_body,
body.main_body > div.user_regolamento .page_body {
	max-height: 560px;
	overflow: auto;
	padding-right: 6px;
}

body.main_body > div.pagina_iscrizione .panels_box,
body.main_body > div.user_regolamento .panels_box {
	box-sizing: border-box;
	width: 100%;
}

body.main_body > div.pagina_iscrizione .form_gioco {
	max-width: 620px;
	margin: 0 auto;
}

body.main_body > div.pagina_iscrizione .form_field table {
	width: auto;
	max-width: 100%;
}

body.main_body > div.pagina_iscrizione .form_field td {
	padding-right: 8px;
	white-space: nowrap;
}

body.main_body > div.user_regolamento div.elenco_record_gioco {
	height: 540px;
}

body.main_body > div.user_regolamento table {
	width: 100%;
}

body.main_body > div.user_regolamento td.casella_titolo {
	padding-top: 10px;
}

/* Responsive homepage: keeps the existing look but lets it breathe on zoomed and mobile viewports. */
*,
*::before,
*::after {
	box-sizing: border-box;
}

img,
iframe,
table {
	max-width: 100%;
}

div#site_width {
	width: 100%;
	min-height: 100vh;
}

div#content {
	padding-left: clamp(12px, 5vw, 60px);
	padding-right: clamp(12px, 5vw, 60px);
}

div.sidecontent {
	width: clamp(300px, 44vw, 440px);
	height: clamp(300px, 44vw, 440px);
	max-width: calc(100vw - 24px);
	max-height: calc(100vh - 80px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-top: clamp(-150px, -14vh, -32px);
	padding: clamp(18px, 4vw, 42px);
}

div.login_form,
div.pass_rec,
div.sidecontent ul li a,
div.sidecontent ul li a:hover,
div.login_form input[type='submit'],
input[type='submit'] {
	width: min(200px, 100%);
}

div.login_form {
	margin-top: 0;
}

div.login_form input,
input#passrecovery,
div.login_form select {
	width: 100%;
}

div.sidecontent ul {
	width: 100%;
	margin-left: 0;
}

div.content_body {
	float: none;
	width: min(920px, calc(100% - 24px));
	margin: 20px auto;
}

.ui-dialog {
	max-width: calc(100vw - 20px) !important;
}

.ui-dialog .ui-dialog-content {
	max-width: 100% !important;
}

@media (max-width: 720px), (max-height: 620px) {
	div#main {
		min-height: 100vh;
		height: auto;
		overflow: auto;
		display: block;
		padding: 18px 0;
	}

	div#header {
		height: clamp(80px, 18vh, 140px);
	}

	div.sidecontent {
		width: min(420px, calc(100vw - 24px));
		height: auto;
		min-height: 0;
		border-radius: 8px;
		margin-top: 0;
		box-shadow: 0 12px 28px rgba(0,0,0,.72);
	}

	div.content_body {
		margin-top: 14px;
	}

	body.main_body > div.pagina_iscrizione,
	body.main_body > div.user_regolamento {
		width: calc(100% - 16px);
		margin: 8px auto;
	}

	body.main_body > div.pagina_iscrizione .page_body,
	body.main_body > div.user_regolamento .page_body {
		max-height: none;
	}
}

/* TITOLI GLOBALI - allineamento homepage e pagine esterne */
:root {
    --wnk-page-title-color: #bba86c;
}

div.page_title {
    margin-top: 50px !important;
}

div.page_title h2 {
    color: var(--wnk-page-title-color, #bba86c) !important;
    font-family: "GOT", Got, Georgia, serif !important;
    font-size: 30px !important;
    font-weight: normal !important;
    line-height: 1.15 !important;
    text-shadow: 0 1px 0 #000, 0 0 8px rgba(186, 166, 103, .24) !important;
}