/* Stile della Tab */
.tab { overflow: hidden;}
/* Colore della tab e stile*/
.tab button {
    background-color: #f18316;
    float: left;border:none;border-radius:5px;outline: none;
    color:#ffffff;
    cursor: pointer; padding: 10px 16px; transition: 0.3s; 
    font-size: 24px;
    font-weight:bold; text-align:left; margin-bottom: 20px; position: relative;
	font-family: var( --e-global-typography-primary-font-family ), Sans-serif;
}
/* Effetto Hover della Tab*/
.tab button:hover {
    background-color: #b91a1f;
    font-size: 24px;
    color:#ffffff;
}
/* Colore della tab Attiva */
.tab button.active {
    background-color: #b91a1f;
    font-size: 24px;
    color:#ffffff;
}
/* Dimensione della Tab*/
.tab button { width: 100%;text-wrap: wrap;}
/*Status Icon*/
.tablinks::before{content:'+'; font-size:30px; line-height:30px; margin-right:10px}
.tablinks.active::before{content:'-';}
/* Contenuto di ogni tab */
.tabcontent {border: 1px solid transparent; height:0; overflow:hidden; transition: height 300ms ease-in;}
/*.open{opacity:1;}*/
.piatto{display: flex;margin: 25px 0px; padding: 15px; background:#000000;border-radius: 5px;flex-wrap:wrap}

.piatto_immagine{margin-right:10px; position:relative}
.piatto_immagine .immagine{height: 170px; width:170px;background-size: cover; object-fit: cover; background-position: center;}
.piatto_immagine.round{border-radius:150px; overflow:hidden;display:inline-block}
.piatto_immagine .badge {position:absolute; top:0; left: 50%; margin-left: 0; transform: translateX(-50%); font-size: 14px;padding: 15px; min-width: 135px; text-align: center;}

.piatto_header {display: flex; justify-content: space-between; font-weight: bold; line-height: 40px; position:relative;}
.piatto_header_titolo{
color: #f18316; 
font-size:22px;
padding-right:10px; font-family:var( --e-global-typography-primary-font-family ), Sans-serif;
background-color:#000000;z-index: 1}
.piatto_header_prezzo{color: 
#ffffff;
font-size:30px; z-index: 1; padding-left:10px; font-family:var( --e-global-typography-primary-font-family ), Sans-serif;
background-color:#000000;
}
.piatto_header_prezzo .unita_piatto{display: block;font-size: 14px;text-align: center;line-height: 1;}
.piatto_prezzi{list-style: none;font-weight: bold; font-size: 18px; padding: 0; margin-top: 10px;}
.piatto_prezzi li{display: inline-block; margin-right: 30px}
.piatto input[type="checkbox"]{-webkit-appearance: none; appearance: none; border-radius: 1px;box-sizing: border-box; position: relative; box-sizing: content-box; width: 150px; height: 150px; border-width: 0;/*cursor:zoom-in*/}
.piatto input[type="checkbox"]:focus{outline: 0 none!important;}
.piatto_info{width:85%;} .subcat_c .piatto_info{width:82%;} .left-menu .piatto_info{width:77%;} .left-menu .subcat_c .piatto_info{width:76%;}.piatto_descrizione{
font-size:px;
margin-top: 10px; font-family:var( --e-global-typography-text-font-family ), Sans-serif;
text-align:left;
color: #ffffff}
.piatto_quantita input {color: #000; max-width: 100px!important; text-align: center; display: inline-block}
.piatto_quantita{font-size: 20px; text-align: right; margin-top: 10px }

/*SOTTOCATEGORIA*/
button.subcat {margin-left: 30px; width: calc(100% - 30px);}
.subcat_c .piatto{margin: 0px 15px 20px 50px}

/*BADGES*/
.badge{ display:inline-block; font-size:12px; vertical-align:middle; text-transform:uppercase; 
    background:#008040; 
    margin-left:10px; line-height:0; padding:12px; 
    color:#ffffff;
    border-radius:5px
}
/*ALLERGENI*/
.piatto_allergeni{display: flex; justify-content: flex-start;width: 100%; margin-top:15px;}
.piatto_allergeni .allergene{max-width: 40px; width:100%; margin-right:5px;}

@media only screen and (min-width:1279px){
	/*STILE LAYOUT LEFT-MENU*/
	.left-menu {position: relative; overflow: visible}
	.left-menu .tablinks{width: 25%; float: none; display:block;}
	.left-menu .tabcontent {width: 75%; position: absolute; top:0; right:0;}
	/*SOTTOCATEGORIA*/
	.left-menu .tabcontent.sub_tab_content{position: static}
	.left-menu .tablinks.subcat{width: 30%}
}
@media only screen and (max-width:900px){
    .piatto_immagine {padding-right:0px;}
	.piatto_immagine .immagine{height: 200px; width:200px;margin:0 auto;}
    .piatto_info, .subcat_c .piatto_info {flex-basis: 100%;}
	.left-menu .piatto_info{width:69%;}
    .piatto_header{font-size:22px;}
	.piatto_header_prezzo {padding-left:0px}
    .piatto_descrizione{text-align:left;}
    .piatto_quantita {text-align: center}
}
@media only screen and (min-width:768px){
    .piatto_header:after{content:'';width:100%;display:block;position: absolute; border-bottom:2px dashed; bottom:8px}
}
@media only screen and (max-width:768px){
	.left-menu .piatto_info{width:100%;}
	.piatto a {width:100%;text-align: center;}
    .piatto_header{display:block; text-align:center}
	.piatto_allergeni{display:block; overflow-x:scroll; text-wrap:nowrap}
	.piatto_allergeni .allergene {max-width:23%; display:inline-block}
}