html { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#bg-image img{
position:fixed;
left:0;
top:0;
width:100%;
max-height: 100%;
}
#bg-image{
height: 100%;
width: 100%;
float: left;
overflow: hidden;
position: relative;
}

.allmeteo-widget {
//    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
//    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

  font-family: Calibri;
 //   border-radius: 10px;
    position: relative;
    height: 100%;
}

body {
  font-family: Calibri;
 src: url(/images/calibri_regular.ttf);
//background-image: url('/images/bg.jpg');
    background-color: #FBF6D9;
//#93FFE8
}


@font-face {
 font-family: Calibri ;
 src: url(/images/calibri_regular.ttf);
}


.allmeteo-temperature {
    left: 15px;
    top: 11%;
    text-align: center;
    font-size: 30pt;
    position: absolute;
    font-weight: 1000;
    width: 55%; 
    height: 15%;
}

.allmeteo-altitude {
    right: -30px;
    top: 14%;
    text-align: center;
    font-size: 15pt;
    position: absolute;
    font-weight: 800;
    width: 55%;
    height: 15%;
}

.allmeteo-forecast {
    left: 0px;
    top: 28%;
    text-align: right;
    font-size: 12pt;
    position: absolute;
    font-weight: 600;
    width: 57%; 
    height: 10%;
}

.allmeteo-forecast12h {
    left: 0px;
    top: 35%;
    text-align: right;
    font-size: 12pt;
    position: absolute;
    font-weight: 600;
    width: 57%;
    height: 10%;
}

.allmeteo-temp-min {
    right: 0px;
    top: 20%;
    text-align: center;
    font-size: 12pt;
    position: absolute;
    font-weight: 600;
    width: 55%;
    height: 10%;
}

.allmeteo-temp-max {
    right: 0px;
    top: 20%;
    text-align: center;
    font-size: 12pt;
    position: absolute;
    font-weight: 600;
    width: 55%;
    height: 10%;
}

.allmeteo-sensors {
    right: 0px;
    top: 45%;
    font-size: 12px;
    position: absolute;
    width: 35%;
    text-align: center;
}

.allmeteo-unit {
    font-size: 90%;
    font-weight: 800;
    color: #333;
}

/*
.allmeteo-icon {
    position: absolute;
    top: 0px;
    width: 50%;
    height: 35%;
    text-align: center;
}

.allmeteo-icon img {
    height:90%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%)
}

*/

.allmeteo-ground-title {
    position: absolute;
    top: 24%;
    left: 0%;
    text-align: center;
    width: 100%;
    font-size: 11pt;
}

.allmeteo-temp1 {
    position: absolute;
    top: 32%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-temp2 {
    position: absolute;
    top: 32%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-temp3 {
    position: absolute;
    top: 32%;
    left: 64%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-temp1-desc1 {
    position: absolute;
    top: 46%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-temp2-desc2 {
    position: absolute;
    top: 46%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-temp3-desc3 {
    position: absolute;
    top: 46%;
    left: 64%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-today-min1 {
    position: absolute;
    top: 56%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-today-min2 {
    position: absolute;
    top: 56%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-today-min3 {
    position: absolute;
    top: 56%;
    left: 64%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-winddir {
    position: absolute;
    top: 82%;
    left: 35%;
    text-align: center;
    width: 33.33%;
    font-size: 15pt;
}

.allmeteo-maxwind12h {
    position: absolute;
    top: 78%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;

//    left: 9px;
//    top: 68%;
//    text-align: right;
//    font-size: 12pt;
//    position: absolute;
//    font-weight: 600;
//    width: 57%;
//    height: 10%;
}

.allmeteo-maxwind24h {
    position: absolute;
    top: 78%;
    right: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;

//    left: 9px;
 //   top: 31%;
 //   text-align: right;
 //   font-size: 12pt;
 //   position: absolute;
 //   font-weight: 600;
 //   width: 57%;
 //   height: 10%;
}

.allmeteo-windrose {
    position: absolute;
    width: 100%;
    top: 10%;
    margin-left: auto;
    margin-right: auto;
    max-height: 70%;
    horizontal-align: center;
    text-align: center;
//    transform: translate(-50%, -50%)
  transform: translate(center, center);
}

.allmeteo-wind-name {
    position: absolute;
    top: 0%;
    text-align: center;
    width: 100%;
    font-size: 22pt;
    font-weight: 600;
    height: 15%;
}

.allmeteo-name {
    position: absolute;
    top: 0%;
    text-align: center;
    width: 100%;
    font-size: 22pt;
    font-weight: 600;
    height: 15%;
}

.allmeteo-humidex {
    position: absolute;
    top: 46%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-windchill {
    position: absolute;
    top: 46%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-humidity {
    position: absolute;
    top: 62%;
    left: 0%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-pressure {
    position: absolute;
    top: 26%;
//    top: 11%;
//    left: 33.33%;
    left: 63.33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-deltapressure {
    position: absolute;
//    top: 54%;
    top: 38%;
    left: 61.33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-rain {
    position: absolute;
    top: 78%;
    left: 2%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-rain1h {
    position: absolute;
    top: 78%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}


.allmeteo-rain24h {
    position: absolute;
    top: 78%;
    left: 66%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-dewpoint {
    position: absolute;
    top: 62%;
    left: 64%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-irradiation {
    position: absolute;
    top: 62%;
    left: 33%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
}

.allmeteo-footer {
    width: 100%;
    bottom: 0%;
    height: 5%;
    font-size: 10px;
    line-height: 10px;
    text-align: center;
    position: absolute;
}

.allmeteo-logo {
    position: absolute;
    width: 100%;
    bottom: 8%;
    text-align: center;
    background-color: lightgreen;
    z-index: 10000;
    vertical-align: middle;
}
/*
.allmeteo-logo a:hover, a:active, a:focus, a:link {
    background: none !important;
    vertical-align: middle;
}
*/
.allmeteo-logo a:hover, a:active, a:focus {
    background: none !important;
    vertical-align: middle;
}

.allmeteo-logo img {
   height: 25px;
 }

.allmeteo-gust {
    color: red;
}

.field-tick {
  font-size: 0.9em;
}

g.avgwind {
  fill: #333;
  stroke: #000;
}

g.gustwind {
  fill: #e85116;
  stroke: #b64011;
}

a:hover {
//    background: none !important;
    background: none;
//    vertical-align: middle;
  text-decoration: none;
}

a:active {
    background: none;
//    vertical-align: middle;
  text-decoration: none;
}

a:focus {
    background: none;
//    vertical-align: middle;
  text-decoration: none;
}

a:link {
    background: none;
//    vertical-align: middle;
  text-decoration: none;
}


.chart {
//border-color: lightskyblue;
    background: none !important;
  text-decoration: none;
//    vertical-align: middle;
    color: black;
}

.footer th {
    background: lightgreen !important;
    vertical-align: middle;
    color: black;
}

.onepix {
    background: lightgreen !important;
height: 1px;
width: 1px;
overflow: hidden;
    font-color: lightgreen;
}
/*
.footer th, a:hover, a:active, a:focus, a:link, a:visited {
    background: lightgreen !important;
    vertical-align: middle;
    color: black;
}
*/
.up {
    color: red;
    font-size: 20pt;
}

.down {
    color: blue;
    font-size: 20pt;
}

.upma {
    color: red;
    font-size: 10pt;
}

.downma {
    color: blue;
    font-size: 10pt;
}

.up-blink {
    color: red;
    font-size: 20pt;
  animation: clignote 2s linear infinite;
}

.down-blink {
    color: blue;
    font-size: 20pt;
  animation: clignote 2s linear infinite;
}

.up-fast-blink {
    color: red;
    font-size: 20pt;
  animation: clignote 0.5s linear infinite;
}

.down-fast-blink {
    color: blue;
    font-size: 20pt;
  animation: clignote 0.5s linear infinite;
}

.up-blinkma {
    color: red;
    font-size: 10pt;
  animation: clignote 2s linear infinite;
}

.down-blinkma {
    color: blue;
    font-size: 10pt;
  animation: clignote 2s linear infinite;
}

.up-fast-blinkma {
    color: red;
    font-size: 10pt;
  animation: clignote 0.5s linear infinite;
}

.down-fast-blinkma {
    color: blue;
    font-size: 10pt;
  animation: clignote 0.5s linear infinite;
}

.table-ma {
//    min-width:100%;
//    max-width:100%;
    width: 100%;
    text-align: center;
    font-size: 15pt;
    border: 2px solid lightgreen;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.bluema {
    color: blue;
    font-weight: 800;
}

.redma {
    color: red;
    font-weight: 800;
}

.violetma {
    color: violet;
    font-weight: 800;
}

.blue {
    color: blue;
    font-size: 11pt;
}

.violet {
    color: violet;
    font-size: 11pt;
}

.red {
    color: red;
    font-size: 11pt;
}

.blue-blink {
    color: blue;
    font-size: 11pt;
  animation: clignote 2s linear infinite;
}

.red-blink {
    color: red;
    font-size: 11pt;
  animation: clignote 2s linear infinite;
}

.blue-fast-blink {
    color: blue;
    font-size: 11pt;
  animation: clignote 0.5s linear infinite;
}

.red-fast-blink {
    color: red;
    font-size: 11pt;
    font-weight: bold;
  animation: clignote 0.5s linear infinite;
}

.offline {
    position: absolute;
    top: 15%;
    left: 63%;
    text-align: center;
    width: 33.33%;
    font-size: 11pt;
    color: white;
    background-color: red;
  animation: clignote 1s linear infinite;
}

th {
    background-color: lightgreen;
    border: 0;
}


@keyframes clignote {  
  50% { opacity: 0; }
}

.tooltip {
  position: relative;
  display: inline-block;
//  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
//  width: 120px;
  background-color: #555;
//  color: #fff;
  text-align: center;
//  border-radius: 6px;
//  padding: 5px 0;
  position: absolute;
  z-index: 1;
//  bottom: 125%;
//  left: 50%;
//  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
//  content: "";
  position: absolute;
//  top: 100%;
//  left: 50%;
//  margin-left: -5px;
//  border-width: 5px;
//  border-style: solid;
//  border-color: #555 transparent transparent transparent;
	bottom: 100%;
	width: 100px;
	left: -50%;
	transform: translate(-50%, -50%);
//  display: flex;
//  align-items: center;
//  justify-content: center 

//    position: absolute;
//top: 50%;
//left: 50%;
//margin-left: auto;
//    margin-right: auto;
//margin-top: auto;
//margin-left: -50px;
//    top:0;
//    bottom: 0;
//    left: 0;
//    right: 0;
//    margin: auto;
 //   width: 100px;
 //   height: 100px;
 //   background-color: blue;


}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.menu-btn {vertical-align: top; font-size: 12px; background-color:lightgreen; width: 10em; height: 2em; border-width:1px; border-style:solid; border-color:black; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.menu-btn2 {vertical-align: top; font-size: 12px; background-color:lightgreen; width: 14em; height: 2em; border-width:1px; border-style:solid; border-color:black; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

table.bglogo {
  background-image: url("https://bmcb.club/images/BMCB-LOGO-300px.png");
  background-color: rgba(251,246,217,0.75);
  background-blend-mode: lighten;
//  background-position: center top;
  background-position: 15% 30px;

  background-repeat: no-repeat;

// position: absolute;
 display: flex;
}

table.bglogo tr:nth-child(even) {background-color: rgba(255,255,255,0.35);}


table.datacheck td {
 text-align: center;
 vertical-align: middle;

}



table.datacheck tr:nth-child(even) {background-color: #f2f2f2;}


.dropbtn {
  background-color: #4CAF50;
  color: white;
  padding: 16px;
  font-size: 12px;
  border: none;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: lightgreen;
//  background-color: #f1f1f1;
  min-width: 120px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1000;
}

.dropdown-content a {
  color: black;
  padding: 8px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #ddd;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .menu-btn {background-color: #3e8e41;}

textarea {
  resize: none;
}