@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');


/*VARIABLES*/
:root {
  --text-color:#393939;
  --main-border-radius: 8px;
  --main-background-color:#b4b4b4;
  --box-background-color:#f4f4f4;
  --button-normal-color:#b4b4b4;
  --button-active-color:#4e5daa;
}
html, body { overflow-x: hidden; /* Prevent scroll on narrow devices */ }
body { font-size:15px; padding-top: 56px; background-color: var(--main-background-color); }

/*LINKS*/
a {  text-decoration:none; color: var(--button-active-color); }

/*TYPO*/
p, span, button, a, h3 { font-family:"Roboto", sans-serif; font-weight:400; font-style: normal; }
h1, h2, h4, h5, h6 { font-family:"Roboto", sans-serif; font-weight:700; font-style:normal; }
p {  font-size:1.1em; }
h2 { font-size:1.3em; background-color: var(--box-background-color); border-radius:var(--main-border-radius); display:inline-block; margin-bottom:20px; padding:15px 20px; }
h3 { font-size:1em; }
h5 { font-size:.9em; }

/*BUTTONS*/
.icona-mesinfo { margin-left:5px; border:1px solid var(--box-background-color); background-color:var(--box-background-color); color:var(--text-color); width:53px; height:53px; }
.icona-mesinfo:hover { background-color:var(--button-active-color); color:#fff; }

/*HEADER*/
nav {  box-shadow: 2px 2px 5px #707070; }
.logo-tania { width:188px; height:81px;  }
.tancar-sessio { color: var(--button-active-color);  }
#navbar ul li a {  background-color:var(--button-normal-color); border-radius:var(--main-border-radius); color:#fff; margin-right:15px; }
#navbar ul li a.active, #navbar ul li a:hover{  background-color:var(--button-active-color); }

#navbar.open ul li a {  padding-left:10px; margin-bottom:6px; }

/*LAYOUT*/
#first-content { margin-top:90px;  }
.inner-row-color { background-color:#fff; border-radius:var(--main-border-radius); }
.box-color {  background-color:var(--box-background-color); border-radius:var(--main-border-radius); }

.impulsat img {  max-width:200px; }
.terrassa-img {  width:100%; border-radius:var(--main-border-radius); }
.llegenda-sensor { max-width:275px; margin:0 auto; display:block; text-align:center; }

.estat-actual { background-color:var(--box-background-color); font-size:1.2em; padding:14px; margin-left:5px; border-radius:var(--main-border-radius); }
  .nivell { margin-left:25px; }
    .nivell-0 {color:#334dcc;}
    .nivell-1 {color:#61a60e;}
    .nivell-2 {color:#f79900;}
    .nivell-3 {color:#dd052b;}

/*TOOLTIP*/
.tooltip { --bs-tooltip-bg:#e0e0e0; --bs-tooltip-color:var(--text-color); }

/*FOOTER*/
.logos-footer img { width:30%; max-width:140px;  }


/*MEDIAQUERIES*/
/*Per sota de LG*/
@media (max-width: 991.98px) {
  .logo-tania {  width:100px; height:50px; }

  .offcanvas-collapse { position: fixed; top:76px; /* Height of navbar */
    bottom: 0; left: 100%; width: 100%; padding-right: 1rem; padding-left: 1rem; overflow-y: auto;
    visibility: hidden; background-color: #F8F9FA; transition: transform .2s ease-in-out, visibility .2s ease-in-out;
  }
  .offcanvas-collapse.open { visibility: visible; transform: translateX(-100%); }

  #first-content { margin-top:50px;  }
}

/*Per sota de MD*/
@media (max-width: 767.98px) {
.nivells-de-soroll {  flex-wrap:wrap; }
.estat-actual { margin-bottom:7px; }
}