/**** START: COLOR PALETTE ****/
/*
BLUE:   #000066; #3991d4; #2196f3; #e5f3ff
RED:    #cc0000; #ff0000; #ff5252
GRAY:   #757575; #e4e4e4; #f4f4f4
YELLOW: #ffffe0;
MISC:   #000000; #ffffff; #6ab344
*/
/**** END: COLOR PALETTE ****/


/*** START: SITE SPECIFIC ***/
#sub-menu-news li:nth-of-type(1) {
    border-bottom: solid 1px #ddd;
}
/*** END: SITE SPECIFIC ***/

.mdlx-print-only {
    display: none;
}

/*** START: DEFAULT LAYOUT ***/
body {
    margin: 0;
}


/** START: JQUERY-UI-SPECIFIC **/
.ui-datepicker-header {
    background: #2196f3 !important;
    background-image: none !important;
    color: #ffffff !important;
}

.ui-datepicker .ui-state-default {
    background-image: none !important;
}

.ui-dialog-titlebar {
    background: #2196f3 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 2px 0 #e4e4e4, 0 3px 1px -2px #757575, 0 1px 5px 0 #f4f4f4 !important;
}

.ui-dialog-buttonset {
    text-align: right !important;
}

.mdlx-no-close .ui-dialog-titlebar-close {
    display: none !important;
}
/** END: JQUERY-UI-SPECIFIC **/


/** START: DNN-SPECIFIC **/
/* Breadcrumb */
.mdlx-breadcrumb span[itemprop="name"] {
    text-transform: uppercase;
}

.mdlx-breadcrumb-icon {
    float: right;
    margin-right: 5px;
}

/* Module Drag Bar and Actions */
.dnnDragHint {
    background-color: #e4e4e4;
}

.dnn_mact {
    position: static !important;
    margin-left: 0px !important;
    margin-top: 0px !important;
    top: 0px !important;
    left: 0px !important;
    float: right;
}

/* Text Editor */
.mdlx .dnnTextEditor {
    margin-bottom: 0px !important;
}
/** END: DNN-SPECIFIC **/
/*** END: DEFAULT LAYOUT ***/


/** START: MDL-SPECIFIC **/
.mdl-data-table {
    font-size: 16px;
}

.mdl-card__title-text {
    font-weight: 400;
}

.mdl-tabs__panel {
    overflow: hidden;
}

.mdl-layout__header.is-compact {
    max-height: 79px !important;
}

.mdl-card__title {
    flex-direction: column;
    display: block;
}

.mdl-card__subtitle-text {
    align-self: flex-start;
    font-size: 18px;
}

.mdl-typography--subhead {
    font-size: 18px;
    font-weight: 400 !important;
}

ul, ol {
    font-size: 18px;
}

.mdl-card__supporting-text {
    width: auto !important;
    color: #000000 !important;
}

    .mdl-card__supporting-text p {
        font-size: 18px;
        font-weight: 400 !important;
    }

.mdl-card__media {
    background-color: transparent !important;
}

.mdl-menu {
    padding-top: 0px;
    padding-bottom: 0px;
}
/** END: MDL-SPECIFIC **/
/** START: MDLX-SPECIFIC **/
/* START: Two-Factor Authentication*/
#MDLX_TFA_Dialog {
    display: none;
}

#MDLX_TFA_Intructions {
    text-align: justify;
}

#MDLX_TFA_Send_Auth_Code {
    text-align: center;
}

#MDLX_TFA_Auth_Code_Label {
    font-weight: bold;
}

#MDLX_TFA_Auth_Code {
    margin: 15px auto;
    width: 200px;
}

    #MDLX_TFA_Auth_Code div:nth-of-type(1) {
        font-weight: bold;
        text-align: left;
    }

    #MDLX_TFA_Auth_Code div:nth-of-type(2) {
        width: 100%;
    }

#MDLX_TFA_Dialog p:nth-of-type(2) {
    font-size: 90%;
    font-style: italic;
    text-align: center;
}
/* END: Two-Factor Authentication*/
/** END: MDLX-SPECIFIC **/


/** START: PAGE TEMPLATE **/
/* START: Header */
.mdlx-header {
    overflow: visible;
    background-color: #ffffff;
}

    .mdlx-header .mdl-layout__drawer-button {
        background: transparent;
        color: #3991d4;
        height: auto;
    }

    .mdlx-header .mdl-navigation__link {
        color: #757575;
        font-weight: 700;
        font-size: 14px;
    }

.mdlx-header-spinner {
    float: right;
    margin-top: 20px;
    margin-right: 3px;
    width: 28px;
}

.mdlx-header-login {
    float: right;
    margin-top: 22px;
    margin-right: 3px;
}

.mdlx-header-menu-bar {
    float: right;
    margin-top: 20px;
}

.mdlx-header-menu .mdl-navigation__link {
    color: #757575;
    font-weight: 700;
    font-size: 14px;
    padding-left: 12px;
    padding-right: 12px;
}

.mdlx-header-menu .material-icons {
    color: #3991d4 !important;
}

.mdlx-header-logo {
    margin-left: 75px;
}

.mdlx-header-logo-image {
    max-width: 389px !important;
}

.mdlx-header-logo-mobile {
    float: right;
    color: black;
    width: calc(100% - 155px);
    text-align: center;
    display: none;
}

.mdlx-header-logo-mobile-image {
    width: 100%;
    max-width: 291px !important;
}

@media screen and (max-width: 975px) {
    .mdlx-header-logo, .mdlx-header-menu-bar {
        display: none;
    }

    .mdlx-header-logo-mobile {
        display: inline-block;
    }
}

@media screen and (min-width: 976px) and (max-width: 1125px) {
    .mdlx-header-logo-image {
        width: 32%;
    }

    .mdlx-header-menu .mdl-navigation__link {
        padding-left: 4px;
        padding-right: 4px;
    }
}
/* END: Header*/

/* START: Header - Drawer */
.mdlx-header-drawer {
    border-right: none;
}

.mdl-layout__drawer-button .material-icons {
    font-size: 48px;
}

.mdlx-header-drawer-separator {
    height: 2px;
    background-color: #e4e4e4;
    margin: 8px 0;
}

.mdlx-header-drawer .mdl-navigation__link.mdl-navigation__link {
    font-size: 14px;
    color: #3991d4;
}

.mdlx-header-drawer span.mdl-navigation__link.mdl-navigation__link {
    color: #757575;
    font-weight: 700;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.mdlx-header-drawer .mdl-layout-title {
    position: relative;
    background: #ffffff;
    border-bottom: solid 1.5px #3991d4;
    height: 60px;
    padding-left: 10px !important;
}

.mdlx-header-drawer {
    position: absolute;
    bottom: 9px;
}

#mdlx-header-drawer-close {
    font-size: 90%;
    float: right;
    padding-top: 5px;
    padding-right: 5px;
    cursor: pointer;
}

.mdlx-header-drawer-login-container {
    margin-top: 20px;
}

.mdlx-header-drawer-login {
    padding-left: 0px;
    font-size: 125%;
}
/* END: Header - Drawer */

/* START Breadcrumbs */
.mdlx-breadcrumb {
    padding: 10px;
    background-color: #f4f4f4;
    margin-bottom: 10px;
    font-weight: bold;
}
/* END Breadcrumbs */

/* START: Footer */
.mdlx-footer-content {
    font-size: 85% !important;
}

.mdlx-footer {
    background-color: #f4f4f4;
    position: relative;
    padding: 0px;
}

.mdlx-footer-card {
    margin-bottom: 40px;
}

    .mdlx-footer-card .mdl-card__supporting-text {
        padding: 0px;
    }
/* END: Footer */
/** END: PAGE TEMPLATE **/

/** START: MDLX DATA CONTROLS **/
.mdlx-data-field {
    padding-top: 0px;
    padding-bottom: 0px;
    color: #000066;
    background-color: #f4f4f4;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    margin-bottom: 1px;
}

.mdlx-data-field__input {
    padding-left: 3px;
    padding-right: 3px;
}

.mdlx-data-field__label {
    color: #757575;
    overflow: visible;
    /*margin-left: 3px;
    margin-right: 3px;*/
}

input[type=text]::-ms-clear {
    display: none;
}

.mdlx-radio-button-list {
    display: inline-block;
    min-height: 27px;
    height: auto;
    background-color: #f4f4f4;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    margin-bottom: 1px;
    border-bottom: 1px solid rgba(0,0,0,.12);
}

    .mdlx-radio-button-list .mdl-radio {
        margin-left: 10px;
    }

    .mdlx-radio-button-list .mdl-radio__label {
        color: #000066;
        font-weight: 400;
        margin-right: 10px;
    }

.mdlx-check-box-list {
    display: inline-block;
    background-color: #f4f4f4;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    margin-bottom: 1px;
    border-bottom: 1px solid rgba(0,0,0,.12);
}

    .mdlx-check-box-list .mdl-checkbox {
        width: auto;
        min-height: 27px;
        height: auto;
        margin-left: 5px;
        margin-right: 5px;
    }

.mdlx-checkbox__label {
    color: #000066;
}

.mdlx-combo-box {
    display: inline-block;
}

.mdlx-combo-box__text {
    display: inline-block;
    width: calc(100% - 40px);
}

.mldx-combo-box__button {
    float: right;
}
/** END: MDLX DATA CONTROLS **/

.mdlx-alternate-contrast:nth-of-type(odd) {
    background-color: #f4f4f4 !important
}

.mdlx-card-display-on {
    border: solid 1px #757575;
    border-radius: 7px;
    margin-bottom: 3px;
    overflow: auto;
}

.mdlx-card-disabled {
    border: dashed 1px #ff0000;
    border-radius: 7px;
}

.mdlx-table {
    width: 100%;
}

.mdlx-table-stripe thead {
    background-color: #f4f4f4 !important;
}

.mdlx-table-stripe tbody tr:nth-child(even) {
    background-color: #e5f3ff !important;
}

.mdlx-table-stripe tbody tr:nth-child(odd) {
    background-color: #ffffff !important;
}

.mdlx-table-stripe tbody tr:hover {
    background-color: #ffffe0 !important;
}

.mdlx-input-no-js:focus {
    outline: none;
    border-bottom: solid 2px #2196f3 !important;
}

.mdlx-word-wrap, .mdlx-link {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* word-break: break-all; This is the dangerous one in WebKit, as it breaks things wherever */
    /* Instead use this non-standard one: */
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.mdlx-ul-hover li:hover {
    background-color: #ffffe0 !important;
}

.mdlx-no-column-break {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid-column;
}

.mdlx-link {
    text-decoration: none;
    font-weight: normal !important;
    color: #2196f3 !important;
    cursor: pointer;
}

    .mdlx-link:hover {
        color: #ff5252 !important;
    }

    .mdlx-link .material-icons {
        position: relative;
        top: -1px;
        vertical-align: middle;
    }

    .mdlx-link:focus {
        border: solid 2px #a1c2f9;
        border-radius: 3px;
        margin: -2px;
    }

#dnn_ctl01_dnnLoginMenu_enhancedLoginLink:focus {
    border: none;
    margin: 0;
}

.mdlx-drawer .mdlx-link {
    color: #3991d4 !important;
}

.mdlx-navigation-sub-menus .mdlx-link {
    color: #3991d4 !important;
}

/* NEW */
.mdlx-uppercase {
    text-transform: uppercase;
}

.mdlx-bold {
    font-weight: bold !important;
}

.mdlx-font-weight-normal {
    font-weight: normal;
}

.mdlx-italic {
    font-style: italic !important;
}

.mdlx-black {
    color: #000000 !important;
}

.mdlx-blue-1 {
    color: #000066 !important;
}

.mdlx-blue-2 {
    color: #3991d4 !important;
}

.mdlx-blue-3 {
    color: #2196f3 !important;
}

.mdlx-blue-4 {
    color: #e5f3ff !important;
}

.mdlx-bg-blue-1 {
    background-color: #000066 !important;
}

.mdlx-bg-blue-2 {
    background-color: #3991d4 !important;
}

.mdlx-bg-blue-3 {
    background-color: #2196f3 !important;
}

.mdlx-bg-blue-4 {
    background-color: #e5f3ff !important;
}

.mdlx-red-1 {
    color: #cc0000 !important;
}

.mdlx-red-2 {
    color: #ff0000 !important;
}

.mdlx-red-3 {
    color: #ff5252 !important;
}

.mdlx-gray-1 {
    color: #757575 !important;
}

.mdlx-gray-2 {
    color: #e4e4e4 !important;
}

.mdlx-gray-3 {
    color: #f4f4f4 !important;
}

.mdlx-bg-gray-1 {
    background-color: #757575 !important;
}

.mdlx-bg-gray-2 {
    background-color: #e4e4e4 !important;
}

.mdlx-bg-gray-3 {
    background-color: #f4f4f4 !important;
}

.mdlx-green-1 {
    color: #6ab344 !important;
}

.mdlx-yellow-1 {
    color: #ffffe0 !important;
}

.mdlx-bg-yellow-1 {
    background-color: #ffffe0 !important;
}

.mdlx-align-left {
    text-align: left;
}

.mdlx-align-center {
    text-align: center;
}

.mdlx-align-right {
    text-align: right;
}

.mdlx-align-justify {
    text-align: justify;
}

.mdlx-material-icons-18 {
    font-size: 18px;
}

ol.mdlx-compact, ul.mdlx-compact {
    font-size: 90% !important;
    margin-bottom: 0px !important;
}

div.mdlx-box, div.mdlx-box-tight {
    border: solid 1px #000000;
    border-radius: 7px;
}

div.mdlx-box {
    padding: 15px;
}

div.mdlx-box-tight {
    padding: 10px;
}

div.mdlx-box-no-padding {
    padding: 0px;
}

.mdlx-button {
    padding: 10px;
}

.mdlx-indent-15 {
    padding-left: 15px;
}

.mdlx-indent-right-15 {
    padding-right: 15px;
}

.mdlx-indent-20 {
    padding-left: 20px;
}

.mdlx-indent-right-20 {
    padding-right: 20px;
}

.mdlx-indent-25 {
    padding-left: 25px;
}

.mdlx-indent-right-25 {
    padding-right: 25px;
}

.mdlx-indent-30 {
    padding-left: 30px;
}

.mdlx-indent-right-30 {
    padding-right: 30px;
}

.mdlx-indent-40 {
    padding-left: 40px;
}

.mdlx-indent-right-40 {
    padding-right: 40px;
}

.mdlx-font-size-70 {
    font-size: 70%;
}

.mdlx-font-size-80 {
    font-size: 80%;
}

.mdlx-font-size-90 {
    font-size: 90%;
}

.mdlx-font-size-110 {
    font-size: 110%;
}

.mdlx-font-size-120 {
    font-size: 120%;
}

.mdlx-padding-5 {
    padding: 5px;
}

.mdlx-padding-left-right-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.mdlx-padding-10 {
    padding: 10px;
}

.mdlx-padding-left-10 {
    padding-left: 10px;
}

.mdlx-padding-right-10 {
    padding-right: 10px;
}

.mdlx-padding-left-right-10 {
    padding-left: 10px;
    padding-right: 10px;
}

.mdlx-page-break-inside-avoid {
    page-break-inside: avoid;
}

.mdlx-hide {
    display: none;
}

.mdlx-underline {
    text-decoration: underline;
}

.mdlx-card-container-editor-bar {
    border: solid 1px #000000;
    border-radius: 7px;
    background-color: #ffeeee;
    margin-top: 3px;
    margin-bottom: 3px;
    text-align: center;
}

.mdlx-card-editor-bar {
    border: solid 1px #000000;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #eeeeff;
    margin-bottom: 3px;
    text-align: center;
}

.mdlx-comment, .mdlx-comment-emphasis {
    color: #757575;
    font-size: 85%;
    font-style: italic;
}

.mdlx-comment-emphasis {
    color: #ff5252;
    font-weight: bold;
}

.mldx-width-100-pct {
    width: 100%;
}

.mdlx-max-width-1440 {
    max-width: 1440px;
}

.mdlx-justify-content-flex-start {
    justify-content: flex-start !important;
}

.mdlx-overflow-auto {
    overflow: auto;
}

.mdlx-fit-width, .mdlx-fit-width-short {
    width: 100%;
}

.mdlx-fit-width-short {
    height: 50px;
}

.mdlx-image-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: auto !important;
}

.mdlx-cursor-wait {
    cursor: wait !important;
}

.mdlx-clear-both {
    clear: both;
}

.mdlx-field-label {
    font-weight: bold;
    text-shadow: 1px 1px 0px #e0e0e0;
}

.mdlx-field-sub-label {
    color: #757575;
    font-size: 80%;
    font-style: italic;
    font-weight: bold;
    text-shadow: none;
}

.mdlx-fieldset, .mdlx-fieldset-label {
    border: solid 1px #2196f3;
    padding: 10px;
    border-radius: 5px;
    min-width: 0;
}

.mdlx-fieldset-label {
    background-color: #f4f4f4;
}

.mdlx-fieldset-content {
    box-sizing: border-box;
    height: 100px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* word-break: break-all; This is the dangerous one in WebKit, as it breaks things wherever */
    /* Instead use this non-standard one: */
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
    overflow-y: auto;
}

.mdlx-legend {
    font-size: 105%;
    font-weight: bold;
    color: #000066;
}

    .mdlx-legend:not(:empty):before, .mdlx-legend:not(:empty):after {
        content: "\00a0";
    }

table.mdlx-table-fixed-header thead tr {
    display: block;
    position: relative;
}

table.mdlx-table-fixed-header tbody {
    display: block;
    overflow: auto;
    width: 100%;
}

tr.mdlx-table-fixed-header--no-rows {
    display: block;
    width: 100%;
}

td.mdlx-table-fixed-header--no-rows {
    display: block;
    width: 100% !important;
    text-align: center !important;
}

.mdlx-data-table-thead {
    background-color: #f0f0f4;
}

    .mdlx-data-table-thead th {
        color: #000000 !important;
        font-size: 110% !important;
    }

.mdlx-data-table-tfoot {
    background-color: #f0f0f4;
}

    .mdlx-data-table-tfoot td {
        color: #000000 !important;
        font-size: 110% !important;
        font-weight: bold;
    }

.mdlx-form-row, .mdlx-form-row-top {
    clear: both;
}

.mdlx-form-row {
    padding-top: 15px;
}

.mdlx-form-row-top {
    padding-top: 0px;
}

.mdl-shadow--3dp {
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12) !important;
}

.mdl-shadow--4dp {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2) !important;
}

.mdl-shadow--6dp {
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2) !important;
}

.mdl-shadow--8dp {
    box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;
}

.mdl-shadow--16dp {
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
}

.mdl-shadow--24dp {
    box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2) !important;
}

.mdlx-ol li {
    margin-left: 10px;
}

.mdlx-combo-box-menu {
    max-height: 200px;
    overflow-y: auto;
    text-align: left;
}

.mdlx-combo-box-option {
    padding: 4px;
    cursor: pointer;
    font-size: 90%;
}

    .mdlx-combo-box-option:hover {
        border-top: solid 1px #2196f3;
        border-bottom: solid 1px #2196f3;
        background-color: #e5f3ff;
        padding: 3px 4px;
    }


/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/

/** START: GRID & CELL LAYOUT **/
.mdl-grid {
    justify-content: center;
}

.mdlx-grid-no-pad-horiz,
.mdlx-grid-no-pad {
    margin-left: -8px;
    margin-right: -8px;
    padding-left: 0px;
    padding-right: 0px;
}

.mdlx-grid-no-pad-vert {
    margin-top: -8px;
    margin-bottom: -8px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.mdlx-cell-blank {
    margin-top: 0px;
    margin-bottom: 0px;
}
/** END: GRID & CELL LAYOUT **/

/*** START: MOBILE LAYOUT ***/
@media (max-width: 900px) {
    .mdlx-header-menu-container {
        display: none;
    }

    .mdlx-title {
        display: none !important;
    }

    .mdlx-header-mobile-title {
        display: block !important;
        position: absolute;
        left: calc(50% - 180px);
        top: 12px;
        transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .mdl-tabs__tab-bar {
        display: block !important;
        height: auto !important;
        text-align: center !important;
        overflow: auto;
    }

    .mdl-tabs__tab {
        clear: left !important;
        width: 100% !important;
        padding: 0px;
        height: 43px;
        line-height: 43px;
        margin-top: 5px;
        background-color: #e5f3ff;
        border-top-left-radius: 7px;
        border-top-right-radius: 7px;
    }

    .mdl-tabs__panel {
        clear: both !important;
    }
}
/*** END: MOBILE LAYOUT ***/


/********************************/
/**** Screen Size 1: 0 - 479 ****/
/********************************/
@media screen and (max-width: 479px) {
    /*** START: MDL CELL LAYOUT  ***/
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: violet;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss1-flex-width,
    .mdl-cell--3-col-ss2-flex-width,
    .mdl-cell--3-col-ss3-flex-width,
    .mdl-cell--3-col-ss4-flex-width,
    .mdl-cell--3-col-ss5-flex-width,
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(100% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--3-col-ss1-fixed-width,
    .mdlx-cell--3-col-ss2-fixed-width,
    .mdlx-cell--3-col-ss3-fixed-width,
    .mdlx-cell--3-col-ss4-fixed-width,
    .mdlx-cell--3-col-ss5-fixed-width,
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss1-max-width,
    .mdlx-cell--3-col-ss2-max-width,
    .mdlx-cell--3-col-ss3-max-width,
    .mdlx-cell--3-col-ss4-max-width,
    .mdlx-cell--3-col-ss5-max-width,
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 3-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col {
        width: calc(100% - 16px);
    }

    /* Flexible Column Width */
    .mdl-cell--4-col-ss1-flex-width,
    .mdl-cell--4-col-ss2-flex-width,
    .mdl-cell--4-col-ss3-flex-width,
    .mdl-cell--4-col-ss4-flex-width,
    .mdl-cell--4-col-ss5-flex-width,
    .mdl-cell--4-col-ss6-flex-width {
        width: calc(100% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--4-col-ss1-fixed-width,
    .mdlx-cell--4-col-ss2-fixed-width,
    .mdlx-cell--4-col-ss3-fixed-width,
    .mdlx-cell--4-col-ss4-fixed-width,
    .mdlx-cell--4-col-ss5-fixed-width,
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss1-max-width,
    .mdlx-cell--4-col-ss2-max-width,
    .mdlx-cell--4-col-ss3-max-width,
    .mdlx-cell--4-col-ss4-max-width,
    .mdlx-cell--4-col-ss5-max-width,
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss1-flex-width,
    .mdl-cell--6-col-ss2-flex-width,
    .mdl-cell--6-col-ss3-flex-width,
    .mdl-cell--6-col-ss4-flex-width,
    .mdl-cell--6-col-ss5-flex-width,
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(100% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss1-fixed-width,
    .mdlx-cell--6-col-ss2-fixed-width,
    .mdlx-cell--6-col-ss3-fixed-width,
    .mdlx-cell--6-col-ss4-fixed-width,
    .mdlx-cell--6-col-ss5-fixed-width,
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss1-max-width,
    .mdlx-cell--6-col-ss2-max-width,
    .mdlx-cell--6-col-ss3-max-width,
    .mdlx-cell--6-col-ss4-max-width,
    .mdlx-cell--6-col-ss5-max-width,
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 6-Col **/


    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss1-flex-width,
    .mdl-cell--9-col-ss2-flex-width,
    .mdl-cell--9-col-ss3-flex-width,
    .mdl-cell--9-col-ss4-flex-width,
    .mdl-cell--9-col-ss5-flex-width,
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(100% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss1-fixed-width,
    .mdlx-cell--9-col-ss2-fixed-width,
    .mdlx-cell--9-col-ss3-fixed-width,
    .mdlx-cell--9-col-ss4-fixed-width,
    .mdlx-cell--9-col-ss5-fixed-width,
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss1-max-width,
    .mdlx-cell--9-col-ss2-max-width,
    .mdlx-cell--9-col-ss3-max-width,
    .mdlx-cell--9-col-ss4-max-width,
    .mdlx-cell--9-col-ss5-max-width,
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /** START: 12-Col **/
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /** END: 12-Col **/
    /*** END: MDL CELL LAYOUT  ***/

    /* UL Columns */
    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        list-style-type: none;
    }

    /* Misc */
    .mdlx-ss1-hide,
    .mdlx-ss2-hide,
    .mdlx-ss3-hide,
    .mdlx-ss4-hide,
    .mdlx-ss5-hide,
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss1-show,
    .mdlx-ss2-show,
    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss1-columns-3,
    .mdlx-ss2-columns-3,
    .mdlx-ss3-columns-3,
    .mdlx-ss4-columns-3,
    .mdlx-ss5-columns-3,
    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss1-columns-2,
    .mdlx-ss2-columns-2,
    .mdlx-ss3-columns-2,
    .mdlx-ss4-columns-2,
    .mdlx-ss5-columns-2,
    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss1-columns-1,
    .mdlx-ss2-columns-1,
    .mdlx-ss3-columns-1,
    .mdlx-ss4-columns-1,
    .mdlx-ss5-columns-1,
    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss1-align-left,
    .mdlx-ss2-align-left,
    .mdlx-ss3-align-left,
    .mdlx-ss4-align-left,
    .mdlx-ss5-align-left,
    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss1-align-center,
    .mdlx-ss2-align-center,
    .mdlx-ss3-align-center,
    .mdlx-ss4-align-center,
    .mdlx-ss5-align-center,
    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss1-align-right,
    .mdlx-ss2-align-right,
    .mdlx-ss3-align-right,
    .mdlx-ss4-align-right,
    .mdlx-ss5-align-right,
    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss1-no-pad-left,
    .mdlx-ss2-no-pad-left,
    .mdlx-ss3-no-pad-left,
    .mdlx-ss4-no-pad-left,
    .mdlx-ss5-no-pad-left,
    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss1-no-pad-right,
    .mdlx-ss2-no-pad-right,
    .mdlx-ss3-no-pad-right,
    .mdlx-ss4-no-pad-right,
    .mdlx-ss5-no-pad-right,
    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss1-indent-20,
    .mdlx-ss2-indent-20,
    .mdlx-ss3-indent-20,
    .mdlx-ss4-indent-20,
    .mdlx-ss5-indent-20,
    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss1-bg-gray-2,
    .mdlx-ss2-bg-gray-2,
    .mdlx-ss3-bg-gray-2,
    .mdlx-ss4-bg-gray-2,
    .mdlx-ss5-bg-gray-2,
    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss1-bg-none,
    .mdlx-ss2-bg-none,
    .mdlx-ss3-bg-none,
    .mdlx-ss4-bg-none,
    .mdlx-ss5-bg-none,
    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss1-padding-5,
    .mdlx-ss2-padding-5,
    .mdlx-ss3-padding-5,
    .mdlx-ss4-padding-5,
    .mdlx-ss5-padding-5,
    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss1-show,
    .mdlx-ss2-show,
    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss1-comment,
    .mdlx-ss2-comment,
    .mdlx-ss3-comment,
    .mdlx-ss4-comment,
    .mdlx-ss5-comment,
    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}

/**********************************/
/**** Screen Size 2: 480 - 659 ****/
/**********************************/
@media screen and (min-width: 480px) and (max-width: 659px) {
    /** START: MDL CELL LAYOUT  **/
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: blue;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss2-flex-width,
    .mdl-cell--3-col-ss3-flex-width,
    .mdl-cell--3-col-ss4-flex-width,
    .mdl-cell--3-col-ss5-flex-width,
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(83.33333% - 16px);
    }

    /* Set Column Width */
    .mdlx-cell--3-col-ss2-fixed-width,
    .mdlx-cell--3-col-ss3-fixed-width,
    .mdlx-cell--3-col-ss4-fixed-width,
    .mdlx-cell--3-col-ss5-fixed-width,
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss2-max-width,
    .mdlx-cell--3-col-ss3-max-width,
    .mdlx-cell--3-col-ss4-max-width,
    .mdlx-cell--3-col-ss5-max-width,
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 3-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col-ss2-flex-width,
    .mdl-cell--4-col-ss3-flex-width,
    .mdl-cell--4-col-ss4-flex-width,
    .mdl-cell--4-col-ss5-flex-width,
    .mdl-cell--4-col-ss6-flex-width {
        width: calc(83.33333% - 16px);
    }

    /* Set Column Width */
    .mdlx-cell--4-col-ss2-fixed-width,
    .mdlx-cell--4-col-ss3-fixed-width,
    .mdlx-cell--4-col-ss4-fixed-width,
    .mdlx-cell--4-col-ss5-fixed-width,
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss2-max-width,
    .mdlx-cell--4-col-ss3-max-width,
    .mdlx-cell--4-col-ss4-max-width,
    .mdlx-cell--4-col-ss5-max-width,
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss2-flex-width,
    .mdl-cell--6-col-ss3-flex-width,
    .mdl-cell--6-col-ss4-flex-width,
    .mdl-cell--6-col-ss5-flex-width,
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(83.33333% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss2-fixed-width,
    .mdlx-cell--6-col-ss3-fixed-width,
    .mdlx-cell--6-col-ss4-fixed-width,
    .mdlx-cell--6-col-ss5-fixed-width,
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss2-max-width,
    .mdlx-cell--6-col-ss3-max-width,
    .mdlx-cell--6-col-ss4-max-width,
    .mdlx-cell--6-col-ss5-max-width,
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 6-Col **/


    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss2-flex-width,
    .mdl-cell--9-col-ss3-flex-width,
    .mdl-cell--9-col-ss4-flex-width,
    .mdl-cell--9-col-ss5-flex-width,
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(83.33333% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss2-fixed-width,
    .mdlx-cell--9-col-ss3-fixed-width,
    .mdlx-cell--9-col-ss4-fixed-width,
    .mdlx-cell--9-col-ss5-fixed-width,
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss2-max-width,
    .mdlx-cell--9-col-ss3-max-width,
    .mdlx-cell--9-col-ss4-max-width,
    .mdlx-cell--9-col-ss5-max-width,
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /** START: 12-Col **/
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /** END: 12-Col **/
    /** END: MDL CELL LAYOUT  **/

    /* UL Columns */
    .mdl-cell--6-col .mdlx-ul-columns-2 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        list-style-type: none;
    }

    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        list-style-type: none;
    }

    /* Misc */
    .mdlx-ss2-hide,
    .mdlx-ss3-hide,
    .mdlx-ss4-hide,
    .mdlx-ss5-hide,
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss2-show,
    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss2-columns-3,
    .mdlx-ss3-columns-3,
    .mdlx-ss4-columns-3,
    .mdlx-ss5-columns-3,
    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss2-columns-2,
    .mdlx-ss3-columns-2,
    .mdlx-ss4-columns-2,
    .mdlx-ss5-columns-2,
    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss2-columns-1,
    .mdlx-ss3-columns-1,
    .mdlx-ss4-columns-1,
    .mdlx-ss5-columns-1,
    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss2-align-left,
    .mdlx-ss3-align-left,
    .mdlx-ss4-align-left,
    .mdlx-ss5-align-left,
    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss2-align-center,
    .mdlx-ss3-align-center,
    .mdlx-ss4-align-center,
    .mdlx-ss5-align-center,
    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss2-align-right,
    .mdlx-ss3-align-right,
    .mdlx-ss4-align-right,
    .mdlx-ss5-align-right,
    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss2-no-pad-left,
    .mdlx-ss3-no-pad-left,
    .mdlx-ss4-no-pad-left,
    .mdlx-ss5-no-pad-left,
    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss2-no-pad-right,
    .mdlx-ss3-no-pad-right,
    .mdlx-ss4-no-pad-right,
    .mdlx-ss5-no-pad-right,
    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss2-indent-20,
    .mdlx-ss3-indent-20,
    .mdlx-ss4-indent-20,
    .mdlx-ss5-indent-20,
    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss2-bg-none,
    .mdlx-ss3-bg-none,
    .mdlx-ss4-bg-none,
    .mdlx-ss5-bg-none,
    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss2-bg-gray-2,
    .mdlx-ss3-bg-gray-2,
    .mdlx-ss4-bg-gray-2,
    .mdlx-ss5-bg-gray-2,
    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss2-padding-5,
    .mdlx-ss3-padding-5,
    .mdlx-ss4-padding-5,
    .mdlx-ss5-padding-5,
    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss2-show,
    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss2-comment,
    .mdlx-ss3-comment,
    .mdlx-ss4-comment,
    .mdlx-ss5-comment,
    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}

/****************************/
/* Screen Size 3: 660 - 839 */
/****************************/
@media screen and (min-width: 660px) and (max-width: 839px) {
    /** START: MDL CELL LAYOUT  **/
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: green;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss3-flex-width,
    .mdl-cell--3-col-ss4-flex-width,
    .mdl-cell--3-col-ss5-flex-width,
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--3-col-ss3-fixed-width,
    .mdlx-cell--3-col-ss4-fixed-width,
    .mdlx-cell--3-col-ss5-fixed-width,
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss3-max-width,
    .mdlx-cell--3-col-ss4-max-width,
    .mdlx-cell--3-col-ss5-max-width,
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--4-col-ss3-fixed-width,
    .mdlx-cell--4-col-ss4-fixed-width,
    .mdlx-cell--4-col-ss5-fixed-width,
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss3-max-width,
    .mdlx-cell--4-col-ss4-max-width,
    .mdlx-cell--4-col-ss5-max-width,
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss3-flex-width,
    .mdl-cell--6-col-ss4-flex-width,
    .mdl-cell--6-col-ss5-flex-width,
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss3-fixed-width,
    .mdlx-cell--6-col-ss4-fixed-width,
    .mdlx-cell--6-col-ss5-fixed-width,
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss3-max-width,
    .mdlx-cell--6-col-ss4-max-width,
    .mdlx-cell--6-col-ss5-max-width,
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 6-Col **/


    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss3-flex-width,
    .mdl-cell--9-col-ss4-flex-width,
    .mdl-cell--9-col-ss5-flex-width,
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss3-fixed-width,
    .mdlx-cell--9-col-ss4-fixed-width,
    .mdlx-cell--9-col-ss5-fixed-width,
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss3-max-width,
    .mdlx-cell--9-col-ss4-max-width,
    .mdlx-cell--9-col-ss5-max-width,
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /* START: 12-Col */
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /* END: 12-Col */
    /** END: MDL CELL LAYOUT  **/

    /* UL Columns */
    .mdl-cell--6-col .mdlx-ul-columns-2 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        list-style-type: none;
    }

    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        list-style-type: none;
    }

    /* Misc */
    .mdlx-ss3-hide,
    .mdlx-ss4-hide,
    .mdlx-ss5-hide,
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss3-columns-3,
    .mdlx-ss4-columns-3,
    .mdlx-ss5-columns-3,
    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss3-columns-2,
    .mdlx-ss4-columns-2,
    .mdlx-ss5-columns-2,
    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss3-columns-1,
    .mdlx-ss4-columns-1,
    .mdlx-ss5-columns-1,
    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss3-align-left,
    .mdlx-ss4-align-left,
    .mdlx-ss5-align-left,
    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss3-align-center,
    .mdlx-ss4-align-center,
    .mdlx-ss5-align-center,
    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss3-align-right,
    .mdlx-ss4-align-right,
    .mdlx-ss5-align-right,
    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss3-no-pad-left,
    .mdlx-ss4-no-pad-left,
    .mdlx-ss5-no-pad-left,
    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss3-no-pad-right,
    .mdlx-ss4-no-pad-right,
    .mdlx-ss5-no-pad-right,
    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss3-indent-20,
    .mdlx-ss4-indent-20,
    .mdlx-ss5-indent-20,
    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss3-bg-none,
    .mdlx-ss4-bg-none,
    .mdlx-ss5-bg-none,
    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss3-bg-gray-2,
    .mdlx-ss4-bg-gray-2,
    .mdlx-ss5-bg-gray-2,
    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss3-padding-5,
    .mdlx-ss4-padding-5,
    .mdlx-ss5-padding-5,
    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss3-show,
    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss3-comment,
    .mdlx-ss4-comment,
    .mdlx-ss5-comment,
    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}

/*****************************/
/* Screen Size 4: 840 - 1199 */
/*****************************/
@media (min-width: 840px) and (max-width: 1199px) {
    /** START: MDL CELL LAYOUT  **/
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: yellow;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss4-flex-width,
    .mdl-cell--3-col-ss5-flex-width,
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(50% - 16px);
    }

    /* Set Column Width */
    .mdlx-cell--3-col-ss4-fixed-width,
    .mdlx-cell--3-col-ss5-fixed-width,
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss4-max-width,
    .mdlx-cell--3-col-ss5-max-width,
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 3-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col-ss4-flex-width,
    .mdl-cell--4-col-ss5-flex-width,
    .mdl-cell--4-col-ss6-flex-width {
        width: calc(50% - 16px);
    }

    /* Set Column Width */
    .mdlx-cell--4-col-ss4-fixed-width,
    .mdlx-cell--4-col-ss5-fixed-width,
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss4-max-width,
    .mdlx-cell--4-col-ss5-max-width,
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss4-flex-width,
    .mdl-cell--6-col-ss5-flex-width,
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(50% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss4-fixed-width,
    .mdlx-cell--6-col-ss5-fixed-width,
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss4-max-width,
    .mdlx-cell--6-col-ss5-max-width,
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 6-Col **/


    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss4-flex-width,
    .mdl-cell--9-col-ss5-flex-width,
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss4-fixed-width,
    .mdlx-cell--9-col-ss5-fixed-width,
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss4-max-width,
    .mdlx-cell--9-col-ss5-max-width,
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /** START: 12-Col */
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /** END: 12-Col */
    /** END: MDL CELL LAYOUT  **/

    /* UL Columns */
    .mdl-cell--6-col .mdlx-ul-columns-2 .mdlx-align-right {
        text-align: center;
    }

    .mdl-cell--6-col .mdlx-ul-columns-2 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        list-style-type: none;
    }

    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        list-style-type: none;
    }

    /* Misc */
    .mdlx-ss4-hide,
    .mdlx-ss5-hide,
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss4-columns-3,
    .mdlx-ss5-columns-3,
    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss4-columns-2,
    .mdlx-ss5-columns-2,
    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss4-columns-1,
    .mdlx-ss5-columns-1,
    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss4-align-left,
    .mdlx-ss5-align-left,
    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss4-align-center,
    .mdlx-ss5-align-center,
    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss4-align-right,
    .mdlx-ss5-align-right,
    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss4-no-pad-left,
    .mdlx-ss5-no-pad-left,
    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss4-no-pad-right,
    .mdlx-ss5-no-pad-right,
    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss4-indent-20,
    .mdlx-ss5-indent-20,
    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss4-bg-none,
    .mdlx-ss5-bg-none,
    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss4-bg-gray-2,
    .mdlx-ss5-bg-gray-2,
    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss4-padding-5,
    .mdlx-ss5-padding-5,
    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss4-show,
    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss4-comment,
    .mdlx-ss5-comment,
    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}

/******************************/
/* Screen Size 5: 1200 - 1599 */
/******************************/
@media (min-width: 1200px) and (max-width: 1599px) {
    /** START: MDL CELL LAYOUT  **/
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: orange;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss5-flex-width,
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(33.3333% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--3-col-ss5-fixed-width,
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss5-max-width,
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 3-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col-ss5-flex-width,
    .mdl-cell--4-col-ss6-flex-width {
        width: calc(33.3333% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--4-col-ss5-fixed-width,
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss5-max-width,
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss5-flex-width,
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(50% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss5-fixed-width,
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss5-max-width,
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 6-Col **/


    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss5-flex-width,
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss5-fixed-width,
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss5-max-width,
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /** START: 12-Col **/
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /** END: 12-Col **/
    /** END: MDL CELL LAYOUT  **/

    /* UL Columns */
    .mdl-cell--6-col .mdlx-ul-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        list-style-type: none;
    }

    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
        list-style-type: none;
    }

    /* Misc */
    .mdlx-ss5-hide,
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss5-columns-3,
    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss5-columns-2,
    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss5-columns-1,
    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss5-align-left,
    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss5-align-center,
    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss5-align-right,
    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss5-no-pad-left,
    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss5-no-pad-right,
    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss5-indent-20,
    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss5-bg-none,
    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss5-bg-gray-2,
    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss5-padding-5,
    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss5-show,
    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss5-comment,
    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}

/**********************************/
/* Screen Size 6: 1600 - infinity */
/**********************************/
@media (min-width: 1600px) {
    /* For Testing */
    /*.mdl-cell--3-col,
    .mdl-cell--4-col,
    .mdl-cell--6-col,
    .mdl-cell--12-col {
        background-color: red;
    }*/

    /** START: 3-Col **/
    /* Flexible Column Width */
    .mdl-cell--3-col-ss6-flex-width {
        width: calc(25% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--3-col-ss6-fixed-width {
        width: calc(25% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--3-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 3-Col **/


    /** START: 4-Col **/
    /* Flexible Column Width */
    .mdl-cell--4-col-ss6-flex-width {
        width: calc(33.3333% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--4-col-ss6-fixed-width {
        width: calc(33.3333% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--4-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 4-Col **/


    /** START: 6-Col **/
    /* Flexible Column Width */
    .mdl-cell--6-col-ss6-flex-width {
        width: calc(50% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--6-col-ss6-fixed-width {
        width: calc(50% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--6-col-ss6-max-width {
        width: calc(100% - 16px);
    }

    .mdl-cell--6-col .mdlx-ul-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        list-style-type: none;
    }

    .mdl-cell--6-col .mdlx-ul-columns-4 {
        column-count: 4;
        -moz-column-count: 4;
        -webkit-column-count: 4;
        list-style-type: none;
    }
    /** END: 6-Col **/

    /** START: 9-Col **/
    /* Flexible Column Width */
    .mdl-cell--9-col-ss6-flex-width {
        width: calc(75% - 16px);
    }

    /* Fixed Column Width */
    .mdlx-cell--9-col-ss6-fixed-width {
        width: calc(75% - 16px);
    }

    /* Maximum Column Width */
    .mdlx-cell--9-col-ss6-max-width {
        width: calc(100% - 16px);
    }
    /** END: 9-Col **/


    /** START: 12-Col **/
    .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
    /** END: 12-Col **/

    /* Misc */
    .mdlx-ss6-hide {
        display: none;
    }

    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss6-columns-3 {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
    }

    .mdlx-ss6-columns-2 {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
    }

    .mdlx-ss6-columns-1 {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
    }

    .mdlx-ss6-align-left {
        text-align: left;
    }

    .mdlx-ss6-align-center {
        text-align: center;
    }

    .mdlx-ss6-align-right {
        text-align: right;
    }

    .mdlx-ss6-no-pad-left {
        padding-left: 0px;
    }

    .mdlx-ss6-no-pad-right {
        padding-right: 0px;
    }

    .mdlx-ss6-indent-20 {
        padding-left: 20px;
    }

    .mdlx-ss6-bg-none {
        background: none !important;
    }

    .mdlx-ss6-bg-gray-2 {
        background-color: #e4e4e4 !important;
    }

    .mdlx-ss6-padding-5 {
        padding: 5px;
    }

    .mdlx-ss6-show {
        display: block;
    }

    .mdlx-ss6-comment {
        display: block;
        margin-left: 15px;
    }
}


/*** START: PRINT LAYOUT ***/
@media print {
    /**START: DNN-SPECIFIC**/
    .personalBarContainer {
        display: none !important;
    }
    /**END: DNN-SPECIFIC**/

    body {
        zoom: 50% !important;
        margin-left: 0px !important;
        width: 100% !important;
    }

    #cardFooterAddress {
        width: 33% !important;
        display: inline-block !important;
    }

    #cardFooterContactInfo {
        width: 33% !important;
        display: inline-block !important;
    }

    #cardFooterCopyrightTermsPrivacy {
        width: 33% !important;
        display: inline-block !important;
    }

    .mdl-tabs__panel {
        display: block !important;
    }

    .mdlx-no-print,
    .no-print {
        display: none !important;
    }

    .mdl-layout__container {
        width: 100% !important;
    }

    .mdlx-print-header {
        /*float: left;*/
        background-color: #ffffff;
        display: block !important;
        width: 100%;
    }

    .mdlx-fit-width, .mdlx-fit-width-short {
        width: auto !important;
        max-height: 100px !important;
    }

    .mdlx-print-only {
        display: block;
    }

    ol > li {
        margin-left: 10px;
    }

    .ui-accordion .ui-accordion-content {
        overflow: visible !important;
        height: auto !important;
    }

    body {
        width: 1500px !important;
    }

    .mdl-layout {
        overflow: visible !important;
        height: auto !important;
        display: block !important;
    }

    .mdl-layout__container {
        overflow: visible !important;
        height: auto !important;
    }

    .mdl-layout__content {
        overflow: visible !important;
        height: auto !important;
        display: block !important;
    }

    .mdl-grid:not(.mdlx-hide):not(.mdlx-no-print):not(.mdlx-print-chrome):not([style*="display: none"]):not([style*="display:none"]) {
        overflow: visible !important;
        height: auto !important;
        display: block !important;
        width: 100% !important;
    }

    .mdl-cell:not(.mdlx-hide):not(.mdlx-no-print):not(.mdlx-print-chrome):not([style*="display: none"]):not([style*="display:none"]) {
        overflow: visible !important;
        height: auto !important;
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .mdlx-print-align-left {
        text-align: left !important;
    }

    .mdlx-print-align-center {
        text-align: center !important;
    }

    .mdlx-print-align-right {
        text-align: right !important;
    }

    .mdlx-print-word-wrap {
        overflow-wrap: break-word;
        word-wrap: break-word;
        -ms-word-break: break-all;
        /* word-break: break-all; This is the dangerous one in WebKit, as it breaks things wherever */
        /* Instead use this non-standard one: */
        word-break: break-word;
        -ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
    }

    .mdl-shadow--3dp {
        border-left: solid 1px #e4e4e4;
        border-right: solid 1px #e4e4e4;
        border-bottom: solid 1px #757575;
    }

    /**** 3 Columns ****/
    .mdl-cell--3-col {
        width: calc(100% - 22px); /* 22px instead of 16px for border printing */
    }

    .mdlx-print-chrome > .mdl-cell--3-col {
        width: calc(25% - 16px);
    }

    /**** 4 Columns ****/
    .mdl-cell--4-col {
        width: calc(100% - 22px); /* 22px instead of 16px for border printing */
    }

    .mdlx-print-chrome > .mdl-cell--4-col {
        width: calc(33.3333% - 16px);
    }

    /**** 6 Columns ****/
    .mdl-cell--6-col {
        width: calc(100% - 22px); /* 22px instead of 16px for border printing */
    }

    .mdlx-print-chrome > .mdl-cell--6-col {
        width: calc(50% - 16px);
    }

    /**** 12 Columns ****/
    .mdl-cell--12-col {
        width: calc(100% - 22px); /* 22px instead of 16px for border printing */
    }

    .mdlx-print-chrome > .mdl-cell--12-col {
        width: calc(100% - 16px);
    }
}
/*** END: PRINT LAYOUT ***/





/**************************************************/
/* MDLX (customization & extension of MDL)        */
/* (C) Copyright 2017, Aspirian Consulting, LLC   */
/* MDL: Material Design Lite (https://getmdl.io/) */
/* Naming Convention: http://getbem.com/naming/   */
/**************************************************/


/* #region --MDLX FIELD-- */
/* --Field Container */
.mdlx-field {
    border-bottom: 1px solid #e0e0e0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    *display: inline;
    display: inline-block;
    min-height: 28px;
    padding-bottom: 1px;
    vertical-align: top;
    width: 100%;
}

    /* --Border - Invalid */
    .mdlx-field.is-invalid {
        border-bottom: 1px solid rgb(213,0,0);
    }

    /* --Border - Disabled */
    .mdlx-field.is-disabled {
        padding-bottom: 0px;
        border-bottom: 2px dotted #d6d6d6;
        border-bottom: 2px dotted rgba(0, 0, 0, 0.12);
    }

/* --Contrast */
.mdlx-field--contrast {
    background-color: #f4f4f4 !important;
    border-top-left-radius: 7px;
    -moz-border-radius-topleft: 7px;
    -webkit-border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    -moz-border-radius-topright: 7px;
    -webkit-border-top-right-radius: 7px;
}

    /* --Contrast - Invalid */
    .mdlx-field--contrast.is-invalid {
        background-color: #fff0f0 !important;
    }

    /* --Contrast - Disabled */
    .mdlx-field--contrast.is-disabled {
        background-color: #f4f4f4 !important;
    }

/* --Focus Indicator */
.mdlx-field__span--focusindicator {
    background-color: rgb(33,150,243);
    margin-bottom: 2px;
    display: block;
    height: 2px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 4px;
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    width: 0px;
}

/* --Focus Indicator - Invalid */
.mdlx-field.is-invalid .mdlx-field__span--focusindicator {
    background-color: rgb(213,0,0);
}

/* --Focus Indicator - Focused */
.mdlx-field.is-focused .mdlx-field__span--focusindicator {
    width: 100%;
}

/* --Text/Label Color */
.mdlx-textfield .mdl-textfield__input,
.mdlx-radiofield .mdl-radio__label,
.mdlx-checkboxfield .mdl-checkbox__label,
.mdlx-selectfield .mdl-textfield__input {
    color: rgba(0, 0, 102, 0.87);
}

html.-mdlx--ie-8 .mdlx-textfield .mdl-textfield__input,
html.-mdlx--ie-7 .mdlx-textfield .mdl-textfield__input,
html.-mdlx--ie-8 .mdlx-radiofield .mdl-radio__label,
html.-mdlx--ie-7 .mdlx-radiofield .mdl-radio__label,
html.-mdlx--ie-8 .mdlx-checkboxfield .mdl-checkbox__label,
html.-mdlx--ie-7 .mdlx-checkboxfield .mdl-checkbox__label,
html.-mdlx--ie-8 .mdlx-selectfield .mdl-textfield__input,
html.-mdlx--ie-7 .mdlx-selectfield .mdl-textfield__input {
    color: #000066;
}

/* --Text/Label Color - Disabled */
.mdlx-textfield .mdl-textfield__input:disabled,
.mdlx-radiofield.is-disabled .mdl-radio__label,
.mdlx-checkboxfield.is-disabled .mdl-checkbox__label,
.mdlx-selectfield .mdl-textfield__input:disabled {
    /* Disabled text color not supported for IE9 and lower */
    /* Disabled span color not supported for IE8 and lower */
    color: rgba(0,0,0,.39);
}
/* #endregion --MDLX FIELD-- */


/* #region --MDLX TEXT FIELD-- */
.mdlx-textfield--clear-button,
.mdlx-textfield--date-button {
    width: calc(100% - 32px);
}

    .mdlx-textfield--clear-button.mdlx-textfield--date-button {
        width: calc(100% - 64px);
    }

/* Input */
.mdlx-textfield .mdl-textfield__input {
    border: none;
    font-size: 16px !important;
    margin-top: 2px;
    outline: 0;
    padding: 4px 0px 0px 0px;
    text-indent: 5px;
}

    /* --Placeholder */
    .mdlx-textfield .mdl-textfield__input::placeholder {
        color: rgba(0,0,0,.26);
    }

    .mdlx-textfield .mdl-textfield__input::-ms-input-placeholder {
        color: rgba(0,0,0,.26);
    }

    .mdlx-textfield .mdl-textfield__input:-ms-input-placeholder {
        color: rgba(0,0,0,.26);
    }

html.-mdlx--ie-9 .mdlx-textfield.has-placeholder .mdl-textfield__input {
    color: rgba(0,0,0,.26);
}

html.-mdlx--ie-8 .mdlx-textfield.has-placeholder .mdl-textfield__input,
html.-mdlx--ie-7 .mdlx-textfield.has-placeholder .mdl-textfield__input {
    color: #b5b5b5;
}

/* --Remove IE Clear Button */
html.-mdlx--ie-11 .mdlx-textfield .mdl-textfield__input::-ms-clear,
html.-mdlx--ie-11 .mdlx-textfield .mdl-textfield__input::-ms-reveal,
html.-mdlx--ie-10 .mdlx-textfield .mdl-textfield__input::-ms-clear,
html.-mdlx--ie-10 .mdlx-textfield .mdl-textfield__input::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}
/* #endregion --MDLX TEXT FIELD-- */


/* #region --MDLX RADIO FIELD-- */
/* Inner Div */
.mdlx-radiofield__inner-div {
    margin-bottom: -3px;
    margin-top: 3px;
    padding-left: 5px;
}

/* Label (Container) */
.mdlx-radiofield .mdl-radio {
    height: auto;
    min-height: 24px;
}

.mdlx-radiofield.mdlx-field--horizontal .mdl-radio {
    margin-right: 10px;
}

    .mdlx-radiofield.mdlx-field--horizontal .mdl-radio:nth-last-of-type(1) {
        margin-right: 0px;
    }

.mdlx-radiofield.mdlx-field--vertical .mdl-radio {
    display: block;
    margin-bottom: 10px;
}

    .mdlx-radiofield.mdlx-field--vertical .mdl-radio:nth-last-of-type(1) {
        margin-bottom: 0px;
    }

/* Label */
.mdlx-radiofield .mdl-radio__label {
    outline: 0;
    height: auto;
    min-height: 24px;
}

/* Inner Circle */
.mdlx-radiofield .mdl-radio.is-focused .mdl-radio__inner-circle {
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    box-shadow: 0 0 0 10px rgba(0,0,0,.1);
    background-color: rgba(0,0,0,.1);
}

.mdlx-radiofield .mdl-radio.is-focused.is-checked .mdl-radio__inner-circle {
    box-shadow: 0 0 0 10px rgba(33,150,243,.2);
    background-color: rgb(33,150,243);
}
/* #endregion --MDLX RADIO FIELD-- */


/* #region --MDLX CHECKBOX FIELD-- */
/* Inner Div */
.mdlx-checkboxfield__inner-div {
    margin-bottom: -3px;
    margin-top: 3px;
    padding-left: 5px;
}

/* Label (Container)*/
.mdlx-checkboxfield .mdl-checkbox {
    font-size: 16px !important;
    height: auto;
    min-height: 24px;
}

.mdlx-checkboxfield.mdlx-field--horizontal .mdl-checkbox {
    display: inline-block;
    *display: inline;
    margin-right: 10px;
    width: auto !important;
}

    .mdlx-checkboxfield.mdlx-field--horizontal .mdl-checkbox:nth-last-of-type(1) {
        margin-right: 0px;
    }

.mdlx-checkboxfield.mdlx-field--vertical .mdl-checkbox {
    display: block;
    margin-bottom: 10px;
}

    .mdlx-checkboxfield.mdlx-field--vertical .mdl-checkbox:nth-last-of-type(1) {
        margin-bottom: 0px;
    }

/* Label */
.mdlx-checkboxfield .mdl-checkbox__label {
    outline: 0;
    height: auto;
    min-height: 24px;
}
/* #endregion --MDLX CHECKBOX FIELD-- */


/* #region --MDLX SELECT FIELD-- */
/* Select */
.mdlx-selectfield .mdl-textfield__input {
    background-color: transparent !important;
    border: none;
    font-size: 16px !important;
    margin-top: 2px;
    outline: 0;
    padding: 2px 0px 0px 0px;
    text-indent: 1px;
}

/* --FireFox */
@-moz-document url-prefix() {
    .mdlx-selectfield select {
        -moz-appearance: none;
        background: url(/Portals/_default/Skins/MDLX/images/down.ico) right / 20px no-repeat #f4f4f4;
    }
}

/* --IE*/
/*html.-mdlx--ie .mdlx-selectfield select::-ms-value {
    background-color: transparent;
}*/

/* --IE*/
html.-mdlx--ie .mdlx-selectfield select::-ms-expand {
    display: none;
}

/* --IE*/
html.-mdlx--ie .mdlx-selectfield select {
    background: url(/Portals/_default/Skins/MDLX/images/down.ico) right / 20px no-repeat #f4f4f4;
}
/* #endregion --MDLX SELECT FIELD-- */


.mdlx-field-validator {
    color: red;
    display: none;
    font-size: 90%;
    font-weight: bold;
    line-height: 12px;
}

.mdlx-field__label--required:before {
    color: red;
    content: "*";
    font-weight: bold;
}

.mdlx-field__label--pattern-hint {
    color: rgb(33,150,243);
    display: none;
    font-size: 12px;
    font-style: italic;
    font-weight: bold;
    line-height: 12px;
}

.mdlx-combofield .mdlx-textfield {
    width: calc(100% - 38px);
    margin-right: 6px;
}

blockquote.mdlx-blockquote {
    display: block;
    background: #fff;
    padding: 15px 20px 0px 45px;
    margin: 0 0 20px;
    position: relative;
    font-family: Georgia, serif;
    font-size: 16px;
    line-height: 1.2;
    color: #666;
    text-align: justify;
    border-top-color: #e5f3ff;
    border-bottom-color: #e5f3ff;
    border-left: 15px solid #3991d4;
    border-right: 2px solid #2196f3;
    -moz-box-shadow: 2px 2px 15px #ccc;
    -webkit-box-shadow: 2px 2px 15px #ccc;
    box-shadow: 2px 2px 15px #ccc;
}

    blockquote.mdlx-blockquote::before {
        content: "\201C"; /*Unicode for Left Double Quote*/
        font-family: Georgia, serif;
        font-size: 60px;
        font-weight: bold;
        color: #999;
        position: absolute;
        left: 10px;
        top: 5px;
    }

    blockquote.mdlx-blockquote::after {
        /*Reset to make sure*/
        content: "";
    }

.mdlx-card-announcement {
    border: solid 2px #2196f3;
    border-radius: 15px;
}