/** EVIDENZIAZIONE ELEMENTI x SVILUPPO**/
/*header { background:#E3EEFE!important; }
header section { border:1px dashed #6190D4!important; }
main { background:#FFF6DF!important; }
main section { border:1px dashed #EFBA32!important; }
aside { background:#E4FCBA!important; }
aside section { border:1px dashed #72AA0F!important; }
footer { background:#FFDCCA!important; }
footer section { border:1px dashed red!important; }
fieldset > div { background:orange; }*/



/** Html elements **/
* { box-sizing:border-box; }

body { margin:0; padding:0; min-width:320px; height:100vh; overflow-x:hidden; overscroll-behavior-x:none; }

header, main, aside, footer { position:relative; margin:auto; padding:0 12px; background-color:#FFF; }
header section { max-width:1128px; margin:0 auto 0 auto; padding:0; }
main { max-width:1152px; }
footer { max-width:1152px; position:sticky; top:100vh; }


/** Fieldsets **/
input, select, textarea, submit, details, summary { width:100%; }
input[type=file], input[type=file]::-webkit-file-upload-button { cursor: pointer !important; }
textarea { vertical-align:top; } /** Risolve il bug dell'extra margin-bottom della textarea **/


/** Grid **/
fieldset { min-width:0; margin:0; border:0; outline:none; font-size:0px; }
fieldset > div { display:inline-block; vertical-align:top; width:100%; margin:0; font-size:initial; }
fieldset > div.w-fixed-100 { width:100px; }
fieldset > div.w6 { width:33.33% }	/*ripulire in AM (campi data nascita)*/

fieldset.wide { margin-right:-10px; }
fieldset.wide > div { margin-right:10px; }
fieldset.wide > div.w100 { width:calc(100% - 10px); }
fieldset.wide > div.w75  { width:calc(75% - 10px); }
fieldset.wide > div.w66  { width:calc(66.66% - 10px); }
fieldset.wide > div.w50  { width:calc(50% - 10px); }
fieldset.wide > div.w37  { width:calc(37.5% - 10px); } /*ripulire in AM (etichetta data nascita)*/
fieldset.wide > div.w33  { width:calc(33.33% - 10px); }
fieldset.wide > div.w25  { width:calc(25% - 10px); }
fieldset.wide > div.w6,	 /*ripulire in AM (campi data nascita)*/
fieldset.wide > div.w12  { width:calc(12.5% - 10px); }


/** Dialogs **/
div.dialog { display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:100000; background:rgba(0,0,0,0.75); padding:10px; text-align:center; -webkit-animation: fadein 1s; -moz-animation: fadein 1s; -ms-animation: fadein 1s; -o-animation: fadein 1s; animation: fadein 1s; }
div.dialog .win { display:inline-block; position:relative; width:100%; min-width:280px; max-width:600px; padding:16px; background:#FFF; border-radius:2px; box-shadow:0 2px 15px 0 rgba(0,0,0,0.75); text-align:left; }
div.dialog .win_body { min-height:160px; overflow:hidden; overflow-y:auto; scrollbar-width:none; -ms-overflow-style:none;  }
div.dialog .win_body::-webkit-scrollbar { display:none; }
div.dialog .win_foot { padding-top:20px; text-align:right; }
div.dialog .progress_bar { padding-top:120px; font-family:Arial, Helvetica, sans-serif !important; color:#FFF; line-height:normal; }
div.dialog .progress_bar label { font-size:14px;  }
div.dialog .progress_bar .bar_base { width:65%; min-width:260px; max-width:520px; height:20px; margin:15px auto; padding:2px; border-radius:2px; background:#FFF; }
div.dialog .progress_bar .bar_progress { width:0; height:16px; border-radius:2px; background:#7AC968;  }
div.dialog .progress_bar val { font-size:36px; }


/** Wait & Loading **/
#wait { display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:99000; background:#FFF; opacity:0.15; color:#A0A0A0; text-align:center; }
#wait div { position:absolute; top:28%; width:100%; font-size:200px; }
#scr_rotation { display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:99000; background:#FFF; font-family:Arial, Helvetica, sans-serif !important; color:#CCC; text-align:center; }
#scr_rotation div { border:1px solid red; position:sticky; top:calc(50vh - 120px); font-size:200px; line-height:normal!important; }
#scr_rotation label { display:block; position:absolute; top:115px; width:100%; padding-left:140px; font-size:22px; line-height:100%!important; color:#BBB; }


/** Breakpoints **/
@media screen and (min-width:732px) { div.dialog { padding-top:100px; } }
@media screen and (min-width:568px) and (max-width:853px) and (max-height:415px) { #scr_rotation { display:block; } }
@media screen and (max-width:853px) {

	#m-fixed { position:fixed; bottom:0; left:0; right:0; top:auto; z-index:10000; min-width:320px; margin:0; background:#FFF; }
	#m-fixed h2 i { position:relative; float:right; }
	#m-fixed .collapse { display:none; overflow-y:auto; scrollbar-width:none; -ms-overflow-style:none; }
	#m-fixed .collapse::-webkit-scrollbar { display:none; }

	fieldset.wide > div.w66,
	fieldset.wide > div.w75 { width: calc(100% - 10px); }
	fieldset.wide > div.w12,
	fieldset.wide > div.w25,
	fieldset.wide > div.w33,
	fieldset.wide > div.w37,
	fieldset.wide > div.w50 { width:calc(50% - 10px); }

}
@media screen and (min-width:854px) {

	header { top:0; left:0; bottom:auto; right:0; z-index:1001; }
	aside { position:fixed; top:0; right:0; bottom:0; z-index:1; width:345px; padding-left:0; height:auto!important; overflow:scroll!important; scrollbar-width:none; -ms-overflow-style:none; }
	aside::-webkit-scrollbar { display:none; }
	main.aside, footer.aside { padding-right:385px /*calc(345px + 40px)*/ }

	#wait div { font-size:220px; }

}
@media screen and (min-width:1024px) {

	div.dialog .win { max-width:750px; padding:20px; }

}
@media screen and (min-width:1152px) { 
	
	aside { width:400px; }
	main.aside, footer.aside { padding-right:440px /*calc(400px + 40px)*/ }

}