/* ======================================================================================== */
/* Styles that are not device or viewport specific */
/* ======================================================================================== */

.visible-phone {
    display: none !important;
}

.visible-tablet {
    display: none !important;
}

.hidden-desktop {
    display: none !important;
}

.visible-desktop {
    display: inherit !important;
}



/* ======================================================================================== */
/* portrait tablet styles */
/* 2 column layout */
/* comma separated, device specific media queries. */
/* Order: portrait tablet, desktop */
/* ======================================================================================== */
@media screen and (min-width:750px) and (max-width:844px) {

    .hidden-desktop {
        display: inherit !important;
    }
    .visible-desktop {
        display: none !important ;
    }
    .visible-tablet {
        display: inherit !important;
    }
    .hidden-tablet {
        display: none !important;
    }

    #main-container {
        width: 100%;
    }

    #mobile-nav-placeholder {
        display: none;
    }

    #zone-selector-placeholder {
        float:none;
    }

    .zone-selector span.caret {
        float: right;
    }

    .truncate {
        width: 100px;
    }

    .hidden-portrait-tablet-and-below {
        display: none !important;
    }

    .row-fluid .structure-column {
        margin: 0 auto;
        width: 100%;
    }



    /* =================== 2-column view styles =================== */
    .row-fluid .span8.left-column, .row-fluid .span8, .row-fluid.banner-support-container .span8, .row-fluid.banner-support-container .span4 {
        float: none;
        width: 100%;
        margin-left: 0;
    }

    .row-fluid .span4.right-column{
        float: none;
        width: 100%;
        margin-left: 0;
        *zoom: 1;
    }

    .row-fluid .span4.right-column,
    .row-fluid .span4.right-column {
        display: table;
        content: "";
    }

    .row-fluid .span4.right-column {
        clear: both;
    }

    .row-fluid .span4.right-column .row-fluid{
        display: block;
        float: left;
        min-height: 30px;
        margin-left: 0;
        *margin-left: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 48%;
        *width: 48%;
        /*margin-top: 10px;*/
        clear: both;
    }

    .row-fluid .span4.right-column .row-fluid:nth-child(2n+2) {
        float: right;
        clear: none;
    }

    .row-fluid .two-col-box, .row-fluid .two-col-box-single {
        float: left;
        width: 48%;
        *width: 48%;
        margin-left: 2.762430939%;
        *margin-left: 2.709239449638298%;
        /*margin-bottom: 20px;*/
        /*margin-top: 18px;*/
    }

    .row-fluid .two-col-box:nth-child(2n+1) {
        margin-left: 0;
    }

    /* ==================================== */
    /* Discovery UI styles */
    /* ==================================== */
    body {
        /*padding-left: 5px;*/
        /*padding-right: 5px;*/
        padding-top: 0;
    }

    #zone-selector-placeholder {
        margin-right: 0;
    }

    /* Corporate links styling section */
    #corporate-links-container {
        width: 100%;
        float: right;
        text-align: right;
    }


    #welcome-name-container {
        margin-right: 15px;
    }

    .row-fluid .structure-column {
        margin: 0 auto;
        width: 100%;
    }

    .tablet-no-left-margin {
        margin-left: 18px !important;
        padding-top: 0px;
    }

    #mobile-nav-placeholder {
        display: none;
    }

    #mega-nav-placeholder {
        display: block;
    }

    #hidden-media-check {
        width: 2px;
    }

    #mega-nav-placeholder {
        width: 100%;
        float: none;
        margin-top: 14px;
        height: 30px;
        clear: both;

    }

    .discoveryCarousel .item {
        width: 320%;
        overflow: hidden;
    }

    .journey-nav .journey-progress-left {
        display: none;
        width: 0;
    }

    .journey-nav .journey-progress-left .arrow-right {
        display: none;
    }

    .journey-nav .journey-progress-right {
        width: 100%;
    }

    /*  ================== Status bars =====================*/
    .status-bar-container .status-bar-left {
        display: inline;
        float: left;
        width: 48%
    }

    .status-bar-container .status-bar-right {
        display: inline;
        float: left;
        width: 48%
    }

    /*.status-bar-container .status-bar-right .row-fluid.top-row{padding: 3px;}*/

    .status-bar-container .status-bar-block-small {
        display: inline;
        float: left;
        text-align: center
    }

    .status-bar-container .status-bar-right .span6.status-bar-block-small {
        padding: 0;
        width: 48%;
    }

    .status-bar-container .status-bar-block-small.span4 {
        width: 31%;
    }

    ul.nav-tabs-leftnav {
        display: inline;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav > li > a {
        -webkit-border-bottom-left-radius: 0px;
        -webkit-border-top-right-radius: 0px;
        -moz-border-radius-bottomleft: 0px;
        -moz-border-radius-topright: 0px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
        margin: 0;
        width: 100%;
        border: 1px solid #CDCDCD;
    }

    ul.nav-tabs-leftnav li {
        display: inline-block;
        list-style-type: none;
    }

    .nav-tabs-leftnav > li.leftwrap {
        background: none;
        padding-top: 5px;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav {
        width: 100%;
        margin: auto;
    }

    #mallnav > div.side-tabs-content {
        padding: 15px;
        background: transparent;
        border: none;
    }

    #mallnav .nav > li > a {
        display: inline-table;
    }

    .miles-container {
        text-align:left;
    }

    #mega-nav-placeholder {
        display: block;
    }

    #product-nav {
        background: -ms-linear-gradient(top, #FEFEFE, #CCCCCC);
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#FEFEFE), to(#CCCCCC));
        background: -webkit-linear-gradient(top, #FEFEFE, #CCCCCC);
        background: -moz-linear-gradient(top, #FEFEFE, #CCCCCC);
        background: linear-gradient(top, #FEFEFE, #CCCCCC);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FEFEFE', endColorstr='#CCCCCC')  progid:DXImageTransform.Microsoft.DropShadow(Color='#FEFEFE', OffX=0, OffY=0)" !important; /* IE8 */
    }


    /* ============================ box widgets =============================== */
    .widget .body {
        margin-top:0px;
        padding: 14px 16px;
    }
    .widget .body h3 {
        margin-top: 20px;
        width: 100%;
        display:inline-block;
    }
    .widget .body .row-fluid .span12 {
        margin-top: 15px;
    }
    .subtext {
        width: 60%;
        float:left;
        display:inline-block;
        margin-bottom: 15px;
        clear:both;
    }
    /* ============================ end of box widgets =============================== */

}


/* ======================================================================================== */
/* MOBILE MEDIA QUERIES */
/* comma separated, device specific media queries. */
/* Order: portrait phone, landscape phone, desktop */
/* ======================================================================================== */
@media screen and (max-width:749px) {
    .hidden-desktop {
        display: inherit !important;
    }
    .visible-desktop {
        display: none !important;
    }
    .visible-phone {
        display: inherit !important;
    }
    .hidden-phone {
        display: none !important;
    }

    #main-container {
        width: 100%;
    }

    #mobile-nav-placeholder {
        display: block;
    }

    .span8 .row-fluid [class*="span"]:nth-child(2n+2) {
        /*margin-top: 10px;*/
    }

    .row-fluid .span4.right-column{
        margin-top: 0;
    }

    .row-fluid .two-col-box, .row-fluid .two-col-box-single {
        float: none;
        width: 100%;
        margin-left: 0;
    }



    /* ======================================================================= */
    /* Custom styles */
    /* ======================================================================= */
    .search-btn {
        color: inherit;
    }

    #product-nav li {
        padding: 0;
    }


    #zone-switch {
        padding: 8px;
        width: 100%;
        z-index: 1000;
    }

    #zone-switch-list {
        left: -70px;
        z-index: 1000;
    }

    #zone-selector-placeholder {
        float: none;
    }

    .truncate {
        width: 110px;
    }

    /*#product-nav li.has-product {*/
        /*background: url("/static/img/responsive/generic/nav_icon_tick.gif") -1px 10px no-repeat !important;*/
    /*}*/

    #top-info-bar-row {
        padding-bottom: 8px;
    }

    #logo-box {
        margin-top: -8px;
    }


    /* =============== Status bars ===================*/
    .status-bar-container {
        /*max-height: 140px;*/
        /*height: 140px;*/
    }

    .status-bar-container .status-bar-block-small {
        display: inline;
        float: left;
        padding: 10px;
    }

    .status-bar-container .status-bar-block-small.span4 {
        width: 33%
    }

    .row-fluid [class*="span4"].health-statusbar-block {
        float:left;
        width: 31.914893617021278%;
    }

    .row-fluid [class*="span6"].health-statusbar-block {
        float:left;
        width: 47.914893617021278%;
    }

    .health-statusbar-left {
        border-right: none;
    }
    /* =========== end status bars ==============     */

    .health-balance-block, .inactive-balance-block {
        min-height: inherit;
    }

    #zone-selector-placeholder-mobile {
        height: 30px;
        float: right;
        margin-top: 15px;
    }

    .row-fluid .span4.right-column .row-fluid, .right-column .row-fluid {
        float: none;
        width: 100%;
        margin-left: 0;
    }

    .maintain-box-sizes-in-2-col .two-col-box {
        float: none;
        width: 100%;
        margin-left: 0;
        padding-bottom: 18px;
    }

    #hidden-media-check {
        width: 1px;
    }

    #main-container {
        min-width: 300px;
        margin: 0 auto;
    }

    /* Remove the body padding for mobile */
    body {
        padding-left: 5px;
        padding-right: 5px;
    }

    #logo-container {
        width: 50%;
        margin-bottom: 10px;
    }

    #logo-nav-structure-row {
        margin-bottom: 25px;
    }

    #login-search-container {
        width: 49%;
    }

    #login-btn-container {
        border-bottom-left-radius: 5px;
        border-color: #dbdbdb;
    }

    #login-btn {
        display: block;
        padding: 5px 12px 5px 12px;
        color: #FFFFFF;
        font-size: 10px;
        background-position: 90% center;
        background-repeat: no-repeat;
    }

    .search-btn-container .search-btn {
        background: -moz-linear-gradient(top, #ffffff, #c4c4c4) !important;
        background: -ms-linear-gradient(top, #ffffff, #c4c4c4) !important;
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#c4c4c4)) !important;
        background: -webkit-linear-gradient(top, #ffffff, #c4c4c4) !important;
        background: -o-linear-gradient(top, #ffffff, #c4c4c4) !important;
        background: linear-gradient(top, #ffffff, #c4c4c4) !important;
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#c4c4c4')" !important; /* IE8 */
        border-color: #ebebeb;
        border-radius: 0;
        border-bottom-right-radius: 5px;
        margin: 0;
        padding-left: 27px;
        padding-right: 27px;
    }

    #log-out-container {
        float: right;
    }

    .two-col-box {
        /*margin-bottom: 18px;*/
    }

    .two-col-box:last-child {
        /*margin-bottom: 0px;*/
    }

    .fluid {
        width: 70%;
        *zoom: 1;
    }

    .tab-content img {
        display: none;
    }

    .tab-content.show-mobile-images img, .tab-content img.show-mobile-images {
        display: block !important;
    }

    .side-tabs-content .tabbable .nav-tabs {
        display: none;
    }

    .side-tabs-content .tabs-left {
        padding-bottom: 40px;
    }

    .side-tabs-content .tabs-left > .tab-content {
        width: 100%;
    }

    .side-tabs-content .tabs-left > .tab-content > .tab-pane {
        padding-bottom: 50px;
    }

    .side-tabs-content .tabs-left > .tab-content .more-info-link {
        width: 98%;
    }

    .tabbable .mobile-tabs .active h3 {
        display: block;
        position: absolute;
        width: 78%;
        left: 12%;
        top: 44px;
        margin: 0 0 0 0;
        font-size: 18px;
        color: #828282;
        line-height: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .tabbable .mobile-tabs h3 {
        display: none;
    }

    .mobile-tabs .tab-content p {
        padding: 0 10px;
    }

    .row-fluid .image-gallery [class*="span"] {
        margin-left: 0;
        margin-right: 2%;
    }

    .row-fluid .image-gallery [class*="span"] {
        margin-left: 2%;
    }

    .row-fluid .image-gallery .span8 {
        display: none;
    }

    .side-tabs-content .tab-pane {
        padding: 0;
    }

    .side-tabs-content {
        padding: 0px 10px 0px 10px;
    }

    .mobile-tabs {
        display: block;
    }

    .tabbable .mobile-tabs {
        width: auto;
        text-align: center;
        margin: 0 auto -5px;
    }

    ul.mobile-tabs {
        display: inline-block;
        margin: 0 0 -5px 0;
        list-style: none;
        position: relative;
    }

    .mobile-tabs {
        width: auto;
    }

    .mobile-tabs li {
        list-style: none;
        height: 28px;
        width: 30px;
        background-color: #e8e8e8;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        margin-right: 2px;
        float: left;
    }

    .mobile-tabs li.active {
        background-color: #04539a;
    }

    .mobile-tabs li a {
        color: #828282;
        font-size: 16px;
        font-weight: bold;
        line-height: 27px;
    }

    .mobile-tabs li a:hover {
        background-color: transparent;
    }

    .mobile-tabs li.active a {
        color: #ffffff;
    }

    .mobile-tabs li.active .down-arrow {
        display: inline-block;
        width: 0;
        height: 0;
        margin-left: -2px;
        text-indent: -99999px;
        vertical-align: top;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-top: 7px solid #04539a;
        opacity: 1;
        filter: alpha(opacity = 100);
        content: "↓2193";
    }

    .mobile-tabs li a:hover {
        text-decoration: none;
    }

    .mobile-tabs-arrows {
        display: block;
        margin-top: 1px;
        width: 100%;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        padding: 5px 0 5px 0;
        line-height: 20px;
    }

    .mobile-tab-arrow-control {
        position: relative;
        margin-top: 0px;
        color: #ffffff;
        left: 10px;
        background: url(/static/img/responsive/generic/icon_arrow_new.png) no-repeat top left;
        width: 20px;
        height: 34px;
        opacity: 1;
    }

    .mobile-tab-arrow-control.right {
        right: 10px;
        left: auto;
        background-position: top right;
    }

    .mobile-tab-arrow-control:hover {
        color: #ffffff;
        text-decoration: none;
        opacity: 1;
        cursor: pointer;
    }

    .tab-content.fluid {
        width: 100%;
    }

    .top.nav.nav-tabs {
        display: none;
    }

    .functional-tabs-container .top.nav.nav-tabs {
        display: block;
    }

    .top-tabs-content {
        border: none;
    }

    .smallCarousel-inner {
        position: relative;
        width: 100%;
        left: 13%;
        overflow: hidden;
    }

    .smallCarousel .item {
        width: 320%;
        overflow: hidden;
    }

    .imageCarousel.discovery-carousel-wrapper {
        display: none !important;
    }

    .journey-progress-container .journey-nav {
        display: none;
    }

    .journey-mobile {
        display: block;
    }

    .journey-nav .journey-progress-left {
        display: none;
        width: 0;
    }

    .journey-nav .journey-progress-left .arrow-right {
        display: none;
    }

    .journey-nav .journey-progress-right {
        width: 100%;
    }

    .responsive-table, .responsive-tableMenu {
        display: none;
    }

    .mobile-table-triggers-wrapper {
        height: 30px;
        clear: both;
        width: 100%;
    }

    .mobile-table-triggers-wrapper .previous-table-trigger {
        float: left;
        background: transparent url(/static/img/responsive/generic/icon_arrow02.png) no-repeat left;
        width: 30%;
        height: 100%;
        text-decoration: none;
    }

    .mobile-table-triggers-wrapper .next-table-trigger {
        float: right;
        background: transparent url(/static/img/responsive/generic/icon_arrow01.png) no-repeat right;
        width: 30%;
        height: 100%;
        text-decoration: none;
    }

    .mobile-table-triggers-wrapper a:hover {
        text-decoration: none !important;
    }

    .table-controls-mobile {
        background-color: #FFFFFF;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-top-right-radius: 5px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-topright: 5px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        border-top: 1px solid #EFEFEF;
        border-left: 1px solid #EFEFEF;
        border-right: 1px solid #EFEFEF;
    }

    #mobilenav-space {
        position: relative;
    }

    #mobilenav-space .navbar .btn-navbar {
        padding: 0;
        margin: 0;
        float: none;
        text-shadow: none;
    }

    #mobile-nav-trigger {
        width: 100%;
        position: relative;
        display: block;
        clear: both;
        border: 1px solid #dbdbdb;
        cursor: pointer;
        background: -ms-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFFFFF), to(#E4E4E4));
        background: -webkit-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: -moz-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: linear-gradient(top, #FFFFFF, #E4E4E4);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFFFFF', endColorstr='#E4E4E4')  progid:DXImageTransform.Microsoft.DropShadow(Color='#FFFFFF', OffX=0, OffY=0)"; /* IE8 */
        color: #828282 !important;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
    }

    #mobilenav-left {
        padding: 12px 10px;
        width: 70%;
    }

    #mobilenav-right {
        padding: 12px 0px;
        text-align: center;
        width: 10%;
    }

    #mobileNodeListHolder {
        display: none;
    }

    #mobile-nav-placeholder {
        float: none;
        clear: both;
    }

    #mega-nav-placeholder {
        float: left;
        width: 100%;
        height: auto;
        display: none;
    }

    #product-nav li {
        display: block;

    }

    #product-nav li a {
        display: block;
        text-align: left;
        padding-left: 25px;
        border-right: none !important;
    }

    .modal-body {
        /*max-height: 350px;*/
        padding: 15px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .modal {
        position: fixed;
        top: 3%;
        right: 3%;
        left: 3%;
        width: auto;
        margin: 0;
    }

    .modal.fade.in {
        top: 3%;
    }

    .modal-body {
        /*height: 60%;*/
    }

    .meganav-column {
        float: none;
        display: block;
        width: 100%;
        padding: 10px 0;
    }

    .product-inner-nav, .product-inner-nav ul {
        padding: 0 5px;
    }

    #product-nav {
        background: #EFEFEF;
    }

    #product-nav li{
        border-bottom: 1px solid #DBDBDB;
    }

    #mobile-nav-toggle {
        display: none;
        position: absolute;
        top: 43px;
        width: 100%;
        background-color: #FFFFFF;
        border-left: 1px solid #dcdbdb;
        border-right: 1px solid #dcdbdb;
        border-bottom: 1px solid #dcdbdb;
        -webkit-border-bottom-left-radius: 4px;
        -webkit-border-bottom-right-radius: 4px;
        -moz-border-radius-bottomleft: 4px;
        -moz-border-radius-bottomright: 4px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
        z-index: 200;
    }

    #mobileNavContainer ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    #mobileNavContainer ul li {
        padding: 10px;
        cursor: pointer;
        color: #828282 !important;
        border-bottom: 1px solid #dbdbdb;
    }

    #mobileNavContainer ul li.withSubElements {
        background: -ms-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFFFFF), to(#E4E4E4));
        background: -webkit-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: -moz-linear-gradient(top, #FFFFFF, #E4E4E4);
        background: linear-gradient(top, #FFFFFF, #E4E4E4);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFFFFF', endColorstr='#E4E4E4')  progid:DXImageTransform.Microsoft.DropShadow(Color='#FFFFFF', OffX=0, OffY=0)"; /* IE8 */
    }

    #mobileNavContainer a.mobileNavItemBack {
        /*padding: 15px 5px;*/
        cursor: pointer;
    }

    #mobileNavContainer h3 {
        padding-left: 5px;
        display: inline;
    }

    #mobileNavContainer ul li:last-child {
        border-bottom: none;
    }

    #mobileNavContainer .mobileBreadcrumb {
        padding: 10px;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav > li > a {
        -webkit-border-bottom-left-radius: 0px;
        -webkit-border-top-right-radius: 0px;
        -moz-border-radius-bottomleft: 0px;
        -moz-border-radius-topright: 0px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .nav-tabs-leftnav > li > a, .nav-pills > li > a {
        margin-right: 0px;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav > li > a {
        margin-bottom: -4px;
        width: 100%;
        padding: 8px;
    }

    .nav-tabs-leftnav > li.leftwrap {
        background: none;
    }

    .tabbable .nav-tabs-leftnav {
        margin-left: -9px;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav {
        width: 100%;
    }

    .side-tabs-content .tabs-left > .nav-tabs-leftnav > li.active > a {
        width: 100%;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .side-tabs-content .tabs-left {
        padding-bottom: 0px;
    }

    #mallnav > div.side-tabs-content {
        background-color: transparent;
        border: none;
    }

    .carousel-inner > .item > img, .carousel-inner > .item > a > img {
        margin: 0 auto;
    }

    #accr-desktop {
        display: none;
        visibility: hidden;
    }
    #dt-select {
        display: none;
    }
    #dt-report {
        display: none;
    }
    #dt-well {
        display: none;
        visibility: hidden;
    }
    .subtext {
        width: 98% !important;
        margin-bottom: 10px;
    }
    /*    .img-circle {
    display: none;
    visibility: hidden;
    }
    */
    .mwb-widget {
        margin-bottom: 20px;
    }

    /* ================================= box widgets ==============================*/
    .widget .body {
        margin-top:0px;
        padding: 14px 16px;
    }
    .widget .body h3 {
        margin-top: 20px;
        width: 100%;
        display:inline-block;
    }
    .widget .body .row-fluid .span12 {
        margin-top: 15px;
    }
    .mwb-widget {
        margin-bottom: 15px;
    }
    .sliderfb {
        margin-top: 10px;
    }
    .subtext {
        width: 60%;
        float:left;
        display:inline-block;
        margin-bottom: 15px;
        clear:both;
    }
    .wbox {
        margin-bottom: 15px;
        margin-top: 15px;
    }
    /* ============================== end of box widgets ==============================*/


}

/* ======================================================================================== */
/* Desktop styles */
/* 3 column, desktop layout */
/* comma separated, device specific media queries. */
/* Order: landscape tablet, desktop */
/* ======================================================================================== */
@media screen and (min-width:845px) and (max-width:1280px) {


    #hidden-media-check {
        width: 3px;
    }
}