h1 {
    font-family: Lato, Arial, sans-serif;
    font-size: 40px;
}

div.title-area h1 {
    display: inline;
    float: left;
}

span.title-button-area {
    display: none;
    float: right;
    padding-top: 10px;
}

.mobile-header {
    padding: 5px;
}

.mobile-header h3 {
    margin: 0px;
}

.btn {
    margin-left: 3px;
    margin-right: 3px;
}

.btn-primary {
    background: #005293;
}

h3 {
    color: #002663;
}

.hThreeSize {
    /*This is a combination of bootstrap.css and base-theme.css that was used to size an h3 for Sign In.
    Need this for changing h3 tag to h2 and keep h3 size for accessibility*/
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 10px;
    font-size: 24px;
    color: #002663;
}

.hFourSize {
    /*Used for turning h4s into p's.  Could also try h3s maybe?  In conjunction with modal-title seems a situation where debatable to call a heading*/
    font-size: 18px;
    font-weight: 500;
    height: 25px;
    line-height: 25.7143px;
}

h5 {
    font-weight: bold;
}

label {
    margin-top: 5px;
}

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

.boldText {
    display: inline-block;
    margin-bottom: 5px;
    font-weight: 700;
    margin-top: 5px;
}

input[type=radio] + label {
    font-weight: normal;
    color: #000;
}

input.inputError {
    border: 1px #b94a48 solid;
}

.tooltip-image {
    color: #428bca;
    cursor: pointer;
    color: #fff;
    background: #005293;
    border-radius: 50%;
    border: 2px solid #005293;
    font-size: 13px;
}

img.collapse_expand {
    cursor: pointer;
    margin-right: 10px;
    width: 15px;
    height: 15px;
}

footer .col-md-12 {
    padding-top: 10px;
    padding-bottom: 10px;
    background: #005293 url(https://www.unitedconcordia.com/content/dam/ucd/en/sites/unitedconcordia/v2/all_brands/images/shadow-top-25.png) repeat-x left top;
    min-height: 100px;
    margin-top: 20px;
    color: #fff;
    font-size: 11px;
}

.alert {
    border: none;
    font-size: 13px;
    list-style-type: none;
    margin: 20px 0 10px 0;
    padding: 8px 8px 8px 20px;
}

.alert.alert-error {
    background-color: #ffeaea;
}

.alert.alert-warn {
    background-color: #fcf8e3;
}

.alert.alert-success {
    background-color: #dff0d8;
}

#content, #content2, .pill {
    background: #f2f2f2;
    margin-top: 20px;
    padding-bottom: 20px;
    border: 1px solid;
    border-color: #ccc;
}

section.base-theme {
    padding: 10px;
}

input[type=text] {
    border: 1px solid #919191;
}

aside #content2 {
    border: 0px;
    width: 275px;
}

aside ul {
    padding-left: 15px;
}

#content2, .pill {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.pill input[type=checkbox] {

    margin-right: 5px;
}

.aside {
    margin-top: 20px;
    background-color: #F2F2F2;
    border: 1px solid;
    border-color: #ccc;
    width: 77%;
}

div.scrolled {
    height: 400px;
    overflow: scroll;
}


div.expander {
    font-size: smaller;
}

.image {
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
    margin-right: 10px;
}

#content {
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    padding-bottom: 0px;
}

#content section {
    border-top: 1px #cccccc solid;
    border-bottom: 1px #cccccc solid;
    background: #fff;
}

#content section:last-child {
    border-bottom: 0px;
}

main {
    min-height: 400px;
}

main h3, aside h5 {
    margin-left: 15px;
    margin-right: 15px;
}

#content section, #content .pill {
    padding: 15px 15px 15px 15px;
}

main input[type=text], main select {
    /*	width: initial;  */
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px solid #919191;
}

.input-group .password-fix {
    /*    width: inherit;  */
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
}

main .input-group {
    /*	width: inherit; */
    margin-right: 10px;
    margin-bottom: 10px;
}

.basicContent {
    margin-left: 15px;
    margin-top: 20px;
}

.basicSection {
    border: 1px solid;
    border-color: #ccc;
    font-weight: normal;
    color: #002663;
}

.colorBarMember {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-member.png') repeat-y left top;
}

.colorBarDentist {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-dentist.png') repeat-y left top;
}

.colorBarProducer {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-producer.png') repeat-y left top;
}

.colorBarEmployer {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-employer.png') repeat-y left top;
}

.white, .white a {
    color: #fff;
}

.navbarBlue {
    background-color: #006bac;
}

.radioButton {
    margin-left: 15px;
    margin-top: 10px;
}

.memberfont {
    color: #333;
}

.helpBlock {
    display: block;
    margin-bottom: 10px;
    color: #737373;
}

.memberaudience {
    font-weight: normal;
    color: #002663;
}

.memberId {
    font-weight: normal;
    color: #002663;
    padding: 15px;
    margin-top: 20px;
}

.memberAgree {
    background-color: #ffffcc;
    padding: 15px;
    clear: both;
}

.memberAgree .member-agree-error {
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 8px;
}

strong.member {
    color: #002663;
    font-weight: bold;
}

strong.dentist {
    color: #006643;
    font-weight: bold;
}

strong.producer {
    color: #96172E;
    font-weight: bold;
}

strong.employer {
    color: #4B306A;
    font-weight: bold;
}

.needsProducerID {
    width: 97px;
}

.needsProducerIdLegend {
    border-bottom: 0px;
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: bold;
}

.memberInfoBox {
    background-color: #f2f2f2;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 15px;
}

.memberInfoHeader {
    font-weight: 700;
}

/* JRR - Commenting these out for now.

.member{
	border: 1px solid;
	border-color: #ccc;
	font-weight: normal;
	color: #002663;
	clear:both;
}

.dentist{
	border: 1px solid;
	border-color: #ccc;
	font-weight: normal;
	color: #002663;
	clear:both;
}

.producer{
	
	border: 1px solid;
	border-color: #ccc;
	font-weight: normal;
	color: #002663;
	clear:both;
}

.employer{
	
	border: 1px solid;
	border-color: #ccc;
	font-weight: normal;
	color: #002663;
}
*/


.spacer {
    min-height: 2px;
    background: #005293;
}

.form-group {
    margin-top: 10px;
    margin-bottom: 10px;
}

.margin-sides-0 {
    margin-right: 0px;
    margin-left: 0px;
}

.margin-sides-5 {
    margin-right: 5px;
    margin-left: 5px;
}

.margin-sides-10 {
    margin-right: 10px;
    margin-left: 10px;
}

.margin-left-5 {
    margin-left: 5px;
}

.margin-right-5 {
    margin-right: 5px;
}

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

.margin-right-10 {
    margin-right: 10px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.dark-outline {
    border: 1px solid #919191;
}

.ucd-error-msg {
    margin-top: 5px;
    color: #8c3635;
    display: block;
}

.ucd-info-msg {
    margin-left: 10px;
    margin-top: 5px;
    color: #005b00;
    display: block;
}

.ucd-pwd-str {
    /*	float: left;  */
    margin-left: 10px;
    width: 45%;
    margin-top: 5px;
}

.btn1 {
    cursor: pointer;
}

.sign-in-block input[type=text],
.sign-in-block input[type=password] {
    width: 100%;
    margin-bottom: 10px;
    border: 1px solid #919191;
}

.sign-in-block input[type=submit] {
    margin-top: 10px;
}

.sign-in-block a {
    padding-top: 10px;
    padding-bottom: 10px;
}

table.bordered {
    width: 100%;
    border-collapse: inherit; /* Prevents conflict with a Bootstrap bordered class. */
}

table.bordered td {
    padding: 10px 10px 10px 20px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

table.bordered tr:first-child td {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

table.bordered tr:last-child td {
    border-bottom: 1px solid #ccc;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

table.bordered input[type=radio] + label {
    margin-left: 20px;
    margin-right: 10px;
}

/* =================== AUDIENCE DIALOG SPECIFIC RULES =================================== */
table.audience {
    padding: 0px;
    border: 0px;
    width: 100%;
}

table.audience input {
}

table.audience input[type=radio] {
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
}

table.audience td {
    padding: 10px 10px 10px 20px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

table.audience tr:first-child td {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

table.audience tr:last-child td {
    border-bottom: 1px solid #ccc;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

table.audience.memberSelect tr:nth-child(1) td {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-member.png') repeat-y left top;
}

table.audience.dentistSelect tr:nth-child(2) td {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-dentist.png') repeat-y left top;
}

table.audience.producerSelect tr:nth-child(3) td {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-producer.png') repeat-y left top;
}

table.audience.employerSelect tr:nth-child(4) td {
    background: url('/duadrr/resources/com.highmark.duadrr/1_0/img/color-bar-employer.png') repeat-y left top;
}

table.audience.audienceDetail input[type=radio] {
    margin-top: 8px;
}

table.audience.audienceDetail input {
    vertical-align: top;
}

table.audience.audienceDetail input + label:after {
    display: block;
    color: #595959;
    vertical-align: top;
    font-weight: normal;
}

table.audience label {
    width: 75%;
}

table.audience.audienceDetail input[value='member'] + label:after {
    content: "I'd like to see my dental plan's coverage and claims.";
}

table.audience.audienceDetail input[value='dentist'] + label:after {
    content: "I'm a dental worker and need provider tools and information.";
}

table.audience.audienceDetail input[value='producer'] + label:after {
    content: "I sell United Concordia products and services.";
}

table.audience.audienceDetail input[value='employer'] + label:after {
    content: "I'm the administrator for an employee group plan.";
}

/* ====================================================================================== */

.glyphiconLink {
    color: #428bca;
    cursor: pointer;
}

label .glyphicon {
    color: #ffffff;
    background: #005293;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 1px 1px 1px 1px;
}


/* utility and footer horizontal menus */
ul.menu {
    list-style: none;
    margin: 15px 0 20px;
    padding: 0;
}

ul.menu > li {
    display: inline-block;
}

/* image replacement class allows a SEO friendly, performance friendly, and cross-browser
   friendly method of replacing text in a node with a background image */
.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px; /* IE 6/7 fallback, no :before pseudo support there */
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/* hides display of any element with this class from non-print media screens */
/* hide-from-screen class is reversed in the print stylesheet */
.hide-from-screen {
    display: none;
}

#navcontainer {
    background-color: #104F96;
    background-image: -moz-linear-gradient(top, #104F96, #005293);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#104F96), to(#005293));
    background-image: -webkit-linear-gradient(top, #104F96, #005293);
    background-image: -o-linear-gradient(top, #104F96, #005293);
    background-image: -ms-linear-gradient(top, #104F96 0%, #005293 100%);
    background-image: linear-gradient(to bottom, #104F96, #005293);
    /*margin-top: 15px;*/
    padding: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#navcontainer ol {
    margin: 0;
    padding: 0;
    margin-left: 15px;
}

#navcontainer ol li {
    float: left;
    margin-left: 15px;
    margin-right: 10px;
    color: #ffffff;
    white-space: nowrap;
}

#navcontainer ol li:after {
    content: " \2192";
}

#navcontainer ol li.nobullet:after {
    content: none;
}

#navcontainer ol li.current {
    color: #fff;
    font-weight: bold;
}

#navcontainer ol li a {
    color: #cccccc;
    text-style: normal;
}

footer a {
    text-align: center;
    margin-left: auto !important;
    margin-right: auto;
}

footer li a,
footer li a:hover,
footer a:active,
footer a:focus {
    color: #fff;
}


/*
*Bootstrap Overrides
*/

.text-muted {
    color: #545454;
}

a {
    color: #2e6ca2;
}

a:hover, a:focus {
    color: #315668;
}

.container {

    background: #fff;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.25);
    max-width: 960px;
}

h3 {
    margin-top: 10px;
    color: #002663;
}

div.modal-header h3 {
    margin-left: 5px;
}

button.close-modal-icon {
    opacity: 0.6;
}

button.close-modal-icon:hover {
    opacity: 1;
}

div.modal-body {
    /* Hide useless horizontal scrollbar in modals */
    overflow-x: hidden;
}

/* scrollable content in modal dialog */
.scrollable {
    height: 400px;
    overflow: auto;
}

div.helper-text {
    white-space: nowrap;
}

.form-actions {
    padding: 19px 20px 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #F5F5F5;
    border-top: 1px solid #E5E5E5;
}


/*
    Tablet styles
*/

@media screen and (max-width: 991px) {

    .container {
        width: 100%;
    }

    span.title-button-area {
        display: inline;
    }

    footer .col-md-12 {
        padding-top: 10px;
        padding-bottom: 10px;
        background: #005293 url(https://www.unitedconcordia.com/content/dam/ucd/en/sites/unitedconcordia/v2/all_brands/images/shadow-top-25.png) repeat-x left top;
        min-height: 100px;
        margin-top: 0px;
        color: #fff;
        font-size: 11px;
    }

    .fullwidth {
        padding-left: 0px;
        padding-right: 0px;
    }

    aside #content2 {
        background: #ffffff url('/duadrr/resources/com.highmark.duadrr/1_0/img/title-background.png') repeat-x top;
        margin-top: 20px;
        padding-bottom: 20px;
        border: 0px;
        width: 100%;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
    }

    h1 {
        font-size: 29px;

    }

    footer div {
        text-align: center;
    }

    img.big-welcome-image {
        display: none;
    }

    #navcontainer {
        border-radius: 0px;
    }

}

/*
    Phone styles
*/
@media screen and (max-width: 551px) {

    span.title-button-area {
        display: none;
    }

    footer .col-md-12 {
        padding-top: 10px;
        padding-bottom: 10px;
        background: #005293 url(https://www.unitedconcordia.com/content/dam/ucd/en/sites/unitedconcordia/v2/all_brands/images/shadow-top-25.png) repeat-x left top;
        min-height: 100px;
        margin-top: 0px;
        color: #fff;
        font-size: 11px;
    }

    .fullwidth {
        padding-left: 0px;
        padding-right: 0px;
    }

    aside #content2 {
        background: #ffffff url('/duadrr/resources/com.highmark.duadrr/1_0/img/title-background.png') repeat-x top;
        margin-top: 20px;
        padding-bottom: 20px;
        border: 0px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
    }

    #navcontainer {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
    }

    main input[type=text], main select {
        width: 100% !important;
    }

    main .input-dob {
        width: 10%;
    }

    main .input-group {
        width: 100%;
    }

    .ucd-error-msg {
        margin-left: 0px;
        width: 100%;
    }

    #navcontainer ol li {
        font-size: 10px;
    }

    img.big-welcome-image {
        display: none;
    }

    div.helper-text {
        white-space: normal;
    }
}

/* change placeholder text color to satisfy 508 contrast standards */


::-webkit-input-placeholder { /* Edge */
    color: #545454 !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #545454 !important;;
}

::placeholder {
    color: #545454 !important;;
}

/* end 508 CSS changes */


/*Chrome Fix*/

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    label .glyphicon {

        padding: 2px 1px 0px 1px;
    }
}

/* 
 * Print Styles
 */

@media print {
    /* remove all backgrounds */
    * {
        background: none !important;
        filter: none !important;
    }

    /* increase font size on print outs */
    body {
        font-size: 1.0em;
    }

    /* display any element that is hidden from screens but should be printed */
    .hide-from-screen {
        display: block;
    }


}

/* END
 * Print Styles
 */

/* SOC2 Password Success & Locked Account UI */
.password-info-box .lead {
    font-size: 21px;
}

#passwordTips {
    padding-left: 20px;
    font-size: 14px;
}

.moreInfo {
    padding-top: 14px;
}

#toggleInfo {
    text-decoration: none !important;
}

.glyphicon-chevron-up, .glyphicon-chevron-down {
    font-size: 0.77em !important;
}

/* SOC2 Green Checkmarks */
.soc2Checklist {
    font-family: 'Arial';
    list-style: none;
    padding-left: 5px;
    margin-left: 0px;
}

#confirmChecklist {
    padding-left: 5px;
}

.soc2Checklist li {
    display: flex;
    text-align: left;
}

.soc2Checklist span {
    vertical-align: middle;
}

.soc2Checklist span.glyphicon {
    padding-top: 2px;
    text-align: center;
    margin-right: 10px;
    font-size: 15px;
    width: 15px;
    height: 15px;
}

.soc2Checklist span.glyphicon-ok-sign {
    color: green;
}

.soc2Checklist span.glyphicon-circle-arrow-right {
    color: lightgray;
}

.soc2Checklist span.glyphicon-remove {
    color: firebrick;
}

input[type=password] {
    border: 1px solid #919191;
    margin-bottom: 10px;
}

/* special styling for show/hide password button */
.show-hide-password-btn {
    margin-top: 5px;
    padding: 0;
    max-width: 320px;
    float: right;
}

.dropShadow {
    background-image: linear-gradient(#333333, #fff);
    opacity: 0.2;
    height: 8px;
}

.headerGradient {
    height: 60px;
    background-image: linear-gradient(180deg, rgba(233, 233, 233, 1) 0%,
    rgba(233, 233, 233, 1) 0%,
    rgba(254, 254, 253, 1) 100%,
    rgba(254, 254, 253, 1) 100%);
}

.navbarBlue {
    background-color: #006bac;
    height: 35px;
}

.navbarCentered {
    padding-top: 8px;
    padding-bottom: 8px;
}

.navbarCentered.rightAlign {
    text-align: right;
}

.navbarTextWhite {
    color: #fff !important;
}

.navbarTextWhite.glyphiconAligned {
    vertical-align: center;
}

.lato {
    font-family: 'Lato';
}

.ucdDarkBlueHeader {
    color: #4B306A;
    margin-top: 6px;
    font-size: 40px;
}


input[type=date] {
    line-height: inherit;
    border: 1px solid #919191;
}
