/*
  Portal 2025 styles
rgb(180, 237, 251)  light blue header
#2bc421 = button green
#61d259 = green link
#032035 = near black
#ff4b00 = take action
#ffb900 = needs work
#2bc421 = well done
#818f9a = not assessed
#818f9a = not registered
#0275c9 = in progress blue
#2bc421 = complete

*/

/*html, body {
   height: 100%;
}*/
/* bootstrap will reduce animations unless we do this - that is, font-awesome animations won't work without this */
.fa-beat, .fa-bounce, .fa-fade, .fa-beat-fade, .fa-flip, .fa-pulse, .fa-shake, .fa-spin, .fa-spin-pulse
{
  animation-duration: 2s;
  animation-iteration-count: infinite;
}
.icon-pad-left {
   padding-left: .5em;
}
.icon-pad-right {
   padding-right: .5em;
}
progress {
   border-radius: 6px;
   color: #0275c9;
   /* Firefox: Unfilled portion of the progress bar */
   background: #eee;
}

/* Firefox: Filled portion of the progress bar */
progress::-moz-progress-bar {
   border-radius: 6px 0px 0px 6px;
   background: #0275c9;
}

/* Chrome & Safari: Unfilled portion of the progress bar */
progress::-webkit-progress-bar {
   border-radius: 6px 6px 6px 6px;
   background: #eee;

}

/* Chrome & Safari: Filled portion of the progress bar */
progress::-webkit-progress-value {
   border-radius: 6px 0px 0px 6px;
   background: #0275c9;
}

body {
   margin: 0;
   padding: 0;
   font-family: "Oxygen", sans-serif;
   font-size: 16px;
   color: #032035;
}

.trophy-image {
   max-width:76px !important;
   max-height:76px !important;
}

.ellipsis {
   overflow: hidden;
   -ms-text-overflow: ellipsis;
   -o-text-overflow: ellipsis;
   text-overflow: ellipsis;
   display: block;
   white-space: nowrap;
}

.clickable {
   cursor: pointer;
}

.caption {
   font-size: 10px;
}

.hidden {
   display: none;
}

.not-visible {
   visibility: hidden;
}

.layout-ul {
   list-style: none;
   margin: 0;
   padding: 0;
}

.global-close {
   cursor:pointer;
   color:red;
}
.global-link {
   cursor: pointer;
   color: #2bc421 !important;
   /* 12-26 DD changed because it is too light color: #61d259 !important; */
   text-decoration: none;
}

.global-link-off {
   color: lightgrey !important;
}

.for-app {
   display: none;
}

.mobile-app .for-web,
.mobile-device .for-web {
   display: none;
}

.mobile-app .for-app,
.mobile-device .for-app {
   display: initial;
}

.mobile-nav-set {
   position: relative;
   z-index: 1023;
   width: 100%;
   /*background-color: #107dcc;*/
}

#mobile_app_nav {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   max-width: 400px;
   /*height: 62px;*/
   margin: 0 auto;
   overflow: hidden;
   font-size: 26px;
   /*color: white;*/
}

#mobile_app_nav .mobile-app-nav-item {
   text-align: center;
   line-height: 1;
   padding: 8px 0;
}

#mobile_app_nav .mobile-app-nav-item .mobile-nav-label {
   padding-top: 4px;
   padding-bottom: 3px;
   font-size: 12px;
}

.reloading-spinner-container {
   position: relative;
   top: -8px;
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
   align-items: flex-start;
   width: 100%;
   font-size: 24px;
}

.view-more-arrow {
   font-size:11pt;
   padding-right:4px;
}

.my-rewards-more-switch {
   font-weight:bold;
   text-align:center;
   padding-top: 12px;
   font-size:14px;
}

.btn-disabled {
   cursor: not-allowed !important;
   opacity: 0.6 !important;
}
/* Used in surveys */
.buttonGrey {
   background-color:#eee !important;
   color:#333 !important;
}
.global-pri-button {
   cursor:pointer;
   background-color: #2bc421;
   border: 1px solid #2bc421;
   color: #032035;
   border-radius: 8px;
   padding: 5px 16px;
   font-size: 14px;
}
.button-xs {
   padding: 3px 6px;
   font-size: 10px;
   border-radius: 4px;
   display: inline;
}
.button-md {
   cursor:pointer;
   padding: 5px 16px;
   font-size: 14px;
   border-radius: 8px;
   display: inline;
}

.button-single-line {
   display:block;
   margin: 2em .5em;
   text-align:center;
}
.inline-button {
   display:inline;
   padding:.75em;
   text-align:center;
   font-size:14px;
   white-space: nowrap;

}

.global-pri-icon-btn {
   font-size: 24px !important;
   color: #2bc421;
}

.global-sec-button {
   cursor:pointer;
   background-color: transparent;
   color: #032035;
   border: 1px solid darkgrey;
   border-radius: 8px;
   padding: 5px 16px;
   font-size: 14px;
}
.button-no-border {
   border:none;
}
.global-sec-icon-btn {
   font-size: 24px !important;
   color: #2bc421;
}

/* Should be replaced by global-sec-button */
.global-grey-button {
   background-color: #FFF;
   color: #032035;
   border: 1px solid #2bc421;
   border-radius: 8px;
   font-size: 14px;
}

/* Should be replaced by global-pri-button */
.greenButton {
   padding: 7px 18px;
   border: none;
   border-radius: 10px;
   background-color: #2bc421;
   color: #032035;
}

.listing-sep-border {
   border: 1px solid #f7f8f9;
}

text, textarea {
   caret-color: black;
}

.activity-subcategory-icon {
   width: 18px;
}

.activity-listing-title {
   padding-top: 6px;
   line-height:1.1;
   font-size: 16px;
   font-weight:bold;
   color: #2bc421;
}

.activity-listing-caption {
   display:block;
   font-size: 12px;
   font-weight:normal;
   color: #032035;
   padding-left: 4px;
   line-height:1.3;
}
.caption-no-click {
   color: #032035 !important;
}

.ONE .learnMore { color:#581c58; background:#581c58 url(images/buttonBack.png);}
.TWO .learnMore { color:#a92907; background:#a92907 url(images/buttonBack.png);}
.THREE .learnMore { color:#d75764; background:#d75764 url(images/buttonBack.png);}
.FOUR .learnMore { color:#c80615; background:#c80615 url(images/buttonBack.png);}
.FIVE .learnMore { color:#007042; background:#007042 url(images/buttonBack.png);}
.SIX .learnMore { color:#4c4044; background:#4c4044 url(images/buttonBack.png);}
.SEVEN .learnMore { color:#ff8400; background:#ff8400 url(images/buttonBack.png);}
.EIGHT .learnMore { color:#8b1428; background:#8b1428 url(images/buttonBack.png);}
.NINE .learnMore { color:#506987; background:#506987 url(images/buttonBack.png);}
.TEN .learnMore { color:#876059; background:#876059 url(images/buttonBack.png);}
.ELEVEN .learnMore { color:#8845af; background:#8845af url(images/buttonBack.png);}
.TWELVE .learnMore { color:#a45b8b; background:#a45b8b url(images/buttonBack.png);}
.THIRTEEN .learnMore { color:#3a52d2; background:#3a52d2 url(images/buttonBack.png);}
.FOURTEEN .learnMore { color:#ffa700; background:#ffa700 url(images/buttonBack.png);}
.FIFTEEN .learnMore { color:#8dc63f; background:#8dc63f url(images/buttonBack.png);}
.SIXTEEN .learnMore { color:#19c2ec; background:#19c2ec url(images/buttonBack.png);}

.modal-header {
   /*border: none;*/
}
.modal-title {
   color: #304458;
   font-weight: bold;
   font-size: 18px;
}
.popupWindow {
   display:none;
   width: 80%;
   max-width: 600px;
   min-width: 300px;
   border-radius: 8px;
   background-color: white;
   border: 1px solid #005e91;
   box-shadow: 4px 4px 4px #ccc;
   color:#005e91;
   padding: 8px;
   margin: 8px;
   text-align:center;
}

.toggle-open-close-icon {
   padding-left: 0;
   padding-right: 4px;
   font-size: 16px;
}

.page-wrap {
   width: 100%;
   height: 100%;
   overflow: hidden;
   background-color: #FFF;
   color: #032035;
}

#common_loading_spinner_set {
   position: fixed;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 1020;
   overflow: hidden;
   -webkit-overflow-scrolling: touch;
   outline: 0;
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
   align-items: center;
   background-color: rgba(0, 0, 0, 0.30);
   padding: 0;
}

#common_loading_spinner_set .common-loading-spinner {
   text-align: center;
}

#common_loading_spinner_set .fa-spinner {
   font-size: 64px;
}

.mw-portal-page {
   height: 100%;
   margin-top: -4px;
}

.mw-portal-header-container {
   position: sticky;
   left: 0;
   width: 100%;
   z-index: 1026;
   box-shadow: 4px 4px 4px lightgrey;
}

.portal-cap {
   height: 12px;
   background-image: linear-gradient(to right, #012946, #0275c9);
}

/* Used only for SVG gradient
#portal_cap_gradient,
#portal_cap_rect {
   height: 10px;
}

.portal-cap-gradient-start {
   stop-color: #012946;
}

.portal-cap-gradient-end {
   stop-color: #0275c9;
}
*/

#portal_cap_rect {
   fill: url(#cap_gradient);
}

.mw-portal-header-row {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   height: 76px;
   padding: 0 40px;
}

.mobile-app .mw-portal-header-row,
.mobile-device .mw-portal-header-row {
   padding: 0 20px;
}

.portal-header-logo {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

#header_logo img {
   max-height: 72px;
   max-width: 200px;
   object-fit: contain;
}

.portal-header-account-set {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   padding-left: 20px;
}

.portal-header-account-set .inner {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-end;
}

#users_name {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   width: 26px;
   height: 26px;
   margin-right: 4px;
   border-radius: 50%;
   background-color: #032035;
   color: #FFFFFF;
   text-align: center;
}

.mw-portal-content {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: flex-start;
}

.mobile-app .mw-portal-content,
.mobile-device .mw-portal-content {
   flex-direction: column;
   justify-content: space-between;
}

.mw-portal-left-nav {
   position: relative;
   z-index: 1023;
   flex-shrink: 0;
   display: flex;
   flex-flow: column nowrap;
   justify-content: space-between;
   width: 230px;
}

.mw-portal-left-nav .left-nav-box {
   margin: 20px;
}

.mw-portal-left-nav .nav-footer {
   /*position: absolute;
   left: 0;
   bottom: 0;*/
   width: 190px;
   font-size: 14px;
}

.mw-portal-left-nav .nav-footer .foot-menu {
   text-align: left;
}

.main-menu {
   font-size: 18px;
}

.main-menu-item {
   padding: 18px 10px;
   border-bottom: 1px solid lightgrey;
}

.main-menu-item:last-of-type {
   border: none;
}

.main-menu-item i {
   width: 36px;
   padding: 0;
}

.mw-portal-main-body {
   flex-grow: 1;
   /*width: 100%;*/
   overflow-y: auto;
   /*padding: 50px 80px;*/
   /*min-width: 320px;*/
}

.page-main-body-wrap {
   border-radius: 10px;
}

.mobile-app .mw-portal-main-body,
.mobile-device .mw-portal-main-body {
   width: 100%;
}


#main_body_content {
   min-width: 320px;
}

.header-account-messages {
   position: relative;
   margin-right: 24px;
   font-size: 20px;
   line-height: normal;
}

.header-account-messages i {
   padding: 0;
}

.header-account-menu-handle {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-end;
   align-items: center;
}

.header-account-menu-handle i {
   font-size: 16px;
}

.header-account-menu-container {
   position: relative;
}

.header-account-menu-body {
   width: 160px;
   position: absolute;
   top: 30px;
   right: 0;
   z-index: 800;
   display: none;
   border-radius: 10px;
   background-color: #FFF;
   padding: 12px 0;
   text-align: center;
   box-shadow: 4px 4px 4px lightgrey;
}

.header-account-menu-item {
   padding: 16px 0;
   border-bottom: 1px solid lightgrey;
}

.header-account-menu-item:first-of-type {
   padding-top: 6px;
}

.header-account-menu-item:last-of-type {
   border: none;
   padding-bottom: 6px;
}

.new-message-indicator {
   position: absolute;
   top: 3px;
   right: -4px;
   width: 8px;
   height: 8px;
   background-color: #00cc00;
   border-radius: 50%;
}

.header-account-messages.no-unread-messages .new-message-indicator {
   display: none;
}

.page-content-container {
   margin: 0 auto;
   /*background-color: rgba(255, 255, 255, 0.7);*/
   border-radius: 10px;
   /*padding: 0 40px 30px 40px;*/
}

.page-header-row {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   height: 77px;
   padding: 0 100px;
   /*margin-bottom: 20px;*/
   border-bottom: 2px solid #bfbfbf;
}

.mobile-app .page-header-row,
.mobile-device .page-header-row {
   padding: 0 10px;
}

.page-header-go-back {
   margin-top: 3px;
   margin-right: 12px;
   padding: 0 4px;
   font-size: 24px;
   font-weight: bold;
}

.page-header-goback {
   display: flex;
   flex-flow: column nowrap;
   justify-content: flex-start;
   text-align: right;
   margin-right: 4px;
   font-size: 24px;
   font-weight: bold;
}

i.goback-icon {
   /*padding-right: 3px !important;*/
}

.primary-page-content {
   padding: 20px 100px;
}

.dashboard-content-container {
   padding-top: 25px;
}

/*.page-content-row {
   padding: 0 36px 20px 36px;
}*/

.page-header-title-set {
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
   align-items: center;
   font-size: 26px;
   font-weight: bold;
}

.section-heading {
   margin-bottom: 16px;
   font-size: 24px;
}

.pill-nav-set {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
}

.pill-nav-item {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   height: 36px;
   margin: 0 8px;
   border: none;
   border-radius: 18px;
   padding: 0 12px;
   text-align: center;
   color: #032035;
}

.pill-nav-item.active {
   background-color: #bfedbc;
   font-weight: bold;
}

.circular-chart {
   display: block;
   margin: 5px auto;

   /*background-color: rgba(255, 255, 255, 0.82);*/
}

/*.circular-chart-circle-outer {
   fill: none;
   stroke: #ccc;
   stroke-width: 3.5;
}*/

.circular-chart-circle-bg {
   fill: none;
   stroke: #eee;
   stroke-width: 2.5;
}

.circular-chart-circle {
   fill: none;
   stroke-width: 2.5;
   stroke-linecap: round; /* *butt|round|square */
   animation: progress 1100ms ease-out forwards;
   /*transform: rotate(-20deg);
   transform-origin: 50% 50%;*/
}

.circular-chart-fatcircle-bg {
   fill: none;
   stroke: #eee;
   stroke-width: 6;
}

.circular-chart-fatcircle {
   fill: none;
   stroke-width: 6;
   stroke-linecap: round; /* *butt|round|square */
   animation: progress 1100ms ease-out forwards;
   /*transform: rotate(-20deg);
   transform-origin: 50% 50%;*/
}

.icon-round {
   position: relative;
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   width: 82px;
   height: 82px;
   background-color: #dff6de;
   border-radius: 50%;
   text-align: center;
}

.circular-chart-value-txt {
   /* fill: #0275c9; */
   fill:#032035;
   font-size: 5px;
   text-anchor: middle;
}

.circular-chart-value-xbig-txt {
   /* fill: #0275c9; */
   fill:#032035;
   font-size: 10px;
   font-weight:bold;
   text-anchor: middle;
}

.circular-chart-value-big-txt {
   /* fill: #0275c9; */
   fill:#032035;
   font-size: 8px;
   font-weight:bold;
   text-anchor: middle;
}

.circular-chart-value-med-txt {
   /* fill: #0275c9; */
   fill:#032035;
   font-size: 7px;
   font-weight:bold;
   text-anchor: middle;
}
.circular-chart-value-small-txt {
   /* fill: #0275c9; */
   fill:#032035;
   font-size: 6px;
   font-weight:normal;
   text-anchor: middle;
}

svg text.p25fa-icon {
   font-family: 'Font Awesome 5 Pro';
   font-size: 12px;
   width: 100%;
   text-anchor: middle;
}

#my_rewards_listing svg text.p25fa-icon {
   font-size: 10px;
}

#my_rewards_listing_more svg text.p25fa-icon {
   font-size: 10px;
}

.rf-take-action {
   color: #ff4b00;
}

.rf-needs-work {
   color: #ffb900;
}

.rf-well-done {
   color: #2bc421;
}
.rf-not-assessed {
   color: #818f9a;
}

.rf-bg-take-action {
   /* background-color: #ffc8b1 !important; */
   color: #032035 !important;
   background-color:white;
   border: 2px solid #ff4b00;
}

.rf-bg-needs-work {
   /* background-color: #ffe9b1 !important; */
   color: #032035 !important;
   background-color:white;
   border: 2px solid #ffb900;

}

.rf-bg-well-done {
   /* background-color: #bfedbc !important; */
   color: #032035 !important;
   background-color:white;
   border: 2px solid #2bc421;
}
.rf-bg-not-assessed {
   background-color: #c3c4c5;
   color: #032035 !important;
}

tr.haYouRow {
   display:block;
   margin: 0;
   padding:4px;
   width:100px;
}
td.haYouCol {
   width:33%;
   color:white;
   text-align:center;
   line-height:1;
   padding-top:6px;
   padding-bottom:6px;
}
td.haYouColDesc {
   width:33%;
   background-color:white;
   line-height:1.05;
   font-weight:bold;
   text-align:center;
}
td.haYouColRange {
   width:33%;
   background-color:white;
   line-height:1.4;
   font-weight:normal;
   text-align:center;
}

.resource-card {
   display: flex;
   flex-flow: column nowrap;
   justify-content: space-between;
   margin: 0 8px 20px 8px;
   padding: 7px 12px;
   border: 1px solid lightgrey;
   border-radius: 10px;
   box-shadow: 4px 4px 4px lightgrey;
}

.card-top-line {
   margin: 10px 0;
}

.card-title-row {
   margin-bottom: 16px;
   /*white-space: nowrap;*/
   overflow: hidden;
   font-weight: bold;
   text-overflow: ellipsis;
}

.card-top-line.card-row-flex {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
}

.resource-card .card-title-row {
   margin-bottom: 10px;
   font-size: 16px;
   font-weight: bold;
}

.resource-card .card-more-row {
   text-align: right;
   font-size: 12px;
}

.card-title-icon {
   color: #0275c9;
}

.card-foot-link {
   text-align: center;
}

.card-view-all-row {
   font-size: 14px;
   font-weight: bold;
}

.card-space-above {
   margin-top: 12px;
   margin-bottom: 12px;
}

.page-content-card {
   margin-bottom: 40px;
   border: 1px solid lightgrey;
   border-radius: 10px;
   background-color: #FFF;
   box-shadow: 4px 4px 4px lightgrey;
   padding: 16px;
}

.card-info-box {
   font-size: 14px;
   margin: 16px 0;
}

.details-page-header {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   height: 148px;
   padding: 0 100px;
   background-color: #f2f8fc;
}

.mobile-app .details-page-header,
.mobile-device .details-page-header {
   padding: 0 0;
   /* changed from 0 10px DD 2025-03-13 to get rid of scrolling*/
}

.details-page-title {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   font-size: 18pt;
}
.details-page-title2 {
   font-size: 12pt;
}
@media (max-width: 710px) {
   .details-page-title {
      font-size: 12pt;
}
}

.details-page-body-row {
   padding: 20px 100px;
}

.mobile-app .details-page-body-row,
.mobile-device .details-page-body-row {
   padding: 20px 10px;
}

.res-favorite-icon {
   color: #cbe3f4;
}

.selected-fav .res-favorite-icon {
   color: #2bc421;
}

.search-result-item {
   padding: 4px 8px;
}

.resource-card .res-type,
.search-result-item .res-type {
   padding: 2px 6px;
   font-size: 12px;
}

.search-result-item .res-type {
   margin-right: 7px;
}

.resource-card.rtype-art .res-type,
.search-result-item.rtype-art .res-type {
   background-color: #cbe3f4;
   color: #0275c9;
}

.resource-card.rtype-web .res-type,
.search-result-item.rtype-web .res-type {
   background-color: #cbe3f4;
   color: #0275c9;
}

.resource-card.rtype-prc .res-type,
.search-result-item.rtype-prc .res-type {
   background-color: #cbe3f4;
   color: #0275c9;
}

.resource-card.rtype-sym .res-type,
.search-result-item.rtype-sym .res-type {
   background-color: #cbe3f4;
   color: #0275c9;
}

.resource-card.rtype-vid .res-type,
.search-result-item.rtype-vid .res-type {
   background-color: #ffe4d9;
   color: #ff7136;
}

.resource-card.rtype-podcast .res-type,
.search-result-item.rtype-podcast .res-type {
   background-color: #ffe4d9;
   color: #ff7136;
}


.resource-card.rtype-sls .res-type,
.search-result-item.rtype-sls .res-type {
   background-color: #ffe4d9;
   color: #ff7136;
}

.resource-card.rtype-dis .res-type,
.search-result-item.rtype-dis .res-type {
   background-color: #ffe4d9;
   color: #ff7136;
}

.resource-card.rtype-qte .res-type,
.search-result-item.rtype-qte .res-type {
   background-color: #ffe4d9;
   color: #ff7136;
}

.resource-card.rtype-pdf .res-type,
.search-result-item.rtype-pdf .res-type {
   background-color: #fff5d9;
   color: #ffc836;
}

.resource-card.rtype-rcp .res-type,
.search-result-item.rtype-rcp .res-type {
   background-color: #fff5d9;
   color: #ffc836;
}

.resource-card.rtype-faq .res-type,
.search-result-item.rtype-faq .res-type {
   background-color: #fff5d9;
   color: #ffc836;
}

.resource-card.rtype-qa .res-type,
.search-result-item.rtype-qa .res-type {
   background-color: #d9dee1;
   color: #032035;
}

.resource-card.rtype-upl .res-type,
.search-result-item.rtype-upl .res-type {
   background-color: #d9dee1;
   color: #032035;
}

.resource-card.rtype-abt .res-type,
.search-result-item.rtype-abt .res-type {
   background-color: #d9dee1;
   color: #032035;
}

.resource-card.rtype-tip .res-type,
.search-result-item.rtype-tip .res-type {
   background-color: #d9dee1;
   color: #032035;
}

.resource-card .card-more-row {
   margin: 10px 0;
}

#resources_details_container {
   padding: 0 !important;
}

.resource-details-header {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   height: 148px;
   padding: 0 60px;
   background-color: #f2f8fc;
}

.resources-details-rtype-container {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

.resources-details-rtype {
   padding: 2px 6px;
   font-size: 12px;
}

.resources-details-body-container {
   margin-top: 20px;
   padding: 0 60px 20px 60px;
}

.video-wrapper {
   text-align: center;
}

.video-player-box {
   position: relative;
   width: 100%;
   min-height: 400px;
   margin: 0 auto;
   /*padding-bottom: 56.33%;*/
   text-align: center;
}

.video-player-box iframe,
.video-player-box object,
.video-player-box embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   /*height: 100%;*/
   margin: 0 auto;
   text-align: center;
}

.video-player-heading {
   text-align: left;
}


/* Mayo Search */
.mayo-logo-row {
   margin-bottom: 12px;
   text-align: center;
}

.mayo-search-box {
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
   margin-bottom: 10px;
}

.mayo-search-desc {
   margin-bottom: 10px;
}

.mayo-search-btn {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

.mayo-search-field {
   width: 65%;
}

.search-result-item-main-row {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
}

.item-inline {
   display: inline-block;
}

.search-result-item-title {
   font-size: 16px;
   font-weight: bold;
}

.row-hover-bg:hover {
   background-color: #f4fcf4;
}

#my_rewards-container {
   min-width: 290px;
   border-radius: 10px;
}

.my-rewards-container-header {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   background-image: linear-gradient(to right, #012946, #0275c9);
   padding: 18px 24px;
   color: #FFF;
   font-size: 16px;
   box-shadow: 4px 0 8px lightgrey;
}

.my-rewards-container-header .my-rewards-container-header-title {
   font-size: 18px;
   font-weight: bold;
}

.my-rewards-container-listing {
   border: 1px solid lightgrey;
   border-top: none;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   box-shadow: 4px 4px 8px lightgrey;
   min-height: 100px;
   padding: 20px 0;
}

.my-rewards-listing,
.my-rewards-listing-more {
   display: flex;
   flex-flow: row wrap;
   justify-content: space-between;
}

.reward-spouse-header {
   text-align:center;
   padding-top:2px;
   padding-bottom:2px;
   border-radius:4px;
   background-color:#efefef; /*:#1176C0;*/
   color:#032035;
   font-size:12px;
}

.reward-image {
   max-height:96px;
   max-width:96px;
   height:auto;
   width:auto;
}

#my_rewards_listing .reward-item {
   width: 50%;
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   padding: 8px 12px;
   font-size: 14px;
   align-items:flex-start;
}

#my_rewards_listing_more .reward-item {
   width: 50%;
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   padding: 8px 12px;
   font-size: 14px;
}
#my_rewards_listing .reward-item:nth-child(odd) {
   border-right: 2px solid lightgrey;
}

#my_rewards_listing_more .reward-item:nth-child(odd) {
   border-right: 2px solid lightgrey;
}

.my-rewards-listing-more {
   display: none;
}

.my-rewards-container-more-row {
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
}

.reward-chart-wrapper {
   width: 85px;
}
.reward-item-progress {
   width: 76px;
   /*height: 76px;
   display:flex;*/
   padding-right:6px;
}

.reward-item-title-row,
.reward-item-progress-row {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
}

.reward-item-title-row {
   margin-bottom: 10px;
   color: #2bc421;
}

.reward-item-progress-row {
   flex-wrap: wrap;
}

/*reward-item-title-row .reward-item-title-more, */
.reward-item-title-row .reward-item-title {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

.reward-item-title-row .reward-item-title {
   font-size: 16px;
   font-weight: bold;
}

.reward-item-title-row .reward-item-title-more {
   padding-left: 20px;
}
.reward-item-title-row .reward-item-title-more i {
   padding: 0;
}

.reward-item-info {
   width: 100%;
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   padding-left: 6px;
}

.reward-item-progress-row .inner {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
}

.reward-item-progress-row .reward-status {
   font-size: 12px;
   font-weight: bold;
}

.reward-item-progress-row .reward-item-earned {
   /* color: #818f9a; */
   color:#032035;
}

.reward-not-started {
   color: #818f9a;
}

.reward-started {
   color: #0275c9;
}

.reward-complete {
   color: #2bc421;
}

.dashboard-cards-row {
   display: flex;
   flex-flow: row wrap;
   justify-content: space-between;
   margin-top: 45px;
}

.dashboard-cards-col {
   width: 49%;
}

#mh_details_preventive {
   position: relative;
}

#report_preventive_container {
   display: none;
   position: absolute;
   top: 0;
   right: 0;
   z-index: 150;
   width: 87%;
}

.preventive-actions-header {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   margin-bottom: 12px;
}

.preventive-header-title,
.preventive-actions-close {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

.preventive-header-title h4 {
   margin-bottom: 0;
}

/* Goals */
#goals_history_listing .goal-history-item {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
}

#goals_history_listing .goal-icon-col {
   color: #FF4E00;
   font-size: 42px;
}

#goals_history_listing .goal-info-col {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   flex-grow: 1;
   margin: 0 12px;
}

#goals_history_listing .goal-actions-col {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
}

#goals_history_listing .action-btns {
   text-align: center;
}

#goals_history_listing .btn-retry {
   border: none;
   border-radius: 8px;
   background-color: #F5A623;
   padding: 7px 8px;
   color: #FFFFFF;
   font-weight: bold;
}

#goals_history_listing .goal-topic {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   font-weight: bold;
}

#goals_history_listing .goal-topic .goal-topic-icon {
   width: 30px;
   margin-right: 3px;
}

#goals_history_listing .goal-topic .goal-topic-label {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   color: #FF4D00;
}

#goals_history_content {
   position: relative;
}


#coach_goals_listing .goals-progress-inner {
   width: 100%;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: center;
}

#coach_goals_listing #mh_goals .goals-progress-inner {
   width: 100%;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
}

#coach_goals_listing .goal-title {
   font-size: 16px;
   font-weight: bold;
   color: #1176c0;
}

#coach_goals_listing .goals-progress-controls {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: center;
   font-size: 14px;
}

#coach_goals_listing .goals-progress-subtitle {
   font-size: 14px;
}

#coach_goals_listing .goals-progress-controls-btns .record-btns {
   display: flex;
   flex-flow: row nowrap;
   justify-content: center;
}

#coach_goals_listing .goals-progress-controls-btns .btn-record {
   padding-left: 7px;
}

/* My Vision */
.dashboard-my-vision-container {
   margin-top: 16px;
}

#wellness_vision .btns-box {
   flex-grow: 0;
   align-self: flex-start;
}

#wellness_vision .edit-toggle,
#wellness_vision .help-toggle {
   font-size: 32px;
   color: #F5A623;
   cursor: pointer;
}

#wellness_vision .help-toggle {
   color: #6AAB35;
}

#wellness_vision .section-body-heading-title {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   font-weight: bold;
}

#wellness_vision .my-wellness-vision-content {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   background-color: #FFFFFF;
   cursor: pointer;
}

#wellness_vision .my-wellness-vision-text {
   display: flex;
   flex-flow: column nowrap;
   justify-content: center;
   flex-grow: 2;
   padding: 0 14px 0 5px;
}

.my-wellness-vision-text.has-default-value {
   font-weight: bold;
}

#my_vision_editor {
   display: none;
   width: 100%;
   padding: 10px;
   background-color: #FFFFFF;
   text-align: center;
}

#my_vision_editor textarea {
   margin-bottom: 10px;
   width: 100%;
}


.related-activities-item {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   margin: 0 16px;
   padding: 4px 8px;
}

.related-activities-item-title {
   font-size: 16px;
   font-weight: bold;
   color: #2bc421;
}

.related-activities-details {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-end;
}

.related-activities-details-item {
   padding-left: 12px;
}

#messages_listing {
   background-color: #f2f8fc;
}


/* The responsive stuff */
@media (max-width: 1000px) {
   #my_rewards_listing .reward-item {
      width: 100%;
      border: none;
   }
   #my_rewards_listing_more .reward-item {
      width: 100%;
      border: none;
   }
}

@media (max-width: 782px) {
   .resource-card {
      width: 100%;
      margin-left: 0;
      margin-right: 0;
   }

   .reward-item {
      width: 100%;
   }
}

@media (max-width: 768px) {
   .video-player-box {
      width: 92%;
   }

   .primary-page-content {
      padding: 20px;
   }
}

@media (max-width: 710px) {
   #main_body_content {
      min-width: 300px;
   }

   .mw-portal-main-body {
      padding: 0px;
   }
}

@media (max-width: 480px) {
   .video-player-box {
      width: 90%;
   }
}

@media (max-width: 405px) {
   .video-player-box {
      width: 87%;
   }
}
/* ACTIVITIES listings */
.activity-right-container {
   float:right;
   white-space: nowrap;
   text-align:right;
   height: 42px;
   line-height:42px;
}
.activity-left-container {
   line-height: 1;
   text-align:left;
   min-height: 42px;
}
.listing-activity-points {
   display:inline-block;
   color: #032035;
   text-transform: uppercase;
   font-weight:bold;
   font-size:11px;
   padding: 0 10px;
   white-space: nowrap;

}
@media (max-width: 710px) {
   .listing-activity-points {
      font-size: 7pt;
   }
   .activity-listing-title {
      font-size:11pt;
   }
   .reward-activity-listing-title {
      font-size:10pt;
   }
   .listing-activity-status {
	   font-size:7pt;
   }
   .activity-listing-caption {
      font-size:9pt;
   }

}

.listing-activity-points-value {
   background-color: #ced3d6;
   border-radius: 4px;
   padding: 2px 10px;
   white-space: nowrap;
}
.listing-activity-status {
   text-align:left;
   display:inline-block;
   min-width: 108px;
   color: #7c8e95;
   padding: 0 10px;
   text-transform: uppercase;
   font-weight:bold;
   font-size:11px;
   white-space: nowrap;
}

.listing-activity-status i {
   margin-right: 4px;
   font-size: 12px;
}

.listing-activity-right .view-more-link {
   margin-left: 12px;
}

.reward-badge-complete {

   display:inline-block;
   font-size:12px;
   background-color:#2bc421 !important;
   color:white;
   padding: 4px;
   border-radius: 4px;
   margin-right: 8px;
   margin-top: 4px;
}
.reward-badge-notcomplete {
   display:inline-block;
   font-size:12px;
   background-color:#818f9a !important;
   color:white;
   padding: 4px;
   border-radius: 4px;
   margin-right: 8px;
   margin-top: 4px;
}
.reward-badge-inprogress {
   display:inline-block;
   font-size:12px;
   background-color:#0275c9 !important;
   color:white;
   padding: 4px;
   border-radius: 4px;
   margin-right: 8px;
   margin-top: 4px;
}

.activity-inprogress {
   color: #0275c9 !important;
}
.activity-scheduled {
   color: #0275c9 !important;
}
.activity-complete {
   color: #2bc421 !important;
}
.activity-notstarted {
   color: #818f9a !important;
}
.activity-notscheduled {
   color: #818f9a !important;
}
.reward-category-caption {
   color: #0275c9;
   text-transform: uppercase;
   font-size:11pt;
   font-weight:normal;
   /* background-image: linear-gradient(to right, #012946, #0275c9);   */
   padding: 4px 0;
   border-radius: 4px;
}
.reward-subcategory-caption {
   color: #0275c9;
   text-transform: none;
   font-size:12px;
   font-weight:none;
   padding-left:4px;
   margin-top:8px;
}

.reward-category-status {
   font-weight:normal;
   text-transform:none;
}

.reward-activity-listing-title {
   padding-top: 6px;
   padding-left: 3px;
   padding-right: 3px;
   line-height:1.1;
   font-size: 16px;
   font-weight:bold;
   color: #2bc421;
}

.reward-status-points-container {
   height: 76px;
   width: 76px;
   display:block;
   text-align:center;
   line-height:1.1;
}
.reward-status-round-container {
   color:#0275c9 !important;
   border:4px solid #eee;
   background-color:white;
   border-radius: 50%;
}
.reward-status-oor {
   color: #818f9a;
   font-size:15px;
}
.reward-status-points {
   font-size:18px;
   padding-top: 18px;
}
.reward-status-points-label {
   font-size:10px;
}
.reward-status-badge {
   font-size:60px;
   line-height:1.1;
}

.reward-menu {
   line-height: 32px;
}
.reward-menu-handle i {
   font-size: 16px;
}

.reward-menu-container {
   position: relative;
   display:inline-block;
}

.reward-menu-body {
   width: 200px;
   position: absolute;
   top: 32px;
   right: 0;
   display: none;
   border-radius: 10px;
   background-color: #FFF;
   padding: 12px 0;
   text-align: center;
   box-shadow: 4px 4px 4px lightgrey;
}

.reward-menu-item {
   padding: 4px 0;
   border-bottom: 1px solid lightgrey;
}

.reward-menu-item:first-of-type {
   padding-top: 2px;
}

.reward-menu-item:last-of-type {
   border: none;
   padding-bottom: 2px;
}
.reward-progress-bar-container {
   width: 90%;
}

.reward-progress-bar {
   height:25px;
   width: 100%;
}
.reward-progress-caption {
   font-size:11pt;
}
.reward-progress-caption-below {
   font-size:9pt;
   min-width: 20%;
}
.segbar-container {
   width: 90%;
   display:flex;
   flex-wrap:nowrap;
   flex-direction:row;
   justify-content: space-between;
   align-items:stretch;
   align-content:stretch;
   column-gap:4px;
   min-height:12px;
}
.segbar-item {
   text-align:center;
   border-radius:4px;
   flex-grow:1;
   background-color:#ddd;
   /*color:#0275c9;*/
   color:#032035;
}
.segbar-item-caption {
}
.segbar-item-selected {
   background-color:#2bc421;
   color:white;
}

#client_logo_container {
   text-align:center;
}
.home-footer-image {
   max-width: 100%;
   height: auto;
   max-height:180px;
   margin-bottom: 12px;
}
.icon-space-left {
   padding-left: 1em;
}
.icon-space-right {
   padding-right: .5em;
}
