﻿html {
    overflow-y: scroll;
}
/*
    ANGULAR JS 
*/
ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}
/* END ANGULAR */

/* 
    MobileFeatures Styles
*/

#mobileFeaturesApp .row:nth-of-type(1) {
    padding-left: 20px;
    padding-bottom: 20px;
}

#mobileFeaturesApp .table, #mobileFeaturesApp .row, #manageFeaturesTitle {
    color: white;
    text-align: left;
}

#mobileFeaturesApp .btn {
    color: white;
    padding: 10px 30px;
    font-size: 16px;
    border-radius: 0px;
}

#mobileFeaturesDropDown {
    cursor: pointer;
}

    #mobileFeaturesDropDown .text-muted {
        background-color: lightgrey;
    }
/* End */



/* 
    css resets and main styles 
*/
.blueBackground {
    padding: 20px;
    padding-bottom: 70px;
    -webkit-box-shadow: 0px 0px 12px #000000;
    -moz-box-shadow: 0px 1px 6px #174558;
    -moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5);
    box-shadow: 0px 0px 12px #000000;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4);
    -webkit-border-radius: 12px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    background: rgb(255, 255, 255);
    background: rgba(255, 255, 255, 0.05);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#0CFFFFFF,endColorstr=#0CFFFFFF)";
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0CFFFFFF,endColorstr=#0CFFFFFF);
    zoom: 1;
}

* {
    padding: 0;
    margin: 0;
}

html {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    margin: 0;
    padding: 0;
    font-size: 10pt;
    line-height: 120%;
    min-width: 850px;
    font-family: Arial, Verdana, Tahoma;
    background-color: #131834 !important;
    color: #ffffff !important;
}

a {
    color: #ffffff;
    font-size: 12px;
    text-decoration: underline;
}

    a:hover {
        /* font-size: 12px; */
        text-decoration: none;
        color: #009FEE;
    }

    a img {
        border: none;
    }

/* layout table classes */
.mainContainer {
    background-repeat: no-repeat;
    width: 1000px;
    padding-top: 30px;
    text-align: left;
    display: inline-block;
}

    .mainContainer > .content {
        background-image: url(images/Vocus/Vocus-logo-White.png);
        -ms-background-size: 300px auto;
        background-size: 250px auto;
        -ms-background-repeat: no-repeat;
        background-repeat: no-repeat;
        padding-top: 150px;
        display: inline-block;
        /*min-height: 250px;*/
        float: left;
        width: 600px;
    }

.contentSolo {
    background-image: url(images/new/cp_myaccount_headerV1.png);
    background-repeat: no-repeat;
    width: 100%;
    padding-top: 200px;
    margin-top: -150px;
}

.sidebar {
    width: 300px;
    float: right;
    text-align: right;
    display: inline-block;
    position: relative;
}

.footerBreak {
    width: 100%;
    /*border-top: solid 1px #515C79;*/
    margin-top: 25px;
}

.footer {
    width: 1000px;
    text-align: right;
    padding-top: 20px;
    padding-bottom: 40px;
}

/* content styling */
h1 {
    font-style: narrow bold;
    font-size: 20px;
    padding: 5px;
    padding-bottom: 10px;
}

p {
    padding: 7px;
}

.contentSolo p {
    text-align: justify;
}

.itembox {
    margin: 15px 0;
    padding-top: 2px;
    background-color: #ffffff;
    -ms-border-radius: 5px;
    border-radius: 5px;
}

.more {
    display: block;
    position: relative;
    top: -30px;
    padding-right: 100px;
}

.itembox a .more img {
    border: none;
    float: right;
    margin-top: 7px;
}

.itembox .boxcontent {
    display: block;
    padding: 5px 5px 3px 12px;
    text-align: left;
    font-size: 8pt;
    color: #131834;
}

.close {
    height: 25px;
    width: inherit;
    text-align: right;
    padding-right: 15px;
}

.boxcontent .column {
    width: inherit;
    padding: 2px 7px;
}

.boxcontent a:visited, .boxcontent a:active, .boxcontent a:link {
    color: #131834;
    text-decoration: none;
}

.boxcontent a:hover,
.block a:hover {
    color: #009FEE;
    text-decoration: none;
}

.boxcontent .block {
    display: block;
    padding-bottom: 5px;
}

#SiteHeader {
    margin-bottom: 60px;
}

#dlMyInternet, #dlMyPhone, #dlMyMobile td, #dlAccountServices, #dlExtraStuff, #dlFaults, #dlMyTollFree {
    padding-left: 15px;
    padding-top: 5px;
}

    #dlMyInternet td:not(:empty),
    #dlMyPhone td:not(:empty),
    #dlMyMobile td:not(:empty),
    #dlAccountServices td:not(:empty),
    #dlExtraStuff td:not(:empty),
    #dlFaults td:not(:empty),
    #dlMyTollFree td:not(:empty),
    #dlWiFi td:not(:empty),
    #dlWAN td:not(:empty) {
        background: url("images/vocus/VCNZ bullet-arrow.png") no-repeat 0 7px;
        padding: 7px;
        padding-left: 15px;
        color: #131834;
    }

#myinternet, #phone, #mobile, #accmain, #accmisc, #faults, #tollfree, #wifi, #WAN {
    padding: 10px 0 0 25px;
    margin: 0px -5px 0 -5px;
    z-index: -1;
}

.blacklink a, .whitelink a:visited {
    color: #131834;
    text-decoration: none;
    font-size: 9pt;
}

    .blacklink a:hover, .whitelink a:active {
        color: #009FEE;
        text-decoration: underline;
        font-size: 9pt;
    }

.login {
    color: #ffffff;
    font-size: 12px;
}

.accountInformation {
    text-align: right;
}

.greySidebarbox {
    background: url("images/Vocus/VCNZ current-charges-sidebar-box.png") no-repeat top center;
    font-size: 12px;
    color: #131834;
    text-transform: uppercase;
    text-align: left;
    margin: 5px;
    padding: 25px;
    float: right;
    display: block;
}

.orangeSidebarbox {
    background: url("images/Vocus/VCNZ current-charges-sidebar-box.png") no-repeat top center;
    font-size: 12px;
    color: #131834;
    text-transform: uppercase;
    text-align: left;
    margin: 5px;
    padding: 25px;
    margin-right: 0;
    float: right;
    display: block;
}

.footer a, .footer a:hover {
    text-decoration: none;
    font-size: 12px;
}


.PageSubTitle {
    font-size: 18px;
    font-family: Arial;
    font-weight: bold;
}

.MenuTitle {
    font-size: 18px !important;
    font-family: Arial;
    padding: 15px 0px 15px 0px;
    color: #131834;
}

.MenuTitle:hover {
    color: #009fee;
}

#Master {
    border: solid 1px #b5c2cb;
}

#header {
    background-color: #DAEDF6;
    background-image: url(images/bg/headerBg.gif);
    background-repeat: repeat-x;
    border: 0px solid green;
    padding: 0.001em 0pt 0pt;
}

.mainBodyx {
    border: solid 1px #b5c2cb;
    background: #ffffff;
}

iTalkbody {
    font-size: 10pt;
    color: dimgray;
    line-height: 120%;
    font-family: Arial, Verdana, Tahoma;
    background-color: #f0f0f0;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding-top: 20px;
}

fieldset {
    border: 1px solid #CCCCCC;
    color: #000;
    padding: 3px;
}



.loginControl {
    /*background: url(../images/bg/login-bg.jpg);*/
    width: 442px;
}



.signup {
    border: 1px solid #CCCCCC;
    padding: 5px;
}

.MyAccount, .MyAccount td {
    font-family: Arial;
    font-size: 9pt;
}

.smallnote {
    color: #fff;
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 7pt;
}

.SignupBigBlackText {
    color: #000;
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 20pt;
    font-weight: bold;
    padding-right: 5px;
}

.Bignote_Red {
    color: #c9021c;
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 9pt;
    font-weight: bold;
}

.ErrorMessageHeader {
    font-family: Arial,Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #E82121;
}

.table_homepage_t2 {
    background-color: #070707;
    background-position: left top;
    background-repeat: no-repeat;
    color: white;
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 11px;
    font-weight: normal;
    height: 20px;
    padding: 0pt 0pt 0pt 5px;
}

.FooterHelpInput {
    border: 1px solid red;
    height: 20px;
    width: 156px;
}

.FooterHelpType {
    border: 1px solid red;
    height: 20px;
    width: 110px;
}

.SmallText, .SmallText a {
    color: #666666;
    font-size: 7pt;
}

.SlingshotRedFont {
    font-family: Arial,Verdana, Helvetica, sans-serif;
    font-size: 9pt;
    color: #FF0000;
}

.Ctl_9 {
    font-family: Arial,Verdana, Helvetica, sans-serif;
    font-size: 9pt;
}

.Lbl_9 {
    font-family: Arial,Verdana, Helvetica, sans-serif;
    font-size: 9pt;
    font-weight: bold;
}

.GridHeaderStyle {
    border: solid 1px Gray;
    color: White;
    background-color: Gray;
    font-weight: bold;
    font-size: 12px;
    font-family: Arial,Verdana, Helvetica, Sans-Serif;
    height: 20px;
    padding-left: 5px;
}

.TableStyle {
    border: solid 1px #D3D2D1;
    padding: 5px;
    background-color: #EBEBEB;
    width: 60%;
}

.iTalkBtn {
    cursor: hand;
}

.iTalkFeatureBtn {
    border-width: 0;
    color: Transparent;
    background-image: url(images/iTalk/epMainLink.gif);
    background-repeat: no-repeat;
    background-color: Transparent;
    cursor: hand;
}

.iTalkFeatureActiveBtn {
    border-width: 0;
    color: Transparent;
    background-image: url(images/iTalk/epActiveLink.gif);
    background-repeat: no-repeat;
    background-color: Transparent;
    cursor: hand;
}

.iTalkShowFeature {
    background: #FFFFFF none repeat scroll 0%;
    border-bottom: 0.1em solid #D92227;
    font-family: Arial,Verdana,Helvetica,sans-serif;
    font-size: 11pt;
    padding: 3px;
    font-weight: bold;
}

.Lbl_XS {
    font-family: Arial;
    font-size: 10pt;
    font-weight: bold;
}

.Ctl_XS {
    font-family: Arial;
    font-size: 10pt;
}

.Ctl_XXS {
    font-family: Arial;
    font-size: 8pt;
}

.Ctl_XXS_T {
    font-family: Arial;
    font-size: 8pt;
}

.AltRow {
}



/*******************************************************************************************/
/*****************************		CONFIGURATOR STYLES		********************************/
/*******************************************************************************************/

.TextStyle {
    font-size: 8pt;
    font-family: Arial, Verdana, Tahoma;
}

.TextStyle_small {
    font-size: 7pt;
    font-family: Arial, Verdana, Tahoma;
}

.loginboxdiv {
    margin: 0;
    height: 24px;
    width: 239px;
    background: url(images/iTalk/login_txt_bg.gif) no-repeat bottom;
}

.loginbox {
    background: none;
    border: none;
    width: 239px;
    height: 24px;
    margin: 0;
    padding: 4px 7px 0px 7px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 11px;
}

.GridSmall {
    font-family: Arial;
    font-size: 8pt;
}

.GridHeader {
    background-color: #C4E8FA;
    font-weight: bold;
    font-size: x-small;
    font-family: Arial;
    color: #464749;
}

.GridHeader_S {
    background-color: #C4E8FA;
    color: Black;
    font-weight: bold;
    font-size: xx-small;
    font-family: Arial;
}

.GridFooter {
    background-color: #C4E8FA;
    font-weight: bold;
    font-size: small;
    font-family: Arial;
}

.GridItem {
    font-family: Arial;
    font-size: 8pt;
}

.GridAltItem {
    background-color: Gainsboro;
    font-family: Arial;
    font-size: 8pt;
}


/* CVP 2012 Grid*/
.CleverGrid {
    width: 100%;
    background-color: #fff;
    margin: 5px 0 10px 0;
    border: solid 1px #525252;
    border-collapse: collapse;
    font-family: Arial;
    font-size: 9pt;
}

    .CleverGrid caption {
        text-align: left;
        font-weight: bold;
        font-size: larger;
        padding-bottom: 10px;
        background-color: transparent;
    }

    .CleverGrid a {
        color: #717171;
    }

    .CleverGrid td {
        text-align: center;
        /*padding: 2px; */
        border: solid 1px #c1c1c1;
        color: #717171;
    }

    .CleverGrid th {
        /*padding: 4px 2px; */
        color: #fff;
        background: #424242;
        border-left: solid 1px #525252;
    }

    .CleverGrid .alt {
        background: #fcfcfc;
    }

.ReturnButton, .SaveButton {
    float: left;
    padding-top: 15px;
    clear: both;
    padding-top: 20px;
}

.ReturnButton a, .SaveButton a {
    color: #ffffff;
    font-weight: bold;
    font-family: Arial;
    font-size: 9pt;
    text-decoration: none;
}

.Return a:link, .SaveButton a:link {
    text-decoration: none;
}

.Return a:visited, .SaveButton a:visited {
    text-decoration: none;
}

.Return a:hover,
.ReturnButton a:hover {
    color: #009FEE;
    text-decoration: none;
}

.SaveButton a:hover {
    text-decoration: none;
}

.Return a:active, .SaveButton a:active {
    text-decoration: none;
}

.SaveButton {
    float: right;
}


.WiFiLink a {
    color: orange;
    font-family: Arial;
    font-size: 9pt;
    text-decoration: none;
}

    .WiFiLink a:link {
        text-decoration: none;
    }

    .WiFiLink a:visited {
        text-decoration: none;
    }

    .WiFiLink a:hover {
        text-decoration: none;
    }

    .WiFiLink a:active {
        text-decoration: none;
    }

.ExportLinks #btnExportCsv {
    background: url("images/csvButton.png") no-repeat;
    display: block;
    height: 32px;
    width: 32px;
}

    .ExportLinks #btnExportCsv:hover {
        background: url("images/csvButton.png") -32px no-repeat;
    }

.Italics {
    font-style: italic;
}


.blueBackground {
    padding: 20px;
    padding-bottom: 70px;
    -webkit-box-shadow: 0px 0px 12px #000000;
    -moz-box-shadow: 0px 1px 6px #174558;
    -moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5);
    box-shadow: 0px 0px 12px #000000;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4);
    -webkit-border-radius: 12px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    background: #ffffff;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#0CFFFFFF,endColorstr=#0CFFFFFF)";
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0CFFFFFF,endColorstr=#0CFFFFFF);
    zoom: 1;
}

.spacer5 {
    height: 5px;
    width: 100%;
    font-size: 0;
    margin: 0;
    padding: 0;
    border: 0;
    display: block;
}

.MacReporting {
    font-size: 11px;
    table-layout: fixed;
    width: 800px;
}

#macReporting.ng-table th {
    margin-top: 2px;
    padding-top: 10px;
    border-radius: 4px;
    color: #464749;
}


#macReporting.ng-table th.sortable div:after, #macReporting.ng-table th.sortable div:before {
    border-top-color: #464749;
    border-bottom-color: #464749;
}

#macReporting.ng-table th.sortable.sort-asc,
#macReporting.ng-table th.sortable.sort-desc {
    color: #131834;
    text-shadow: none;
    background-color: #DFDFDF;
}

.MacReporting td {
    padding-left: 10px;
    line-height: 2;
    white-space: nowrap;
    overflow: hidden;
    color: #464749;
}

.MacReporting td span {
    white-space: nowrap;
}

.MacReporting > tbody > tr > td:nth-child(1) > span {
    cursor: pointer;
    cursor: hand;
}

.MacReporting td:nth-child(1),
.MacReporting th:nth-child(1) {
    width: 10px;
}

.MacReporting td:nth-child(2),
.MacReporting th:nth-child(2) {
    width: 60px;
}

.MacReporting td:nth-child(3),
.MacReporting th:nth-child(3) {
    width: 130px;
}

.MacReporting td:nth-child(4),
.MacReporting th:nth-child(4) {
    width: 320px;
}

.MacReporting td:nth-child(5),
.MacReporting th:nth-child(5) {
    width: 70px;
}

.MacReporting td:nth-child(6),
.MacReporting th:nth-child(6) {
    width: 100px;
}

.MacReporting td:nth-child(7),
.MacReporting th:nth-child(7) {
    width: 70px;
}



.MacReportDetails-row div {
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 10px;
}

.MacReportDetails-row table {
    font-size: 11px;
    color: #ffffff;
    background-color: transparent;
}

.MacReportDetails-row table td {
    padding-left: 40px;
}

.MacReportDetails-row table tr:nth-child(even) {
    background-color: #C4E8FA;
}

.MacReportDetails-row table tr:nth-child(odd) {
    background-color: #009FEE;
}

.callplusOrange {
    color: #093F78;
}


.Italics {
    font-style: italic;
}

/**
* toggle switch
*/
.bool-slider {
    color: #FFF;
    font-weight: 800;
    font-family: Arial, Helvetica, Verdana, sans-serif;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    height: 25px;
    width: 60px;
}

    .bool-slider.true .inset {
        background-color: #51a351;
        *background-color: #499249;
        background-image: linear-gradient(top, #62c462, #51a351);
        background-repeat: repeat-x;
        border-color: #51a351 #51a351 #387038;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        background-image: none;
        box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
    }

        .bool-slider.true .inset .control {
            float: left;
        }

            .bool-slider.true .inset .control:after {
                content: 'On';
                position: relative;
                right: -125%;
                top: 10%;
            }

    .bool-slider.false .inset {
        background-color: #da4f49;
        *background-color: #bd362f;
        background-image: linear-gradient(top, #ee5f5b, #bd362f);
        background-repeat: repeat-x;
        border-color: #bd362f #bd362f #802420;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        background-image: none;
        box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
    }

        .bool-slider.false .inset .control {
            float: right;
        }

            .bool-slider.false .inset .control:before {
                content: 'Off';
                position: relative;
                left: -110%;
                top: 10%;
            }

    .bool-slider .inset {
        width: 100%;
        height: 100%;
        border-radius: 20px;
    }

        .bool-slider .inset .control {
            background-color: #000;
            width: 40%;
            height: 100%;
            border-radius: 20px;
            background-color: #f5f5f5;
            *background-color: #e6e6e6;
            background-image: linear-gradient(top, #ffffff, #e6e6e6);
            background-repeat: repeat-x;
        }

            .bool-slider .inset .control:hover {
                cursor: pointer;
            }

    .bool-slider.disabled {
        color: #CCC;
    }

        .bool-slider.disabled .inset {
            background-color: #f5f5f5;
            *background-color: #e6e6e6;
            background-image: linear-gradient(top, #ffffff, #e6e6e6);
            background-repeat: repeat-x;
        }

        .bool-slider.disabled .control {
            cursor: default;
        }

.floatingRightBottomLoading {
    z-index: 99;
    position: fixed;
    right: 25px;
    bottom: 20px;
}

.Footer_0800 {
    font-size: 25px;
    line-height: 25px;
}

.loginValidator {
    color: #ff0000;
    font-family: Arial;
    font-size: 8pt;
}

.logout {
    color: #131834 !important;
    background-color: #ffffff;
    font-size: 12pt;
    font-weight: bold;
    padding: 8px;
    -ms-border-radius: 5px;
    border-radius: 5px;
}

.submitOrder {
    background: #ffffff;
    padding: 5px 10px 6px;
    color: #131834;
    font-weight: bold;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    position: relative;
    cursor: pointer;
    float: right;
}

.submitOrder_left {
    background: #ffffff;
    padding: 5px 10px 6px;
    color: #131834;
    font-weight: bold;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    position: relative;
    cursor: pointer;
    float: left;
}

.close {
    color: #131834;
}

.login {
    margin: 6px 6px 0 0;
}

.SectionHeader {
    font-size: 12px;
    border: 5px #009FEE solid;
    font-weight: bold;
}

.SectionHeader .HeaderContent {
    padding: 5px 25px 5px 25px;
}

.vocusGridRow {
    font-size: 12px;
    padding: 5px;
}

.vocusGridHeader {
    font-weight: bold;
}

.vocusGridHeader .rowTop {
    border-top: 5px solid;
    border-color: #009FEE;
    padding: 5px;
}

.vocusGridHeader .rowBottom {
    border-bottom: 5px solid;
    border-color: #009FEE;
    padding: 5px;
}

.vocusGridHeader .rowLeft {
    border-left: 5px solid;
    border-color: #009FEE;
    padding: 5px;
}

.vocusGridHeader .rowRight {
    border-right: 5px solid;
    border-color: #009FEE;
    padding: 5px;
}