/*!
 * Start Bootstrap - Creative Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

:root {
    --carexc-blue-color: #4a90e2;
    --carexc-green-color: #1a9d7c;
    --carexc-alert-red-color: #f05f40;
}

html,
body {
    width: 100%;
    height: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}

.print-screen {
    display: none;
}

hr {
    border-color: var(--carexc-alert-red-color);
    border-width: 3px;
}

hr.light {
    border-color: white;
}

a {
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
    color: var(--carexc-blue-color);
}

a:hover,
a:focus {
    color: var(--carexc-green-color);
    /* green */
    text-decoration: none;
}

.action:hover,
.action:active {
    cursor: pointer;
}

::-moz-selection {
    text-shadow: none;
    color: rgba(0, 0, 0, 0.2);
    background: rgba(0, 0, 0, 0.2);
}

::selection {
    text-shadow: none;
    color: white;
    background: white;
    color: rgba(0, 0, 0, 0.8);
    background: rgba(0, 0, 0, 0.1);
    background: rgba(26, 157, 124, 0.2);
    /* green */
}

img::selection {
    color: white;
    background: 0 0;
}

img::-moz-selection {
    color: white;
    background: 0 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
h7 {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    color: rgba(0, 0, 0, 0.7);
    margin: 0;
}

p {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    margin-bottom: 0;
    font-size: 16px;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.7);
}

.caption {
    font-style: italic;
    font-size: 13px;
    margin-top: 16px;
    color: rgba(0, 0, 0, 0.5);
}

label {
    font-size: 12px;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.7);
}

label.action {
    color: var(--carexc-blue-color);
    font-weight: 700;
}

.bg-primary {
    background-color: #1a9d7c;
}

.bg-dark {
    color: white;
    background-color: #222;
}

.text-faded {
    color: rgba(255, 255, 255, 0.7);
}

section {
    padding: 32px 0;
}

section .row {
    padding: 0;
}

aside {
    padding: 50px 0;
}

.tip {
    color: red;
}

.no-padding {
    padding: 0;
}

.call-to-action h2 {
    margin: 0 auto 20px;
}

.text-primary {
    color: rgba(0, 0, 0, 0.7);
    font-size: 16px;
    line-height: 140%;
}

.no-gutter > [class*='col-'] {
    padding-right: 0;
    padding-left: 0;
}

/* TABLES */

table {
    margin: 0;
}

table th,
table td {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    color: rgba(0, 0, 0, 0.7);
}

tr.table-head th {
    color: rgba(0, 0, 0, 0.4);
    text-transform: uppercase;
    font-size: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.4) !important;
}

tr.table-head + tr.table-body > td,
tr.table-head + tr.table-body + tr.table-body-top > td {
    border-top: 1px solid rgba(0, 0, 0, 0.4) !important;
}

tr.table-body:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

table td {
    font-size: 16px;
}

tr.table-footer th {
    font-size: 18px;
}

.task-row:hover {
    background: none !important;
}

/* FORMS */

form {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    color: rgba(0, 0, 0, 0.7);
}

.form-control {
    font-size: 16px;
    line-height: normal;
    padding: 6px 12px 6px;
}

.form-group label {
    margin-left: 8px;
}

.help-block {
    margin-left: 8px;
    color: red;
    font-size: 14px;
}

/* BUTTONS */

.btn {
    border-style: solid;
    border-width: 2px;
    border-radius: 300px;
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 700;
    text-transform: none;
    font-size: 18px;
    font-weight: 600;
    padding: 3px 16px;
}

.btn-sm {
    font-size: 15px;
    line-height: 1.5;
}

.btn-xl {
    padding: 15px 30px;
    padding: 4px 24px;
}

.btn-plain {
    color: rgba(0, 0, 0, 0.7);
    background-color: rgba(255, 255, 255, 1);
    border-color: rgba(0, 0, 0, 0.7);
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
}

.btn-plain:hover,
.btn-plain:focus,
.btn-plain:active {
    color: rgba(0, 0, 0, 1);
    background-color: rgba(255, 255, 255, 1);
    border-color: rgba(0, 0, 0, 1);
}

.btn-plain:disabled {
    opacity: 0.5;
}

.btn-default {
    color: rgba(255, 255, 255, 1);
    background-color: var(--carexc-green-color);
    border-color: var(--carexc-green-color);
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
}

.btn-default-plain {
    color: var(--carexc-green-color);
    background-color: rgba(255, 255, 255, 1);
    border-color: var(--carexc-green-color);
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    background-image: none;
    background-color: var(--carexc-blue-color);
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    opacity: 0.5;
    color: gray;
}

.btn-default .badge {
    color: white;
    background-color: #222;
}

.btn-primary {
    color: rgba(255, 255, 255, 1);
    background-color: var(--carexc-blue-color);
    border-color: var(--carexc-blue-color);
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
}

.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default,
.btn-default-plain:hover,
.btn-default-plain:focus,
.btn-default-plain:active,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary,
.btn-primary-plain:hover,
.btn-primary-plain:focus,
.btn-primary-plain:active,
.btn-plain:hover,
.btn-plain:focus,
.btn-plain:active,
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    color: rgba(255, 255, 255, 1);
    background-color: rgba(0, 0, 0, 0.7);
    border-color: black;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    opacity: 0.5;
}

.btn-primary-plain {
    color: var(--carexc-blue-color);
    background-color: rgba(255, 255, 255, 1);
    border-color: var(--carexc-blue-color);
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
}

.btn-primary .badge {
    color: var(--carexc-alert-red-color);
    background-color: white;
}

.btn-success {
    background-color: #1b9d7c;
    border: 2px solid white;
}

.btn-success:hover {
    background-color: #4990e2;
    border-color: rgba(255, 255, 255, 1);
}

.btn-toolbar {
    margin-top: 32px;
    margin-left: 0;
}

.btn-toolbar .btn.pull-left {
    margin-right: 16px;
}

.btn-toolbar .btn.pull-right {
    margin-left: 16px;
}

.borderless td,
.borderless th {
    border: none;
}

/* NAVBAR */

.navbar-default {
    border-color: rgba(34, 34, 34, 0.05);
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
    height: 60px;
    background-color: var(--carexc-blue-color);
    /* BLUE  */
    border-bottom: solid 1px rgba(255, 255, 255, 0.5);
    border: none;
    margin-bottom: 0;
}

.navbar-default > .container {
    height: 60px;
}

.card {
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    box-sizing: border-box;
    padding: 16px;
}

.card-barier {
    width: 100%;
    margin: 16px 0;
    padding: 0 0 8px;
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2);
    border: 2px solid var(--carexc-blue-color);
    border: none;
    border-radius: 4px;
    text-align: left;
    overflow: auto;
    position: relative;
    height: 60vh;
    /* display: flex;
    flex-direction: row;
    flex-wrap: nowrap; */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    background: black;
}

.card-barier p {
    margin: 8px;
}

.video-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
    margin: 16px 0;
}
.video-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

@media (min-width: 768px) {
    .card-barier::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 8px;
        height: 8px;
        margin: 0 8px;
    }
    .card-barier::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(27, 157, 124, 0);
        -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
    }
    .card-barier:hover::-webkit-scrollbar-thumb {
        background-color: var(--carexc-green-color);
    }
}

.card-barier:hover {
    border-color: var(--carexc-green-color);
}

.card-plan {
    width: 100%;
    margin: 16px 0;
    padding: 0 0 8px;
    box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2);
    border: 2px solid var(--carexc-blue-color);
    border: none;
    border-radius: 4px;
    text-align: left;
    overflow: hidden;
    position: relative;
    min-height: 300px;
}

.card-plan:hover {
    border-color: var(--carexc-green-color);
}

.card-plan h4 {
    font-size: 20px;
    font-weight: 500;
    text-transform: capitalize;
    margin: 0 -0 16px;
    padding: 12px 24px 12px;
    box-sizing: content-box;
    background-color: var(--carexc-blue-color);
    /* blue */
    color: rgba(255, 255, 255, 1);
    min-height: 48px;
}

.card-plan:hover h4 {
    background-color: var(--carexc-green-color);
    /* green */
}

.card-plan > .fa {
    position: absolute;
    opacity: 0.1;
}

.fa-rotate-45 {
    -webkit-transform: rotate(25deg);
    -moz-transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    -o-transform: rotate(25deg);
    transform: rotate(25deg);
}

/*.card-plan > .fa-ambulance,*/

.card-plan > .card-bg-icon-discharge {
    font-size: 20em;
    right: -48px;
    bottom: -32px;
}

.card-plan > .card-bg-icon-discharge:before {
    content: '\f2b5';
}

/*.card-plan > .fa-bed,*/

.card-plan > .card-bg-icon-health {
    font-size: 20em;
    right: -56px;
    bottom: -40px;
}

.card-plan > .card-bg-icon-health:before {
    content: '\f0fa';
}

/*.card-plan > .fa-home,*/

/*.card-plan > .fa-clock,*/

.card-plan > .card-bg-icon-dla {
    font-size: 20em;
    right: -16px;
    bottom: -40px;
}

.card-plan > .card-bg-icon-dla:before {
    content: '\f017';
}

.card-plan h6 {
    text-transform: uppercase;
    font-size: 12px;
    margin-top: 8px;
    margin-left: 24px;
}

.ext-left {
    float: left;
}

.card-plan ul {
    font-size: 14px;
    position: relative;
    margin: 8px 0 8px;
    padding: 0 0 8px 12px;
    width: 100%;
    height: 250px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* background: black; */
}

@media (min-width: 768px) {
    .card-plan ul::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 8px;
        height: 8px;
        margin: 0 8px;
    }
    .card-plan ul::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(27, 157, 124, 0);
        /* green */
        -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
    }
    .card-plan:hover ul::-webkit-scrollbar-thumb {
        background-color: rgba(27, 157, 124, 0.2);
        /* green */
    }
}

.card-plan ul li {
    list-style: none;
    text-align: center;
    margin: 0;
    flex: 0 0 auto;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.4) !important;
    /* background: black; */
}

.card-plan ul li img {
    display: block;
    width: 88px;
    height: 88px;
    margin: 0 8px;
    filter: gray;
    filter: grayscale(100%);
}

.card-plan:hover ul li img {
    filter: none;
}

.card-plan button {
    position: absolute;
    right: 16px;
    bottom: 20px;
    display: none;
}

.card-plan:hover button {
    display: block;
}

.card-plan p {
    padding: 0 24px 8px;
    line-height: 120%;
}

.card-plan p.ng-binding {
    padding: 8px 0 0 !important;
    margin: 0 0 -8px;
    font-size: 16px;
}

.card-plan p .hdg-meta-data {
    font-size: 12px;
    text-transform: uppercase;
}

.card-plan p .plan-meta-data {
    display: inline-block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
    background: black;
}

/* .page-careplan .card-product {
    margin-top: 16px;
}

.card-product {
    height: 104px;
}

.card-product:hover {
    cursor: pointer;
}

.card-product .img {
    float: left;
    box-sizing: border-box;
    width: 25%;
}

.page-careplan .card-product .img {
    width: 20%;
}

.card-product img {
    height: 72px;
}

.card-product .text {
    float: left;
    box-sizing: border-box;
    width: 75%;
    margin-top: 0;
    padding-left: 12px;
}

.page-careplan .card-product .text {
    width: 80%;
}

.card-product h4 {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.card-product .category {
    margin-top: 4px;
    font-size: 12px;
    text-transform: uppercase;
}

.page-products .card-product {
    margin-top: 28px;
} */

/* .card-add-team {
    background-color: rgba(74, 144, 226, 0.1);
    background-color: rgba(27, 157, 124, 0.08);
    box-shadow: none;
    box-sizing: border-box;
    margin-left: 15px;
    margin-right: 15px;
}

.card-add-team h4 {
    margin-bottom: 16px;
} */

.logo,
.logo:hover,
.logo:active {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 600;
    font-size: 24px;
    font-style: italic;
    color: white;
    display: block;
    /* padding: 8px 0 7px 0; */
    text-decoration: none;
}

.logo .change {
    color: rgba(175, 221, 209, 1);
    color: rgba(221, 241, 236, 1);
}

.logo .x {
    font-size: 32px;
    position: relative;
    top: 4px;
    left: 1px;
}

.navbar-default .navbar-header .navbar-brand:hover,
.navbar-default .navbar-header .navbar-brand:focus {
    color: #eb3812;
}

.nav-caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 4px;
    vertical-align: middle;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

.nav-caret.nav-caret-dn {
    border-top: 5px dashed;
}

.nav-caret.nav-caret-up {
    border-bottom: 5px dashed;
}

.navbar-text {
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
    color: rgba(221, 241, 236, 1) !important;
    line-height: 100%;
    text-align: right;
    margin: 0 24px 0 0;
    padding-top: 26px;
}

@media (max-width: 767px) {
    .navbar-default .navbar-collapse {
        background-color: rgba(255, 255, 255, 0.9);
        position: relative;
        margin-left: -15px;
        margin-right: -15px;
        padding-right: 30px;
    }
    .navbar-default .navbar-toggle {
        border: 2px solid rgba(255, 255, 255, 1);
        margin-right: 0px;
        margin-top: 11px !important;
    }
    .navbar-default .navbar-toggle:hover,
    .navbar-default .navbar-toggle:active {
        background-color: rgba(255, 255, 255, 1);
    }
    .navbar-default .navbar-toggle .icon-bar {
        background-color: rgba(255, 255, 255, 1);
    }
    .navbar-default .navbar-toggle:hover .icon-bar,
    .navbar-default .navbar-toggle:active .icon-bar {
        background-color: var(--carexc-blue-color);
        /* blue */
    }
    .navbar-default .nav > li > a,
    .navbar-default .nav > li > a:focus,
    .navbar-default .nav > li > ul > li > a,
    .navbar-default .nav > li > ul > li > a:focus {
        font-size: 18px;
        font-weight: 700;
        color: var(--carexc-blue-color);
        /* blue */
        text-transform: none !important;
    }
    .navbar-default .nav > li > a[ui-sref='login'],
    .navbar-default .nav > li > a[ui-sref='login']:focus {
        padding-right: 15px;
    }
    .navbar-default .nav > li > a:hover,
    .navbar-default .nav > li > a:focus:hover {
        color: rgba(26, 157, 124, 1);
        /* green */
    }
    .navbar-default .nav > li.active > a,
    .navbar-default .nav > li.active > a:focus {
        background-color: transparent;
        color: rgba(221, 241, 236, 1) !important;
        /* pale green */
    }
    .navbar-default .nav > li.active > a:hover,
    .navbar-default .nav > li.active > a:focus:hover {
        background-color: transparent;
    }
    .navbar-default .navbar-nav > li > a > .fa,
    .navbar-default .navbar-nav > li > ul > li > a > .fa {
        font-size: 24px;
        margin-right: 16px !important;
    }
    .navbar-default .navbar-nav > li > a > .fa-sign-out {
        left: 6px;
    }
    .navbar-default .navbar-nav > .dropdown > a.dropdown-toggle {
        display: none;
    }
    .navbar-default .navbar-nav > .dropdown > .dropdown-menu {
        display: block;
    }
    .navbar-default .navbar-nav > .dropdown > ul {
        box-shadow: none;
        border: none;
        background: none;
        position: relative;
        width: 100%;
    }
    .navbar-default .navbar-nav > .dropdown > ul > li > a {
        padding-top: 8px;
        padding-bottom: 8px;
        width: 100%;
    }
}

@media (min-width: 768px) {
    .navbar-default {
        /*border-color: rgba(255,255,255,.3);*/
        /*background-color: transparent;*/
        /*background-color: rgba(240,80,60, .4);*/
        background-color: var(--carexc-blue-color);
        /* BLUE */
    }
    .navbar-default .navbar-header .navbar-brand {
        /*color: rgba(255,255,255,.7);*/
    }
    .navbar-default .navbar-header .navbar-brand:hover,
    .navbar-default .navbar-header .navbar-brand:focus {
        color: white;
    }
    .navbar-default .navbar-left {
        margin-left: 40px;
    }
    .navbar-default .navbar-left > li > a span {
        display: block;
    }
    .navbar-default .nav > li > a,
    .navbar-default .nav > li > a:focus {
        color: rgba(255, 255, 255, 1);
        text-transform: none;
        font-size: 16px;
        line-height: 110%;
        font-weight: 600;
    }
    .navbar-default .navbar-collapse {
        background-color: rgba(255, 255, 255, 0);
    }
    .navbar-default .navbar-left > li > a {
        padding: 13px 32px 13px;
    }
    .navbar-default .nav > li > a:hover,
    .navbar-default .nav > li > a:focus:hover {
        color: white;
        color: rgba(0, 0, 0, 1);
        background: none !important;
    }
    .navbar-default .navbar-left > li > a > .fa {
        position: absolute;
        color: rgba(255, 255, 255, 0.2);
    }
    .navbar-default .navbar-left > li > a > .fa-heart {
        font-size: 56px;
        top: 16px;
        left: 20px;
    }
    .navbar-default .navbar-left > li > a > .fa-phone {
        font-size: 56px;
        top: 16px;
        left: 20px;
    }
    .navbar-default .navbar-left > li > a > .fa-user {
        font-size: 56px;
        top: 16px;
        left: 24px;
    }
    .navbar-default .navbar-left > li > a > .fa-shopping-cart {
        font-size: 56px;
        top: 10px;
        left: 4px;
    }
    .navbar-default .dropdown > a.dropdown-toggle .nav-caret-up,
    .navbar-default .dropdown.open > a.dropdown-toggle .nav-caret-dn {
        display: none;
    }
    .navbar-default .dropdown.open > a.dropdown-toggle .nav-caret-up {
        display: inline-block;
    }
    .navbar-default > li.dropdown > a {
        padding: 30px 8px 13px;
    }
    .navbar-default li.dropdown a:hover,
    .navbar-default li.dropdown a:active {
        background: var(--carexc-blue-color);
        /* blue */
        color: rgba(0, 0, 0, 1);
    }
    .navbar-default li.dropdown:hover a,
    .navbar-default li.dropdown a:hover {
        cursor: pointer;
        color: rgba(0, 0, 0, 1);
    }
    .navbar-default li.dropdown .dropdown-toggle {
        overflow-y: hidden;
    }
    .navbar-default li.dropdown:hover .dropdown-menu {
        display: block;
    }
    .navbar-default li.dropdown > .dropdown-menu > li > a {
        color: var(--carexc-blue-color);
        /* blue */
        background: rgba(255, 255, 255, 0.9);
        font-weight: 600;
        font-size: 16px;
    }
    .navbar-default li.dropdown > .dropdown-menu > li > a .fa {
        font-size: 20px;
        margin-right: 8px;
    }
    .navbar-default li.dropdown > .dropdown-menu > li > a:hover,
    .navbar-default li.dropdown > .dropdown-menu > li > a:active {
        color: rgba(255, 255, 255, 0.9);
        background: var(--carexc-blue-color);
        /* blue */
        background: rgba(0, 0, 0, 1);
    }
}

@media (min-width: 992px) {
    .navbar-default .navbar-left {
        margin-left: 56px;
    }
    .navbar-default .navbar-left > li > a {
        padding-left: 48px;
    }
    .navbar-default .navbar-left > li > a > .fa-check {
        left: 16px;
    }
    .navbar-default .navbar-left > li > a > .fa-calendar {
        left: 24px;
    }
    .navbar-default .navbar-left > li > a > .fa-shopping-cart {
        left: 20px;
    }
}

@media (min-width: 1200px) {
    .navbar-username {
        display: block;
    }
}

/* BILLBOARD */

header {
    position: relative;
    width: 100%;
    min-height: auto;
    color: white;
    background-color: white;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

header .header-content {
    position: relative;
    /*width: 100%;*/
    padding: 100px 0;
    margin: 0 auto;
    padding: 40px 15px 20px;
}

header .header-content .header-content-inner h1 {
    margin-top: 0;
    margin-bottom: 0;
    text-transform: uppercase;
    font-weight: 700;
}

header .header-content h2 {
    font-size: 30px;
    color: #4990e2;
    margin-top: 50px;
    text-align: left;
}

header .header-content h3 {
    font-size: 32px;
    font-weight: 100;
    font-style: italic;
    line-height: 120%;
    letter-spacing: -1px;
    width: 40%;
    margin-top: 20px;
    text-align: left;
    color: #1a9d7c;
}

header .header-content h3 span {
    margin-left: -7px;
}

header .header-content h7 {
    font-size: 60px;
    font-weight: 100;
    line-height: 110%;
    letter-spacing: -1px;
    width: 40%;
    margin-top: 20px;
    text-align: left;
    color: #4990e2;
}

header .header-content h7 span {
    margin-left: -7px;
}

header .header-content .header-content-inner hr {
    margin: 30px auto;
}

header .header-content .header-content-inner p {
    margin-bottom: 50px;
    font-size: 16px;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.7);
}

header .header-content .btn-primary {
    margin: 24px 0 32px;
}

@media (min-width: 768px) {
    header {
        /*min-height: 100%;*/
        height: 440px;
    }
    header .header-content {
        /*
        position: absolute;
        top: 50%;
        padding: 0 50px;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        */
        text-align: left;
    }
    header .header-content h3 {
        font-size: 48px;
        letter-spacing: -2px;
        width: 580px;
        margin-top: 40px;
    }
    header .header-content h7 {
        font-size: 52px;
        letter-spacing: -2px;
        width: 620px;
        margin-top: 40px;
    }
    header .header-content .header-content-inner {
        margin-right: auto;
        margin-left: auto;
        max-width: 1000px;
    }
    header .header-content .header-content-inner p {
        margin-right: auto;
        margin-left: auto;
        max-width: 80%;
        font-size: 18px;
    }
    header .header-content .btn-primary {
        margin-top: 30px;
    }
}

#self-care {
    position: relative;
    width: 100%;
    height: auto;
    min-height: auto;
    color: white;
    background-image: none;
    background-color: white;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.card {
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    box-sizing: border-box;
    padding: 16px;
}

#remove-barrier {
    height: 520px;
    padding: 32px;
}

#content-container {
    height: 100%;
}

.col-header {
    border-radius: 25px;
    border: 4px solid #357ec7;
    margin: 5px;
    padding: 5px;
    text-align: center;
}

.col-caption {
    font-size: 28px;
    color: #2b547e;
}

.box-container {
    width: 100%;
    height: 380px;
    margin-bottom: 20px;
}

.box-header {
    width: 100%;
    height: 80px;
    padding: 20px;
    border-radius: 10px;
    /*box-shadow: 10px 10px #D1D0CE;*/
    background-color: #1a9d7c;
    text-align: center;
    vertical-align: center;
}

.box-caption {
    font-size: 26px;
    color: white;
}

.detail-container {
    width: 100%;
    height: 80%;
    border-radius: 10px;
    border: 4px solid #357ec7;
}

.left-content {
    overflow-y: auto;
    overflow-wrap: break-word;
    height: 100%;
    margin: 2px;
}

#right-content {
    border-left: 2px solid #357ec7;
    height: 100%;
}

.right-content {
    overflow-y: auto;
    overflow-x: hidden;
    overflow-wrap: break-word;
    height: 100%;
    margin: 2px;
}

.video-icon {
    max-width: 100%;
    max-height: 100%;
}

.video-title {
    text-align: center;
    margin-top: 12px;
}

.box-icon {
    display: block;
    margin: auto;
    max-width: 60%;
    max-height: 60%;
}

.line-div {
    display: block;
    height: 1px;
    border: 0;
    border-top: 2px solid #1a9d7c;
    margin: 1em 0;
    padding: 0;
}

.suggested-tasks {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

.task-icon {
    display: block;
    margin: auto;
}

.tool-category {
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-top: 10px;
}

/* GLOBAL FOOTER */

footer.footer {
    text-align: left;
    padding: 10px 0 10px;
    margin-top: 0;
    border-top: none;
    background-color: var(--carexc-blue-color);
    color: rgba(255, 255, 255, 1);
}

.footer .row > div {
    padding-top: 18px;
}

.footer .row > div p {
    font-size: 16px;
    color: rgba(255, 255, 255, 1);
}

.footer .row .col-logo {
    padding-top: 1px;
}

.footer .col-legal {
    text-align: right;
    white-space: nowrap;
}

.footer .col-nav span,
.footer .col-legal span {
    display: none;
}

.footer a {
    color: rgba(255, 255, 255, 1);
}

.footer a:hover {
    text-decoration: underline;
}

.footer .col-logo a {
    padding: 1px;
}

.footer .navigation a {
    padding: 0 10px;
}

@media (min-width: 768px) {
    .footer .col-nav span {
        display: inline-block;
    }
}

@media (min-width: 992px) {
    .footer .col-legal span {
        display: inline-block;
    }
}

/* COMMON to Most Pages */

.page {
    background-color: rgba(255, 255, 255, 1);
}

.page-title {
    margin-top: 24px;
}

.page-title h3 {
    font-size: 40px;
    font-weight: 300;
    text-transform: capitalize;
    margin: 0;
    padding: 0 0 8px 0;
    border-bottom: 2px solid rgba(0, 0, 0, 0.5);
}

.page-title h4 {
    font-size: 24px;
    font-weight: 300;
    margin: 0;
    padding: 8px 0 8px 0;
    border-bottom: 2px solid rgba(0, 0, 0, 0.5);
}

.page-title-prefix {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 400;
}

.page-title-small {
    font-size: 30px;
}

.page-title p {
    font-size: 22px;
    font-weight: 300;
    line-height: 140%;
    margin: 8px 0 0 0;
    padding: 0;
}

.page-content {
    padding-top: 24px;
    margin-bottom: 40px;
}

.row-section-heading {
    margin-top: 16px;
}

.row-section-heading h3 {
    font-size: 24px;
    font-weight: 100;
    text-transform: none;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

.row-section-heading p {
    font-size: 18px;
    margin-top: 8px;
    margin-bottom: 10px;
}

.page-quote {
    background-color: rgba(221, 241, 236, 1);
    margin-top: 0;
    padding: 8px 0 12px;
}

.page-quote h2 {
    margin: 0;
    padding: 0;
    font-size: 24px !important;
    font-weight: 100;
    color: var(--carexc-blue-color);
    text-align: center;
}

.hdg-meta-data {
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
    margin-right: 8px;
}

.callout {
    margin-top: 24px;
    padding: 8px 16px;
    box-sizing: border-box;
    background-color: rgba(221, 241, 236, 1);
    border-radius: 4px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.btn-toolbar .btn {
    width: 100%;
    margin: 8px 0;
}

@media (min-width: 768px) {
    .page-quote h2 {
        font-size: 54px !important;
        letter-spacing: -2px;
    }
    .btn-toolbar .btn {
        width: auto;
        margin: 0 4px;
    }
}

/* min-width:768px */

/* TEXT_BOXES...  */

.text_box_green {
    margin-top: 16px;
}

.text_box_green h2 {
    font-size: 40px;
    font-weight: 100;
    color: white;
    text-transform: none;
    padding-bottom: 8px;
}

.text_box_green p {
    font-size: 18px;
    color: white;
    margin-top: 8px;
    margin-bottom: 20px;
}

.text_box_white {
    margin-top: 16px;
}

.text_box_white h2 {
    font-size: 40px;
    font-weight: 100;
    color: #4990e2;
    text-transform: none;
    padding-bottom: 8px;
}

.text_box_white p {
    font-size: 18px;
    color: #666;
    margin-top: 8px;
    margin-bottom: 20px;
}

.ann-picture {
    position: absolute;
    left: 580px;
    top: -140px;
}

/* WHY CAREXC Page */

.page-why h2 {
    font-size: 40px;
    font-weight: 100;
    line-height: 110%;
    color: var(--carexc-blue-color);
    /* blue */
}

.page-why h5 {
    margin-top: 8px;
    font-size: 24px;
    font-weight: 200;
    color: var(--carexc-blue-color);
    /* blue */
}

.row-challenge h2,
.row-challenge h5 {
    color: var(--carexc-green-color);
    /* green */
}

.row-challenge h2 span {
    display: none;
}

.page-why hr {
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.5);
}

.chart {
    margin-top: 20px;
    margin-bottom: 0;
}

.chart h6 {
    font-size: 14px;
    font-weight: 600;
    line-height: 120%;
}

.chart img {
    width: 90%;
    margin-top: 12px;
}

.circle {
    width: 100%;
    margin: 0 auto 20px;
}

.circle-icon {
    -webkit-clip-path: circle();
}

.circle::after {
    border-radius: 50%;
    content: '';
    display: block;
    height: 0;
    padding-bottom: 100%;
    width: 100%;
}

.circle > div {
    color: rgba(255, 255, 255, 1);
    float: left;
    padding-top: 15%;
    text-align: center;
    width: 100%;
}

.row-steps {
    margin-top: 16px;
}

.row-steps .circle {
    width: 136px;
    background-color: rgba(74, 144, 226, 0.5);
    /* blue */
    margin: 16px 0 0;
}

.row-steps .circle div {
    font-size: 84px;
    font-size: 8em;
    font-weight: 300;
    margin-top: -0.3em;
    opacity: 0.8;
}

.step {
    position: relative;
}

.step h1 {
    position: absolute;
    bottom: 22px;
    left: 32px;
    font-size: 40px;
    font-weight: 100;
    line-height: 90%;
    color: var(--carexc-blue-color);
    /* blue */
}

.step-note {
    position: relative;
}

.step-note p {
    font-size: 24px;
    font-weight: 200;
    line-height: 110%;
    color: rgba(0, 0, 0, 0.5);
    margin-top: 24px;
    margin-left: 20px;
}

.step-note .fa {
    position: absolute;
    top: -8px;
    left: 0;
    font-size: 64px;
    color: rgba(0, 0, 0, 0.1);
}

.step-note .btn {
    margin-top: 16px;
    margin-left: 40px;
}

@media (min-width: 768px) {
    .chart {
        margin-bottom: 12px;
    }
    .chart h6 {
        font-size: 18px;
    }
    .row-steps .circle {
        width: 168px;
    }
    .step h1 {
        font-size: 64px;
        bottom: 28px;
    }
    .step-note p {
        font-size: 32px;
    }
}

/* min-width: 768px */

@media (min-width: 992px) {
    .page-why h2 {
        font-size: 54px;
    }
    .page-why h5 {
        margin-top: 8px;
        font-size: 36px;
    }
    .row-challenge h2 span {
        display: inline;
    }
    .chart h6 {
        font-size: 18px;
    }
    .row-steps .circle {
        width: 300px;
        margin: 16px 0 0;
    }
    .row-steps .circle div {
        font-size: 300px;
        margin-top: -116px;
    }
    .step h1 {
        bottom: 48px;
        left: 84px;
        font-size: 84px;
        line-height: 100%;
    }
    .step-note p {
        font-size: 34px;
        line-height: 110%;
    }
    .step-note .fa {
        position: absolute;
        top: -24px;
        left: -64px;
        font-size: 150px;
    }
    .step-note .btn {
        margin-top: 16px;
    }
    .step-note-4-2 .btn {
        margin-top: -32px;
        margin-left: 120px;
    }
    .step-note-1-1 {
        margin-top: 32px;
    }
    .step-note-1-2 {
        margin-top: -160px;
    }
    .step-note-1-3 {
        margin-top: -40px;
    }
    .row-steps-2,
    .step-2 {
        margin-top: -64px;
    }
    .step-note-2-1 {
        margin-top: -24px;
    }
    .step-note-2-2 {
        margin-top: -88px;
    }
    .step-note-2-3 {
        margin-top: 0;
    }
    .row-steps-3,
    .step-3 {
        margin-top: 16px;
    }
    .step-note-3-1 {
        margin-top: -312px;
    }
    .step-note-3-2 {
        margin-top: -48px;
    }
    .step-note-3-3 {
        margin-top: -40px;
    }
    .row-steps-4,
    .step-4 {
        margin-top: -32px;
    }
    .step-note-4-1 {
        margin-top: -32px;
    }
    .step-note-4-2 {
        margin-top: -80px;
    }
    .step-note-4-3 {
        margin-top: 0;
    }
}

/* min-width: 992px */

@media (min-width: 1170px) {
    .step-note-1-3 {
        margin-top: 0;
        margin-left: -64px;
    }
    .step-2 h1 {
        padding-right: 80px;
    }
    .step-3 h1 {
        padding-right: 80px;
    }
    .row-steps-4,
    .step-4 {
        margin-top: -24px;
    }
    .step-note-4-1 {
        margin-top: -40px;
    }
    .step-note-4-3 {
        margin-top: 8px;
    }
}


/* min-width: 1170px */
