/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 23-set-2020, 13.10.56
    Author     : Daniele Meucci 
*/

/*
@font-face {
	font-family: "SourceSansPro-Light";
	src: url("./font/Source_Sans_Pro/SourceSansPro-Light.ttf") format('truetype');
  }


body {
	font-family: "SourceSansPro-Light";
}
*/

/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 989px) {

	body {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: small !important;
	}

	.dropdown-menu , h3 , h4, h5, h6, button, .main-footer {
		font-size: small !important;
	}

	h5 {
		font-size: smaller !important;
	}

}

/*
Desktop Styles
================================================== */
@media only screen and (min-width: 990px) {

	body {
		font-family: 'Source Sans Pro', sans-serif;
		font-size: medium;
	}
	
}


/* colore nei numeri dei select ore del playback */
.daterangepicker select {
	color: black !important;
}


/* Altezza del toast lato dx dello streming video*/
.toast-swal-telecamere-height {
	height: 30vh;
	margin-top: 80px;
	margin-right: 15px;
}


  .blink {
    animation: blink 0.5s steps(5, start) infinite;
    -webkit-animation: blink 0.5s steps(5, start) infinite;
  }
  @keyframes blink {
    to {
      visibility: hidden;
    }
  }
  @-webkit-keyframes blink {
    to {
      visibility: hidden;
    }
  }

  .modal.left .modal-dialog,
	.modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		width: 80vw;
    max-width: 90vw !important;
		height: 100vh;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}

	.modal.left .modal-content,
	.modal.right .modal-content {
		height: 100%;
		overflow-y: auto;

	}
	
	.modal.left .modal-body,
	.modal.right .modal-body {
		padding: 15px 15px 80px;
	}

/*Left*/
.modal.left.fade .modal-dialog{
  left: -80vw;
  -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
     -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
       -o-transition: opacity 0.3s linear, left 0.3s ease-out;
          transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.show .modal-dialog{
  left: 0;
}
/*Right*/
	.modal.right.fade .modal-dialog {
		right: -80vw;
		-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, right 0.3s ease-out;
		        transition: opacity 0.3s linear, right 0.3s ease-out;
	}
	
	.modal.right.fade.show .modal-dialog {
		right: 0;
	}


.concentric-circles-allarme {
  border-radius: 50%;
  /*transform: translateX(-50%);*/
  transition: all 0.2s ease-in-out;
  animation: ripple 2.0s 0.2s infinite;
  -webkit-animation: ripple 2.0s 0.2s  infinite;
}

.concentric-circles-allarme:hover {
  /*transform: translateX(-50%) scale(1.2);*/
  transform: scale(1.2);
}

@-webkit-keyframes ripple {
  20% {
    box-shadow: 0px 0px 0px 2px #fff,
                0px 0px 0px 4px red;
  }
  
  50% {
    box-shadow: 0px 0px 0px 2px #fff,
                0px 0px 0px 4px red,
                0px 0px 0px 8px #fff,
                0px 0px 2px 12px #f00;
  }
  
  100% {
    box-shadow: 0px 0px 0px 2px #fff,
                0px 0px 0px 4px red,
                0px 0px 0px 8px #fff,
                0px 0px 2px 12px #f00, 
                0px 0px 0px 16px #fff,
                0px 0px 5px 20px #f00;
  }
}

.concentric-circles-memoria {
	border-radius: 50%;
	/*transform: translateX(-50%);*/
	transition: all 0.2s ease-in-out;
	animation: ripplememoria 2.0s 0.2s infinite;
	-webkit-animation: ripplememoria 2.0s 0.2s  infinite;
}
  
.concentric-circles-memoria:hover {
	/*transform: translateX(-50%) scale(1.2);*/
	transform: scale(1.2);
}
  
@-webkit-keyframes ripplememoria {
	20% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #6f42c1;
	}
	
	50% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #6f42c1,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #6f42c1;
	}
	
	100% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #6f42c1,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #6f42c1, 
				  0px 0px 0px 16px #fff,
				  0px 0px 5px 20px #6f42c1;
	}
}

.concentric-circles-anomalia {
	border-radius: 50%;
	/*transform: translateX(-50%);*/
	transition: all 0.2s ease-in-out;
	animation: rippleanomalia 2.0s 0.2s infinite;
	-webkit-animation: rippleanomalia 2.0s 0.2s  infinite;
}
  
.concentric-circles-anomalia:hover {
	/*transform: translateX(-50%) scale(1.2);*/
	transform: scale(1.2);
}
  
@-webkit-keyframes rippleanomalia {
	20% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #ff0;
	}
	
	50% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #ff0,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #ff0;
	}
	
	100% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #ff0,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #ff0, 
				  0px 0px 0px 16px #fff,
				  0px 0px 5px 20px #ff0;
	}
}

.concentric-circles-esclusione {
	border-radius: 50%;
	/*transform: translateX(-50%);*/
	transition: all 0.2s ease-in-out;
	animation: rippleesclusione 2.0s 0.2s infinite;
	-webkit-animation: rippleesclusione 2.0s 0.2s  infinite;
}
  
.concentric-circles-esclusione:hover {
	/*transform: translateX(-50%) scale(1.2);*/
	transform: scale(1.2);
}
  
@-webkit-keyframes rippleesclusione {
	20% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #00f;
	}
	
	50% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #00f,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #00f;
	}
	
	100% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #00f,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #00f, 
				  0px 0px 0px 16px #fff,
				  0px 0px 5px 20px #00f;
	}
}



.concentric-circles {
	border-radius: 50%;
	/*transform: translateX(-50%);*/
	transition: all 0.2s ease-in-out;
	animation: ripplegray 2.0s 0.2s infinite;
	-webkit-animation: ripplegray 2.0s 0.2s  infinite;
  }
  
  .concentric-circles:hover {
	/*transform: translateX(-50%) scale(1.2);*/
	transform: scale(1.2);
  }
  
  @-webkit-keyframes ripplegray {
	20% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #888;
	}
	
	50% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #888,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #888;
	}
	
	100% {
	  box-shadow: 0px 0px 0px 2px #fff,
				  0px 0px 0px 4px #888,
				  0px 0px 0px 8px #fff,
				  0px 0px 2px 12px #888, 
				  0px 0px 0px 16px #fff,
				  0px 0px 5px 20px #888;
	}
  }

#dettaglio-ingresso-info {
	word-break: break-all;
}