/* ======================= SCAFFOLDING ======================= */
html {
    min-height: 100%;
    position: relative;
}

html,
body {
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 22px;
    font-family: "Calibri","Arial","Verdana","Sans-Serif";
    font-weight: 400;
    color: #000;
    background-color: #fff;
    -webkit-tap-highlight-color: transparent;
}

html>body {
    margin-bottom: 150px;
}

#header {
    padding: .5em .5em .7em;
}

#header .container,
.main-content.container {
    margin-bottom: 40px;
    max-width: 100%;
    width: 100%;
}

.main-content.container>.row>div {
    margin-bottom: 15px;
}

#header>.row {
    margin-left: 0;
    margin-right: 0;
}

.breadcrumbs>.breadcrumbs-container,
#footer>.footer-container {
    margin-left: 20px;
    margin-right: 20px;
}

.container {
    width: 100%;
    max-width: 960px;
    padding: 0 1em;
    position: relative;
}

#header .main-logo-img {
    background: url(../Images/entelios-logo.png) no-repeat transparent;
    height: 120px;
    width: 270px;
}

.main-logo-img {
    width: 130px;
}

.main-content {
    margin: 10px 0 10px 0;
}

.inline-block {
    display: inline-block;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.uppercase {
    text-transform: uppercase;
}

ul,
ol {
    padding: 0;
    margin: 0 0 10px 25px;
}

ul.inline, ol.inline {
    margin-left: 0;
    list-style: none;
}

ul.inline > li, ol.inline > li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}

li {
    line-height: 20px;
}

.position-relative {
    position: relative;
}

.visible-phone {
    display: none;
}

.selected {
    font-weight: 700;
}

.font-style-italic {
    font-style: italic;
}

.table-responsive table {
    white-space: nowrap;
}

.table-responsive .table>tbody>tr>td.no-results-td {
    padding-left: 10px;
    text-align: left;
}

.main-content .table-responsive th {
    background: transparent;
}

.userweb-header {
    border: 0;
    border-bottom: 1px solid #e5e5e5;
    color: #3c000f;
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 20px;
    padding: 0;
    text-transform: uppercase;
    width: 100%;
}

.userweb-header .user-name-header {
    font-style: italic;
}

/* ======================= HEADER ======================= */
.top-menu > ul {
    margin-bottom: 0;
}

.top-menu ul > li {
    margin: 0;
    padding: 0;
}

    .top-menu ul > li > a {
        color: #3c000f;
        line-height: 1.8em;
        padding: .5em;
        padding-bottom: 1em;
    }

.top-menu a:hover,
.los-dropdown-menu a:hover {
    cursor: pointer;
}

#header .button-section {
    float: right;
    text-align: center;
    position: relative;
    height: 45px;
    margin-top: 3px;
}

#header .button-section .button-inner-section {
    float: left;
}

#header .button-section .button-inner-section .btn-group {
    margin-right: 15px;
}

#header .button-section .button-item:last-of-type {
    margin-right: 0;
}

#header .button-section .button-inner-section .button-item {
    float: left;
    margin-right: .5em;
}

#header .login-link {
    min-width: 150px;
}

#header .button-section .mobile-menu-toggler {
    color:#003869;
    height:40px;
    font-size:1.2em;
    font-weight:bolder;
    text-decoration:none;
    padding:.5em .5em 0;
    -moz-transition:ease .3s all;
    -o-transition:ease .3s all;
    -webkit-transition:ease .3s all;
    transition: ease .3s all;
}
#header .button-section .mobile-menu-toggler:active {
    color:#a4a4a7
}

#header .mobile-menu-toggler span {
    font-size: 1.3em;
    color: #003869;
}

/* Portfolio/Customer DD */
#header .portfolio-customer-dd {
    padding: 0;
}

#header .portfolio-customer-dd li {
    border-bottom: 1px solid #cbcccc;
    min-height: 60px;
    padding: 5px;
}

#header .portfolio-customer-dd li:nth-of-type(even) {
    background: #f6f6f7;
}

    #header .portfolio-customer-dd li:hover {
        background: #3c000f;
        color: #fff;
        cursor: pointer;
    }

#header .portfolio-customer-dd li:hover select,
#header .portfolio-customer-dd li:hover option {
    color: #000;
}

#header .portfolio-customer-dd li:hover span.glyphicon {
    color: #fff;
}

#header .portfolio-customer-dd li select {
    font-weight: normal;
}

    #header .portfolio-customer-dd li span.glyphicon {
        color: #3c000f;
    }

.los-login-menu {
    float: right;
    position: absolute;
    right: 0;
    top: -5px;
}

.no-list-style {
    list-style-type: none;
    margin: 0;
}

.login-menu-item {
    margin-right: 15px;
}

.login-menu-item a.btn,
.btn.add-user{
    border-radius: 0;
    font-size: 14px;
    min-width: 150px;
    padding: 3px 12px;
    float: left;
    margin:0px 10px 0px 0px;
}

.login-menu-item a.btn .glyphicon {
    display: none;
}

/* ======================= FOOTER ======================= */
#footer {
    background: #3c000f;
    bottom: 0;
    color: #fff;
    height: 150px;
    padding: 30px 0;
    position: absolute;
    width: 100%;
}

#footer p,
#footer a {
    color: #fff;
}

#footer .main-logo {
    float: right;
}

#footer .footer-logo-img {
    background: url(../Images/entelios-notextlogo.png) no-repeat transparent;
    height: 80px;
    width: 108px;
}

/* ======================= ANIMATED GLYPHICON SPINNER ======================= */
.glyphicon-spin {
    animation: spin 1000ms infinite linear;
    -webkit-animation: spin 1000ms infinite linear;
}

.glyphicon-spin-inline span {
    display: inline;
}

/* ======================= BUTTONS ======================= */
.btn {
    background: #003869;
    border: none;
    border-radius: 0;
    box-shadow: none;
    color: white;
    font-size: 16px;
    padding-bottom: 5px;
    padding-top: 5px;
    text-decoration: none;
    text-shadow: none;
    transition: 0.25s;
    -moz-box-shadow: none;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    -webkit-backface-visibility: hidden;
    -webkit-box-shadow: none;
    -webkit-transition: 0.25s;
}

    .btn.btn-primary {
        background: #3c000f;
        border: #3c000f;
    }

.btn.btn-primary:hover,
.btn.btn-primary:focus {
    background-color: #286090;
}

.form-submit input.btn,
.form-submit a.btn {
    min-width: 100px;
}

.form-submit a.btn-danger {
    background: #f2dede;
    color: #a94442;
    font-weight: 700;
}

.add-item-btn a {
    margin-bottom: 15px;
}

/* ======================= MOBILE MENU ======================= */
.showing-slide-menu {
    max-height: 999px !important;
}

.mobile-menu {
    background: #fff;
    overflow: hidden;
    max-height: 0;
    position: absolute;
    z-index: 9999;
    width: 100%;
    -moz-transition: ease .5s all;
    -o-transition: ease .5s all;
    -webkit-transition: ease .5s all;
    transition: ease .5s all;
}

.mobile-menu ul {
    margin: 0;
    padding: 0;
}

.mobile-menu .first-level>li:first-of-type {
    border-top: 1px #000 solid;
}

.mobile-menu .first-level>li {
    border-bottom: 1px #000 solid;
}

.mobile-menu li {
    list-style: none;
    position: relative;
}

.mobile-menu .first-level>li>a.page-link {
    padding: 1em;
    display: block;
    font-weight: bolder;
    cursor: pointer;
}

.mobile-menu a.page-link {
    display: block;
    color: #58585a;
    -moz-transition: ease .3s all;
    -o-transition: ease .3s all;
    -webkit-transition: ease .3s all;
    transition: ease .3s all;
    background: #fff;
}

.mobile-menu .first-level>li .mobile-sub-menu-toggler {
    text-align: center;
    width: 70px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 1.5em;
    color: #61c0be;
    -moz-transition: ease .5s all;
    -o-transition: ease .5s all;
    -webkit-transition: ease .5s all;
    transition: ease .5s all;
}

.mobile-menu .first-level>li .mobile-sub-menu-toggler.open {
    background: #85cfcd;
    color: #fff;
}

.mobile-menu .first-level>li .mobile-sub-menu-toggler span {
    margin-top: 11px;
    font-size: 1.4em;
}

.mobile-menu .second-level {
    max-height: 0;
    overflow: hidden;
    -moz-transition: ease .5s all;
    -o-transition: ease .5s all;
    -webkit-transition: ease .5s all;
    transition: ease .5s all;
    background: #85cfcd;
}

.mobile-menu .second-level>li {
    border-bottom: 2px solid #61c0be;
}

.mobile-menu .second-level>li>a {
    text-transform: uppercase;
    font-weight: bolder;
    color: #4b4b4d;
    width: 100%;
    padding: 1em 2.5em;
    font-size: .8em;
    display: block;
    -moz-transition: ease .5s all;
    -o-transition: ease .5s all;
    -webkit-transition: ease .5s all;
    transition: ease .5s all;
}

.mobile-menu .second-level>li>a.has-children {
    padding-bottom: 1em;
}

.mobile-menu .third-level>li>a {
    color: #4b4b4d;
    width: 100%;
    padding: 0 3em;
    display: block;
    font-size: .9em;
    margin-bottom: .8em;
}

/* ======================= TABLE RESPONSIVE ======================= */
.table-responsive .table {
    border: 1px solid #ddd;
    margin-bottom: 0;
}

    .table-responsive .table > thead > tr {
        background: #3c000f;
    }

.table-responsive .table>thead>tr th {
    border: none;
    color: #fff;
}

.table-responsive .table>tbody>tr>td {
    border: 1px solid #cbcccc;
    padding: 2px 4px 4px 4px;
    text-align: left;
}

.table-responsive .table>tbody>tr:nth-of-type(even) {
    background: #f6f6f7;
}

.table-responsive .table>tbody>tr>td.small-table-btns {
    text-align: center;
    vertical-align: top;
}

.table-responsive .table>tbody>tr>td.user-overview-td{
    width: 85px;
}

.table-responsive .table>tbody>tr>td.reports-td,
.table-responsive .table>tbody>tr>td.report-user-group-td {
    width: 75px;
}

a.user-inactive {
    color: #706f6f;
    font-style: italic;
}

/* ======================= .small-btn-list ======================= */
.small-btn-list {
    list-style-type: none;
    margin: 0;
}

.small-btn-list li {
    display: inline;
    padding: 0 3px 0 0;
}

.small-btn-list li a {
    margin: 0;
    padding: 0 5px 0 5px;
    min-width: 22px;
    text-align: left;
}

.small-btn-list li .fa-link-btn:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 13px;
    padding: 0;
    text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

.small-btn-list li .glyph-link-btn:before {
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    padding: 0;
    position: relative;
    top: 1px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

/* ======================= .form-list ======================= */
.form-list {
    display: inline-block;
    margin: 0 20px 0 0;
    max-width: 319px;
    min-width: 319px;
    vertical-align: top;
}

.form-btns {
    display: block;
}

.form-list>li {
    padding-bottom: 10px;
}

.form-list li .input-group {
    padding-bottom: 5px;
}

.form-list li .input-group .input-group-addon i {
    min-width: 14px;
}

.form-text-input li .input-group input:hover {
    cursor: pointer;
}

.form-list li .field-validation-error {
    padding-left: 53px;
}

.form-list li.form-reset-password .reset-password-wrapper {
    max-width: 319px;
}

.form-list li.form-reset-password .reset-password-wrapper label {
    font-weight: normal;
}

.form-list li.form-reset-password .reset-password-wrapper label input {
    float: left;
    margin: 20px 23px 20px 12px;
    max-height: 20px;
    max-width: 20px;
}

.form-list li.form-list-item-style {
    background: #fafafa;
    border: 1px solid #ccc;
    border-radius: 8px;
    margin-bottom: 10px;
    padding: 10px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

.form-list li .header {
    color: #555;
    font-weight: 700;
    padding-bottom: 5px;
}

.form-list li.form-list-item-style .input-group input {
    border-right: none;
}

.form-list li.external-rights .input-group input {
    border-right: 1px solid #ccc;
}

.form-list li.form-list-item-style .input-group .input-group-addon {
    background: #fff;
    border-left: none;
    font-size: 16px;
}

.form-list li.form-meter-search .input-group .input-group-addon,
.form-list li.external-rights .input-group .input-group-addon {
    background: #eee;
    border-left: 1px solid #ccc;
    font-size: 16px;
}

.form-list li.form-meter-search .input-group .input-group-addon:hover,
.form-list li.external-rights .input-group .input-group-addon:hover {
    cursor: pointer;
}

.form-list li.form-list-item-style .input-group .input-group-addon i {
    opacity: 0.3;
}

.form-list li.form-meter-search .input-group .input-group-addon i,
.form-list li.external-rights .input-group .input-group-addon i {
    opacity: 1;
}

.form-list li .added-items ul {
    list-style-type: none;
    margin: 0;
}    
    
.form-list li .added-items ul li {
    margin: 0 0 0 20px;
    position: relative;
}

.form-list li .added-items ul li:hover {
    background: #eee;
}

.form-list li .added-items ul li .bullet-icon {
    font-size: 10px;
    position: absolute;
    top: 5px;
    left: -16px;
}

.form-list li .added-items ul li a {
    color: #555;
    font-size: 13px;
    padding-left: 5px;
}

.form-list li .added-items ul li a:hover {
    cursor: pointer;
    text-decoration: none;
}

.form-list li.form-meter-search #meterSearchStatus .meter-found,
.form-list li.form-meter-search #meterSearchStatus .meter-not-found {
    display: none;
    padding: 10px 0 10px 0;
}

.form-list li.form-meter-search #meterSearchStatus .ean-input-value {
    font-weight: 700;
}

.form-list li.form-meter-search #meterSearchStatus .meter-found .ean-input-value {
    color: #449d44;
}

.form-list li.form-meter-search #meterSearchStatus .meter-not-found .ean-input-value {
    color: #d9534f;
}

.form-list .dropdown-toggle {
    background: #eee;
    border: 1px solid #ccc;
    color: #000;
}

/* ======================= .ui-autocomplete ======================= */
.ui-autocomplete {
    background: #fff;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    list-style-type: none;
    max-width: 299px;
    z-index: 2;
}

.ui-autocomplete li {
    border-bottom: 1px solid #cbcccc;
    padding: 3px 10px 3px 10px;
}

.ui-autocomplete li:nth-of-type(even) {
    background: #f6f6f7;
}

.ui-autocomplete li:hover {
    border: 1px solid rgba(82, 168, 236, 0.8);
    box-shadow: 0 0 8px rgba(82, 168, 236, .8);
    cursor: pointer;
    outline: 0;
    outline: thin dotted \9;
    text-decoration: underline;
    -moz-box-shadow: 0 0 8px rgba(82,168,236,.8);
}

/* ======================= .ui-helper-hidden-accessible ======================= */
.ui-helper-hidden-accessible div:last-child {
    display: none;
}


/* ======================= .nav-tabs ======================= */
.nav-tabs {
    margin: 0 0 10px 0;
    padding-left: 10px;
}

.nav-tabs>li>a {
    background: #eee;
    color: #000;
    opacity: 0.7;
}

.nav-tabs>li>a:focus,
.nav-tabs>li>a:hover {
    background: #fff;
    opacity: 1;
}

.nav-tabs>li.active>a {
    border-top: 2px solid #00b6e4;
    font-weight: 700;
    opacity: 1;
}

.nav-tabs>li.active>a:hover {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-top: 2px solid #00b6e4;
    cursor: pointer;
}

.tab-pane.active .form-list li.form-list-item-style {
    background: transparent;
    border: none;
}

.tab-pane.active .form-list li.form-list-item-style .header {
    display: none;
}

/* ======================= .los-warning ======================= */
.los-warning {
    background: #eee;
    color: #555;
}

.los-warning span.user-name {
    font-style: italic;
    font-weight: 700;
}

.los-warning ul.report-info {
    list-style-type: none;
    margin: 0;
}

.los-warning ul.report-info li .report-label {
    font-weight: 700;
}

/* ======================= .validation-summary-errors ======================= */
.validation-summary-errors ul {
    list-style-type: none;
    margin: 0;
}

/* ======================= dataTables ======================= */
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background: #3c000f; 
}

.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
    background: #eee;
    color: #23527c;
}

#SelectedSubscriptionsNo {
    height: 200px;
}
#SelectedSubscriptionsEn {
    height: 200px;
}

.form-control-subscriptions {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #555;
    display: block;
    font-size: 14px;
    line-height: 1.42857143;
    padding: 6px 12px;
    width: 100%;
}

#currentSubscriptionsTable {
    border: none;
}

#currentSubscriptionBody td {
    border: none;
}

#currentSubscriptionBody td {
    text-align: left;
}

#page-content-wrapper table.dataTable thead .sorting:after,
#page-content-wrapper table.dataTable thead .sorting_asc:after,
#page-content-wrapper table.dataTable thead .sorting_desc:after,
#page-content-wrapper table.dataTable thead .sorting_asc_disabled:after,
#page-content-wrapper table.dataTable thead .sorting_desc_disabled:after {
    bottom: initial;
    display: inline-block;
    padding-left: 30px;
    position: relative;
    right: initial;
    vertical-align: middle;
}