/*   ======
     COLORS
     ====== */

    @white: #FFFFFF;
    @snow: #FBFBFB;
    @platinum: #E4E4E4;
    @quick-silver: #A5A5A5;
    @outer-space: #4A4A4A;
    @true-blue: #0070C9;
    @lava: #CF0A2C;
    @pre-code: rgba(233, 234, 236, 0.5);
    @pre-select: #CCC;

/*  ===============
    GLOBAL SETTINGS
    =============== */

* {
    margin: 0;
    padding: 0;
    font: 14px Roboto, Arial, sans-serif;
    color: #4A4A4A;
    text-align: left;
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    outline: 0;
    text-decoration: none;
}

html { /* cross-browser text rendering */
    overflow-x: hidden;
    overflow-y: scroll !important; /* always display scrollbar */
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    font-variant-ligatures: none;
    -webkit-font-variant-ligatures: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

body {
    height: 100%;
    min-height: 100%; /* fixes jQuery scrollTop issues in firefox */
    text-align: center;
}

header {
    width: 100%;
    height: 50px; /* cross-browser matching */
    display: table; /* fixes resizing issue */
    border-bottom: 2px solid #E4E4E4;
    text-align: center;
}

.headerContent,
.pageContent,
ul.breadCrumbs {
    min-width: 950px;
    max-width: 80%;
    margin: 0 auto;
    text-align: center;
}

.headerContent,
.pageContent {
    padding: 0 20px;
    text-align: center;
}

.headerContent {
    padding-top: 13px;
}

.pageContent {
    margin: 50px auto auto auto;
    padding-bottom: 50px;
    text-align: center;
}

a.oarnetLogo {
    width: 35px;
    height: 35px;
    position: relative; /* needed for cursor events */
    cursor: pointer;
    float: left;
    z-index: 1000;
    background: url(../img/oarnet.svg) center no-repeat;
}

.pageTitle {
    float: left;
    margin: -29px 0 0 45px; /* align with logo */
    font-size: 22px;
    color: #4A4A4A;
}

@media screen and (max-width: 1200px) {
    .pageTitle { /* hide page title on narrow window  */
        display: none;
    }
}

ul {
    list-style-type: none;
    list-type: none;
}

ul li a,
ul li a:link,
ul li a:visited {
    display: inline-block;
    color: #4A4A4A;
    text-align: center;
}

p.tableIntro {
    float: left;
    clear: left;
    margin-bottom: 10px;
    font-weight: 500;
}

strong {
    font-weight: 700;
}

.underline {
    text-decoration: underline;
}

table {
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
}

table tr {
    border-bottom: 1px solid #E4E4E4;
}

table tr:last-child {
    border-bottom: 2px solid #E4E4E4;
}

table tr th {
    font-weight: 500;
    background: #FBFBFB;
    border-top: 2px solid #E4E4E4;
    border-bottom: 2px solid #E4E4E4;
}

table tr th,
table tr td {
    padding: 13px 5px 12px 25px;
}

table:not(.clientInfo) tr th,
table:not(.clientInfo) tr td {
    height: 42px; /* fixes table row heights with icons */
}

table:not(.clientInfo) tr th:last-child {
    padding-right: 25px;
}

table td {
    border-bottom: 1px solid #E4E4E4;
}

table tr:last-child td {
    border-bottom: none;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

.float-none {
    float: none !important;
}

.center {
    text-align: center;
}

.block {
    display: block;
}

.inline {
    display: inline;
}

.inline-block {
    display: inline-block;
}

.inline-flex {
    display: inline-flex;
}

.table {
    display: table;
}

.inline-table {
    display: inline-table;
}

.fixed-table {
    table-layout: fixed;
}

ul.inline li {
    display: inline;
}

.top-align,
table.top-align tr,
table.top-align td {
    vertical-align: top;
}

.bottomPadding {
    padding-bottom: 25px;
}

.sidePadding {
    padding-left: 15px;
    padding-right: 15px;
}

.rightPadding {
    padding-right: 15px;
    }

.leftPadding {
    padding-left: 15px;
}

.hidden {
    display: none;
}

.opacity {
    opacity: 0;
}

.inactive {
    color: #CCC;
}

.capital {
    text-transform: capitalize;
}

.lowercase {
    text-transform: lowercase;
}

.small {
    font-size: 14px !important;
    color: #A5A5A5;
}

span.greater:before {
    padding: 8px;
    content: ">";
}

.noClick:hover {
    cursor: pointer; /* still show pointer on unclickable links */
}

.noWrap {
    white-space: nowrap;
}

.noClear {
    clear: none !important;
}

.clear-left {
    clear: left !important;
}

.clear-right {
    clear: right !important;
}

.clear-both {
    clear: both;
}

table tr.addAnother,
table tr.addAnother td {
    background: #FFFFFF;
    border-bottom: none;
}

.blue,
a.blueLink,
a.blueLink:link,
a.blueLink:active,
a.blueLink:visited {
    color: #0070C9;
}

a.blueLink:hover {
    color: #000;
    cursor: pointer;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.red,
a.red,
a.red:link,
a.red:active,
a.red:visited,
tr.blank_required td {
    color: #CF0A2C !important; /* matches logo red */
}

input {
    height: 30px;
    background: #FBFBFB;
    border-radius: 3px;
    border: 1px solid #E4E4E4;
    -moz-appearance: none; /* disable default styling (older firefox) */
    -webkit-appearance: none; /* disable default style (safari, chrome) */
    appearance: none; /* disable default style (rest) */
}

input:hover,
input:focus {
    cursor: auto;
    outline: none;
}

input[type="submit"]:hover {
    border-color: #4A4A4A;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
    cursor: pointer;
}

:disabled:hover,
.disabled {
    cursor: not-allowed !important;
}

/*  ========
    MAIN NAV
    ======== */

nav {
    height: 50px;
    position: relative;
    text-align: right;
}

.nav:after,
.nav:before {
    display: table;
    content: " ";
}

.nav:after {
    clear: both;
}

.nav {
    display: inline-block;
}

.nav > li {
    padding-top: 12px;
    float: left;
}

.nav > li > a,
.nav > li > a:active,
.nav > li > a:link {
    color: #4A4A4A;
    font-weight: 500;
}

.nav > li > a:hover {
    color: #0070C9;
    -webkit-transition: color .2s ease-out;
    transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}

.arrowDown {
    border: solid #4A4A4A;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
    margin: 0 0 3px 4px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

nav a:hover .arrowDown {
    border: solid #0070C9;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
    margin: 0 0 3px 4px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

ul.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

ul.nav > li > a {
    height: 38px; /* fixes rollover for dropdown */
    position: relative;
    display: block;
    padding: 0 25px;
    margin: 0 -12px; /* combine with padding to fix rollover dropdown issue */
}

ul.nav > li > a.disabled,
ul.nav > li > a:disabled,
ul.nav > li > a:link.disabled,
ul.nav > li > a.disabled:hover,
ul.nav > li > a:disabled:hover,
ul.nav > li > a:link.disabled:hover {
    color: #4A4A4A !important;
    opacity: .3;
}

ul.dropdownMenu {
    width: 150% !important; /* extends menu to window width */
    visibility: hidden; /* keep closed by default */
    position: absolute;
    top: 100%;
    right: -16%;
    left: auto;
    padding: 20px 0px;
    z-index: 998;
    background: #FFFFFF;
    border-top: 2px solid #E4E4E4;
    border-bottom: 2px solid #E4E4E4;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    text-align: right;
}

.dropdown:hover ul.dropdownMenu {
    visibility: visible; /* show nav on parent hover */
}

li.column ul {
    float: right;
    position: relative;
    min-height: 1px;
    padding: 0;
    margin: 0;
}

li.column a {
    padding: 4px 5px;
    color: #4A4A4A;
    font-weight: 400;
}

li.column a:hover {
    color: #0070C9;
}

li.column {
    width: auto;
    padding: 0 20px;
    display: inline-flex;
    text-align: left;
}

li.column:last-child {
    margin-right: 10%;
    padding-right: 0;
}

li.columnHeader {
    margin-bottom: 2px;
    padding: 5px 60px 5px 5px;
    font: 500 16px/18px Roboto;
    color: #4A4A4A;
}

/*  =======
    SUB NAV
    ======= */

ul.nav.subnav { /* adjustments for right border */
    height: 38px;
    margin-bottom: 12px;
    border-right: 2px solid #E4E4E4;
}

ul.nav.subnav li a {
    height: 38px;
}

/*  ======================
    SUB NAV - CURRENT PAGE
    ====================== */

body#roles a#roles_link,
body#contacts a#contacts_mainlink,
body#users a#users_mainlink,
body#services a#stats_mainlink {
    color: #0070C9;
}

/*  ==============================
    REPORTS SUB NAV - CURRENT PAGE
    ============================== */

body#active_user_report a#dashboard_mainlink,
body#client_editor_report a#dashboard_mainlink,
body#missing_roles_report a#dashboard_mainlink,
body#missing_contact_info_report a#dashboard_mainlink,
body#missing_address_report a#dashboard_mainlink,

body#dashboard a#dashboard_mainlink,
body#client_report a#client_report_mainlink,
body#contact_report a#contact_report_mainlink,
body#site_report a#site_report_mainlink,
body#location_report a#location_report_mainlink,
body#totals_report a#totals_report_mainlink,

body#save_client_report a#client_report_mainlink,
body#save_contact_report a#contact_report_mainlink,
body#save_site_report a#site_report_mainlink,
body#save_location_report a#location_report_mainlink,
body#save_totals_report a#totals_report_mainlink {
    color: #0070C9;
}

/*  ===========
    BREADCRUMBS
    =========== */

.breadCrumbsContent {
    width: 100%;
    margin: 0 auto;
    display: table; /* fixes resizing issue */
    text-align: center;
    background: #FBFBFB;
    border-bottom: 1px solid #E4E4E4;
}

ul.breadCrumbs {
    margin: 0 auto;
    padding: 13px 20px;
    overflow-x: hidden; /* prevent wrapping in narrow window */
}

ul.breadCrumbs > li {
    display: inline;
}

ul.breadCrumbs > li+li:before {
    padding: 8px;
    content: "/";
    font-weight: bold;
}

ul.breadCrumbs > li > a {
    color: #0070C9;
}

ul.breadCrumbs > li > a:hover {
    color: #000;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

/*  ========
    TOOLTIPS
    ======== */

.tooltip { /* create icon with pure CSS */
    display: inline-block;
    position: relative;
    border: 1.9px solid #A5A5A5;
    border-radius: 50%;
    width: 14px; /* width of circle */
    height: 14px; /* height of circle */
    line-height: 16px; /* center '?' within circle */
    font-family: sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    color: #A5A5A5;
    -webkit-transition: all .4s ease-out; /* color & border */
    -moz-transition: all .4s ease-out; /* color & border */
    -o-transition: all .4s ease-out; /* color & border */
    transition: all .4s ease-out; /* color & border */
}

.tooltip:before { /* use a character for the icon */
    content: "?";
}

.tooltip:hover {
    color: #4A4A4A;
    border-color: #4A4A4A;
    cursor: pointer;
}

.tooltipText { /* popup message */
    visibility: hidden; /* hide until tooltip hover */
    z-index: 1; /* overlay on all other content */
    width: 225px; /* message width */
    display: block;
    position: absolute;
    right: 0;
    padding: 14px 16px; /* large padding for legibility */
    background: #FBFBFB;
    border: 1px solid #4A4A4A;
    border-radius: 3px;
    color: #4A4A4A;
    text-align: left;
    line-height: 20px;
}

th.editRoles .tooltip { /* tooltips in 'Edit' th */
    margin-left: 10px;
}

.tooltip:hover .tooltipText {
visibility: visible; /* show message on tooltip hover */
    -webkit-transition-delay: .1s; /* slight delay showing message */
    -moz-transition-delay: .1s; /* slight delay showing message */
    -o-transition-delay: .1s; /* slight delay showing message */
    transition-delay: .1s; /* slight delay showing message */
}

.tooltipText:after { /* arrow */
    content: '';
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    background: #FBFBFB;
}

/*  ================
    TOOLTIP MESSAGES
    ================ */

.right-message { /* show message right of tooltip */
    transform: translateY(-50%) translateX(107%);
    top: 50%;
}

.left-message { /* show message left of tooltip */
    transform: translateY(-50%) translateX(-12%);
    top: 50%;
}

.top-message { /* show message above tooltip */
    transform: translateY(-117%) translateX(50%);
}

.bottom-message { /* show message below tooltip */
    transform: translateY(8%) translateX(50%);
}

/*  ==============
    TOOLTIP ARROWS
    ============== */

.right-arrow:after { /* arrow for .right-message */
    top: calc(50% - 5px);
    left: -6px;
    border-left: 1px solid #4A4A4A;
    border-top: 1px solid #4A4A4A;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.left-arrow:after { /* arrow for .left-message */
    top: calc(50% - 5px);
    right: -6px;
    border-right: 1px solid #4A4A4A;
    border-bottom: 1px solid #4A4A4A;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.top-arrow:after { /* arrow for .top-message */
    top: calc(100% - 5px);
    left: calc(50% - 13px);
    border-left: 1px solid #4A4A4A;
    border-top: 1px solid #4A4A4A;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(225deg);
}

.bottom-arrow:after { /* arrow for .bottom-message */
    top: calc(0% - 6px);
    right: calc(50% + 2px);
    bottom: -7px;
    border-left: 1px solid #4A4A4A;
    border-top: 1px solid #4A4A4A;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

/*  ===========
    NOTES ICONS
    =========== */

td.notes .tooltip { /* hide '?' icon */
    z-index: 1;
    font-size: 0;
    color: transparent;
    border: none;
 }

td.notes .bottom-message { /* lower popup message */
    transform: translateY(25%) translateX(50%);
}

td.notes .tooltipText { /* shorten width */
    width: 145px;
}

.notes-icon:hover .tooltipText {
    visibility: visible; /* show message on tooltip hover */
    -webkit-transition-delay: .1s; /* slight delay showing message */
    -moz-transition-delay: .1s; /* slight delay showing message */
    -o-transition-delay: .1s; /* slight delay showing message */
    transition-delay: .1s; /* slight delay showing message */
 }

.client_emergency,
.site_emergency,
.oarnet-managed,
.site_optout,
.contacts_complete,
.contacts_incomplete,
.notes .role-yes,
.notes .role-no {
    width: 16px;
    height: 16px;
    margin-right: 5px; /* space out icons */
    background-size: 16px 16px;
    float: left; /* remove spacing if an icon isn't displayed */
    cursor: pointer;
 }

.client_emergency {
    background-image: url('../img/icon_emergencyclient.svg');
 }

.site_emergency {
    background-image: url('../img/icon_emergencysite.svg');
 }

.oarnet-managed {
    background-image: url('../img/icon_oarnetmanaged.svg');
 }

.site_optout {
    background-image: url('../img/icon_noafterhours.svg');
 }

 .contacts_complete {
    background-image: url('../img/icon_contacts-complete.svg');
}

 .contacts_incomplete {
    background-image: url('../img/icon_contacts-incomplete.svg');
}

/*  ===========
    TABLE ICONS
    =========== */

a.actionIcons svg {
    width: 18px;
    height: 18px;
    background-size: 18px 18px;
    display: inline-block;
}

a.actionIcons svg {
    opacity: .5; /* lower until hover */
}

a.actionIcons:first-child {
    margin-right: 8px;
}

a.actionIcons.single:first-child {
    margin-right: 0;
}

a.actionIcons:hover svg {
    opacity: 1; /* increase opacity on hover */
    -webkit-transition: opacity .4s ease-out;
    -moz-transition: opacity .4s ease-out;
    -o-transition: opacity .4s ease-out;
    transition: opacity .4s ease-out;
}

svg.edit {
    background-image: url('../img/edit.svg');
}

svg.delete {
    background-image: url('../img/delete.svg');
}

/* =====================
 * USER TABLE ROLE ICONS
 * ===================== */

td.user-role .tooltip { /* hide '?' icon */
    width: 18px;
    height: 18px;
    background-size: 18px 18px;
    display: inline-block;
    font-size: 0;
    color: transparent;
    border: none;
 }

td.user-role .bottom-message { /* lower popup message */
    transform: translateY(25%) translateX(50%);
}

td.user-role .tooltipText { /* shorten width */
    width: 145px;
}

.roleIcons:hover .tooltipText {
    visibility: visible; /* show message on tooltip hover */
    -webkit-transition-delay: .1s; /* slight delay showing message */
    -moz-transition-delay: .1s; /* slight delay showing message */
    -o-transition-delay: .1s; /* slight delay showing message */
    transition-delay: .1s; /* slight delay showing message */
 }

.role-yes {
    background-image: url('../img/role-yes.svg');
}

.role-no {
    background-image: url('../img/role-no.svg');
}

/*  ========================
    TABLE SHOW/HIDE ARROWS
    ======================== */

table a.clickSection { /* larger clickable area */
    width: 30px;
    height: 15px;
}

.tableArrow {
    border: solid;
    border-color: #0070C9;
    margin: 5px 0 0 5px;
    padding: 2px; /* match size of main nav arrows */
    display: inline-block;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

table td .openArrow {
    border-width: 0 2px 2px 0;
}

table td .closeArrow {
    border-width: 2px 0 0 2px;
}

table td a.clickSection:hover > .tableArrow { /* hover on .clickSection to dark arrow */
    border-color: #4A4A4A;
}

/*  ===========
    SEARCH ICON
    =========== */

span.searchIcon {
    width: 6px;
    height: 6px;
    top: 20px; /* align with search bar text */
    margin-left: 470px; /* set within the right side of search bar */
    position: relative;
    display: inline-block;
    float: left;
    background: #fff;
    border: 2px solid #E4E4E4;
    border-radius: 30px;
}

span.searchIcon:after {
    content: "";
    width: 6px;
    height: 2px;
    top: 7px;
    left: 5px;
    position: absolute;
    background: #E4E4E4;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}

/*  ===========
    ALL CLIENTS
    =========== */

table.allClients tr td a:active,
table.allClients tr td a:hover {
    color: #000;
    cursor: pointer;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

table.allClients tr td:nth-child(1) { /* 'CN' column */
    min-width: 150px;
}

table.allClients tr td:nth-child(2) { /* 'Client / Client(Agency)' column */
    min-width: 300px;
}

table.allClients tr td:nth-child(3) { /* 'Client Rep' column */
    min-width: 165px;
}

table.allClients tr td:nth-child(4) { /* 'Client Type' column */
    min-width: 145px;
}

.dataTables_wrapper .dataTables_filter input[type="search"] {
    width: 500px;
    height: 32px; /* needed for firefox */
    padding: 0 15px;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid #E4E4E4;
    font-size: 16px;
    outline: none;
}

.dataTables_wrapper .dataTables_filter input[type="search"]:hover,
.dataTables_wrapper .dataTables_filter input[type="search"]:focus {
    border-bottom-color: #4A4A4A;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

table.allClients a.clickSection {
    margin-left: -30px; /* compensate for show/hide arrow */
}

.indent {
    margin-left: 10px;
}

/*  =========================
    ALL LOCATIONS - NON-OHGOV
    ========================= */

table.allLocations.non-ohgov.datatable tbody tr td:nth-child(1) a.blueLink {
    word-break: break-word; /* only way table will fit within responsive container */
    white-space: normal !important;
}

table.allLocations.non-ohgov.datatable thead tr th.sorting:nth-child(3),
table.allLocations.non-ohgov.datatable thead tr th.sorting_asc:nth-child(3),
table.allLocations.non-ohgov.datatable thead tr th.sorting_desc:nth-child(3) { /* 'CN' column */
    min-width: 100px;
}

table.allLocations.non-ohgov.datatable thead tr th.sorting:nth-child(4),
table.allLocations.non-ohgov.datatable thead tr th.sorting_asc:nth-child(4),
table.allLocations.non-ohgov.datatable thead tr th.sorting_desc:nth-child(4) { /* 'Client' column */
    min-width: 100px;
}

table.allLocations.non-ohgov.datatable thead tr th.sorting:nth-child(5),
table.allLocations.non-ohgov.datatable thead tr th.sorting_asc:nth-child(5),
table.allLocations.non-ohgov.datatable thead tr th.sorting_desc:nth-child(5) { /* 'Address' column */
    min-width: 100px;
}

table.allLocations.non-ohgov.datatable thead tr th.sorting:nth-child(6),
table.allLocations.non-ohgov.datatable thead tr th.sorting_asc:nth-child(6),
table.allLocations.non-ohgov.datatable thead tr th.sorting_desc:nth-child(6) { /* 'County' column */
    min-width: 80px;
}

/*  =====================
    ALL LOCATIONS - OHGOV
    ===================== */

table.allLocations.ohgov.datatable thead tr th.sorting:nth-child(2),
table.allLocations.ohgov.datatable thead tr th.sorting_asc:nth-child(2),
table.allLocations.ohgov.datatable thead tr th.sorting_desc:nth-child(2) { /* 'CN' column */
    min-width: 100px;
}

table.allLocations.ohgov.datatable thead tr th.sorting:nth-child(4),
table.allLocations.ohgov.datatable thead tr th.sorting_asc:nth-child(4),
table.allLocations.ohgov.datatable thead tr th.sorting_desc:nth-child(4) { /* 'Client' column */
    min-width: 100px;
}

table.allLocations.ohgov.datatable thead tr th.sorting:nth-child(5),
table.allLocations.ohgov.datatable thead tr th.sorting_asc:nth-child(5),
table.allLocations.ohgov.datatable thead tr th.sorting_desc:nth-child(5) { /* 'Address' column */
    min-width: 100px;
}

table.allLocations.ohgov.datatable thead tr th.sorting:nth-child(6),
table.allLocations.ohgov.datatable thead tr th.sorting_asc:nth-child(6),
table.allLocations.ohgov.datatable thead tr th.sorting_desc:nth-child(6) { /* 'County' column */
    min-width: 80px;
}


/*  ================
    LOCATIONS DETAIL
    ================ */

body#locations table.locations,
body#locations_ohgov table.locations {
    margin-top: -10px; /* align with global contentHeader dropdown */
    margin-bottom: 40px; /* only one table.clientInfo per page */
}

body#locations_ohgov table.locations div.chosen-container {
    min-width: 250px; /* increase default dropdoown width */
}

/*  =====
    ROLES
    ===== */

div.contentHeader div.chosen-drop,
div.contentHeader a.chosen-single {
    min-width: 700px;
    background: #FBFBFB;
    border: 1px solid #E4E4E4;
}

td.clientLocation div.chosen-drop,
td.clientLocation a.chosen-single {
    min-width: 200px;
}

.selectClient {
    margin-top: 5px;
    float: left;
}

table.clientInfo {
    width: auto;
    float: none;
    text-align: left;
}

table.clientInfo:not(:first-child) {
    margin-bottom: 40px; /* handles multiple clientInfo tables */
}

table.clientInfo tr {
    border-bottom:none;
}

table.clientInfo tr th,
table.clientInfo tr td {
    padding: 5px 0;
    border: none;
}

table.clientInfo tr:nth-child(even) {
    background: #FFFFFF;
}

table.clientInfo tr {
    height: 35px; /* space out rows evenly with client dropdown */
}

table.clientInfo tr td:first-child {
    width: 85px;
}

table.clientInfo tr td span.primary { /* 'Client's Primary Site' note */
    padding-left: 5px;
}

label[for="selectClientLabel"] {
    width: 75px;
    float: left;
    font-weight: 700;
}

td.selectLabel {
    margin-top: 5px;
    font-weight: 700;
}

table.clientInfo a.chosen-single,
table.clientInfo .chosen-container.chosen-with-drop .chosen-drop { /* 'Location' menu for the .clientInfo table */
    margin-left: -7px;
    width: 100%;
}

.contentHeader div.chosen-container:not(.clientInfo) {
    position:relative;
    left:3px;
    bottom: 5px;
}

body#roles table.info_table.clientInfo.notAddAnother tbody tr td a {
    color: #0070C9; /* 'Missing Address' link */
}

body#roles table.info_table.clientInfo.notAddAnother tbody tr td a:hover {
    color: #000; /* 'Missing Address' link hover */
}

p.tableIntro + .tooltip,
p.opt-out + .tooltip { /* tooltip right next to p */
    margin-left: 10px;
}

p.opt-out {
    float: left;
    clear: left;
    margin-bottom: 10px;
    font-weight: 400;
}

label[for=opt-out] {
    margin: auto 2px auto 15px;
}

tr.inherited td { /* gray out inherited contacts */
    color: #A5A5A5;
}

table.clientRequiredRoles tr,
table.clientOptionalRoles tr,
table.oarnetRoles tr {
    height: 42px; /* works like min-height for table tr */
}

table.clientRequiredRoles tr td:nth-child(1),
table.clientOptionalRoles tr td:nth-child(1) { /* hardset 'Role' column & prevent wrapping */
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
}

th.editRoles { /* hardset 'Edit' column & prevent wrapping */
    width: 65px !important;
    min-width: 65px !important;
    max-width: 65px !important;
}

table.clientRequiredRoles td:first-child .tooltip, /* tooltips next to 'Role' td */
table.clientOptionalRoles td:first-child .tooltip {
    margin-right: 30px;
}

table.clientRequiredRoles tbody:first-of-type tr:nth-last-child(1) td, /* last row in first tbody above .addAnother */
table.clientOptionalRoles tbody:first-of-type tr:nth-last-child(1) td {
    border-bottom: 2px solid #E4E4E4;
}

table.oarnetRoles tr:last-child td {
    border-bottom: 2px solid #E4E4E4;
}

.hasAddAnother { /* if table has 'Add Another' (roleTables.js) */
    margin-bottom: 66px;
}

#roles table:not(.clientInfo).notAddAnother { /* if table doesn't have 'Add Another' and isn't in .clientInfo ('roleTables.js) */
    margin-bottom: 108px;
}

/*  =======
    OPT-OUT
    ======= */

.opt-out p {
   margin: 5px auto 20px auto;
}

span.paragraph {
    font-size: 17;
    line-height: 1.5;
}

span.h3 {
    font-size: 18px;
    line-height: 22px;
}

span.list {
    font-size: 17px;
    line-height: 1.5;
}

.normal {
    font-weight: normal;
}

.block {
    display: block;
}

.fourHundred,
p.fourHundred {
    font-weight: 400;
}

.fiveHundred {
    font-weight: 500;
}

.sevenHundred {
    font-weight: 700;
}

/*  ===============
    OPT-OUT MESSAGE
    =============== */

/*  ========
    CONTACTS
    ======== */

table.clientContacts tbody:first-of-type tr:nth-last-child(1) td { /* last row in first tbody above .addAnother */
    border-bottom: 2px solid #E4E4E4;
}

/*  ===================
    DELETE CONFIRMATION
    =================== */

input#cancel,
input#not_editor {
    float: left; /* prevent two submits from floating right */
    clear: left; /* if link is in the way */
}

/*  =====
    USERS
    ===== */

.noClientInfo { /* use when .clientInfo div isn't needed */
    padding-top: 50px;
}

th.userEmail .tooltip,
th.editGateway .tooltip,
th.assignedRole .tooltip,
th.deleteUser .tooltip {
    margin-left: 10px;
}

th.deleteUsers {
    width: 55px;
}

.clientUsers a.actionIcons:first-child {
    text-align: center;
}

th.assignedRole,
.clientUsers td:nth-child(5) { /* 'Assigned Role' column */
    margin: 0 auto;
    padding-left: 0; /* center in column */
    text-align: center;
}

.clientUsers td:nth-child(6) { /* if 'Delete' column exists */
    margin: 0 auto;
    padding-left: 0; /* center in column */
    text-align: center;
}

table.clientUsers tr:last-child td {
    border-bottom: 2px solid #E4E4E4;
}

/*  =====================
    USERS - Editor Status
    ===================== */

form#add_admin input[type="radio"] {
  opacity: 0;
}

form#add_admin .radioLabel:first-of-type {
    margin-right: 40px;
}

form#add_admin label:hover {
    cursor: pointer;
}

form#add_admin input[type="radio"] + .radioLabel:before {
    content: "";
    background: #FBFBFB;
    border-radius: 100%;
    border: 2px solid #E4E4E4;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    position: relative;
    top: -0.2em;
    margin-right: 1em;
    vertical-align: top;
    text-align: center;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    transition: .2s ease-out;
}

form#add_admin input[type="radio"]:checked + .radioLabel:before {
    background-color: #0070C9;
    box-shadow: inset 0 0 0 4px #F4F4F4;
}

form#add_admin input[type="radio"]:focus + .radioLabel:before {
    outline: none;
    border-color: #0070C9;
}

form#add_admin input[type="radio"] + .radioLabel:empty:before {
    margin-right: 0;
}

/*  =====
    STATS
    ===== */

body#services tr.notStats {
    display: none;
}

div.servicesWrapper table.dataTable tr th:nth-child(1),
div.servicesWrapper table.dataTable tr td:nth-child(1) {
    width: 20% !important;
}

a#back_button { /* appear inactive on load */
    color: #4A4A4A;
}

a#back_button:hover { /* appear inactive on load */
    cursor: default;
}

a#back_button.activate, /* post-click blue link */
a.service_link {
    color: #0070C9;
    cursor: pointer;
}

a#back_button.activate:hover,
a.activate:hover,
a.service_link:hover {
    color: #000;
}

.services_detail_button { /* similar to .arrowDown */
    margin-top: 5px;
    padding: 3px;
    position: absolute;
    left: 150;
    z-index: 998;
    border: solid #0070C9;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    -webkit-transform: rotate(-45deg);
}

.services_detail_button:hover {
    border-color: #000;
    cursor: pointer;
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}

.services_table .checkboxLabel {
    margin-top: -3px !important; /* align within table row */
    margin-right: 50px;
    float: right;
}

table.filters {
    width: 100%;
    border-top: 2px solid #E4E4E4;
    border-bottom: 2px solid #E4E4E4;
}

table.inline-table thead {
    width: 100%; /* prevent wrapping in firefox */
    background: #FBFBFB;
}

table.inline-table tr {
    margin-left: 3%;
    margin-left: 0;
    float: left;
    border: none;
}

table.inline-table tr:nth-child(1) {
    margin-left: 0;
}

table.filters td {
    border: none;
    font-weight: bold;
}

@media screen and (min-width: 1200px) {
    table.filters tr th:not(:first-child),
    table.filters tr td:not(:first-child) {
        padding: 13px 15px 12px 15px; /* less margin-left except first td */
    }
}

@media screen and (max-width: 1200px) { /* keep filters on one line */
    table.filters tr th:not(:first-child),
    table.filters tr td:not(:first-child) {
        padding: 13px 5px 12px 5px;
    }
}

table.filters .chosen-single,
table.filters .chosen-drop,
table.filters .chosen-container-single .chosen-single span {
    overflow: visible !important; /* don't cut off text within dropdown */
}

table.legend {
    width: auto;
    margin-top: -5px; /* set right below filters */
    margin-bottom: -15px; /* move up chart */
    float: right;
}

table.legend tbody {
    width: 575px;
}

table.legend tr.no-left-margin {
    margin-left: 0;
}

table.legend tr.legend-separator {
    margin-top: -17px; /* set right below graph filters */
    margin-left: 10px;
    margin-right: 10px;
}

table.legend tr.legend-separator td {
    font-size: 40px;
    color: #E4E4E4;
    font-weight: 100;
    text-align: center;
}

table.legend td {
    border: none;
}

td.key img {
    border: 0;
    outline: none;
}

td.key img.icon { /* browser hack to hide PNG borders */
    width: 18px;
    height: 0;
    margin: 2px 0 0 0;
    padding: 10px 0px;
    background-size: 18px 18px;
    background-repeat: no-repeat;
    border: none;
}

td.key img.line_blue {
    background-image: url(../img/line_blue.png);
}

td.key img.line_green {
    background-image: url(../img/line_green.png);
}

td.key img.drops_blue {
    background-image: url(../img/drops_blue.png);
}

td.key img.drops_green {
    background-image: url(../img/drops_green.png);
}

td.key img.legend_arrow {
    background-image: url(../img/legend_arrow.png);
}

#bigchart {
    width: 100%;
    height: 50%;
    display: none; /* hide until selected */
}

#big_chart img {
    width: 100%;
    margin: 0 auto;
}

#modal { /* graph 'Loading' message */
    width: 100%;
    margin: 50px 0 -50px 0; /* remove space between modal and graph */
    float: left;
    z-index: 999;
    font-size: 28px;
    text-align: center;
}

.nvtooltip {
    padding: 5px 20px !important;
    font-family: inherit !important;
    background: rgba(251,251,251, 0.9);
    border: 1px solid #4A4A4A !important;
    border-radius: 3px !important;
}

.nvtooltip table:not(.clientInfo) tr th,
.nvtooltip table:not(.clientInfo) tr td {
    height: auto !important;
}

.nvtooltip table tr,
.nvtooltip table td {
    border-bottom: none !important;
}

.nvtooltip table td.key {
    padding-top: 10px; /* td alignment */
}

.nvtooltip table td.value {
    padding-top: 16px; /* td alignment */
}

.nvtooltip td.key img.icon {
    height: 18px;
    width: 18px;
    margin-bottom: -13px; /* td alignment */
    margin-left: 7px;
    margin-right: 7px;
}

.xy-tooltip {
    position: fixed !important; /* override absolute position */
}

.legend-color-icon-size {
    height: 18px;
    width: 18px;
    margin-top: 12px; /* td alignment */
}

td.legend-color-guide div { /* shown drops in tooltip popup */
    margin-top: 12px; /* td alignment */
    margin-left: 1px;
}

/*  =======================
    REPORTS GLOBAL SETTINGS
    ======================= */

span.topNote {
    margin-top: -35px; /* set right below breadCrumbs */
}

div.tableFilters p {
    padding-top: 5px; /* align with button text */
}

div.tableFilters { /* filter buttons */
    position: relative;
    top: 38px;
    z-index: 997; /* allow main nav to cover if needed */
    clear: both;
}

div.tableFilters .chosen-container-single .chosen-single {
    height: 30px;
    padding: 6px 0 0 10px;
}

a.resetFilters {
    margin-left: 10px;
}

div.tableFilters .chosen-container-single .chosen-single span {
    overflow: visible; /* don't shorten dropdown span */
}

div.tableFilters .chosen-container-single .chosen-single div { /* chosen arrow */
    padding-top: 4px;
}

div.tableFilters input#csv_report { /* 'Export to File' button */
    width: 103.4px;
    margin-left: 20px;
    padding: 0 6px;
    padding: 0 10px;
}

#email_view h2 {
    margin-bottom: 25px;
    padding: 40px 0 15px 0;
    border-bottom: 2px solid #E4E4E4;
}

/*  ===================
    REPORTS - DASHBOARD
    =================== */

table.staticReports {
    margin-bottom: 90px;
    border-collapse: collapse; /* needed for bottom border on last tr */
}

table#my_report_table.datatable thead tr th.sorting:nth-child(4),
table#my_report_table.datatable thead tr th.sorting_asc:nth-child(4),
table#my_report_table.datatable thead tr th.sorting_desc:nth-child(4) { /* 'Delete' column th */
    width: 65px !important;
    background-image: none; /* hide sorting arrows */
}

table#my_report_table.datatable thead tr th.sorting:nth-child(4):hover,
table#my_report_table.datatable thead tr th.sorting_asc:nth-child(4):hover,
table#my_report_table.datatable thead tr th.sorting_desc:nth-child(4):hover { /* 'Delete' column th */
    cursor: default; /* not a sorting column */
}

table#my_report_table.datatable tbody tr td:nth-child(4) { /* center-align 'Delete' column td */
    margin: 0 auto;
    text-align: center;
    padding: 0;
}

/*  ===================================
    REPORTS - ACTIVE CLIENT USERS TABLE
    =================================== */

table#user_table.datatable thead tr th.sorting:nth-child(4),
table#user_table.datatable thead tr th.sorting_asc:nth-child(4),
table#user_table.datatable thead tr th.sorting_desc:nth-child(4) {
    min-width: 200px; /* 'Primary Client' column */
}

table#user_table.datatable thead tr th.sorting:nth-child(5),
table#user_table.datatable thead tr th.sorting_asc:nth-child(5),
table#user_table.datatable thead tr th.sorting_desc:nth-child(5) {
    min-width: 150px; /* 'All Associated Clients' column */
}

/*  =============================
    REPORTS - MISSING ROLES TABLE
    ============================= */

table#missing_roles_table.datatable thead tr th.sorting:nth-child(3),
table#missing_roles_table.datatable thead tr th.sorting_asc:nth-child(3),
table#missing_roles_table.datatable thead tr th.sorting_desc:nth-child(3) {
    min-width: 150px;
}

table#missing_roles_table.datatable thead tr th.sorting:nth-child(4),
table#missing_roles_table.datatable thead tr th.sorting_asc:nth-child(4),
table#missing_roles_table.datatable thead tr th.sorting_desc:nth-child(4) {
    min-width: 180px;
}

table#missing_roles_table.datatable thead tr th.sorting:nth-child(5),
table#missing_roles_table.datatable thead tr th.sorting_asc:nth-child(5),
table#missing_roles_table.datatable thead tr th.sorting_desc:nth-child(5) {
    min-width: 125px;
}

table#missing_roles_table.datatable thead tr th.sorting:nth-child(6), /*hide OARnet-Managed Contacts' column */
table#missing_roles_table.datatable tbody tr td:nth-child(6) {
    display: none;
}

/*  ===============================
    REPORTS - MISSING CONTACT TABLE
    =============================== */

table#missing_contact_table.datatable thead tr th.sorting:nth-child(3),
table#missing_contact_table.datatable thead tr th.sorting_asc:nth-child(3),
table#missing_contact_table.datatable thead tr th.sorting_desc:nth-child(3) {
    min-width: 150px;
}

table#missing_contact_table.datatable tbody tr td:nth-child(4) {
    word-break: break-word; /* only way table will fit within responsive container */
}

table#missing_contact_table.datatable thead tr th.sorting:nth-child(5),
table#missing_contact_table.datatable thead tr th.sorting_asc:nth-child(5),
table#missing_contact_table.datatable thead tr th.sorting_desc:nth-child(5) {
    min-width: 80px;
}

table#missing_contact_table.datatable thead tr th.sorting:nth-child(7),
table#missing_contact_table.datatable thead tr th.sorting_asc:nth-child(7),
table#missing_contact_table.datatable thead tr th.sorting_desc:nth-child(7) {
    min-width: 125px;
}

table#missing_contact_table.datatable thead tr th.sorting:nth-child(8), /*hide OARnet-Managed Contacts' column */
table#missing_contact_table.datatable tbody tr td:nth-child(8) {
    display: none;
}

/*  =================================
    REPORTS - MISSING ADDRESSES TABLE
    ================================= */

table#missing_address_table.datatable tbody tr td:nth-child(2) {
     word-break: break-word; /* only way table will fit within responsive container */
}

table#missing_address_table.datatable thead tr th.sorting:nth-child(3),
table#missing_address_table.datatable thead tr th.sorting_asc:nth-child(3),
table#missing_address_table.datatable thead tr th.sorting_desc:nth-child(3) {
    min-width: 150px;
}

table#missing_address_table.datatable thead tr th.sorting:nth-child(4),
table#missing_address_table.datatable thead tr th.sorting_asc:nth-child(4),
table#missing_address_table.datatable thead tr th.sorting_desc:nth-child(4) {
    min-width: 150px;
}

table#missing_address_table.datatable thead tr th.sorting:nth-child(5),
table#missing_address_table.datatable thead tr th.sorting_asc:nth-child(5),
table#missing_address_table.datatable thead tr th.sorting_desc:nth-child(5) {
    min-width: 180px;
}

/*  ================================
    REPORTS - SITES OPTING-OUT TABLE
    ================================ */

table#opt_out_site_table.datatable thead tr th.sorting:nth-child(2),
table#opt_out_site_table.datatable thead tr th.sorting_asc:nth-child(2),
table#opt_out_site_table.datatable thead tr th.sorting_desc:nth-child(2) {
   min-width: 150px; /* 'Associated LN' column */
}

table#opt_out_site_table.datatable thead tr th.sorting:nth-child(5),
table#opt_out_site_table.datatable thead tr th.sorting_asc:nth-child(5),
table#opt_out_site_table.datatable thead tr th.sorting_desc:nth-child(5) {
   min-width: 150px; /* 'Date Edited' column */
}

/*  ================
    REPORTS - TOTALS
    ================ */

body#totals_report table#location_table.reportSpacing,
body#totals_report table#site_table.reportSpacing {
    padding-top: 0px; /* ignore .reportSpacing on 'Totals' */
}

body#totals_report p.tableIntro:not(:first-of-type),
a#expand_csites,
a#expand_locations {
    margin-top: 65px; /* visually match table spacing between with 'Contacts' */
    clear: right;
}

body#totals_report table.dataTable {
    border-bottom: 1px solid #E4E4E4 !important; /* fixes tr:last-child border with 'Show / Hide All' toggle */
}

body#totals_report table.dataTable tbody tr:last-child,
body#totals_report table.dataTable tbody tr:last-child td {
    border-bottom: 1px solid #E4E4E4 !important; /* fixes tr:last-child border with 'Show / Hide All' toggle */
}

body#totals_report .dataTables_wrapper {
    padding-bottom: 0 !important; /* keep 'Export' button right below table */
}

body#totals_report table.dataTable th:nth-child(1) {
    width: 70%;
}

body#totals_report table.dataTable th:nth-child(2),
body#totals_report table.dataTable tr td:nth-child(2) { /* right-align numbers */
    text-align: right;
    padding-right: 25%;
}

input#client_csv_report,
input#csite_csv_report,
input#location_csv_report {
    width: 103.4px; /* match global 'Export to File' buttons */
    margin-top: 15px; /* set right below tables & ignore table's bottom padding */
    padding: 0 10px; /* visually match global 'Export to File' buttons */
    position: relative;
    z-index: 998;
}

span.BottomNote {
    margin-bottom: 100px;
    padding-right: 200px;
    float: left;
    position: relative;
    bottom: 67px; /* set right under table & align with buttons */
}

body#totals_report span.BottomNote {
    margin-bottom: 100px;
    padding-right: 200px;
    float: left;
    position: relative;
    top: -20px; /* set right under table & align with 'Export to File' button */
    clear: both;
}

#totals_report table td a.clickSection {
    width: 250px; /* no resizing */
    padding: 0;
    position: relative;
    display: block; /* hovers take precedence */
    color: #0070C9;
}

#totals_report table td a.clickSection:hover {
    color: #000;
    cursor: pointer;
}

#totals_report table td .openArrow {
    border-width: 0 2px 2px 0;
    margin-top: 5px;
}

#totals_report table td a.clickSection:hover > .reportArrow { /* hover on .clickSection to darken arrow */
    border-color: #4A4A4A;
}

#totals_report table td .closeArrow {
    border-width: 2px 0 0 2px;
    margin-top: 5px;
}

#totals_report table td.subcategory {
    padding-left: 40px; /* indent subcategories */
}

/*  ==================
    REPORTS - FILTERED
    ================== */

form#filter_form { /* remove styling from form as table */
    width: 100%;
    margin: 0 auto;
    padding: 0;
    display: auto;
    border-collapse: auto;
    border-spacing: 0;
    background: inherit;
    border: none;
    border-radius: none;
}

div.tableFilters.dynamic {
    margin-bottom: 15px;
    top: 0;
}

form#filter_form #email_view h2 {
    margin-bottom: 25px;
    padding: 2px 0 15px 0;
    border-bottom: 2px solid #E4E4E4;
}

table#filter_table {
    width: 100% !important;
}

table#filter_table.dataTable thead tr th.sorting_disabled:nth-child(1) {
    width: 325px !important;
}

table#filter_table tbody tr td:nth-child(1) {
    width: 325px !important;
    position: relative; /* needed for absolute child element (.clickSection) */
}

table#filter_table p.tooltip {
    margin-left: 10px;
}

table#filter_table span.tooltipText {
    width: 260px;
}

span.bottomNote.noPadding {
    margin-bottom: 0;
    padding-right: 0;
}

form div.reportButtons { /* 'Run /Save / Export' buttons */
    position: relative;
    float: right;
    z-index: 997; /* allow main nav to cover if needed */
    top: -75px; /* align with bottomNote */
}

form div.reportButtons input[type="submit"] { /* 'Export to File' button */
    width: 103.4px;
    height: 30px;
    margin: 0 0 0 20px;
    padding: 0 6px;
    float: none;
    background: #FBFBFB;
    border-radius: 3px;
    border: 1px solid #E4E4E4;
    font-size: 14px;
}

form div.reportButtons input[type="submit"]:hover {
    border-color: #000;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
    cursor: pointer;
}

table#filter_table a.clickSection {
    width: 250px; /* no resizing */
    padding: 0;
    position: absolute;
    top: 12; /* center within tr */
    color: #0070C9;
}

table#filter_table a.clickSection:hover {
    color: #000;
    cursor: pointer;
}

.reportArrow {
    border: solid;
    border-color: #0070C9;
    position: absolute;
    left: 200;
    padding: 2px; /* match size of main nav arrows */
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

table#filter_table .openArrow {
    border-width: 0 2px 2px 0;
    margin-top: 5px;
}

table#filter_table .closeArrow {
    border-width: 2px 0 0 2px;
    margin-top: 5px;
}

table#filter_table a.clickSection:hover > .reportArrow { /* hover on .clickSection to dark arrow */
    border-color: #4A4A4A;
}

table#filter_table input[type="checkbox"] { /* remove default form input styling */
    width: auto;
    height: auto;
    padding: auto;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: none;
    outline: none;
}

table#filter_table label { /* remove default form label styling */
    display: block;
    float: none;
    padding-right: 0;
    font-size: 14px;
    white-space: nowrap; /* keep on single line */
}

table#filter_table label.all { /* 'All / None' checkbox */
    margin: 40px 0 20px 0;
}

table#filter_table td.selected {
    padding-top: 12px;
}

/*  ======================
    REPORTS - MULTI-SELECT
    ====================== */

.selectMulti {
    margin-bottom: 65px;
}

.selectMulti div.chosen-container {
    width: 100% !important;
}

.selectMulti .chosen-container-multi .chosen-choices  {
    min-height: 42px; /* no shorter than default table td height */
    padding-bottom: 10px;
    border: none; /* remove default styling */
    border-top: 2px solid #E4E4E4;
    border-bottom: 2px solid #E4E4E4;
    background-image: none;
}

.selectMulti .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    height: auto;
    margin-top: 13px; /* vertically center within item */
}

.selectMulti .chosen-container-multi .chosen-choices li.search-field input[type="text"].default { /* 'All' placeholder */
    color: #0070C9;
}

.selectMulti .chosen-container .chosen-results {
    max-height: 387px; /* cover table */
}

body#location_report .selectMulti .chosen-container .chosen-results {
    max-height: 303px; /* cover table */
}

body#site_report .selectMulti .chosen-container .chosen-results {
    max-height: 429px; /* cover table */
}

.selectMulti .chosen-container-multi .chosen-choices li.search-field {
    padding: 5px 5px 5px 0px; /* match table td padding */
}

.selectMulti .chosen-container-multi .chosen-choices li.search-choice {
    min-height: 30px; /* match default button height */
    margin: 10px 10px 0 0;
    padding: 6px 35px 6px 12px;
    background: #FBFBFB;
    border: 1px solid #E4E4E4;
}

.selectMulti .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    top: 9px; /* vertically center close button within item */
    right: 12px; /* horizontally align close button */
}

.selectMulti .chosen-container-active .chosen-choices {
    border: none; /* remove default styling */
    border-top: 2px solid #E4E4E4;
    border-bottom: 2px solid #E4E4E4;
}

/*  =====================================
    REPORTS - FILTERED RESULTS - CONTACTS
    ===================================== */

table#contact_table.datatable thead tr th.sorting:nth-child(3),
table#contact_table.datatable thead tr th.sorting_asc:nth-child(3),
table#contact_table.datatable thead tr th.sorting_desc:nth-child(3) { /* 'Location Name - Associated Client' column */
    min-width: 125px;
}

/*  ======================================
    REPORTS - FILTERED RESULTS - SITES
    ====================================== */

table#site_table.datatable thead tr th.sorting:nth-child(1),
table#site_table.datatable thead tr th.sorting_asc:nth-child(1),
table#site_table.datatable thead tr th.sorting_desc:nth-child(1) { /* 'Short Name' column */
    min-width: 125px;
}

table#site_table.datatable thead tr th.sorting:nth-child(2),
table#site_table.datatable thead tr th.sorting_asc:nth-child(2),
table#site_table.datatable thead tr th.sorting_desc:nth-child(2) { /* 'Location Name' column */
    min-width: 125px;
}

table#site_table.datatable thead tr th.sorting:nth-child(3),
table#site_table.datatable thead tr th.sorting_asc:nth-child(3),
table#site_table.datatable thead tr th.sorting_desc:nth-child(3) { /* 'Site Name' column */
    min-width: 125px;
}

/*  ======================================
    REPORTS - FILTERED RESULTS - LOCATIONS
    ====================================== */

table#location_table.datatable thead tr th.sorting:nth-child(1),
table#location_table.datatable thead tr th.sorting_asc:nth-child(1),
table#location_table.datatable thead tr th.sorting_desc:nth-child(1) { /* 'Short Name' column */
    min-width: 125px;
}

table#location_table.datatable thead tr th.sorting:nth-child(2),
table#location_table.datatable thead tr th.sorting_asc:nth-child(2),
table#location_table.datatable thead tr th.sorting_desc:nth-child(2) { /* 'Location Name' column */
    min-width: 125px;
}

table#location_table.datatable thead tr th.sorting:nth-child(4),
table#location_table.datatable thead tr th.sorting_asc:nth-child(4),
table#location_table.datatable thead tr th.sorting_desc:nth-child(4) { /* 'Address' column */
    min-width: 250px;
}

/*  ===============================
    REPORTS - SAVE & DELETE FILTERS
    =============================== */

form#info_form { /* remove styling from form as table */
    width: 100%;
    margin: 0 auto;
    padding: 0;
    display: auto;
    border-collapse: auto;
    border-spacing: 0;
    background: inherit;
    border: none;
    border-radius: none;
}

form#info_form #info_table_wrapper.dataTables_wrapper {
    padding-bottom: 15px;
}

form.saveFilters input[type="submit"] {
    width: 103.4px;
    height: 30px;
    margin: 0 0 0 20px;
    padding: 0 6px;
    float: none;
    background: #FBFBFB;
    border-radius: 3px;
    border: 1px solid #E4E4E4;
    font-size: 14px;
}

form.saveFilters div.reportButtons input[type="submit"]:hover {
    border-color: #000;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
    cursor: pointer;
}

/*  ==================
    REPORTS - CONTACTS
    ================== */

label[for=ex_inherited] {
    margin-left: 10px;
}

label[for=ex_inherited].checkboxLabel {
    padding-left: 20px; /* visually align to match 'Roles' opt-out checkbox */
}

label[for=ex_inherited].checkboxLabel:before {
    margin-top: 0; /* visually align to match 'Roles' opt-out checkbox */
}

/*  ==============
    CENTERED LISTS
    ============== */

h2 {
    font-size: 24px;
    color: #4A4A4A;
}

h2.bold {
    font-weight: 500;
}

h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
}

.centeredList {
    min-width: 700px;
    max-width: 50%;
    margin: 0 auto 70px auto;
    padding-top: 50px;
}

.centeredList p,
.centeredList a,
.centeredList strong,
.centeredList li,
.centeredList li span,
.centeredList li a {
    font-size: 17px;
    line-height: 1.5;
}

.centeredList a,
.centeredList a:link,
.centeredList a:visited,
.centeredList a:active {
    color: #0070C9;
}

.centeredList a:hover,
.centeredList a:link:hover,
.centeredList a:visited:hover,
.centeredList a:active:hover {
    color: #000;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.lowerContent {
    margin-top: 12%;
}

/*  ===========
    DEFINITIONS
    =========== */

.definitions li {
    margin-top: 50px;
}

.definitions li:first-child {
    margin-top: 0px;
}

.definitions p {
    margin-top: 5px;
}

/*  ====
    HELP
    ==== */

.help p.intro,
.help .hidden {
    padding-bottom: 20px;
}

.help a.clickSection,
.help a.clickSection:active,
.help a.clickSection:visited { /* style like h2 */
    display: inline-block;
    width: 100%;
    padding: 20px 0;
    font-size: 24px;
    line-height: 1.2;
    color: #0070C9;
}

.help a.clickSection:first-child {
    padding-top: 0;
}

.help a.clickSection:hover {
    color: #000;
    cursor: pointer;
    -webkit-transition: color .4s ease-out;
    -moz-transition: color .4s ease-out;
    -o-transition: color .4s ease-out;
    transition: color .4s ease-out;
 }

.helpArrow {
    border: solid;
    border-color: #0070C9;
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.help .openArrow {
    border-width: 0 2px 2px 0;
    margin: 0 0 4px 12px;
}

.help .closeArrow {
    border-width: 2px 0 0 2px;
    margin: 0 0 2px 12px;
}

.help a.clickSection:hover > .helpArrow { /* hover on .clickSection to dark arrow */
    border-color: #000;
    -webkit-transition: border-color .4s ease-out;
    -moz-transition: border-color .4s ease-out;
    -o-transition: border-color .4s ease-out;
    transition: border-color .4s ease-out;
 }

.divider {
    width: 100%;
    border-bottom: 2px solid #E4E4E4;
    opacity: .5;
}

.moveDown {
    margin-top: 20px !important;
}

.moveDownTwice {
    margin-top: 40px !important;
}

p.noBottom {
    margin-bottom: 0 !important;
}

.help p {
    margin: 5px auto 20px auto;
}

.help p.moveUp {
    margin-top: -5px;
}

.help ul {
    margin-bottom: 20px;
}

.help ul:last-child {
    margin-bottom: 0; /* already bottom padding in div.hidden */
}

.help ul li {
    margin-top: 5px;
}

ol {
    list-style-position: inside;
    counter-reset: foo;
    display: table;
/*  margin-left: 1.75em; */
}

ol li {
    list-style: none;
    counter-increment: foo;
    display: table-row;
}

ol li::before {
    content: counter(foo) ".";
    display: table-cell;
    text-align: right;
    padding-right: .5em;
}

ul.bullets {
    border-radius: 3px 3px 3px 3px;
    list-style: disc outside none;
    margin-left: 3.3em; /* align with numbered lists */
}

li.indentTwice {
    margin-left: 2em;
}

ol.faq {
    margin: 2em auto 2em 1.1em;
}

div.answer {
    height: 1em; /* increase answer separation */
}

div.answer h3 {
    display: inline-block; /* highlight just the text onclick */
}

.divider {
    width: 100%;
    border-bottom: 2px solid #E4E4E4;
    opacity: .5;
}

/*  =====
    FORMS
    ===== */

form {
    width: 450px;
    margin: 0 auto;
    padding: 0 50px;
    display: table; /* contains all elements within form */
    border-collapse: separate;
    border-spacing: 0 50px;
    background: #FFFFFF;
    border: 2px solid #E4E4E4;
    border-radius: 3px;
}

form input {
    width: 450px;
    height: 32px; /* needed for firefox */
    padding: 0 15px;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid #E4E4E4;
    font-size: 16px;
    outline: none;
}

form input:hover,
form input:focus {
    border-bottom-color: #4A4A4A;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

form input[type="submit"],
form input[type="reset"],
form input[type="button"],
form a.button { /* cancel link appears as button */
    width: 100px;
    height: 50px;
    margin: 0 15px;
    float: right;
    background: #FBFBFB;
    border: 2px solid #E4E4E4;
    border-radius: 3px;
    text-align: center;
}

form input[type="submit"]:hover,
form input[type="reset"]:hover,
form input[type="button"]:hover,
form a.button:hover {
    /* background: #E4E4E4; */
    border-color: #4A4A4A;
    cursor: pointer;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

form a.button { /* cancel link appears as button */
    width: 96px;
    height: auto;
    padding: 10px 0;
    float: left;
    clear: left;
    color: #4A4A4A !important; /* override blue link */
}

form input.noLink,
form a.noLink { /* if forms have no password link at the bottom */
    margin-top: 36px;
}

.formSpacing {
    margin-bottom: 40px;
}

/*  ===========================
    INPUT PLACEHOLDERS & LABELS
    =========================== */

::placeholder { /* modern support */
    font-size: 16px;
    color: #A5A5A5;
}

::-webkit-input-placeholder { /* webkit */
    font-size: 16px;
    color: #A5A5A5;
}

:-moz-placeholder { /* firefox 4 - 18 */
    font-size: 16px;
    color: #A5A5A5;
    opacity:    1;
}

::-moz-placeholder { /* firefox 19 + */
    font-size: 16px;
    color: #A5A5A5;
    opacity:    1;
}

:-ms-input-placeholder { /* IE 10-11 */
    font-size: 16px;
    color: #A5A5A5;
}

::-ms-input-placeholder { /* edge */
    font-size: 16px;
    color: #A5A5A5;
}

::placeholder { /* modern support */
    font-size: 16px;
    color: #A5A5A5;
}

form label {
    padding-top: 5px;
    padding-left: 15px;
    padding-right: 10px; /* leave space for error message */
    position: relative; /* needed for firefox */
    float: left;
    font-size: 16px;
    text-transform: capitalize;
    color: #A5A5A5;
}

form label.required {
    padding-left: 4px; /* account for '*' */
}

form ul.errorlist  li {
    margin-bottom: -21px; /* prevent error from increasing size of form */
}

form ul.errorlist li,
p.errorNote {
    padding-top: 5px; /* aligns with labels */
    padding-left: 15px;
    font-size: 14px;
    color: #CF0A2C; /* matches logo red */
}

p.errorNote { /* prevent error from affecting input's position  */
    margin-top: -30px;
    margin-bottom: 9px;
}

p.formNote {
    color: #A5A5A5;
}

form div.userClients ul li:after {
    content: " // "; /* separate list items with double slashes */
    color: #0070C9; /* blue double slashes */
    font-weight: 700; /* bold double slashes */
    /* commas can't be used because some client names are comma-separated */
}

form div.userClients ul li:last-child:after {
    content: ""; /* remove double slashes from the last list item */
}

/*  ignore '*' when aligning required field labels */
form label[for=id_first_name],
form label[for=id_last_name],
form label[for=id_title],
form label[for=id_email] {
    padding-left: 4px;
}

/*  =====
    LOGIN
    ===== */

form.login input[type="password"] {
    margin-top: 40px;
}

form.login input[type="submit"] {
    margin-top: -39px; /* align with 'Register' link */
    float: right;
}

form.login a {
    display: table;
    margin-left: 15px;
}

form.login a.resetPassword {
    margin-top: 25px;
}

form.login a.registerEmail {
    margin-top: 50px;
}

/*  =========
    DEV LOGIN
    ========= */

form.devLogin {
    margin-top: 20px; /* add space below welcome message */
}

form.devLogin a:first-child { /* dropdown is a link */
    margin-left: 0 !important;
    padding-left: 15px;
}

form.devLogin div.chosen-container {
    left: 0 !important;
}

form.devLogin div.chosen-container.chosen-container-single {
    width: 100% !important;
}

form.devLogin .chosen-container-single .chosen-single {
    height: auto !important;
    background: #FFFFFF;
}

form.devLogin .chosen-container .chosen-drop {
    border: none !important;
    border-radius: 0 !important;
}

form.devLogin a span {
    font-size: 16px;
}

form.devLogin a.chosen-single.chosen-default span {
    color: #A5A5A5;
}

form.devLogin .chosen-single.chosen-default,
form.devLogin .chosen-container-single .chosen-single {
    width: 450px !important;
    height: 32px !important;
    padding-top: 5px !important; /* match normal inputs */
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 2px solid #E4E4E4 !important;
}

form.devLogin .chosen-single.chosen-default:hover {
    border-bottom-color: #4A4A4A !important;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

form.devLogin .chosen-container .chosen-drop {
    background: #FBFBFB;
    border: 1px solid #E4E4E4 !important;
    border-top: none !important;
    border-radius: 0 0 3px 3px !important;
}

form.devLogin .chosen-container .chosen-results {
    max-height: 150px !important;
}

form.devLogin .chosen-container-single .chosen-search input[type="text"] {
    padding-left: 12px;
}

form.devLogin .chosen-container .chosen-results li {
    padding: 5px 2px 5px 12px;
}

form.devLogin li.active-result {
    font-size: 14px;
}

form.devLogin .chosen-single div b { /* hide up/down arrow */
    background-image: none !important;
    background-size: 0 0 !important;
}

form.devLogin a.showPassword {
    height: 30px; /* overlay on input to prevent input:hover effect */
    width: 56px; /* same reason as height */
    margin: -30px 0 0 0; /* align with placeholder */
    z-index: 909; /* overlay on input, but not on .chosen dropdown */
    position: relative; /* required for z-index */
    float: right;
}

form.devLogin a.showPassword:hover {
    cursor: pointer;
}

form.devLogin input#id_password {
    margin-top: 40px; /* needed for toggling 'Show' link */
}

form.devLogin a.resetPassword {
    margin-top: 50px;
}

input[name="password"] { /* leave room for 'Show' link */
    padding-right: 70px;
}

/*  ===============
    CHANGE PASSWORD
    =============== */

form.password input[type="password"]:not(:first-child) {
    margin-top: 40px;
}

form.password input[type="submit"] {
    margin-top: 39px;
    float: right;
}

/*  =======
    CONTACT
    ======= */

form.contact input[type="text"]:not(:first-child) {
    margin-top: 40px;
}

form.contact input[type="submit"],
form.contact input[type="reset"] {
    margin-top: 80px;
}

form.contact input[type="reset"] {
    float: left;
}

/*  ========
    ADD ROLE
    ======== */

form.addContact .chosen-container-single .chosen-single {
    height: auto !important;
    background: #FFFFFF;
}

form.addContact a:first-child { /* dropdown is a link */
    margin-left: 0 !important;
    padding-left: 15px;
}

form.addContact div.chosen-container:nth-of-type(2) {
    width: 100%;
    margin-top: 40px;
}

form.addContact a.newContact {
    margin: 25px 0 31px 0;
    padding-left: 15px;
    float: left;
}

form.addContact input[type="reset"] {
    margin-left: 15px;
    float: left;
    clear: left;
}

form.addContact div.chosen-container.chosen-container-single {
    width: 100% !important;
}

form.addContact .chosen-container-single .chosen-single {
    height: auto !important;
}

for.addContact .chosen-container .chosen-drop {
    border: none !important;
    border-radius: 0 ! important;
}

form.addContact a span {
    font-size: 16px;
}

form.addContact a.chosen-single.chosen-default span {
    color: #A5A5A5;
}

form.addContact .chosen-single.chosen-default,
form.addContact .chosen-container-single .chosen-single {
    width: 450px !important;
    height: 32px !important;
    padding-top: 5px !important; /* match normal inputs */
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 2px solid #E4E4E4 !important;
}

form.addContact .chosen-single.chosen-default:hover {
    border-bottom-color: #4A4A4A !important;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

form.addContact .chosen-container .chosen-drop {
    border: 2px solid #E4E4E4 !important;
    border-top: none !important;
    border-radius: 0 0 3px 3px !important;
}

form.addContact .chosen-container .chosen-results {
    max-height: 300px !important;
}

form.addContact .chosen-container-single .chosen-search input[type="text"] {
    padding-left: 12px;
}

form.addContact .chosen-container .chosen-results li {
    padding: 5px 2px 5px 12px;
}

form.addContact li.active-result {
    font-size: 14px;
}

form.addContact .chosen-single div b { /* hide up/down arrow */
    background-image: none !important;
    background-size: 0 0 !important;
}

form.addContact ul.errorlist li,
form.addContact p.errorNote {
    padding-left: 15px;
    font-size: 14px;
    color: #CF0A2C; /* matches logo red */
}

form.addContact ul.errorlist li {
    margin-bottom: 9px /* prevent error from increasing size of form */
}

form.addContact p.errorNote { /* prevent error from affecting input's position  */
    margin-top: -30px;
    margin-bottom: 0;
}

/*  ===========
    DELETE ROLE
    =========== */

form.deleteRole h3 {
    margin-bottom: 40px;
}

form.deleteRole p {
    margin-bottom: 56px; /* match input distance on 'Edit Role' */
}

/*  ===========
    DELETE USER
    =========== */

form.deleteUser p {
    margin-bottom: 40px;
}

/*  ==============
    DELETE CONTACT
    ============== */

form.deleteContact p {
    margin-bottom: 40px;
}

/*  ==========
    MY PROFILE
    ========== */

h2.form span {
    font-size: 24px;
    opacity: .5; /* match 'Help' arrow gray */
}

form.profile input[type="text"] {
    margin-top: 40px;
}

form.profile input[type="text"].noTopMargin {
    margin-top: 0 !important;
}

form.profile a.resetPassword {
    margin: 25px 0 31px 0;
    padding-left: 15px;
    float: left;
    clear: left;
}

form.profile input[type="reset"] {
    margin-left: 15px;
    float: left;
    clear: left;
}

/*  =============
    404 NOT FOUND
    ============= */

ul.notFound {
    width: 100%;
}

.notFound h2,
.notFound p {
    text-align: center;
}

.notFound p {
    margin-top: 10px;
}


/*  ===============
    LOADING MESSAGE
    =============== */

.loadingContainer {
    width: 100%;
    min-width: 935px; /* full-screen with resize.js */
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    background: #FFFFFF;
}


.loading {
    padding: 1em;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background: #FFFFFFF;
}

.loading h1 {
    color: #4A4A4A;
    font-size: 28px; /* same size as Stats loader */
    text-align: center;
}

.circle {
    margin: 10% auto 0 auto;
    box-sizing: border-box;
    width: 80px;
    height: 80px;
    border-radius: 100%;
    border: 10px solid rgba(74, 74, 74, 0.2);
    border-top-color: #4A4A4A;
    animation: spin 1s infinite linear;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

/*  =================
    TRANSACTIONS PAGE
    ================= */

#account_transactions header ul.nav { /* hide nav completely */
    display: none;
}

span.spacer {
    padding: 0 8px; /* match breadCrumbs li */
}

form.transactionFilters {
    width: 100%;
    margin-bottom: 20px;
    padding: 30px 0 0 0;
    display: inherit;
    border: none;
}

form.transactionFilters input[type="text"] {
   width: 23%; /* scales within container */
   margin-right: 50px;
}

form.transactionFilters input[type="submit"] {
    width: 103.4px;
    height: 30px;
    margin: 0;
    padding: 0 10px;
    float: right;
    border: 1px solid #E4E4E4;
}

form.transactionFilters input[type="submit"]:hover {
    border-color: #4A4A4A;
}

table#transactions.datatable thead tr th.sorting:nth-child(1),
table#transactions.datatable thead tr th.sorting_asc:nth-child(1),
table#transactions.datatable thead tr th.sorting_desc:nth-child(1) { /* 'Time' column */
    min-width: 150px;
}

table#transactions.datatable thead tr th.sorting:nth-child(2),
table#transactions.datatable thead tr th.sorting_asc:nth-child(2),
table#transactions.datatable thead tr th.sorting_desc:nth-child(2) { /* 'User' column */
    min-width: 130px;
}

table#transactions.datatable thead tr th.sorting:nth-child(3),
table#transactions.datatable thead tr th.sorting_asc:nth-child(3),
table#transactions.datatable thead tr th.sorting_desc:nth-child(3) { /* 'Model' column */
    min-width: 80px;
}

table#transactions.datatable thead tr th.sorting:nth-child(5),
table#transactions.datatable thead tr th.sorting_asc:nth-child(5),
table#transactions.datatable thead tr th.sorting_desc:nth-child(5) { /* 'Action' column */
    min-width: 100px;
}

table#transactions a.clickSection:hover {
    cursor: pointer;
}

span.indentAction { /* forbid text from wrapping under arrows */
    margin-left: 30px;
    display: block;
}

table#transactions pre {
    font-family: 'Roboto Mono', monospace;
    margin: 10 0px;
    padding: 20px;
    background: rgba(233, 234, 236, 0.5);
    border-radius: 3px;
    white-space: pre-wrap; /* wrap as necessary and on line breaks */
}

/*  ==============
    API TOKEN PAGE
    ============== */

#token header ul.nav { /* hide nav completely */
    display: none;
}

/*  =================
    NO CLIENTS PAGE
    ================= */

.noClients.centeredList {
    width: 511px; /* exact centering */
    min-width: 0; /* override .centeredList */
    max-width: none; /* override .centeredList */
}

.noClients p {
    margin-top: 5px; /* match .definitions p */
}

/*  =======================
    GLOBAL CHOSEN OVERRIDES
    ======================= */

.chosen-container-single .chosen-single,
.chosen-container .chosen-container-single .chosen-with-drop,
.chosen-container .chosen-drop {
    background-color: #FBFBFB; /* default style */
    border: 1px solid #E4E4E4;
}
.chosen-search input[type="text"],
.chosen-container-single .chosen-search input[type="text"] {
    background-color: #FFFFFF;
    border: 1px solid #E4E4E4;
    border-radius: 3px;
}

.chosen-container-active.chosen-with-drop .chosen-single {
    border: 1px solid #E4E4E4;
}

.chosen-container.chosen-with-drop .chosen-drop {
    border-top: none;
}

div.chosen-container {
    position:relative;
}

.chosen-container-single .chosen-single {
    height: 25px;
}

.chosen-container-single .chosen-single:hover {
    border: 1px solid #4A4A4A;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.chosen-container .chosen-results {
    max-height: 125px;
}

.chosen-container .chosen-results li {
    padding: 5px 2px 5px 6px;
}

.chosen-container .chosen-results li.highlighted {
    background: #E4E4E4;
    color: #4A4A4A;
}

.chosen-container-single .chosen-single div { /* up & down select arrows */
    padding-top: 1px;
}

.chosen-container .chosen-results li.group-result {
    margin-top: 15px; /* separate optgroups */
}

.chosen-container-active .chosen-single span {
}

/*  ===========================
    GLOBAL DATATABLES OVERRIDES
    =========================== */

.dataTables_wrapper {
    padding-bottom: 90px;
}

table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: 500;
}

table.dataTable tr th,
table.dataTable tr td {
    padding: 13px 5px 12px 25px; /* account for sorting arrows */
}

table.dataTable thead th.sorting {
    background-image: url(../img/sort_both.svg);
}

table.dataTable thead th.sorting_asc {
    background-image: url(../img/sort_up.svg);
}

table.dataTable thead th.sorting_desc {
    background-image: url(../img/sort_down.svg);
}

table.dataTable thead th.sorting_asc_disabled {
    background-image: url(../img/sort_up_disabled.svg);
}

table.dataTable thead th.sorting_desc_disabled {
    background-image: url(../img/sort_down_disabled.svg);
}

table.dataTable tr td {
    border-bottom: 1px solid #E4E4E4;
}

table.dataTable thead th,
table.dataTable.no-footer {
    border-bottom: 2px solid #E4E4E4;
}

table.dataTable tbody tr:last-child td { /* remove the last row's bottom border */
    border-bottom: none;
}

.dataTables_wrapper .dataTables_filter input, /* 'Search' field  wrapper */
.dataTables_wrapper .dataTables_filter {
    width: 200px;
    float: left;
    margin: auto auto 10px 0;
    margin-left: 0;
}

.dataTables_wrapper .dataTables_info { /* 'Showing' results */
    padding-top: 15px;
}

.dataTables_wrapper .dataTables_paginate { /* align pagination with 'Showing' results */
    padding-top: 7px;
    float: right;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    background: #FFFFFF;
    border: 1px solid transparent;
    border-radius: 3px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #4A4A4A !important;
    background: #FBFBFB;
    border: 1px solid #E4E4E4;
}

a.paginate_button:hover {
    cursor: pointer;
    -webkit-transition: background .2s ease-out;
    -moz-transition: background .2s ease-out;
    -o-transition: background .2s ease-out;
    transition: background .2s ease-out;
}

@media screen and (max-width: 767px) {
    .dataTables_wrapper .dataTables_info {
        float: left;
        text-align: auto;
    }

    .dataTabeles_wrapper .dataTables_paginate {
        margin-top: 0;
        text-align: auto;
    }
}

/*  ===============
    CUSTOM CHECKBOX
    =============== */

.checkbox {
    height: 0;
    width: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    opacity: 0;
}

.checkboxLabel {
    color: #4A4A4A;
    cursor: pointer;
    font-size: 16px;
    padding-bottom: 2px;
    padding-left: 28px;
    padding-top: 2px;
    position: relative;
    -webkit-touch-callout: none; /* iOS safari */
    -webkit-user-select: none; /* safari */
    -moz-user-select: none; /* firefox */
    -ms-user-select: none; /* ie */
    user-select: none; /* chrome & opera */

}

.checkboxLabel:before {
    height: 17px;
    width: 17px;
    top: 0;
    left: 0;
    position: absolute;
    margin: 3px;
    content: '';
    border: 2px solid #0070C9;
    border-radius: 3px;
    box-sizing: border-box;
    webkit-border-radius: 3px;
    webkit-box-sizing: border-box;
}

.checkbox:checked + .checkboxLabel:before {
    background-color: #0070C9;
    border-color: #0070C9;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K");
    -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxIDEiPjx0aXRsZT51bnRpdGxlZDwvdGl0bGU+PHBhdGggZD0iTTAsMFYxSDFWMEgwWk0wLjQ1LDAuNzRsLTAuMDguMDhMMC4yOCwwLjc0LDAuMTQsMC42bDAuMDgtLjA4TDAuMzYsMC42NWwwLjQxLS40MUwwLjg2LDAuMzJaIi8+PC9zdmc+");
    mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxIDEiPjx0aXRsZT51bnRpdGxlZDwvdGl0bGU+PHBhdGggZD0iTTAsMFYxSDFWMEgwWk0wLjQ1LDAuNzRsLTAuMDguMDhMMC4yOCwwLjc0LDAuMTQsMC42bDAuMDgtLjA4TDAuMzYsMC42NWwwLjQxLS40MUwwLjg2LDAuMzJaIi8+PC9zdmc+");
}

.checkbox:disabled ~ .checkboxLabel {
    color: rgba(0, 0, 0, 0.38);
}
.checkbox:disabled ~ .checkboxLabel:before {
    border-color: rgba(0, 0, 0, 0.26);
}

.checkbox:checked:disabled ~ .checkboxLabel:before {
    background-clip: padding-box;
    background-color: rgba(0, 0, 0, 0.26);
}

.checkbox ~ .checkboxLabel:after {
    border-radius: 50%;
    content: '';
    left: 0;
    position: absolute;
    top: 0;
    webkit-border-radius: 50%;
}

.checkbox:focus ~ .checkboxLabel:after {
    animation: click-wave .5s;
    webkit-animation: click-wave .5s;
}

.checkbox:checked ~ .checkboxLabel:after {
    background-color: #0070C9;
}

.checkbox:not(:checked) ~ .checkboxLabel:after {
    background-color: #4A4A4A;
}

/*  ============================================
    ACCOUNTS - RECORDS - GLOBAL CHOSEN OVERRIDES
    ============================================ */

#records .chosen-container-single .chosen-single {
    padding: 10px 15px;
}

#records .chosen-container-single .chosen-single,
#records .chosen-container .chosen-container-single .chosen-with-drop,
#records .chosen-container .chosen-drop {
    background-color: #FFFFFF;
    border: 1px solid #E4E4E4;
}
#records .chosen-search input[type="text"],
#records .chosen-container-single .chosen-search input[type="text"] {
    width: 100% !important;
    margin-bottom: 0;
    float: none;
    background-color: #FFFFFF;
    border: 1px solid #E4E4E4;
    border-radius: 3px;
    background-image: none !important; /* hide search icon for now */
}

#records .chosen-container-active.chosen-with-drop .chosen-single {
    border: 1px solid #E4E4E4;
}

#records .chosen-container.chosen-with-drop .chosen-drop {
    border-top: none;
    margin-bottom: 40px; /* fit last dropdown in window */
    background-color: #FBFBFB;
    border-top: none;
}

#records div.chosen-container:not(textarea):not(.chosen-container-multi) { /* max-width only set on most dropdown menus */
    max-width: 430px; /* fit Yes/No radio buttons next to dropdowns */
    position:relative;
    float: left;
    clear: left;
}

#records #organizations_chosen {
    width: 600px;
    min-width: 600px;
    max-width: 600px;
}

#records #client_parent_chosen,
#records #locations_chosen,
#records #client_type_chosen,
#records #client_rep_chosen,
#records #new_org #organizations_chosen {
    width: 430px;
    min-width: 430px;
    max-width: 430px;
}

#records .chosen-container-single .chosen-single {
    height: 42px;
}

#records .chosen-container-single .chosen-single span  {
    font-size: 16px;
}

#records .chosen-container-single .chosen-single:hover {
    border: 1px solid #4A4A4A;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

#records .chosen-disabled .chosen-single {
    cursor: not-allowed;
}

#records .chosen-container .chosen-results { /* default dropdown height */
    max-height: 275px;
}

#records .chosen-container .chosen-results li {
    /* padding: 5px 2px 5px 6px; */
    padding: 10px 15px; /* match inputs */
    font-size: 16px; /* match inputs */
}

#records .chosen-container .chosen-results li.highlighted {
    background: #E4E4E4;
    color: #4A4A4A;
}

#records .chosen-container-single .chosen-single div { /* up & down select arrows */
    padding-top: 10px;
}

#records .chosen-container .chosen-results li.group-result {
    margin-top: 15px; /* separate optgroups */
}

/* ====================================
   ACCOUNTS - RECORDS - GLOBAL SETTINGS
   ==================================== */

#records header ul.nav {
    display: none; /* hide nav completely */
}

#records h2 {
    padding-top: 50px;
}

#records span.required {
    margin-left: -10px; /* set red asterisks left  of label */
}

#records span.line-break {
    margin-top: 10px; /* hide 'Address' below selected input */
    display: table; /* acts as line break */
}

#records form .spaceAbove,
#records form.spaceAbove,
#records div.spaceAbove {
    margin-top: 40px;
}

#records div.spaceABoveDouble {
    margin-top: 80px;
}

#records form .rightAbove {
    margin-top: 20px;
}

#records form .spaceBelow {
    margin-bottom: 40px;
}

#records form .rightBelow {
    margin-bottom: 20px;
}

#records form h3 {
    clear: both;
}

form.fullForm,
div.fullForm {
    width: 600px;
}

form.fullForm input,
div.fullForm input {
    float: left;
}

#records form label {
    margin-bottom: 5px;
    padding: 0px 10px 0 15px;
    position: relative;
    float: left;
    font-size: 16px;
    text-transform: none;
    color: #4A4A4A;
    clear: left;
}

#records form input[type="text"] { /* ignore radio and checkbox */
    width: 600px;
    height: 42px;
    margin-bottom: 40px;
    padding: 0 15px;
    /* background: transparent; fixes chosen png issue */
    border: 1px solid #E4E4E4;
    border-radius: 3px;
    font-size: 16px;
    outline: none;
    clear: both;
}

#records form input:hover {
    border-color: #4A4A4A;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out;
    -o-transition:all .2s ease-out;
    transition:all .2s ease-out;
}

#records textarea {
    min-width: 600px;
    max-width: 600px;
    min-height: 84px !important ; /* resizing by textArea.js */
    float: left;
    border: 1px solid #E4E4E4;
    border-radius: 3px;
    font-size: 16px;
    outline: none;
    clear: both;
    margin-bottom: 40px;
    padding: 10px 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow-y: auto !important;
}

#records textarea:hover {
    border: 1px solid #4A4A4A;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

#records a.showInfo {
    font-size: 16px;
}

#records a.showInfo:before {
    content: "Info";
}

#records span.info {
    margin-bottom: 5px;
    padding: 10px 10px 5px 15px;
    clear: left;
}

#records p {
    font-size: 16px !important;
    clear: left;
}

#records input[type="checkbox"] { /* remove default form input styling */
    width: auto;
    height: auto;
    padding: auto;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: none;
    outline: none;
}

#records label { /* remove default form label styling */
    display: block;
    float: none;
    padding-right: 0;
    font-size: 14px;
    white-space: nowrap; /* keep on single line */
}

#records form label.checkboxLabel {
    padding: 2px 0 0 30px !important;
    color: #4A4A4A;
}

#records form label.checkboxLabel span.fourHundred {
    font-size: 16px;
}

#records form .shortened,
#records form input.shortened,
#records form #states_chosen,
#records form #counties_chosen {
    width: 280px !important;
}

#records form input.noBottom {
    margin-bottom: 0;
}

#records div.errors { /* all error messages at top of form */
    margin-bottom: 50px;
    padding: 15px 0;
    background: #FFF7F7;
    border: 2px solid #CF0A2C;
    border-radius: 3px;
}

#records div.errors ul.errorList li { /* override default errorList li style */
    margin-bottom: 0px;
    padding: 5px 20px;
    font-size: 15px /* override default error font size of 14px */
}

/*  ========================
    RECORDS - MAIN SELECTION
    ======================== */

#records ul.breadCrumbs li.hidden { /* display 'Main Menu' after form selection */
    display: none !important;
}

form#mainSelection {
    margin-top: 153px; /* visually align position with the other forms without h2 header */
}

input#add_type_org,
input#add_type_site {
    height: 0; /* fixes hidden div issue */
}

input#add_type_site {
    margin-top: 5px;
}

#records form#mainSelection p span.note {
    font-size: 16px;
}

/*  ===========================
    RECORDS - ORGANIZATION ONLY
    =========================== */

#records #client_parent_chosen.chosen-container .chosen-results { /* 'Parent' dropdown */
    max-height: 325px; /* longer dropdown than default */
}

/*  ===================
    RECORDS - SITE ONLY
    =================== */

#records #organizations_chosen.chosen-container .chosen-results { /* 'Parent' dropdown */
    max-height: 325px; /* match height of 'Parent' dropdown */
}

#records label[for=site_only_client],
#records label[for=site_only_provider],
#records label[for=site_only_vendor] {
    margin-left: 15px; /* move checkboxes in */
}

#records input#site_only_has_location_0,
#records input#site_only_has_location_1,
#records input#site_only_has_emergency_0,
#records input#site_only_has_emergency_1 { /* override form input defaults */
    width: 0;
    margin: 0;
    padding: 0;
}

#records label[for=site_only_has_location_0] {
    margin-left: 30px;
    margin-right: 20px;
}

#records label[for=site_only_has_emergency_0] {
    margin-left: 15px;
    margin-right: 10px;
}

#records label[for=site_only_has_emergency_1] {
    padding-left: 0;
}

/*  ======================
    RECORDS - CONFIRMATION
    ====================== */

#record_confirm header ul.nav {
    display: none; /* hide nav completely */
}

#record_confirm p {
   margin: 5px auto 20px auto;
}

/*  =======================
    RECORDS - RADIO BUTTONS
    ======================= */

#records input[type="radio"] {
  opacity: 0;
}

#records .radioLabel:first-of-type {
    margin-right: 40px;
}

#records label.checkboxLabel:hover,
#records label.radioLabel:hover {
    cursor: pointer;
}

#records input[type="radio"] + .radioLabel:before {
    content: "";
    background: #FBFBFB;
    border-radius: 100%;
    border: 2px solid #E4E4E4;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    position: relative;
    top: -0.2em;
    margin-right: 0.5em; /* fit into form */
    vertical-align: top;
    text-align: center;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    transition: .2s ease-out;
}

#records .radioLabel {
    margin-top: 11px; /* center align next to dropdown */
    display: inline-table; /* inline position buttons */
    clear: none;
}

#records input[type="radio"]:checked + .radioLabel:before {
    background-color: #0070C9;
    box-shadow: inset 0 0 0 4px #F4F4F4;
}

#records input[type="radio"]:focus + .radioLabel:before {
    outline: none;
    border-color: #0070C9;
}

#records input[type="radio"] + .radioLabel:empty:before {
    margin-right: 0;
}

#records label[for=org_client],
#records label[for=org_provider],
#records label[for=org_vendor],
#records label[for=site_client],
#records label[for=site_provider],
#records label[for=site_vendor] {
    margin-left: 15px; /* move checkboxes in */
}

#records input#has_parent_0,
#records input#has_parent_1,
#records input#has_location_0,
#records input#has_location_1,
#records input#has_emergency_0,
#records input#has_emergency_1,
#records input#has_name-change_0,
#records input#has_name-change_1 { /* override form input defaults */
    width: 0;
    margin: 0;
    padding: 0;
}

#records label[for=has_parent_0],
#records label[for=has_location_0],
#records label[for=has_name-change_0] {
    margin-left: 30px;
    margin-right: 20px;
}

#records label[for=has_emergency_0] {
    margin-left: 15px;
    margin-right: 10px;
}

#records label[for=has_emergency_1] {
    padding-left: 0;
}

#records form a.button,
#records form input[type="submit"] {
    width: 146px; /* wider buttons for larger form */
    height: 60px; /* taller buttons for larger form */
    margin-top: 80px; /* large spacing above form buttons */
    font-size: 16px;
}

#records form a.button { /* visually match new submit button style */
    height: 35px;
    padding: 19px 0 0 0;
}

#records form input[type="submit"] {
    padding: 10px 0;
    float: right;
    clear: none;
    border: 2px solid #E4E4E4;
}

#records form input[type="submit"]:hover {
    border: 2px solid #4A4A4A;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

/*  ======================
    RECORDS - MULTI-SELECT
    ====================== */

#records .selectMulti {
    margin-bottom: 0;
}

#records .selectMulti input {
    margin-bottom: 0;
}

#records .selectMulti div.chosen-container {
    width: 100% !important;
}

#records .selectMulti .chosen-container-multi .chosen-choices  {
    min-height: 42px; /* no shorter than default table td height */
    padding-bottom: 10px;
    border: 1px solid #E4E4E4;
    border-radius: 3px;
    background-image: none;
}

#records .selectMulti .chosen-container-multi .chosen-choices:hover  {
    border: 1px solid #4A4A4A;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

#records .selectMulti .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    height: auto;
    margin-top: 13px; /* vertically center within item */
}

#records .selectMulti .chosen-container-multi .chosen-choices li.search-field input[type="text"].default { /* 'All' placeholder */
    min-width: 200px;
    color: #A5A5A5;
}

#records .selectMulti .chosen-container .chosen-results {
    max-height: 150px;
}

#records .selectMulti .chosen-container.chosen-with-drop .chosen-drop {
    border-radius: 0 0 3px 3px; /* round bottom border only */
}

#records body#location_report .selectMulti .chosen-container .chosen-results {
    max-height: 303px; /* cover table */
}

#records body#site_report .selectMulti .chosen-container .chosen-results {
    max-height: 429px; /* cover table */
}

#records .selectMulti .chosen-container-multi .chosen-choices li.search-field {
    padding: 5px 5px 5px 0px; /* match table td padding */
}

#records .selectMulti .chosen-container-multi .chosen-choices li.search-choice {
    min-height: 30px; /* match default button height */
    margin: 10px 10px 0 0;
    padding: 6px 35px 6px 12px;
    background: #FBFBFB;
    border: 1px solid #E4E4E4;
}

#records .selectMulti .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    top: 9px; /* vertically center close button within item */
    right: 12px; /* horizontally align close button */
}

#records .selectMulti .chosen-container-active .chosen-choices {
    border: 1px solid #E4E4E4;
}

#records .chosen-container-multi .chosen-container.chosen-with-drop .chosen-drop {
    margin-bottom: 40px; /* fit last dropdown in window */
    background-color: #FBFBFB;
}