body {
	color: #333333;
	background-color: #555555;
	font-family: Verdana, sans-serif;
	font-size: medium;
	margin: 0 auto;
}

 .entra { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #444444;}
 A:link.entra { font-family: Verdana, Arial, Helvetica; font-size: 10px; color:#444444; }
 A:visited.entra { color:#1C6EAD; }
 A:hover.entra { color:#444444; }

A:link	{ color:#DDDDDD; }
A:visited	{ color:#DDDDDD; }
A:hover	{ color:#fecd56; text-decoration:none; }
.numblu13	 {font-family: Verdana, Arial, Helvetica; font-size: 13px; color: #05eaff;} 
.numgia13  { font-family: Verdana, Arial, Helvetica; font-size: 13px; color: #f3be06;}
.numbia13  { font-family: Verdana, Arial, Helvetica; font-size: 13px; color: #DDDDDD;}
.titoletto    {font-family: Verdana, Arial, Helvetica; font-size: 13px; color: #DDDDDD}
.tesneropiu10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #333333}
.tesgri  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #333333;}
.tesgri11  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #666666;}
.tesgri10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #666666;}
.tesgri9  { font-family: Verdana, Arial, Helvetica; font-size: 9px; color: #666666;}
.tabner  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #333333!important}
.tabner10 {  font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #333333;}
.tabner12 {  font-family: Verdana, Arial, Helvetica; font-size: 12px; color: #333333;}
.tabner14 {  font-family: Verdana, Arial, Helvetica; font-size: 14px; color: #333333;}
.tesros  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #761010}
.tesros10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #761010}
.tesblu  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #ffcd56}
.tesblu10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #ffcd56}
.tesner  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #333333;}
.tesner12  { font-family: Verdana, Arial, Helvetica; font-size: 12px; color: #DDDDDD;}
.tesner10 {  font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #CCCCCC;}
.tesner9 {  font-family: Verdana, Arial, Helvetica; font-size: 9px; color: #DDDDDD;}
.tesgia10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #f3be06;}
.tesver10 { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #1e9927}
.tesbia  { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #FFFFFF}
.tesbia12  { font-family: Verdana, Arial, Helvetica; font-size: 12px; color: #FFFFFF!important;}
.tesbia10  { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #FFFFFF}
/*classi stampa articolo*/
.tit { font-family: Verdana, Arial, Helvetica; font-size: 16px; color: #000000;}
.subtit { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #000000;}
.occhiello { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #000000;}
.testo { font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #000000;}

/*stili editor*/
.note {  font-family:Verdana, Arial, helvetica ;font-size:10px; color: #666666; }
.rigatab {background-color: #BBBBBB;}
.titpag14	 {font-family:Georgia, Palatino, serif;color: #1C6EAD;font-size:13px;}
.titolo16	 {font-family:Georgia, Palatino, serif;color: #333333;font-size:16px;}
.titolo18	 {font-family:Georgia, Palatino, serif;color: #333333;font-size:18px;}
.titolo18red	 {font-family:Georgia, Palatino, serif;color: #cc2026;font-size:18px;}
.sottotit	 {font-family:Georgia, Palatino, serif;color: #333333;font-size:11px;font-weight:bold;}

/* Testo e sfondo riga evidenziata tabella */
/* riga rossa .ruled {  background:#ae3e3e; font-family: Verdana, Arial, Helvetica; font-size: 11px; color: #DDDDDD;} */
.ruled {  background:#bbbbbb; font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #333333;}
.ruler {  font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #333333;}

.ruler2 {font-size: 12px;}

div.container{ width:100%; margin: 0px auto 0px;	overflow: hidden; max-width:912px;}
div.colonna{	float:left;	position:relative; width:254px; left:40px; padding:10px;}
ul.sortabledemo {min-height:131px;width:200px; }
li.item {border:0px solid #ffffff; list-style-type: none; margin-left:-40px; margin-bottom:0px;}

div.fondo_sx{  position:relative; left:10px;margin-bottom:30px;} 
/* Moduli_dx é il div che contiene le pagine interne di Backoffice */
div.moduli_dx{  position:relative; width:590px; min-height:900px; height: auto !important; height: 620px; top:7px; left:3px;margin: 10px 17px;padding-bottom:40px;} 

/*div.testata{  background:url(immagini/sfondo_testata.png) repeat-x; width:912px; height:95px;} */
div.testataNew{  width:912px; height:67px;background:#3e3e3e;} 
div.ora{  position:absolute; width:400px; top:-52px; left:290px; font-family: Verdana, Arial, Helvetica; font-size: 13px; color: #f3be06;} 
div.ricarica{  position:absolute; top:43px; left:820px} 
div.ripristina{  position:absolute; top:80px; left:815px} 

div.label  { position: absolute; top:64px; left:30px;} 
div.handle  { background:url(immagini/Ico_drag.png) no-repeat; position: absolute; width:16px; height:17px; top:33px; left:190px; cursor:move;} 
div.chiudi{ position: absolute; width:12px; height:15px; top:35px; left:213px;} 
div.chiudistat{ position: relative; width:12px; height:15px; top:2px; left:485px;} 
a.chiudilink {text-decoration: none;}

div.utenti{  background-color:#555; left:0px; width:245px; height:160px; } 
div.u_ico { position: relative; width:39px; height:37px; top:13px; left:25px;  } 
div.utenti_title {position:relative; top:-17px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
div.u_ico_off { background:url(immagini/Ico_utenti2OFF.png) no-repeat; position: relative; width:39px; height:37px;top:17px; left:25px; } 

div.ordini{  background-color:#555;  position:relative; top:10px; left:0px; width:245px; height:235px;} 
div.o_ico { position: relative; width:29px; height:35px; top:17px; left:30px; } 
div.ordini_title {position:relative; top:-11px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
div.o_ico_off { background:url(immagini/Ico_ordini2OFF.png) no-repeat; position: relative; width:29px; height:35px; top:19px; left:25px; } 

div.prodotti{ background-color:#555;  position:relative; top:0px; left:0px; width:245px; height:215px; } 
div.p_ico { position: relative; width:32px; height:35px; top:12px; left:27px; } 
div.prodotti_title {position:relative; top:-13px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
div.p_ico_off { background:url(immagini/Ico_prodotti2OFF.png) no-repeat; position: relative; width:32px; height:35px; top:17px; left:27px; } 

div.import{background-color:#555;   position:relative; top:10px; left:0px; width:245px; height:105px;} 
div.import_title {position:relative; top:-17px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
div.i_ico               { /*background:url(immagini/ico_import2.png)*/no-repeat; position: relative; width:36px; height:37px;top:18px; left:25px; } 
div.i_ico_off { /*background:url(immagini/ico_import2OFF.png)*/ no-repeat; position: relative; width:36px; height:37px;top:18px; left:25px;} 

/*Pannello articoli con xoffice = OFF*/
div.articoli{background-color:#555;   position:relative; top:20px; left:0px; width:245px; height:100px;}
div.articoli_title {position:relative; top:-17px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
/*Pannello articoli con xoffice = ON*/
/*div.articoli{  background:url(immagini/P_articoli2.png) no-repeat; position:relative; top:0px; left:0px; width:254px; height:113px;} */
div.a_ico { /*background:url(immagini/ico_articoli2.png)*/ no-repeat; position: relative; width:36px; height:37px;top:17px; left:25px; } 
div.a_ico_off { /*background:url(immagini/ico_articoli2OFF.png)*/ no-repeat; position: relative; width:36px; height:37px;top:17px; left:25px; } 

div.stat{background-color:#555;  position:relative; top:10px; left:50px; width:528px; height:260px;} 
div.stat_title {position:relative; top:-6px; left:70px; color:#ddd; font-size:16px; bottom:5px;}
div.s_ico { position: relative; width:35px; height:32px;top:22px; left:28px; } 
div.s_ico_off { /*background:url(immagini/ico_stat2OFF.png)*/ no-repeat; position: relative; width:35px; height:32px;top:22px; left:28px;  } 


INPUT[type=text], INPUT[type=password], INPUT[type=email], INPUT[type=url] {
	border-top:#cbcbcb 1px solid;
	border-left:#e0e0e0 1px solid;
	background:#f2f2f2;
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
	color:#1e1e1e;
	height:17px;
	}
textarea {
	background:#f2f2f2; 
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; 
	color:#1e1e1e;
	overflow: auto;
	resize:none;
	}
	
.arrotonda {
	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
	}

.thumbh100 {
	max-height: 80px;
	max-width: 80px;
	}

.thumbh80 {
	max-height: 80px;
	max-width: 80px;
	}
	
.posImg {
	position:absolute;left:100px;
}

.boxtitolo {
	height:19px;
	margin:3px;
	padding-top:4px;
	font-size: 14px;
	padding-top:
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	background-color:#e1e1e1;
	font-weight: NORMAL;
	color:#555555;
}

table.tesner{
	border-top: 1px solid #717070;
}

div.utenti div.label{
	top:80px;
}




/*** media queries per retina display ***/

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) {
	
    /* Retina-specific stuff here 
   div.a_ico { background:url(immagini/ico_articoli2xxx.png)}
   div.u_ico{  background: url(immagini/ico_utenti-2x.png); width:39px; height:37px; top:17px; left:25px; }
   div.prodotti{  background:url(immagini/P_prodotti2.png) no-repeat;}
   div.ordini{  background:url(immagini/P_ordini2.png) no-repeat;}
   div.import{  background:url(immagini/P_import2.png) no-repeat;}
   div.stat{ background:url(immagini/P_stat2.png) no-repeat;}*/
}

/*  Stile banner centrale altro */

.banner {
    border-radius: 4px;
    color: #ddd;
    border-sizing: none;
    border: 1px solid #3e3e3e;
		background: #3e3e3e;
		color: #fff;
		padding:3px;
		padding-bottom:4px;
		width:430px;
		margin-bottom:0;
		margin-top:0;
	
	}
	
.verde	{
    color: #ddd;
    border: 1px solid #97C200;
		background: #3e3e3e;
	}

.giallo {
    color: #ddd;
    border: 1px solid #f3be06;
		background: #3e3e3e;
	
}

.bordo_azzurro{
	border: 1px solid #15c6fe;
}

.azzurro_sfondo{
	background-color: #15c6fe;
}

.bordo_rosso{
	border: 1px solid #f44336;
}

.rosso_sfondo{
	background-color: #f44336;
}

.bordo_bianco{
	border: 1px solid #ffffff;
}

.bianco_sfondo{
	background-color: #ffffff;
}


#portacollega, #wallet{
	top: 18px;
    position: relative;
    color: #ddd;
    padding: 8px;
    border-radius: 5px;
    left: -17px;
    width: 183px;
    text-align:center;
}

#portacollega a:hover{
	color: #ddd;
	text-decoration:underline;
}

#portacollega a, #wallet a{
	text-decoration:none;
}

#portacollega h3, #wallet h3{
	margin-top: 0px;
    margin-bottom: 5px;
    font-size: 13px;
    padding: 5px;
    color: #3e3e3e;
    border-radius: 2px;
}

.codice{
	font-size:25px;
	font-weight:bold;
}
#Tabella_01{min-height:1000px;}

/*stili restyling 2020 */
.input_ric, select, input[type=text]{
	border: none;
    height: 21px!important;
    margin-top: 4px;
    border-radius: 0!important;
    font-family: Verdana, Arial, Helvetica;
}

select.input_ric{
	height: 24px!important;
}

.rictab2 > ul > li {
	border:none!important;
	background:none!important;
	
}

.rictab2 .ui-state-default a, .rictab2 .ui-state-default a:link, .rictab2 .ui-state-default a:visited{
	color: #ccc;
	text-decoration:underline;
}
.rictab2 .ui-state-active a, .rictab2 .ui-state-active a:link, .rictab2 .ui-state-active a:visited{
	font-weight: 400;
    color: #fecd56; 
    text-decoration:none;
}

.btn_stat, .btn_ric, input[type=submit], input[type=button]{	
	cursor: pointer;
    border-radius: 20px;
    border: none;
    padding: 5px 10px;
    font-size: 12px;
}

.btn_stat:hover, .btn_ric_disp:hover, input[type=submit]:hover, input[type=button]:hover{
	background: #4cc0c0;
    color: #fff;
}

.btn_ric, .pulsante-toggle, .pulsante-toggle2{
	background: #fecd56;
	color:#333;
	border:2px solid #fecd56;
	cursor: pointer!important;
}
#btn_preventivo{
    font-size: 15px;
    padding: 15px;
    border-radius: 28px;
}

.pulsante-toggle{
	position: relative;
    top: -22px;
    left: 530px;
    width: 39px;
    padding: 5px;
    border-radius: 16px;
    font-size: 11px;
    text-align: center;
}
.pulsante-toggle2{
    position: relative;
    top: -7px;
    padding: 5px;
    border-radius: 16px;
    float: right;
}

.div_moduli{
    background: #333;
    padding: 15px 10px;
    border-radius: 5px;
    margin: 8px;
}

.btn_ric:hover{
	background: #555;
	color:#fecd56;
	border:2px solid #fecd56;
}

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{
font-size:12px!important;
}

#MesiDiv, #anniDiv{color:#555;}

#navbar ul li li a:hover{color: #2d2d2c!important;}
.sfondogiallo, #navbar ul li a:hover{background:#fecd56!important;}
div.fondo_dx{position:relative; width:630px; min-height:645px; height: auto !important; height: 645px; top:0px; left:15px; margin-bottom:60px;z-index:1;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;box-sizing: border-box;background:#555;padding-top: 3px;top:10px!important;margin-left:15px;} 
.fondo_dx2{background:#555!important;padding-top: 3px;top:10px!important;margin-left:15px;}
.ruled2 {  background:#222;}
.tesverde{color: #4cc0c0!important;}
.tesgiallo, .tesros{color: #ffcd56!important;}
.tesgiallo10{color: #ffcd56!important;font-size:10px;}
.tesros2{color: #761011!important;}
.sfondogiallo{background:#ffcd56!important;}
.tespiccolo{font-size:11px;}
.tesgrande{font-size:14px;}
.tes12{font-size:12px;}
#arttab{background:#555;    margin-top: 20px;}
#fondo_evadi{
	position: absolute;
    top: 226px;
    background-color: #333;
    padding: 10px;
    /* border-radius: 5px; */
    padding-top: 6px;
    width: 571px;
}

.fondo_login{
	border: 2px solid #fdcd56;
    border-radius: 5px;
    padding: 20px 30px;
    margin-top: 0px;
    width: fit-content;
    margin-left: 50px;
}

.rictab2{
	position: relative;
    left: 3px;
    width: 202px;
    background-color: #555;
    padding-top: 10px;
}
	.ombra_div{
		-webkit-box-shadow: 0 0 6px rgba(0,0,0,.2)!important;
    	-moz-box-shadow: 0 0 6px rgba(0,0,0,.2)!important;
    	box-shadow: 0 0 6px rgba(0,0,0,.2)!important;
    }

	.banner2020{
    margin-top: 0;
    margin-top: 6px;
    }
    .banner2020 a{
		color: inherit;
    }
    
    .label2{padding-left:22px;}
    .sfondo_pano_stat{    	
		height: auto!important;
		margin-bottom: 15px;
		background: #555;
		padding: 9px 5px;
		padding-bottom: 20px;
		width: auto!important;
	}
	ul.sortabledemo2{margin:0;}
	 #statid2{
	 	position: relative;
	    left: 50px;
		width: 600px;
	    top: -6px;
	 }
	 .fondo_ricerca{
		left: 25px;
		margin-top: -20px;
	    position: relative;
        padding-bottom: 30px;
    }
    .colonna2{
    	float: left;
		position: relative;
		width: 280px;
		left: 40px;
		padding: 10px;
		margin-right: 20px;	
    }    
    #prod {
    border: 2px solid #fdcd56!important;
    background:none!important;
    color:#fff!important;
	}
	.dropzone{   
		border: 2px dashed #fdcd56;
		border-radius: 5px;
		background: transparent;
		min-height: 141px;
		padding: 5px;
    }
    .dropzone .dz-preview .dz-remove{
    	background:#222;
   	    font-size: 12px;
    }
    .dropzone .dz-preview{
        margin: 7px;
    	min-height: 50px;
    	width: 50px;
    	height: 50px;
    }
    .dropzone .dz-preview .dz-image {
		border-radius: 20px;
		overflow: hidden;
		width: 50px;
		height: 50px;
		position: relative;
		display: block;
		z-index: 10;
		margin: 0 auto;
    }
    .dropzone .dz-message {
    	text-align: center;
    	margin:0;
    	padding: 10px 0;
	}
	.dz-message.needsclick{
		padding-bottom: 0;
	}
	.dz-message.needsclick img{
		max-width: 50px;
   	 	max-height: 50px;
	}
	.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span{
		display: none;
	}
	.dropzone .dz-preview .dz-details .dz-filename{
		display: none;
	}
	.dropzone .dz-preview .dz-details{
		padding:0;
	}
	.wrapper_dropzone{
		width: 98.3px;
		height: 167px;
		text-align: center;
		display: inline-block;
		float: left;
		padding: 5px;
		box-sizing: border-box;
	}
	.wrapper_img_preview{
		width: 50px;
		height: 50px;
		margin: auto;
		overflow: auto;		
	}
	
	.dropzone a{
		text-decoration:none!important;
		color:#fff;
	} 
	
	.dropzone button:hover, .dropzone a:hover{
		color:#fdcd56!important;
	}
	.btn_ric_disp{
    width: 30px;
    top: -1px;
    position: relative;
    padding: 5px;
    background: #fff;
    color: #333;
    top: -1px;
    left: -4px;
    position: relative;
    padding: 5px;
    background: #fff;
    color: #333;
    border-radius: none;
    border: none;
    font-size: 12px;
    padding-bottom: 4px;
    }
    
    .info_sco_qta{
    position: absolute;
    top: 10px;
    left: 365px;
    /* border: 1px solid #bbbbbb; */
    width: 160px;
    height: 142px;
    padding: 7px;
    background: #fccd56;}
    
    th{
    	font-weight:normal;
    }
    
    .atitolo2 {
	    float: left;
	}
	
	.atitolo1 {
		float: left;
		width: 19px;
	}
	.span_new {
		position: relative;
		top: -18px;
		width: 428px;
		left: 509px;
		font-weight: bold;
		font-size: 11px;
	}
	
	.span_offerta{
		position: relative;
		top: -18px;
		width: 428px;
		left: 495px;
		font-weight: bold;
		font-size: 11px;
		color: #fdcd56;
    }
    .div_moduli.offerta {
    	border: 1px solid #fdcd56;
	}

	.cerchia {
	  position: relative;
	  display: inline-block;
	  cursor: pointer;
	}

	.cerchia button {
	  padding: 8px 16px;
	  border: none;
	  background: none;
	  outline: none;
	}

	.cerchia svg {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  pointer-events: none;
	}

	.cerchia path {
	  stroke: #db3157;
	  stroke-width: 8px;
	  stroke-dasharray: 0 1500;
	}

	.cerchia path {
	  animation: draw 1s forwards;
	}

	@keyframes draw {
	  from {
		stroke-dasharray: 0 1500;
	  }

	  to {
		stroke-dasharray: 1500 1500;
	  }
	}


/*stili restyling 2020 fine */

/*avanzamento lavori*/
.wrapper_al_btn{
    left: 15px;
    bottom: 29px;
    position: fixed;
    z-index:10;
}

a.btn_ric.al {
	padding: 14px 22px;
    color: #333;
    border-radius: 999rem;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    font-family: system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,sans-serif;
}
a.btn_ric.al:hover {    
    color: #fecd56;
}

a.btn_ric.al img{
	width: 15px;
    position: relative;
    top: 3px;
}

a.btn_ric.al:hover img{
	content:url("/backoffice/immagini/frecciadestra_giallo.png");
}

.wrapper_al_iframe iframe{
    width: 100%;
    border: none;
    height: 500px;
}

.wrapper_al_iframe #top-bar{
	display:none!important;
}

#al_ms.toggle-target-hidden, #al_sito.toggle-target-hidden {
    visibility: hidden;
    display:none;
}

#al_ms.toggle-target-hidden.toggle-target-expanded, #al_sito.toggle-target-hidden.toggle-target-expanded{
	visibility: visible;
	display:block;
}

#al_sito input[type="checkbox"]{
	margin-top:1px;
}

#al_sito .atitolo1{
	width:auto;
	margin-right:2px;
}

#al_sito .div_moduli{
	font-size: 12px;
    line-height: 18px;
}

button.btn_ric:disabled {
    background: #666;
    color: #444;
    border: 1px solid #666;
}
/*avanzamento lavori fine*/


/* Grossisti */
.tableGross {
	margin-top: 5px;
	border-collapse: collapse;
	width: 100%;
  }
  
.trGross th  {
text-align: left;
}

.thAss{
text-align: left;
border: 1px solid #fccd56;
padding: 8px;
} 

.button__badge {
    position: absolute;
    top: 2px;
    right: 8px;
}

.tableModal {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

.trModal {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 8px;
  }
  
.trModal td{
  border: 1px solid #dddddd;
  text-align: center;
  padding: 8px;
  }
.trModal th{
  border: 1px solid #dddddd;
  text-align: center;
  padding: 8px;
  }    
.modalBackground {
  display: none; 
  position: fixed; 
  z-index: 1; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.4);
  -webkit-animation-name: fadeIn; 
  -webkit-animation-duration: 0.4s;
  animation-name: fadeIn;
  animation-duration: 0.4s
}

.modal-content {
    margin: auto;
    background-color: #fefefe;
    width: 80%;
    -webkit-animation-name: slideIn;
    -webkit-animation-duration: 0.4s;
    animation-name: slideIn;
    animation-duration: 0.4s;
    margin-top: 100px;
}

.close {
  color: black;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: red;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #fecd56;
  color: black;
  text-align: center;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #fecd56;
  color: black;
  text-align: center;
  height: 110px;
}

@-webkit-keyframes slideIn {
  from {bottom: -300px; opacity: 0} 
  to {bottom: 0; opacity: 1}
}

@keyframes slideIn {
  from {bottom: -300px; opacity: 0}
  to {bottom: 0; opacity: 1}
}

@-webkit-keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}

@keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}
/* Grossisti */

/* Stile per la finestra modale */
.modal {
  display: none; /* Nascondi la finestra modale di default */
  position: fixed; /* Imposta la posizione della finestra modale come fissa */
  z-index: 1; /* Imposta il valore di z-index per la finestra modale */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto; /* Abilita lo scorrimento dell'area di contenuto */
  background-color: rgba(0, 0, 0, 0.4); /* Imposta un background semitrasparente */
}

/* Stile per il contenitore della finestra modale */
.modal-content-brand {
  background-color: #333333; /* #fefefe;*/
  margin: 15% auto; /* Posiziona il contenitore al centro della finestra modale */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Imposta la larghezza del contenitore */
}

/* Stile per il pulsante "Chiudi" */
.close_modal {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

/* Stile per il pulsante "Chiudi" al passaggio del mouse */
.close_modal:hover,
.close_modal:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}