/*fonts*/

@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Regular.woff2') format('woff2'),
         url('/fonts/Roboto-Regular.woff') format('woff'),
         url('/fonts/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Italic.woff2') format('woff2'),
        url('/fonts/Roboto-Italic.woff') format('woff'),
        url('/fonts/Roboto-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Bold.woff2') format('woff2'),
        url('/fonts/Roboto-Bold.woff') format('woff'),
        url('/fonts/Roboto-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-BoldItalic.woff2') format('woff2'),
        url('/fonts/Roboto-BoldItalic.woff') format('woff'),
        url('/fonts/Roboto-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Thin.woff2') format('woff2'),
        url('/fonts/Roboto-Thin.woff') format('woff'),
        url('/fonts/Roboto-Thin.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-ThinItalic.woff2') format('woff2'),
        url('/fonts/Roboto-ThinItalic.woff') format('woff'),
        url('/fonts/Roboto-ThinItalic.ttf') format('truetype'); 
    font-weight: 200;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Light.woff2') format('woff2'),
        url('/fonts/Roboto-Light.woff') format('woff'),
        url('/fonts/Roboto-Light.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-LightItalic.woff2') format('woff2'),
        url('/fonts/Roboto-LightItalic.woff') format('woff'),
        url('/fonts/Roboto-LightItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-Medium.woff2') format('woff2'),
        url('/fonts/Roboto-Medium.woff') format('woff'),
        url('/fonts/Roboto-Medium.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto-MediumItalic.woff2') format('woff2'),
        url('/fonts/Roboto-MediumItalic.woff') format('woff'),
        url('/fonts/Roboto-MediumItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}


@font-face {
    font-family: 'Roboto-Light';
    src: url('/fonts/Roboto-Light.woff2') format('woff2'),
        url('/fonts/Roboto-Light.woff') format('woff'),
        url('/fonts/Roboto-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('/fonts/Roboto-LightItalic.woff2') format('woff2'),
        url('/fonts/Roboto-LightItalic.woff') format('woff'),
        url('/fonts/Roboto-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

.dinapsis-font-10 { font-size: 10px;}
.dinapsis-font-12 { font-size: 12px;}
.dinapsis-font-14 { font-size: 14px;}
.dinapsis-font-16 { font-size: 16px;}
.dinapsis-font-18 { font-size: 18px;}
.dinapsis-font-20 { font-size: 20px;}
.dinapsis-font-22 { font-size: 22px;}
.dinapsis-font-24 { font-size: 24px;}

.dinapsis-font-bold { font-weight: bold;}

.dinapsis-text-align-left{
    text-align: start;
}

/*fonts*/

/*icons*/
.dinapsis-icon-12 { font-size: 12px !important; height:12px !important; width:12px !important; }
.dinapsis-icon-18 { font-size: 18px !important; height:18px !important; width:18px !important; }
.dinapsis-icon-24 { font-size: 24px !important; height:24px !important; width:24px !important; }
.dinapsis-icon-36 { font-size: 36px !important; height:36px !important; width:36px !important; }
.dinapsis-icon-48 { font-size: 48px !important; height:48px !important; width:48px !important; }
.dinapsis-icon-60 { font-size: 60px !important; height:60px !important; width:60px !important; }
.dinapsis-icon-72 { font-size: 72px !important; height:72px !important; width:72px !important; }
.dinapsis-icon-84 { font-size: 84px !important; height:84px !important; width:84px !important; }
.dinapsis-icon-96 { font-size: 96px !important; height:96px !important; width:96px !important; }

.red-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#F44336;
}
.pink-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#E91E63;
}
.purple-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#9C27B0;
}
.deep-purple-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#673AB7;
}
.indigo-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#3F51B5;
}
.blue-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#2196F3;
}
.light-blue-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#03A9F4;
}
.cyan-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#00BCD4;
}
.teal-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#009688;
}
.green-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#4CAF50;
}
.light-green-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#8BC34A;
}
.lime-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#CDDC39;
}
.yellow-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#FFEB3B;
}
.amber-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#FFC107;
}
.orange-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#FF9800;
}
.deep-orange-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#FF5722;
}
.brown-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#795548;
}
.grey-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#9E9E9E;
}
.blue-grey-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#607D8B;
}
.black-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#000000;
}
.white-place-icon{
    -webkit-mask-image: url('/images/icons/ic_place.svg');
    background-color:#FFFFFF;
}
/*icons*/

/*colors*/

.dinapsis-background-blue { background-color: rgba(9, 46, 110, 1) !important; }
.dinapsis-background-card-blue { background-color: rgba(9, 74, 132, 1) !important;  }
.dinapsis-background-accent-green { background-color: rgba(154, 196, 64, 1) !important; }
.dinapsis-background-white  { background-color: rgba(255, 255, 255, 1) !important;}
.dinapsis-background-white-a03  { background-color: rgba(255, 255, 255, 0.3) !important; }

.dinapsis-text-blue { color: rgba(9, 46, 110, 1) !important;}
.dinapsis-text-card-blue { color: rgba(9, 74, 132, 1) !important;}
.dinapsis-text-accent-green { color: rgba(154, 196, 64, 1) !important; }
.dinapsis-text-white  { color: rgba(255, 255, 255, 1) !important;}
.dinapsis-text-white-a03  { color: rgba(255, 255, 255, 0.3) !important; }
.dinapsis-text-white-a054  { color: rgba(255, 255, 255, 0.54) !important; }
.dinapsis-text-black-a054 {  color: rgba(0, 0, 0, 0.54) !important;}

.dinapsis-fill-blue { fill: rgba(9, 46, 110, 1) !important;  }
.dinapsis-fill-card-blue { fill: rgba(9, 74, 132, 1) !important;  }
.dinapsis-fill-accent-green { fill: rgba(154, 196, 64, 1) !important;  }
.dinapsis-fill-white  { fill: rgba(255, 255, 255, 1) !important;}
.dinapsis-fill-white-a03  {  fill: rgba(255, 255, 255, 0.3) !important;}
.dinapsis-fill-black-a054 {  fill: rgba(0, 0, 0, 0.54)!important;}

/*colors*/

/*margins paddings*/

.dinapsis-margin-between-16 {
    margin-left: 16px; 
    margin-right: 16px; 
}
.dinapsis-margin-between-6 {
    margin-left: 6px; 
    margin-right: 6px; 
}

.dinapsis-margin-between-8 {
    margin-left: 8px; 
    margin-right: 8px; 
    margin-top: 0px;
    margin-bottom: 0px;
}

.dinapsis-margin-between-left-6 {
    margin-left: 6px; 
}

.dinapsis-margin-between-right-6 {
    margin-right: 6px; 
}

.dinapsis-margin-2 {
   margin:2px 2px 2px 2px; 
}

.dinapsis-margin-left-none {
   margin-left: 0px; 
}

.dinapsis-margin-right-8 {
   margin-right: 8px; 
}

.dinapsis-margin-right-none {
   margin-right: 0px; 
}

.dinapsis-padding-right-none {
   padding-right: 0px; 
}

.dinapsis-padding-left-none {
   padding-left: 0px !important; 
}

.dinapsis-margin-right-16 {
   margin-right: 16px; 
}

.dinapsis-margin-top-16 {
   margin-top: 16px; 
}

.dinapsis-margin-top-8 {
   margin-top: 8px; 
}

.dinapsis-margin-bottom-8 {
   margin-bottom: 8px; 
}

/*margins paddings*/

/*perfect scrollbar*/

.perfect-scrollbar {
    position: relative;
    overflow: hidden;
}

/*perfect scrollbar*/

/*login*/

.dinapsis-ui-view{
	height:calc(100% - 56px);
}

.dinapsis-ui-view-login{
	height:100%;
}

.dinapsis-login-screen{
    background-image: url(../../images/Hubgrade-Logo.png);
    background-repeat: no-repeat;
    opacity: 1; 
    background-size: 100% 100%;
    background-color:#f2f2f2;
}

.dinapsis-login-card{
    background-color:rgba(9,46,110,0.5); 
    border:none;
    box-shadow:none;
    color:white; 
    width:100% !important;
}

.dinapsis-login-card-title{
    width:100% !important;
    min-height: 150px;
}

.dinapsis-login-card-input-container{
    fill: white !important; 
    margin-top: 0px !important; 
    margin-bottom: 0px !important; 
    width:100% !important;
    min-height: 66px;
}

.dinapsis-login-card-input-container label, .dinapsis-login-card-input-container label.md-required:after {
  color: rgba(9, 46, 110, 1) !important;
}

.dinapsis-login-card-input-container:not(.md-input-focused).md-input-invalid label, .dinapsis-login-card-input-container:not(.md-input-focused).md-input-invalid label.md-required:after{
  color: red !important;
}

.dinapsis-login-card-input-container.md-input-focused label, .dinapsis-login-card-input-container.md-input-focused label.md-required:after {
  color: white !important;
}

.dinapsis-login-card-input-container.md-input-has-value label, .dinapsis-login-card-input-container.md-input-has-value label.md-required:after {
  color: white !important;
}

.dinapsis-login-card-input-container md-input{
  color: rgba(9, 46, 110, 1) !important;
}

.dinapsis-login-card-input-container md-select:not([disabled]):focus .md-select-value, .dinapsis-login-card-input-container md-select .md-select-icon {
  color: rgba(9, 46, 110, 1) !important;
  fill: rgba(9, 46, 110, 1) !important;
}

/*Autofill de color blanc*/
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 30px white inset;
  color: rgba(9, 46, 110, 1) !important;
}

/*Missatges d'error*/
md-toast{
    position:initial !important;
}

md-toast.md-center {
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}
md-toast.md-error-toast-theme .md-toast-content{
  background-color: rgba(154, 196, 64, 1) !important;
  color: rgba(9, 46, 110, 1) !important;
  text-align: center;
}

.dinapsis-login-card-button-container{
    max-height: 48px; 
    min-height: 48px; 
    margin: 0px !important; 
}
.dinapsis-login-card-button{
    margin: 0px !important;
}


/*login*/

/*loading content*/

.dinapsis-loading-content {
    background-color: transparent; 
    position: absolute; 
    z-index: 10; 
    height: calc(100% - 100px); 
    top: 100px;
}

.dinapsis-progress-circular-white svg path {
    stroke: white; 

}

/*loading content*/

/*header*/

.dinapsis-header-toolbar{
    background:#ffffff !important;
    z-index: 3;
    box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.14),
                0px 0px 2px 2px rgba(0, 0, 0, 0.098),
                0px 0px 5px 1px rgba(0, 0, 0, 0.084);
}

.dinapsis-header-toolbar-blue{
    background:#092E6E !important;
    z-index: 3;
    box-shadow: none;
}

.dinapsis-header-toolbar-content{
    background:#ffffff !important;
    z-index: 3;
}

.dinapsis-header-toolbar-logo-white{
    background-image: url('../../images/Hubgrade-Logo.png'); 
    background-size:contain; 
    background-repeat:no-repeat; 
    background-position:center; 
    height: 100px; 
}

.dinapsis-header-toolbar-user-button{
    margin: 0;
    padding: 0 16px;
    height: 65px;
    width: 100%;
}

.dinapsis-header-toolbar-user-menu-item{
    margin: 0;
    padding: 0;
}

.dinapsis-header-sidenav-toolbar {
    background:#FFFFFF !important;
    color: rgba(0, 0, 0, 0.54) !important; 
    fill: rgba(0, 0, 0, 0.54) !important;
    font-size: 16px;
    font-family: Roboto;
}

.dinapsis-header-sidenav-toolbar-title{
    height: 100px; 
    max-height: 100px; 
    color: rgba(255,255,255,1) !important; 
    fill: rgba(255,255,255,1) !important;
}

/*tree*/

.dinapsis-header-sidenav-toolbar-logo{
    background-image: url('../../images/Hubgrade-Logo.png');
    background-size:contain; 
    background-repeat:no-repeat; 
    background-position:center; 
    min-height: 100px; 
    min-width: 240px; 
}

.dinapsis-header-sidenav-tree ul  {
    margin: 0;
    padding: 0;
    list-style: none; 
    border: none;
    overflow: hidden;
}

.dinapsis-header-sidenav-tree .md-icon-button{
    margin: 0;
    padding: 0;
}

.dinapsis-header-sidenav-tree md-list-item._md-button-wrap > div.md-button:first-child{
    margin: 0;
    padding: 0;
}

.dinapsis-header-sidenav-tree md-list-item.md-no-proxy.md-button, md-list-item .md-no-style.md-button{
    line-height: 1.2;
}

.dinapsis-header-sidenav-tree li {
    position: relative;
    padding: 0 0 0 10px;
    white-space: nowrap;
}

.dinapsis-header-sidenav-tree md-icon:focus {
    outline: none;
    border: 0;
 }

.dinapsis-header-sidenav-tree .selectedNode{
    background-color: rgba(0, 0, 0, 0.12);
    color: #3F51B5;
}

.dinapsis-header-sidenav-tree-ul-toggled{
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
}

/*tree*/

/*header*/

/*content*/
.dinapsis-content-grey-225{
    background-color: rgb(225, 225, 225);
    
}

.dinapsis-content-divider-container{
    top:22px;
    position:relative;
}

.dinapsis-content-divider-text{
    -moz-border-radius: 10px 10px 10px 10px; 
    border: solid 1px rgba(0,0,0,0.12); 
    border-radius: 10px 10px 10px 10px; 
    padding: 10px; position:relative; 
    top:-22px; 
    background-color:rgba(250,250,250,1);
}
/*content*/

/*tabs*/

.dinapsis-content-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]) {
  color: #fff !important;
}

.dinapsis-content-tabs > md-tabs-wrapper{
    border-style: none !important;
}

.dinapsis-content-tabs-kpi-section{
}

.dinapsis-content-tabs-alarms-section{
}

.dinapsis-content-tabs-kpi-row{
    min-height:240px;
}

.dinapsis-content-tabs-alarms-row{
    height:320px;
}

.dinapsis-content-tabs-kpi-info-icon{
    min-height:28px !important;
}

/*tooltip*/

.dinapsis-content-tabs-kpi-tooltip{
    height: auto !important;
}

.dinapsis-content-tabs-kpi-chart{
    padding-bottom: 0 !important; 
    padding-top: 0 !important;
    max-height: 120px;
}

/*tooltip*/

/*tabs*/

/*card*/

.dinapsis-card {
    font-size:14px;
}

.dinapsis-card-rounded{
    border-radius: 10px; 
    box-shadow:none;
}

.dinapsis-card-title {
    text-transform:uppercase; 
    margin-top: 10px;
    height:50px; 
    font-size:16px; 
    font-weight:bold;
}

.dinapsis-card-variable{
    text-transform:uppercase; 
}

.dinapsis-card-value{
    font-family: 'Roboto-Light';
    margin:0;
}
.dinapsis-card-unit{
    /*min-width:60px;*/
    text-transform:lowercase;
}

.dinapsis-card-timestamp{
    font-family: 'Roboto-Light';
    padding-right: 8px;
}

.dinapsis-card-trend-chart{
    width:200px;
    height:64px; 
    padding-left:8px; 
    padding-right:8px; 
    margin-left:6px; 
}

/*card*/

/*divider*/

.dinapsis-divider{
     height: 1px; 
}

/*divider*/

/*chart*/

.dinapsis-chart-content-grey-240{
    background-color: rgb(240, 240, 240);
    position: relative;
    box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.14), 0px 0px 2px 2px rgba(0, 0, 0, 0.098), 0px 0px 5px 1px rgba(0, 0, 0, 0.084);
}

.dinapsis-chart {
    width: 100%; 
    height: calc(100% - 135px);
    border-radius: 10px;
}

.dinapsis-summary-chart {
    width: 100%; 
    height: 300px;
    border-radius: 10px;
    background-color: transparent;
}

.dinapsis-trend-chart-tooltip-blue{
    position: relative;
    z-index: 100;
    color: white; 
    border: 2px solid rgba(255, 255, 255, 1); 
    border-radius: 5px;
    background-color: rgba(9, 74, 132, 1) !important;
    padding: 5px;
    font-size: 9pt;
}

.dinapsis-trend-chart-tooltip-grey{
    position: relative;
    z-index: 100;
    color: rgba(0, 0, 0, 0.54); 
    border: 2px solid rgba(0, 0, 0, 0.54); 
    border-radius: 5px;
    background-color: #ffffff;
    padding: 5px;
    font-size: 9pt;
}

/*chart*/

/*map*/
.dinapsis-map{
    z-index:1; 
    width: 100%; 
    height: 100%
}

.dinapsis-map-tooltip{
    padding: 6px 8px;
    font: Roboto;
    background-color: rgba(9, 74, 132, 1) !important; 
    box-shadow: none;
    border-radius: 10px;
    width: 100%;
}

.dinapsis-map-tooltip h4, b{
    margin: 0 0 5px;
    color: white;
}
/*map*/

/*documents*/
.dinapsis-documents-sidenav-tree ul  {
    margin: 0;
    padding: 0;
    list-style: none; 
    border: none;
    overflow: hidden;
}

.dinapsis-documents-sidenav-tree .md-icon-button{
    margin: 0;
    padding: 0;
}

.dinapsis-documents-sidenav-tree .md-icon-button{
    margin: 0;
    padding: 0;
}

.dinapsis-documents-sidenav-tree md-list-item._md-button-wrap > div.md-button:first-child{
    margin: 0;
    padding: 0;
}

.dinapsis-documents-sidenav-tree md-list-item.md-no-proxy.md-button, md-list-item .md-no-style.md-button{
    line-height: 1.2;
}

.dinapsis-documents-sidenav-tree li {
    position: relative;
    padding: 0 0 0 10px;
    white-space: nowrap;
}

.dinapsis-documents-sidenav-tree md-icon:focus {
    outline: none;
    border: 0;
 }

.dinapsis-documents-sidenav-tree .selectedNode{
    background-color: rgba(0, 0, 0, 0.12);
    color: #3F51B5;
}

.dinapsis-documents-sidenav-tree-ul-toggled{
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
}
/*documents*/

.info {
    padding: 6px 8px;
    font: Roboto;
    background-color: rgba(9, 74, 132, 1) !important; 
    box-shadow: none;
    border-radius: 10px;
    width: 100%;
}
.info h4, b {
    margin: 0 0 5px;
    color: white;
}


/*list item*/

.dinapsis-list-item._md-button-wrap > div.md-button:first-child{
    margin: 0;
    padding: 0;
}


md-radio-button .md-off {
    border-color: rgba(255, 255, 255, 1);
}

.data-analog-row{
    margin-top: 8px;
    margin-bottom: 8px;
}

.date-old-0{
    color: rgb(225, 225, 225);
}
.date-old-1{
    color: rgb(145, 213, 252);
}
.date-old-2{
    color: rgb(245, 170, 58);
}

/* menu */
.btn-menu .md-icon-button{
    margin: 0;
}

