a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

body,
html {
    font-size: 100%;
    height: 100%;
    width: 100%;
    -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit Non somma padding, border e margin */
    /* Firefox, other Gecko Non somma padding, border e margin */
    box-sizing: border-box;
    /* Opera/IE 8+ Non somma padding, border e margin */
}

*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    -ms-box-sizing: inherit;
    -o-box-sizing: inherit;
    box-sizing: inherit;
    -webkit-tap-highlight-color: transparent;
}

/*====ANIMAZIONI ED EFFETTI====*/
.rippleEffect {
    position: relative;
    overflow: hidden;
}

.ripple {
    position: absolute;
    background: rgba(0, 0, 0, .3);
    color: rgba(0, 0, 0, .3) !important;
    border-radius: 100%;
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
    pointer-events: none;
    -webkit-animation: ripple 1s ease-out;
    animation: ripple 1s ease-out;
}

@-webkit-keyframes ripple {
    from {
        opacity: 1;
    }

    to {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0;
    }
}

@keyframes ripple {
    from {
        opacity: 1;
    }

    to {
        -webkit-transform: scale(2);
        -webkit-transform: scale(2);
        transform: scale(2);
        transform: scale(2);
        opacity: 0;
    }
}

/*====/ANIMAZIONI ED EFFETTI====*/

/*====FONTS====*/
.alignLeft {
    text-align: left;
}

.alignCenter {
    text-align: center;
}

.alignRight {
    text-align: right;
}

.h1 {
    font-size: 96px;
    font-size: 6rem;
    letter-spacing: -1.5px;
    letter-spacing: -0.09375rem;
}

.h2 {
    font-size: 60px;
    font-size: 3.75rem;
    letter-spacing: -0.5px;
    letter-spacing: -0.03125rem;
}

.h3 {
    font-size: 48px;
    font-size: 3rem;
    letter-spacing: 0;
    letter-spacing: 0;
}

.h4 {
    font-size: 34px;
    font-size: 2.125rem;
    letter-spacing: 0.25px;
    letter-spacing: 0.015625rem;
}

.h5 {
    font-size: 24px;
    font-size: 1.5rem;
    letter-spacing: 0;
    letter-spacing: 0;
}

.h6 {
    font-size: 20px;
    font-size: 1.25rem;
    letter-spacing: 0.15px;
    letter-spacing: 0.009375rem;
}

.subtitle {
    font-size: 16px;
    font-size: 1rem;
    letter-spacing: 0.15px;
    letter-spacing: 0.009375rem;
}

.subtitle2 {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: 0.1px;
    letter-spacing: 0.00625rem;
}

.body {
    font-size: 16px;
    font-size: 1rem;
    letter-spacing: 0.5;
    letter-spacing: 0.03125rem;
}

.body2 {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: 0.25px;
    letter-spacing: 0.015625rem;
}

.caption {
    font-size: 12px;
    font-size: 0.75rem;
    letter-spacing: 0.4px;
    letter-spacing: 0.025rem;
}

.overline {
    font-size: 10px;
    font-size: 0.625rem;
    letter-spacing: 1.5px;
    letter-spacing: 0.09375rem;
    text-transform: uppercase;
}

.buttonLabel {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: 1.25px;
    letter-spacing: 0.078125rem;
    text-transform: uppercase;
}

i {
    font-size: 20px;
    font-size: 1.25rem;
}

.dense i {
    font-size: 16px;
    font-size: 1rem;
}

i,
.dense i {
    padding: 4px;
    padding: 0.25rem;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


a.none {
    color: inherit;
}

.list.inline li {
    display: inline-block;
}

.list.noPoints {
    list-style-type: none;
}

.uppercase {
    text-transform: uppercase;
}

/*====/FONTS====*/

/*====FORM====*/
/*ELEMENTI STANDARD*/
.inputArea {
    min-width: 280px;
    min-width: 17.5rem;
}

.inputArea .inputBox .bkg {
    width: 100%;
}

.inputArea .inputBox .inputLabel,
.inputArea .inputBox .input,
.inputArea .inputBox .selInput {
    position: absolute;
    top: 0;
    left: 0;
}

.inputArea .inputBox .input,
.inputArea .inputBox .selInput {
    width: 100%;
    border: none;
    background: transparent;
    outline: none;
}

.inputArea .inputBox .bkg {
    position: relative;
}

.inputArea .inputBox .bkg:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.inputArea .inputBox .inputMsg {
    height: 16px;
    height: 1rem;
    width: 100%;
}

.inputArea .textareaBox [contenteditable="true"] {
    outline: none;
    word-wrap: break-word;
    overflow-wrap: anywhere;
    white-space: normal;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

/*Casella di testo*/
.inputArea.textarea {
    min-height: 73.6px;
    min-height: 4.6rem;
    margin-bottom: 19.2px;
    margin-bottom: 1.2rem;
}

.inputArea.textarea .inputBox {
    min-height: 72px;
    min-height: 4.5rem;
}

.textareaBox {
    height: 56px;
    height: 3.5rem;
    min-height: 56px;
    min-height: 3.5rem;
    padding: 24px 11.2px 0 11.2px;
    padding: 1.5rem .7rem 0 .7rem;
    border: none;
}

.inputArea.contenteditable .textareaBox {
    position: relative;
}

.textareaBox textarea,
.textareaBox [contenteditable="true"] {
    min-width: 100%;
    max-width: 100%;
    max-height: 100%;
    min-height: 100%;
    outline: none;
    resize: none;
    background: transparent;
    border: none;
}

/*VALORI VARIABILI*/
.inputArea.left .inputBox {
    margin-right: 1em;
}

.inputArea.center .inputBox {
    margin-left: 1em;
    margin-right: 1em;
}

.inputArea.right .inputBox {
    margin-left: 1em;
}

.inputArea .inputBox {
    height: 72px;
    height: 4.5rem;
    position: relative;
}

.inputArea.noHelper .inputBox {
    height: 56px;
    height: 3.5rem;
}

.inputArea .inputBox .inputLabel {
    top: 19px;
    top: 1.1875rem;
    width: auto;
}

.inputArea .inputBox .input,
.inputArea .inputBox .selInput,
.inputArea .inputBox .bkg {
    height: 56px;
    height: 3.5rem;
}

.inputArea .inputBox .inputLabel,
.inputArea .inputBox .input,
.inputArea .inputBox .selInput,
.inputArea .inputBox .inputMsg {
    padding: 0 12px;
    padding: 0 0.75rem;
}

/*TIPOLOGIE CAMPI*/
/*Campi pieni*/
.inputArea.filled .inputBox .bkg,
.inputArea.filled .inputBox .textareaBox {
    border-bottom: solid 1px;
    border-bottom: solid 0.0625rem;
}

.inputArea.filled .inputBox .input,
.inputArea.filled .inputBox .selInput {
    padding-top: 12px;
    padding-top: 0.75rem;
}

.inputArea.filled.focus .inputBox .bkg,
.inputArea.filled.data .inputBox .bkg {
    border: transparent;
}

.inputArea.filled.focus .inputBox .bkg:after,
.inputArea.filled.data .inputBox .bkg:after,
.inputArea.filled.focus .inputBox .textareaBox,
.inputArea.filled.data .inputBox .textareaBox {
    border-bottom: solid 2px;
    border-bottom: solid 0.125rem;
}

.inputArea.filled .inputBox .text {
    border: none;
}

.inputArea.filled.focus .inputBox .inputLabel,
.inputArea.filled.data .inputBox .inputLabel {
    top: 10px;
    top: 0.625rem;
}

.inputArea.filled.focus .inputBox .inputLabel,
.inputArea.filled.data .inputBox .inputLabel {
    /*width: 100%;*/
    width: auto;
}

.inputArea.filled.focus .inputBox .inputLabel .subtitle,
.inputArea.filled.data .inputBox .inputLabel .subtitle {
    font-size: 12px;
    font-size: 0.75rem;
    letter-spacing: 0.4px;
    letter-spacing: 0.025rem;
}

/*Campi contenuto*/
.inputArea.outlined .inputBox .focusedBorderBox .borderSx,
.inputArea.outlined .inputBox .focusedBorderBox .borderMid,
.inputArea.outlined .inputBox .focusedBorderBox .borderDx {
    border: solid 1px;
    border: solid 0.0625rem;
}

.inputArea.outlined .inputBox .focusedBorderBox .borderLabel {
    border-bottom: solid 1px;
    border-bottom: solid 0.0625rem;
}

.inputArea.outlined .inputBox .focusedBorderBox .borderSx {
    border-right: none;
}

.inputArea.outlined .inputBox .focusedBorderBox .borderDx {
    border-left: none;
}

.inputArea.outlined .inputBox .focusedBorderBox .borderMid {
    border-left: none;
    border-right: none;
}

.inputArea.outlined .inputBox .bkg.text {
    border: none;
}

.inputArea.outlined.focus .inputBox .focusedBorderBox .borderSx,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderSx,
.inputArea.outlined.focus .inputBox .focusedBorderBox .borderMid,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderMid,
.inputArea.outlined.focus .inputBox .focusedBorderBox .borderDx,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderDx {
    border: solid 2px;
    border: solid 0.125rem;
}

.inputArea.outlined.focus .inputBox .focusedBorderBox .borderLabel,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderLabel {
    border-bottom: solid 2px;
    border-bottom: solid 0.125rem;
}

.inputArea.outlined.focus .inputBox .focusedBorderBox .borderSx,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderSx {
    border-right: none;
}

.inputArea.outlined.focus .inputBox .focusedBorderBox .borderDx,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderDx {
    border-left: none;
}

.inputArea.outlined.focus .inputBox .focusedBorderBox .borderMid,
.inputArea.outlined.data .inputBox .focusedBorderBox .borderMid {
    border-left: none;
    border-right: none;
}

.inputArea.outlined.focus .inputBox .inputLabel,
.inputArea.outlined.data .inputBox .inputLabel {
    top: -5px;
    top: -0.3125rem;
    z-index: 1;
}

.inputArea.outlined .inputBox .textareaBox {
    position: relative;
    z-index: 1;
}

.inputArea.outlined.focus .inputBox .inputLabel .subtitle,
.inputArea.outlined.data .inputBox .inputLabel .subtitle {
    font-size: 12px;
    font-size: 0.75rem;
    letter-spacing: 0.4px;
    letter-spacing: 0.025rem;
}

.inputArea .inputBox .focusedBorderBox {
    position: absolute;
    height: 56px;
    height: 3.5rem;
    width: 100%;
    top: 0;
    left: 0;
}

.inputArea .inputBox .focusedBorderBox .borderSx,
.inputArea .inputBox .focusedBorderBox .borderDx,
.inputArea .inputBox .focusedBorderBox .borderLabel,
.inputArea .inputBox .focusedBorderBox .borderMid {
    height: 100%;
}

.inputArea .inputBox .focusedBorderBox .borderSx,
.inputArea .inputBox .focusedBorderBox .borderDx {
    width: .5rem;
}

.inputArea .inputBox .focusedBorderBox .borderLabel {
    padding: 0;
    width: 0;
}

.inputArea.focus .inputBox .focusedBorderBox .borderLabel,
.inputArea.data .inputBox .focusedBorderBox .borderLabel {
    padding: 0 .35rem;
    width: auto;
}

.inputArea .inputBox .focusedBorderBox .borderLabel .caption {
    white-space: nowrap;
    visibility: hidden;
}

.inputArea .inputBox .focusedBorderBox .borderMid {
    width: 100%;
}

/*Campi icone*/
.inputArea.icon.sx .inputBox .input,
.inputArea.icon.sx .inputBox .selInput,
.inputArea.icon.sx.dropdown.select .dropdownBox li {
    padding-left: 52px;
    padding-left: 3.25rem;
}

.inputArea.icon.dx .inputBox .input,
.inputArea.icon.dx .inputBox .selInput,
.inputArea.icon.dx.dropdown.select .dropdownBox li {
    padding-right: 52px;
    padding-right: 3.25rem;
}

.inputArea.icon.sx .inputBox .inputLabel {
    left: 40px;
    left: 2.5rem;
}

.inputArea.outlined.icon.sx.focus .inputBox .inputLabel,
.inputArea.outlined.icon.sx.data .inputBox .inputLabel {
    left: 0;
}

.inputArea.icon .inputBox .inputIcon {
    position: absolute;
    z-index: 1;
    top: 16px;
    top: 1rem;
}

.inputArea.icon .inputBox .inputIcon.iconSx {
    left: 16px;
    left: 1rem;
}

.inputArea.icon .inputBox .inputIcon.iconDx {
    z-index: 1;
    right: 16px;
    right: 1rem;
}

.inputArea.icon .inputBox .inputIcon i {
    font-size: 24px;
    font-size: 1.5rem;
    padding: 0;
}

/*Campi con prefisso o suffisso*/
.prefixBox,
.suffixBox {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.inputArea.prefix .inputBox .input,
.inputArea.suffix .inputBox .input {
    position: relative;
}

.prefixBox .prefixTxt,
.suffixBox .suffixTxt {
    opacity: 0;
    visibility: hidden;
}

.inputArea.filled.prefix.focus .prefixBox .prefixTxt,
.inputArea.filled.prefix.data .prefixBox .prefixTxt,
.inputArea.outlined.prefix.focus .prefixBox .prefixTxt,
.inputArea.outlined.prefix.data .prefixBox .prefixTxt,
.inputArea.filled.suffix.focus .suffixBox .suffixTxt,
.inputArea.filled.suffix.data .suffixBox .suffixTxt,
.inputArea.outlined.suffix.focus .suffixBox .suffixTxt,
.inputArea.outlined.suffix.data .suffixBox .suffixTxt {
    opacity: 1;
    visibility: visible;
}

.inputArea.filled.prefix .prefixBox .prefixTxt,
.inputArea.filled.suffix .suffixBox .suffixTxt {
    padding-top: 12px;
    padding-top: 0.75rem;
}

/*Campi con prefisso*/
.prefixBox {
    padding-left: 12px;
    padding-left: 0.75rem;
}

.inputArea.prefix .inputBox .input {
    padding-left: .2rem;
}

/*Campi con suffisso*/
.suffixBox {
    padding-right: 12px;
    padding-right: 0.75rem;
}

.inputArea.suffix .inputBox .input {
    padding-right: .2rem;
}

/*DROPDOWN*/
.inputArea.dropdown .inputBox {
    height: 56px;
    height: 3.5rem;
}

.inputArea.dropdown .inputBox .dropdownBox {
    width: 100%;
    position: relative;
    z-index: 2;
    max-height: 0;
    visibility: hidden;
    opacity: 0;
}

.inputArea.dropdown.focus .inputBox .dropdownBox {
    max-height: 144px;
    max-height: 9rem;
    visibility: visible;
    opacity: 1;
    overflow-y: auto;
}

.inputArea.icon .inputBox .inputIcon.iconDx {
    width: 24px;
    width: 1.5rem;
}

.inputArea.dropdown.focus .inputBox .inputIcon.iconDx i {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    position: absolute;
    left: 0;
}

.dropdownBox {
    max-height: 144px;
    max-height: 9rem;
    overflow-y: auto;
    height: 0;
}

.dropdownBox .dropdownMenu {}

.dropdownBox .dropdownMenu li {
    padding: 16px 8px;
    padding: 1rem 0.5rem;
    cursor: pointer;
}

.dropdown.select .input span {
    position: relative;
}

/*Tipologie Select*/
/*Checkbox*/
.box {
    height: 24px;
    height: 1.5rem;
    width: 24px;
    width: 1.5rem;
    margin-right: 24px;
    margin-right: 1.5rem;
    border: solid 3px;
}

.box i {
    padding: 0;
    opacity: 0;
    visibility: hidden;
}

.selControl.checked .box i {
    opacity: 1;
    visibility: visible;
}

/*====/FORM====*/

/*====PULSANTI====*/
.fab,
.button {
    position: relative;
    overflow: hidden;
    line-height: inherit;
    border: none;
    outline: none;
    cursor: pointer;
}

/*==GENERICI==*/
.button {
    padding: 0;
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: 1.25px;
    letter-spacing: 0.078125rem;
    text-transform: uppercase;
}

.button.lg {
    min-width: 64px;
    min-width: 4rem;
    height: 36px;
    height: 2.25rem;
    padding: 0 16px;
    padding: 0 1rem;
}

.button.icon.lg {
    padding-left: 12px;
    padding-left: 0.75rem;
}

.button.icon.lg i {
    padding: 0;
    margin-right: 8px;
    margin-right: 0.5rem;
    font-size: 18px;
    font-size: 1.125rem;
}

.button.icon.lg span:not(.ripple) {
    position: relative;
    top: -2px;
    top: -0.125rem;
}

.button.sm {
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem;
}

.button.icon.sm i {
    font-size: 24px;
    font-size: 1.5rem;
}

.button.icon.sm span:not(.ripple) {
    position: relative;
    top: -2px;
    top: -0.125rem;
}

.button.outlined {
    border: solid 1px;
    background: transparent;
}

.button.lg.outlined {
    height: 35px;
    height: 2.1875rem;
}

.button.sm.outlined {
    width: 47px;
    width: 2.9375rem;
    height: 47px;
    height: 2.9375rem;
}

.button.text {
    background: transparent;
    background: transparent;
}

.button.lg.text {
    padding: 0 8px;
    padding: 0 0.5rem
}

/*==/GENERICI==*/

/*==NUMERI DI PAGINA==*/
.tbPagesBox .customPageBox {
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem;
}

.tbPagesBox .customPageBox.outlined {
    border: solid 1px;
    width: 47px;
    width: 2.9375rem;
    height: 47px;
    height: 2.9375rem;
}

.tbPagesBox .customPageBox input {
    width: 100%;
    text-align: center;
    border: none;
    outline: none;
    background: transparent;
}

/*==/NUMERI DI PAGINA==*/

/*==FAB==*/
.fab {
    width: 56px;
    height: 56px;
    padding: 0px 16px;
    padding: 0rem 1rem;
    text-align: center;
    z-index: 10;
}

.fab i {
    padding: 0;
    font-size: 24px;
    font-size: 1.5rem;
}

.fab .fabLabel {
    height: 100%;
    width: 100%;
}

/*Posizionamento*/
.fab.fixed {
    position: fixed;
}

.fab.fixed.right {
    right: 16px;
    right: 1rem;
}

.fab.fixed.bottom {
    bottom: 16px;
    bottom: 1rem;
}

.fab.fixed.bottom.appBarFab {
    bottom: 1.8rem;
}

.fab.fixed.center {
    left: 0;
    right: 0;
    margin: auto;
}

/*/Posizionamento*/

/*Tipologie*/
.fab.mini {
    width: 40px;
    width: 2.5rem;
    height: 40px;
    height: 2.5rem;
    padding: 0px 8px;
    padding: 0rem 0.5rem;
}

.fab.text {
    width: auto;
    display: inline-block;
    height: 48px;
    height: 3rem;
    padding: 0px 20px;
    padding: 0 1.3rem;
}

.fab.text.icon {
    padding: 0px 20px 0px 12px;
    padding: 0 1.3rem 0 0.8rem;
}

.fab.text.icon i {
    padding-right: 12px;
    padding-right: .8rem;
}

/*/Tipologie*/

/*==/FAB==*/
/*====/PULSANTI====*/

/*====TABELLE E COLONNE====*/
.columnContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.columnWrap {
    -moz-flex-direction: row;
    -o-flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -o-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.columnNoWrap {
    -moz-flex-direction: row;
    -o-flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -o-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.verticalAlign {
    -moz-align-items: center;
    -o-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.verticalAlign.bottom {
    -moz-align-items: flex-end;
    -o-align-items: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.verticalAlign.stretch {
    -moz-align-items: stretch;
    -o-align-items: stretch;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.columnWrap.left,
.columnNoWrap.left {
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.columnWrap.center,
.columnNoWrap.center {
    -moz-justify-content: center;
    -o-justify-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.columnWrap.right,
.columnNoWrap.right {
    -moz-justify-content: flex-end;
    -o-justify-content: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.columnWrap.spaceBetween {
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.columnWrap.spaceAround {
    -moz-align-content: space-around;
    -o-align-content: space-around;
    align-content: space-around;
}

.columnWrap.spaceEvenly {
    -moz-align-content: space-evenly;
    -o-align-content: space-evenly;
    align-content: space-evenly;
}

.flexDirectionColumn {
    -moz-flex-direction: column;
    -o-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.col-5 {
    width: 5%;
}

.col-10 {
    width: 10%;
}

.col-15 {
    width: 15%;
}

.col-20 {
    width: 20%;
}

.col-25 {
    width: 25%;
}

.col-30 {
    width: 30%;
}

.col-33 {
    width: 33.33%;
}

.col-35 {
    width: 35%;
}

.col-40 {
    width: 40%;
}

.col-45 {
    width: 45%;
}

.col-50 {
    width: 50%;
}

.col-55 {
    width: 55%;
}

.col-60 {
    width: 60%;
}

.col-65 {
    width: 65%;
}

.col-70 {
    width: 70%;
}

.col-75 {
    width: 75%;
}

.col-80 {
    width: 80%;
}

.col-85 {
    width: 85%;
}

.col-90 {
    width: 90%;
}

.col-95 {
    width: 95%;
}

.col-100 {
    width: 100%;
}

.tbBox {
    border: solid 1px;
    border: solid .06rem;
    border-radius: 4px;
    border-radius: 0.25rem;
}

.tbContainer {
    overflow-y: hidden;
    height: 100%;
}

/*Righe*/
.row {
    height: 52px;
    height: 3.25rem;
    min-width: 100%;
}

.row.header {
    height: 56px;
    height: 3.5rem;
}

.row.filters .col {
    padding-top: 0;
    padding-bottom: 0;
}

.row .button.sm {
    width: 40px;
    width: 2.5rem;
    height: 40px;
    height: 2.5rem;
}

/*/Righe*/
/*Colonne*/
.row .col {
    height: 52px;
    height: 3.25rem;
    padding: 6px 16px;
    padding: 0.375rem 1rem;
    border-bottom: solid 1px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.row.header .col {
    height: 56px;
    height: 3.5rem;
}

/*/Colonne*/

/*Filtri colonne*/
.row.filters .inputArea,
.row.filters .inputArea .inputBox,
.row.filters .input,
.row.filters .inputArea .inputBox .bkg {
    height: 52px;
    height: 3.25rem;
    width: 100%;
}

.row.filters .inputArea.icon .inputBox .inputIcon.iconSx {
    left: 0;
}

.row.filters .inputArea.icon .inputBox .inputIcon .icon-empty-set {
    cursor: pointer;
}

.row.filters .inputArea.icon .inputBox .inputIcon i {
    font-size: 16px;
    font-size: 1rem;
}

.row.filters .inputArea.icon.sx .inputBox .inputLabel {
    padding-left: 0;
    left: 24px;
    left: 1.5rem;
}

.row.filters .inputArea.icon.sx .inputBox .input,
.row.filters .inputArea.icon.sx .inputBox .selInput {
    padding-left: 24px;
    padding-left: 1.5rem;
}

.inputArea .inputBox .inputLabel {
    top: 19.2px;
    top: 1.2rem;
}

/*/Filtri colonne*/

/*Footer tabella*/
.tbFooterArea .inputArea.select {
    width: auto;
}

.tbFooterArea .inputArea.select .inputBox {
    width: 80px;
    width: 5rem;
}

.tbFooterArea .inputArea.select .inputIcon {
    position: absolute;
    top: 6.4px;
    top: .4rem;
    right: 8px;
    right: .5rem;
}

.tbFooterArea .inputArea .inputBox .input,
.tbFooterArea .inputArea .inputBox .selInput,
.tbFooterArea .inputArea .inputBox .bkg,
.tbFooterArea .inputArea.select .inputBox {
    height: 32px;
    height: 2rem;
}

.tbFooterArea .inputArea.select.focus .iconDx {
    top: 4.8px;
    top: .3rem;
}

.tbFooterBox {
    padding: 0 16px;
    padding: 0 1rem;
}

/*/Footer tabella*/
/*====/TABELLE E COLONNE====*/

/*====UTILITA====*/
body,
html {
    width: 100%;
    height: 100%;
}

.hideElement {
    display: none;
}

.showElement {
    display: block;
}

.visibilityOff {
    visibility: hidden;
    opacity: 0;
}

.visibilityOn {
    visibility: visible;
    opacity: 1;
}

.container {
    padding: 48px;
    padding: 3rem;
}

.containerSm {
    padding: 16px;
    padding: 1rem;
}

.marginTop {
    margin-top: 48px;
    margin-top: 3rem;
}

.marginBottom {
    margin-bottom: 48px;
    margin-bottom: 3rem;
}

.marginLeft {
    margin-left: 48px;
    margin-left: 3rem;
}

.marginRight {
    margin-right: 48px;
    margin-right: 3rem;
}

.noMarginTop {
    margin-top: 0;
}

.noMarginBottom {
    margin-bottom: 0;
}

.noMarginLeft {
    margin-left: 0;
}

.noMarginRight {
    margin-right: 0;
}

.marginTopSm {
    margin-top: 16px;
    margin-top: 1rem;
}

.marginBottomSm {
    margin-bottom: 16px;
    margin-bottom: 1rem;
}

.marginLeftSm {
    margin-left: 16px;
    margin-left: 1rem;
}

.marginRightSm {
    margin-right: 16px;
    margin-right: 1rem;
}

.paddingLeft {
    padding-left: 48px;
    padding-left: 3rem;
}

.paddingRight {
    padding-right: 48px;
    padding-right: 3rem;
}

.paddingTop {
    padding-top: 48px;
    padding-top: 3rem;
}

.paddingBottom {
    padding-bottom: 48px;
    padding-bottom: 3rem;
}

.paddingTopSm {
    padding-top: 16px;
    padding-top: 1rem;
}

.paddingBottomSm {
    padding-bottom: 16px;
    padding-bottom: 1rem;
}

.paddingLeftSm {
    padding-left: 16px;
    padding-left: 1rem;
}

.paddingRightSm {
    padding-right: 16px;
    padding-right: 1rem;
}

.noPaddingLeft {
    padding-left: 0;
}

.noPaddingRight {
    padding-right: 0;
}

.noPaddingTop {
    padding-top: 0;
}

.noPaddingBottom {
    padding-bottom: 0;
}

.paddingSm {
    padding: 16px;
    padding: 1rem;
}

.marginSm {
    margin: 16px;
    margin: 1rem;
}

.fullHeight {
    height: 100%;
}

.fullHeightAuto {
    min-height: 100%;
}

.stickyBox {
    position: -webkit-sticky;
    position: sticky;
}

.noSelect {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

/*====/UTILITA====*/

/*====COMPONENTI====*/
/*Badge di notifica*/
[data-badge] {
    position: relative;
}

[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    left: 22.4px;
    left: 1.4rem;
    top: 1.6px;
    top: 0.1rem;
    padding: .1rem;
    border-radius: 50px;
    border-radius: 3rem;
    font-size: 8px;
    font-size: .5rem;
}

.smallBadge[data-badge]:after {
    content: "";
    width: 4.48px;
    width: .28rem;
    height: 4.48px;
    height: .28rem;
}

[data-badge=""]:after,
[data-badge="0"]:after {
    display: none;
}

/*/Badge di notifica*/

/*Barra di navigazione inferiore*/
.bottomNavBox {
    width: 100%;
    position: fixed;
    bottom: 0;
}

.bottomNavBox {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.bottomNavBox.hide {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

.bottomNavBox .bottomNav {
    height: 56px;
    height: 3.5rem;
}


.bottomNavBox .btnBox {
    height: 100%;
}

.bottomNavBox .bottomNav .btnBox {
    cursor: pointer;
    min-width: 80px;
    min-width: 5rem;
    max-width: 168px;
    max-width: 10.5rem;
}

.bottomNavBox .bottomNav .btnBox .btn {
    padding-left: 12px;
    padding-left: 0.75rem;
    padding-right: 12px;
    padding-right: 0.75rem;
}

.bottomNavBox .bottomNav .btnBox a {
    height: 100%;
    width: 100%;
}

.bottomNavBox p.label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*/Barra di navigazione inferiore*/

/*==APP BAR==*/
.appBarArea {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}

.appBarBox {
    height: 56px;
    height: 3.5rem;
    width: 100%;
    position: relative;
}

.appBarSection {
    height: 100%;
}

.appBarSection.pull {
    width: 7px;
    width: 0.4rem;
}

.appBarSection i {
    font-size: 24px;
    font-size: 1.5rem;
    padding: 0;
}

.appBarSection.sx,
.appBarSection.dx {
    padding: 16px;
    padding: 1rem;
}

.appBarSection .iconAppBar {
    position: relative;
}

.appBarSection.sx .iconAppBar {
    margin-right: 24px;
    margin-right: 1.5rem;
}

.appBarSection.sx .iconAppBar:last-child,
.appBarSection.sx .iconAppBar:only-child {
    margin-right: 0;
}

.appBarSection.dx {
    text-align: right;
}

.appBarSection.dx .iconAppBar {
    margin-left: 24px;
    margin-left: 1.5rem;
}

.appBarSection.dx .iconAppBar:first-child,
.appBarSection.sx .iconAppBar:only-child {
    margin-left: 0;
}

.appBarArea .hamburgerBtn {
    cursor: pointer;
    height: 24px;
    height: 1.5rem;
    width: 24px;
    width: 1.5rem;
    margin-right: 24px;
    margin-right: 1.5rem;
    position: relative;
}

.appBarArea .hamburgerBtn .bar {
    position: absolute;
    width: 100%;
}

/*APP BAR SUPERIORE*/
.appBarArea.top {
    top: 0;
}

.appBarArea.top.hide {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
}

.appBarArea.top .appBarBox {
    position: relative;
}

.appBarArea.top .hamburgerBtn {
    margin-right: 0;
}

.appBarArea.top .appBarSection.sx {
    min-width: 72px;
    min-width: 5rem;
}

.appBarSection.txt {
    position: relative;
}

.appBarSection.txt .appBarTitle {
    position: absolute;
    left: 0;
    bottom: 20px;
    bottom: 1.3rem;
}

.appBarArea.top.prominent .appBarBox {
    height: 128px;
    height: 8rem;
}

.appBarArea.top.prominent.scrollCompress.compressed .appBarBox {
    height: 56px;
    height: 4rem;
}

.appBarArea.top.prominent .appBarSection.txt .appBarTitle {
    bottom: 28px;
    bottom: 1.8rem;
}

.appBarArea.top.prominent.scrollCompress.compressed .appBarSection.txt .appBarTitle {
    bottom: 20px;
    bottom: 1.3rem;
}

/*/APP BAR SUPERIORE*/

/*APP BAR INFERIORE*/
.appBarArea.bottom {
    bottom: 0;
    display: none;
}

.appBarArea.bottom.hide {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
}

.appBarArea .fab.fixed.bottom {
    bottom: 29px;
    bottom: 1.8rem;
}

.fabBarInset {
    max-width: 83px;
    max-width: 5.2rem;
    min-width: 77px;
    min-width: 4.8rem;
    -webkit-clip-path: url(#appbarMask);
    -moz-clip-path: url(#appbarMask);
    -ms-clip-path: url(#appbarMask);
    -o-clip-path: url(#appbarMask);
    clip-path: url(#appbarMask);
}

/*/APP BAR INFERIORE*/
/*==/APP BAR==*/

/*BANNERS*/
/*Banners in cima alla pagina*/
.bannerArea {
    overflow-y: hidden;
    height: 0;
}

.banner {
    max-height: 52px;
    max-height: 3rem;
    border-bottom: solid 1px;
    border-bottom: solid 0.06rem;
}

.banner .bannerSection.txt {
    padding: 0 90px 0 24px;
    padding: 0 6rem 0 1.5rem;
}

.banner .bannerSection.actions {
    padding: 8px 8px 8px 0;
    padding: .5rem .5rem .5rem 0;
}

.bannerArea .bannerBox {
    visibility: hidden;
    opacity: 0;
}

.bannerArea.opened .bannerBox {
    visibility: visible;
    opacity: 1;
}

.bannerArea.sticky .bannerBox {
    position: fixed;
    z-index: 7;
}

/*Tipologie*/
.bannerArea.big .banner {
    max-height: 90px;
    max-height: 6rem;
}

.bannerArea.big .bannerSection.txt {
    padding: 20px 90px 20px 24px;
    padding: 1.3rem 6rem 1.3rem 1.5rem;
}

.bannerArea.big .bannerSection.actions,
.bannerArea.img .bannerSection.actions {
    position: relative;
}

.bannerArea.big .bannerSection.actions .footer,
.bannerArea.img .bannerSection.actions .footer {
    width: 100%;
    position: absolute;
    bottom: 8px;
    bottom: .5rem;
    right: 8px;
    right: .5rem;
}

.bannerArea.img .banner {
    max-height: 72px;
    max-height: 5rem;
}

.bannerArea.img .bannerImg {
    width: 40px;
    width: 3rem;
    height: 40px;
    height: 3rem;
    margin: 16px 24px 16px 16px;
    margin: 1px 1.5rem 1px 1px;
}

/*/BANNERS*/

/*CHIPS*/
.chip {
    padding: 8px 16px;
    padding: .5rem 1rem;
    border-radius: 80px;
    border-radius: 5rem;
    cursor: pointer;
    margin: .8px .8px .8px 0;
    margin: .5rem .5rem .5rem 0;
}

.chip.icon.dx,
.chip.icon.sx,
.chip.icon.dx .iconBox {
    padding-left: 8px;
    padding-left: .5rem;
}

.chip.icon.sx .iconBox {
    padding-right: 8px;
    padding-right: .5rem;
}

.chip .iconBox,
.chip .iconBox i {
    border-radius: 160px;
    border-radius: 10rem;
}

.chip .iconBox i {
    font-size: 13px;
    font-size: .8rem;
    position: relative;
    top: -1px;
    top: -0.06rem;
    background: rgba(0, 0, 0, .1);
    padding: 5px;
    padding: .3rem;
}

/*/CHIPS*/

/*TOOLTIPS*/
.tooltip {
    position: fixed;
    height: 24px;
    height: 1.5rem;
    padding: 0px 8px;
    padding: 0rem 0.5rem;
    cursor: default;
    visibility: hidden;
    opacity: 0;
    white-space: nowrap;
    -webkit-transform: scale(0);
    transform: scale(0);
}

.tooltip.hover {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.tooltipLabel {
    text-transform: none;
}

.tooltip .ripple {
    display: none;
}

/*/TOOLTIPS*/

/*SNACKBARS*/
.snackbarArea {
    position: fixed;
    width: 100%;
    z-index: 17;
}

.snackbarBox {
    position: absolute;
    visibility: hidden;
    opacity: 0;
}

.snackbarBox.active {
    visibility: visible;
    opacity: 1;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.snackbar {
    position: fixed;
    min-width: 344px;
    min-width: 22rem;
    max-width: 344px;
    max-width: 22rem;
    min-height: 48px;
    min-height: 3rem;
    bottom: 16px;
    bottom: 1rem;
    left: 0;
    right: 0;
    margin: auto;
}

.snackbar.fullWidth {
    width: 100%;
}

.snackbar.text .descriptionBox {
    padding: 6px 16px;
    padding: 0.4rem 1rem;
}

.snackbar.action .descriptionBox {
    padding: 6px 8px 6px 16px;
    padding: 0.4rem .5rem 0.4rem 1rem;
}

.snackbar.action .snackbarBtnBox {
    padding: 6px 8px;
    padding: 0.4rem .5rem;
}

.snackbar.action .description.col-100 .descriptionBox {
    padding: 16px 16px 0 16px;
    padding: 1rem 1rem 0 1rem;
}

.snackbar.action .snackbarBtn.col-100 .snackbarBtnBox {
    padding: 18px 8px 8px 8px;
    padding: 1.1rem .5rem .5rem .5rem;
}

/*/SNACKBARS*/

/*FINESTRE DI DIALOGO*/
.dialogArea {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
}

.dialogArea.openedDialog {
    visibility: visible;
    opacity: 1;
}

.dialogBox {
    width: 100%;
    height: 100%;
}

.dialogBox .dialog {
    min-width: 280px;
    min-width: 17.5rem;
    max-width: 560px;
    max-width: 35rem;
}

.dialogBox .dialog .dialogHeader {
    padding: 28px 24px 0px 24px;
    padding: 1.8rem 1.5rem 0px 1.5rem;
}

.dialogBox .dialog .dialogBody {
    padding: 20px 24px 28px 24px;
    padding: 1.3rem 1.5rem 1.8rem 1.5rem;
}

.dialogBox.scrollable .dialog .dialogBody {
    overflow-y: auto;
}

.dialogBox .dialog .dialogFooter {
    height: 52px;
    height: 3.3rem;
}

.dialogBox .dialog .dialogFooterBox {
    width: 100%;
    height: 100%;
    padding: 8px;
    padding: .5rem;
}

.dialogBox .dialog .dialogFooterBox .button {
    padding-right: 8px;
    padding-right: .5rem;
}

.dialogBox .dialog .dialogFooterBox .button:last-child,
.dialogBox .dialog .dialogFooterBox .button:only-child {
    padding-right: 0;
}

/*/FINESTRE DI DIALOGO*/

/*CARDS*/
.cardArea.left .cardBox {
    margin-right: 16px;
    margin-right: 1rem;
}

.cardArea.center .cardBox {
    margin-right: 16px;
    margin-right: 1rem;
    margin-left: 16px;
    margin-left: 1rem;
}

.cardArea.right .cardBox {
    margin-left: 16px;
    margin-left: 1rem;
}

.cardArea.elevated .cardBox .card {
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .5);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .5);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .5);
}

.cardArea.outlined .cardBox .card {
    border: solid 1px;
    border: solid 0.06rem;
}

/*Sezioni della card*/
.cardArea .cardBox .cardContent {
    width: 100%;
}

.cardArea .cardBox .cardBody,
.cardArea .cardBox .cardHeader {
    max-width: 100%;
}

.cardArea .cardBox .card .cardHeader {
    padding: 16px;
    padding: 1rem;
}

.cardArea .cardBox .card .cardHeader .thumbImgBox {
    padding-right: 16px;
    padding-right: 1rem;
}

.cardArea .cardBox .card .cardHeader .thumbImgBox .thumbImg {
    width: 40px;
    width: 2.5rem;
    height: 40px;
    height: 2.5rem;
}

.cardArea .cardBox .card .cardMedia {
    width: 100%;
    height: 194px;
    height: 12.125rem;
    position: relative;
    overflow: hidden;
}

.cardArea .cardBox .card .cardMedia img {
    width: 100%;
}

.cardArea .cardBox .card .cardBody {
    padding: 16px;
    padding: 1rem;
}

.cardArea .cardBox .card .cardFooter {
    padding: 8px;
    padding: 0.5rem;
}

/*/CARDS*/

/*TABS*/
.tabsBox {
    width: 100%;
    height: 48px;
    height: 3rem;
    overflow: hidden;
}

.tabsBox .tabs {
    height: 100%;
}

.tabsArea .tabs {
    position: relative;
}

.tabsArea.scrollable .tabsBox .tabs {
    padding-left: 52px;
    padding-left: 3rem;
}

.tabsBox .tabs .tab {
    height: 100%;
}

.tabsBox .tabs .tab .label {
    width: 100%;
}

.tabsArea .tabsBox .tab {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    min-width: 90px;
    min-width: 6rem;
    padding: 0 16px;
    padding: 0 1rem;
}

.activeTabBar {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    height: 0.13rem;
    z-index: 1;
}

/*/TABS*/

/*SLIDERS*/
.draggableSlider {
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    width: 100%;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: -webkit-grab;
    cursor: grab;
}

.draggableSlider::-webkit-scrollbar {
    width: 5px;
    width: 0.3rem;
    height: 3px;
    height: 0.19rem;
}

.draggableSlider::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

.draggableSlider::-webkit-scrollbar-thumb {
    background: transparent;
    border: 0px none #FFFFFF;
    border-radius: 0;
}

.draggableSlider::-webkit-scrollbar-thumb:hover {
    background: transparent;
}

.draggableSlider::-webkit-scrollbar-thumb:active {
    background: transparent;
}

.draggableSlider::-webkit-scrollbar-track {
    background: transparent;
    border: 0px none #FFFFFF;
    border-radius: 50px;
    border-radius: 3rem;
}

.draggableSlider::-webkit-scrollbar-track:hover {
    background: transparent;
}

.draggableSlider::-webkit-scrollbar-track:active {
    background: transparent;
}

.draggableSlider::-webkit-scrollbar-corner {
    background: transparent;
}

.draggableSliderArea.dissolve {
    position: relative;
}

.draggableSliderArea.dissolve:after,
.draggableSliderArea.dissolve:before {
    content: "";
    position: absolute;
    height: 100%;
    top: 0;
    z-index: 1;
}

.draggableSliderArea.dissolve:before {
    left: 0;
}

.draggableSliderArea.dissolve:after {
    right: 0;
}

/*Input sliders*/
.inputSlider {
    position: relative;
    width: 100%;
    height: 4px;
    cursor: pointer;
}

.inputSliderThumb {
    position: absolute;
    top: -8px;
    width: 20px;
    height: 20px;
    cursor: ew-resize;
    margin-left: -10px;
}

.inputSliderFill {
    height: 100%;
}

.tickMark {
    position: absolute;
    display: inline-block;
    padding: 8px;
    padding: .5rem;
    visibility: hidden;
}

.inputSliderArea.active .tickMark {
    visibility: visible;
}

/*/SLIDERS*/

/*==LISTE==*/
.listEl {
    height: 100%;
}

.listEl .icon i {
    font-size: 24px;
    font-size: 1.5rem;
    padding: 0;
}

.listArea .listGroupBox {
    padding: 8px 0 8px 0;
    padding: 0.5rem 0 0.5rem 0;
}

/*TIPOLOGIE*/
.scrollableList {
    overflow-y: auto;
}

.listElArea.threeLine .listElBox {
    height: 88px;
    height: 5.5rem;
}

.listElArea.twoLine.icon.sx .listElBox,
.listElArea.twoLine.thumbnail .listElBox,
.listElArea.singleLine.thumbnail.medium .listElBox,
.listElArea.singleLine.thumbnail.medium.icon.dx .listElBox,
.listElArea.singleLine.thumbnail.big .listElBox,
.listElArea.icon.dx.singleLine.thumbnail.big .listElBox {
    height: 72px;
    height: 4.5rem;
}

.listElArea.twoLine .listElBox {
    height: 64px;
    height: 4rem;
}

.listElArea.singleLine.icon.sx .listElBox,
.listElArea.singleLine.thumbnail.small .listElBox {
    height: 56px;
    height: 3.5rem;
}

.listElArea.singleLine .listElBox {
    height: 48px;
    height: 3rem;
}

.listElArea.icon .icon.sx {
    padding: 16px 32px 16px 16px;
    padding: 1rem 2rem 1rem 1rem;
}

.listElArea.icon .icon.dx,
.listElArea .meta {
    padding: 16px;
    padding: 1rem;
}

.listElArea .meta {
    padding-left: 28px;
    padding-left: 1.75rem;
}

.listElArea.icon.twoLine .icon.dx,
.listElArea.icon.singleLine.thumbnail.medium .icon.dx,
.listElArea.icon.singleLine.thumbnail.big .icon.dx {
    padding-top: 24px;
    padding-top: 1.5rem;
}

.listElArea.icon.singleLine.thumbnail.medium .icon.dx,
.listElArea.icon.singleLine.thumbnail.big .icon.dx {
    padding-bottom: 24px;
    padding-bottom: 1.5rem;
}

.listElArea.txt.singleLine .icon.dx {
    padding-top: 12px;
    padding-bottom: 0.75rem;
}

.listElArea .txtBox {
    padding: 16px;
    padding: 1rem;
}

.listElArea.sx .txtBox {
    padding-left: 0;
}

.listElArea.dx .txtBox {
    padding-right: 0;
}


.listElArea.thumbnail img {
    margin: 16px;
    margin: 1rem;
}

.listElArea.thumbnail.big img {
    margin-left: 0;
}

.listElArea.threeLine.thumbnail.big img {
    margin-right: 20px;
    margin-right: 1.25rem;
}

.listElArea.twoLine.thumbnail.big img,
.listElArea.singleLine.thumbnail.big img {
    margin: 8px 16px 8px 0;
    margin: .5rem 1rem .5rem 0;
}

.listElArea.singleLine.thumbnail.small img,
.listElArea.singleLine.thumbnail.medium img {
    margin: 8px 16px 8px 16px;
    margin: .5rem 1rem .5rem 1rem;
}

.listElArea.thumbnail.small img,
.listElArea.thumbnail.medium img {
    border-radius: 40px;
    border-radius: 2.5rem;
    width: 40px;
    width: 2.5rem;
    height: 40px;
    height: 2.5rem;
    min-width: 40px;
    min-width: 2.5rem;
    min-height: 40px;
    min-height: 2.5rem;
}

.listElArea.thumbnail.medium img {
    border-radius: 0;
}

.listElArea.singleLine.thumbnail.medium img {
    width: 56px;
    width: 3.5rem;
    height: 56px;
    height: 3.5rem;
    min-width: 56px;
    min-width: 3.5rem;
    min-height: 56px;
    min-height: 3.5rem;
}

.listElArea.thumbnail.big img {
    width: 100px;
    width: 6.25rem;
    height: 56px;
    height: 3.5rem;
    min-width: 100px;
    min-width: 6.25rem;
    min-height: 56px;
    min-height: 3.5rem;
}

.listBox[data-dropdown] {
    padding-top: 0;
    padding-bottom: 0;
}

.listGroupBox[data-dropdown].expanded {
    padding-bottom: 8px;
    padding-bottom: 0.5rem;
}

/*/==LISTE==*/

/*==MENU A DISCESA==*/
[data-dropdown_collegato]:hover {
    cursor: pointer;
}

.dropdownIcon {
    position: relative;
    height: 24px;
    height: 1.5rem;
    width: 24px;
    width: 1.5rem;
    margin-right: 16px;
    margin-right: 1rem;
}

.dropdownIcon i {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 24px;
    height: 1.5rem;
}

.expanded .dropdownIcon i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

[data-dropdown] {
    overflow-y: auto;
    height: 0;
    padding: 0;
}

/*/==MENU A DISCESA==*/

/*==MENU==*/
.menu.optionsList[data-pannello] {
    padding: 8px 0;
    padding: 0.5rem 0;
}

.menu .option {
    padding: 0 16px;
    padding: 0 1rem;
    height: 48px;
    height: 3rem;
    line-height: 48px;
    line-height: 3rem;
    cursor: pointer;
}

.menu.dense .option {
    height: 32px;
    height: 2rem;
    line-height: 32px;
    line-height: 2rem;
}

/*/==MENU==*/

/*==AVATAR==*/
.avatarArea.inline {
    display: inline-block;
}

.avatarArea.rounded .avatarBox,
.avatarArea.rounded .avatar {
    border-radius: 100%;
}

.avatarArea img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.avatarArea.mini .avatarBox {
    height: 20px;
    height: 1.3rem;
    width: 20px;
    width: 1.3rem;
}

.avatarArea.sm .avatarBox {
    height: 40px;
    height: 2.5rem;
    width: 40px;
    width: 2.5rem;
}

.avatarArea.lg .avatarBox {
    height: 56px;
    height: 3.5rem;
    width: 100px;
    width: 6rem;
}

.avatarArea.center .avatarBox {
    margin: 0 auto;
}

.avatarArea .avatar {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/*==/AVATAR==*/

/*==RITAGLIO IMMAGINE==*/
.dialog[data-proportions="1:1"] {
    width: 320px;
    width: 20rem;
}

.cropArea .zoom .small i {
    font-size: 16px;
    font-size: 1rem;
}

.cropArea .zoom .big i {
    font-size: 24px;
    font-size: 1.5rem;
}

.cropArea .dragArea {
    width: 100%;
    overflow: hidden;
}

.dialog[data-proportions="1:1"] .dragArea {
    height: 320px;
    height: 20rem;
}

.cropBox .line {
    position: absolute;
    z-index: 1;
}

.cropBox .grid1,
.cropBox .grid2 {
    width: 100%;
    height: 1px;
    height: 0.06rem;
}

.cropBox .grid3,
.cropBox .grid4 {
    height: 100%;
    width: 1px;
    width: 0.06rem;
}

.cropBox .grid1 {
    top: 33.33%;
}

.cropBox .grid2 {
    top: 66.66%;
}

.cropBox .grid3 {
    left: 33.33%;
}

.cropBox .grid4 {
    left: 66.66%;
}

/*==/RITAGLIO IMMAGINE==*/

/*====SFONDI e DECORAZIONI====*/
.overlay {
    height: 100%;
    width: 100%;
}

/*====/SFONDI e DECORAZIONI====*/

/*==GRAFICI==*/
.chart,
.chart .dataBox,
.chart.bar .barBox,
.chart.histogram .barBox {
    position: relative;
}

.chart.bar .barBox .bar,
.chart.bar .barBox .labelX,
.chart.histogram .barBox .bar,
.chart.histogram .barBox .labelX,
.chart .yAxis {
    position: absolute;
}

.chart .dataBox {
    z-index: 1;
}

.chart.bar .barBox {
    height: 100%;
}

.chart .yAxisArea {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
}

.chart .yAxisArea .dataY {
    position: absolute;
    height: 1px;
    height: .06rem;
    width: 100%;
    bottom: 0;
}

.chart .yAxisArea .dataY p {
    position: absolute;
}

.chart.bar .barBox .bar,
.chart.bar .barBox .labelX {
    position: absolute;
    max-width: 100%;
    left: 0;
    right: 0;
    margin: auto;
}

.chart.bar .barBox .bar,
.chart.histogram .barBox .bar {
    bottom: 0;
}

.chart.histogram .histogramData {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.chart.pie, .chart.pie .pieData {
    position: relative;
}

.chart.pie .slice {
    position: absolute;
    animation: graficoTorta 1s;
}

.chart.pie .slice span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
}

@keyframes graficoTorta {
    from {
        transform: rotate(0deg) translate3d(0, 0, 0);
    }
}

/*==/GRAFICI==*/
/*====/COMPONENTI====*/

/*====ANIMAZIONI ED EFFETTI====*/
[data-dropdown],
.expanded,
.dropdownIcon i,
.expanded .dropdownIcon i,
.bottomNavBox,
.snackbarBox,
.snackbarBox.active {
    -webkit-transition: .5s ease all;
    -moz-transition: .5s ease all;
    -ms-transition: .5s ease all;
    -o-transition: .5s ease all;
    transition: .5s ease all;
}

.appBarArea,
.appBarArea.top.hide,
.appBarArea.top.prominent.scrollCompress .appBarBox,
.appBarArea.top.prominent.scrollCompress.compressed .appBarBox,
.appBarArea.top.prominent .appBarSection.txt .appBarTitle,
.appBarArea.top.prominent.scrollCompress.compressed .appBarSection.txt .appBarTitle,
.appBarArea.bottom.hide,
.bannerArea .bannerBox,
.bannerArea.opened .bannerBox,
.tooltip,
.tooltip.hover {
    -webkit-transition: ease all .2s;
    -moz-transition: ease all .2s;
    -ms-transition: ease all .2s;
    -o-transition: ease all .2s;
    transition: ease all .2s;
}

.ripple {
    -webkit-animation: ripple .8s ease-out;
    -moz-animation: ripple .8s ease-out;
    -ms-animation: ripple .8s ease-out;
    -o-animation: ripple .8s ease-out;
    animation: ripple .8s ease-out;
}

/*====/ANIMAZIONI ED EFFETTI====*/

/*====MEDIA QUERIES (codice specifico per determinati dispositivi/piattaforme)====*/
/*Schermi inferiori al desktop*/
@media only screen and (max-width: 69em) {

    /*==SNACKBAR==*/
    .snackbarArea .snackbar {
        bottom: 72px;
        bottom: 4.5rem;
    }

    /*==/SNACKBAR==*/
}

/*Schermi grandi*/
@media only screen and (min-width: 1440px) {}

/*Mobile*/
@media only screen and (max-width: 47.938em) {}

/*Tablet*/
@media only screen and (min-width: 47.939em) and (max-width: 69em) {}

/*Desktop*/
@media only screen and (min-width: 69.1em) and (max-width: 1439px) {}

/*Schermi dal desktop a grandi*/
@media only screen and (min-width: 69.1em) {
    .bottomNavBox {
        display: none;
    }
}

/*IE Style*/
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
}

/*FIREFOX Style*/
@-moz-document url-prefix() {}

/*====/MEDIA QUERIES (codice specifico per determinati dispositivi/piattaforme)====*/