﻿/*GENERAL PAGE LAYOUT*/
body { font: "Helvetica Neue",Helvetica,Arial,sans-serif!important; }
h1, h2, h3, h4, h5, h6, p, div { font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; }
h2 { font-size: large; }
p { line-height: 1.6; margin-bottom: 1.0625em!important; }
a { color: #003399; }
.button { margin-top: 1em!important; }
.button:hover { text-decoration: underline; }
a:hover { color: #003399; text-decoration: underline; }
table { width:auto; }
th { width:auto; padding:0em .5em; font-size:.9em!important; border: 1px solid; border-color: #F6F4EB #ACA899 #ACA899 #F6F4EB; background-color: #E8E1CF; padding-bottom: 2px; }
td { width:auto; padding:0em .5em; text-align:center; }
td.add { text-align:center; }
.instructions li { padding: 0.5em; color: #b91e1f; }
#page-content { margin: 7em 0em 1em; }
#reportHeader { background-color: #666666; color: #ffffff; height: 2em; padding: 0.5em; text-transform: uppercase; }
select { border: 1px solid #cccccc; border-radius: 0; color: rgba(0, 0, 0, 0.75); height: 2.7em; line-height: normal; width: auto; }
.sub-title { background-color: #666666; color: #ffffff; height: 2em; padding: 0.5em; text-transform: uppercase; }
.sub-head { font-size: x-small; }
.current-subscription { line-height: 1em; list-style: none; }
/*.current-subscription li{display:inline-block;padding-left:5em;padding-right:5em;list-style-type:none;}*/
#sub-all { margin: 1em 0; }
.sub-add { border: 0.1em solid #666666; background-color: #cccccc; margin: 0.5em; padding: 0.8em; }
.sub-add p { color: #b91e1f; font-size: smaller; margin: 0 auto; }
.label-align { display: block!important; }
.person-img { float: left; }
.edit-subscription { color: #ffffff; float: right; margin-right: 5em; }
.login { border: solid 0.1em #000000; margin: 5em; padding: 5em; }
.unsubscribe { font-size: x-small; margin: auto auto auto 0.5em; text-transform: uppercase; }
.edit { font-size: x-small; margin: auto auto auto auto; text-transform: uppercase; }
.pipe { font-size: x-small; margin: auto 0.25em auto 0.25em; text-transform: uppercase; color: #666666; }
.email { margin: 0!important; }
.reference { font-size: smaller; color: #b91e1f; padding: 0.5em; }
.icon-help { display: inline-block; width: 24px; height: 24px; line-height: 24px; vertical-align: text-top; background-image: url("../images/help-icon.png"); background-repeat: no-repeat; margin: 1.25em .25em 0; }
ul li a { color: #b91e1f; }
ul li a:hover { color: #b91e1f; text-decoration: underline; }
#grid { margin-bottom: 2em; }
.no-click{cursor:default;}


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

    #page-content { margin: 1em 0; }
}

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

    .current-subscription { padding: 0; }
}

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

    .button { width: 100%; }
}

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

    input[type="button"], input[type="reset"] { -webkit-appearance: none; -webkit-border-radius: 5px; }
}


/*SUBSCRIPTION ALERT*/
div.alert-box.success { background-color: #FCF8E3; color: #464543; text-shadow: 0 -.0625em rgba(0,0,0,0); }

/*HEADER*/
#template-header { background-color: #000000; }
#template-header-nav { top: 0.2em; }
#template-header-nav li a { color: #ffffff; padding: 0.5em 1.5em; }
#template-header-nav li a:hover { color: #666666; }
#logo { margin: 0.5em 1.5em 0.5em 0; width: auto; }
#dojdsens-heading { color: #ffffff; font-size: x-large; }
#user { color: #ffffff; /*float: right;*/ font-size: small; list-style: none; margin: 0.5em 1.8em; }
#site-title { background-color: #666666; height: 2em; margin: auto auto 0; }
#epass {
    float: right;
    text-align: right;
    position: relative;
}

#epass ul { /*float: right;*/
    padding: 0;
    margin: 0.5em 1em;
}

#epass li {
    display: inline;
    color: #ffffff;
    font-size: small;
    list-style-type: none;
}

#epass ul li a {
    color: #ffffff;
}


/* Okta login widget */
/* Okta login widget */
#okta-login a {
    color: #0090cb;
}

    #okta-login a:hover {
        color: #0077B2;
    }

#okta-login.login-wrapper {
    width: 300px;
    margin: 30px auto;
    text-align: center;
}

#okta-login .logo {
    width: 150px;
    display: block;
    margin: auto;
    margin-bottom: 0.5rem;
}

#okta-login {
    background-color: #3A5C81;
    border: solid 1px #14365B;
    padding: 0.5rem;
}

#okta-login a.btn {
    display: block;
    text-decoration: none;
    cursor: pointer;
    color: #fff;
    background-color: #7b1212;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #7b1212;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

#okta-login a.btn:hover {
    background: #620000;
}

#okta-login .login-container {
    background-color: #fff;
    text-align: center;
    padding: 1.5rem;
}

#okta-login p {
    margin: 0 !important;
}


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

    #dojdsens-heading { display: inline-block; font-size: x-small; top: -1em; }
}

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

    #template-header-nav { display: inline-block; }
}

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

    #template-header img { width: 20%!important; margin: 0.5em 0.2em; }
}

/*SUBSCRIBE*/
#citywide { padding: 1em 0 0 0.5em;}
.current-subscription { padding: 0!important; }
.subscribe-types { font-weight: bold; text-transform: uppercase; }

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

    .chosen-select, .chosen-container, .chosen-container-multi .chosen-choices li.search-field input[type="text"] { font-size: x-small!important; width: auto!important; }
}


/*FOOTER*/
#template-footer-nav { width: 70em!important; }
#template-footer-nav li { font-size: medium; }
#template-footer img { max-width: 100%; }

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

    #template-footer, #template-footer-nav { height: 16em!important; width: auto!important; }
}

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

    #template-footer-nav li { font-size: small; }
}

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

    #template-footer-nav { width: 60em; }
}

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

    #epass li {
        font-size: x-small;
    }
}

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

    #epass ul {
        margin: 0;
    }
}


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

    #template-footer img { width: 15%; }
}

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

    #template-footer img { width: 20%; }
}


/*PRINT CSS*/
@media print {

    a[href]:after { content: none; }
    #page-content { margin: 1em 0 -2em; }
    h1 { font-size: large!important; }

}

