html,body{background: #fff;width: 100%; overflow-x: hidden;height: 100%;font-family: sans-serif; margin: 0; padding: 0;z-index: 1}
body.start{background: #eee}
main{position: relative; z-index: 1; margin-top: 70px}
.menu--secondary ~ main{margin-top: 0px}

.card > span > h2{margin: 0}
h2 > span{font-weight: 200;}
[data-name="state_cantiere"] > i{font-size: 1.5em}
.tile--cantiere > strong{left: 20px;top: 6px;position: absolute; font-size: 0.8em; font-weight: 400; text-transform: capitalize; margin-left: 10px; opacity: 0.4}
a[data-action="show-option-cantiere"]{position: absolute; top: 0px; right: 4px;padding: 4px 10px; border-radius: 10px;}
a[data-action="show-option-cantiere"] > i{font-size: 1.2em}
i.icon--state-cantiere{position: absolute; left: 5px; top: 5px}

/*rapid button*/
#filter-card-lists{position: inherit;}
#rapid-menu-lists{display: flex; top: 100%; margin-top: 5px;left: 0}

#filter-cerca{float: right;}

.no-content{display: none};

.iconic{ background: #000; border-radius: 2px; display: block; background: #666; position: absolute;}
.iconic--plus{position: relative; background: none;display: inline-block; float: left; padding: 11px; height: 20px; width: 20px;}
.iconic--plus > span{ width: 100%; height: 25%; display: block; background: #696969; position:absolute; border-radius:3px}
.iconic--plus > span:last-of-type{ transform: rotate(90deg); background: #313131;}

.iconic--rapid{color: #414141;font-size: 1.4em; line-height: 5px !important; position: relative; background: none;display: inline-block; float: left; padding: 11px; height: 20px; width: 20px; margin-right: 25px;}
.iconic--rapid{}

.card.importance{ box-shadow: 0 5px 15px rgba(0,0,0,0.3); }

[data-type="null"]{display: none !important}

.list--inline{display: inline-block; float: left; margin-right: 0px !important; }
a.active,
.card.active{box-shadow: 0 4px 15px #000}

a{text-decoration: none;color: #555;font-weight: bold;font-size: 20px;text-transform: capitalize;}
#bg--global{ position: fixed; left: 0; top: 0; width: 100%; height: auto; overflow: hidden; z-index: 0}
#circular-chart{margin: 0 auto; display: block;}
#bg-background{position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.25); pointer-events: none;z-index: 3; opacity: 0; }

.btn--icons{color: #999; font-size: 22px;font-weight: bolder;}
.btn--rapid > span:last-of-type{letter-spacing:2px; text-transform: uppercase; margin-left: 25px}
.btn--check{padding: 10px 20px;}
.btn--programming-send{ padding: 10px 20px; display: block;}
.btn--info{ padding: 10px 20px; display: block;}
.btn--add-cantiere{color: #fff; font-weight: 300; padding-top: 40px !important}

.btn--placeholder{padding: 25px;display: block;text-align: center;width: 100%;}
.btn--placeholder i{display: block; width: 100%; padding: 20px; font-size: 1.5em; font-weight: bolder;}

/*---------------------------------- ACTION HOVER ----------------------------*/

header ul.rapid--list:hover,
header ul.list--setting a:hover{box-shadow: 0 5px 15px rgba(0,0,0,0.3); background: #fefefe;}
.menu__item a:hover::before{content: "";background: rgba(255,255,255,0.1); position: absolute;width: 100%; height: 100%;left: 0;top: 0}
.table > tbody > tr:hover,
a.btn--programming-send:hover,
a.btn--info:hover{background: rgba(0,0,0,0.15); cursor: pointer}
[data-name="customer_name"]:hover{color: #696969; text-decoration: underline;}
a.btn--check:hover{background: #313131; color: #56b1e6}

.btn--dropdown-toggle{position: absolute; left: -30px; border: none; background: none; box-shadow: 0; font-size: 1.1em; font-weight: bold; color: #aaa}
.btn--dropdown-toggle:hover{color: red}

/*
.table--orders > tbody > tr:hover .color-row{transform: scale(1.15);box-shadow: 0 2px 3px rgba(0,0,0,0.8);z-index: 5 !important;border-top: solid 1px rgba(200,200,200,0.2);}
*/
nav > ul > li > a:hover{background: #ddd; color: #313131}
ul.rapid--list > li:hover{ background: #eee}
.menu--vertical > li:hover,
.menu--option > li:hover{background: #ddd}

.menu--secondary ul.rapid--list:hover{box-shadow: none; background: #eee}
.menu--secondary ul.rapid--list:hover i{}

[data-action]:hover > a ,
[data-name="order_customer_name"]:hover{color: #bc5e0a;}
/*[data-action]:hover > a > i{transform: scale(1.2);}*/
.card--pl.card--none > .col--tile:hover{transform: scale(1.02);}
.card--pl.card--none > .col--tile:hover::before{box-shadow: 0 15px 18px rgba(0,0,0,0.7)}
.card--pl.card--none > .col--placeholder:hover{transform: scale(1.02);box-shadow: 0 5px 12px rgba(0,0,0,0.5)}
td[data-action]:hover,
[data-name="order_customer_name"]:hover{background: rgba(255,255,255,0.6)}



#view-setting-list:hover{box-shadow: none}
#view-setting-list > li:hover{background: none}

#menu-secondary > div > ul:hover > div{ opacity: 1 !important; pointer-events: auto;}

.component--minimal > ul:hover{background: #efefef; border-color: #ddd; border-bottom-style: dashed;}

.menu--rapid .list--filter a:hover{background: none; color: none}
.menu--rapid .list--filter > li:hover{background: #ddd; color: #313131}


.card--cantieri-general tr:hover{background: #eee !important}
/*---------------------------------- ACTION SHOW ----------------------------*/
.main--home .card--tooltip.show{opacity: 1; position: fixed; pointer-events: auto;}
.main--order .card--tooltip.show{opacity: 1; position: absolute; pointer-events: auto;}
.main--cantiere .card--tooltip.show{opacity: 1; position: absolute; pointer-events: auto;}

.card--rapid-calendar.show{opacity: 1; border: solid 1px #aaa;pointer-events: auto;}
.card--rapid-menu.show{position: fixed; opacity: 1; border: solid 1px #aaa;pointer-events: auto;}
.card--vertical-menu.show{position: fixed; opacity: 1; border: solid 1px #aaa;pointer-events: auto;}
#bg-background.show{opacity: 1; pointer-events: auto;}
tr.active {z-index: 10;}

.progress-bar > span{position: absolute; width: 100%}

a[data-action="show-option-cantiere"]:hover{background: rgba(0,0,0,0.1)}

/*--------------------------------------HEADER--------------------------------*/
#header{}
header{z-index: 3}
.header{padding: 0 20px; border-bottom: solid 1px #ddd;background: #fff; position: fixed; width: 100%;}

ul.rapid--list{ padding: 0; margin: 0; display: inline-block;background: #fff;border: solid 1px #aaa;border-radius: 50px; overflow-x: hidden;}
ul.rapid--list > li{ display: inline-block; float: left;}
ul.rapid--list > li:first-of-type{padding: 11px 0 11px 6px}
ul.rapid--list > li:last-of-type a{ display: inline-block; padding: 18px 20px 18px 15px; border-left: solid 1px #aaa}
ul.rapid--list > li.uni-item > a{border: none;}
ul.rapid--list > li.uni-item{padding: 0;}
ul.rapid--list > li > a {line-height: 0}
ul.rapid--list > li > a > i {line-height: 15px}
ul.rapid--list a{ color: #000; font-size: 12px;}
ul.rapid--list-single a > i{font-size: 1.4em}

/*implementazione bottoni rapidi*/
ul.rapid--list-single {padding: 0;  min-width: 150px}
ul.rapid--list.rapid--list-single > li{padding: 0; width: auto; text-align: center; }
ul.rapid--list-single > li > a{padding: 0; display: block;}


#filter-card-send_date{}
#new-order{position: absolute; top: 0; left: 50%;margin-left: -100px !important;margin-top: 15px;}
#view-setting-list{border:none;top: 8px; padding: 0; margin: 0; position: absolute; right: 20px; width: 35px; height: 35px;display: flex;align-items: center;}
#view-setting-list li{width: 100%; text-align: center;}
.list--setting > li{list-style: none; text-align: center; padding: 10px 0; }
.list--setting > li > a{margin: 0 auto; font-size: 15px; color: #696969; line-height: 30px;width: 30px; height: 30px; display: block;border-radius: 50%; border: solid 1px #696969}


.btn--start > span:last-of-type{ display: inline-block; float: left; line-height: 28px; margin-right: 15px;}


/*---------------------------------------NAV----------------------------------*/
#nav{}
#menu-secondary .rapid--list .card--tooltip{top: 50px; left: 0; width: max-content; border-radius: 0; background: #eee; padding: 20px;}
#menu-secondary .rapid--list .card--tooltip ul{list-style: none; margin: 0; padding: 0}
#menu-secondary .rapid--list .card--tooltip ul li{display: block;padding: 5px 10px}

#vertical-menu{top: 70px; right: 20px; min-width: 150px}
.submenu{display: none}
.nav{padding: 0;margin: 0}

.menu--vertical{padding: 0; opacity: 1; visibility: visible; z-index: 3}
.menu--primary{display: inline-block; margin: 0;padding: 0}
/*.menu--secondary{padding: 0; margin: 0; border-bottom: solid 1px #ddd; background: #fff !important; max-width: 1200px; margin: 0 auto}*/
.menu--secondary{position: relative; padding: 0; margin-top: 0; border-bottom: solid 1px #ddd; background: rgba(230,230,230,0.9) !important; margin: 0 auto; z-index: 2; margin-top: 50px;}
.menu--secondary .rapid--list{border-radius: 0; position: relative; overflow: visible;}
.menu--secondary > div{margin-left: 25%; padding: 0 30px;}
.menu--secondary > div > ul{margin-right: 10px !important; background: none; border: 0; margin: 0 ;}
.menu--secondary > div > ul li:last-of-type a{border: none; padding-left: 0;}
.menu--secondary > div > ul li a > span{ text-decoration: underline;}
.menu--secondary li[data-action="view-rapid-list"]{display: none !important; pointer-events: none}
.menu--rapid{ padding: 20px; display: flex;}
.menu--option{padding: 0; width: auto; display: inline-block;}

.menu--vertical > li,
.menu--option > li{display: block;}
.menu--option > li.menu__item a{padding: 12px 20px; font-size: 1.1em; font-weight: 400;}

.menu--rapid > ul{width: 28%;padding: 0 10px; margin: 0; border-right: solid 1px #ccc; display: inline-block; float: left;}
.menu--rapid > ul:nth-of-type(2){width: 44%}
.menu--rapid > ul:first-of-type{padding-left: 0}
.menu--rapid > ul:last-of-type{border: none; padding-right: 0}
.menu--rapid > ul > li{list-style: none; border-bottom: dotted 1px #ddd}
.menu--rapid a{font-size: 14px; font-weight: 500;display: block;padding: 10px 20px; color: #212121}
.menu--rapid h5{ text-align: center; text-transform: uppercase; font-size: 0.9em}


.menu__item{display: inline-block; position: relative; list-style: none;}
.menu__item a{padding: 18px 20px; font-size: 12px; color: #000; display: block; text-decoration: none}
.menu__item.search{position: relative; margin-right: 20px}
.menu__item.search i{position: absolute; top: 12px; left: 20px; font-size: 12px}
.menu__item.search input{background: none;padding: 6px 20px 6px 40px;font-size: 14px; border:solid 1px #fff; border-radius: 16px}
.menu__item.search input:focus{border: solid 1px #aaa}


.list--filter > li{display: flex; align-items: center;}
.list--filter > li > a:first-child{padding: 5px; padding-left: 10px}
.list--filter > li > a:first-child i{font-size: 1.3em; color: #aaa}

/*Gestisco i bottoni all'interno di un h2 (card title)*/
h2 > .card{background: none; box-shadow: none}
/*-------------------------------------CONTENT--------------------------------*/
#content{position: initial;width: 100%; margin-top: 50px;z-index: 1; padding-top: 25px;background: #696969;}

/*Cipient__card contiene piu card*/
.cipient__card{pointer-events: auto; display: flex; position: absolute; top: 3px; right: 0;}

.card{background: #fff; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.4)}
.card--tooltip{position: absolute; overflow: hidden; width: max-content; border-radius: 25px; display: inline-block;  right: 30px; z-index: 3; opacity: 0; pointer-events: none;}
.card--tooltip.card--form{border-radius: 8px}
.card--tooltip.card--form.card--single-form{top: 4px; right: 0; overflow: visible; opacity: 1}
.card--form{padding: 0 0 0 20px; }
.card--form .btn--check{float: right;}

.card--search-result{width: 100%; top: 100%; left: 0; border: solid 1px #ddd; border-width: 0 1px 1px 1px; border-radius: 0 0 6px 6px; box-shadow: 0 5px 60px #999; }
.card--search-result ~ textarea{border: solid 1px #ddd; border-width: 1px 1px 0 1px ; border-radius: 6px; position: relative; z-index: 4; resize: none; background: #fff;}
.card--search-result .table > thead > tr > th{padding:  10px 15px !important}
.card--search-result .table > tbody > tr > td{border-color: #ddd; font-weight: 500; }


.card--cantieri-general{background: none !important; box-shadow: none;}
.card--cantieri-general .col--tile{margin: 0 20px; padding: 20px; width: 550px; height: 300px; background: rgba(255,255,255, 0.95); box-shadow: 0 3px 5px rgba(0,0,0,0.3); border-radius: 8px;}
.card--cantieri-general .col--tile span.tile--span{display: none}
.card--cantieri-general .col--tile::before{ display: none}
.card--cantieri-general h3.table-category{display: none}
.card--cantieri-general td{border: none !important}
.card--cantieri-general .tile tr.active{background: inherit}
.card--cantieri-general .category-table{z-index: 2; position: relative;}
.card--cantieri-general .table--orders{overflow: visible;}

.card--cantieri-general .category-table,
.card--cantieri-general .category-table table,
.card--cantieri-general .category-table table tbody{width: 100%}
.card--cantieri-general .category-table table tbody [data-name="format_cantiere"]{width: 40%}


.card--expire-data table thead{display: grid;}
.card--expire-data table tbody{display: block; overflow-y: scroll; height: 500px}
/*.card--cantieri-general thead{display: none}

.card--cantieri-general tbody{display: flex;}

.card--cantieri-general td[data-name="name_cantiere"]{font-size: 1.2em; text-transform: uppercase; font-weight: bolder; display: block; text-align: center !important;}
.card--cantieri-general td[data-name="state_cantiere"]{position: absolute; top: 20px; right: 10px}
.card--cantieri-general td[data-name="start_date"]{display: block; text-align: center; line-height: 0; padding: 0; font-size: 1em; font-weight: 400; opacity: 0.4}
*/

/*Tile cantiere/...*/
.tile{overflow: hidden; background: none; display: inline-block; width: 100%; border-radius: 2px; display: flex; align-items: center; align-content: center; flex-direction: column; position: relative;}
.tile--cantiere{overflow: initial;}

.list .tile .tile__placeholder{display: block;width: 100%; text-align: center; padding: 5px 10px; margin-bottom: 25px}
.list .tile .tile__placeholder a{ display: block; padding: 5px; border: dashed 2px #aaa; border-radius: 8px}
.tile > div{z-index: 1}

.tile  h3{text-align: center; margin-top: 30px !important; }
.tile > span{width: 120%; height: 80%; background: #eee; position: absolute; translate: revert-layer; z-index: -1}
.tile > span:nth-last-of-type(1){top: 10%; transform: rotate(-25deg);}
.tile > span:nth-last-of-type(2){top: 10%; transform: rotate(25deg);}
.tile > span:nth-last-of-type(3){width: 20%; height: 100%; transform: rotate(25deg); left: 20px}
.tile > span:nth-last-of-type(4){width: 20%; height: 100%; transform: rotate(-25deg); left: 20px}
.tile > span:nth-last-of-type(5){width: 20%; height: 100%; transform: rotate(25deg); right: 20px}
.tile > span:nth-last-of-type(6){width: 20%; height: 100%; transform: rotate(-25deg); right: 20px}


/*nascondo card*/
.card > .card{background: none; border-radius: 0; border: 0; padding: 0; box-shadow: none}
.card.card--none{background: none; box-shadow: none; padding: 0;}
.card.card--no-p{padding: 20px 0;}
.card.card--no-p > .card--component.card--emailForm{padding: 20px 0 0 0}

.card.card--pl > div:last-of-type{margin-top: 5px;border: dashed 3px #eee; background: rgba(255,255,255,0.2); }
.card.card--none > span{background: #313131; display: inline-block; height: 100%; width: 100%; border-bottom: 20px solid; border-image-source: linear-gradient(to right,darkorange, red, purple, purple); border-image-slice: 1;}

.card.card--none > span > h2{color: #eee !important;}
.card--cantiere > span{  border-radius: 8px 8px 0 0}

.card--info{ display:inline-block; position: absolute;}
.card--send-program{ display:inline-block; position: absolute;}

.card--trend-circular{max-height: 550px}
header .card--rapid-menu{width: 640px; position: absolute; left: 50%; margin-left: -320px; top: 75px; opacity: 0; pointer-events: none; z-index: 4}
main .card--rapid-menu{left: 0; margin: 0; top: 100%;}
main .card--rapid-menu .menu--rapid > ul{width: auto;}
main .card--rapid-menu .menu--rapid > ul > li > a{line-height: 1em}
.card--rapid-calendar{top: 0; opacity: 0; pointer-events: none; z-index: 4; position: absolute;}
.card__title{text-align: center; color: #393939; line-height: 45px; position: relative; margin-top: 0}
.card__pre-title{opacity: 0.7; display: inline;}
.col--inner > .card:first-of-type{margin-bottom: 60px}
.boxed{padding: 20px}


.card > .card{}
.card > .card label{display: inline-block; }
.card > .card input,
.card > .card textarea{display: block;background: none; padding: 10px 15px; width: 100% !important}

.card--article--pd.open,
.card--article--pd.open .card--tooltip{background: #eee}

.card--customerForm .component--wrapper > div {display: flex; align-content: center; align-items: baseline; border-bottom: solid 1px #bbb}
.card--customerForm label{min-width: 65px}

/*definisco alcune istruzioni nel caso card si trovi all'interno di un contenitore specifico*/
.cipient__card > .card{margin-right: 5px; position: relative; top: 0 !important; right: 0 !important; overflow: hidden !important; z-index: 4}
.cipient__card > .card:last-of-type{margin: 0;}
.cipient__card > .card--rapid-form{position: absolute !important; top: 100% !important; margin-top: 10px !important; width: 130%}

/*--------------------------------------TABLE---------------------------------*/

.category-table h3{margin-top: 40px; padding: 0 15px}

.table thead > tr > th {padding: 0 15px 15px 15px;font-size: 0.8em;letter-spacing: 2px;}
.table > tbody > tr > td {border-top: dotted 1px #aaa;padding: 12px 15px;font-size: 14px;}
.table > tbody > tr{position: sticky;}
.table, table.table>tbody>tr, .table>tbody>tr>td {border-collapse: collapse;}
.card--orders-general .table > tbody > tr > th, .card--orders-general .table > tbody > tr > td {position: relative;}

.table > tbody > tr > td:first-of-type{text-align: left; position: relative;}

thead th{text-align: center;}
thead th:first-of-type,
thead th:nth-of-type(2){text-align: left;}
thead th:last-of-type{text-align: right;}


[data-name="cost"],
[data-name="price"]{width: 120px; text-align: right !important;}
[data-name="total"]{width: 140px; text-align: right !important;}

[data-name="id_order"]{width: 145px !important}
[data-name="type"]{width: 70px }
[data-name="customer_subject"]{width: 50% !important; position: inherit;padding-right: 0 !important}
[data-name="order_customer_name"]{width: 280px !important;text-align: center; cursor: pointer;color: #999;}
[data-name="societa"]{width: 200px}
[data-name="email"]{width: 280px}
[data-name="adress"]{width: 300px}
[data-name="cap"]{width: 100px}
[data-name="expired_order"]{width: 100px}
[data-name="date"]{width: 180px}
/*table*/table [data-name="expire_date"]{max-width: 160px; min-width: 150px}

tr[data-status="paid"]{background: rgba(40,130,40,0.3)!important}
tr[data-status="unpaid"]{background: rgba(130,186,200,0.3)!important}
tr[data-status="expired-unpaid"]{background: rgba(180,120,100,0.3)!important}

[data-name="total"], .table__result td, .trend__item__total{letter-spacing: 2px;font-weight: normal;font-size: 1em}
[data-name="pdf"] a{color: #000; font-size: 10px; font-weight: bolder;}
[data-name="pdf"],
[data-name="download"]{position: absolute !important;}

[data-name="outgo"]{text-align: right !important;}
[data-name="expired_order"] > span{margin-left: 10px}
[data-name="customer_subject"] > span{display: block;width:500px;overflow: hidden !important;text-overflow: ellipsis;white-space: nowrap;}

[data-name="margin"]{color: green}

[data-name="id_order"] > span.color-row{border: solid 1px rgba(255,255,255,0.05); position:absolute;left:-30px;top:0;width:35px;z-index:2; height:100%;font-size: 9px; }
.card--cantiere [data-name="id_order"]{ display: flex;align-items: center;}
.card--cantiere [data-name="id_order"] > span.color-row{margin-right: 5px;width: 20px; position: relative; background: #6b7b77; height: 20px; border-radius: 100%; left: 0; display: inline-block; float: left;}

[data-name="email"]{text-align: center}
[data-name="city"]{text-align:right;}

/*.row--expired::before{content: ""; position: absolute; left: 0; top: 0;width: 100%; height: 64%; background: darkred ; opacity: 0.2; pointer-events: none}*/
.row--expiring-soon::before{content: ""; position: absolute; left: 0; top: 0;width: 100%; height: 64%; background: #298790 ; opacity: 0.2; pointer-events: none}

.tile table{ display: block; border-radius: 4px; overflow: hidden;}
.tile tbody tr{background: none}
.tile thead{display: none}

.tile tr.active{background: #aec0ca}


textarea[name="customer_text"]{min-height: 300px}
/*--------------------------------------ASIDE---------------------------------*/
#aside{}
.aside{top: 0; padding-top: 50px}
.aside--nav{display: inline-block;position: fixed;height: 100%;width: 150px;float: left;background: #fff;border-right: solid 1px #ddd }


/*Elementi dinamici*/
.group{}
.group > div{width: 100%; display: inline-block;}
main .card > .group.has-dropdown,
main .card > .component.has-dropdown{height: 40px; overflow: hidden;}

.component > div{width: 100%;  display: inline-block}

/*qui gestisco i bottoni minimal style*/
.component--minimal{display: inline-block; height: auto; overflow: initial !important; position: relative;}
.component--minimal > ul{ background: none; overflow: initial; position: relative; border-radius: 8px 8px 0 0; border: solid 1px transparent}
.component--minimal > ul > li:first-of-type{padding-left: 20px}
.component--minimal > ul > li:first-of-type > a > span{margin-right: 0; letter-spacing: 0; text-transform: capitalize; font-size: 1.8em}
.component--minimal > ul > li > a > i{ font-size: 1.6em}

.component--minimal > ul > li:first-of-type:hover a {color: inherit;}
.component--minimal > ul > li:last-of-type > a{border: none;}
.component--minimal > ul:hover li{background: none}

.component--minimal .card--tooltip{border-radius: 2px 2px 8px 8px; border-color: #aaa}
/*.card > .component{display: flex; align-content: center; align-items: center;}
.card > .component > label{display: none}
.card > .component > span{display: inline-block; width: 40px}
.card > .component > input{display: inline-block; border-width: 0 0 1px 0 !important; margin: 0}*/

.dropdown{}
.dropdown--header{}
.dropdown--header > span{padding: 10px; float: left;}
.dropdown--header > span:last-of-type{float: right; padding: 0}
.dropdown--header > span:last-of-type a{padding: 10px}
.dropdown--content{ padding: 20px; border: solid 1px #ccc; border-radius: 8px; background: #dedede}
.dropdown__label{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 85%; display: inline-block;}

.dropdown--content > .component > .component > span:first-of-type{display: none;}
.dropdown--content > .component > .component > label{font-size: 0.9em; opacity: 0.4}
.dropdown--suggestions{height: auto; overflow: hidden;}
.dropdown--suggestions.hidden{height: 0;}
.dropdown--suggestions input{text-align: left !important; width: 50% !important}
.group.visible,.component.visible,
.card--component.visible > .component{ height: auto !important;}

.group.hidden,.component.hidden{ height: inherit; overflow: hidden;}
.card > .card--component{padding: 5px 20px; border-bottom: solid 1px #ddd}
.card > .card--component:last-of-type{border-bottom: 0}


/*suggestion style, ricerca*/
.table--Order_rows tr.is-active {
  background-color: #eee;   /* o quello che vuoi */
  cursor: pointer;
}



/*-------------------------------------FOOTER---------------------------------*/
#footer{}
footer{ position: fixed; background: #212121; bottom: 0; width: 100%; height: 65px; box-shadow: inset 0 10px 35px rgba(0, 0, 0, 0.5);}

.op-90{background: rgba(255,255,255,0.9);}

/*--------------------------------------FORM----------------------------------*/
form input{ font-size: 20px; padding: 10px 20px; border: none; border-bottom: solid 1px #ddd}
form input:first-of-type{border: none}
input::placeholder{color: #ccc !important}
.card--tooltip.card--form.card--single-form form{display: inline-block;}
/*-----------------------------------ANIMATION--------------------------------*/
.anm{transition: all 0.2s linear; -webkit--transition: all 0.2s linear;}
.anm--fast{transition: all 0.1s linear; -webkit--transition: all 0.1s linear;}
.rotate--90{transform: rotate(-90deg)}

/*--------------------------------------COL-----------------------------------*/
.card--cantiere > .col__12{background: none;}
.card--cantiere > .col--placeholder{ border-radius: 0 0 8px 8px}

.col--last{padding-left: 20px;}
.col--tile::before{position: absolute; content: ""; width: 94%; height: 86%; left: 3%; top: 8%; background: red; transition: all 0.2s linear; -webkit--transition: all 0.2s linear; z-index: -1}
.col--tile{margin-top: -10px}

.col,
.col__1,.col__2,.col__3,.col__4,.col__5,.col__6,.col__7,.col__8,.col__9,.col__10,.col__11{display: inline-block;float: left; position: relative;z-index: 1}
.col__1{width:8.33%;}
.col__2{width:16.66%;}
.col__3,.show-left .col__3.order--menu-setting{width: 25%;}
.col__4{width: 33.33%;}
.col__5{width: 41.66%}
.col__6{width: 50%;}
.col__7{width: 58.33%;}
.col__8{width: 66.66%;}
.col__9,.show-left .col__9.content__tabs{width: 75%;max-width: 1650;left: 25%;margin: 0 auto;}
.col__10{width: 83.33%}
.col__12{width: 100%; display: block;}
.row{margin: 20px 0;}

main > .col > .col__12.col:first-of-type{padding-left: 20px}
main > .col > .col__12.col:last-of-type{padding-right: 20px}
.col--inner{padding: 30px;}
.col--inner:first-of-type{padding-left: 60px;}
.col--inner:last-of-type{padding-right: 60px;}

/*----------------------------------EXTENSION---------------------------------*/

/*correction*/
.clearfix:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/*inner padding*/
*,
*:before,
*:after{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}