﻿/**
    This is a MASTER LESS file for all css contained in ResourcePackages/CMA. 

    Do not write CSS in this file. Only use to combine other .less files.
    Do not compile other .less file. Only compile this file. 
    Use @import to include new .less files.
*/
/**
    Pavliks 
*/
/**
    CMA specific
*/
/**************************************
    ==============================
            Comment Example
    ============================== 
**************************************/
/****** End (Comment Example) ******/
/**************************************
    ==============================
      Default Listview Overwrites
    ============================== 
**************************************/
.tpc.tpc-listView .tpc-default-style.list-group,
.tpc.tpc-listView .TpcListView.list-group {
  border: 0;
}
.tpc.tpc-listView .tpc-default-style.list-group .list-group-item,
.tpc.tpc-listView .TpcListView.list-group .list-group-item {
  padding: 0;
  margin: 0;
  border: 0;
  width: auto;
}
/****** End (Default Listview Overwrites) ******/
/**************************************
    ==============================
          Grid: Height Auto
    ============================== 
**************************************/
.tpc.tpc-grid .TpcGrid,
.tpc.tpc-subgrid .TpcGrid,
.tpc.tpc-grid .tpcSubgrid,
.tpc.tpc-subgrid .tpcSubgrid,
.tpc.tpc-grid .k-grid-content,
.tpc.tpc-subgrid .k-grid-content {
  height: auto !important;
}
/****** End (Grid: Height Auto) ******/
/**************************************
    ==============================
             Grid Links
    ============================== 
**************************************/
.k-grid table tbody td a {
  color: #DB000B;
  text-decoration: underline;
  font-size: inherit;
  -webkit-transition: all ease-in-out 0.15s;
  -moz-transition: all ease-in-out 0.15s;
  -o-transition: all ease-in-out 0.15s;
  transition: all ease-in-out 0.15s;
  /*&::after {
            content: " \f08e";
            font-family: FontAwesome;
        }*/
}
.k-grid table tbody td a:hover {
  color: #FE000C;
  text-decoration: none;
}
/****** End (Grid Links) ******/
/**************************************
    ==============================
      TEMP: SubGrid Popup Loading
    ============================== 
**************************************/
[data-tpc-role='subgrid-window-placeholder'] .k-loading-mask {
  /*display: none;*/
}
/****** End (SubGrid Popup Loading) ******/
/**************************************
    ==============================
            Comment Example
    ============================== 
**************************************/
/****** End (Comment Example) ******/
/**************************************
    ==============================
              General UI
    ============================== 
**************************************/
.pav-hide {
  display: none;
}
.pav-show-b {
  display: block;
}
.pav-show-ib {
  display: inline-block;
}
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.required::after {
  content: "*";
  font-weight: bold;
  color: red;
}
.cma-contentblock span.btn {
  cursor: pointer;
  -webkit-transition: all ease-in-out 0.15s;
  -moz-transition: all ease-in-out 0.15s;
  -o-transition: all ease-in-out 0.15s;
  transition: all ease-in-out 0.15s;
  padding: 0;
}
.cma-contentblock span.btn a {
  display: block;
  color: inherit;
  padding: 10px 30px;
  text-decoration: none;
}
.cma-contentblock span.btn:hover a,
.cma-contentblock span.btn:focus a,
.cma-contentblock span.btn:not(:disabled):not(.disabled):active a,
.cma-contentblock span.btn:not(:disabled):not(.disabled).active a {
  color: inherit;
}
.pav-popout {
  box-shadow: 0 0 20px #DDDDDD;
  -webkit-transition: all ease-in-out 0.3s;
  -moz-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
.pav-popout:hover,
.pav-popout:focus {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
}
.pav-popout .inner {
  padding: 30px;
  background: #fff;
}
.pav-popout.filled {
  background-color: #fff;
}
.pav-popout.filled.black {
  background-color: #000;
}
/****** End (General UI) ******/
/**************************************
    ==============================
              MyCMA Header
    ============================== 
**************************************/
.mycma-header .mycma-carticon a,
.mycma-header .mycma-loginname a {
  position: relative;
  display: inline-block !important;
  font-size: 1.6rem;
  line-height: 1.4;
  padding: 0 10px;
  color: #000;
  -webkit-transition: all ease-in-out 0.15s;
  -moz-transition: all ease-in-out 0.15s;
  -o-transition: all ease-in-out 0.15s;
  transition: all ease-in-out 0.15s;
}
.mycma-header .mycma-carticon a:hover,
.mycma-header .mycma-loginname a:hover {
  color: #DB000B;
  text-decoration: underline !important;
}
.mycma-header .mycma-carticon a:hover::after,
.mycma-header .mycma-loginname a:hover::after {
  color: #000;
}
.mycma-header .mycma-carticon a::after,
.mycma-header .mycma-loginname a::after {
  content: "|";
  position: absolute;
  top: 3px;
  right: -5px;
  font-size: 1.4rem;
  line-height: 1;
}
.mycma-header .mycma-carticon {
  padding-right: 0;
}
.mycma-header .mycma-loginname {
  padding-right: 0;
  padding-left: 0;
}
/****** End (MyCMA Header) ******/
/**************************************
    ==============================
         TPC Custom Templates
    ============================== 
**************************************/
.tpc .inline-borderless {
  margin: 0;
}
.tpc .inline-borderless .form-control,
.tpc .inline-borderless .form-control-plaintext,
.tpc .inline-borderless .readOnly {
  border: 0;
}
/****** End (TPC Custom Templates) ******/
/**************************************
    ==============================
               CM Steps
    ============================== 
**************************************/
.cm-steps-container cm-steps cm-step.first-of-type {
  padding-top: 0;
}
.cm-steps-container {
  position: relative;
  display: inline-block;
  background: #F2F2F2;
  padding: 30px;
  border: 1px solid #DDDDDD;
  width: 100%;
}
.cm-steps-container .cm-executive:not(.cm-tab),
.cm-steps-container .cm-nonexecutive:not(.cm-tab) {
  display: none;
}
.cm-steps-container .cm-executive:not(.cm-tab).pav-active,
.cm-steps-container .cm-nonexecutive:not(.cm-tab).pav-active {
  display: inline-block;
}
.cm-steps-container .cm-steps-header h2 {
  text-align: center;
  padding-bottom: 20px;
  border-bottom: 2px solid #DB000B;
}
.cm-steps-container .cm-steps-header .cm-tabs {
  position: absolute;
  display: flex;
  align-content: flex-end;
  align-items: flex-end;
  bottom: 100%;
  left: -1px;
}
.cm-steps-container .cm-steps-header .cm-tabs .cm-tab {
  color: #fff;
  font-weight: bold;
  padding: 10px;
  margin: 0;
  background: #000;
  border: 1px solid #DDDDDD;
  border-bottom: 0;
  cursor: pointer;
  -webkit-transition: all ease-in-out 0.15s;
  -moz-transition: all ease-in-out 0.15s;
  -o-transition: all ease-in-out 0.15s;
  transition: all ease-in-out 0.15s;
  text-transform: unset;
}
.cm-steps-container .cm-steps-header .cm-tabs .cm-tab:first-of-type {
  border-top-left-radius: 10px;
  border-right: 1px solid #DDDDDD;
}
.cm-steps-container .cm-steps-header .cm-tabs .cm-tab:last-of-type {
  border-top-right-radius: 10px;
}
.cm-steps-container .cm-steps-header .cm-tabs .cm-tab:hover {
  color: #fff;
  background: #000;
}
.cm-steps-container .cm-steps-header .cm-tabs .cm-tab.pav-active {
  color: #000000;
  background: #F2F2F2;

}
.cm-steps-container .cm-steps-footer [class*=col] {
  display: flex;
  flex-direction: column;
  margin: 10px 0;
}
.cm-steps-container .cm-steps-footer [class*=col] .btn {
  margin: 10px 0;
}
.cm-steps-container .cm-steps {
  padding: 20px 0;
}
.cm-steps-container .cm-steps .cm-step {
  position: relative;
  padding: 20px 0;
}
.cm-steps-container .cm-steps .cm-step:first-of-type {
  padding-top: 0;
}
.cm-steps-container .cm-steps .cm-step:last-of-type {
  padding-bottom: 0;
}
.cm-steps-container .cm-steps .cm-step .row {
  align-items: center;
}
.cm-steps-container .cm-steps .cm-step .row .step-icon {
  display: flex;
}
.cm-steps-container .cm-steps .cm-step .row .step-icon .fa {
  position: relative;
  font-size: 26px;
  border: 1px solid #DB000B;
  background: #fff;
  border-radius: 100%;
  height: 74px;
  width: 74px;
  z-index: 3;
}
.cm-steps-container .cm-steps .cm-step .row .step-icon .fa::before {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  top: 50%;
}
.cm-steps-container .cm-steps .cm-step .row .step-content {
  padding-left: 30px;
  word-break: break-word;
}
.cm-steps-container .cm-steps .cm-step::before,
.cm-steps-container .cm-steps .cm-step::after {
  content: "";
  position: absolute;
  border: 1px solid #DB000B;
  height: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 2;
  left: calc(74px / 2);
}
.cm-steps-container .cm-steps .cm-step::before {
  top: 0;
}
.cm-steps-container .cm-steps .cm-step::after {
  bottom: 0;
}
.cm-steps-container .cm-steps .cm-step:first-of-type::before,
.cm-steps-container .cm-steps .cm-step.first-of-type::before {
  display: none;
}
.cm-steps-container .cm-steps .cm-step:last-of-type::after,
.cm-steps-container .cm-steps .cm-step.last-of-type::after {
  display: none;
}
/****** End (CM Steps) ******/
/**************************************
    ==============================
               CM Ads
    ============================== 
**************************************/
.cma-ad {
  position: relative;
  font-size: 1.6rem;
  background: #000;
  margin: 40px 0;
  min-width: 200px;
  max-width: 300px;
}
.cma-ad:first-of-type {
  margin-top: 0;
}
.cma-ad:last-of-type {
  margin-bottom: 0;
}
.cma-ad::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border: 15px solid #fff;
  border-left-color: #ff656c;
  border-bottom-color: #FE000C;
}
.cma-ad .ad-header {
  position: relative;
  display: block;
  color: #fff;
  font-size: larger;
  font-weight: bold;
  padding: 10px 15px;
}
.cma-ad .ad-header::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 66%;
  height: 2px;
  background: red;
}
.cma-ad .ad-content {
  display: block;
  color: #fff;
  font-size: smaller;
  padding: 10px 15px;
}
/****** End (CM Ads) ******/
/**************************************
    ==============================
            MyCMA Dashboard
    ============================== 
**************************************/
.dashboard-sections .box {
  height: 100%;
}
.dashboard-sections .box .inner {
  height: 100%;
}
.dashboard-sections.pav-slim .box {
  /*.box-slim;*/
}
.box-slim {
  min-height: auto;
  height: auto;
}
.box-slim .inner {
  min-height: auto;
  height: auto;
}
/****** End (MyCMA Dashboard) ******/
/**************************************
    ==============================
           CM Program Status
    ============================== 
**************************************/
#cmprogram-container .cmprogram-section .section-body .section-item {
  display: block;
  padding: 2px 0 2px 20px;
}
#cmprogram-container .cmprogram-section .section-body .section-item:first-of-type,
#cmprogram-container .cmprogram-section .section-body .section-item.first {
  padding-left: 0;
}
#cmprogram-container .cmprogram-section .section-body .section-item .item-label span,
#cmprogram-container .cmprogram-section .section-body .section-item .item-label a {
  padding: 0 8px;
}
#cmprogram-container .cmprogram-section .section-body .section-item .item-label::before {
  font-family: FontAwesome;
  position: relative;
}
#cmprogram-container .cmprogram-section .section-body .section-item .item-label.disabled {
  color: #DDDDDD;
}
#cmprogram-container .cmprogram-section .section-body .section-item .item-label.completed span {
  /*text-decoration: line-through;*/
}
/****** End (CM Program Status) ******/
/**************************************
    ==============================
           CMA Cart Summary
    ============================== 
**************************************/
#SummaryCartWidget {
  position: relative;
}
#SummaryCartWidget .cart-container .cart-grid .grid-header p,
#SummaryCartWidget .cart-container .cart-grid .grid-body p {
  padding: 15px 0;
}
#SummaryCartWidget .cart-container .cart-grid .grid-header {
  flex-basis: 100%;
  min-width: 800px;
  border-bottom: 2px solid #000;
  font-weight: bold;
}
#SummaryCartWidget .cart-container .cart-grid .grid-body {
  flex-basis: 100%;
  min-width: 800px;
}
#SummaryCartWidget .cart-container .border-radius-0 {
  border-radius: 0 !important;
}
#SummaryCartWidget .blockOverlay::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(14, 14, 14, 0.1);
  z-index: 10;
}
#SummaryCartWidget .blockMessage {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  top: 50%;
}
@media only screen and (max-width: 991px) {
  #SummaryCartWidget .cart-container .cart-grid {
    overflow-x: scroll;
  }
}
/****** End (CMA Cart Summary) ******/
.pav-accordion .accordion-icon {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
  cursor: pointer;
}
.pav-accordion .accordion-icon::before {
  content: "\f067";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
  font-size: 2.1rem;
  padding-top: 4px;
}
.pav-accordion.toggled .accordion-icon::before {
  content: "\f068";
}
.pav-overlay::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(14, 14, 14, 0.1);
  z-index: 10;
}