:root {
    --light-blue: #a1b2d3;
    --medium-blue: #8b9dc3;
    --dark-blue: #6588bf;
    --red: #f0565c;
    --disabled-red: #edaaac;
    --green: #7dac7c;
    --disabled-green: #cde2cc;
    --darker-blue: #637085;
    --disabled-dark-blue: #afc1dd;
    --main-bg: #dfe4e7;
    --yellow: #FFE391;
    --grey: #d1d2d4;
}

/*#region UNIVERSAL */

body {
    color: black;
    background-color: #dfe4e7;
    /*background-color: var(--main-bg);*/
    font-size: 8pt; /* 8pt; */
    font-family: Roboto;
    margin: 0;
    height: 100%;
    width: 100%;
}

.Font {
    font-family: Roboto;
}

.StandardContainer {
    background-color: white;
    padding: 20px;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-left: 10%;
    margin-right: 10%;
    display: block;
    min-width: 60%;
    /* Text */
    text-align: left;
    color: #58585b;
    font-size: small;
    font-weight: normal;
}

.StandardText {
    color: #58585b;
    font-family: Roboto;
}

.WhiteText {
    color: white;
}

.Paragraph {
    font-size: small;
    font-weight: normal;
    color: #58585b;
}

.ShadowFade {
    box-shadow: none;
    -o-transition: box-shadow .1s ease-in-out;
    -moz-transition: box-shadow .1s ease-in-out;
    -webkit-transition: box-shadow .1s ease-in-out;
    transition: box-shadow .1s ease-in-out;
}

    .ShadowFade:hover {
        cursor: pointer;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

.FormLabels {
    float: right;
    padding-right: 5px;
    font-size: x-small;
    font-weight: bold;
    color: #58585b;
}

.Selector {
    width: 100%;
}

.CenterText {
    text-align: center;
}

.LeftText {
    text-align: left;
}

.RightText {
    text-align: right;
    padding-right: 10px;
}

.SText {
    font-size: small;
}

.CenterContent {
    margin: 0 auto;
}

.Center {
    display: flex;
    justify-content: center;
}

.MarginLeft {
    margin-left: auto;
    margin-right: 0;
}

.MarginRight {
    margin-left: 0;
    margin-right: auto;
}

.FullWidth {
    width: 100%;
}

.AutoWidth {
    width: auto;
}

.Width {
    width: 95%;
}

.MWidth {
    width: 75%;
}

.SmallWidth {
    width: 50%;
}

.XSWidth {
    width: 25%;
}

.ThirdWidth {
    width: 33%;
}

.VerticalAlign {
    vertical-align: middle;
}

.SmallPadding {
    padding: 10px;
}

.SPadSide {
    padding-left: 2.5vw;
    padding-right: 2.5vw;
}

.LTopBottomMargin {
    margin-top: 3vw;
    margin-bottom: 3vw;
}

.MTopBottomMargin {
    margin-top: 2vw;
    margin-bottom: 2vw;
}

.STopBottomMargin {
    margin-top: 1vw;
    margin-bottom: 1vw;
}

.SBottomMargin {
    margin-bottom: 1vw;
}

.NoPadMar {
    padding: 0;
    margin: 0;
}

.WhiteBG {
    background-color: white;
}

.GreyBorder {
    border: 5px solid #dddddd;
}

.Align_Right {
    float: right;
    /*padding-right: 15px;*/
}

.Align_Left {
    float: left;
    /*padding-left: 15px;*/
}

.border {
    border: .2vw solid #dddddd;
}

.font14 {
    font-size: 14pt;
}

/*#region FOOTER */

/* OQA Logo in top left header */
#OQA_Header_Img {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 15px;
}

.Footer {
    /*border-top: #000084 3px solid;*/
    background-color: #a1b2d3;
    /*background-color: var(--light-blue);*/
    clear: both;
    display: block;
    font-size: 8pt;
    color: white;
    /*padding-top: .5px;*/
    width: 100vw;
}

    .Footer A:link {
        color: white;
        text-decoration: none;
        font-weight: bold;
    }

    .Footer A:visited {
        color: white;
        text-decoration: none;
    }

    .Footer A:hover {
        color: white;
        text-decoration: underline;
    }

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

/*#endregion */



/*#region HEADER */
.Header {
    font-family: 'Bree Serif', serif;
    font-size: xx-large;
    color: #58585b;
}

.HeaderCommands {
    font-size: 10pt;
    color: #58585b;
    font-weight: normal;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 15px;
    padding-left: 15px;
}


    .HeaderCommands A:visited {
        color: #58585b;
        text-decoration: none;
    }

    .HeaderCommands A:link {
        color: #58585b;
        text-decoration: none;
    }

    .HeaderCommands A:hover {
        color: #58585b;
        text-decoration: underline;
    }

/*#endregion */

/*#endregion */

/*#region HEADER */

.HeadButtons {
    padding: 15px;
}

.RightBorder {
    border-right: solid 2px #dfe4e7;
    /*border-right: solid 2px var(--main-bg);*/
}

/*#endregion */

/*#region MAIN TABS */

.TabPadding {
    display: block;
    padding-top: 10px; /*was 15*/
    padding-bottom: 10px;
}

.TabNavArea {
    color: #ffffff;
    background-color: #a1b2d3;
    /*background-color: var(--light-blue);*/
}

#Tabs {
    /*padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 0px;
	padding-left: 0px;*/
}

.Tab {
    font-size: 11.5pt;
    font-weight: normal;
    text-align: center;
    background-color: inherit;
    margin: auto;
    height: auto;
}

/* TabContainer used for fades */
.TabContainer {
    /*padding-top: 15px;
	padding-bottom: 15px;
	padding-right: 15px;
	padding-left: 15px;*/
    /* Code for fade */
    background-color: #a1b2d3;
    /*background-color: var(--light-blue);*/
    -o-transition: background-color .2s ease-in-out;
    -ms-transition: background-color .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out;
    -webkit-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;
}

    .TabContainer:hover {
        background-color: #6588bf;
        /*background-color: var(--dark-blue);*/
    }

.Tab A:link {
    color: #ffffff;
    text-decoration: none;
}

.Tab A:visited {
    color: #ffffff;
    text-decoration: none;
}

.CurTab {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    font-weight: normal;
    font-family: Verdana;
    padding-left: 0;
    padding-right: 0;
}

    .CurTab A:link {
        color: #ffffff;
        text-decoration: none;
        cursor: default;
    }

    .CurTab A:visited {
        color: #ffffff;
        text-decoration: none;
        cursor: default;
    }

.FirstTab {
    color: #ffffff;
    font-weight: normal;
}

    .FirstTab A:link {
        color: #ffffff;
        text-decoration: none;
    }

    .FirstTab A:visited {
        color: #ffffff;
        text-decoration: none;
    }


/*#endregion */

/*#region SUBTABS */

.SubTabPadding {
    display: block;
    padding-top: 7px; /*was 10px*/
    padding-bottom: 7px;
}

.SubTabNavArea {
    color: white;
    background-color: #8b9dc3;
    /*background-color: var(--medium-blue);*/
}

.SubTab {
    font-family: Roboto;
    font-size: 10pt;
    font-weight: normal;
    text-align: center;
    /*background-color: inherit;*/
}

.SubTabContainer {
    /*padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 15px;
	padding-left: 15px;*/
    /* Code for fade */
    background-color: #8b9dc3;
    /*background-color: var(--medium-blue);*/
    -o-transition: background-color .2s ease-in-out;
    -ms-transition: background-color .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out;
    -webkit-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;
}

    .SubTabContainer:hover {
        background-color: #6588bf;
        /*background-color: var(--dark-blue);*/
    }

.SubTab A:link {
    color: white;
    text-decoration: none;
}

.SubTab A:visited {
    color: white;
    text-decoration: none;
}

.SubTabDivider {
    color: White;
    font-weight: normal;
}

.CurSubTab {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    font-weight: normal;
    margin: auto;
    height: auto;
}

    .CurSubTab A:link {
        color: white;
        text-decoration: none;
        cursor: default;
        font-weight: normal;
    }

    .CurSubTab A:visited {
        color: white;
        text-decoration: none;
        cursor: default;
        font-weight: normal;
    }

.FirstSubTab {
    color: white;
    font-size: 8pt;
}

    .FirstSubTab A:link {
        color: white;
        text-decoration: none;
    }

    .FirstSubTab A:visited {
        color: white;
        text-decoration: none;
    }

.SubTabMargin {
    margin-left: 100px;
    margin-right: 100px;
}

/*#endregion */

/*#region PAGE CONTENT */

.Wrap {
    width: 100%;
    /*padding-top: 20px;
	padding-bottom: 20px;*/
}

.ColPadding {
    padding-left: 20px;
    padding-right: 20px;
}
/* class="ColPadding" */

.FloatLeft {
    float: left;
}

.Column {
    background-color: #f5f5f6;
    /*margin-top: 5vh;
	margin-bottom: 5vh;*/
    /* Text */
    text-align: left;
    color: #58585b;
    font-size: small;
    font-weight: normal;
    padding-bottom: 25px;
}

.Left {
    width: 20vw;
    margin-left: 3vw;
}

.Right {
    width: 73vw;
    margin-left: 1vw;
    /*margin-right: 10vw;*/
    min-height: 20vw;
}

.RightS {
    width: 73vw;
    margin-left: 1vw;
}

.CenterColumn {
    width: 94vw;
}

.ColHeader {
    background-color: #637085;
    /*background-color: var(--darker-blue);*/
    font-weight: bold;
    font-size: large;
    font-style: normal;
    text-decoration: none;
    color: white;
    text-align: center;
    padding: 6px;
    margin: auto;
    margin-bottom: 20px;
}

.PageHeader {
    background-color: none;
    font-weight: bold;
    font-size: large;
    font-style: normal;
    text-decoration: none;
    color: #58585b;
    text-align: center;
    padding-bottom: 5px;
    margin: auto;
}

.ResultsBox {
    height: 200px;
    width: 100%;
}
/* CssClass="ResultsBox" */

.CurrentlySelectedClient {
    padding-bottom: 0;
    padding-top: 15px;
}

.ChartWBG {
    background-color: white;
    padding: 10px;
    margin: 10px;
}

.ButtonColWidth {
    width: 100px;
}

/*#endregion */

/*#region TABLES */

.Table {
    /*margin: 0 auto;*/
    margin-top: 25px;
    margin-bottom: 0 auto;
    margin-left: 0 auto;
    margin-right: 0 auto;
    width: 100%;
    /* Text */
    text-align: center;
    font-weight: normal;
    font-size: large;
    font-style: normal;
    color: #58585b;
}

    .Table td {
        padding-left: 3px;
        padding-right: 3px;
    }

.TableHeader {
    background-color: #d1d2d4;
    /*background-color: var(--grey);*/
    font-weight: bold;
    font-size: small;
    font-style: normal;
    color: #58585b;
    margin: 10px;
}

    .TableHeader a {
        color: #58585b;
        font-style: normal;
        text-decoration: none;
    }

.SubTable { /* Tables within Tables */
    background-color: #f5f5f6;
    border: none;
    /* Text */
    font-family: Roboto;
    font-weight: normal;
    font-style: normal;
    color: #58585b;
}

.TableSelectedRow {
    /*BackColor="#eeeff0" Font-Bold="True" ForeColor="Black"*/
    background-color: #4756CA;
    font-weight: bold;
    color: #58585b;
}

.TableData {
    text-align: center;
    vertical-align: middle;
}

.TableBorder {
    border: #d1d2d4 5px solid;
    /*border: var(--grey) 5px solid;*/
    padding: 15px;
}

.gridview-item {
    font-weight: normal;
    font-size: medium;
    font-style: normal;
    color: #58585b;
}

.SRowHeight {
    height: 4vw;
}

.TblRowBorderText {
    /*border-bottom: 4px solid #dddddd;*/
    border-top: 2px solid #dddddd;
    text-align: left;
    height: 2.6vw;
    font-size: smaller;
    color: #58585b;
}

.BorderCollapse {
    border-collapse: collapse;
}

.CenterTdImg {
    display: block;
    margin: 0 auto;
}

/*#endregion */

/*#region BUTTONS */

button, input[type="button"], input[type="submit"] {
    border: none;
    text-align: center;
    font-family: Roboto;
    padding-bottom: 5px;
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: bold;
    width: 100%;
    /*height: 30px;*/
    margin-top: 5px;
    margin-bottom: 5px;
    /*margin-left: 5px;  causes buttons to be shrunk
    margin-right: 5px;*/
    /* Shadow Fade */
    box-shadow: none;
    -o-transition: box-shadow .1s ease-in-out;
    -moz-transition: box-shadow .1s ease-in-out;
    -webkit-transition: box-shadow .1s ease-in-out;
    transition: box-shadow .1s ease-in-out;
}

.select-btn {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    color: #FFFFFF;
}

    .select-btn:disabled {
        background-color: #afc1dd;
        /*background-color: var(--disabled-dark-blue);*/
    }

/*
CssClass="cancel-btn" 
	BorderStyle="Solid" 
	BorderWidth="2px" 
	BorderColor="#6588BF"
*/
.cancel-btn {
    border: solid 2px;
    border-color: #6588bf;
    /*border-color: var(--dark-blue);*/
    background-color: white;
    color: #6588bf;
    /*color: var(--dark-blue);*/
}

    .cancel-btn:disabled {
        border: solid 2px;
        border-color: #afc1dd;
        /*border-color: var(--disabled-dark-blue);*/
        background-color: white;
        color: #afc1dd;
        /*color: var(--disabled-dark-blue);*/
    }

.open-btn {
    background-color: #7dac7c;
    /*background-color: var(--green);*/
    color: #FFFFFF;
}

    .open-btn:disabled {
        background-color: #cde2cc;
        /*background-color: var(--disabled-green);*/
    }

.delete-btn {
    background-color: #f0565c;
    /*background-color: var(--red);*/
    color: #FFFFFF;
}

    .delete-btn:disabled {
        background-color: #edaaac;
        /*background-color: var(--disabled-red);*/
    }

.save-btn {
    background-color: #7dac7c;
    /*background-color: var(--green);*/
    color: #FFFFFF;
}

    .save-btn:disabled {
        background-color: #cde2cc;
        /*background-color: var(--disabled-green);*/
    }

.search-btn {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    color: #FFFFFF;
}

    .search-btn:disabled {
        background-color: #afc1dd;
        /*background-color: var(--disabled-dark-blue);*/
    }

.new-btn {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    color: #FFFFFF;
}

    .new-btn:disabled {
        background-color: #afc1dd;
        /*background-color: var(--disabled-dark-blue);*/
    }

    /* Button Shadow on hover, no shadow when disabled */
    .select-btn:hover,
    .cancel-btn:hover,
    .open-btn:hover,
    .delete-btn:hover,
    .save-btn:hover,
    .search-btn:hover,
    .new-btn:hover {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        cursor: pointer;
    }

    .select-btn:disabled,
    .cancel-btn:disabled,
    .open-btn:disabled,
    .delete-btn:disabled,
    .save-btn:disabled,
    .search-btn:disabled,
    .new-btn:disabled {
        box-shadow: none;
        cursor: default;
    }

/*
CssClass="PriorityButton"
CssClass="PrimaryButton"
CssClass="SecondaryButton" 
	BorderStyle="Solid" 
	BorderWidth="2px" 
	BorderColor="#6588BF"
CssClass="DestructiveButton"
*/
.PriorityButton {
    background-color: #7dac7c;
    /*background-color: var(--green);*/
    color: #FFFFFF;
}
    /* Green */
    .PriorityButton:disabled {
        background-color: #cde2cc;
        /*background-color: var(--disabled-green);*/
    }

.PrimaryButton {
    background-color: #6588bf;
    /*background-color: var(--dark-blue);*/
    color: #FFFFFF;
}
    /* Blue */
    .PrimaryButton:disabled {
        background-color: #afc1dd;
        /*background-color: var(--disabled-dark-blue);*/
    }

.SecondaryButton {
    border: solid 2px;
    border-color: #6588bf;
    /*border-color: var(--dark-blue);*/
    background-color: white;
    color: #6588bf;
    /*color: var(--dark-blue);*/
}
    /* Blue Border */
    .SecondaryButton:disabled {
        border: solid 2px;
        border-color: #afc1dd;
        /*border-color: var(--disabled-dark-blue);*/
        background-color: white;
        color: #afc1dd;
    }

.DestructiveButton {
    background-color: #f0565c;
    /*background-color: var(--red);*/
    color: #FFFFFF;
}
    /* Red */
    .DestructiveButton:disabled {
        background-color: #edaaac;
        /*background-color: var(--disabled-red);*/
    }

    /* Button Shadow on hover, no shadow when disabled */
    .PriorityButton:hover,
    .PrimaryButton:hover,
    .SecondaryButton:hover,
    .DestructiveButton:hover {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        cursor: pointer;
    }

    .PriorityButton:disabled:hover,
    .PrimaryButton:disabled:hover,
    .SecondaryButton:disabled:hover,
    .DestructiveButton:disabled:hover {
        box-shadow: none;
        cursor: default;
    }

.SmallCenterdButtons {
    width: 40%;
    margin: auto;
}

.XSCenterdButtons {
    width: 25%;
    margin: auto;
}

/*#endregion */

/*#region OTHER */

hr /* Thematic Break */ {
    margin-top: .2em;
    margin-bottom: -.4em;
    color: #313063;
    margin-left: 13px;
    margin-right: 13px;
}

td {
    font-size: 9pt; /* 9pt; */
}

#lblUser {
    font-style: italic;
}

/*#endregion */

/*#region LOGON PAGE */

#OQA_Header_Logon_Img {
    /* Centers img */
    margin: auto;
    display: block;
    padding-top: 50px;
    padding-bottom: 15px;
}

#Employee_Logon_Header {
    text-align: center;
    color: #58585b;
    font-size: xx-large;
    font-weight: normal;
}

.LogonAndErrorHeader {
    text-align: center;
    color: #58585b;
    font-size: xx-large;
    font-weight: normal;
}

#Logon_Form {
    /* Text */
    text-align: center;
    color: #58585b;
    font-size: small;
    font-weight: normal;
    color: #58585b;
}

/* Language, username, pw table */
#tbLogin {
    margin: 0px auto;
    font-size: large;
    font-weight: normal;
    color: #58585b;
}

/*#lblLanguage, #lblUsernameDisplay, #lblPassword {
	float: right;
	padding-right: 5px;
}*/

/*#endregion */

/*#region HOME PAGE */

.HomePageImage {
    /*vertical-align: top;*/
    /*display: block;*/
    /*margin: 0 auto;*/
    max-width: 100%;
    height: auto;
    width: 100%; /* for ie9 */
}

/*#endregion */

/*#region QUESTIONAIRES PAGE */

.Question {
    /* Text */
    color: #58585b;
    font-family: Roboto;
    font-size: small;
    font-weight: bold;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
}

.QuestionText {
    /* Text */
    color: #58585b;
    font-family: Roboto;
    font-size: small;
    font-weight: bold;
    padding: 5px;
    text-align: left;
    vertical-align: middle;
}

.AnswerText {
    color: #58585b;
    font-family: Roboto;
    font-size: 14pt !important;
    font-weight: bold;
    padding: 5px;
    text-align: left;
    vertical-align: middle;
}


/*#endregion */

/*#region REPORTING */
/*#endregion */

/*#region MANAGEMENT */

.LeftColIDs {
    width: 24%;
    text-align: right;
    padding-right: 20px;
    height: 25px;
    color: #58585b;
}

/*#endregion */

/*#region PREFS */
#PrefHeader {
    padding-left: 1vw;
}

.PrefTable {
    border-collapse: collapse;
    width: 100%;
    margin-bottom: 1vw;
}

.PrefTblData {
    border-bottom: .2vw solid #dddddd;
    border-top: .2vw solid #dddddd;
    text-align: left;
    padding: .5vw;
    font-size: small;
    color: #58585b;
}

.PrefTblDataLG {
    border-bottom: .2vw solid #dddddd;
    border-top: .2vw solid #dddddd;
    text-align: left;
    padding: .5vw;
    font-size: 14pt;
    color: #58585b;
}

.TblDataL {
    padding-left: 20px;
}

.TblDataR {
    font-weight: bolder;
}

/*#endregion */