@charset "utf-8";
/* CSS Document */

@media only screen and (min-width:150px) and (max-width:700px) {
	.testata {
		height: 150px !important;
	}
	a.buttonordine {
		height: 75px;
	}
}

@media only screen and (min-width:650px) and (max-width:1080px) {
		a.buttonordine {
		height: 75px;
	}
}

body { font-family: 'Muli', sans-serif; position:relative; font-size: 19px;}
h1 {
    font-size: 3.3rem;
}
a {
    text-decoration: none;
    color: #009;
}
.icon-user-bar i{   
	float: left;
    padding-right: 5px;
    font-size: 17px;
}
.ml0{margin-left:0}
option.red{ color: red;}
option.green{ color: green;}
.borderaggiorna{border:solid 2px #00abff!important}
input[readonly], select[disabled="true"] {border:none; padding:0; margin-bottom:0; -webkit-appearance: none; appearance: none; height: auto;}
.salvafinto{
	color: #FFF;
    background-color: #6bce69;
    display: inline-block;
    height: 38px;
    padding: 0 30px;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
    border: none;
    box-sizing: border-box;
}
a:hover {
    color: #666;
}
.prima-col {
    margin-left: 0 !important;
}
.pcolumns {
    padding: 10px 0;
}
h2 {
    font-size: 2.2rem;
}
.tab-tutti{
	display: block;
    text-align: center;
    width: max-content;
    margin: 0 auto;
    font-size: 16px;
    padding: 8px 18px;
    background-color: #00b700;
    color: #FFFFFF;
    margin-bottom: 20px;
    margin-top: 5px;
    border: solid 1px #f1f1f1;
    border-radius: 7px;
}

.tab-tutti:hover{
	display: block;
    text-align: center;
    width: max-content;
    margin: 0 auto;
    font-size: 16px;
    padding: 8px 18px;
    background-color: #009c00;
    color: #FFFFFF;
    margin-bottom: 20px;
    margin-top: 5px;
    border: solid 1px #f1f1f1;
    border-radius: 7px;
}

.titolo-doc {
    background-color: #f9f9f9;
    padding: 10px 15px!important;
    border: solid 1px #ddd;
    font-size: 20px;
}
.data{
	margin-top: 5px;
    font-style: italic;
    color: #999;
    font-size:12px;
}
.prichiesta{
	padding: 5px;
    font-size: 16px;
    cursor: pointer;
}
.titolo1{
    background-color: #afeac6;
    border-color: #afeac6;
    color: #2c7041;
    margin-bottom: 5px;
    position:relative;
    cursor: pointer;
}
.titolo2{
    background-color: #beeef7;
    border-color: #beeef7;
    color: #488fbf;
    margin-bottom: 5px;
    position:relative;
    cursor: pointer;
}
.titolo3{
    background-color: #ffebad;
    border-color: #ffebad;
    color: #e88300;
    margin-bottom: 5px;
    position:relative;
    cursor: pointer;
}
ol.boxes-list {
    list-style-type: none;
    list-style-type: decimal !ie; /*IE 7- hack*/
     
    margin: 0;
    margin-left: 3em;
    padding: 0;
     
    counter-reset: li-counter;
}
ol.boxes-list > li{
    position: relative;
    margin-bottom: 15px;
    padding: 1em;
   
    background-color: #efefef;
}
ol.boxes-list > li:before {
    position: absolute;
    top: 0;
    left: -1em;
    width: 0.94em;
    height: 0.94em;
     
    font-size: 3em;
    line-height: 0.94;
    text-align: center;
    color: #f5f5f5;
 
    background-color: #407db7;
    content: counter(li-counter);
    counter-increment: li-counter;
}
.titolo-doc .fa-sort-down{position: absolute;right: 35px;}
.titolo-doc .fa-sort-up{position: absolute;right: 35px;line-height: 35px;}
section{ padding:30px 0 0 0}
.center{text-align:center}
.right{text-align:right}
.left{text-align:left}
.row{padding:5px 0;}
.spazio40{height:40px; width:100%;}
.spazio{height:10px; width:100%;}
.titolo{ padding: 4px; color:#333}
.separatore{ width:100%; height:1px; background:#DDD; display:block; margin: 0px 0 10px 0;}
.separatoreCard{ width:100%; height:1px; background:#00008B; display:block; margin: 0px 0 10px 0;}
.hide{display:none}
.mostranascosto{display:none}
.nascosto22{display:none!important}
.nascosto33{display:none!important}
.novisible{display:none}
.rosso{color:#FFF}
label.obblig:after {
    content: '*';
    display: inline-block;
    padding-left: 2px;
    color: #C00;
    font-weight: bold;
}
.azioni a i {
    font-size: 16px;
    padding: 0;
}
.immagine-testata {padding-left:20px; padding-top: 2%}
.immagine-testata img{width:150px;}
.immagine {
    position: relative;
    text-align: center;
}
.immagine img {
    max-width: 100%;
    height: auto;
}
.minifont{font-size:11px}
.testata{    background-color: #4689ca; height: 90px;}
.checker{	padding:10px;	text-align:left;	margin-bottom:10px;	color:#FFF;	background:#ff6b6b;	-webkit-border-radius: 5px;	-moz-border-radius: 5px;	border-radius: 5px; }
.azioni .button {
	padding: 5px 10px;
    font-weight: 300;
    line-height: unset;
    height: unset;
	margin-bottom:0;
}
.azioni .pulsante-blu {
	padding: 5px;
    font-weight: bold;
    line-height: unset;
    height: unset;
}
.azioni p{margin-bottom:5px}
.azioni .pulsante-verde {
	padding: 5px;
    font-weight: bold;
    line-height: unset;
    height: unset;
}

.swal2-modal .swal2-styled {
    line-height: unset!important;
}
.profiloutente h5{font-size: 20px;border-bottom: solid 2px #ddd;}

.mycontainer , .profiloutente{
	padding-left: 200px;
	padding-right:10px;
    width: 100%;
}
p a.button{margin-bottom:0!important}
p {
    margin-bottom: 1.2rem;
    font-size: 19px;
}
h5 {
    font-size: 2.1rem;
}
.buttonordine{
	font-size: 14px;
    background-color: #4689ca!important;
    color: #fff;
    border: none;
    height: 75px;
}
.text-line{
	font: 26px sans-serif;
    margin-top: 30px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    z-index: 1;
}

.text-line:before {
    border-top: 2px solid #dfdfdf;
    content:"";
    margin: 0 auto; 
    position: absolute; 
    top: 15px; left: 0; right: 0; bottom: 0;
    width: 100%;
    z-index: -1;
}

.text-line span { 
    background: #fff; 
    padding: 0 15px; 
}

#navbaradmin {
	min-height: -webkit-fill-available;
    color: #818285;
    background: #FFF;
    position: absolute;
    top: -30px;
    bottom: 0;
    left: 0;
    width: 188px;
    z-index: 2;
    -webkit-box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    height: 821px;
}
#navbar {
	min-height: -webkit-fill-available;
    color: #818285;
    background: #FFF;
    position: absolute;
    top: 101px;
    bottom: 0;
    left: 0;
    width: 220px;
    z-index: 2;
    -webkit-box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 0px 2px 0px rgba(50, 50, 50, 0.75);
    height: 821px;
}
table{
	
}
#info-barra {
    position: fixed;
    bottom: 0;
    z-index: 3;
    left: 0;
    width: 188px;
}
#info-barra p{
    font-size:14px;
}
#navbar #info-barra {
    width: 220px;
}
.footer-barra {
    font-size: 14px;
    padding: 10px;
    border-top: 1px solid #DDD;
    color: #FFF;
    background: #4689ca;
}
#n-inside .active {
    /*background-color: #4689ca !important;*/
    background-color: rgba(33, 150, 243, 0.1);
	/*color: #fff;*/
}
#n-inside .area-menu:hover {
    background-color: rgba(33, 150, 243, 0.1);
	/*color: #fff;*/
}
.area-utente{padding:5px 0;/*background-color: #f1f1f1;*/}
.area-utente h5{margin-bottom:0!important; font-size: 24px;}
.area-menu{padding: 15px 8px; color: #286BAC;}
.area-menu p{margin-bottom:0!important;font-size:14px;position:relative}
.area-menu p i{ padding-right:5px}
.separatore-menu{ width:100%; height:1px; background:#DDD; display:block;}
#n-inside a{text-decoration:none}
/* LOGIN */
.buttonlogin{background-color:#FFF!important;}
.buttonspid{background-color: #06c!important;color: #fff!important;}
.login{margin-top:3%;font-size:26px}
#wrap { width: 300px; margin:auto; margin-top: 0; text-align:center; background-color:#DDD}
#content { padding: 20px 30px; border:solid 1px; }
#content form{margin-bottom:0}
#content p{ font-size:0.9em }
#marchio{ text-align:center; margin-top:0; margin-bottom:10px; }
#marchio img{ max-width:75%; height:auto }
.psw{text-decoration: none; color: #005BAA;}
/* CSS RELATIVO AL BACK OFFICE */
.logout{text-align:right; padding:38px 20px; color:#FFF}
.logout a{
	text-decoration: none;
    background-color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    color: #4689ca;
	font-size: 14px;
}
.pointer{cursor:pointer}
.pulsante-verde{
	  color: #00BF2C; background-color:  #FFF;
	  border: solid 1px #00BF2C;
	  transition: all 0.3s ease 0s;
	  cursor: pointer;
	 padding: 0 30px;
	display: inline-block;
	text-align: center;
    height: 38px;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.pulsante-verde:hover{ color: #FFF;
	  background-color: #00BF2C; }
.pulsante-accetta {
    color: #fff;
    background-color: #00BF2C;
    border: solid 1px #00BF2C;
    transition: all 0.3s ease 0s;
    cursor: pointer;
    padding: 0 10px;
    display: inline-block;
    text-align: center;
    height: 30px;
    font-size: 11px;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.pulsante-accetta:hover{ color: #FFF;
	  background-color: #00BF2C; 
}
.pulsante-mostra {
    color: #fff;
    background-color: #00abff;
    border: solid 1px #00abff;
    transition: all 0.3s ease 0s;
    cursor: pointer;
    padding: 0 10px;
    display: inline-block;
    text-align: center;
    height: 30px;
    font-size: 11px;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.pulsante-mostra:hover{ color: #FFF;
	  background-color: #00abff; 
}
.notifica-gestione{
    background-color: #fa3e3e;
    border-radius: 2px;
    color: white;
    padding: 2px 5px;
    font-size: 13px;
    margin-left: 2px;
}
.pulsante-blu{
	color: #00abff; background-color:  #FFF;	 
	border: solid 1px #00abff;
	transition: all 0.3s ease 0s;
	cursor: pointer;
	padding: 0 30px;
	display: inline-block;
	text-align: center;
    height: 30px;
    font-size: 11px;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
    margin-bottom:5px;
}
.pulsante-blu:hover{ color: #FFF;
	  background-color: #00abff; 
}
.pulsante-grigio{
	color: #9a9a9a; background-color:  #FFF;	 
	  border: solid 1px #9a9a9a;
	  transition: all 0.3s ease 0s;
	  cursor: pointer;
	 padding: 0 30px;
	display: inline-block;
	text-align: center;
    height: 38px;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.pulsante-grigio:hover{ color: #FFF;
	  background-color: #9a9a9a; 
}
.azioni .pulsante-grigio {
    padding: 5px;
    font-weight: bold;
    line-height: unset;
    height: unset;
}
.pulsante-blu-22{	
	 color: #FFF;
	  background-color: #00abff;
	  border: solid 1px #00abff;
	  transition: all 0.3s ease 0s;
	  cursor: pointer;
	 padding: 0 30px;
	display: inline-block;
	text-align: center;
    height: 38px;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.pulsante-blu-22:hover{ color: #00abff; background-color:  #FFF; }
.pulsante-rosso{
	  color: #C40000; background-color:  #FFF;
	  border: solid 1px #C40000;
	  transition: all 0.3s ease 0s;
	  cursor: pointer;
	 padding: 0 30px;
	display: inline-block;
	text-align: center;
    height: 38px;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 4px;
}
.azioni .pulsante-rosso {
    padding: 5px;
    font-weight: bold;
    line-height: unset;
    height: unset;
}
.pulsante-rosso:hover{ color: #FFF;
	  background-color: #C40000; }
.s-lab-in{ padding-left:20px }
.paginazione{ text-align:center; margin:20px 0; }
.paginazione .paginazione-pagina{ color:#383e42; border:1px solid #383e42; display:inline-block; margin-right:5px; width:30px; line-height:30px; text-align:center; }
.paginazione .paginazione-pagina:hover{ color:#666; border-color:#666 }
.paginazione .paginazione-corrente{ border:1px solid #595959; display:inline-block; margin-right:5px; width:30px; line-height:30px; text-align:center; font-weight:600;}


/* CSS RELATIVO ALLE NOTIFICHE */
#notifica2{ position:fixed; top:25%; right:40%; padding:10px; font-size:20px; z-index:999; text-align:right }
#notifica2 .notifica-titolo{ font-size:1.4em; font-weight:bold }
#notifica2 .notifica-testo{ padding-top:10px; }
#notifica2.notifica-success{ background:#27AE60; color:#FFF }
#notifica2.notifica-error{ background:#C0392B; color:#FFF }

#notifica{ position:fixed; bottom:20px; right:20px; padding:10px; font-size:11px; z-index:999; text-align:right }
#notifica .notifica-titolo{ font-size:1.4em; font-weight:bold }
#notifica .notifica-testo{ padding-top:10px; }
#notifica.notifica-success{ background:#27AE60; color:#FFF }
#notifica.notifica-error{ background:#C0392B; color:#FFF }

/* CSS iOS */
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}
/* FINE CSS iOS */

input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
    height: 30px;
}
input, textarea, select, fieldset {
    margin-bottom: 6px;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 15px;
}

#beefree-editor {
	height: 100vh;
	margin-bottom: 50px;
	border: solid 1px #eee;
}

/* MENU MOBILE */
.pointer{cursor:pointer}
#menu-mobile{ display:none }
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    background-color: #fafafa;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 0;
}
.sidenav a {
    text-decoration: none;
    font-size: 20px;
    color: #ccc;
    display: block;
    transition: 0.3s;
}
.sidenav a:hover {
    color: #fff;
}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
	z-index:999;
	color: #333;
}
#main-mobile {
    transition: margin-left .5s;
	padding: 10px 0;
}
#main-mobile a .fa-bars{
    font-size:26px;
    margin-left:5px;
}
#main-mobile img{
	padding-left:20px;
	height: 50px;
}
/* FINE MENU MOBILE */


@media (min-width: 1081px) and (max-width: 1143px) {
	.titolo-doc {
	    padding: 10px 10px!important;
	}
	.profiloutente h5 {
	    font-size: 18px;
	}
}
@media (min-width: 701px) and (max-width: 1080px) {
	.button, button, input[type="reset"], input[type="submit"], input[type="button"] {	    
	    height: 35px;
	    padding: 0 20px;	   	    
	    line-height: 35px;	    
	}
	.button.button-grigio{margin-top:5px}
	.container .three.columns, .four.columns, .six.columns{width:100%;margin-left:0}
	.pulsante-blu-22 {
	    margin-bottom:10px
	}
	.mycontainer, .profiloutente {
	    padding-left: 215px;
	}
	.container {
	    width: 95%;
	}
	.mycontainer {
	    width: 100%;
	}
	.titolo-doc {
	    padding: 10px 10px!important;
	}
	.profiloutente h5 {
	    font-size: 18px;
	}
	table {
		display: block;
	    overflow-x: auto;
	    height: max-content;
    }
    .profiloutente table {
		display: table;
    }
}

@media (max-width: 700px) { /* colonne */
	.button.button-grigio{margin-top:5px}
	.login {
	    margin-top: 10px;
	    font-size: 22px;
	}
	#wrap {
	    max-width: 100%;
	}
	#wrap #content {padding:5px 25px}
	#marchio {
	    margin-bottom: 5px;
	}
	#marchio img {
	    max-width: 60%;
	}
	#menu-mobile{display:block;}
	
	#menu{display:none;}
	section {
	    padding: 5px 0 0 0;
	}
	header .testata .three.columns, header .testata .nine.columns{width:100%;margin-left:0;text-align:center;}
	header .immagine-testata img {
	    width: 150px;
	    height: 110px;
	}
	header .logout {
	    text-align: center;
	    padding: 5px 0;
	}
	.profiloutente {
	    padding-left: 0;
	    padding-right: 0;
	    width: 100%;
	}
	.mycontainer{
	    padding-left: 0;
	    padding-right: 0;
	    width: 93%;
	}
	#pagepsw .three.columns{width:100%;margin-left:0}
	.three.columns, .four.columns{width:100%;margin-left:0}
	
	.pulsante-blu-22 {
	    margin-bottom:10px;
	    height: 33px;
	    line-height: 33px;
	}
	h3 {
	    font-size: 2.2rem;
	    margin-bottom:8px;
	}
	h2 {
	    font-size: 2.3rem;
	    margin-bottom:5px;
	}
	h1 {
	    font-size: 2.5rem;
	    margin-bottom:8px;
	    text-align:center;
	}
	h5 {
	    font-size: 1.6rem;
	}
	.profiloutente h5 {
	    font-size: 1.6rem;
	}
	p {
	    font-size: 16px;
	}
	.footer-barra, .footer-barra a {
	    font-size: 13px;	   
	}
	.text-line:before {
	    top: 10px;
	}
	.text-line {
	    font: 20px sans-serif;
	    margin-top: 25px;
	}
	.swal2-modal .swal2-title {
	    font-size: 25px!important;
	}
	.area-menu {
	    padding: 14px 8px;
	}
	#info-barra {
	    position: absolute;
	    width: 100%;
	}
	#info-barra p{
	   margin-bottom:0
	}
	table {
		display: block;
	    overflow-x: auto;
	    height: max-content;
    }
    .button, button, input[type="reset"], input[type="submit"], input[type="button"] {	    
	    height: 33px;
	    padding: 0 20px;	   	    
	    line-height: 33px;	    
	}
	.pulsante-accetta {
	    padding: 0 5px;
	    height: 28px;
	    line-height: 28px;
	    font-size: 10px;
	}
}

/* INFORMATIVE */
.informative {
    position: fixed;
    bottom: 20px;
    right: 20px;
    max-width: 600px;
    width: 100%;
    z-index: 9999;
    background: #fff;
    -moz-box-shadow: 0 0 10px #ddd;
    -webkit-box-shadow: 0 0 10px #ddd;
}

.informative img{
	width: 98%;
    height: auto;
    padding: 1%;
    max-height: 200px;
    object-fit: contain;
}

.informative .informative-close {
    text-align: right;
}

.informative .informative-close span i{
   padding: 10px 20px;
    background-color: #fff;
    margin-bottom: 0;
    cursor: pointer;
}
 .informative .testo{color:#333;}
 .informative .testo h2{text-transform:uppercase; color:#4689CA;}
 
.informative .slide {
    display: none;
}
.informative .row{padding:0}
.informative .slide.visible {
    display: block;
}

.informative .slide > a {
    color: inherit !important;
}
#box_immagine img{
	height: 200px;
    width: auto;
    max-width: 100%;
}
.informative .informativa-testo {
    background-color: #fff;
    padding: 0 20px 20px 20px;
}
@media (min-width: 651px) and (max-width: 1080px) {
	.informative img {
	    max-height: 80px;
	}
}
@media (max-width: 650px) {
	.informative {
	    right: 0;
	    left: 0;
	    margin: 0 auto;
	    max-width: 96%;
	    width: 100%;
	}
	.informative img {
	    max-height: 80px;
	}
	.informative .testo {
	    padding: 10px;
	    text-align: center;
	}
}

.info {
	text-align: center;
	color: #0080ff;
}

.boxCard {
	border-left: 6px solid #ccc!important;
	border-color: #2196F3!important;
	border: 1px inset;
    padding: 0.01em 16px;
}

.cardDati {
	border-left: 6px solid #ccc!important;
	border-color: #2196F3!important;
	border: 1px;
    padding: 0.01em 16px;
}

.titoloDati {
	padding: 2%;
	margin: 0px;
}

.titoloCard {
	margin: 1% 0;
	text-align: center;
	background-color: rgba(33, 150, 243, 0.1);
}
.infoCard {
	font-size: 15px;
	color: #0080ff;
	text-align: center;
}

.badge {
	background-color: #17a2b8;
	display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
	font-size: 14px;
	color: white;
}