﻿@media (min-width: 0px) {

    .text-danger {
        /*        color: #A71A28 !important;
*/
        color: #D02536 !important;
    }

    html {
        scroll-behavior: smooth;
        background-color: #333333;
    }

    body {
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-style: normal;
        font-weight: 400;
        word-wrap: break-word;
    }

    #skip a {
        position: absolute;
        left: -10000px;
        top: auto;
        width: 1px;
        height: 1px;
        overflow: hidden;
    }

        #skip a:focus {
            position: static;
            width: auto;
            height: auto;
        }

    .row {
        margin-right: 0px;
    }

    .hr {
        color: #0071ae;
        background-color: #0071ae;
        height: .5px;
        margin-top: 0;
        margin-bottom: 0;
    }

    .hr-thick {
        color: #0071ae;
        background-color: #0071ae;
        height: 2px;
        margin-top: 0;
        margin-bottom: 0;
    }

    h1 {
        font-size: 1.5rem;
        font-family: inherit;
        font-weight: 600;
    }

    h2 {
        font-size: 1.5rem;
        font-family: inherit;
        font-weight: 600;
    }

    .h3-styled {
        font-size: 1.375rem;
        font-family: inherit;
        font-weight: 600;
        line-height: 1.2;
        margin-top: 0;
    }

    h3 {
        font-size: 1.375rem;
        font-family: inherit;
        font-weight: 600;
    }

    h4 {
        font-size: 1.125rem;
        font-family: inherit;
        font-weight: 600;
    }

    .h5-styled {
        font-size: 1.25rem;
        font-family: inherit;
        font-weight: 500;
        line-height: 1.2;
        margin-top: 0;
    }

    .h6-styled {
        font-size: 1rem;
        margin-top: 0;
        margin-bottom: 0.5rem;
        font-weight: 500;
        line-height: 1.2;
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-style: normal;
    }

    legend {
        font-size: 1rem;
        font-family: inherit;
        font-weight: 400;
    }

    a {
        color: #006ba6;
        text-decoration: underline;
    }

    .basis-description {
        padding-left: 0px;
        font-size: 1rem;
        font-style: italic;
    }

    .basis-div {
        margin-bottom: 10px;
        padding-bottom: 5px;
    }

    .basis-hr {
        width: 350px;
        margin-left: 0px;
    }


    .text-dmvblue {
        color: #0b5584;
    }

    .text-red {
        color: #A71A28;
    }

    .text-darkgrey {
        color: #545454;
    }

    input:focus, .btn:focus, select:focus, a:focus, textarea:focus {
        outline: 3px solid #0057AD;
    }

    input[disabled]:focus, .btn[disabled]:focus, select[disabled]:focus, a[disabled]:focus, textarea[disabled]:focus {
        outline: none;
    }

    input:hover, .btn:hover, select:hover, a:hover, textarea:hover {
        outline: 3px solid #0057AD;
    }

    input[disabled]:hover, .btn[disabled]:hover, select[disabled]:hover, a[disabled]:hover, textarea[disabled]:hover {
        outline: none;
    }

    input[type="radio"], input[type="checkbox"] {
        width: 1rem;
        height: 1rem;
        margin-top: .25rem;
    }

    input[type="text"] {
        height: 1.85rem;
    }

    select {
        height: 1.85rem;
    }

    #dmv-agency-brand-text > a {
        text-decoration: none;
    }

    .requiredFields {
/*        color: #A71A28;
*/
        color: #D02536;
        font-weight: 600;
        font-style: italic;
        margin-bottom: 1rem;
    }

    .site-overview {
        margin-bottom: 1.5rem;
    }

    .note-error-alert-heading {
        font-weight: 700;
        font-size: 1rem;
        margin-bottom: 0rem;
    }

    .note {
        border: 1px solid #559cbc;
        border-radius: .375rem;
        color: #545454;
        font-size: 1rem;
        font-weight: 400;
        font-family: inherit;
        text-align: left;
        padding-left: 2.5rem !important;
        padding-right: 2.5rem !important;
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
        margin-bottom: 1.5rem;
    }

    .error {
        border: 1px solid #A71A28;
        border-radius: .375rem;
        color: #545454;
        font-size: 1rem;
        font-weight: 400;
        font-family: inherit;
        text-align: left;
        padding-left: 2.5rem !important;
        padding-right: 2.5rem !important;
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
        margin-bottom: 1.5rem;
    }

    .error-form-element-border {
        box-shadow: 0 0 0 2px #A71A28;
    }

    .alert {
        border: 1px solid #ffc522;
        border-radius: .375rem;
        color: #545454;
        font-size: 1rem;
        font-weight: 400;
        font-family: inherit;
        text-align: left;
        padding-left: 2.5rem !important;
        padding-right: 2.5rem !important;
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
        margin-bottom: 1.5rem;
    }

    .boxed {
        border: 1px solid #000000;
        border-radius: .375rem;
        color: #545454;
        font-size: 1rem;
        font-weight: 400;
        font-family: inherit;
        text-align: center;
        padding-left: 2.5rem !important;
        padding-right: 2.5rem !important;
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
        margin-bottom: 1.5rem;
    }

    .note a, .error a, .alert a, boxed a {
        color: #006ba6;
    }

    .note > p:first-child, .error > p:first-child, .alert > p:first-child, .boxed > p:first-child {
        margin-bottom: 0;
    }

    .note > ul, .alert > ul {
        padding-left: 0;
        padding-right: .25rem;
    }

    #btn-dmv-submit-div {
        overflow: auto;
    }

    .btn-dmv-submit {
        background-color: #43285d;
        color: #ffffff;
        font-size: 1.125rem;
        font-weight: 600px;
        width: 100%;
        max-width: 245px;
        border-radius: .375rem;
        white-space: normal !important;
        word-wrap: break-word !important;
        padding-top: 0.125rem;
        padding-bottom: 0.125rem;
        padding-left: .5rem;
        padding-right: .5rem;
        transition: 0.15s;
        border: 2px solid transparent;
        margin: .25rem .25rem .25rem 0rem;
    }

        .btn-dmv-submit[disabled] {
            background-color: #fff;
            color: #43285d;
            border: #545454 1px solid;
            box-shadow: none;
            outline: none;
        }

        .btn-dmv-submit:hover, .btn-dmv-submit:focus {
            border: 2px solid #ffffff;
            box-shadow: 0 0 0px 3px #43285d;
            color: #ffffff;
            outline: none;
        }

        .btn-dmv-submit[disabled]:hover, .btn-dmv-submit[disabled]:focus {
            background-color: #fff;
            color: #545454;
            border: #545454 1px solid;
            box-shadow: none;
            outline: none;
        }

        .btn-dmv-submit:active {
            background-color: #ffffff;
            color: #0b5584;
            border: 2px solid #ffffff;
            box-shadow: 0 0 0px 3px #0b5584;
            text-shadow: 1px 0 #0b5584;
            outline: none;
        }

    .row-padding {
        padding-left: 15px;
        padding-right: 0px;
    }

    .allow-word-break {
        word-wrap: break-word;
    }

    .information-grouping-box {
        border: 1px solid black;
        padding: 5px;
    }

    /* radio label text alignment */
    input[type="radio"] + label, input[type="checkbox"] + label {
        padding-left: 1.4rem;
        display: inline-block;
    }

    input[type="radio"], input[type="checkbox"] {
        position: absolute;
    }

    /* Tables */
    caption {
        caption-side: top;
        color: #000000;
        text-align: center;
    }

    .displayRow {
        background-color: #ffffff;
        font-size: 1rem;
        font-weight: 400;
        color: #000000;
    }

    .displayHeading {
        color: #000000;
        font-size: 1rem;
        font-weight: 600;
        background-color: #ebebec;
        text-align: center;
    }

    /* header */
    .agency-brand {
        background-color: #435d6e;
    }

        .agency-brand > h1 {
            color: white;
            font-family: DSari-Bold, sans-serif;
            font-size: 1.3rem !important;
            font-weight: 600;
            margin-top: 1.2rem;
            margin-left: .9375rem;
        }

            .agency-brand > h1 > a {
                color: white;
            }

            .agency-brand > h1:hover {
                outline: none;
                box-shadow: 0 0 0px 3px #ffffff;
            }

            .agency-brand > h1 > a:hover {
                outline: none;
            }

            .agency-brand > h1:focus-within {
                box-shadow: 0 0 0px 3px #ffffff;
            }

    .agency-brand-focus-border {
        box-shadow: 0 0 0px 3px #ffffff;
    }

    .agency-brand > h1 > a:focus {
        outline: none;
    }

    .agency-brand > h1 > a > span {
        display: block;
    }


    .agency-brand-fluid {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .grey-header-bar {
        background-color: #657885;
        margin-bottom: 2rem;
    }

    .grey-header-text {
        color: #fff;
        font-size: 1rem;
        font-style: normal;
        font-weight: 600;
        margin-top: .75rem;
        margin-bottom: .75rem;
        margin-left: .9375rem;
    }

    #grey-header-extra-spacing {
        margin-top: 1px;
        margin-bottom: 1px;
    }

    #eDMV-help-link {
        margin-right: .9375rem;
        margin-left: .9375rem;
    }

        #eDMV-help-link img {
            border: 2px solid transparent;
        }

        #eDMV-help-link:hover {
            border: none;
            box-shadow: none;
            outline: none;
        }

            #eDMV-help-link:hover img {
                border: 2px solid #ffffff;
                box-shadow: 0 0 0px 4px #0b5584;
            }

        #eDMV-help-link:focus {
            border: none;
            box-shadow: none;
            outline: none;
        }

            #eDMV-help-link:focus img {
                border: 2px solid #ffffff;
                box-shadow: 0 0 0px 4px #0b5584;
            }

    .links-Profile-logout {
        font-size: 1.125rem;
        font-weight: 600;
        color: #0072BC !important;
    }

    .logout-margin {
        margin-right: 1.55rem;
    }

    /* Body */
    .img-after-header {
        min-width: 60px;
        max-width: 100px;
    }

    .countyClerkNameDiv {
        font-size: 1.125rem;
        font-weight: 600;
    }

    /* Footer */
    .full-width-sm-containter-md {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }

    .links-goToMy-row {
        padding-top: 5rem;
    }

    .links-goToMy {
        font-size: 1.125rem;
        font-weight: 600;
        color: #0072BC !important;
    }

    .disclaimers {
        font-family: inherit;
        font-size: 1rem;
    }

    /* Quick Links */
    .quick-link {
        color: #000000;
        font-size: 1rem;
        font-weight: 600;
        margin-top: .75rem;
    }

    .col-divider {
        border-right: none;
    }

    ul.third-col {
        margin-top: 0;
        padding-top: 0;
        border-color: #000000;
    }

        ul.third-col li {
            list-style: none;
        }

            ul.third-col li a {
                font-size: 1rem;
                font-weight: 400;
                color: #5B5A59;
            }

    .link-dmv-home {
        font-size: 1.25rem;
        font-weight: 600;
        color: #0072BC !important;
    }

    .seal {
        margin-top: 1rem;
    }

    .jurisdiction-page h2.card-title {
        font-size: 1.19rem;
    }
    h2.jurisdiction-page.page-heading {
        font-size: 1.19rem;
    }

}

/* 'Department of Motor Vehicles' header text, to keep in line with 'My Profile' */
@media (min-width: 576px) {
    .agency-brand > h1 {
        margin-left: .5rem;
    }

    .grey-header-text {
        margin-left: .5rem;
    }
}
/* md breakpoint */
@media (min-width: 768px) {
    .note > ul, .alert > ul {
        padding-left: 1rem;
        padding-right: .5rem;
    }

    .agency-brand > h1 {
        margin-top: 1.25rem;
        margin-left: -.5rem;
    }

        .agency-brand > h1 > a > span {
            display: inline;
        }

    .grey-header-text {
        margin-left: -.5rem;
    }

    #eDMV-help-link {
        margin-right: 0rem;
        margin-left: 0rem;
    }

    .logout-padding {
        margin-right: 0rem;
    }

    .col-divider {
        border-left: 1px solid grey;
    }

    .seal {
        margin-top: 4rem;
    }

    .full-width-sm-containter-md {
        max-width: 720px;
    }
}
/* lg breakpoint */
@media (min-width: 992px) {
    .full-width-sm-containter-md {
        max-width: 960px;
    }

    .jurisdiction-page h2.card-title {
        font-size: 1.5rem;
    }
    h2.jurisdiction-page.page-heading {
        font-size: 1.5rem;
    }
}
/* xl breakpoint */
@media (min-width: 1200px) {
    .full-width-sm-containter-md {
        max-width: 1140px;
    }
}

@media (max-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */
    input[type=text] {
        width: 100% !important;
    }
}

@media (max-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
    input[type=text] {
        width: 100% !important;
    }
}

@media (max-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
    input[type=text] {
        width: 100% !important;
    }
}

@media (max-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */
    input[type=text] {
        width: 100% !important;
    }
}

@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */

}

@media (min-width:1281px) { /* hi-res laptops and desktops */

}

