/* blog styles */
/* nav */
.blogLanding .catlinks {
    margin: 40px 0 50px;
    font-weight: normal;
    font-size: 1em;
    text-transform: uppercase;
}

.blogLanding .nav-pills.catlinks>li+li,
.blogLanding .nav-pills.catlinks>li {
    margin: 0;
    padding: 0 5px;
}

.blogLanding .nav-pills.catlinks>li>a {
    padding: 10px 15px;
    transition: background-color 300ms;
    border-radius: 0;
}

.blogLanding .nav.catlinks>li>a:focus,
.blogLanding .nav.catlinks>li>a:hover {
    background-color: transparent;
    color: #003F71;
}

/* landing page */
.dcIntro h1,
.dcIntro .ms-rtestate-field h1,
.dcIntro h1.ms-rteElement-H1 {
    font-size: 36px;
    line-height: 1.3;
    color: #00548E;
}

.dcIntro p {
    font-size: 24px;
    line-height: 1.5;
    color: #58595B;
}

.dcCategory {
    position: relative;
    height: 300px;
    overflow: hidden;
    margin-bottom: 20px;
}

.dcLink>a {
    position: absolute;
    display: block;
    z-index: 50;
    height: 100%;
    width: 100%;
}

.dcDisplayImg {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 10;
    background: #BCBEC0;
}

.dcDisplayImg img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    min-height: 300px;
    opacity: 0;
    transition: opacity 500ms;
}

.dcPreview {
    position: absolute;
    height: 150px;
    width: 100%;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.65);
    z-index: 20;
    padding: 20px;
    color: #fff;
    transition: background-color 300ms;
}

.dcCategory:hover .dcPreview {
    background-color: rgba(0, 0, 0, 0.8);
}

.dcCatDisplay {
    text-transform: uppercase;
    color: #EBAD30;
    font-size: 0.9em;

}

.dcTitleDisplay {
    text-transform: uppercase;
    line-height: 1.3;
    font-weight: bold;
    margin: 10px 0 0;
}

.dcTagDisplay {
    display: none;
}

.dcDetails {
    margin: 10px 0 0;
    font-size: 0.9em;
}

.dcDateDisplay,
.dcAuthorDisplay {
    display: block;
    float: left;
}

.dcDateDisplay:after {
    content: '|';
    margin: 0 10px;
}

/* show/hide specfic areas by category */
.dcCategory.cat-Tips .dcDetails,
.dcArticle.cat-Tips .dcDateDisplay {
    display: none;
}

/* paging */
.dcPaging {
    text-align: center;
    font-size: 24px;
    color: #58595B;
}

.dcPaging>.pageCount {
    margin: 0 30px;
}

/* article view */
.blogPost h2,
.blogPost h3, .blogPost h4 {
    text-transform: none;
}

.dcHeaderInner {
    display: block;
    margin: 20px 0 0;
}

.dcArticle header.topographybg {
    padding-top: 70px;
    margin-bottom: 50px;
    padding-bottom: 50px;
}

.dcArticle header .dcCatDisplay {
    color: #58595B;
    font-weight: bold;
    font-size: 1em;
}

.dcArticle header h1.dcTitleDisplay {
    margin: 0;
    font-size: 2.2em;
    color: #00548E;
    width: 60%;
}

.dcArticle header .dcDetails {
    font-size: 1.2em;
    color: #58595B;
}

.dcArticle .breadcrumbs,
.dcArticle .breadcrumbs a,
.dcArticle .breadcrumbs a:hover {
    color: #58595B;
    text-shadow: none;
}


.dcBody {
    position: relative;
    color: #58595B;
    padding-bottom: 40px;
    opacity: 0;
    transition: opacity 300ms;
}

.dcArticleFooter {
    display: block;
    border-top: 1px solid #BCBEC0;
    color: #58595B;
    margin: 20px 0 0;
    padding: 20px 0;
}

.dcArticleFooter .dcTags {
    margin: 0 0 10px;
}

.dcArticleFooter .dcTags .glyphicon,
.dcArticleFooter .dcCommentsCount .glyphicon {
    width: 20px;
    margin-top: 4px;
    display: block;
    float: left;
}

.dcArticleFooter .dcTags a {
    margin: 0 10px 5px 0;
    border-right: 1px solid #bcbec0;
    padding-right: 10px;
    display: inline-block;
}

.dcArticleFooter .dcTags a:last-child {
    border-right: none;
}

.dcArticleFooter .tagContent,
.dcArticleFooter .commentNumber {
    margin-left: 10px;
    display: block;
    padding-left: 25px;
}

.dcArticleFooter .commentNumber:after {
    content: 'Comments';
    margin-left: 5px;
}




/* images */
.ms-rteElement-RoadRules {
    background: url(/blog/PublishingImages/featured/road-rules-logo.png) no-repeat;
    background-size: 100%;
    height: 125px;
    width: 84px;
    margin: 0 10px 10px 0;
    float:left;
}
.ms-rteElement-Adulting {
    background: url(/blog/PublishingImages/featured/adulting-101.png) no-repeat;
    background-size: 100%;
    height: 100px;
    width: 84px;
    margin: 0 10px 10px 0;
    float:left;
}

.blogWrap .ms-rtePosition-1 {
    /* float left */
    float:left;
    margin: 5px 2% 5px 0 !important;
    width: 48% !important;
    height: auto !important;
}

.blogWrap .ms-rtePosition-2,
.blogWrap.blogPost img {
    /* float right */
    float: right;
    margin: 5px 0 5px 2% !important;
    width: 48% !important;
    height: auto !important;
}

.blogWrap img.ms-rtePosition-4 {
    /* position: middle */
    width: 100% !important;
    height: auto !important;
}

/* sharing */
.dcShare {
    text-align: center;
}

/* comments */
.dcCommentsWrap {
    padding: 50px 0 0;
}

.dcCommentsWrap h2,
.dcCommentsWrap h3.header {
    text-align: center;
    color: #00548E;
    font-size: 34px;
}

.dcCommentsWrap input,
.dcCommentsWrap textarea {
    width: 100%;
}

.dcCommentsWrap .dcCommentBtn {
    font-weight: normal;
}

.dcComment {
    border-top: 1px solid #BCBEC0;
    margin: 10px 0;
    padding: 15px 0 20px 60px;
    color: #58595B;
}

.dcCommentInfo {
    margin: 0 0 10px -60px;
}

.dcCommentInfo i {
    display: block;
    float: left;
    width: 60px;
    font-size: 54px;
    color: #BCBEC0;
}

.dcCommentDisplayName {
    display: block;
    font-weight: bold;
    padding: 3px 0 2px;
}

.dcFormDisclaimer {
    margin: 10px 0;
    font-size: 0.9em;
}

.dcCommentFormContainer h3 {
    color: #58595B;
    margin: 30px 0 10px;
    text-align: center;
}

.dcNoComments {
    text-align: center;
    font-style: italic;
}

/***** tag filtered display *****/
.dcTagHeader {
    color: #58595B;
    font-size: 1em;
    font-weight: normal;
    border-bottom: 1px solid;
    border-top: 1px solid;
    padding: 10px 0;
    text-transform: none;
    line-height: 1.3;
}

.dcTagHeader .dcTagFilter {
    text-transform: uppercase;
    font-weight: bold;
    display: block;
    font-size: 2em;
    color: #00548E;
    height: 40px;
    opacity: 0;
    transition: opacity 300ms;
}

.dcTagHeader .dcTagFilter.showFilter {
    opacity: 1;
}


@media screen and (max-width:1199px) {
    .blogLanding .text-center {
        text-align: left;
    }

    .blogLanding li.endLine {
        border-right: none;
    }

    .blogLanding li.nextLine {
        clear: left;
    }

    .blogLanding .nav-pills.catlinks>li+li,
    .blogLanding .nav-pills.catlinks>li {
        margin: 5px 0;
    }

    .blogLanding .catlinks,
    .dcIntro {
        margin: 0;
    }

    .dcIntro h1 {
        font-size: 2em;
    }

    .dcIntro>p {
        display: none;
    }
}

@media (max-width:767px) {
    .dcArticle header h1.dcTitleDisplay {
        font-size: 0.8em;
    }

    .dcArticle header h1.dcTitleDisplay {
        font-size: 1.4em;
        width: 100%;
        margin-top: 5px;
    }

    .dcArticle header .dcDetails {
        font-size: 1em;
    }

    .dcArticle header.topographybg {
        margin-bottom: 15px;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .blogWrap .ms-rtePosition-1,
    .blogWrap .ms-rtePosition-2,
    .blogWrap.blogPost img,
    .blogWrap img.ms-rtePosition-4 {
        /* all images full-width */
        margin: 5px 0 !important;
        width: 100% !important;
        clear: both;
    }

    .dcIntro h1,
    .dcIntro .ms-rtestate-field h1,
    .dcIntro h1.ms-rteElement-H1 {
        font-size: 24px;
    }

    .dcIntro p {
        font-size: 20px;
        line-height: 1.3;
    }

    .dcCommentsWrap h3.header {
        font-size: 24px;
    }

    .dcTagHeader .dcTagFilter {
        font-size: 1.5em;
        height: 30px;
    }
}

@media (max-width:479px) {
    .dcArticle img {
        width: 100%;
        display: block;
    }
}

/***** polls *****/
.pollWrapper h2 {
    margin-bottom: 0;
}

.pollGroup {
    border-top: 1px dotted;
}

.pollGroup h3 {
    margin-bottom: -15px;
    font-weight: normal;
    border-bottom: 1px solid;
    font-size: 18px;
}

.pollQuestion {
    margin: 30px 0 15px;
    line-height: 1.3;
    font-weight: bold;
}

.pollQuestion span {
    font-style: italic;
    font-weight: bold;
}

.pollQuestion .questionCallout {
    font-weight: bold;
}

.pollTable {
    width: 100%;
    margin-top: 20px;
}

.pollTable:first-of-type {
    margin-top: 0;
}

.pollHead th.all,
.pollHead th.wa,
.pollHead th.or,
.pollBaseline td.all,
.pollBaseline td.wa,
.pollBaseline td.or,
.pollData td.all,
.pollData td.wa,
.pollData td.or {
    text-align: center;
    width: 10%;
}

.pollHead th {
    line-height: 1.3;
    padding: 10px 10px 3px;
    font-size: 1.2em;
}

.pollHead th.pollAnswer {
    font-size: 1em;
}


.pollSubBody .pollHead th.all,
.pollSubBody .pollHead th.wa,
.pollSubBody .pollHead th.or {
    font-size: 14px;
}

.pollHead th.all,
.pollBaseline td.all {
    color: #58595B;
}

.pollHead th.all {
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(88, 89, 91, 0.5) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(88, 89, 91, 0.5) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(88, 89, 91, 0.5) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#e7832d', GradientType=0);
    /* IE6-9 */
}

.pollHead th.wa,
.pollBaseline td.wa {
    color: #7DB6D1;
    color: #58595B;
}

.pollHead th.wa {
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(125, 182, 209, 0.5) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(125, 182, 209, 0.5) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(125, 182, 209, 0.5) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#804c3f2e', GradientType=0);
    /* IE6-9 */
}

.pollHead th.or,
.pollBaseline td.or {
    color: #EBAD30;
    color: #58595B;
}

.pollHead th.or {
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(235, 173, 48, 0.5) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(235, 173, 48, 0.5) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(235, 173, 48, 0.5) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#80566c11', GradientType=0);
    /* IE6-9 */
}

.pollData td.all,
.pollData td.wa,
.pollData td.or {
    color: #fff;
    padding: 3px 4px;
}

.pollData td.all:after,
.pollData td.wa:after,
.pollData td.or:after {
    content: "%";
}

.pollData td.all {
    background: rgba(88, 89, 91, 1);
}

.pollData td.wa {
    background: rgba(125, 182, 209, 1);
}

.pollData td.or {
    background: rgba(235, 173, 48, 1);
}

.pollBaseline {
    background: #F2F2F2;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

.pollBaseline td {
    font-style: italic;
}

.pollBaseline td.baseInfo {
    font-weight: bold;
}

.pollBaseline td.baseInfo:before {
    content: "Base = ";
}

.pollData {
    border-bottom: 1px dotted #58595B;
}

.pollData:first-child {
    border-top: 1px solid #58595B;
}

.pollAnswer {
    background: #f2f2f2;
    line-height: 1.25;
}

.pollData:hover .pollAnswer {
    background: #fff;
    transition: background 300ms;
    cursor: default;
}

.pollData:hover td.all,
.pollData:hover td.or,
.pollData:hover td.wa {
    text-shadow: 1px 1px 2px #000;
    transition: background 300ms, text-shadow 500ms;
    cursor: default;
}

.pollData:hover td.all {
    background: rgba(88, 89, 91, 0.6);
}

.pollData:hover td.or {
    background: rgba(235, 173, 48 0.6);
}

.pollData:hover td.wa {
    background: rgba(125, 182, 209 0.6);

}

.pollBaseline td.baseInfo,
.pollAnswer {
    padding: 3px 10px;
}

.pollData td.all,
.pollData td.wa,
.pollData td.or {
    border-bottom: 1px solid #fff;
}

.pollData:last-of-type td.all,
.pollData:last-of-type td.wa,
.pollData:last-of-type td.or {
    border-bottom: none;
}

.pollData:last-child {
    border-bottom: 1px solid #58595B;
}

.pollFooter {
    margin-top: 30px;
    padding-top: 15px;
    border-top: 1px dotted #58595B;
    font-size: 0.9em;
}

.pollFooter.sideCol {
    margin: 70px 0 0 0;
    padding: 0;
    border: none;
    clear: both;
    position: relative;
}

.pollFooter.sideCol .btn {
    white-space: normal;
    display: block;
    margin-bottom: 10px;
    line-height: 1.3;
}

.pollSubBody {
    margin-left: 7.5%;
}

.pollSubBody .pollQuestion {
    margin: 15px 0 10px;
}

.pollProfile {
    margin: 100px 0 0;
}

.pollWrapper .profileLabelGrey {
    margin: 10px 0 20px;
}

.profileLabelGrey span.title {
    margin-bottom: 2px;
}
/***** widen main head (w/out subs) *****/
.pollHead th.mainWide {
    width:20%;
}

/***** add sub head  *****/
.pollHead th.all.sub,
.pollHead th.wa.sub,
.pollHead th.or.sub,
.pollData td.all.sub,
.pollData td.wa.sub,
.pollData td.or.sub {
    width: 10%;
    border-left: 1px dotted #f2f2f2;
}

.pollData td.wa.sub,
.pollData td.or.sub,
.pollData td.all.sub {
    border-bottom: 1px solid #fff;
}

.pollDataSet tr:last-of-type td.all.sub,
.pollDataSet tr:last-of-type td.wa.sub,
.pollDataSet tr:last-of-type td.or.sub {
    border-bottom: none;
}

.pollHead th.all.subMain,
.pollHead th.wa.subMain,
.pollHead th.or.subMain {
    width: 20%;
}

/*** for 3-col sub ***/
.pollHead th.all.subMain3,
.pollHead th.wa.subMain3,
.pollHead th.or.subMain3 {
    width: 25%;
}

.pollHead th.all.subMain.subMainWide,
.pollHead th.wa.subMain.subMainWide,
.pollHead th.or.subMain.subMainWide {
    width: 35%;
}

.pollHead th.all.sub:first-of-type,
.pollHead th.wa.sub:first-of-type,
.pollHead th.or.sub:first-of-type,
.pollData td.all.sub:first-of-type,
.pollData td.wa.sub:first-of-type,
.pollData td.or.sub:first-of-type {
    border-left: none;
}

.signif {
    font-weight: bold;
    text-decoration: underline;
}

.pollData.average {
    font-weight: bold;
}

.pollData.average td.all:after,
.pollData.average td.wa:after,
.pollData.average td.or:after, 
.pollData td.avgCell:after,
.pollData td.naCell:after {
    content: '';
}

/***** override display:none in sp-responsive.css *****/
table tbody tr td:nth-child(5) {
    display: table-cell;
}

@media (max-width:767px) {
    .pollFooter {
        text-align: center;
    }

    .pollFooter.sideCol {
        text-align: left;
        margin-top: 20px;
        padding-top: 15px;
    }
}

@media (max-width:479px) {
    .pollQuestion {
        font-size: 14px;
        margin: 20px 0 10px;
    }

    .pollHead th.all,
    .pollHead th.wa,
    .pollHead th.or,
    .pollBaseline td.all,
    .pollBaseline td.wa,
    .pollBaseline td.or,
    .pollData td.all,
    .pollData td.wa,
    .pollData td.or {
        width: 13%;
    }

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



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

.pollGroup h3,
.pollGroup h4 {
    line-height: 1.3;
    font-weight: bold;
}

.pollGroup h4 {
    margin-top: 20px;
    font-size: 16px;
}

.pollGroup h4 em,
.pollData.average {
    font-weight: normal;
}

.pollBody {
    margin-bottom: 60px;
}



@media (max-width:479px) {


    /*** for 3-col sub ***/
    .pollHead th.wa.subMain3,
    .pollHead th.or.subMain3 {
        width: 30%;
    }
}

/***** teen driver special *****/
/* graduated licensing tables */
.gradLicense h2 {
    margin-top: 0;
}

.gradLicense .learner,
.gradLicense .license,
.gradLicense .full {
    border-bottom: 2px solid #fff;
}

.gradLicense .lefty,
.gradLicense .lefty a {
    text-transform: uppercase;
    line-height: 1.2;
    font-size: 24px;
    text-align: right;
    border: none;
    color: #fff;
}

.gradLicense .lefty {
    padding: 20px 15px 5px;
}

.gradLicense .righty {
    border-left: 2px solid #fff;
}

.gradLicense .righty div div {
    border-bottom: 1px dotted #4c3f2e;
    padding: 5px 10px;
}

.gradLicense .righty div div:last-child {
    border: none;
}

.gradLicense .righty div div.head {
    font-weight: bold;
    color: #fff;
    border: none;
}

.gradLicense .footer {
    text-align: center;
    padding: 5px 10px;
    background: rgba(130, 121, 111, 0.2);
    font-size: 14px;
    font-style: italic;
    line-height: 1.3;
}

#gradLicenseWA .modalBtns,
#gradLicenseOR .modalBtns {
    text-align: right;
    margin-top: 10px;
}

/***** 2019 *****/
.gradLicense .learner .righty,
.gradLicense .license .righty,
.gradLicense .full .righty {
    background: #f2f2f2;
}

.gradLicense .learner,
.gradLicense .license,
.gradLicense .full {
    background: #58595B;
}

.gradLicense .learner .head,
.gradLicense .license .head,
.gradLicense .full .head {
    background: #00548E;
}

#gradLicenseWA .modal-dialog,
#gradLicenseOR .modal-dialog {
    width: 80%;
}

.gradLicense .footer {
    background: none;
    border-bottom: 1px solid #BCBEC0;
    border-top: 1px solid #BCBEC0;
    padding: 10px 0;
}

#gradLicenseWA h4>span,
#gradLicenseOR h4>span {
    float: right;
    margin-top: -5px;
}

#gradLicenseWA h4>span i,
#gradLicenseOR h4>span i {
    font-weight: bold;
    font-size: 1.2em;
}

#gradLicenseWA h4>span:hover,
#gradLicenseOR h4>span:hover {
    cursor: pointer;
}

.gradLicense h3 a:hover,
.gradLicense h3 a:hover i {
    color: #BCBEC0;
    text-decoration: none;
    transition: color 300ms;
}

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

    #gradLicenseWA .modal-dialog,
    #gradLicenseOR .modal-dialog {
        width: auto;
    }

    .gradLicense .lefty,
    .gradLicense .lefty a {
        text-align: left;
    }

    .gradLicense .righty {
        border: none;
    }
}

@media (max-width:479px) {

    .gradLicense .lefty,
    .gradLicense .lefty a {}

    .gradLicense .lefty {
        padding: 10px;
        border-bottom: 1px dotted #fff;
    }



    .gradLicense .learner,
    .gradLicense .license,
    .gradLicense .full {
        margin-bottom: 15px;
        border: none;
    }
}

/***** quote widget on blog posts *****/
.blogQuoteContainer, .blogQuote {
    display:none;
}
.blogQuoteContainer.containerTop {
    position:absolute;
    top:-50px;
    right:30px;
    top:50px;
}
.blogQuote h3, .blogQuote h3 > span {
    font-weight:900;
    text-transform: uppercase;
}
@media screen and (max-width:991px){
    .blogQuoteContainer.containerTop {
        right:10px;
    }
    .hasQuoteTop .dcArticle header h1.dcTitleDisplay, .hasQuoteTop .dcDetails {
        width:50%;
    }
}
@media screen and (max-width:767px){
    .blogQuoteContainer.containerTop {
        position:relative;
        right:0; 
        width:80%;
    }
    .blogQuoteContainer.containerTop .retrieve {
        display:none;
    }
    .blogQuoteContainer.containerTop .retrieveAndPhone {
        margin: 10px 0 0;
    }
}