/* COL */
:root{
  --main-color:#37474F;
  --main-light-color:#A3AFB7;
  --red-color:#ff4c52;
  --indigo-color:#3e8ef7;
  --green-color:#11C26D;
  --purple-color:#9463f7;
  --orange-color:#EB6709;
}
body {background:#f6f6f6; font-family: 'Montserrat', sans-serif;}
body.black {background:#212121;}
body.nooverflow {overflow:hidden;}
.reset-padding {padding:0;}
.puntinisospensione {text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
a {color:#0B69E3;}
a:hover {color:#364FF5;}
img {width:100%;}
.ombra100 {display:none; width:100%; height:100vh; background:#00000090; position:fixed; top:0; left:0; z-index:99;}
.loader {display:none; color:#fff; position:fixed; top:50%; left:50%; z-index:99; transform:translate(-50%, -50%); font-size:20px; font-weight:600;}
.noselect {-webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.btnchiudi, .btnchiudichat {position: absolute; top: 0; right: 0; background: transparent; border: 0; border-radius: 3px; outline: 0; cursor: pointer; z-index: 1;}
.btnchiudichat {top: 20px; right: 5px;}
.btnchiudi:focus, .btnchiudichat:focus {outline: 0;}
.btnchiudi:active, .btnchiudichat:active {box-shadow: inset 0 0 6px 0 #c0c0c0;}
#black_screen_alert {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.5); z-index: 10000; overflow: hidden;}
#alert {max-width: 400px; width: 90%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10001;}
#alert #action_alert {width: 100%; padding: 15px; background: #f5f5f5; font-weight: 600; font-size: 17px; text-align: center; float: left; border-radius: 5px 5px 0px 0px;}
#alert #message {width: 100%; padding: 15px; background: #fff; font-size: 14px; float: left; border-radius: 0px 0px 5px 5px;}
#alert #messagetext {width: 100%; float: left; margin-bottom: 20px;}
#alert #closebutton {height: 30px; line-height: 30px; float: right; padding: 0px 10px; color: #000; border: 1px solid #000; border-radius: 3px; font-size: 14px; border-radius: 5px; cursor: pointer;}
#alert #confirmbutton {height: 30px; line-height: 30px; float: right; padding: 0px 10px; color: #fff; background: var(--orange-color); border: 1px solid var(--orange-color); border-radius: 3px; font-size: 14px; cursor: pointer; margin-right: 20px;}
content {margin-top:41px; padding-top:15px; padding-bottom:15px; min-height: calc(100vh - 91px);}
content h1 {font-size:30px;}
table {margin-bottom:0!important;}
table tr {border-bottom:1px solid #f6f6f6; cursor:pointer;}
table.nohover tr {cursor:inherit;}
table tr:hover {background:#eee;}
table tr td.nomobile {display:none;}
table tr th.nomobile {display:none;}
table tr td {font-size:12px; padding:15px!important;}
table tr td.fontbold {font-weight:600;}
table tr td.fontbold.green {color:var(--green-color);}
table tr td.fontbold.red {color:var(--red-color);}
table tr td {white-space:nowrap;}
table tr td font.orange {background:var(--orange-color); padding:3px 10px; border-radius:10px; color:#fff; font-size:11px;}
table tr td font.green {background:var(--green-color); padding:3px 10px; border-radius:10px; color:#fff; font-size:11px;}
table tr td font.red {background:var(--red-color); padding:3px 10px; border-radius:10px; color:#fff; font-size:11px;}
table tr td font.purple {background:var(--purple-color); padding:3px 10px; border-radius:10px; color:#fff; font-size:11px;}
table tr td font.black {background:#000; padding:3px 10px; border-radius:10px; color:#fff; font-size:11px;}
table thead tr {cursor:inherit;}
table thead tr:hover {background:inherit;}
div.boxchat {display:none; position:fixed; bottom:0; right:0; z-index:8; width:100%; height:calc(100vh - 40px); background:#fff; overflow: hidden auto;}
div.boxchat::-webkit-scrollbar {width: 8px;}
div.boxchat::-webkit-scrollbar-track {background: #f1f1f1;}
div.boxchat::-webkit-scrollbar-thumb {background: #888;}
div.boxchat::-webkit-scrollbar-thumb:hover {background: #555;}
div.boxchat p.titolochat {padding:0 15px; margin-bottom:5px; margin-top:20px; font-size:16px; font-weight:600;}
div.boxchat p.descrizionechat {padding:0 15px; margin-bottom:25px; font-size:12px;}
div.boxchat .listachat {z-index:2px;}
div.boxchat .listachat .itemchat {cursor:pointer; border-top:1px solid #c0c0c0; border-bottom:1px solid #c0c0c0; padding:15px;}
div.boxchat .listachat .itemchat p {margin-bottom:5px;}
div.boxchat .listachat .itemchat p.data {font-size:10px; color:#969696;}
div.boxchat .listachat .itemchat p.utente img {width:30px; height:30px; border:1px solid #4b4b4b; margin-right:5px; border-radius:100%; margin-top:-5px;}
div.boxchat .listachat .itemchat p.utente {font-size:14px;}
div.boxchat .listachat .itemchat p.utente span {display:inline-block; margin-right:5px; width:10px; height:10px; background:var(--orange-color); border-radius:100%; animation-name:changecolorchat; animation-duration: 2s; animation-iteration-count:infinite;}
div.boxchat .listachat .itemchat p.testo {font-size:12px; color:#4b4b4b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
div.boxchat .listachat .itemchat.newmessage:after {content: ""; position: absolute; top: 50%; right: 25px; transform: translate(0, -50%); border: 5px solid var(--red-color); border-radius: 50%;}
div.boxchat .thischat {z-index:4px; height:100%; background:#fff; position:absolute; top:0; left:100%; transition:0.2s all;}
div.boxchat .thischat.show {left:0;}
div.boxchat .thischat .goback {cursor:pointer; background:#eee; border-bottom:1px solid #ddd; padding:10px 15px; font-size:12px;}
div.boxchat .thischat .actionbottom {position:absolute; bottom:0; left:0; width:100%;}
div.boxchat .thischat .actionbottom textarea {width:100%; height:100px; border:0; border-top:1px solid #c0c0c0; padding:5px; font-size:14px; resize:none;}
div.boxchat .thischat .actionbottom button {border:0; width:100%; background:var(--indigo-color); color:#fff; font-size:12px; padding:10px; margin-top:-10px;}
div.boxchat .thischat .testochat {height:calc(100% - 139px); overflow:auto; width:100%; padding-bottom:30px;}
div.boxchat .thischat .testochat.withgoback {height: calc(100% - 196px);}
div.boxchat .thischat .testochat span.notmessage {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:12px; color:#969696; text-align:center;}
div.boxchat .thischat .testochat .boxsinglemessage {margin-top:20px;}
div.boxchat .thischat .testochat .boxsinglemessage .background {padding:5px; background:#eee; border-radius:3px;}
div.boxchat .thischat .testochat .boxsinglemessage.isadmin .background {background:#c2ffc2}
div.boxchat .thischat .testochat .boxsinglemessage .infomessaggio {font-size:12px; margin-bottom:2px;}
div.boxchat .thischat .testochat .boxsinglemessage .testomessaggio {font-size:16px; margin-bottom:0; word-break: break-word;}

.setting .form {margin-bottom:50px;}
.setting .form .sezione {margin-top:50px; margin-bottom:10px; display:block; font-size:18px; font-weight:600;}
.setting .form .item-form {margin-bottom:30px;}
.setting .form .item-form label {margin:0;}
.setting .form .item-form label span {display:block;}
.setting .form .item-form label span.title {font-size:16px; font-weight:500;}
.setting .form .item-form label span.description {font-size:14px; margin:5px 0;}
.setting .form .item-form input {width:100%; height:40px; border:1px solid #c0c0c0; padding:5px; font.size:14px;}
.setting .form .item-form textarea {width:100%; height:150px; border:1px solid #c0c0c0; padding:5px; font.size:14px;}
.setting .form .item-form select {width:100%; height:40px; border:1px solid #c0c0c0; padding:5px; font.size:14px;}
.setting .form input[type="submit"] {position:fixed; bottom:0; right:0; width:100%; background:var(--indigo-color); color:#fff; padding:15px; border:0;}

.searchtable {width:280px; padding:5px; height:35px; border:1px solid #c0c0c0;}

#viewallgraph .modal-dialog {width:90%!important; max-width:750px!important;}

.privacy {margin-top: 50px; margin-bottom: 80px;}
.privacy h1 {margin-top: 30px; margin-bottom: 25px; font-size: 25px;}
.privacy img {max-width: 250px;}

.my-gallery span {position: absolute; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); color: #fff; padding: 5px; cursor: pointer;}
.my-gallery span:hover {text-decoration: underline;}
.my-gallery span p {margin: 0; font-size: 12px;}

/* COL-MD */
@media only screen and (min-width: 768px) {

  .loader {font-size:25px;}
  content h1 {font-size:35px;}
  table tr td {font-size:14px;}
  table tr td.nomobile {display:table-cell;}
  table tr th.nomobile {display:table-cell;}
  table tr td font {font-size:12px!important;}
  div.boxchat {width:50%; max-width:300px; border-left:1px solid #c0c0c0;}

  .setting .form input[type="submit"] {width:auto; box-shadow:0 0 10px 0 #c0c0c0;}

  .privacy h1 {font-size: 30px;}
}

/* COL-LG */
@media only screen and (min-width: 992px) {
  .privacy h1 {font-size: 35px;}
}


/* COL-XL */
@media only screen and (min-width: 1200px) {

  .loader {font-size:30px;}
  content {width:calc(100% - 250px)!important;}
  content.fullwidth {width:100%!important;}
  content h1 {font-size:40px;}
  table tr td {font-size:15px;}
  table tr td font {font-size:13px!important;}
  div.boxchat .listachat .itemchat p.data {font-size:12px;}
  div.boxchat .listachat .itemchat p.utente {font-size:16px;}

}

@keyframes changecolorchat {
  0% {background:var(--orange-color);}
  50% {background:var(--indigo-color);}
  100% {background:var(--orange-color);}
}
