html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0px;
    background-color: #f5f8fb;
    background-image: url(/images/back.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
}

table colgroup {
    display: none !important;
}

.dt-search {
    display: none !important;
}

.noleftbody {
    margin-left: 0%;
}

* {
    font-family: 'Open Sans', sans-serif;
    color: #243849;
    box-sizing: border-box;
}

.leftnavbar {
    background-color: #243849;
    padding: 15px 0px;
    width: 150px;
}

.navbar a {
    display: block;
    color: #fff;
    padding: 10px 10px;
    text-decoration: none;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 15px;
    width: 100%;
    text-align: center;
    opacity: 0.7;
    font-weight: 700;
}

    .navbar a:before {
        content: '';
        width: 55px;
        height: 55px;
        display: block;
        border-radius: 50%;
        background-color: #2e485e;
        background-image: url(/images/menuicons.svg);
        background-size: 60px auto;
        background-repeat: no-repeat;
        margin: 5px auto;
        background-position: -3px 3px;
    }

    .navbar a:hover:before {
        background-color: #0c8bd3;
    }

    .navbar a:hover {
        opacity: 1.0;
        color: #0c8bd3;
    }

#menu-activepolicies:before {
    background-position: -2px -43px;
}

#menu-fileclaim:before {
    background-position: -2px -92px;
}

#menu-claimstatus:before {
    background-position: -2px -136px;
}

#menu-users:before {
    background-position: -3px -180px;
}

#menu-billing:before {
    background-position: -2px -222px;
}

#menu-quote:before {
    background-position: -2px -273px;
}

#menu-logout:before {
    background-position: -2px -362px;
}


.header {
    padding: 0px 40px 25px 40px;
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 20px;
}

.header-section {
    width: 50%;
    float: left;
}

    .header-section:nth-of-type(2) {
        text-align: right;
    }

.partnerlogo {
    width: 350px;
    height: 75px;
    background-color: #dfdfdf;
    border: 1px solid #ddd;
    outline: none;
}

.footer {
    padding: 0px 40px 25px 40px;
    /*display: table;*/
    width: 100%;
    font-size: 12px;
    line-height: 20px;
}

    .footer a:hover {
        text-decoration: none;
    }

.layout {
    width: 95%;
    margin: 0px auto;
}

.page {
    padding: 50px;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px;
    solid #ddd;
    display: block;
}

.spacer {
    padding: 10px;
    display: block;
    clear: both;
}

h1 {
    padding: 20px 0px;
    font-size: 25px;
    line-height: 30px;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
    margin: 0;
}

h2 {
    padding: 3px 0px;
    font-size: 20px;
    line-height: 30px;
    color: #0c8bd3;
    margin: 0px;
    margin-bottom: 10px;
}

.top-counter-buckets, .counter-buckets {
    padding: 30px 20px;
    box-sizing: border-box;
    background-color: #fff;
    width: 33%;
    margin-right: 0.3%;
    border: 1px solid #d4e2ee;
    float: left;
    display: inline-block;
}

.top-counter-buckets {
    width: 24.6%;
}

    .top-counter-buckets img, .counter-buckets img {
        width: 80%;
        height: auto;
    }

    .top-counter-buckets b, .counter-buckets b {
        font-size: 40px;
        display: block;
    }

.top-counter-buckets-actions, .counter-buckets-actions {
    font-size: 13px;
    padding-top: 5px;
}

    .top-counter-buckets-actions a, .counter-buckets-actions a {
        color: #0c8bd3;
    }

        .top-counter-buckets-actions a:hover, .counter-buckets-actions a:hover {
            color: #0c8bd3;
            text-decoration: none;
        }

@media (max-width:1579px) {
    .top-counter-buckets {
        min-height: 190px;
    }
}

@media (max-width:1024px) {
    .top-counter-buckets, .counter-buckets {
        width: 100%;
        float: none;
        margin-bottom: 1%;
    }
}

.menutile {
    border-radius: 5px;
    cursor: pointer;
    box-sizing: border-box;
    padding: 30px 0px 30px 0px;
    background-color: #3b4e5e;
    float: left;
    display: inline-block;
    width: 16.3%;
    margin-left: 0.3%;
    text-align: center;
    font-weight: 700;
    color: #fff;
    transition: opacity 0.4s ease;
    text-decoration: none;
    font-size: 16px;
}

    .menutile:hover {
        opacity: 0.5;
    }

    .menutile img {
        width: 70px;
        height: auto;
        margin-top: 10px;
        margin-bottom: 25px;
    }

    .menutile.purple {
        background-color: #572698;
    }

    .menutile.blue {
        background-color: #0c8bd3;
    }

    .menutile.green {
        background-color: #269848;
    }

    .menutile.red {
        background-color: #d14b4f;
    }

    .menutile.yellow {
        background-color: #eba115;
    }

.loginbox {
    background-color: white;
    padding: 40px;
    margin: 0px auto;
    max-width: 500px;
    width: 95%;
}

.main-content.half-container {
    float: left;
    width: 46%;
    margin-right: 4%;
}

.main-content h1 {
    max-width: 400px;
    border-top: 3px solid #243849;
    border-bottom: 3px solid #243849;
    font-weight: 800;
}

.main-content .policyinfo {
    margin-bottom: 30px;
    margin-top: 30px;
}

.case-list-benefits {
    margin: 10px 0;
    padding: 0;
}

    .case-list-benefits li {
        list-style: none;
        padding-bottom: 15px;
        padding-left: 30px;
        margin-left: 10px;
        background-size: 25px 25px;
        background-position: top left;
        background-repeat: no-repeat;
        line-height: 25px;
        font-size: 14px;
    }

        .case-list-benefits li:first-of-type {
            background-image: url(/images/case-icon1.svg);
        }

        .case-list-benefits li:nth-of-type(2) {
            background-image: url(/images/case-icon2.svg);
        }

        .case-list-benefits li:nth-of-type(3) {
            background-image: url(/images/case-icon3.svg);
        }

        .case-list-benefits li:nth-of-type(4) {
            background-image: url(/images/case-icon4.svg);
        }

.case-list-heading {
    clear: both;
}

.cases-graphic {
    width: 100%;
    max-width: 500px;
    height: auto;
    margin-top: 10px;
    margin-bottom: 20px;
}

.form-content.half-container {
    float: left;
    width: 50%;
}

    .form-content.half-container .sub {
        margin-left: 1rem;
        margin-right: 1rem;
    }

.form-content.full-container {
    margin-top: 50px;
    clear: both;
}

.form-content .sub {
    line-height: 1.2em;
    padding-top: 0px;
    border-top: none;
    border-bottom: 1px solid #243849;
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.5px;
}

.form-content.half-container .notice {
    margin-left: 1rem;
    margin-right: 1rem;
}

.form-content .fourth-container {
    width: 31%;
    margin-right: 2%;
    float: left;
}

.form-content.full-container form {
    width: 67%;
    float: left;
}

.form-content .columns {
    clear: both;
}

    .form-content .columns fieldset {
        width: 50%;
        float: left;
    }

.form-content #disclaimer {
    clear: both;
}

fieldset {
    margin: 0;
    padding: 0 0 20px 0;
    border: none;
}

    fieldset .form-subhead {
        font-weight: 700;
        margin-left: 1rem;
        margin-right: 1rem;
        margin-bottom: 20px;
        padding: 0 0 5px 0;
        border-bottom: 1px dotted #ccc;
        padding-inline-start: 0px;
    }

.form-content.full-container fieldset .form-subhead {
    font-size: 18px;
}

.field {
    padding: 10px 0px;
}

form fieldset .notice {
    margin-left: 1rem;
    margin-right: 1rem;
}

.formfield {
    float: left;
    margin-bottom: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
}

    .formfield select, .formfield input {
        min-height: 39px;
    }

    .formfield.half-width {
        width: 50%;
    }

    .formfield.full-width {
        width: 100%;
        clear: both;
    }

    .formfield.third-width {
        width: 33.3%;
    }

#device-insurance-quote-form .coverage-option {
    float: left;
    width: 50%;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-top: 7px;
}

    #device-insurance-quote-form .coverage-option:nth-of-type(odd) {
        padding-left: 0px;
    }

    #device-insurance-quote-form .coverage-option label {
        font-size: 14px;
        display: block;
        width: 88%;
        float: left;
    }

    #device-insurance-quote-form .coverage-option input {
        width: 20px;
        height: 16px;
        min-height: 0px;
        margin-right: 2%;
        display: block;
        float: left;
    }

#device-insurance-quote-form .coverage-container {
    margin-bottom: 20px;
}

    #device-insurance-quote-form .coverage-container .longlabel {
        font-size: 16px;
        font-weight: 700;
    }

#marketing-hardware h2 {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 5px;
    padding: 0;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-hardware p {
    padding: 0 0 20px 0;
    line-height: 1.5em;
}

#marketing-hardware .marketing-hardware-devices {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-hardware .marketing-hardware-devices img {
        width: 100%;
        max-width: 686px;
        height: auto;
    }

#marketing-buyback h2 {
    color: rgb(54,78,98);
    font-size: 44px;
    font-weight: 400;
    margin-top: 50px;
    letter-spacing: -0.03em;
    line-height: 1em;
}

    #marketing-buyback h2 span {
        font-weight: 600;
    }

#marketing-buyback .buyback-subhead {
    font-weight: 500;
    font-size: 18px;
}

#marketing-buyback p {
    line-height: 1.5em;
}

#marketing-buyback h3 {
    font-weight: 500;
    color: #0c8bd3;
    font-size: 30px;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-buyback .buyback-content {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-buyback .buyback-content > img {
        float: right;
        margin-left: 20px;
        width: 50%;
        max-width: 370px;
        height: auto;
    }

    #marketing-buyback .buyback-content .buyback-steps {
        clear: both;
        padding-top: 10px;
        padding-bottom: 20px;
    }

    #marketing-buyback .buyback-content ul {
        margin: 130px 0 0 0;
        padding: 0;
    }

        #marketing-buyback .buyback-content ul li {
            list-style-type: none;
            padding-left: 60px;
            margin-bottom: 20px;
            min-height: 44px;
        }

            #marketing-buyback .buyback-content ul li:first-of-type {
                background: url(/images/device-buyback-icon1.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:nth-of-type(2) {
                background: url(/images/device-buyback-icon2.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:last-of-type {
                background: url(/images/device-buyback-icon3.svg) no-repeat left top;
            }

#marketing-buyback .buyback-devices {
    margin-bottom: 40px;
}

    #marketing-buyback .buyback-devices img {
        width: 100%;
        max-width: 350px;
        height: auto;
    }

#marketing-buyback .buyback-content .buyback-steps img {
    display: block;
    float: left;
    margin-right: 10px;
    position: relative;
    top: -5px;
}

#marketing-buyback .buyback-content .buyback-steps p {
    margin: 20px 0;
    clear: both;
}

@media (min-width: 1001px) {
    #file-claim-serial-form {
        margin-left: -1rem;
        margin-right: -1rem;
    }
}

#file-claim-serial-form .contactinfo-section {
    float: none;
    clear: both;
    min-height: 40px;
}

    #file-claim-serial-form .contactinfo-section input[type="radio"] {
        float: left;
        height: 16px;
        min-height: 0px;
        margin-right: 10px;
    }

    #file-claim-serial-form .contactinfo-section > label {
        float: left;
    }

    #file-claim-serial-form .contactinfo-section .defaultcontact {
        width: 85%;
        padding-bottom: 30px;
    }

    #file-claim-serial-form .contactinfo-section .contact-email {
        word-break: break-all;
    }

#disclaimer p {
    color: #c93a54;
    margin: 0 0 20px 0;
    font-size: 14px;
}

#disclaimer input {
    width: 20px;
    height: 16px;
    min-height: 0px;
    float: left;
    margin-right: 10px;
}

#disclaimer label {
    float: left;
}

#otherform {
    padding-left: 28px;
    padding-top: 30px;
}

    #otherform .formfield {
        padding-left: 0px;
        padding-right: 0px;
        float: none;
        max-width: 400px;
    }

.loginbox .field label {
    display: block;
    font-weight: bold;
    padding-bottom: 5px;
}

textarea {
    min-height: 100px;
}

input[type="text"], textarea, input[type="date"], input[type="password"], input[type="number"], select {
    width: 100%;
    outline: none;
    padding: 7px;
    font-size: 14px;
    background-color: white;
    border: 1px solid #94a6b5;
    border-bottom: 3px solid #94a6b5;
    opacity: 0.7;
    transition: all 0.3s ease;
}

    input[type="text"]:focus, textarea:focus, input[type="date"]:focus, input[type="password"]:focus, input[type="number"]:focus, select:focus {
        border: 1px solid #0c8bd3;
        border-bottom: 3px solid #0c8bd3;
        opacity: 1.0;
    }

.filterrow td input[type="text"], .filterrow td input[type="date"], .filterrow td select,
tr[role=row] th input[type="text"], tr[role=row] th input[type="date"], tr[role=row] th select {
    padding: 3px;
    border: 1px solid #85bddd;
    color: #075481;
    opacity: 0.6;
}

.styledtablewinputs td input[type="text"], .styledtablewinputs td input[type="date"], .styledtablewinputs td select {
    padding: 3px;
    background-color: white;
    border: 1px solid #ddd;
}

    .styledtablewinputs td input[type="text"]:focus {
        border: 1px solid #ddd;
    }

.filterrow td input[type="text"]:focus, .filterrow td input[type="date"]:focus, .filterrow td select:focus,
tr[role=row] th input[type="text"]:focus, tr[role=row] th input[type="date"]:focus, tr[role=row] th select:focus {
    opacity: 0.8;
    border: 1px solid #0c8bd3;
}

.forgotpassword {
    font-size: 12px;
    display: inline-block;
    padding: 10px;
}

    .forgotpassword:hover {
        text-decoration: none;
        color: #0c8bd3;
    }

button {
    cursor: pointer;
    background-color: #243849;
    color: white;
    padding: 10px 18px;
    border-radius: 5px;
    border: 0px;
    font-weight: bold;
    font-size: 16px;
    transition: background-color 0.5s ease;
}

    button.whitebtn {
        background-color: #fafafa;
        border: 1px solid #ddd;
        color: #777;
    }

        button.whitebtn:hover {
            background-color: #e0f4ff;
            color: #0c8bd3;
        }

    button:hover {
        background-color: #0c8bd3;
    }

.add-button-container {
    padding-top: 20px;
    padding-bottom: 10px;
    clear: both;
    width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}

    .add-button-container .add-btn {
        cursor: pointer;
        background-color: #243849;
        color: white;
        padding: 10px 18px;
        border-radius: 5px;
        border: 0px;
        font-weight: bold;
        font-size: 14px;
        transition: background-color 0.5s ease;
    }

        .add-button-container .add-btn:hover {
            background-color: #0c8bd3;
        }

.hide {
    display: none;
}

.show {
    display: block !important;
}

.submit {
    padding-top: 12px;
    padding-left: 1rem;
    padding-right: 1rem;
    clear: both;
}

.scrolltable {
    width: 100%;
    overflow: auto;
}

.layout .heading-content {
    width: 35%;
    float: left;
}

#quoteform .quote-k12devices {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #quoteform .quote-k12devices img {
        width: 100%;
        max-width: 686px;
        height: auto;
    }

.layout .main-content p {
    line-height: 1.7em;
}

.styledtable td {
    font-size: 14px;
    line-height: 18px;
    padding: 20px 20px 20px 0px;
    background-color: #fff;
    border-bottom: 6px solid #f5f8fb;
}

.styledtable th {
    padding-bottom: 15px;
    padding-right: 10px;
    text-align: left;
}

.styledtable tr td:first-of-type, .styledtable tr th:first-of-type {
    padding-left: 20px;
}

.filterrow td, .filterrow th {
    text-align: left;
    background-color: #e0f4ff !important;
    border-bottom: 6px solid #f5f8fb;
}

tr[role=row] th {
    padding-top: 15px;
}

    tr[role=row] th input::placeholder {
        color: #075481;
    }

label[for=dt-length-0] {
    font-size: 12px;
    padding-top: 10px;
    display: inline-block;
    color: #777;
}

.dt-length {
    width: 167px;
    float: right;
    margin-bottom: 19px;
}

    .dt-length select {
        float: left;
        max-width: 60px;
        margin-right: 10px;
    }

.checkboxtd {
    text-align: center !important;
    padding: 20px !important;
}

.filterrow:hover td, tr[role=row]:hover th {
    background-color: #faf1d0;
}

.styledtable tr:hover td {
    background-color: #e8f0f7;
}

.actionbtn {
    color: #0c8bd3;
    cursor: pointer;
    display: inline-block;
    width: 89px;
    font-size: 12px;
    line-height: 13px;
    text-align: left;
    margin-bottom: 5px;
    margin-left: 2px;
    border: 1px solid #0c8bd3;
    padding: 10px 10px 10px 37px;
    text-decoration: none;
    transition: opacity 0.2s ease;
    border-radius: 5px;
    background-image: url(/images/actionbtns.svg);
    background-position: 6px 11px;
    background-repeat: no-repeat;
    background-size: 27px auto;
}

.claimshistoryaction {
    background-position: 6px -32px;
}

.billingaction {
    background-position: 6px -73px;
}

.fileclaimaction, .editaction {
    background-position: 6px -157px;
}

.pdfaction {
    background-position: 6px -123px;
}

.saveaction {
    background-position: 6px -190px;
}

.actionbtn:hover {
    opacity: 0.5;
}

.sub {
    padding: 10px 0px;
    border-bottom: 1px dotted #ddd;
    border-top: 1px dotted #ddd;
    font-size: 15px;
    line-height: 35px;
    margin-bottom: 20px;
    font-weight: 700;
}

.redsub {
    color: #c00;
}

.notice {
    padding: 20px;
    background-color: #ddd;
    margin-bottom: 30px;
}

    .notice .contact-email {
        word-break: break-all;
    }

.greennotice {
    background-color: #b6edea;
}

    .greennotice .policyinfo-num {
        margin: 0 50px 0 0;
        padding: 0;
        display: inline-block;
    }

    .greennotice .policyinfo-device {
        margin: 0;
        padding: 0;
        display: inline-block;
    }

.goldnotice {
    background-color: #faf1d0;
}

.successnotice {
    background-color: #b1ffc9;
    color: #013e01;
    margin-bottom: 10px
}

.errornotice {
    background-color: #ffb1b1;
    color: #971717;
    margin-bottom: 10px
}

.longlabel {
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
}

.jumpbacks {
    display: inline-block;
    background-color: #d2e0ed;
    padding: 10px;
    border-radius: 4px;
    margin: 10px auto;
    width: 300px;
    text-align: center;
    font-size: 12px;
}

    .jumpbacks a {
        text-decoration: none;
        opacity: 0.6;
    }

        .jumpbacks a:hover {
            opacity: 1.0;
        }

.fileclaimbtn {
    text-align: left;
    border-right: 10px solid #fff;
}

tr .fileclaimbtn:last-of-type {
    border-right: 0px solid #fff;
}

.claimskeydesc {
    display: table;
    width: 100%;
}

    .claimskeydesc .ballonkey {
        clear: both;
        display: block;
        height: 31px;
        line-height: 31px;
        font-family: 'Open Sans', sans-serif;
        font-size: 12px;
        color: #888;
    }

        .claimskeydesc .ballonkey img {
            float: left;
            margin-right: 10px;
        }

    .claimskeydesc .ballon {
        font-family: 'Open Sans', sans-serif;
        width: 15.48%;
        float: left;
        margin-left: 0.6%;
        display: inline-block;
        text-align: center;
        font-size: 13px;
        line-height: 15px;
        color: #243849;
        background-color: #fff;
    }

    .claimskeydesc .firstballon {
        margin-left: 0.0% !important;
    }

    .claimskeydesc .ballon.wideballon {
        width: 19.6% !important;
    }

    .claimskeydesc .ballon span {
        display: block;
        font-size: 14px;
        color: #fff;
        font-weight: bold;
        padding: 10px 0px;
        box-sizing: border-box;
        border-radius: 5px;
    }

    .claimskeydesc .claimdesc {
        width: 100%;
        padding: 10px 5px 15px 5px;
        box-sizing: border-box;
        letter-spacing: -0.02em;
    }

        .claimskeydesc .claimdesc.morepadding {
            padding: 10px 26px 15px 26px;
        }

.claimsstatustag {
    display: block;
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 5px 0px;
    border-radius: 5px;
    margin-bottom: 3px;
}

.claimskeyreceived {
    background-color: #888;
}

.claimskeyopen {
    background-color: #0c8bd3;
}

.claimskeypending {
    background-color: #eba115;
}

.claimskeyclosed {
    background-color: #572698;
}

.claimskeypaid {
    background-color: #269848;
}

.claimskeydenied {
    background-color: #d14b4f;
}

.tooltipx {
    display: inline-block;
    position: relative;
}

.tooltipx-bubble {
    display: inline-block;
    background-color: #e0f4ff;
    border: 1px solid #85bddd;
    color: #075481;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    font-size: 13px;
    font-weight: bold;
    line-height: 16px;
    text-align: center;
    cursor: pointer;
}

.tooltipx:hover .tooltipx-content {
    display: inline-block;
}

.tooltipx-content {
    display: none;
    width: 250px;
    position: absolute;
    top: 20px;
    left: 0px;
    background-color: #e0f4ff;
    padding: 10px;
    border: 1px solid #85bddd;
    color: #075481;
    font-size: 12px;
    line-height: 20px;
    border-radius: 7px;
    z-index: 9999;
}

.pagingarrow {
    width: 35px;
    height: 35px;
    background-image: url(/images/arrows.svg);
    background-size: 15px auto;
    background-repeat: no-repeat;
    background-position: 8px 7px;
}

.paging-superback {
}

.paging-back {
    background-position: 8px -28px;
}

.paging-forward {
    background-position: 8px -61px;
}

.paging-superforward {
    background-position: 10px -96px;
}

.pagingarrow:hover {
    background-image: url(/images/arrows-blue.svg);
    background-color: #e0f4ff;
    border: 1px solid #85bddd;
}

.mobilemenutoggle {
    display: none;
}

@media (min-width:1800px) {
    .cases-graphic {
        width: 50%;
        float: right;
    }

    .case-list-heading {
        clear: none;
    }
}

@media (max-width:1000px) {
    .main-content.half-container {
        padding-right: 1rem;
        padding-left: 1rem;
        float: none;
        width: 100%;
        margin-right: 0%;
    }

    .main-content.full-container {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .form-content.half-container {
        float: none;
        width: 100%;
        clear: both;
        margin-top: 50px;
    }

    .form-content.full-container .fourth-container {
        float: none;
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .form-content.full-container form {
        float: none;
        width: 100%;
    }

    .cases-graphic {
        width: 50%;
        float: right;
    }

    .case-list-heading {
        clear: none;
    }

    .form-content .columns fieldset {
        width: 100%;
        float: none;
    }

    #file-claim-serial-form #remitto {
        padding-top: 20px;
    }

    .layout .heading-content {
        width: 50%;
    }

    #quoteform .quote-k12devices {
        width: 50%;
    }

    #marketing-hardware .marketing-hardware-devices {
        display: none;
    }

    #marketing-hardware .heading-content {
        width: 100%;
        float: none;
    }

    #marketing-buyback .buyback-content {
        width: 50%;
    }

        #marketing-buyback .buyback-content > img {
            display: none;
        }

        #marketing-buyback .buyback-content .buyback-steps img {
            margin-bottom: 20px;
        }
}

@media (max-width:800px) {
    #marketing-buyback h2 {
        margin-top: 30px;
        font-size: 36px;
    }

    #marketing-buyback h3 {
        font-size: 26px
    }

    #marketing-buyback .heading-content {
        width: 100%;
        float: none;
    }

    #marketing-buyback .buyback-content {
        width: 100%;
        float: none;
        padding-left: 0px;
    }

        #marketing-buyback .buyback-content .buyback-steps {
            padding-bottom: 10px;
        }

        #marketing-buyback .buyback-content ul {
            margin-top: 20px;
        }

            #marketing-buyback .buyback-content ul li {
                padding-top: 10px;
            }
}

@media (max-width:700px) {
    .styledtable th, .styledtable .filterrow, tr[role=row] {
        display: none;
    }

    .styledtable td {
        display: block;
        width: 100%;
        float: none;
        text-align: center;
        padding: 10px !important;
    }

    .styledtable tr:hover td {
        background-color: #fff !important;
    }

    .styledtable tr td:first-of-type {
        border-bottom: 2px dotted #0c8bd3;
        border-top: 2px dotted #0c8bd3;
    }

    .claimskeydesc .ballon, .claimskeydesc .ballon.wideballon {
        width: 49% !important;
        margin: .1% .1%;
        min-height: 100px;
    }

    .claimskeydesc .claimdesc {
        padding: 10px !important;
    }

    .formfield.third-width {
        width: 50%;
    }

    #device-insurance-quote-form .coverage-option label {
        width: 85%;
    }

    .layout .heading-content {
        width: 100%;
        float: none;
    }

    #quoteform .quote-k12devices {
        display: none;
    }

    #marketing-hardware .marketing-hardware-devices {
        display: none;
    }
}

@media (max-width:600px) {
    .formfield.half-width {
        width: 100%;
    }

    .formfield.third-width {
        width: 100%;
    }

    .cases-graphic {
        display: none;
    }

    #device-insurance-quote-form .coverage-option {
        float: none;
        width: 100%;
        clear: both;
        padding-left: 0;
        padding-top: 7px;
    }

        #device-insurance-quote-form .coverage-option:last-of-type {
            padding-bottom: 20px;
        }
}

@media (max-width:550px) {
    #marketing-buyback .buyback-content ul li {
        padding-top: 0px;
    }
}

hintinline {
    font-size: 12px;
    line-height: 15px;
    color: #999;
}

.bulkactions {
    display: block;
    clear: both;
}

.paging {
    text-align: center;
    display: block;
    clear: both;
    font-size: 12px;
    color: #999;
}

    .bulkactions select, .paging select {
        width: 100px;
        padding: 10px 10px;
        border: 1px solid #ddd;
        font-size: 14px;
        line-height: 18px;
    }

    .paging select {
        width: 60px;
    }

    .bulkactions button, .paging button {
        background-color: #fff;
        border: 1px solid #ddd;
        padding: 10px 10px;
        margin-left: 1px;
        font-size: 14px;
        line-height: 18px;
        font-weight: normal;
        color: #243849;
        border-radius: 0px;
        opacity: 0.7;
        margin-bottom: 3px;
    }

        .bulkactions button:hover {
            background-color: #fff;
            border: 1px solid #ddd;
            opacity: 1.0;
        }

.modal {
    position: fixed;
    background-color: rgba(36, 56, 72, 0.8);
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: auto;
    z-index: 900;
}

    .modal .content {
        padding: 40px;
        margin: 20px auto;
        max-width: 800px;
        width: 90%;
        background-color: white;
        position: relative;
    }

        .modal .content .close {
            position: absolute;
            top: 0px;
            right: 0px;
            background-color: #abd6ef;
            color: #0c8bd3;
            padding: 10px;
            font-size: 15px;
            font-weight: 700;
            cursor: pointer;
        }

green {
    color: #4dbc5e;
}

.required {
    color: #c93a54;
}

.change-logo {
    position: relative;
    max-width: 350px;
    width: 90%;
    display: inline-block;
}

    .change-logo:hover a {
        display: inline-block;
    }

    .change-logo a {
        display: none;
        position: absolute;
        bottom: 0px;
        right: 5px;
    }

.marketingbuckets {
    padding-left: 180px;
    background-repeat: no-repeat;
}

    .marketingbuckets strong {
        display: block;
        margin-bottom: 4px;
    }

.marketingcases {
    background-image: url(/images/marketing-1.png);
}

.marketingbuyback {
    background-image: url(/images/marketing-2.png);
}

.marketinghardware {
    background-image: url(/images/marketing-3.png);
}

@media (max-width:1170px) {

    .header-section {
        width: 100%;
        display: block;
        text-align: center !important;
    }

        .header-section:nth-of-type(2) {
            padding: 20px 0px 20px 0px;
        }

    .footer .header-section:nth-of-type(2) {
        padding: 00px 0px 20px 0px;
    }

    .menutile {
        width: 49%;
        float: none;
        margin-bottom: 1%;
    }

    body {
        margin-left: 0px;
    }

    .leftnavbar {
        text-align: center;
    }

    .leftnavbar, .rightcontent {
        width: 100%;
        float: none;
        display: block;
    }

    .navbar {
        display: none;
        width: 100%;
    }

        .navbar.show {
            display: table !important;
        }

    .mobilemenutoggle {
        margin: 0px auto;
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image: url(/images/menu.svg);
        background-size: contain;
        cursor: pointer;
        background-repeat: no-repeat;
    }

    .mobilemenutoggle-close {
        background-image: url(/images/menu-close.svg);
    }

    .navbar a {
        width: 33%;
        float: left;
        display: inline-block;
    }

    #marketing-buyback .buyback-content .buyback-steps img {
        top: 0px;
    }
}

@media (max-width:1024px) {
    .counter-buckets {
        width: 100%;
        float: none;
        margin-bottom: 1%;
    }
}






.noleftbody {
    margin-left: 0%;
}

* {
    font-family: 'Open Sans', sans-serif;
    color: #243849;
    box-sizing: border-box;
}

.leftnavbar {
    background-color: #243849;
    padding: 15px 0px;
    width: 150px;
}

.navbar a {
    display: block;
    color: #fff;
    padding: 10px 10px;
    text-decoration: none;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 15px;
    width: 100%;
    text-align: center;
    opacity: 0.7;
    font-weight: 700;
}

    .navbar a:before {
        content: '';
        width: 55px;
        height: 55px;
        display: block;
        border-radius: 50%;
        background-color: #2e485e;
        background-image: url(/images/menuicons.svg);
        background-size: 60px auto;
        background-repeat: no-repeat;
        margin: 5px auto;
        background-position: -3px 3px;
    }

    .navbar a:hover:before {
        background-color: #0c8bd3;
    }

    .navbar a:hover {
        opacity: 1.0;
        color: #0c8bd3;
    }

#menu-activepolicies:before {
    background-position: -2px -43px;
}

#menu-fileclaim:before {
    background-position: -2px -92px;
}

#menu-claimstatus:before {
    background-position: -2px -136px;
}

#menu-users:before {
    background-position: -3px -180px;
}

#menu-billing:before {
    background-position: -2px -222px;
}

#menu-quote:before {
    background-position: -2px -273px;
}

#menu-logout:before {
    background-position: -2px -362px;
}

.header-section {
    width: 50%;
    float: left;
}

    .header-section:nth-of-type(2) {
        text-align: right;
    }

.partnerlogo {
    width: 350px;
    height: 75px;
    background-color: #dfdfdf;
    border: 1px solid #ddd;
    outline: none;
}

.layout {
    width: 95%;
    margin: 0px auto;
}

.page {
    padding: 50px;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px;
    solid #ddd;
    display: block;
}

.spacer {
    padding: 10px;
    display: block;
    clear: both;
}

h1 {
    padding: 20px 0px;
    font-size: 25px;
    line-height: 30px;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
    margin: 0;
}

h2 {
    padding: 3px 0px;
    font-size: 20px;
    line-height: 30px;
    color: #0c8bd3;
    margin: 0px;
    margin-bottom: 10px;
}

.counter-buckets {
    padding: 40px 30px;
    box-sizing: border-box;
    background-color: #fff;
    width: 33%;
    margin-right: 0.3%;
    border: 1px solid #d4e2ee;
    float: left;
    display: inline-block;
}

    .counter-buckets img {
        max-width: 80px;
        height: auto;
    }

    .counter-buckets b {
        font-size: 40px;
        display: block;
    }

.counter-buckets-actions {
    font-size: 13px;
    padding-top: 5px;
}

    .counter-buckets-actions a {
        color: #0c8bd3;
    }

        .counter-buckets-actions a:hover {
            color: #0c8bd3;
            text-decoration: none;
        }

.menutile {
    border-radius: 5px;
    cursor: pointer;
    box-sizing: border-box;
    padding: 30px 0px 30px 0px;
    background-color: #3b4e5e;
    float: left;
    display: inline-block;
    width: 16.3%;
    margin-left: 0.3%;
    text-align: center;
    font-weight: 700;
    color: #fff;
    transition: opacity 0.4s ease;
    text-decoration: none;
    font-size: 16px;
}

    .menutile:hover {
        opacity: 0.5;
    }

    .menutile img {
        width: 70px;
        height: auto;
        margin-top: 10px;
        margin-bottom: 25px;
    }

    .menutile.purple {
        background-color: #572698;
    }

    .menutile.blue {
        background-color: #0c8bd3;
    }

    .menutile.green {
        background-color: #269848;
    }

    .menutile.red {
        background-color: #d14b4f;
    }

    .menutile.yellow {
        background-color: #eba115;
    }

.loginbox {
    background-color: white;
    padding: 40px;
    margin: 0px auto;
    max-width: 500px;
    width: 95%;
}

.main-content.half-container {
    float: left;
    width: 46%;
    margin-right: 4%;
}

.main-content h1 {
    max-width: 400px;
    border-top: 3px solid #243849;
    border-bottom: 3px solid #243849;
    font-weight: 800;
}

.main-content .policyinfo {
    margin-bottom: 30px;
    margin-top: 30px;
}

.case-list-benefits {
    margin: 10px 0;
    padding: 0;
}

    .case-list-benefits li {
        list-style: none;
        padding-bottom: 15px;
        padding-left: 30px;
        margin-left: 10px;
        background-size: 25px 25px;
        background-position: top left;
        background-repeat: no-repeat;
        line-height: 25px;
        font-size: 14px;
    }

        .case-list-benefits li:first-of-type {
            background-image: url(/images/case-icon1.svg);
        }

        .case-list-benefits li:nth-of-type(2) {
            background-image: url(/images/case-icon2.svg);
        }

        .case-list-benefits li:nth-of-type(3) {
            background-image: url(/images/case-icon3.svg);
        }

        .case-list-benefits li:nth-of-type(4) {
            background-image: url(/images/case-icon4.svg);
        }

.case-list-heading {
    clear: both;
}

.cases-graphic {
    width: 100%;
    max-width: 500px;
    height: auto;
    margin-top: 10px;
    margin-bottom: 20px;
}

.form-content.half-container {
    float: left;
    width: 50%;
}

    .form-content.half-container .sub {
        margin-left: 1rem;
        margin-right: 1rem;
    }

.form-content.full-container {
    margin-top: 50px;
    clear: both;
}

.form-content .sub {
    line-height: 1.2em;
    padding-top: 0px;
    border-top: none;
    border-bottom: 1px solid #243849;
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.5px;
}

.form-content.half-container .notice {
    margin-left: 1rem;
    margin-right: 1rem;
}

.form-content .fourth-container {
    width: 31%;
    margin-right: 2%;
    float: left;
}

.form-content.full-container form {
    width: 67%;
    float: left;
}

.form-content .columns {
    clear: both;
}

    .form-content .columns fieldset {
        width: 50%;
        float: left;
    }

.form-content #disclaimer {
    clear: both;
}

fieldset {
    margin: 0;
    padding: 0 0 20px 0;
    border: none;
}

    fieldset .form-subhead {
        font-weight: 700;
        margin-left: 1rem;
        margin-right: 1rem;
        margin-bottom: 20px;
        padding: 0 0 5px 0;
        border-bottom: 1px dotted #ccc;
        padding-inline-start: 0px;
    }

.form-content.full-container fieldset .form-subhead {
    font-size: 18px;
}

.field {
    padding: 10px 0px;
}

form fieldset .notice {
    margin-left: 1rem;
    margin-right: 1rem;
}

.formfield {
    float: left;
    margin-bottom: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
}

    .formfield select, .formfield input {
        min-height: 39px;
    }

    .formfield.half-width {
        width: 50%;
    }

    .formfield.full-width {
        width: 100%;
        clear: both;
    }

    .formfield.third-width {
        width: 33.3%;
    }

#device-insurance-quote-form .coverage-option {
    float: left;
    width: 50%;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-top: 7px;
}

    #device-insurance-quote-form .coverage-option:nth-of-type(odd) {
        padding-left: 0px;
    }

    #device-insurance-quote-form .coverage-option label {
        font-size: 14px;
        display: block;
        width: 88%;
        float: left;
    }

    #device-insurance-quote-form .coverage-option input {
        width: 20px;
        height: 16px;
        min-height: 0px;
        margin-right: 2%;
        display: block;
        float: left;
    }

#device-insurance-quote-form .coverage-container {
    margin-bottom: 20px;
}

    #device-insurance-quote-form .coverage-container .longlabel {
        font-size: 16px;
        font-weight: 700;
    }

#marketing-hardware h2 {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 5px;
    padding: 0;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-hardware p {
    padding: 0 0 20px 0;
    line-height: 1.5em;
}

#marketing-hardware .marketing-hardware-devices {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-hardware .marketing-hardware-devices img {
        width: 100%;
        max-width: 686px;
        height: auto;
    }

#marketing-buyback h2 {
    color: rgb(54,78,98);
    font-size: 44px;
    font-weight: 400;
    margin-top: 50px;
    letter-spacing: -0.03em;
    line-height: 1em;
}

    #marketing-buyback h2 span {
        font-weight: 600;
    }

#marketing-buyback .buyback-subhead {
    font-weight: 500;
    font-size: 18px;
}

#marketing-buyback p {
    line-height: 1.5em;
}

#marketing-buyback h3 {
    font-weight: 500;
    color: #0c8bd3;
    font-size: 30px;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-buyback .buyback-content {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-buyback .buyback-content > img {
        float: right;
        margin-left: 20px;
        width: 50%;
        max-width: 370px;
        height: auto;
    }

    #marketing-buyback .buyback-content .buyback-steps {
        clear: both;
        padding-top: 10px;
        padding-bottom: 20px;
    }

    #marketing-buyback .buyback-content ul {
        margin: 130px 0 0 0;
        padding: 0;
    }

        #marketing-buyback .buyback-content ul li {
            list-style-type: none;
            padding-left: 60px;
            margin-bottom: 20px;
            min-height: 44px;
        }

            #marketing-buyback .buyback-content ul li:first-of-type {
                background: url(/images/device-buyback-icon1.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:nth-of-type(2) {
                background: url(/images/device-buyback-icon2.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:last-of-type {
                background: url(/images/device-buyback-icon3.svg) no-repeat left top;
            }

#marketing-buyback .buyback-devices {
    margin-bottom: 40px;
}

    #marketing-buyback .buyback-devices img {
        width: 100%;
        max-width: 350px;
        height: auto;
    }

#marketing-buyback .buyback-content .buyback-steps img {
    display: block;
    float: left;
    margin-right: 10px;
    position: relative;
    top: -5px;
}

#marketing-buyback .buyback-content .buyback-steps p {
    margin: 20px 0;
    clear: both;
}

@media (min-width: 1001px) {
    #file-claim-serial-form {
        margin-left: -1rem;
        margin-right: -1rem;
    }
}

#file-claim-serial-form .contactinfo-section {
    float: none;
    clear: both;
    min-height: 40px;
}

    #file-claim-serial-form .contactinfo-section input[type="radio"] {
        float: left;
        height: 16px;
        min-height: 0px;
        margin-right: 10px;
    }

    #file-claim-serial-form .contactinfo-section > label {
        float: left;
    }

    #file-claim-serial-form .contactinfo-section .defaultcontact {
        width: 85%;
        padding-bottom: 30px;
    }

    #file-claim-serial-form .contactinfo-section .contact-email {
        word-break: break-all;
    }

#disclaimer p {
    color: #c93a54;
    margin: 0 0 20px 0;
    font-size: 14px;
}

#disclaimer input {
    width: 20px;
    height: 16px;
    min-height: 0px;
    float: left;
    margin-right: 10px;
}

#disclaimer label {
    float: left;
}

#otherform {
    padding-left: 28px;
    padding-top: 30px;
}

    #otherform .formfield {
        padding-left: 0px;
        padding-right: 0px;
        float: none;
        max-width: 400px;
    }

.loginbox .field label {
    display: block;
    font-weight: bold;
    padding-bottom: 5px;
}

textarea {
    min-height: 100px;
}

input[type="text"], textarea, input[type="date"], input[type="password"], input[type="number"], input[type="email"], input[type="tel"], select {
    width: 100%;
    outline: none;
    padding: 7px;
    font-size: 14px;
    background-color: white;
    border: 1px solid #94a6b5;
    border-bottom: 3px solid #94a6b5;
    opacity: 0.7;
    transition: all 0.3s ease;
}

    input[type="text"]:focus, textarea:focus, input[type="date"]:focus, input[type="password"]:focus, input[type="number"]:focus, select:focus {
        border: 1px solid #0c8bd3;
        border-bottom: 3px solid #0c8bd3;
        opacity: 1.0;
    }

.filterrow td input[type="text"], .filterrow td input[type="date"], .filterrow td select,
tr[role=row] th input[type="text"], tr[role=row] th input[type="date"], .tr[role=row] th select {
    padding: 3px;
    border: 1px solid #85bddd;
    color: #075481;
    opacity: 0.6;
}

.styledtablewinputs td input[type="text"], .styledtablewinputs td input[type="date"], .styledtablewinputs td select {
    padding: 3px;
    background-color: white;
    border: 1px solid #ddd;
}

    .styledtablewinputs td input[type="text"]:focus {
        border: 1px solid #ddd;
    }

.filterrow td input[type="text"]:focus, .filterrow td input[type="date"]:focus, .filterrow td select:focus
tr[role=row] th input[type="text"]:focus, tr[role=row] th input[type="date"]:focus, tr[role=row] th select:focus {
    opacity: 0.8;
    border: 1px solid #0c8bd3;
}

.forgotpassword {
    font-size: 12px;
    display: inline-block;
    padding: 10px;
}

    .forgotpassword:hover {
        text-decoration: none;
        color: #0c8bd3;
    }

button {
    cursor: pointer;
    background-color: #243849;
    color: white;
    padding: 10px 18px;
    border-radius: 5px;
    border: 0px;
    font-weight: bold;
    font-size: 16px;
    transition: background-color 0.5s ease;
}

    button.whitebtn {
        background-color: #fafafa;
        border: 1px solid #ddd;
        color: #777;
    }

        button.whitebtn:hover {
            background-color: #e0f4ff;
            color: #0c8bd3;
        }

    button:hover {
        background-color: #0c8bd3;
    }

.add-button-container {
    padding-top: 20px;
    padding-bottom: 10px;
    clear: both;
    width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}

    .add-button-container .add-btn {
        cursor: pointer;
        background-color: #243849;
        color: white;
        padding: 10px 18px;
        border-radius: 5px;
        border: 0px;
        font-weight: bold;
        font-size: 14px;
        transition: background-color 0.5s ease;
    }

        .add-button-container .add-btn:hover {
            background-color: #0c8bd3;
        }

.hide {
    display: none;
}

.show {
    display: block !important;
}

.submit {
    padding-top: 12px;
    padding-left: 1rem;
    padding-right: 1rem;
    clear: both;
}

.scrolltable {
    width: 100%;
    overflow: auto;
}

.layout .heading-content {
    width: 35%;
    float: left;
}

#quoteform .quote-k12devices {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #quoteform .quote-k12devices img {
        width: 100%;
        max-width: 686px;
        height: auto;
    }

.layout .main-content p {
    line-height: 1.7em;
}

.styledtable td {
    font-size: 14px;
    line-height: 18px;
    padding: 20px 20px 20px 0px;
    background-color: #fff;
    border-bottom: 6px solid #f5f8fb;
}

.styledtable th {
    padding-bottom: 15px;
    padding-right: 10px;
    text-align: left;
}

.styledtable tr td:first-of-type, .styledtable tr th:first-of-type {
    padding-left: 20px;
}

.checkboxtd {
    text-align: center !important;
    padding: 20px !important;
}

/*.filterrow:hover td, tr[role=row] th {
    background-color: #faf1d0;
}
*/
.styledtable tr:hover td {
    background-color: #e8f0f7;
}

.actionbtn {
    color: #0c8bd3;
    cursor: pointer;
    display: inline-block;
    width: 89px;
    font-size: 12px;
    line-height: 13px;
    text-align: left;
    margin-bottom: 5px;
    margin-left: 2px;
    border: 1px solid #0c8bd3;
    padding: 10px 10px 10px 37px;
    text-decoration: none;
    transition: opacity 0.2s ease;
    border-radius: 5px;
    background-image: url(/images/actionbtns.svg);
    background-position: 6px 11px;
    background-repeat: no-repeat;
    background-size: 27px auto;
}

.claimshistoryaction {
    background-position: 6px -32px;
}

.billingaction {
    background-position: 6px -73px;
}

.fileclaimaction, .editaction {
    background-position: 6px -157px;
}

.pdfaction {
    background-position: 6px -123px;
}

.saveaction {
    background-position: 6px -190px;
}

.actionbtn:hover {
    opacity: 0.5;
}

.sub {
    padding: 10px 0px;
    border-bottom: 1px dotted #ddd;
    border-top: 1px dotted #ddd;
    font-size: 15px;
    line-height: 35px;
    margin-bottom: 20px;
    font-weight: 700;
}

.redsub {
    color: #c00;
}

.notice {
    padding: 20px;
    background-color: #ddd;
    margin-bottom: 30px;
}

    .notice .contact-email {
        word-break: break-all;
    }

.greennotice {
    background-color: #b6edea;
}

    .greennotice .policyinfo-num {
        margin: 0 50px 0 0;
        padding: 0;
        display: inline-block;
    }

    .greennotice .policyinfo-device {
        margin: 0;
        padding: 0;
        display: inline-block;
    }

.goldnotice {
    background-color: #faf1d0;
}

.successnotice {
    background-color: #b1ffc9;
    color: #013e01;
    margin-bottom: 10px
}

.errornotice {
    background-color: #ffb1b1;
    color: #971717;
    margin-bottom: 10px
}

.longlabel {
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
}

.jumpbacks {
    display: inline-block;
    background-color: #d2e0ed;
    padding: 10px;
    border-radius: 4px;
    margin: 10px auto;
    width: 300px;
    text-align: center;
    font-size: 12px;
}

    .jumpbacks a {
        text-decoration: none;
        opacity: 0.6;
    }

        .jumpbacks a:hover {
            opacity: 1.0;
        }

.fileclaimbtn {
    text-align: left;
    border-right: 10px solid #fff;
}

tr .fileclaimbtn:last-of-type {
    border-right: 0px solid #fff;
}

.claimskeydesc {
    display: table;
    width: 100%;
}

    .claimskeydesc .ballonkey {
        clear: both;
        display: block;
        height: 31px;
        line-height: 31px;
        font-family: 'Open Sans', sans-serif;
        font-size: 12px;
        color: #888;
    }

        .claimskeydesc .ballonkey img {
            float: left;
            margin-right: 10px;
        }

    .claimskeydesc .ballon {
        font-family: 'Open Sans', sans-serif;
        width: 15.48%;
        float: left;
        margin-left: 0.6%;
        display: inline-block;
        text-align: center;
        font-size: 13px;
        line-height: 15px;
        color: #243849;
        background-color: #fff;
    }

    .claimskeydesc .firstballon {
        margin-left: 0.0% !important;
    }

    .claimskeydesc .ballon.wideballon {
        width: 19.6% !important;
    }

    .claimskeydesc .ballon span {
        display: block;
        font-size: 14px;
        color: #fff;
        font-weight: bold;
        padding: 10px 0px;
        box-sizing: border-box;
        border-radius: 5px;
    }

    .claimskeydesc .claimdesc {
        width: 100%;
        padding: 10px 5px 15px 5px;
        box-sizing: border-box;
        letter-spacing: -0.02em;
    }

        .claimskeydesc .claimdesc.morepadding {
            padding: 10px 26px 15px 26px;
        }

.claimsstatustag {
    display: block;
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 5px 0px;
    border-radius: 5px;
    margin-bottom: 3px;
}

.claimskeyreceived {
    background-color: #888;
}

.claimskeyopen {
    background-color: #0c8bd3;
}

.claimskeypending {
    background-color: #eba115;
}

.claimskeyclosed {
    background-color: #572698;
}

.claimskeypaid {
    background-color: #269848;
}

.claimskeydenied {
    background-color: #d14b4f;
}

.tooltipx {
    display: inline-block;
    position: relative;
}

.tooltip-bubble {
    display: inline-block;
    background-color: #e0f4ff;
    border: 1px solid #85bddd;
    color: #075481;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    font-size: 13px;
    font-weight: bold;
    line-height: 16px;
    text-align: center;
    cursor: pointer;
}

.tooltipx:hover .tooltip-content {
    display: inline-block;
}

.tooltip-content {
    display: none;
    width: 250px;
    position: absolute;
    top: 20px;
    left: 0px;
    background-color: #e0f4ff;
    padding: 10px;
    border: 1px solid #85bddd;
    color: #075481;
    font-size: 12px;
    line-height: 20px;
    border-radius: 7px;
    z-index: 9999;
}

.pagingarrow {
    width: 35px;
    height: 35px;
    background-image: url(/images/arrows.svg);
    background-size: 15px auto;
    background-repeat: no-repeat;
    background-position: 8px 7px;
}

.paging-superback {
}

.paging-back {
    background-position: 8px -28px;
}

.paging-forward {
    background-position: 8px -61px;
}

.paging-superforward {
    background-position: 10px -96px;
}

.pagingarrow:hover {
    background-image: url(/images/arrows-blue.svg);
    background-color: #e0f4ff;
    border: 1px solid #85bddd;
}

@media (min-width:1800px) {
    .cases-graphic {
        width: 50%;
        float: right;
    }

    .case-list-heading {
        clear: none;
    }
}

@media (max-width:1000px) {
    .main-content.half-container {
        padding-right: 1rem;
        padding-left: 1rem;
        float: none;
        width: 100%;
        margin-right: 0%;
    }

    .main-content.full-container {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .form-content.half-container {
        float: none;
        width: 100%;
        clear: both;
        margin-top: 50px;
    }

    .form-content.full-container .fourth-container {
        float: none;
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .form-content.full-container form {
        float: none;
        width: 100%;
    }

    .cases-graphic {
        width: 50%;
        float: right;
    }

    .case-list-heading {
        clear: none;
    }

    .form-content .columns fieldset {
        width: 100%;
        float: none;
    }

    #file-claim-serial-form #remitto {
        padding-top: 20px;
    }

    .layout .heading-content {
        width: 50%;
    }

    #quoteform .quote-k12devices {
        width: 50%;
    }

    #marketing-hardware .marketing-hardware-devices {
        display: none;
    }

    #marketing-hardware .heading-content {
        width: 100%;
        float: none;
    }

    #marketing-buyback .buyback-content {
        width: 50%;
    }

        #marketing-buyback .buyback-content > img {
            display: none;
        }

        #marketing-buyback .buyback-content .buyback-steps img {
            margin-bottom: 20px;
        }
}

@media (max-width:800px) {
    #marketing-buyback h2 {
        margin-top: 30px;
        font-size: 36px;
    }

    #marketing-buyback h3 {
        font-size: 26px
    }

    #marketing-buyback .heading-content {
        width: 100%;
        float: none;
    }

    #marketing-buyback .buyback-content {
        width: 100%;
        float: none;
        padding-left: 0px;
    }

        #marketing-buyback .buyback-content .buyback-steps {
            padding-bottom: 10px;
        }

        #marketing-buyback .buyback-content ul {
            margin-top: 20px;
        }

            #marketing-buyback .buyback-content ul li {
                padding-top: 10px;
            }
}

@media (max-width:700px) {
    .styledtable th, .styledtable .filterrow, tr[role=row] th {
        display: none;
    }

    .styledtable td {
        display: block;
        width: 100%;
        float: none;
        text-align: center;
        padding: 10px !important;
    }

    .styledtable tr:hover td {
        background-color: #fff !important;
    }

    .styledtable tr td:first-of-type {
        border-bottom: 2px dotted #0c8bd3;
        border-top: 2px dotted #0c8bd3;
    }

    .claimskeydesc .ballon, .claimskeydesc .ballon.wideballon {
        width: 49% !important;
        margin: .1% .1%;
        min-height: 100px;
    }

    .claimskeydesc .claimdesc {
        padding: 10px !important;
    }

    .formfield.third-width {
        width: 50%;
    }

    #device-insurance-quote-form .coverage-option label {
        width: 85%;
    }

    .layout .heading-content {
        width: 100%;
        float: none;
    }

    #quoteform .quote-k12devices {
        display: none;
    }

    #marketing-hardware .marketing-hardware-devices {
        display: none;
    }
}

@media (max-width:600px) {
    .formfield.half-width {
        width: 100%;
    }

    .formfield.third-width {
        width: 100%;
    }

    .cases-graphic {
        display: none;
    }

    #device-insurance-quote-form .coverage-option {
        float: none;
        width: 100%;
        clear: both;
        padding-left: 0;
        padding-top: 7px;
    }

        #device-insurance-quote-form .coverage-option:last-of-type {
            padding-bottom: 20px;
        }
}

@media (max-width:550px) {
    #marketing-buyback .buyback-content ul li {
        padding-top: 0px;
    }
}

hintinline {
    font-size: 12px;
    line-height: 15px;
    color: #999;
}

.bulkactions {
    display: block;
    clear: both;
}

.paging {
    text-align: center;
    display: block;
    clear: both;
    font-size: 12px;
    color: #999;
}

    .bulkactions select, .paging select {
        width: 100px;
        padding: 10px 10px;
        border: 1px solid #ddd;
        font-size: 14px;
        line-height: 18px;
    }

    .paging select {
        width: 60px;
    }

    .bulkactions button, .paging button {
        background-color: #fff;
        border: 1px solid #ddd;
        padding: 10px 10px;
        margin-left: 1px;
        font-size: 14px;
        line-height: 18px;
        font-weight: normal;
        color: #243849;
        border-radius: 0px;
        opacity: 0.7;
        margin-bottom: 3px;
    }

        .bulkactions button:hover {
            background-color: #fff;
            border: 1px solid #ddd;
            opacity: 1.0;
        }

.modal {
    position: fixed;
    background-color: rgba(36, 56, 72, 0.8);
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: auto;
}

    .modal .content {
        padding: 40px;
        margin: 20px auto;
        max-width: 800px;
        width: 90%;
        background-color: white;
        position: relative;
    }

        .modal .content .close {
            position: absolute;
            top: 0px;
            right: 0px;
            background-color: #abd6ef;
            color: #0c8bd3;
            padding: 10px;
            font-size: 15px;
            font-weight: 700;
            cursor: pointer;
        }

green {
    color: #4dbc5e;
}

.required {
    color: #c93a54;
}

.change-logo {
    position: relative;
    max-width: 350px;
    width: 90%;
    display: inline-block;
}

    .change-logo:hover a {
        display: inline-block;
    }

    .change-logo a {
        display: none;
        position: absolute;
        bottom: 0px;
        right: 5px;
    }

.marketingbuckets {
    padding-left: 180px;
    background-repeat: no-repeat;
}

    .marketingbuckets strong {
        display: block;
        margin-bottom: 4px;
    }

.marketingcases {
    background-image: url(/images/marketing-1.png);
}

.marketingbuyback {
    background-image: url(/images/marketing-2.png);
}

.marketinghardware {
    background-image: url(/images/marketing-3.png);
}

@media (max-width:1170px) {

    .header-section {
        width: 100%;
        display: block;
        text-align: center !important;
    }

        .header-section:nth-of-type(2) {
            padding: 20px 0px 20px 0px;
        }

    .footer .header-section:nth-of-type(2) {
        padding: 0px 0px 20px 0px;
    }

    .menutile {
        width: 49%;
        float: none;
        margin-bottom: 1%;
    }

    body {
        margin-left: 0px;
    }

    .leftnavbar {
        text-align: center;
    }

    .leftnavbar, .rightcontent {
        width: 100%;
        float: none;
        display: block;
    }

    .navbar {
        display: none;
        width: 100%;
    }

        .navbar.show {
            display: table !important;
        }

    .mobilemenutoggle {
        margin: 0px auto;
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image: url(/images/menu.svg);
        background-size: contain;
        cursor: pointer;
        background-repeat: no-repeat;
    }

    .mobilemenutoggle-close {
        background-image: url(/images/menu-close.svg);
    }

    #marketing-buyback .buyback-content .buyback-steps img {
        top: 0px;
    }
}

@media (max-width:1024px) {
    .counter-buckets {
        width: 100%;
        float: none;
        margin-bottom: 1%;
    }
}

.modal {
    position: fixed;
    background-color: rgba(36, 56, 72, 0.8);
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: auto;
}

    .modal .content {
        padding: 40px;
        margin: 20px auto;
        max-width: 800px;
        width: 90%;
        background-color: white;
        position: relative;
        animation: animatein 0.9s ease;
        border-radius: 4px;
    }

        .modal .content .close {
            position: absolute;
            top: 0px;
            right: 0px;
            background-color: #abd6ef;
            color: #0c8bd3;
            padding: 10px;
            font-size: 15px;
            font-weight: 700;
            cursor: pointer;
        }

green {
    color: #4dbc5e;
}

.required, red {
    color: #c93a54;
}


.confirmmodal {
    max-width: 450px !important;
    text-align: center;
    color: #777;
}

    .confirmmodal p {
        color: #777;
    }

.successheadline {
    color: green;
    font-size: 22px;
}

.errorheadline {
    color: #c00;
    font-size: 22px;
}

.errorspan {
    color: #c00 !important;
    padding: 20px;
    border-radius: 4px;
    display: block;
    border: 1px solid #c00;
    background-color: #fddada;
}

.confirmmodalicon {
    max-width: 60px;
    margin-bottom: 15px;
    height: auto;
}

@keyframes animatein {
    from {
        transform: translateY(-60px);
        opacity: 0.0;
    }

    to {
        transform: translateY(0px);
        opacity: 1.0;
    }
}

/* START Angel's Paging Cristy ReCSS */

.dt-info {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 12px;
    color: #777;
    text-align: center;
}

.paging_full_numbers {
    text-align: center;
}

    .paging_full_numbers button {
        background-color: #fff;
        border: 1px solid #ddd;
        padding: 10px 10px;
        margin-left: 5px;
        font-size: 14px;
        line-height: 18px;
        font-weight: normal;
        color: #243849;
        border-radius: 0px;
        opacity: 0.7;
        margin-bottom: 3px;
    }

        .paging_full_numbers button.current {
            background-color: #e0f4ff;
            color: #0c8bd3;
            border: 1px solid #0c8bd3;
        }

        .paging_full_numbers button:hover {
            border: 1px solid #0c8bd3;
        }
/* END Angel's Paging Cristy ReCSS */


.warningconfirmheadline {
    color: #e3a52d;
    font-size: 22px;
}

.confirmmodal strong, .deleteconfirmmodal strong {
    color: #777 !important;
}

.confirmmodal small, .confirmmodal small b, .confirmmodal small em, .deleteconfirmmodal small, .deleteconfirmmodal small b, .deleteconfirmmodal small em {
    color: #999 !important;
}

.confirmyellowbtn {
    border: 1px solid #e3a52d !important;
    background-color: #e3a52d !important;
    color: white !important;
}

    .confirmyellowbtn:hover {
        border: 1px solid #f6bd50 !important;
        background-color: #f6bd50 !important;
    }

.deleteredbtn {
    border: 1px solid #c00 !important;
    background-color: #c00 !important;
    color: white !important;
}

    .deleteredbtn:hover {
        border: 1px solid #ed6262 !important;
        background-color: #ed6262 !important;
    }

.errorspan {
    color: #c00 !important;
    padding: 20px;
    border-radius: 4px;
    display: block;
    border: 1px solid #c00;
    background-color: #fddada;
}

.confirmmodalicon {
    max-width: 60px;
    margin-bottom: 15px;
    height: auto;
}


.validation-summary-errors ul {
    margin: 0px;
    padding: 0px;
}

.validation-summary-errors li {
    color: #c00 !important;
    padding: 20px;
    border-radius: 4px;
    display: block;
    border: 1px solid #c00;
    background-color: #fddada;
    font-size: 14px;
}

button[disabled], button[disabled]:hover {
    cursor: not-allowed !important;
    background-color: #c2cdd7 !important;
}


#marketing-hardware h2 {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 5px;
    padding: 0;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-hardware p {
    padding: 0 0 20px 0;
    line-height: 1.5em;
}

#marketing-hardware .marketing-hardware-devices {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-hardware .marketing-hardware-devices img {
        width: 100%;
        max-width: 686px;
        height: auto;
    }

#marketing-buyback h2 {
    color: rgb(54,78,98);
    font-size: 44px;
    font-weight: 400;
    margin-top: 50px;
    letter-spacing: -0.03em;
    line-height: 1em;
}

    #marketing-buyback h2 span {
        font-weight: 600;
    }

#marketing-buyback .buyback-subhead {
    font-weight: 500;
    font-size: 18px;
}

#marketing-buyback p {
    line-height: 1.5em;
}

#marketing-buyback h3 {
    font-weight: 500;
    color: #0c8bd3;
    font-size: 30px;
    line-height: 1.2em;
    letter-spacing: -0.03em;
}

#marketing-buyback .buyback-content {
    width: 65%;
    float: left;
    padding-left: 20px;
    margin-bottom: 30px;
}

    #marketing-buyback .buyback-content > img {
        float: right;
        margin-left: 20px;
        width: 50%;
        max-width: 370px;
        height: auto;
    }

    #marketing-buyback .buyback-content .buyback-steps {
        clear: both;
        padding-top: 10px;
        padding-bottom: 20px;
    }

    #marketing-buyback .buyback-content ul {
        margin: 130px 0 0 0;
        padding: 0;
    }

        #marketing-buyback .buyback-content ul li {
            list-style-type: none;
            padding-left: 60px;
            margin-bottom: 20px;
            min-height: 44px;
        }

            #marketing-buyback .buyback-content ul li:first-of-type {
                background: url(/images/device-buyback-icon1.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:nth-of-type(2) {
                background: url(/images/device-buyback-icon2.svg) no-repeat left top;
            }

            #marketing-buyback .buyback-content ul li:last-of-type {
                background: url(/images/device-buyback-icon3.svg) no-repeat left top;
            }

#marketing-buyback .buyback-devices {
    margin-bottom: 40px;
}

    #marketing-buyback .buyback-devices img {
        width: 100%;
        max-width: 350px;
        height: auto;
    }

#marketing-buyback .buyback-content .buyback-steps img {
    display: block;
    float: left;
    margin-right: 10px;
    position: relative;
    top: -5px;
}

#marketing-buyback .buyback-content .buyback-steps p {
    margin: 20px 0;
    clear: both;
}

.header-section a:link, .header-section a:active, .header-section a:visited {
    color: #243849;
    text-decoration: underline;
}

.header-section a:hover {
    color: #243849;
    text-decoration: none;
}


.header {
    padding: 40px 40px 0px 40px;
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 20px;
}

@media (max-width: 1170px) {
    .navbar a {
        width: 33.3%;
        float: left;
        display: inline-block;
    }
}

.main-content h1 {
    max-width: 400px;
    border-top: 3px solid #243849;
    border-bottom: 3px solid #243849;
    font-weight: 800;
    margin-bottom: 22px;
}

h1 {
    padding: 20px 0px;
    font-size: 25px;
    line-height: 30px;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
    margin: 0;
    font-weight: bold;
}

h2 {
    padding: 3px 0px;
    font-size: 20px;
    line-height: 30px;
    color: #0c8bd3;
    margin: 0px;
    margin-bottom: 10px;
    font-weight: bold;
}

/* START FILE A CLIAM FORM - removing spaces and redoing columns */
.new-half-width {
    float: left !important;
    margin-right: 1%;
    width: 49%;
    max-width: 100% !important;
}

.new-fourth-width {
    float: left !important;
    margin-right: 1%;
    width: 24%;
    max-width: 100% !important;
}

#otherform {
    padding: 24px !important;
    background-color: #e6f0f3;
    width: 100%;
}

    #otherform:not(.hide) {
        display: table;
    }

@media (max-width: 1000px) {
    .new-half-width, .new-fourth-width {
        width: 49%;
    }
}

@media (max-width: 400px) {
    .new-half-width, .new-fourth-width {
        width: 99%;
    }
}
/* END FILE A CLAIM FORM - removing spaces and redoing columns */


/* new user management area icons */

.purplepdf {
    color: #7f5e9b;
    cursor: pointer;
    display: inline-block;
    width: 89px;
    font-size: 12px;
    line-height: 13px;
    text-align: left;
    margin-bottom: 5px;
    margin-left: 2px;
    background-color: #f1eaf7;
    border: 1px solid #7f5e9b;
    padding: 10px 10px 10px 37px;
    text-decoration: none;
    transition: opacity 0.2s ease;
    border-radius: 5px;
    background-image: url(/images/purplepdf.svg);
    background-position: 8px 12px;
    background-repeat: no-repeat;
    background-size: 20px auto;
}

.createusericon {
    background-position: 7px -304px;
}

.passwordicon {
    background-position: 4px -341px;
}
/* new user management area icons */
