html { width: 100%; height: 100%; margin: 0px; padding: 0px; cursor: default; overflow: hidden; } 

body { width: 100%; height: 100%; margin: 0px; padding: 0px; cursor: default; background-color: transparent; color: #ffffff; overflow: hidden;
       
       /* -webkit-overflow-scrolling: touch; */ /* required to fix div scrolling */ /* applied topically to prevent Apple bug with multi frames */
       -webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */
       -webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
       
       /* prevent copy paste, to allow, change 'none' to 'text' */       
       -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
       
       /* disable zooming */
       -ms-content-zooming: none; 
       
       /* Disable default touch browser action */
       /* -ms-touch-action: none; touch-action: none; */ /* but also disables scrolling in DIV, applied only on GamePlay */
              
       -ms-touch-action: manipulation; touch-action: manipulation;       
     }
     
form { width: 100%; height: 100%; }

img { margin: 0px; padding: 0px; border: none 0px transparent; vertical-align: middle; }
a { text-decoration: none; border: none; outline: none; ie-dummy: expression(this.hideFocus=true); cursor: pointer; }
a:focus { border: none; outline: none; }

p { margin: 0px; padding: 0px; line-height: normal; }
area { cursor: pointer; }
textarea { resize: none; }
table { table-layout: fixed; }
i { text-align: center; }

.Font { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 0.8em !important; }
.Font8 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 0.7em !important; }
.Font12 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 1.0em !important; }
.Font14 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 1.2em !important; }
.Font16 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 1.3em !important; }
.Font20 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 1.6em !important; }
.Font24 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 2em !important; }
.Font36 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 3em !important; }
.Font40 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 3.5em !important; }
.Font48 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 4em !important; }
.Font60 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 5em !important; }

.Releway { font-family: 'Raleway', TimesNewRoman, 'Times New Roman', Times, Baskerville, Georgia, serif; }
.LeagueGothic { font-family: 'League Gothic', TimesNewRoman, 'Times New Roman', Times, Baskerville, Georgia, serif; }
.LeagueGothicCondensed { font-family: 'League Gothic Condensed', TimesNewRoman, 'Times New Roman', Times, Baskerville, Georgia, serif; }

.bold { font-weight: bold; }
.normal { font-weight: normal; }

.spacing { letter-spacing: 4px; }
.txtLabel { text-shadow: 0px 0px 8px rgba(255,255,255,.5); cursor: pointer; font-weight: bold; padding: 0px 0px 0px 0px; letter-spacing: 2px; color: #ffffff; }
.txtTitle { text-shadow: 0px 0px 8px rgba(255,255,255,.5); color: #ffffff; }
.txtShadow { text-shadow: 0px 0px 8px rgba(255,255,255,.5); }

button, .boxShadow { -webkit-box-shadow: 0px 0px 8px 4px rgba(255,255,255,0.25); -moz-box-shadow: 0px 0px 8px 4px rgba(255,255,255,0.25); box-shadow: 0px 0px 8px 4px rgba(255,255,255,0.25); }
.boxShadowInset { -webkit-box-shadow: inset 0px 0px 8px 4px rgba(255,255,255,0.25); -moz-box-shadow: inset 0px 0px 8px 4px rgba(255,255,255,0.25); box-shadow: inset 0px 0px 8px 4px rgba(255,255,255,0.25); }
.NOboxShadow { -webkit-box-shadow: 0px 0px 8px 4px transparent; -moz-box-shadow: 0px 0px 8px 4px transparent; box-shadow: 0px 0px 8px 4px transparent; }

.borderRounded { -moz-border-radius: 12px !important; -webkit-border-radius: 12px !important; -khtml-border-radius: 12px !important; border-radius: 12px !important; }
.borderCircle { -moz-border-radius: 50% !important; -webkit-border-radius: 50% !important; -khtml-border-radius: 25% !important; border-radius: 50% !important;}

/* NB. was applied to the symbols of the seeds that have been replaced with images of the seeds to increase performance in some devices */
/* .backgroundShadow { text-shadow: 0px 0px 32px #ffffff; } */ 

* { margin:0px; padding:0px; 
    box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
    -webkit-tap-highlight-color:rgba(0,0,0,0); outline: none; /* disable orange focus on Android */
        
    /* In test to verify the performance increase for some devices */    
    /* -webkit-transform: translate3d(0,0,0); /* applied only on Android */
    /* Test: Android 4.3 in browser show blank page
                         in webview the opacity is not applied to images
             iOS         in browser & webview show blank page
    */
    -webkit-appearance: none;
    
    /* -ms-overflow-style: none; /* -ms-autohiding-scrollbar; */
  }

/* Fix viewport size on Microsoft Windows Phone */
@media all and (orientation:portrait) { @-ms-viewport { width: device-width; user-zoom: fixed; max-zoom: 1; min-zoom: 1; } }
@media all and (orientation:landscape) { @-ms-viewport { width: device-width; user-zoom: fixed; max-zoom: 1; min-zoom: 1; } }

/* Define Responsive Layout*/

/* Portrait */

@media screen and (orientation:portrait) and (max-width: 360px) { /* Android 360 x 568 */

}

@media screen and (orientation:portrait) and (min-width: 768px) { /* iPad 768 x 1024 */


/* .Font { font-size: 0.8em; } /* 0.9em; */
/* .Font12 { font-size: 1.0em; } /* 1.4em */

}

/* Landscape */

@media screen and (orientation:landscape) and (max-width: 768px) { /* Android 360 x 568 */
        
}

@media screen and (orientation:landscape) and (min-width: 1024px) { /* iPad 768 x 1024 */

/* .Font12 { font-size: 1.0em; } /* 1.1em */
                                     
}

iot-monitor, iot-listener, iot-talker { display: none; }