@font-face {font-family: teen;src: url(teen.ttf);}
@font-face {font-family: teenit;src: url(teenit.ttf);}
@font-face {font-family: teenltit;src: url(teenltit.ttf);} 
body {background-color:#fff;color:#001937;font-family:Arial, Helvetica, sans-serif;margin:40px auto;min-width:1024px;}
body.login {}    
body.page {position:relative;min-width: 960px;} 
/*.div{width:800px; max-width:100%;margin:0px auto;padding:0;}
.div1{width: 50%;float:left;margin-top:120px;}
.div2{width: 50%;float:left;}*/
.center, .logocenter{text-align:center;}
.left{text-align:left;}
.logo {margin-top:-20px;background: #ededed;text-align:center;padding:0;box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.2);overflow:hidden;}
.logo img {width:30%;max-width:300px;}
.logo1 {text-align:center;width:100%;}
.logo1 h1{padding:0 0 10px 0; margin:0;
color:#066CAE !important;font-size:2vmin;text-transform:uppercase;}
.form{background:#fff;padding:20px;border-radius:8px;border:1px solid #545555;max-width:340px;height:250px;font-weight:bold;margin:40px auto;}
.formlogin{background:#fff;padding:20px;border-radius:8px;border:0px solid #00000000;max-width:340px;height:250px;font-weight:bold;margin:40px auto; line-height:40px;}
.formreset{background:#fff;padding:20px;border-radius:8px;border:0px solid #00000000;max-width:640px;height:250px;font-weight:bold;margin:40px auto; line-height:30px; text-align:justify;}
input.password {background:url(/img/password.png) left center no-repeat #fff;width:100%;padding:6px 25px;border:1px solid #c0c0c0;outline:none;border-radius:4px;}
input.username {background:url(/img/user.png) left center no-repeat #fff;width:100%;padding:6px 25px;border:1px solid #c0c0c0;outline:none;border-radius:4px;}
.submit{float:right;background:url(../img/logout.png) left center no-repeat #545555; margin-top:10px; color:#fff;border:1px solid #545555;padding:6px 6px 6px 25px;cursor:pointer; border-radius:4px;}
button#logout{color:#000;border:1px solid #545555;padding:0 30px;cursor:pointer; background:url(../img/logout.png)} 
a#setup{position:absolute;top:10px;right:200px;}
.form label {display:block;margin:10px auto;}
.form span{padding-left:10px;}
img.graphic {width:400px; padding:0px;vertical-align:middle;}
#name {margin:40px auto;display:block;width:200px;padding:10px;background-color:#dedede;}
@media only screen and (max-width: 799px) {
.div2 {display:none;}.div1{width: 100%;margin-top:0 !important;float:none !important;}
.form { margin:0 auto;}
.logoleft {padding-top:60px !important;text-align:center !important;padding-left:0 !important;}
} 
@media only screen and (min-width: 1921px) {
.div2 {display:none;}.div1{width: 100%;margin-top:0 !important;float:none !important;}
.form { margin:0 auto;}
.logoleft {padding-top:60px !important;text-align:center !important;padding-left:0 !important;}
}
nav{width:100%;text-align:left;position:fixed;top:0;right:0;left:0;background:#066CAA;padding:2px 0 0 80px;z-index:100;overflow:hidden;}

a.tablebutton, span.tablebutton {cursor:pointer;background:#008ec1!important;color:#fff!important; border: 1px solid transparent!important; border-radius: 4px!important; text-decoration:none;margin-right:40px;display:inline;padding:3px 8px;}
a.tablebutton:hover, span.tablebutton:hover {background:#001937!important;color:#fff!important;}
span.topuser {color:#000;margin-right:4px;display:inline;padding:3px 8px;}
a.topbutton, span.topbutton {cursor:pointer;color:#fff;text-decoration:none;margin-right:4px;display:inline;padding:3px 8px;transition: background 0.4s;}
a.topbuttonlogin,input.topbuttonlogin, span.topbuttonlogin {cursor:pointer;background:red; color:#fff;text-decoration:none;margin:auto;display:inline;padding:3px 8px;transition: background 0.4s; border-radius:4px; padding:10px; outline:none; border: 0px solid;}
a.topbutton:hover,input.topbuttonlogin:hover,span.topbutton:hover {background:#103d62;}
a.topbuttonlogin:hover, span.topbuttonlogin:hover {background:#103d62;}
.main {padding-left:80px}
.sidenav {height: 100%;width: 80px;position: fixed;z-index: 99;top: 0;left: 0px;background-color: #fff;border-left:1px solid #E8E8E8;overflow-x: hidden;transition: 0.5s;
padding-top: 60px;box-shadow: -10px 0px 10px 1px rgba(0, 0, 0, 0.19);box-shadow: 7px 0px 1px -5px rgba(0,0,0,0.1);text-align:center;}
.sidenav a {padding: 60px 0 2px 0;text-decoration: none;font-size: 12px;color: #777;display: block;background-color:#fff;transition: 0.3s;}
.sidenav a.s-menu {}
.sidenav a:hover {color: #000;background-color:#fff;filter: invert(100%);}
a.menugraphs {background:url(../img/graph.png) center center no-repeat;font-weight:bold;}
a.menuhome {background:url(../img/home2.png) center center no-repeat;font-weight:bold;}
a.customers {background:url(../img/customers.png) center center no-repeat;font-weight:bold;}
a.demo {background:url(../img/demo.png) center center no-repeat;font-weight:bold;}
a.monitoria {background:url(../img/monitor.png) center center no-repeat;font-weight:bold;}
a.layouts {background:url(../img/layouts.png) center center no-repeat;font-weight:bold;}
a.team {background:url(../img/team.png) center center no-repeat;font-weight:bold;}
a.logout {background:url(../img/log-out.png) center center no-repeat;font-weight:bold;}
a.profilo {background:url(../img/profilo.png) center center no-repeat;font-weight:bold;}
a.media {background:url(../img/media.png) center center no-repeat;font-weight:bold;}
a.devices{background:url(../img/devices.png) center center no-repeat;font-weight:bold;}
/*a.list{background:url(../img/list.jpg) 50px center no-repeat;}
a.export{background:url(../img/export.jpg) 50px center no-repeat;}*/
a.radiostreams{background:url(../img/radiostreams.png) center center no-repeat;font-weight:bold;}
/*a.submenu {font-style:italic;padding-left:90px}*/
/*.sidenav .closebtn {position: absolute;top: 0;right: 5px;font-size: 30px;margin-left: 50px;}
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}*/
a {text-decoration:none !important;}
a img {border:none !important;}
footer{background:#545655; text-align:center;color: #fff;}
footer img {vertical-align:middle;margin:4px;}
footer.page {position:fixed;bottom:0;left:0;width:100%;}
.container {padding:0px;}
.containerlogo {padding:0px; margin-left:-80px;}
em {font-size:1.4em;font-weight:bold;font-style:normal !important;}
img {max-width:100%;}
section {}                                             
section h1 {background:#545655;display:block;width:100%; padding:20px 0;text-transform:uppercase;text-align:center;color:#fff;}
section h2 {display:block;width:100%;text-align:center;}
section h3 {display:block;width:100%;text-align:center;transform: scaleX(0.9);font-weight:300;}
hr {width:28%;margin:30px auto;}
.download {text-align:center;}
.download img {display:inline;padding:20px;}
table.datatable {border: solid 1px #e8e8e8!important;background:#e8e8e8!important;width:94%;padding:6px!important;border-radius:4px!important; margin:30px auto!important;}
table.datatable td {width: 150px!important; border: 1px solid #e8e8e8!important;background:#fff!important;padding:6px!important;}
table.datatable th {padding:6px!important;}
table.datatable input[type=text] {width:100%;}
.pagination {text-align:center!important;color:#c0c0c0!important;font-weight:bold!important;}
form.actions {white-space: nowrap;}

.button_action {min-width:48px; width:48px; cursor:pointer;margin-right:-4px;}
input.button, a.button  {background:#008ec1;padding:4px 8px;margin:4px;text-decoration:none;color:#fff;border-radius:4px;border:1px solid #008ec1;cursor:pointer;font-size:1em;text-transform:uppercase;}
.buttonsched  {background:#008ec1;padding:4px 8px;margin:4px;text-decoration:none;color:#fff;border-radius:4px;border:1px solid #008ec1;cursor:pointer;font-size:1em;text-transform:uppercase;}
a.circle {color:#008ec1;text-decoration:none;cursor:pointer;font-size:140%;}
a.circle:hover {color:#000;}
input.button:hover, a.button:hover{background:#001937;color:#fff;border:1px solid #001937;}
span.button {background:#c0c0c0;padding:4px 8px;margin:4px;color:#000;border-radius:4px;border:1px solid #c0c0c0;cursor:default;}
label.date{margin:0 10px 0 30px;font-weight:bold;color:#fff;}
.white {color:#fff;}
.nobr {white-space: nowrap;}
a.href{color:#008ec1;text-decoration:none;}
span.special {font-size:120%;line-height:100%;min-width:34px;display:inline-block;}
ul {list-style-type: none;}
input.tablebutton {float:right;cursor:pointer;background:#008ec1!important;color:#fff!important; border: 1px solid transparent!important; border-radius: 4px!important; text-decoration:none;display:inline;padding:3px 8px; font-size:16px; font-weight:bold;}
input.tablebutton:hover {background:#001937!important;color:#fff!important;}
input.email {min-width:100%!important;padding:6px 25px;border:1px solid #c0c0c0;}
.tablebutton {cursor:pointer;background:#008ec1!important;color:#fff!important; border: 1px solid transparent!important; border-radius: 4px!important; text-decoration:none;display:inline;padding:3px 8px; font-size:16px; font-weight:bold; margin-top:10px;}
.tablebutton:hover {background:#001937!important;color:#fff!important;}
.highlight {
      background-color: #fff;
}
footer { z-index:9999!important;}
.dragging {
    opacity: 0.5;
}
.lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
  justify-content: center;
  align-items: center;
  z-index:1000;
}

.lightbox .content {
	background-color: #fff;
	padding: 20px;
	border-radius: 5px;
	text-align: center;
	margin:auto;
	margin-top:15%;
	height:200px;
	width:20vw;
}
.lightbox-content {
    background: #fff;
    padding: 20px;
    width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.lightbox h2 {
  margin-top: 0;
}

.lightbox button {
  margin: 5px;
}
form.topmenu {margin-left:10px;}
.topmenu button, .topmenu a{background:#008EC1;padding:16px;border-radius:50%;cursor:pointer;transition: 0.3s;border:none;}
.topmenu button:hover {background:#066cae;}
.topmenu img{width:36px;}

.float_table{margin-top:30px; margin-bottom:100px;border:1px solid #c0c0c0;padding:1vw;border-radius:6px;width:calc(50vw - 50px - 5vw) !important;}
.f_left{float:left;margin-left:2vw;}
.f_right{float:right;margin-left:1vw;}
.mediatable th { width:64px!important; }
.editmediatable th {background:#E8E8E8}
table.editmediatable {background:#fff;}
table.editmediatable td {border-bottom:2px solid lightgrey;}
table.editmediatable td table td{border-bottom-style:none;}
.debug {background:red;color:white;position:absolute;right:0;padding:0 20px;}
/*calendario*/
.schedule-container {padding:20px;}
.events-calendar{margin-top:24px;width:20%;height:1184px;background:#F3F3F3;border-radius:4px;border:1px solid #C3C3C3;float:left;display:inline-block; text-align:center; }
.events-calendar-container{width:100%;height:100%;display:inline-block; overflow:auto; text-align:left;}
#calendar {max-width:calc(80% - 20px);float:right;}
.fc-toolbar-title {
  display: none;
}
  
  #external-events h4 {
    font-size: 16px;
    margin-top: 0;
    padding-top: 1em;
  }
  .fc-event {
    margin: 3px 0;
    cursor: move;
  }
  .delete-icon 
  {
	position:inline; 
	
  }
  #calendar {
    width: 100vw;
    margin: 0 auto;
  }
.fc-day {
	user-select: none;
}

.fc-timegrid-slot-label {
    user-select: none;
}
.fc-event-container {
  position: relative;
  max-width: 100%; /* Larghezza massima del contenitore */
}
.fc-event-delete {
 position: absolute;
  right: 0px; 
  top: 0; 
  width: 20px; 
  height: 20px; 
  background-color: red; 
  border-radius: 2px; 
  color: white; 
  text-align: center; 
  cursor: pointer; 
  line-height: 20px; 
}
/* Classe Bootstrap per form-group */
.form-group {
    margin-bottom: 1rem;
}

/* Classe Bootstrap per button */
.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
/* Classe Bootstrap per button con stile primario */
.btn-primary {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}

/* Stili di base per il colore di sfondo attivo del button */
.btn-primary:hover {
    color: #fff;
    background-color: #0056b3;
    border-color: #004799;
}

/* Stili di base per il colore di sfondo quando il button è attivo/cliccato */
.btn-primary:active {
    color: #fff;
    background-color: #004799;
    border-color: #003366;
}

/* Stili di base per il colore di sfondo del button quando è disabilitato */
.btn-primary:disabled {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}
/* Classe Bootstrap per button con stile secondario */
.btn-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}

/* Classe Bootstrap per button con stile success */
.btn-success {
    color: #fff;
    background-color: #28a745;
    border-color: #28a745;
}

/* Classe Bootstrap per button con stile danger */
.btn-danger {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}

/* Altre classi di stili di button */
.btn-warning {
    color: #212529;
    background-color: #ffc107;
    border-color: #ffc107;
}

.btn-info {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-light {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
}

.btn-dark {
    color: #fff;
    background-color: #343a40;
    border-color: #343a40;
}
/* Stili di hover per button con stile secondario */
.btn-secondary:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

/* Stili di active per button con stile secondario */
.btn-secondary:active {
    color: #fff;
    background-color: #545b62;
    border-color: #4e555b;
}

/* Stili di hover per button con stile success */
.btn-success:hover {
    color: #fff;
    background-color: #218838;
    border-color: #1e7e34;
}

/* Stili di active per button con stile success */
.btn-success:active {
    color: #fff;
    background-color: #1e7e34;
    border-color: #1c7430;
}

/* Stili di hover per button con stile danger */
.btn-danger:hover {
    color: #fff;
    background-color: #c82333;
    border-color: #bd2130;
}

/* Stili di active per button con stile danger */
.btn-danger:active {
    color: #fff;
    background-color: #bd2130;
    border-color: #b21f2d;
}
/* Stili di hover per button con stile warning */
.btn-warning:hover {
    color: #212529;
    background-color: #e0a800;
    border-color: #d39e00;
}

/* Stili di active per button con stile warning */
.btn-warning:active {
    color: #212529;
    background-color: #d39e00;
    border-color: #c69500;
}

/* Stili di hover per button con stile info */
.btn-info:hover {
    color: #fff;
    background-color: #138496;
    border-color: #117a8b;
}

/* Stili di active per button con stile info */
.btn-info:active {
    color: #fff;
    background-color: #117a8b;
    border-color: #10707f;
}

/* Stili di hover per button con stile light */
.btn-light:hover {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
}

/* Stili di active per button con stile light */
.btn-light:active {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
}

/* Stili di hover per button con stile dark */
.btn-dark:hover {
    color: #fff;
    background-color: #23272b;
    border-color: #1d2124;
}

/* Stili di active per button con stile dark */
.btn-dark:active {
    color: #fff;
    background-color: #1d2124;
    border-color: #171a1d;
}


/* Classe Bootstrap per input */
.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Classe Bootstrap per select */
.form-select {
    display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}


/* editmedia */
	.editmediaform  {margin:40px;}
	.editmediaform label {font-size:1rem; }
/* /editmedia*/
   .layoutmaker {
		display: block;
		background-color: #0E3C5F;
		padding: 20px;
		border-radius: 0;
		color: white;
		max-width: 560px;
		margin: auto;
    }
    .layoutmaker label {
        margin-right: 10px;
    }
    .layoutmaker input[type="checkbox"], select {
        margin-right: 5px;
        margin-top: 5px;
    }
    .layoutmaker select {
        padding: 5px;
        border-radius: 5px;
        border: 1px solid #066CAA;
        background-color: white;
        color: #0E3C5F; width:100%;
    }
    .layoutmaker select:hover {
        border-color: #05598a;
    }

    .layoutmaker .options {
        margin-left: 20px;
        margin-top: 5px;
        margin-bottom: 10px;
    }
    .layoutmaker input[type="submit"], .anteprima button, .anteprima input[type="submit"] {
        background-color: #066CAA;
        color: white;
        border: none;
        padding: 10px 20px;
        border-radius: 5px;
        cursor: pointer;
        margin-top: 10px; 
    }
    .layoutmaker input[type="submit"]:hover, .anteprima button:hover, .anteprima input[type="submit"]:hover {
        background-color: #05598a;
    }

	.hide-top-center .top-center, .hide-bottom-center .bottom-center {
		display: none;
	}
	.select-table {
		display: table;width:100%;
	}
    .select-row {
        display: table-row;width:100%;padding:5px;
    }
	.select-row:nth-child(odd) {
		background-color: rgba(0,0,0,0.2); 
	}
	.select-row:nth-child(even) {
		background-color: rgba(0,0,0,0); 
	}
    .select-cell {
        display: table-cell;height:40px;
        padding: 0px 10px; /* Ajusta lo spazio tra le celle */
    }
	iframe#previewIframe {
		width: 600px; 
		height: 337px;
		border: none; 
		overflow: hidden; 
		border:1px solid transparent;
	}
	.anteprima {width:100%;position:relative;text-align:center;}