/*
#  ………  adHoc CMS ©
#  ………  by Penanders 2010-2017
#  ………  Licence: GNU-GPL V3
*/
* {
  margin: 0;
  padding: 0;
  border: 0px none;
  outline: 0px none;
  vertical-align: baseline;
  box-sizing: border-box;
}
html, body{
   font-size: 15px;
   font-family: Verdana, sans-serif;  
   background:#ededef;
   min-height: 100%;
   height: 100%;
   -ms-text-size-adjust:100%;
   -webkit-text-size-adjust:100%
}

h1, h2, h3, h4 {font-weight:400;margin: 4px 0;}
h1 {font-size:36px;line-height: 48px;text-align: center;}
h2 {font-size:22px; color:#222}
h3 {font-size:18px;}
h4 {font-size:16px}
table {overflow-x:auto;/*min-width:98%;*/} /* min-width errore pagina di configurazione aspetto */   
a {
	color:#369;
	text-decoration:none;
}
sup {vertical-align: super;font-size: 10px;}
.bold{font-weight:bold}
.big	{font-size: 17px;}
.small {font-size: 13px;}
.tiny {font-size: 11px}
[class|="mob"]{display:none}
.disabled {color:#bbb}
/* Login */
.bodylogin {background:#2c3e50;}
.bodylogin a:hover {color:#5f7488;}
#login {width: 400px;margin: 3em auto;box-shadow: 10px 10px 20px #000;}
#login h2 {background:#00a2cf; margin: 0;color: #fff;padding: 16px;font-weight: bold;text-transform: uppercase;text-align: center;}
#login .pnl {border:0}
#login p {display:flex;margin: 8px 0;}
#login p img {width: 40px;height: 40px;background: #0088AE;padding: 9px;vertical-align: baseline;margin-top: 2px;}
#login p input{width:100%;font-size: 130%;}
#login .pnl .btn {margin: 0;padding: 12px;}

/*Blocks*/
.container{overflow: hidden;padding-bottom:30px}
header, footer {display: table}
header{height:60px;padding: 0 18px;background: #fff;;width:100%;}
footer {width:inherit; position:fixed; bottom:0; background: #c2c2c5;z-index:10}
#wide footer {width:100%} 
/* Login */
/* Main */
#main{float:right;/*! border:solid 1px red; *//*! position: relative; *//*! left: 0; */width: calc(100% - 200px);}
#content {padding: 36px;}
.section {display:flex; clear:both}
.subheader {background: #d2e1eb;height: 16px; padding-left: 18px;line-height: 16px;}
.breadcrumbs{/*! line-height: 14px; */float: left}
.breadcrumbs span {color: #8a8a8a;}
.breadcrumbs span a:hover {color: #00a2cf;}
.breadcrumbs span a::after{content: ' | ';font-size: 10px; color: #bbb}
.quicklinks {float:right; background: #efefef;padding: 0 12px 2px 0;/*! border-radius: 16px; *//*! margin-top: 1px; */}
.quicklinks a{display:inline-block; color: #363636; padding: 1px 12px 0 12px;border-left:solid 1px #ccc;/*! border-radius: 50%; */}
.quicklinks a:hover{background: #616c77;color: #fff;}
.pnl {background: #fff;padding: 15px 25px;border: solid 1px #ddd;margin-bottom: 16px;  overflow-x:hidden;}
footer::after, .btn-group::after, .pnl::after, #content::after {content:' '; display:table; clear:both}
.pnl p {line-height:1.2em;}
.pnl fieldset {border:none}
.pnl label {display:inline-block;font-size: 14px;margin-top: 12px; margin-bottom: 2px;max-height: 28px;}
.pnl table label {display: initial}
.pnl input[type=text], input[type=number], input[type=email], input[type=password], input[type=data], input[list], textarea, .asfield {
   display: inline-block;
   padding:6px;
   border : solid 1px #dedede;
   font-size: 110%;
   margin-top: 2px;
	font-family:arial;
}
.pnl .range {padding-top:6px}
.pnl select {
   padding:5px;
   border : solid 1px #dedede;
   font-size: 120%;
   /* width: 100%; */
   font-size: 110%;
   margin-top: 2px;   
}
.pnl textarea {
   font-family: Arial; 
   resize: none;
   margin-top: 2px;
}
.pnl .badge {
   background: #444;
   color: #fff;
   padding: 1px 5px;
   border-radius: 8px;
   font-weight: bold;
   vertical-align: middle;
}
.pnl img.flag {
	width:24px;
}
.pnl th img.flag, .pnl td img.flag {
	width:26px;
	vertical-align:middle;
	margin: auto 12px;
}
.pnl label img.flag {
	width:22px;
}
.pnl ul li {
	display: block;
	width: 100%;
	border-top: solid 3px transparent;
	border-bottom: solid 1px #d2e1eb;
	text-align: center;
	margin: 8px 0;
}
.pnl ul li a {
	width: 100%;
	padding: 10px 0;
	display: block;
}
.pnl ul li a:hover {color: #00a2cf; padding-bottom: 7px; padding-top: 13px; }
.pnl ul li:has(a:hover) {border-bottom: solid 4px #00a2cf; border-top: none}
.block label, .block input[type="text"], .block input[type="number"], .block input[type="email"], .block input[type="password"], .block select, .block textarea, .block .asfield, table.block {
   width:100%
}

div.page_error_message {
   width:100%;
   background-color:#ffff00;
   padding:20px;
}

/* Actions Links */
p.action {
   margin-bottom: 20px;
   white-space: nowrap;
}
.action img {
   border-right: solid 1px #ddd;
   padding: 12px;
   vertical-align: middle;
   background:#00a2cf;
   margin-right: 12px;
   width: 58px;
	height:58px;
}
.action a {
   font-size: 125%;
   display: block;
}
.action a:hover {
   color:#a5a5a5;
}
#main footer span{line-height:34px;}

/*sidebar */
#left-panel{
  position:fixed;
  top: 0;
  left:0;
  width:200px;
  float:left;
  background:#2C2C31;
  color: white;
  height:100%;
  font-size: 12px
}
#left-panel header{background: #00A2CF;}
#user {
  height: 120px; 
}
.card {
  display: block;
  text-align: center;
  padding: 15px;
}
#left-panel .bar {background: #26262A;/*! border-top: solid 1px #141417; */}
#left-panel #SwitchLang img {width:20px}													 
.bar ul {display: table; width:100%}
.bar .item {display:table-cell; text-align:center; border-top: solid 1px #141417;}
.bar .item a {display: inline-block;width: 100%;margin: 0;}
.bar .item img {padding:7px 0 6px;}
.bar .item:hover {background:#35353B; transition: 0.5s;border-top-color: #1A5666;}
.menu p a {
  display: block;
  padding: 8px 15px;
  color: #B6B6B9;
}
.menu p a:hover {
  background: #35353B;
  color: #0088AE;
}
/* Navigator */
#dirtree {
	width: 200px;
	overflow-y: auto;
}
#dirtree p {
   padding: 2px 0 2px 24px;
   background:url('../../../include/ico/folder.png') 4px/16px no-repeat;
   line-height:20px;
}
#dirtree p a {display:block; font-size:90%}
#dirtree p:hover {background-color:#DDD} 
#dirtree p:hover a {font-weight:bold;cursor:pointer;} 
/* Tables */
table.tbllarge {width:98%; margin:40px auto; text-align:center;}
.tbllarge td, .large th {height:34px; white-space:nowrap; padding: 0 4px;vertical-align:middle}
.tbllarge th{background:#555; color:#FFF;height:60px;vertical-align: middle;text-transform: capitalize}
.tbllarge tr:nth-child(even) {background: #ccc}

table.tbltiny {width:100%; margin: 15px 0; border-collapse: collapse;}
.tbltiny th {text-align:left; border-bottom: solid 2px #ededef;padding: 10px 5px 10px 0;white-space:nowrap}
.tbltiny td {border-bottom: solid 1px #ededef;padding: 5px 10px;white-space:nowrap}
.tbltiny tbody tr:hover {background:#f0fafd}

.btn-group {
   text-align: center;
   padding: 4px 25px;
   background: #c2c2c5;
   border-top: #efefef;
}
.btn {
   display: inline-block;
   font-weight: normal;
   text-align: center;
   cursor: pointer;
   background-image: none;
   white-space: nowrap;
   padding: 8px 18px;
   font-size: 15px;
   color: #FFF;
   background-color: #333;
   min-width: 180px;
   margin-left: 10px;
   line-height: 18px;
}
.btn:hover {background-color:#000;}
.btn:disabled{visibility:hidden; cursor:initial}
.btn.primary {float:right;}
.btn.secondary {float:left}
.pnl .btn{font-size:12px;min-width: 120px;/*! line-height: 14px; */vertical-align: top;margin-top: 2px;} 
.bar .btn{min-width: 29px;height: 38px;background-color: inherit;margin-left:0}
img.btn {padding:8px !important;-webkit-filter: invert(100%);filter:invert(100%)}
img.btn:hover {-webkit-filter: invert(100%);filter:invert(100%)}
#left-panel div.bar.btn:hover {transition: 0.7s}
/* Pagination */
ul.pager {list-style: none;margin: auto;width: 220px; line-height: 34px;display: table;background: #ddd;}
ul.pager li {display: table-cell; vertical-align: middle;}
.pager a {display:inline-block;color: #000; width:36px;}
.pager a:hover {background-color:#000; color:#fff}
.pagerprev, .pagernext {color:#888;font-size: 22px;font-weight: bold; width: 36px;text-align: center;}
.pagerprev a:before{content:'\276E'}
.pagernext a:after{content:'\276F'}
/* Glyphs */
.glyph {
   width:16px;
   height: 16px;
   vertical-align:middle;
   margin-right:5px;
   display:inline-block;
   background-size: contain;
   background-repeat: no-repeat;
}
a.glyph:hover, .glyph.expand:hover {height: 20px; width: 20px; margin-right:1px; margin-top:-4px; background-color:#fff}
footer a.glyph {width:29px; height: 29px;}
.glborder {border: solid 2px black;background-size: 12px;background-position: center center;}
.gledit {background-image:url('../../../include/ico/pen_sqr.png');}
.glremove {background-image:url('../../../include/ico/del_sqr.png');}
.glfolder {background-image:url('../../../include/ico/folder.png');}
.glmove {background-image:url('../../../include/ico/move.png');}
.gladd {background-image:url('../../../include/ico/add_sqr.png');}
.glactive {background-image:url('../../../include/ico/ok_sqr.png');}
.glinactive {background-image:url('../../../include/ico/dash_sqr.png');}
.glset {background-image:url('../../../include/ico/settings.png');}
.glview {background-image:url('../../../include/ico/view.svg');}

.center-container{margin:auto; text-align:center;}
.ico-grid {text-align: center;display: inline-block;margin: 10px;width: 160px;vertical-align: top;padding-top: 10px;background: #fff;border: solid 1px #ddd;}
.ico-grid a {display: block; font-size:90%}
.ico-grid img {width:64px;height:64px;margin: 10px auto 30px;}
.ico-grid span {color: #F4F4F4;background: #00A2CF;font-weight: 600;display: flex;height: 72px;padding: 16% 12px;align-items: center;justify-content: center}
.ico-grid a:hover span {color:#fff}

/* Checkbox Radios Select*/
.control {
  /*! display: block; */
  position: relative;
  padding-left: 30px;
  /*! margin-bottom: 15px; */
  cursor: pointer;
  /*! font-size: 18px; */
}
.control input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.control__indicator {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background: #e6e6e6;
}
.control--radio .control__indicator {
  border-radius: 50%;
}
.control:hover input ~ .control__indicator,
.control input:focus ~ .control__indicator {
  background: #ccc;
}
.control input:checked ~ .control__indicator {
  background: #00A2CF;
}
.control:hover input:not([disabled]):checked ~ .control__indicator,
.control input:checked:focus ~ .control__indicator {
  background: #0082A7;
}
.control input:disabled ~ .control__indicator {
  background: #e6e6e6;
  opacity: 0.6;
  pointer-events: none;
}
.control__indicator:after {
  content: '';
  position: absolute;
  display: none;
}
.control input:checked ~ .control__indicator:after {
  display: block;
}
.control--checkbox .control__indicator:after {
  left: 8px;
  top: 4px;
  width: 3px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.control--checkbox input:disabled ~ .control__indicator:after {
  border-color: #7b7b7b;
}
.control--radio .control__indicator:after {
  left: 7px;
  top: 7px;
  height: 6px;
  width: 6px;
  border-radius: 50%;
  background: #fff;
}
.control--radio input:disabled ~ .control__indicator:after {
  background: #7b7b7b;
}
.select {
  position: relative;
  display: inline-block;
/*   margin-bottom: 15px; */
  width: 100%;
}
.select select {
  display: inline-block;
  width: 100%;
  cursor: pointer;
  padding: 8px 15px;
  outline: 0;
  border: 0;
  border-radius: 0;
  background: #e6e6e6;
  color: #7b7b7b;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 40px;
}
.select select::-ms-expand {
  display: none;
}
.select select:hover,
.select select:focus {
  color: #000;
  background: #ccc;
}
.select select:disabled {
  opacity: 0.5;
  pointer-events: none;
}
.select__arrow {
  position: absolute;
  top: 20px;
  right: 15px;
  width: 0;
  height: 0;
  pointer-events: none;
  border-style: solid;
  border-width: 8px 5px 0 5px;
  border-color: #7b7b7b transparent transparent transparent;
}
.select select:hover ~ .select__arrow,
.select select:focus ~ .select__arrow {
  border-top-color: #000;
}
.select select:disabled ~ .select__arrow {
  border-top-color: #ccc;
}
table.tbllarge th label.control--checkbox, table.tbllarge td label.control--checkbox {padding-left:20px}
table.tbllarge td label span.control__indicator, table.tbllarge th label span.control__indicator {
   background:#fff !important;
   height:16px;
   width:16px;
   border: solid 1px #444;
}
table.tbllarge td label span.control__indicator::after, table.tbllarge th label span.control__indicator::after {
   left:5px !important;
   top:1px !important;
   border-color: #000 !important;
} 

/* Grid */ 
.w12,.c12 {width: 48.5%;}
.w13,.c13 {width: 31.78%;}
.w23,.c23 {width: 65.22%;}
.w14 {width: 23.5%;}
.w34,.c34{width: 73.5%;}
.w11 {width: 98.5%;clear: both;}
.w12, .w13, .w23, .w14, .w34, .w11 {float: left; margin-left: 1.5%}
.c12, .c13, .c23, .c34{margin-left:auto; margin-right:auto}
.clearfix {clear:both}
/* Dropdown */
.dropdown {position:relative;}
.expand {margin-bottom:0;border-bottom:solid 2px #D2E1EB}
.dropdown:hover{color:#0088AE; cursor:pointer}
.dropdown span.dropdown-btn  {
	position: absolute;
	top: 40%;
	right: 5%;
	width: 0;
	height: 0;
	pointer-events: none;
	border-style: solid;
	border-width: 10px 6px 0 6px; 
	border-color: #7b7b7b transparent transparent transparent;
}
.dropdown.expand span.dropdown-btn  {
	border-width: 0 6px 10px 6px; 
	border-color: transparent transparent #7b7b7b transparent;
}
.dropdown + .dropdown-content{display:none}
.dropdown.expand + .dropdown-content{display:block; padding-top:0;border-top:none}
.dropdown.expand + table.dropdown-content {display:table}

/* Last Tricks */
.asfield {padding: 8px;min-height: 40px;}
.preview {height:180px}
h3 .glyph, h3 .badge {float:right;margin-top:9px;}
h2 .separator{display:inline-block; vertical-align:middle; background-color:#d2e1eb;width: 12px;height: 6px;margin: 2px 6px;/*! -ms-transform: rotate(45deg); *//*! -webkit-transform: rotate(45deg); *//*! transform: rotate(-60deg); */}
.widget h3 {padding-bottom:12px; border-bottom:solid 1px #00a2cf}

@media screen and (max-width: 900px) {
   [class|="mob"] {display: block}
   body {font-size:110%;height:initial}
   /*.sidebar, #quicklinks, #main,*/
   h2 {font-size:130%; line-height:150%}
   .w12, .w13, .w14, .w23, .w34, .w11, .w22, .w33, .c12, .c13, .c23, .c34  {float:none; width:100%; margin:16px 0;}
   #main {width:100%;float: none;}
   header {/*! display:block; */padding-left: 60px;height: 40px;}
   #subtitle {display:none}
   #mob-menu {/*! display:inline-block; */ /*! float:left; */position: absolute;top: 4px;left: 10px;}
   #mob-menu div {height:4px; width:30px; background:#222; margin:5px auto;}
   #content {padding: 0; margin:10px 10px 40px 10px;}
   .section {display:block}
   .pnl {padding:10px; width:100%; overflow-x:auto;}
   .action {padding:0}
   .btn-group {padding: 6px 10px;}
   .btn-group span {display:none}
   #left-panel {
      width:0;
      z-index: 10; /* Stay on top */
      overflow-x: hidden; /* Disable horizontal scroll */
      transition: 0.3s; /* 0.5 second transition effect to slide in the sidenav */
   }
   #left-panel header {display:none}
   #left-panel footer {position:absolute}
   .mob-closebtn{float:right; font-size:300%; margin:6px 20px} 
   #user {display: none}
	#timer {text-align:left}
   .menu {text-align:center; margin-top:20px}
   .menu p a {padding: 4px 8px; font-size:140%}   
}

@media screen and (max-width: 480px) {
   h2 {font-size:5vw; line-height:9vw}
   .quicklinks {display: none}
   .menu p a {font-size:180%}
   .btn-group {padding:0;}
   .btn-group .btn {float:left}
   .btn-group .primary {float:right}
   .btn {margin:0 1%; width:48%; min-width:0; height: 42px;line-height: 21px; padding:8px}
   .bar .btn {width:initial}
}
@media screen and (max-width: 380px) {
   #login {width:94%}
}/*
@media screen and (max-height: 560px) {
   /*#left-panel {overflow-y: auto;} /* Enable vertical scroll *//*
   #user {display: none}
}
*/
@media screen and (max-height: 560px) {
	#left-panel header {display:none}
   #left-panel {overflow-y: auto;} /* Enable vertical scroll */
   #user {display:none}
	/*#left-panel footer {position:relative}	*/
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1;