.tableAcc .tableWrap{margin-top:10px}

.tableAcc table{table-layout:fixed;border-collapse:separate;border-spacing:0;width:100%}

.tableAcc table tr{width:100%}

.tableAcc table td,.tableAcc table th{padding:0 0 20px;width:8%!important;text-align:center;vertical-align:middle}
.tableAcc table td:first-child,.tableAcc table th:first-child{width:52%!important;text-align:left}
.tableAcc table td:first-child,.tableAcc table th:first-child{padding-left:15px}
.tableAcc table td:last-child,.tableAcc table th:last-child{padding-right:15px}

.tableAcc table tr:nth-child(2) th:first-child{font-weight:normal}
.tableAcc table tr:nth-child(2) th:first-child ~ th{font-size:var(--font-size-xl)}

.tableAcc table thead{position:relative;z-index:10}
.tableAcc table thead th{position:sticky;padding-bottom:10px;background-color:#fff}
.tableAcc table thead tr.headRow:nth-child(1) th{top:60px;z-index:11;padding-top:10px}
.tableAcc table thead tr.headRow:nth-child(2) th{top:100px;border-bottom-width:1px;border-color:#dadada}

.tableAcc table tr.accRow td{padding:0;font-weight:bold}
.tableAcc table tr.accRow + tr td{padding-top:15px}
.tableAcc table tr.accRow td label.tabAcc{position:relative;padding:10px 15px;background-color:#fafafa;cursor:pointer;-webkit-transition:all .4s;transition:all .4s}
.tableAcc table tr.accRow td label.tabAcc:hover{background-color:#eaeaea}
.tableAcc table tr.accRow td label.tabAcc::after{content:'\f106';position:absolute;top:10px;right:15px;font-family:awesome}
.tableAcc table tr.accRow td label.tabAcc.act::after{content:'\f107'}

.tableAcc table tr.accRow.inact ~ .contRow.inact{display:none}

.tableAcc table td > span{display:inline-block;width:auto;font-size:var(--font-size-r)}

.tableAcc table label{padding:0}
.tableAcc table label.hasInfo{position:relative}
.tableAcc table .contRow td:first-child ~ td label{display:inline-block;width:auto;font-size:var(--font-size-s);line-height:2}

.tableAcc table label .tableLabel,.tableAcc table label .tableHint,.tableAcc table .headRow label.hasInfo > span{display:inline-block;width:auto}
.tableAcc table label .tableHint{margin-left:10px}

.tableAcc table label .tableHint .toolAcc{display:block;position:relative;width:20px;height:20px;font-size: 14px;text-align:center;line-height:1.2;color:#d2d2d2;background-color:#fff;border:1px solid #aaa;-webkit-border-radius:50%;border-radius:50%;cursor:pointer;-webkit-transition:all .4s;transition:all .4s}
.tableAcc table label .tableHint .toolAcc:hover,.tableAcc table label .tableHint .toolAcc.cur{color:var(--color-black);border-color:var(--color-black)}
.tableAcc table label .tableHint .toolAcc.cur{z-index:15;-webkit-filter:drop-shadow(0 -2px 3px rgba(0, 0, 0, 0.1));filter:drop-shadow(0 -2px 3px rgba(0, 0, 0, 0.1))}
.tableAcc table label .tableHint .toolAcc.cur::after{
	content:'';display:block;position:absolute;z-index:21;top:calc(100% + 5px);left:50%;width:15px;height:10px;background-color:#fff;
	-webkit-transform:translateX(-50%);transform:translateX(-50%);
	-webkit-clip-path:polygon(50% 0%, 0% 100%, 100% 100%);clip-path:polygon(50% 0%, 0% 100%, 100% 100%)}

.tableAcc table label .tableHint .accContent{
	display:block;position:absolute;z-index:12;top:calc(100% + 14px);left:0;padding:10px 15px;width:80%;min-width:20vw;background-color:#fff;
	-webkit-box-shadow:0 4px 15px rgba(0,0,0,.2);-ms-box-shadow:0 4px 15px rgba(0,0,0,.2);box-shadow:0 4px 15px rgba(0,0,0,.2);
	-webkit-border-radius:7px;border-radius:7px;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:top center;transform-origin:top center;-webkit-transition:all .4s;transition:all .4s
	}
.tableAcc table label .tableHint .accContent.cur{-webkit-transform:scaleY(1);transform:scaleY(1)}

.tableAcc table label .tableHint .accContent *{font-size:var(--font-size-s);font-weight:normal;text-align:left}
.tableAcc table label .tableHint .accContent ul{padding-left:35px}
.tableAcc table label .tableHint .accContent ul li{text-indent:-30px}
.tableAcc table label .tableHint .accContent ul li::before{content:'!';display:inline-block;margin-right:10px;width:18px;font-size:var(--font-size-xs);text-align:center;text-indent:0;color:#fff!important;background-color:var(--color-black);-webkit-border-radius:50%;border-radius:50%}
.tableAcc table label .tableHint .accContent ul li:last-of-type{margin-bottom:0}

.tableAcc table i{display:block;padding:0;width:25px;height:25px;color:#fff;-webkit-border-radius:50%;border-radius:50%}
.tableAcc table i.fa-check{background-color:#0ac254}
.tableAcc table i.fa-check::before,.tableAcc table i.fa-check::after{position:relative;top:-3px;font-family:awesome}
.tableAcc table i.fa-check::before{content:'\e81d'}
.tableAcc table i.fa-xmark{background-color:var(--main-color)}
.tableAcc table i.fa-xmark::before{content:'\e81b';position:relative;top:-1px}


/* --- VIEWPORTS --- */

@media only screen and (min-width:200px) and (max-width:1024px) {

	#page .tableAcc table tbody .contRow {margin-top:20px;border-bottom:1px solid #dedede}

	#page .tableAcc table{padding:5% 5% 0 }
	#page .tableAcc table,#page .tableAcc thead,#page .tableAcc tfoot{display:block}
	#page .tableAcc tr{display:webkit-flex;display:ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}
	#page .tableAcc th,#page .tableAcc td{display:inline-block;padding-left:0;text-align:center}
	
	#page .tableAcc table .contRow td:first-child{width:100%!important;text-align:left}

	#page .tableAcc table .headRow th {border:none !important}

	#page .tableAcc table .headRow:last-child th:first-child {width:100% !important;}
	#page .tableAcc table .headRow:first-child th:first-child {display: none;}
	#page .tableAcc table .headRow th .hasInfo span {font-size: var(--font-size-l)}
	#page .tableAcc table .headRow th .hasInfo .toolAcc {font-size: var(--font-size-s)}

	#page .tableAcc table .accRow.inact td, #page .tableAcc table .accRow.act td, #page .tableAcc table .accRow.inact.act td {width: 100% !important;text-align: left;}
}

@media only screen and (min-width:200px) and (max-width:500px) {

	#page .tableAcc table .headRow th .hasInfo span{font-size: var(--font-size-m)}
	.tableAcc table .contRow td:first-child ~ td label{font-size: var(--font-size-xs)}
	.tableAcc table i{width:18px !important;height:18px !important}

}