* { margin:0px; padding: 0px; }
body {
    font-size: 11px;
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    color: #444;
    background-color: #ececec;
}

img {
    border: none;
    margin: 0;
    vertical-align: top
}

form {
    margin: 0
}

a {
    color: #267DD4
}

a:hover {
    color: #267DD4
}

.header {
    position: absolute;
    top: 0;
    left: 3px;
}

.main_container {
    position: absolute;
    top: 38px;
    left: 0;
    right: 0
}

.message {
    border:1px solid;
    margin:0 0px 20px 0;
    line-height: 120%;
}

.message p{
    padding:20px 20px 20px 52px;
}

.btn {
    cursor: pointer;
}

.line {
    clear: left;
    margin-bottom: 5px;
}

label.title {
    width: 100px;
}
.title {
    float: left;
    width: 220px;
    line-height: 22px;
}

input {
    border: 1px solid gray;
    background-color: white;
}

.success{
    background:#E6EFC2 url(images/highlight_line.gif) repeat-x scroll 0 0;
    border-color:#C6D881;
}

.success p{
    background:transparent url(images/24_tick.png) no-repeat scroll 15px 16px;
}

.warning{
    background:#FFF6BF url(images/highlight_line.gif) repeat-x scroll 0 0;
    border-color:#FDD845;
}

.warning p{
    background:transparent url(images/24_alert.png) no-repeat scroll 15px 17px;
}

.error{
    background:#FBE3E4 url(images/highlight_line.gif) repeat-x scroll 0 0;
    border-color:#FBC7C9;
}

.error p{
    background:transparent url(images/24_x_false.png) no-repeat scroll 15px 17px;
}

.tip{
    background:#A8B2C5 url(images/highlight_line.gif) repeat-x scroll 0 0;
    border-color:#8497BF;
}

.tip p{
    background:transparent url(images/24_information.png) no-repeat scroll 15px 17px;
}


.PageTitle {
    font-size: 18px;
    line-height: 20px;
    font-weight: 700;
    text-shadow: 0 1px 1px white;
    margin-bottom: 10px;
}

.IndexTitle {
    position: absolute;
    top: 0;
    left: 320px;
    padding-top: 0;
    font-size: 18px;
    line-height: 20px;
    font-weight: 700;
    text-shadow: 0 1px 1px white;
}

.IndexTitle .Key {
    color: #B4B8BE;
}

#Version {
    position: absolute;
    top: 21px;
    left: 321px;
    font-size: 10px;
    color: #8C8C8C;
    text-shadow: 0 1px 1px white;
}

#VersionOutOfDate {
    display: none;
    position: absolute;
    top: 20px;
    left: 405px;
    font-size: 10px;
    color: white;
    background-color: #DC7608;
    border-radius: 4px;
    padding: 1px 3px;
}

#VersionError {
    display: none;
    position: absolute;
    top: 20px;
    left: 405px;
    font-size: 10px;
    color: white;
    background-color: red;
    border-radius: 4px;
    padding: 1px 3px;
}

#LogoDelimiter {
    position: absolute;
    top: 0;
    left: 305px;
    height: 30px;
    border-left: 2px solid #c5cad3;
}

.MenuButton {
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px -1px #2c5c7b;
    background-color: #4e83a6;
    border: 0;
    padding: 3px 10px;
    -moz-box-shadow: 1px 1px #2c5c7b;
    -webkit-box-shadow: 1px 1px #2c5c7b;
    box-shadow: 1px 1px #2c5c7b;
    margin-right: 3px;
    text-decoration: none;
}
a.MenuButton:hover {
    color:#fff;
}

.usual ul {
    margin-left: 0px;
}

.usual li {
    list-style: none;
    float: left;
}

.BoardButton {
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px -1px #2c5c7b;
    background-color: #4e83a6;
    border: 0;
    padding: 2px 6px;
    -moz-box-shadow: 1px 1px #2c5c7b;
    -webkit-box-shadow: 1px 1px #2c5c7b;
    box-shadow: 1px 1px #2c5c7b;
}

.MiniButton {
    font-size: 10px;
    line-height: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #6e6c66;
    border: 0;
    padding: 1px 5px;
    -moz-box-shadow: 1px 1px #103559;
    -webkit-box-shadow: 1px 1px #103559;
    box-shadow: 1px 1px #2A2A27;
}

.ButtonLogout {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 25px;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #4b4a46;
    border: 0;
    padding: 3px 5px;
    -moz-box-shadow: 1px 1px #103559;
    -webkit-box-shadow: 1px 1px #103559;
    box-shadow: 1px 1px #2A2A27;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.ButtonSettings {
    position: absolute;
    top: 0;
    right: 65px;
    width: 60px;
    height: 25px;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #4b4a46;
    border: 0;
    padding: 3px 5px;
    -moz-box-shadow: 1px 1px #103559;
    -webkit-box-shadow: 1px 1px #103559;
    box-shadow: 1px 1px #2A2A27;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StartStopRefresh {
    position: absolute;
    top: 0;
    right: 130px;
    width: 75px;
    height: 25px;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #4b4a46;
    border: 0;
    padding: 3px 5px;
    -moz-box-shadow: 1px 1px #103559;
    -webkit-box-shadow: 1px 1px #103559;
    box-shadow: 1px 1px #2A2A27;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

/* REFRESH MONITOR ========================================================================= */
#ConnectionIndicator {
    position: absolute;
    top: 0;
    right: 210px;
}

.RefreshMonitorOk {
    background-color: #4e83a6;
    width: 238px;
    font-weight: 700;
    text-align: center;
    padding: 6px;
    color: #fff;
    text-shadow: 0 -1px -1px #008629;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.RefreshMonitorError {
    background-color: red;
    width: 238px;
    font-weight: 700;
    text-align: center;
    padding: 6px;
    color: #fff;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

/* STATUS CONTAINER ========================================================================= */

.StatusContainerDefault {
    display: inline;
    font-size: 10px;
    color: #444;
    background-color: #DCDCD9;
    font-weight: 700;
    text-shadow: 0 1px 1px white;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerGreen {
    display: inline;
    font-size: 10px;
    background-color: #4e83a6;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 -1px -1px #3c6078;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerRed {
    display: inline;
    font-size: 10px;
    background-color: #ED1B24;
    font-weight: 700;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerRedBlink {
    display: inline;
    font-size: 10px;
    background: url(/images/blink_red.gif);
    background-color: #ED1B24;
    font-weight: 700;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerBlack {
    display: inline;
    font-size: 10px;
    background-color: #000;
    font-weight: 700;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerOrange {
    display: inline;
    font-size: 10px;
    background-color: #dc7608;
    font-weight: 700;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerOK {
    display: inline;
    font-size: 10px;
    background-color: #008000;
    font-weight: 700;
    color: #fff;
    padding: 0 5px;
    font-weight: 700;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px
}

.StatusContainerBig{
    width: 95%;
    height: 40px;
    display: inline-block;
    padding: 11px 1px 0px 1px;
    font-size: 20px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

/* RESULTS TABLE ====================================================================== */

table.ResultsTable{
    width: 100%;
}

.ResultsTable th{
    font-size: 20px;
}

.ResultsTable td {
    text-align: center;
}

/* MAIN TABLE ========================================================================= */
table.MainTable {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.MainTable>tbody>tr>th {
    font-size: 10px;
    white-space: nowrap;
    text-align: center;
    background-color: #dcdcd9;
    padding: 1px 5px;
    border: 1px solid #B6BABF;
    text-shadow: 0 1px 1px #fff;
    font-weight: bold;
}

.MainTable>tbody>tr>td {
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    text-align: center;
    padding: 2px;
    padding-left: 5px;
    padding-right: 5px;
    border: 1px solid #D3D3D3;
}

.MainTable .nopadding {
    padding: 0;
}

table.MainTable .wide {
    width: 100%;
}

.MainTable>tbody>tr {
    background-color: #f2f5f9;
}

.MainTable>tbody>tr:hover {
    background-color: #F0EE92;
}

/* Monitoring table ==================================================================== */

table.MonitoringTable {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.MonitoringTable>tbody>tr>th {
    font-size: 10px;
    white-space: nowrap;
    text-align: center;
    background-color: #dcdcd9;
    padding: 1px 5px;
    border: 1px solid #B6BABF;
    text-shadow: 0 1px 1px #fff;
    font-weight: bold;
}

.MonitoringTable>tbody>tr>td {
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    text-align: center;
    padding: 0;
    border: 1px solid #D3D3D3;
    background-color: #f2f5f9;
}

table.MonitoringTable .wide {
    width: 100%;
}

/* Monitoring RxTx ==================================================================== */

.MonitoringTx {
    position: absolute;
    top:1px;
    left:1px;
    width:50px;
    height:61px;
    background-color:#6e6c66;
    text-align: center;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 -1px -1px #4b4a46;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

.MonitoringTx div {
    margin-top:11px;
}

div.MonitoringRx {
    position: absolute;
    bottom:1px;
    left:1px;
    width:50px;
    height:60px;
    background-color:#4e83a6;
    text-align: center;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 -1px -1px #31607f;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

.MonitoringRx div {
    margin-top:11px
}

/* Monitoring Dongles ==================================================================== */

.MonitoringDonglesAll {
    position: absolute;
    top:1px;
    left:1px;
    width:123px;
    height:15px;
    text-align: center;
    line-height: 15px;
    text-shadow: 0 1px 1px #fff;
    color: #4B4A46;
}

.MonitoringDonglesEncoding {
    position: absolute;
    top:17px;
    left:1px;
    width:123px;
    height:16px;
    text-align: center;
    line-height: 15px;
    border-radius: 2px;
    text-shadow: 0 1px 1px #fff;
    color: #189312;
}

.MonitoringDonglesConnected {
    position: absolute;
    top:1px;
    left:125px;
    width:122px;
    height:15px;
    text-align: center;
    line-height: 15px;
    text-shadow: 0 1px 1px #fff;
    color: #4E83A6;
}

.MonitoringDonglesError {
    position: absolute;
    top:17px;
    left:125px;
    width:122px;
    height:16px;
    background: url(/images/blink_red.gif);
    background-color: #ED1B24;
    text-align: center;
    line-height: 15px;
    color: white;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    text-shadow: 0 -1px -1px #6d0509;
}

.MonitoringDonglesActive {
    position: absolute;
    top:17px;
    left:125px;
    width:122px;
    height:16px;
    text-align: center;
    line-height: 15px;
    text-shadow: 0 1px 1px #fff;
    color: #5B509C;
}

/* BOARD TABLE ==================================================================== */

table.BoardTable {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.BoardTable>tbody>tr>td {
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    text-align: center;
    padding: 0;
    border: 0;
    vertical-align: top;
}

table.BoardTable .wide {
    width: 100%;
}


/* Module ==================================================================== */

.moduleContainer {
    background-color: #4b4a46;
    padding: 2px 1px 1px 1px;
    -padding: 2px 0px 0px 0px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    margin-bottom: 10px
}

.moduleContainerTitle {
    color: #eee;
    text-shadow: 0 -1px -1px #2c2b26;
    font-weight: bold;
    padding: 1px 5px 3px 7px;
}

.moduleContainerTitle .description {
    float: right;
    margin-left: 20px;
    font-weight: normal;
    color: #c1c1c1;
}

.moduleContainerContent {
    background-color: #f2f5f9;
}

.moduleContainerTestMode{
    background-color: #f2f5f9;
    display: inline-block;
    overflow-y: auto;
    overflow-x: auto;
    width: 100%;
    max-width: 100%;
    height: 325px;
    max-height: 325px;
    border: 1px solid #4b4a46;
    padding-top: 5px;
    margin-bottom: 10px;
}

.moduleContainerTestMode p{
    margin-left: 6px;
}

.moduleTestMode{
    display: inline-block;
}

.moduleContainerTable{
    width: 100%;
    display: inline-block;
    white-space: nowrap;
}

/* Graphs ==================================================================== */

.GraphTitle {
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px -1px #4b4a46;
    margin: 2px;
}

.fileUpload {
    position: relative;
    overflow: hidden;
    margin-top:10px ;

}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.swap_select{
    width: 100%;
}

.swap_button{
    margin-left: 20px;
}

/* Loading bar */

.LoadBar{
    position: fixed;
    top: 50%;
    left: 50%;
    border: 1px solid #000;
    padding: 10px 20px;
    display: inline; !important
    white-space: nowrap;
    background-color: #fff;
    height: 32px;
    width: 150px;
    margin-left: -95px;
    margin-top: -26px;
    display: none;
}

.LoadBar h3{
    position: relative;
    top:9px;
    left: 5px;
    font-size: 14px;
    color: #000000;
    white-space: nowrap;
    display: inline; !important;
    margin-left: 10px;

}

.ConfirmWindow{
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1;
    border: 1px solid #000;
    padding: 10px 20px;
    display: inline; !important
white-space: nowrap;
    background-color: #fff;
    min-height: 100px;
    min-width: 200px;
    margin-left: -120px;
    margin-top: -85px;
    display: none;
    background-color: #F0EE92;
    text-align: center;
}

.ConfirmWindow h3{
    margin-top: 20px;

}

.ConfirmWindow button{
    margin-top: 20px;
    margin-left: 10px;
}

.ActionBar
{
    position: relative;
    margin: 0px 5px;
}

.ActionBar a{
    cursor: pointer;
}

.ActionBar div{
    position: absolute;
    top: 12;
    right: 0;
    border: 1px solid #000;
    padding: 5px;
    white-space: nowrap;
    background-color: #fff;
    display: none;
    z-index: 1;
}

.AltBar
{
    position: relative;
    margin: 0px 5px;
}

.AltBar div{
    position: absolute;
    min-width: 300px;
    top: 0px;
    left: 45px;
    color: #444;
    border: 1px solid #000;
    padding: 5px;
    white-space: nowrap;
    background-color: #fff;
    display: none;
    z-index: 1;
}



/* Text format ============================================================= */

.error-text{
    margin: 5px;
    color: red;

}

.networkInfoTable{
    text-align: center;
    border-collapse: collapse;
    border: 1px solid #aaa;
}

.networkInfoTable th {
    border: 1px solid #aaa;
}

.networkInfoTable td {
    border: 1px solid #aaa;
}