@charset "utf-8";
/* CSS Document */

html, body
{
    height:100%;
    width:100%;
    margin:0;padding:0;
}
    
body
{
    font-family:Arial, Helvetica, sans-serif;background-color:#fff;font-size:20px;color:#333; /* font-family:Segoe UI; */
}

* {box-sizing: border-box}

.defaultText { width: 250px;margin-right:5px; height:19px;border:1px solid #C0C0C0; }
.defaultTextActive { color: #999; }
    
form, input, textarea, select {font-family:Arial, Helvetica, sans-serif;font-size:16px;margin:0;padding:0;}
form:focus, input:focus, textarea:focus, select:focus {outline:none;}
input.textfield        {border:1px solid #808080;height:20px;margin:3px 0px;box-sizing:border-box;padding:0 4px;}
select                 {border:1px solid #808080;height:20px;margin:3px 0px;}
textarea               {border:1px solid #808080;margin:3px 0px;box-sizing:border-box;padding:0 4px;}
input[type=text]       {height:20px;box-sizing:border-box;padding:0 4px;}
input[type="radio"]    {margin:3px 0px 0px 0px;}
input[type="checkbox"] {}
input[type="button"].nostyle, input[type="button"].nostyle:hover, input[type="button"].nostyle:focus {
                            height:auto !important;background:ButtonFace !important;color:ButtonText !important;border:2px outset ButtonFace !important;padding:1px 6px 1px 6px !important;
                            font-family:Arial, "sans-serif" !important;font-size:12px !important;font-weight:normal !important;font-smooth:never !important;-webkit-font-smoothing:none !important;
                            border-radius:0;-webkit-border-radius:0;-moz-border-radius:0;
                            text-shadow:none;-webkit-text-shadow:none;-moz-text-shadow:none;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;
                            }
input[type="button"].nostyle:active {border-style:inset !important;-webkit-appearance:push-button !important;}

a, a:link, a:visited   {color:#2865BA;text-decoration:underline;}
a:hover                {text-decoration:none;}

.clear_div      {clear:both;}

.login_bg                    {width:100%;height:100%;display:table;overflow:hidden; }
.login_bg_old                   {width:100%;height:100%;display:table;overflow:hidden;
                             background:linear-gradient(to bottom, #FAFAFA, #DDDDDD); /* W3C */
                             background:-moz-linear-gradient(top, #FAFAFA, #DDDDDD); /* FF3.6+ */
                             background:-webkit-linear-gradient(top, #FAFAFA, #DDDDDD); /* Chrome10+,Safari5.1+ */
                             background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FAFAFA), to(#DDDDDD)); /* Chrome,Safari4+ */
                             background:-ms-linear-gradient(top, #FAFAFA, #DDDDDD); /* IE10+ */
                             background:-o-linear-gradient(top, #FAFAFA, #DDDDDD); /* Opera 11.10+ */
                             filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#DDDDDD', GradientType=0) !important; /* IE7-9 */
                             _background:#DDDDDD; /* IE6 */
                            }
.login_shell                {font-family:"Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue", Arial,"sans-serif";margin:0 auto;width:100%;display:table-cell;vertical-align:top;}
.login_shell_old            {font-family:"Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue", Arial,"sans-serif";margin:0 auto;width:100%;display:table-cell;vertical-align:middle;}
.login_shell input, .login_shell select {font-family:"Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue", Arial,"sans-serif";height:37px;font-size:16px;color:#555;background:#F5F5F5;margin:0;padding:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;text-shadow:1px 1px 1px rgba(255,255,255,0.7);-webkit-text-shadow:1px 1px 1px rgba(255,255,255,0.7);-moz-text-shadow:1px 1px 1px rgba(255,255,255,0.7);box-shadow:0px 1px 1px rgba(255,255,255,0.7);-webkit-box-shadow:0 1px 1px rgba(255,255,255,0.7);-moz-box-shadow:0 1px 1px rgba(255,255,255,0.7);border:1px solid #969696;padding:4px 7px 4px 7px;margin-bottom:7px;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;}
.login_shell select         {width:100%;padding:4px 7px 4px 2px;}
.login_shell input:disabled, .login_shell textarea:disabled, .login_shell select:disabled  {color:#A2A2A2;border-color:#ccc;background:#F0F0F0;}
.login_shell input:focus, .login_shell select:focus, .login_shell textarea:focus {background:#fff;outline:0;border:1px solid #0193CF;box-shadow:none;}
.login_shell input[type="radio"]    {width:auto !important;height:auto !important;border:0;background:none;padding:0;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;}
.login_shell input[type="checkbox"] {width:auto !important;height:auto !important;border:0;background:none;margin:2px 0 0 0;padding:0;border-radius:0;-webkit-border-radius:0;-moz-border-radius:0;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;}
.login_shell input.textfield        {width:100%;}
.login_shell .options_form_table    {color:#333 !important;font-size:16px !important;}
.login_panel                {position:relative;width:99%;overflow:hidden;background:#fff;border:1px solid #bbb;margin:0 auto;padding:20px;box-shadow:1px 0px 8px rgba(0,0,0,0.3);-moz-box-shadow:1px 0px 8px rgba(0,0,0,0.3);-webkit-box-shadow:1px 0px 8px rgba(0,0,0,0.3);}
.login_panel_backup         {position:relative;width:99%;overflow:hidden;background:#fff;border:1px solid #bbb;margin:0 auto;padding:10px;box-shadow:1px 0px 8px rgba(0,0,0,0.3);-moz-box-shadow:1px 0px 8px rgba(0,0,0,0.3);-webkit-box-shadow:1px 0px 8px rgba(0,0,0,0.3);}
.login_panel_mailstat       {position:relative;width:750px;overflow:hidden;background:#fff;border:1px solid #bbb;margin:0 auto;padding:20px;box-shadow:1px 0px 8px rgba(0,0,0,0.3);-moz-box-shadow:1px 0px 8px rgba(0,0,0,0.3);-webkit-box-shadow:1px 0px 8px rgba(0,0,0,0.3);}
.login_panel_backupedit     {position:relative;width:550px;overflow:hidden;background:#fff;border:1px solid #bbb;margin:0 auto;padding:20px;box-shadow:1px 0px 8px rgba(0,0,0,0.3);-moz-box-shadow:1px 0px 8px rgba(0,0,0,0.3);-webkit-box-shadow:1px 0px 8px rgba(0,0,0,0.3);}
.login_panel_login          {position:relative;width:425px;overflow:hidden;background:#fff;border:1px solid #bbb;margin:0 auto;padding:20px;box-shadow:1px 0px 8px rgba(0,0,0,0.3);-moz-box-shadow:1px 0px 8px rgba(0,0,0,0.3);-webkit-box-shadow:1px 0px 8px rgba(0,0,0,0.3);}
.login_panel _h1             {width:100%;font-size:16px;color:#333;font-weight:600;line-height:100%;border-bottom:1px solid #bbb;margin:0;padding:0;margin-bottom:20px;padding-bottom:7px;}
.login_panel_right_backup   {float:left;width:99%;height:800px;overflow:auto;margin-right:0px;margin-left:0px;}
.login_panel_right_backupedit {float:left;width:500px;height:auto;overflow:auto;margin-right:20px;margin-left:20px;}
.login_panel_right_sslupedit {float:left;width:500px;height:auto;overflow:auto;margin-right:20px;margin-left:20px;}
.login_copyright            {margin:0 auto;width:100%;font-size:12px;color:#666;padding:7px 0px;}
.login_copyright a,         .login_copyright a:visited {text-decoration:none;color:#666;}
.login_copyright a:hover    {text-decoration:underline;}

.backup_table_mail			{font-size:15px; height:80%;width:97% !important;margin:10;padding:10;border-spacing:10;border-collapse:collapse;border:0;margin:10px 0;}
.backup_table_edit			{font-size:15px; height:80%;width:95% !important;margin:10;padding:10;border-spacing:10;border-collapse:collapse;border:0;margin:10px 0;}

.rotate-image 				{
-webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.table.alarm				{color: #c02537;}

th.rotate {
  /* Something you can count on */
  height: 70px;
  white-space: nowrap;
}

th.rotate > div {
  transform: 
    /* Magic Numbers */
    translate(0px, 51px)
    /* 45 is really 360 - 45 */
    rotate(315deg);
  width: 0px;
}
th.rotate > div > span {
  /* border-bottom: 1px solid #ccc; */ 
  padding: 0px 30px;
}

.bttn_shell         {display:inline-block;width:auto;margin-right:1px;height:28px;border:1px solid #969696;overflow:hidden;
                     border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;
                     background:linear-gradient(to bottom, #F0F0F0, #C8C8C8); /* W3C */
                     background:-moz-linear-gradient(top, #F0F0F0, #C8C8C8); /* FF3.6+ */
                     background:-webkit-linear-gradient(top, #F0F0F0, #C8C8C8); /* Chrome10+,Safari5.1+ */
                     background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#F0F0F0), to(#C8C8C8)); /* Chrome,Safari4+ */
                     background:-ms-linear-gradient(top, #F0F0F0, #C8C8C8); /* IE10+ */
                     background:-o-linear-gradient(top, #F0F0F0, #C8C8C8); /* Opera 11.10+ */
                     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F0F0F0', endColorstr='#C8C8C8', GradientType=0); /* IE7-9 */
                     _background:#C8C8C8; /* IE 6 */
                     background-clip:padding-box;-moz-background-clip:padding;-webkit-background-clip:padding-box;
                     box-shadow:0px 1px 0px rgba(0,0,0,0.1), inset 0px 1px 0px #fff;
                     -webkit-box-shadow:0 1px 0px rgba(0,0,0,0.1), inset 0px 1px 0px #fff;
                     -moz-box-shadow:0 1px 0px rgba(0,0,0,0.1), inset 0px 1px 0px #fff;
                     -webkit-user-select:none;-khtml-user-select:none;-moz-user-select:-moz-none;-o-user-select:none;user-select:none;
                    }
.bttn_shell:active  {background:#E1E1E1;box-shadow:inset 0px 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.2);}
.bttn               {display:inline-block;width:auto !important;text-decoration:none !important;color:#333 !important;font-size:16px;min-width:60px;height:26px;padding:3px 10px;text-align:center;}
.bttn:hover         {text-decoration:none !important;color:#333 !important;}

.bttn_shell.blue, .bttn_shell.blue:hover, .bttn_shell.blue:focus, .bttn_shell.blue:active 
                    {border:1px solid #026A98 !important;
					 float:left;
					 margin-right:7px;margin-left:7px;margin-top:7px;margin-bottom:7px;
                     background:linear-gradient(to bottom, #3C86D1, #215589); /* W3C */
                     background:-moz-linear-gradient(top, #3C86D1, #215589); /* FF3.6+ */
                     background:-webkit-linear-gradient(top, #3C86D1, #215589); /* Chrome10+,Safari5.1+ */
                     background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#3C86D1), to(#215589)); /* Chrome,Safari4+ */
                     background:-ms-linear-gradient(top, #3C86D1, #215589); /* IE10+ */
                     background:-o-linear-gradient(top, #3C86D1, #215589); /* Opera 11.10+ */
                     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3C86D1', endColorstr='#215589', GradientType=0); /* IE7-9 */
                     _background:#02618F; /* IE 6 */
                     background-clip:padding-box;-moz-background-clip:padding;-webkit-background-clip:padding-box;
                     box-shadow:inset 0px 2px 0px rgba(255,255,255,0.3);
                     -webkit-box-shadow:inset 0px 1px 0px rgba(255,255,255,0.3);
                     -moz-box-shadow:inset 0px 1px 0px rgba(255,255,255,0.3);
                    }
.bttn_shell.white, .bttn_shell.white:hover, .bttn_shell.white:focus, .bttn_shell.white:active
                    {border:1px solid #026A98 !important;
                                         float:left;
                                         margin-right:7px;margin-left:7px;margin-top:7px;margin-bottom:7px;
                     background:linear-gradient(to bottom, #3C86D1, #215589); /* W3C */
                     background:-moz-linear-gradient(top, #3C86D1, #215589); /* FF3.6+ */
                     background:-webkit-linear-gradient(top, #3C86D1, #215589); /* Chrome10+,Safari5.1+ */
                     background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFDD)); /* Chrome,Safari4+ */
                     background:-ms-linear-gradient(top, #3C86D1, #215589); /* IE10+ */
                     background:-o-linear-gradient(top, #3C86D1, #215589); /* Opera 11.10+ */
                     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3C86D1', endColorstr='#215589', GradientType=0); /* IE7-9 */
                     _background:#02618F; /* IE 6 */
                     background-clip:padding-box;-moz-background-clip:padding;-webkit-background-clip:padding-box;
                     box-shadow:inset 0px 2px 0px rgba(255,255,255,0.3);
                     -webkit-box-shadow:inset 0px 1px 0px rgba(255,255,255,0.3);
                     -moz-box-shadow:inset 0px 1px 0px rgba(255,255,255,0.3);
                    }
.bttn_shell.blue .bttn {color:#fff !important;text-shadow:1px 1px 0px rgba(0,0,0,0.6);-webkit-text-shadow:1px 1px 0px rgba(0,0,0,0.6);-moz-text-shadow:1px 1px 0px rgba(0,0,0,0.6);}
.bttn_shell.blue:hover, .bttn_shell.blue:focus {
                     background:linear-gradient(to bottom, #42C1FF, #146DC6); /* W3C */
                     background:-moz-linear-gradient(top, #42C1FF, #146DC6); /* FF3.6+ */
                     background:-webkit-linear-gradient(top, #42C1FF, #146DC6); /* Chrome10+,Safari5.1+ */
                     background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#42C1FF), to(#146DC6)); /* Chrome,Safari4+ */
                     background:-ms-linear-gradient(top, #42C1FF, #146DC6); /* IE10+ */
                     background:-o-linear-gradient(top, #42C1FF, #146DC6); /* Opera 11.10+ */
                     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#42C1FF', endColorstr='#146DC6', GradientType=0); /* IE7-9 */
                     _background:#1B7DAC; /* IE 6 */
                     background-clip:padding-box;-moz-background-clip:padding;-webkit-background-clip:padding-box;
                    }
.bttn_shell.blue:active {background:#2083D5;box-shadow:inset 0px 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.2);}




/* Browser Specific Hacks */

/* Targets IE11 only */
_:-ms-fullscreen, :root input[type="button"].nostyle {border:1px outset ButtonFace !important;padding:2px 6px 2px 6px !important;font-size:12px !important;font-family:"Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue", Arial,"sans-serif" !important;}
_:-ms-fullscreen, :root #btnAttach  {float:left !important;}

/* Targets IE10 and below (all IE)*/
input[type="button"].nostyle, input[type="button"].nostyle:hover, input[type="button"].nostyle:focus {border:1px outset ButtonFace\9 !important;padding:4px 6px 2px 6px\9 !important;font-size:12px\9 !important;font-family:"Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue", Arial,"sans-serif"\9 !important;}
#btnAttach  {float:left\9 !important;}



.table-header-rotated {
  border-collapse: collapse;
  .csstransforms & td {
    width: 30px;
  }
  .no-csstransforms & th {
    padding: 5px 10px;
  }
  td {
    text-align: center;
    padding: 10px 5px;
    border: 1px solid #ccc;
  }
  .csstransforms & th.rotate {
    height: 140px;
    white-space: nowrap;
    // Firefox needs the extra DIV for some reason, otherwise the text disappears if you rotate 
    > div {
      transform: 
        // Magic Numbers
        translate(25px, 51px)
        // 45 is really 360-45
        rotate(315deg);
      width: 30px;
    }
    > div > span {
      border-bottom: 1px solid #ccc;
      padding: 5px 10px;
    }
  }
  th.row-header {
    padding: 0 10px;
    border-bottom: 1px solid #ccc;
  }
}



.ver th {
   text-align: left; vertical-align: top;
}
.ver th span {
   writing-mode: vertical-rl;
  -webkit-text-orientation: sideways;
  text-orientation: sideways
}
.labeled {
	font-style: normal;
   -ms-writing-mode: tb-rl; 
   writing-mode: vertical-rl; 
   transform:rotate(0deg);
}

.containernode {
  display: flex;
  flex-direction: row;
  justify-content: left;
  flex-wrap: wrap;
  width: 100%;
  _background-color: grey;
  align-items: left;
}

.containernode .box{
  display: inline-block; 
  float: left;
  _height: 50px;
  min-width: 360px;
  width: 360px;
  white-space: break-spaces;
  background-color: #F0F0F0;
  margin: 5px;
  padding: 10px;
}

.containernode .boxbin{
  display: inline-block;
  float: left;
  _height: 50px;
  min-width: 360px;
  width:360px;
  background-color: #FFFFEC;
  margin: 5px;
  padding: 10px;
}

.containernode .boxsen{
  display: inline-block;
  float: left;
  _height: 50px;
  min-width: 360px;
  width:360px;
  background-color: #FFF8ED;
  margin: 5px;
  padding: 10px;
}

.containernode .boxsenalarm{
  display: inline-block;
  float: left;
  _height: 50px;
  min-width: 360px;
  _background-color: #ffaa00;
  background-color: #FFF8ED;
  color: red;
  margin: 5px;
  padding: 10px;
}

h1 { 
  display: block;
  font-size: 36px;
  margin-top: 0.1em;
  margin-bottom: 0.5em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h2 {
  display: block;
  font-size: 32px;
  margin-top: 0em;
  margin-bottom: 0.2em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h3 {
  display: block;
  font-size: 26px;
  margin-top: 0em;
  margin-bottom: 0.6em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

