﻿.dont-break-out {
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    /*word-break: break-all;*/
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
    width: 200px;
    text-align:justify;
    margin-right:20px;
}

.healthback {
    background-image: url("../images/icons/pipe-vert.png");
    background-repeat: repeat-y;
    background-position:7px;
}

.burstback {
    background-image: url("../images/icons/burst-vert.png");
    background-repeat: repeat-y;
    background-position: 10px;
}

.modalBackground {
    background-color: Black;
    filter: alpha(opacity=50);
    opacity: 0.3;
}

.modalPopup {
    background-color: #e5f3f9;
    border-width: 3px;
    border-style: solid;
    border-color: black;
    padding-top: 10px;
    padding-left: 10px;
    width: 600px;
    height: 400px;
}

.modalPopupAlarm {
    background-color: #e5f3f9;
    border-width: 3px;
    border-style: solid;
    border-color: black;
    padding-top: 10px;
    padding-left: 10px;
    width: 1000px;
    height: 650px;
}

.radiobtn input[type="radio"] {
    margin-right: 10px;
    margin-left: 10px;
    white-space:nowrap;
}
    /*----------------------------------------------------------------- Gridviews and tables*/
    /*Container to put table in if required*/
    .table-cont {
    clear: both;
    width: 100%;
    margin-top: 20px;
    background: #fff;
    padding: 15px;
    width: 880px;
}

/*All tables*/
/*
table tr, table td {
    border-bottom: solid 1px #d9dee4;
}
*/
table tr:hover {
    /*background: #e5f3f9;*/
}

table a {
    color: #1684b0;
}

/*Gridviews*/

table.grid tr th {
    text-align: left;
    padding: 9px 10px 5px 10px;
    font-weight: normal;
}

table.grid th {
    background: #e5f3f9;
    border-bottom: solid 1px #979797;
}

table.grid tr td {
    padding: 5px 10px;
}

.module table {
    width: 100%;
    text-align: right;
}

    .module table td {
        padding: 4px 10px 3px 10px;
    }

/*classes added by JS*/
.module td.align-left, table.align-left {
    text-align: left;
}

tr.alt-row {
    background: #efefef;
    background: #fff;
}

div.align-center {
    text-align: center;
}

/*Cell contents*/

/*img in a cell?*/
table.grid tr img {
    vertical-align: middle;
    margin: 0 5px 0 0;
}

/*img in a thead?*/
table.grid tr.thead img {
    vertical-align: middle;
}

a.value {
    color: green;
    margin: 0 10px;
}

    a.value:hover,
    .green {
        color: green
    }

.red {
    color: red;
}

table.grid td.email,
table.grid th.email {
    width: 90px !important;
}

table.grid td.pcode,
table.grid th.pcode {
    width: 20px !important;
}

table.report tr th, table.report tr td {
    padding-left: 5px;
    padding-right: 5px;
}

/*Pagination*/
table tr.pager tr {
    border: 0;
}

.pagination {
    clear: both;
    position: relative;
    background: #e5f2f8;
    padding: 10px 12px;
}

/*A-Z navigation*/
.az {
    clear: both;
    margin-bottom: 35px;
}

    .az ul li {
        float: left;
    }

    .az a {
        padding: 3px 8px;
        float: left;
        border: solid 1px #EFEFEF;
        text-align: center;
        margin-right: 6px;
        text-transform: capitalize;
        font-size: .9em;
    }

        .az a.selected {
            background: #ececec;
            border-color: #ccc;
            color: #000;
        }

        .az a:hover {
            color: #246784;
            text-decoration: none;
            border: solid 1px #246784;
            background: #E5F3F9;
        }

span.trans-no {
    color: #686767
}

/*No data Message*/

.no-data {
    width: 100%;
    padding: 10px 0;
    text-align: center;
    float: left;
    clear: both;
}
