﻿/* used for sticky footer */
body, html, form {
    height: 100%;
}

.cob-container {
    position: relative;
    min-height: 100%;
}

.cob-content {
    padding-bottom: 148px;
}

.cob-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 148px;
    background: #091F2F;
}
/* end sticky footer */

/* used mainly to render asp:label as a block element*/
.cob-block {
    display: block;
}

/* wrap the card in a grey border */
.cd {
    border: 1px solid #D2D2D2;
}

.cd-c {
    text-overflow: clip;
    overflow: hidden;
}

/* create a smaller version of the check-box */
.cb-f--sm {
    height: 23px;
    width: 23px;
}

    .cb-f--sm:before {
        height: 23px;
        width: 23px;
    }

    .cb-f--sm:checked:before {
        background: #fff url(../images/cob/check.svg) no-repeat 50%;
    }

.cb-l--sm {
    font-size: initial;
}
/* end checbox */

/* create a smaller version of the radio input */
.ra--sm:not(:last-child) {
    margin-bottom: 4px;
    margin-bottom: .2rem;
}

@media all and (max-width:768px) {
    .ra--sm:not(:last-child) {
        margin-bottom: 8px;
        margin-bottom: .5rem;
    }
}

@media all and (max-width:768px) {
    .ra-f--sm {
        height: 20px;
        width: 20px;
    }
}

.ra-f--sm:before {
    height: 25px;
    width: 25px;
    border: 2px solid #091f2f;
}

@media all and (max-width:768px) {
    .ra-f--sm:before {
        height: 20px;
        width: 20px;
    }
}

.ra-f--sm:checked:before {
    background: #1871bd;
    box-shadow: inset 0 0 0 7px #fff;
}

.ra-l--sm {
    font-size: initial;
    margin-left: 4px;
    font-size: calc(12px + 4 * ((100vw - 480px) / 960));
    padding-bottom: 5px;
}

@media all and (max-width:768px) {
    .ra-l--sm {
        padding-bottom: initial;
    }
}
/* end radio */

/* used to display the cdr menu */
.cob-menu-section {
    display: flex;
}

    .cob-menu-section img {
        top: 3px;
        width: 150px;
        height: auto;
    }

@media all and (max-width:768px) {
    .cob-menu-section img {
        display: none;
    }
}
/* end cdr menu */

/* blue modal background */
.cob-modal {
    max-height: calc(100% - 100px);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffffff;
    padding: 20px;
    border: 2px solid #091F2F;
}

@media (max-width: 768px) {
    /* used to hide whatever on small devices */
    .cob-hide-me {
        display: none;
    }

    /* set item as block on small devices */
    .cob-m--block {
        display: block;
    }
}

/* bump up the font size */
.cob-lg-font {
    font-size: 120%;
}

/* copied t--info media class */
@media screen and (max-width:480px) {
    .cob-lg-font {
        font-size: 16px;
    }
}

/* used to enclose search panels */
.cob-greybox {
    padding: 20px;
    background-color: #F2F2F2;
}

/* removes gray box and padding on small devices */
@media (max-width:840px) {
    .cob-greybox {
        padding: 0px;
        border: none;
        background-color: #fff;
    }
}

/* used to format summary and confirmation information */
/* remove styling form unordered lists */
.cob-ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.cob-ul-f--sm {
    font-size: initial;
}

.cob-ul--li li {
    display: flex;
    margin-bottom: 8px;
    line-height: 1.3em;
}

    .cob-ul--li li:last-child {
        margin-bottom: initial;
    }

    .cob-ul--li li > span:first-child {
        display: inline-block;
        width: 170px;
        font-weight: bold;
    }

    .cob-ul--li li > span:not(:first-child) {
        flex: 1;
    }

.cob-ul--dash li {
    border-bottom: 1px dashed #D2D2D2;
    padding-bottom: 8px;
}

    .cob-ul--dash li:last-child {
        border-bottom: none;
    }

/* used to display the "create new contact" infomation */
.cob-ul--g li {
    display: flex;
    margin-bottom: .2em;
}

.cob-ul--g li > span:first-child {
    display: inline-block;
    width: 150px;
    font-weight: bold;
}

/* vertical bar between list items*/
.cob-ul-vbar li {
    display: inline;
}

    .cob-ul-vbar li:not(:first-child):before {
        content: " | ";
    }

/*  used to display contact info for new accounts */
/*.cob-ul--block {
    padding: 0;
    margin: 0;
    list-style: none;
}*/

    .cob-ul--block li {
        display: block;
        margin-bottom: 8px;
    }

        .cob-ul--block li > div {
            font-weight: 600;
        }

        .cob-ul--block li > span {
            display: block;
        }

@media (max-width:840px) {
    .cob-ul li {
        display: block;
        margin-bottom: 8px;
    }

        .cob-ul li > span {
            display: block;
        }

    .cob-ul--dash li {
        border-bottom: inherit;
        padding-bottom: inherit;
    }
}

/* add required flag before or at the end of a label */
.cob-req-b:before {
    content: "* ";
    color: #FB4D42;
}

.cob-req-a:after {
    content: " *";
    color: #FB4D42;
}
/* end required flag */

/* used on app detail to format number and type info */
.cob-info--hdr {
}

    .cob-info--hdr div > span:first-child {
        display: inline-block;
        width: 170px;
        font-weight: bold;
    }

@media (max-width:840px) {
    .cob-info--hdr div > span {
        display: block;
    }

    /* spacing similar to m-b200 */
    .cob-info--hdr div:first-child {
        margin-bottom: 8px;
        margin-bottom: .5rem;
    }
}

/* taken from b-c class added padding to top only*/
.cob-b-c {
    width: 100%;
    max-width: 1066.72px;
    max-width: 66.67rem;
    margin-left: auto;
    margin-right: auto;
    padding: 55px 0 0 0;
    padding: 4.5rem 0 0 0;
    position: relative;
}

/* taken from b-c class added padding to btm only*/
.cob-b-c--b {
    width: 100%;
    max-width: 1066.72px;
    max-width: 66.67rem;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0 55px 0;
    padding: 0 0 4.5rem 0;
    position: relative;
}

.iframe-container {
    position: relative;
    overflow: hidden;
    padding-top: 100%;
}

    .iframe-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

.cob-t-brick a:link {
    color: #FB4D42;
}

.cob-t-brick a:visited {
    color: #FB4D42;
}

/* hide long file names that run past the cd box */
.cob-breakword {
    word-wrap: break-word;
    word-break: break-all;
}

/* used for the recent activity padding */
.cob-p-l300 {
    padding-left: 27.56px;
    padding-left: 1.7225rem;
}

@media (max-width:840px) {
    .cob-p-l300 {
        padding-left: 0;
        padding-left: 0;
    }
}

.sh--grey {
    border-color: #828282;
}

/* used for the file upload control */
.cob-inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
