﻿    #btn-dissable-link {
        display:none;
    }
    
    #myaccount a.thumbnail {
        color: #000 !important;
    }

    #myaccount .nohighway {
    box-shadow: none!important;
}

    #myaccount .header {
        background-image: url(/Assets/images/account-header-bg.jpg);
        background-repeat: no-repeat;
        background-position: center center;
        color: #fff !important;
        position: relative;
    }

     #myaccount h2, #myaccount h3 {
         margin:0.5em 0;
     }

     #myaccount .header h3 {
         font-size:1em;
         margin:0 0 0.25em 0;
     }

    #myaccount .header h3 i {
        display:block;
        margin-top:5px;
        float:left;
    }
    #myaccount .gradient:after {
        content: "";
        top: 0;
        left: 0;
        position: absolute;
        height: 100%;
        width: 100%;
        background: -moz-linear-gradient(left, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 0.55) 49%, rgba(0, 0, 0, 0.9) 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(0, 0, 0, 1)), color-stop(49%, rgba(0, 0, 0, 0.55)), color-stop(100%, rgba(0, 0, 0, 0.9)));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.9) 0, rgba(0, 0, 0, 0.55) 49%, rgba(0, 0, 0, 0.9) 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(left, rgba(0, 0, 0, 0.9) 0, rgba(0, 0, 0, 0.55) 49%, rgba(0, 0, 0, 0.9) 100%);
        /* Opera 11.10+ */
        background: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0, rgba(0, 0, 0, 0.55) 49%, rgba(0, 0, 0, 0.9) 100%);
        /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1);
        /* IE6-9 */
        z-index: 1;
    }

    #myaccount .header a {
        color: #fff !important;
        text-decoration: underline;
        border-bottom: none;
    }

    #myaccount .header i {
        margin: 0.3em 0.4em 0 0;
    }

    #myaccount .columns {
        margin-bottom: 0.50em;
        z-index: 2;
    }

   
    #myaccount .header h1 {
        display: inline-flex;
    }

    #myaccount .address .columns,
    #myaccount .links .columns {
        display: inline-flex;
        padding:0;
    }

    #myaccount .address,
    #myaccoun .links {
        margin-bottom: 1em;
    }

    #myaccount .bg-white {
        background-color: #fff;
        border: 1px solid #ccc;
 /*       border-radius: 0.3em; */
    }

    #myaccount .account-summary {
        padding: 1em;
    }

    #myaccount .content {
        padding: 0 1em 1em 1em;
        background: #fff;
    }

    #myaccount .payment .content {
        padding: 0.5em 1em 1em 1em;
    }

    #myaccount .title,
    #myaccount .ref,
    #myaccount .msg, .msg {
        overflow: hidden;
        min-height: 1%;
    }

    #myaccount .title, .title1 {
        margin: 0.5em 0 0 0 !important;
    }

    #myaccount .ref {
        margin: 0;
        font-size: 14px;
    }

    #myaccount .msg, .msg {
        margin: 0.8em 0 0 0;
        padding: 0 0 0 0.5em;
    }

    #myaccount .title i {
        font-size: 1.6em;
        position: absolute;
        right: 5%;
        margin: 0;
        padding: 0;
        display:inline-block !important;
        color:#01599d;
    }

    #myaccount .titlelink span {
        text-decoration: underline;
        color: #01599d;
    }

    .date {
        display: block;
        padding: 5px;
        text-align: center;
        position: relative;
        margin: 0 auto;
    }

    #myaccount .date1 {
        margin-top: 0.5em;
        padding: 4% 0;
    }

    .recent-activity h4, .payment h4 {
        margin: 10px 0 0 10px;
    }

    .date .month,
    .date .year {
        background-color: #2f96b4;
        text-transform: uppercase;
        font-size: 1em;
        display: block;
        color: #fff;
        font-weight: bold;
        border-radius: 5px 5px 0 0;
    }

    .date .year {
        background-color: #fff;
        color: gray;
        border-radius: 0 0 5px 5px;
        border: 1px solid #ccc;
        border-top: none;
    }

    .date .day {
        display: block;
        margin: 0;
        padding: 0.1em 0 0 0;
        font-size: 2em;
        position: relative;
        border: 1px solid #ccc;
        border-bottom: none;
        background: #fff;
    }

        .date .day span {
            border-bottom: dotted 2px #ccc;
            display: inline-block;
            padding-bottom: 5px;
        }

        .date .day::after {
            content: '';
            display: block;
            height: 100%;
            width: 96%;
            position: absolute;
            top: 3px;
            left: 2%;
            z-index: -1;
            box-shadow: 0 0 3px #ccc;
        }

        .date .day::before {
            content: '';
            display: block;
            height: 100%;
            width: 90%;
            position: absolute;
            top: 6px;
            left: 5%;
            z-index: -1;
        }

    .box {
        overflow: hidden;
        min-height: 1%;
        padding: 0 !important;
    }

    .bg-gray {
        background-color: rgba(0, 0, 0, .05);
    }

    @media only screen and (min-width: 37em) {
        #myaccount .payment .amount {
            text-align: right !important;
        }
    }

    #myaccount .payment .amount {
        text-align: left;
        min-width: 65px;
    }

    #myaccount .add-padding {
        padding: 1em;
        margin-bottom: 0;
    }

    #myaccount .view-all {
        padding: 0.8em 1em;
    }

 
.custom-size {
    font-size: 1.125em !important;
}

.new-alert {
    border-color: #ccc!important;
}
.new-alert, .bg-gray {
    background-color: rgba(0,0,0,.05);
}
.delete-account {
    min-height: 280px !important;
}

.breakout-bg {
    background: -webkit-gradient(linear,left top,right top,color-stop(0,rgba(0,0,0,1)),color-stop(49%,rgba(0,0,0,.60)),color-stop(100%,rgba(0,0,0,.9)));
    background: -webkit-linear-gradient(left,rgba(0,0,0,.9) 0,rgba(0,0,0,.60) 49%,rgba(0,0,0,.9) 100%);
    background: -o-linear-gradient(left,rgba(0,0,0,.9) 0,rgba(0,0,0,.60) 49%,rgba(0,0,0,.9) 100%);
    background: linear-gradient(to right,rgba(0,0,0,.9) 0,rgba(0,0,0,.60) 49%,rgba(0,0,0,.9) 100%);
}

/*List of Address : START*/

@media only screen and (min-width: 516px) and (max-width: 591px) {
    .tick-width {
        margin: -1.5em 0 0 0 !important;
    }
}
@media only screen and (min-width: 37.5em) {
    .house-no,
    .tick-width {
        width: 5% !important;
    }
    .tick-width {
        margin: 0 !important;
    }
    .add {
        width: 85% !important;
    }
}
.house-no {
    width: 10%;
    text-align: left;
}
.tick-width {
    width: 10%;
    float: right;
    margin: -3em -0.5em 0 0;
    text-align: right;
}
.add {
    width: 85%;
    padding: 0 5px;
    text-align: left;
}
.address-list span {
    text-transform: capitalize;
}
.houseno {
    min-width: 30px;
    margin: 0;
    display: block;
    float: left;
}
.address-list li {
    background-color: #e3e3e3;
    border-radius: 0;
    border-bottom: 1px solid #ccc;
    text-align: left;
    padding: 10px;
    cursor: pointer;
    margin: 0 !important;
}
.address-list .icon {
    margin: 5px 0;
}
.address-list > div {
    padding:0 !important;
    margin:0 !important;
}
#list {
    background: #fff;
    border: 1px solid #cacaca;
    display: block;
    height: 298px;
    list-style-type: none;
    margin: 0 0 15px;
    overflow: auto;
    padding: 0;
}
.address-list button {
    background-color: #e3e3e3;
    border-bottom: none;
    display:block !important;
    text-shadow: none;
    box-shadow: none;
    transition: none;
    padding-left: 0;
    padding-right: 0;
}

.address-list button .icon.checkmark:before,
.address-list .icon.ok:before,
.address-list .icon.tick:before {
    color: #ccc;
}
.address-list li .current button .icon.checkmark:before,
.address-list li .current .icon.ok:before,
.address-list li .current .icon.tick:before {
   color:#ccc;
}
.address-list li:hover,
.address-list button.full-width:hover {
    background-color: #AEAEAE;
    border-color: #AEAEAE;
    color: #000 !important;
    text-shadow: none;
}
.address-list .current button.full-width:hover .icon.tick:before {
    color:#ccc;
}
.address-list li.current,
.address-list li.current button,
.address-list li.current button:hover {
    background-color: #222;
    border-color: #222;
    color: #fff !important;
    text-shadow: none;
}
.address-list button {
    border-radius: 0;
}
.error {
    color: #943a38 !important;
}
/*List of Address : END*/


/*Adult Services linking css : START*/
.extra-info ul > li span {
    display: block;
    float: left;
    min-width: 115px;
    font-weight: bold;
}
.extra-info .content {
    word-break:break-all;
    font-weight:normal;
}
.divider {
    height: 2px;
    background: #000;
}
p.address-content {
    padding: 0 20px 0 0;
}

.under-age {
    display:none;
}
/*Adult Services linking css : END*/

/*TERMS CHECKBOX CSS : START*/
   .checkbox {
    float: left;
    width: 25px;
    height: 27px;
    padding: 0;
    text-align: left;
    margin-right: 10px;
}
label[for="datapolicy"] {
    position: relative;
    float: right;
    width: 90%;
}
.read-more {
    display:none;
    margin: 0 0 8px 0 !important;
    color: #01599d;
    min-height:18px;
    cursor:pointer;
}

.checkbox-container {
    max-width:35px;
}
.checkbox-error {
    position: relative;
    overflow:hidden;
   /* margin-top: -20px;*/
   
}

.checkbox-error span.error {
    display:none !important;
}
#terms-error {
    display:none;
}
li.error #terms-error {
    display:block;
}
li.error .checkbox-error {
     height: auto;
     
}

.error .checkbox-error .checkbox-container input[type=checkbox] {
    outline: 2px solid #ba4a48;
    border-radius:0.5em;
    margin: 3px 10px 0 3px;
}

li .terms {
     width:60%;
}

li.error .terms {
    color: #ba4a48;
    border: 1px solid #ba4a48 !important;
    border-radius: .5em;
    padding:5px;
    width:60%;
}

@media only screen and (min-width: 37em) {
 .terms {
     width:80% !important;
 }
}

.terms p {
    margin-top:0;
}

ul.accordian li input[type=checkbox] {
    position: relative;
    width: 100%;
    height: 30px;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    top: 0;
}
ul.accordian a {
    top: -2em;
    margin: 0 !Important;
    position: relative;
    width: 100%;
}
/*END*/

/* DIV: START*
.box {
    opacity: 0;
    display:none;
    -webkit-transition: all 1s linear;
    -moz-transition: all 1s linear;
    transition: all 1s linear;
    transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
}

.box:target {
    opacity: 1;
    display:block;
    -webkit-transition: all 1s linear;
    -moz-transition: all 1s linear;
    transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
}
/*end*/

/*Library Linking : START*/
.gender-group {
        margin-bottom:20px;
    }
    .gender-group span.error {
        position:absolute;
        margin-top:70px;
    }
    .gender-group input[type=radio] {
        margin-right:5px;
    }
/*END*/

/*Personal Assessment and Plan CSS : START*/
@media only screen and (max-width: 44em) {
    .personal-assessment .custom-table {
        display: block;
        text-align: right;
         
    }
    .personal-assessment .numbered-blocks dd {
    padding-left: 0;
    margin: -1em 0 1.5em 1.5em;
    }
   .personal-assessment .custom-table .no-border {
       border: 1px solid rgba(0,0,0,.1) !important;
   }
   .personal-assessment .custom-table td {
       text-align:left;
       
   }
   .personal-assessment .custom-table tr {
       margin-bottom:0 !important;
   }
   .personal-assessment .custom-table tr:nth-child(even)>td {
    background-color: rgba(0,0,0,.05) !important;
    width:100% !important;
}
   .personal-assessment .custom-table td:nth-child(2) {
       clear:both !important;
   }
}
.personal-assessment .checkmark {
    display:inline-block;
    width: 22px;
    height:22px;
    background: rgba(0, 0, 0, 0.9);
    border-radius:50%;
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}
.personal-assessment .checkmark:before {
    content: "";
    position: absolute;
    width:3px;
    height:9px;
    background-color:#fff;
    left:11px;
    top:6px;
}

.personal-assessment .checkmark:after {
    content:"";
    position: absolute;
    width:3px;
    height:3px;
    background-color:#fff;
    left:8px;
    top:12px;
}
.personal-assessment .no-border {
        border: none !important;
    }

  .personal-assessment  tr.no-border td {
        border: none !important;
    }

   .personal-assessment     tr.no-border td:first-child {
            font-weight: bold;
            width:14em;
        }

   .personal-assessment .table-view {
        margin-top: 1em;
    }

  .personal-assessment .table-view th, .table-view tr, .table-view td {
            text-align: left;
            padding-left: 0 !important;
            padding-bottom: 0 !important;
        }

    .personal-assessment br {
        display: block;
        margin: 0.5em;
        line-height: 0.5em;
        content: "";
    }

    .personal-assessment .title {
        font-weight: bold;
        margin: 1em 0 0 0;
    }

    .personal-assessment .content {
        margin: 0 0 1em 0;
    }
    @media only screen and (min-width: 820px) {
        .personal-assessment .table-view .custom-width {
            min-width: 190px !important;
        }
    }
    .personal-assessment .table-view .custom-width {
            width:auto !important;
        }

    .custom-block .title {
        padding: 0.5em 0;
    }
/*Personal Assessment and Plan CSS : END*/

/*Helper class : START*/
span[for="PhoneNumber"] {
    display:inline !important;
}
.element-center {
    top: 22%; left: 35%; position: absolute;
}
.white-box {
    background:#fff !important;
}
.grey-box {
    background-color: rgba(0,0,0,.05) !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.8) !important;
}
.remove-bg {
    background:none;
}

.margin-right {
        margin-right: 1em !important;
    }
    .error-msg {
        color: #ba4a48 !important;
        clear:both;
    }
    
    .show-btn a[role=button] {
    border-radius: 0 .5em .5em 0 !important;
    font-size: 12px;
    padding: 1em .9em;
    height: 48px;
    width: 120px;
    display: none
}

    .border-top{
        border-top: 1px solid #ccc;
        overflow:hidden;
    }
    .border-bottom{
        border:none;
        border-bottom: 1px solid #ccc;
        overflow:hidden;
        padding-bottom:0.5em;
    }
    @media only screen and (min-width: 37em) {
        .link-block {
            position: absolute;
            right: 10px;
            margin:0 !important;
        }
    }
    .link-block {
        float: left;
        clear: both;
        margin:1em 0 0 0;
    }
    input[readonly], input[disabled]  {
        box-shadow: none;
        cursor:not-allowed;
        background: transparent;
    }
    .accordion-toggle {
    cursor: pointer;
    }
    .accordion-content {
      margin-top:1em;
    }
    .hants-modal {
        z-index:999 !important;
    }

    .radio-grouped .error {
        margin-top: 5em !important;
    }

    .radio-grouped .error-placeholder {
        position: absolute;
        width: 100%;
    }

    .radio-grouped input[type=radio] {
        margin: 0.5em 0.5em 0 0;
    }

    .error .radio-grouped {
        margin-bottom: 2em;
    }
    .pwn-show-btn a[role=button] {
    border-radius: 0 .5em .5em 0 !important;
    font-size: 0.8em;
    padding: 0.8em .9em;
    height: 48px;
    width: 120px;
    display: none;
}
    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
   #guide p {
       word-wrap:break-word;
       }
    }
/*Helper class : END*/
