@charset "utf-8";
/* CSS Document */

html{
    background-color: #F1F2F2;
    font: normal normal 12px/1.2em ASAP, asapregular, verdana, sans-serif;
    margin: 0;
    padding: 0;
}

a{
    color: #276FCC;
    text-decoration: none;
}

a:hover{
    color: #859FB2;
    text-decoration: none;
}

a:active{
    color: #062C52;
    text-decoration: none;
}

#alert{
    background: url("../images/ICN-Modal.png") 0 -133px no-repeat transparent;
    color: #062C52;
    height: 30px;
    margin: 0 0 40px 0;
    padding: 0 0 0 25px;
    width: 405px;
}

aside {
    float: left;
    font-size: 11px;
    margin-top: 50px;
    width: 240px;
}

body {
    color: #000000;
    margin: 0;
    min-height: 768px;
}

.backText{
    background: url("../images/ICN_ArrowsWorkspaces.png") no-repeat 0 0 transparent;
    float: right;
    margin-top: 10px;
    padding-left: 20px;
}

#CAC{
    min-width: 529px;
}

.cacIcon{
    background: url(../images/CAC_lbp.png) no-repeat 16px 16px;
    width: 94px;
}

.cacText{
    color: #062D51;
    font: normal normal 14px/1em ASAP, asapregular, verdana, sans-serif;
    height: 150px;
    margin-left: 94px;
    width: 429px;
}

.content .faqUL ul li{
    background: url("../images/ICN-Portal.png") no-repeat 0 -4910px;
    padding-left: 25px;
}

.content .faqUL ul li.expand{
    background-position: 0 -4910px;
    color: #808285;
    cursor: pointer;
    list-style-type: none;
    padding-left: 25px;
}

.content .faqUL ul li.collapse{
    background-position: 0 -4936px;
}

.content .faqUL .child li{
    background: none;
    color: #276FCC;
    padding-left: 10px;
}

dl{
    color: #3f3f3f;
    margin: 0;
}

dt{
    color: #a6a8ab;
    display: inline;
    font: normal normal 10px/1em ASAP, asapregular, verdana, sans-serif;
    line-height: 26px;
    text-transform: uppercase;
}

dt:before{ /* insert line break before <dt> */
    content: "\A";
    white-space: pre;
}

dt:first-child:before{ /* disable line break before the first <dt> */
    content: none;
}

dd{
    color: #062C52;
    display: inline;
    margin-left: 10px;
}

dd:before{
    content: ' '; /* space them */
    margin-bottom: 10px;
}

.faqContent{
    display: inline-block;
    vertical-align: top;
    width: 60%;
}

.faqContent ul,
.faqContent ol{
    margin-bottom: 10px;
}

.faqContent ul li{
    line-height: 20px;
    list-style-type: square;
    margin-left: 15px;
}

.faqContent ol li{
    line-height: 20px;
    list-style-type: decimal;
    margin-left: 15px;
}

.faqContent h3{
    margin-bottom: 15px;
}

.faqUL{
    display: inline-block;
    margin-right: 10px;
    width: 234px;
}

footer{
    color: #505871;
    font-size: 9px;
    line-height: 13px;
    padding: 16px;
}

footer ul{
    list-style-type: none;
    padding-left: 0px;
}

.footerbar{
    clear:left;
    font-size: 11px;
    padding: 8px 16px;
}

.footerbar a{
    padding: 16px;
}

#errMsg:before {
    content: "";
    position: absolute;
    width: 17px;
    height: 17px;
    left: 0px;
    top: 2px;
    background: url(../images/ICN-Portal.png) 0 -5013px no-repeat;
}

form .errMsg,
form #errMsg {
    color: #BA1D3D;
    padding-left: 20px;
    text-transform: none;
    position: relative;
}

form .errMsg.active{
    visibility: visible;
}

.formRow {
    margin: 0px 16px 16px 0;
    position: relative; /* For custom checkboxes and radios, keeps hidden input under label; otherwise page can scroll on click */
}

#globalNav {
    background-color: #F1F2F2;
    border-bottom: 1px solid #D1D3D4;
    border-bottom: 1px solid transparent; /* IE8 */
    box-shadow: 0 1px 0 0px #F7F8F8;
    height: 61px;
    width: 100%;
}

#globalNavLogo {
    background: url("../images/logo_lbp.png") 0 0 no-repeat;
    height: 71px;
    width: 280px;
    left: 35px;
    top: 7px;
    margin: 0;
    padding: 0;
    position: absolute;
}

#globalNavLeftEnd{
    height: 61px;
    background-color: #081526;
    width: 330px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA4MTUyNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyMTJkM2UiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -ms-linear-gradient(top, rgba(8, 21, 38, 1) 0%, rgba(33, 45, 62, 1) 100% );
    background: linear-gradient(to bottom, rgba(8,21,38,1) 0%,rgba(33,45,62,1) 100%);
    background-color: rgb(8, 21, 38);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    position: static;
    display: inline-block;
}

#globalNavRightEnd {
    background-image: url("../images/rightEndCapPeripheral.png");
    height: 61px;
    width: 41px;
    position: static;
    display: inline-block;
    margin-left: -44px;
}

h1{
    color: #062C52;
    font: normal normal 24px/1em ASAP, asapregular, verdana, sans-serif;
    margin: 0;
    padding: 0 16px 10px;
    text-transform: uppercase;
}

h2{
    color: #505871;
    font: normal normal 18px/1em ASAP, asapregular, verdana, sans-serif;
    margin: 0 0 16px 0;
}

h3{
    color: #062C52;
    font: normal normal 14px/1em ASAP, asapregular, verdana, sans-serif;
    margin: 0 0 16px 0;
}

h4{
    color: #062C52;
    font: normal normal 14px/1em ASAP, asapregular, verdana, sans-serif;
    text-transform: uppercase;
    margin: 0 0 16px 0;
}

h5{
    color: #062C52;
    font: normal normal 12px/1em ASAP, asapregular, verdana, sans-serif;
    text-transform: uppercase;
    margin: 0 0 12px 0;
}

.content{
    color: #505871;
    padding: 16px;
}

.content:before {
    border-left: 1px solid #D1D3D4;
    box-shadow: 0 0 0 1px #fff inset;
    content: "";
    position: absolute;
    width: 1px;
    height: 96px;
    margin-left: -16px;
    margin-top: -17px;
}
.content ul {
    margin: 0;
    padding-left: 16px;
}
.content ul li{
    background: url("../images/bullet.png") no-repeat scroll 5px 2px transparent;
    line-height: 16px;
    list-style-type: none;
    margin-bottom: 12px;
    margin-left: -20px;
    padding-left: 20px;
}

.content ol{
    margin-bottom: 15px;
    padding: 0;
}

.content ol li{
    line-height: 16px;
    list-style:decimal;
    margin-bottom: 10px;
    margin-left: 16px;
    padding-left: 5px;
}

/* start */
.cacPage{
    color: #505871;
    padding: 16px;
}

.cacPage:before {
    position: absolute;
    width: 1px;
    height: 96px;
    margin-left: -16px;
    margin-top: -17px;
}
.cacPage ul {
    margin: 0;
    padding-left: 16px;
}
.cacPage ul li{
    line-height: 16px;
    margin-bottom: 12px;
}

.cacPage ol{
    margin-bottom: 15px;
    padding: 0;
}

.cacPage ol li{
    line-height: 16px;
    list-style:decimal;
    margin-bottom: 10px;
    margin-left: 16px;
    padding-left: 5px;
}
/* end */

.helpdesk p{
    padding-bottom: 20px;
}

.helpdesk ul{
    padding-bottom: 20px;
}

img.logo{
    padding: 30px 0 60px 40px;
}

input[type="text"],
textarea,
input[type="password"]{
    background: #F1F2F2;
    border: 1px solid #A7A9AC;
    box-shadow: none; /* for firefox */
    color: #939598;
    font-family: inherit;
    font-size: 12px;
    margin: 0;
    padding: 5px;
    resize: none;
    width: 380px;
}

input:focus,
textarea:focus {
    background: #FFF;
    border: 1px solid #1374BE;
    outline: 0px none;
}

input:disabled {
    background: #f2f2f2;
}

label{
    color: #808285;
    display: block;
    font-size: 10px;
    margin: 0;
    padding-bottom: 2px;
    text-transform: uppercase;
}

/*  move these start */


.appsContainer {
    width: 700px;
}

.appsFailoverWarning {
    background-color: #ffdd4f;
    padding: 10px;
    margin-bottom: 20px;
}

.appsHeader {
    background: #182435;
    color: white;
    margin-bottom: 20px;
    padding: 10px;
    font-size: 1.5625em;
}

.appsList {
    padding-left: 5px;
}


.appsList ul li{
    list-style-type: disc;
    margin: 2px;
    padding-left: 0px;
}


.navLetter {
    font-weight: bold;
}



/*  move these end */

.leftColumn{
    float: left;
    margin-right: 10px;
}

.logout .content:before{
    display: none;
}

.logout h1{
    background: url("../images/logoutIcon.png") no-repeat scroll 0 5px transparent;
    color: #D1D3D4;
    font-size: 60px;
    margin-left: 16px;
    padding-left: 96px;
    text-shadow: 1px 1px 1px #FFF;

}
.logout h2{
    background-color: #074F96;
    padding: 10px 16px;
    color: #F0F1F1;
    font-size: 12px;
    margin: 0;
    position: relative;
    text-transform: uppercase;
}
.logout h2:before{
    border-right: 10px solid transparent;
    border-top: 10px solid #F2F2F2;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
}
.logout h3{
    color: #818698;
    font-size: 18px;
    text-transform: uppercase;
}

#mainContent {
    padding: 65px 85px 0 85px;
}

p{
    line-height: 16px;
}

#PASSWORD {
    width: 555px;
}

.primaryCTA {
    border: 3px double #f0f1f1;
    background-color: #1374BE;
    margin: 0px;
    padding: 2px 30px;
    text-decoration: none;
    color: #FFF;
    text-transform: uppercase;
}

.primaryCTA:active {
    background-color: #092D51;
}
.primaryCTA:disabled {
    background-color: #D1D3D4;
    color: #E6E7E8;
}

.big{
    font-size: 18px;
    margin-top: 16px;
    padding: 5px 50px;
}

section {
    padding: 16px;
}

.sidebox{
    padding: 16px 0;
}

/* sidebox thumb image is 240px wide */
.sidebox .thumb{
    background: url("../images/VideoToutImgs_VidTout-Marketing-FeatImgSTD.jpg") transparent 0 0 no-repeat;
    border: 0 none;
    height: 184px;
    margin: 0;
    padding: 0;
}

section ul,
.sidebox ul{
    list-style-type: none;
    padding: 0;
}

section ul li,
.sidebox ul li{
    line-height: 16px;
    margin-bottom: 5px;
}

*section ul li{ /* IE7 link clickable area */
	width: 100%;
}

.titleRule{
    border-bottom: 1px solid #FFF;
    border-top: 1px solid #D1D3D4;
    clear: left;
    position: relative;
}

.titleRule:before,
.titleRule:after{
    border-left: 1px solid lightgray;
    border-top: 1px solid lightgray;
    box-shadow: 1px 1px 0 0 rgba(255, 255, 255, 0.7) inset;
}

.titleRule:before{
    left: -1px;
}

.titleRule:after{
    right: -1px;
}

ul.tabnav{
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 16px;
}

ul.tabnav li{
    background-color: #062C52;
    border: 3px double #E0E0E0;
    border-bottom: none;
    color: #fff;
    float: left;
    letter-spacing: 2px;
    list-style-type: none;
    padding: 7px 0;
    text-align: center;
    text-transform: uppercase;
    width: 135px;
}

ul.tabnav li:hover{
    cursor: pointer;
}

ul.tabnav li.inactive{
    background: #E0E0E0;
    border: 3px double #F1F2F2;
    border-bottom: none;
    color: #505871;
    margin-top: 5px;
    padding: 4px 0px;
    font-size: 10px;
}

/************* MODAL *************/
.lightboxBody, .lightboxBottom, .lightboxTop{
    background: #F1F2F2;
    text-align: left;
    width: 658px;
}

.lightboxTop{
    background: #FFDD4F;
    height: 46px;
}

.lightboxTop h2 {
    background: url("../images/ICN-Modal.png") 15px -133px no-repeat #FFDD4F;
    color: #062C52;
    padding: 13px 0 10px 44px;
}

.lightboxBody h2{
    color: #062D51;
    font-size: 16px;
    text-transform: uppercase;
    padding-top: 8px;
}

.lightboxBody ul li {
    background: url("../images/bullet.png") no-repeat scroll 5px 2px transparent;
    line-height: 16px;
    list-style-type: none;
    margin-bottom: 12px;
    margin-left: -20px;
    padding-left: 20px;
}

.confirmModal {
    margin: 0 20px 0 20px;
}
.modalWrapper {
    display: block;
    height: 200px;
    left: 187px;
    top: 136.5px;
    position: fixed;
    width: 650px;
    z-index: 600;
}

.modalHeader {
    background-color: #859eb1;
    border: solid #bdc9d7 1px;
    border: none\9;
    border-left-style: none\9;
    margin-left: 0px;
    position: relative;
}

.modalHeader h4 {
    color: #FFFFFF;
    height: 42px;
    line-height: 42px;
    margin: 0;
    padding: 0 40px 0 10px;
    font-size: 17px;
    font-weight: normal;
    text-transform: uppercase;
    white-space: nowrap;
}


.confirm h4 {
    background: url("../images/ICN-Modal.png") 15px -133px no-repeat
    #FFDD4F;
    color: #062C52;
    padding-left: 44px;
}

.confirm .lightboxBody {
    padding: 0 20px;
}

.confirm .buttons {
    margin: 0;
    padding: 18px 5px;
}

#confirmMessage {
    color: #062C52;
    font-size: 17px;
    line-height: 1.2em;
    margin: 10px 0;
    min-width: 500px;
    text-transform: uppercase;
}



/*.notchContainer {
    height: 16px;
}

.modalNotchLeft {
    background: url("../images/modalNotch.png") no-repeat;
    float: left;
    height: 16px;
    width: 19px;
}

.modalNotchRight {
    background-color: #f2f2f2;
    border-right: solid #f9f9f9 1px;
    overflow: hidden;
    height: 16px;
}*/

.lightboxBody:after {
    clear: left;
    content: "";
    display: block;
    height: 0;
}

.lightboxBody ul {
    margin: 0;
    padding-left: 16px;
}
.lightboxBody ul li{
    background: url("../images/bullet.png") no-repeat scroll 5px 2px transparent;
    line-height: 16px;
    list-style-type: none;
    margin-bottom: 12px;
    margin-left: -20px;
    padding-left: 20px;
}

.lightboxBody .big{
    padding: 5px 20px;
    width: 130px;
    margin: 5px 0 5px 12px;
}



/************* TRANSITION FROM DESKTOP TO TABLET *************/
@media only screen and (max-width : 990px){
    aside{
        margin-top: 0;
        width: 100%;
    }
    .faqContent{
        width: 52%;
    }
    .sidebox {
        padding: 16px;
    }
}

@media only screen and (max-width : 731px){
    .faqUL,
    .faqContent{
        display: block;
        padding-top: 16px;
        width: auto;
    }
}

/************* TABLET *************/
@media only screen and (max-width : 768px){
    #CAC{
        min-width: initial;
    }
    .leftColumn{
        width: 100%;
    }
    .modalWrapper {
        left: 59px;
    }
}

/************* MOBILE *************/
@media only screen and (max-width : 480px){

    body,
    #mainContent{
        margin: 0;
        padding: 0;
    }

    .cacText,
    #PASSWORD{
        width: auto;
    }

    .content:before{
        display: none;
    }

    .footerbar{
        font-size: 14px;
        padding: 16px 16px 8px 16px;
    }

    .footerbar a{
        display: block;
        padding: 16px 0 8px;
    }

    #globalNav {
        background-color: #081526;
        background: #152132;
        background: -ms-linear-gradient(top, rgba(8, 21, 38, 1) 0%, rgba(33, 45, 62, 1) 100% );
        background: linear-gradient(to bottom, rgba(8,21,38,1) 0%,rgba(33,45,62,1) 100%);
        height: 135px;
        margin-bottom: 15px;
    }

    #globalNavLogo{
        background: url("../images/mobileLogo.png") 0 0 no-repeat;
        left: 50%;
        margin-left: -80px;
        height: 118px;
        top: 0;
        width: 159px;
    }
    #globalNavLeftEnd{
        width: 100%;
        height: 129px;
    }
    #globalNavRightEnd{
        display: none;
    }
    .logout h1{
        display: none;
    }
    .logout h2:before{
        display: none;
    }
    /************* MOBILE MODAL *************/
    .modalWrapper{
        left: 0;
        max-width: 465px;
        position: absolute;
        top: 0;
    }
    .modalHeader{
        margin-left: 0;
    }
    .notchContainer{
        display: none;
    }
    #confirmMessage{
        min-width: 0;
        width: auto;
    }
    .confirm .lightboxBody{
        padding: 0 5px;
    }
    .confirm .modalHeader{
        background-color: #FFDD4F;
    }
}