.svg-container {
    display: inline-block;
    position: relative;
    /* aspect ratio */
    width: 100%;    
    vertical-align: top;
    /* padding-bottom: 100%; */ 
    /* overflow: hidden; */
}

.svg-content-responsive {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 0;
}

.panelColumns td {
    vertical-align: top; 
} 

.ui-widget-content{
    color: black;
}

h1, h2, h3 {
    margin-bottom: 0; 
    padding-bottom: 0;
}

.ui-commandlink{
    color: blue !important;     
}

.ui-commandlink:focus{
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important;
    border: dotted !important;
}

.ui-button:focus{
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important;
    border: dotted !important;
}

.ui-autocomplete-input:focus{
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important;
    border: dotted !important;
}

input:focus{
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important;
    border: dotted !important;
}

a:focus { 
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important; 
    border: dotted !important;
}

a:active {
    font-weight: bold; 
    /* text-decoration: underline; */
}

textarea:focus { 
    border-width: thick; 
    border-color: red;
}

.borderlessPanelGrid tr, .borderlessPanelGrid td {
    border: none !important;
}

/* MWK unpadded table for heatMap */
.unpaddedTable td{
    border-spacing: 0px;
}

/*
 #    #  ######  #    #  #    #  #####     ##    #####    ####
 ##  ##  #       ##   #  #    #  #    #   #  #   #    #  #
 # ## #  #####   # #  #  #    #  #####   #    #  #    #   ####
 #    #  #       #  # #  #    #  #    #  ######  #####        #
 #    #  #       #   ##  #    #  #    #  #    #  #   #   #    #
 #    #  ######  #    #   ####   #####   #    #  #    #   ####
*/

ul.ui-menu-child {
    white-space: nowrap;
    width: auto !important;
    background: white !important;
}

.ui-menubar {
    background-color: white !important;
    border: none !important;
}

.ui-menuitem-icon {
    width: auto !important;
    height: auto !important;
}

.ui-menuitem-text {
    padding: 0.5em;
    background-color: white;
    color: blue;
    text-decoration: underline;
}

.redMenuItem .ui-menuitem-text {
    padding: 0.5em;
    background-color: white;
    color: red;
    text-decoration: underline;
} 

.whiteMenuItem .ui-menuitem-text {
    padding: 0.5em;
    background-color: white;
    color: black;
} 

/*
  #####    ##    #####   #    #     #    ######  #    #
    #     #  #   #    #  #    #     #    #       #    #
    #    #    #  #####   #    #     #    #####   #    #
    #    ######  #    #  #    #     #    #       # ## #
    #    #    #  #    #   #  #      #    #       ##  ##
    #    #    #  #####     ##       #    ######  #    #
*/

.ui-tabs-nav {
    background-color: white !important;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    float: left;
    padding: .5em 1em;
    color: red;
    text-decoration: none;
    outline: 0;
}

.ui-tabs-header:focus{
    color: red !important; 
    font-size: large !important; 
    text-decoration: underline !important;
    border: dotted !important;
}

/*
 #####    ####    #####    ##     #####  ######
 #    #  #    #     #     #  #      #    #
 #    #  #    #     #    #    #     #    #####
 #####   #    #     #    ######     #    #
 #   #   #    #     #    #    #     #    #
 #    #   ####      #    #    #     #    ######
*/

/* Styles for rotateTableCellContent plugin*/
table div.rotated {
    -ms-transform:rotate(270deg); /* IE 9 */
    -moz-transform:rotate(270deg); /* Firefox */
    -webkit-transform:rotate(270deg); /* Safari and Chrome */
    -o-transform:rotate(270deg); /* Opera */    
}

thead th {
    vertical-align:bottom;
}

table .vertical {
    white-space:nowrap;
    background-color:white;
}