/*------------------------------------------------------------------
* Table of Content
* 1. Soft UI Resets
-------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Encode+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap');

@font-face {
	font-family: "Flat-UI-Icons";
	src: url('../fonts/flat-ui-icons-regular.eot');
	src: url('../fonts/flat-ui-icons-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/flat-ui-icons-regular.woff') format('woff'), url('../fonts/flat-ui-icons-regular.ttf') format('truetype'), url('../fonts/flat-ui-icons-regular.svg#flat-ui-icons-regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*@font-face {
    font-family: "Nunito";
    src: url('../fonts/Nunito/Nunito-VariableFont_wght.ttf');
    font-weight: normal;
    font-style: normal;
} 
@font-face {
    font-family: "Nunito";
    src: url('../fonts/Nunito/Nunito-Italic-VariableFont_wght.ttf');
    font-weight: normal;
    font-style: italic;
} */

html, body {
	height: 100%;
}
/*****************************
 * Soft UI & Bootstrap Resets
 * ***************************
 */
 :root {
  --bs-blue: #63B3ED;
  --bs-indigo: #596CFF;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #F56565;
  --bs-orange: #fd7e14;
  --bs-yellow: #FBD38D;
  --bs-green: #81E6D9;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #cb0c9f;
  --bs-secondary: #8392AB;
  --bs-success: #82d616;
  --bs-info: #17c1e8;
  --bs-warning: #fbcf33;
  --bs-danger: #ea0606;
  --bs-light: #e9ecef;
  --bs-dark: #344767;
  --bs-white: #fff;
  --bs-primary-rgb: 203, 12, 159;
  --bs-secondary-rgb: 131, 146, 171;
  --bs-success-rgb: 130, 214, 22;
  --bs-info-rgb: 23, 193, 232;
  --bs-warning-rgb: 251, 207, 51;
  --bs-danger-rgb: 234, 6, 6;
  --bs-light-rgb: 233, 236, 239;
  --bs-dark-rgb: 52, 71, 103;
  --bs-white-rgb: 255, 255, 255;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 103, 116, 142;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: 'Open Sans', sans-serif;
  --bs-font-nunito: 'Nunito', sans-serif;
  --bs-font-roboto: 'Roboto', sans-serif;
  --bs-font-poppins: 'Poppins', sans-serif;
  --bs-font-inter: 'Inter', sans-serif;
  --bs-font-montserrat: 'Montserrat', sans-serif;
  --bs-font-encode-sans: 'Encode Sans', sans-serif;
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #67748e;
  --bs-body-bg: #fff;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.75rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-2xl: 1.5rem;
  --bs-border-radius-pill: 50rem;
  --bs-heading-color: #344767;
  --bs-link-color: #63B3ED;
  --bs-link-hover-color: #63B3ED;
  --bs-code-color: #d63384;
  --bs-highlight-bg: #fcf8e3;
  --bs-placeholder-color: #adb5bd;
}

 input, button, textarea {
    outline: none;
    border: none;
    background: transparent;
}
a, a:focus, a:active, select, button, button:active, button:focus, .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus, input {
    outline: none;
    text-decoration: none;
}
textarea {
    resize: vertical;
}
a {
    -webkit-transition: all .1s;
    transition: all .1s;
}
 a:hover {
    color: rgba(0, 123, 255, 0.7);
}
input[type='file'] {
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    width: 746px;
    height: 538px;
    outline: none;
    cursor: pointer;
    font-size: 0px;
}
input[type='file'].regular-upload {
    opacity: 1;
    position: relative;
    width: 100%;
    height: auto;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--bs-body-color);
}
input[type='image'] {
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    width: 746px;
    height: 538px;
    outline: none;
    cursor: pointer;
    font-size: 0px;
}
.bg-dark {
  background: #444 !important;
  color: #FFF;
}
.bg-dark-2 {
  background: #292E34 !important;
  color: #FFF;
}
.bg-dark-3 {
  background: #202020 !important;
  color: #FFF;
}
.form-select {
  display: block;
  width: 100%;
  padding: 0.5rem 1rem 0.5rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.4rem;
  color: #495057;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #d2d6da;
  border-radius: 0.6rem;
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
  appearance: none;
}

@media (prefers-reduced-motion: reduce) {
  .form-select {
    transition: none;
  }
}

.form-select:focus {
  border-color: rgba(37,196,242,0.1) !important;
    -webkit-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}

.border-transparent {
  border-color: transparent !important;
}

.border-none {
  border: none !important;
}

.form-control {
  border-radius: 0.6rem !important
}
.form-control:focus {
    border-color: rgba(37,196,242,0.1) !important;
    -webkit-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.input-group .form-control {
  /*border-left: 1px solid rgba(37,196,242,0.3) !important;
  border-right: 1px solid rgba(37,196,242,0.3)  !important;*/
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: 1px solid transparent !important;
}
.input-group .form-control:focus {
  border-left: 1px solid rgba(37,196,242,0.1) !important;
  border-right: 1px solid transparent !important;
}
.focused {
    border-color: rgba(37,196,242,0.1) !important;
    -webkit-box-shadow: 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0.125rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0.125rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.input-group .input-group-text {
  border-left: none;
  border-right: 1px solid #d2d6da;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  clip-path: inset(-8px -8px -8px 0);
}
.focused .input-group-append+.input-group-text {
  border-color: rgba(37,196,242,0.1) !important;
  border-left: 1px solid transparent !important;
  border-right: 1px solid rgba(37,196,242,0.1) !important;
  -webkit-box-shadow: 0 0 0.125rem rgba(37,196,242,0.8) !important;
    -moz-box-shadow: 0 0 0.125rem rgba(37,196,242,0.8) !important;
    -ms-box-shadow: 0 0 0.125rem rgba(37,196,242,0.8) !important;
    -o-box-shadow: 0 0 0.125rem rgba(37,196,242,0.8) !important;
    box-shadow: 0 0 0.125rem rgba(37,196,242,0.8) !important;
}
.focused .input-group-append {
  border-top-right-radius: 0.6rem !important;
  border-bottom-right-radius: 0.6rem !important;
  border-color: rgba(37,196,242,0.1) !important;
  -webkit-box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.4) !important;
}
.focused .input-group-text {
  border-color: rgba(37,196,242,0.1) !important;
  border-left: 1px solid transparent !important;
  /*border-top: 1px solid rgba(37,196,242,0.1);
  border-right: 1px solid rgba(37,196,242,0.1);
  border-bottom: 1px solid rgba(37,196,242,0.1);
  clip-path: inset(-8px -8px -8px 0);*/
  -webkit-box-shadow: 0 0 0.25rem rgba(37,196,242,1) !important;
    -moz-box-shadow: 0 0 0.25rem rgba(37,196,242,1) !important;
    -ms-box-shadow: 0 0 0.25rem rgba(37,196,242,1) !important;
    -o-box-shadow: 0 0 0.25rem rgba(37,196,242,1) !important;
    box-shadow: 0 0 0.25rem rgba(37,196,242,1) !important;
}
.navbar-vertical .navbar-nav>.nav-item .nav-link.active .icon {
  background-image: linear-gradient(310deg, #2152ff 0%, #21d4fd 100%);
}

.bg-gradient-info {
  background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%);
}
.bg-gradient-info-2 {
  background-image: linear-gradient(310deg, #032499 0%, #21d4fd 100%);
}
.bg-gradient-danger-2 {
  background-image: linear-gradient(310deg, rgba(222, 10, 38,1) 0%, rgba(252, 106, 125,0.7) 100%);
}
.bg-gradient-success-2 {
  background-image: linear-gradient(310deg, rgba(24,182,155,1) 0%, rgba(37, 245, 210,1) 100%);
}
.bg-success-2 {
  background-color: rgba(24,182,155,0.9);
}
.btn-success-2.focus,
.btn-success-2:focus,
.btn.bg-gradient-success-2.focus,
.btn.bg-gradient-success-2:focus {
  color: #fff;
}
.btn-danger-2.focus,
.btn-danger-2:focus,
.btn.bg-gradient-danger-2.focus,
.btn.bg-gradient-danger-2:focus {
  color: #fff;
}
.btn-success-2,
.btn.bg-gradient-success-2 {
  color: #fff;
}
.btn-success-2:hover,
.btn.bg-gradient-success-2:hover {
  color: #fff;
}
.btn-danger-2,
.btn.bg-gradient-danger-2 {
  color: #fff;
}
.btn-danger-2:hover,
.btn.bg-gradient-danger-2:hover {
  color: #fff;
}
svg.text-success .color-foreground {
  fill: #25F5D2;
}

svg.text-success .color-background {
  fill: #18B69B;
}
.text-success-2 {
  color: rgba(24,182,155,0.9);
}

.table>:not(:last-child)>:last-child>* {
    border-bottom-color: none !important;
}
.dataTable-table>thead>tr>th {
    border-bottom: none !important;
}
.table>:not(caption)>*>* {
    border-bottom: none !important;
}
.width-72-px {
  width: 72px;
}
.width-84-px {
  width: 84px;
}
.width-96-px {
  width: 96px;
}
.width-110-px {
  width: 110px;
}
.width-130-px {
  width: 140px;
}
.width-150-px {
  width: 150px;
}
.editable-container.editable-inline {
  width: 100% !important;
}
.editable-buttons {
  margin-top: 5px;
  display: inherit !important;
}
.no-shadow {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.modal {
  --bs-modal-zindex: 1050;
  --bs-modal-width: 500px;
  --bs-modal-padding: 1rem;
  --bs-modal-margin: 0.5rem;
  --bs-modal-color: ;
  --bs-modal-bg: #fff;
  --bs-modal-border-color: rgba(0, 0, 0, 0.2);
  --bs-modal-border-width: 1px;
  --bs-modal-border-radius: 1rem;
  --bs-modal-box-shadow: 0 0.25rem 0.375rem -0.0625rem rgba(20, 20, 20, 0.12), 0 0.125rem 0.25rem -0.0625rem rgba(20, 20, 20, 0.07);
  --bs-modal-inner-border-radius: calc(0.75rem - 1px);
  --bs-modal-header-padding-x: 1rem;
  --bs-modal-header-padding-y: 1rem;
  --bs-modal-header-padding: 1rem 1rem;
  --bs-modal-header-border-color: #dee2e6;
  --bs-modal-header-border-width: 1px;
  --bs-modal-title-line-height: 1.5;
  --bs-modal-footer-gap: 0.5rem;
  --bs-modal-footer-bg: ;
  --bs-modal-footer-border-color: #dee2e6;
  --bs-modal-footer-border-width: 1px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--bs-modal-zindex);
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}
.btn .dropdown-toggle:hover {
  transform: none;
}

.fixed-plugin .fixed-plugin-button {
    background: #fff;
    border-radius: 50%;
    bottom: 80px;
    right: 20px;
    font-size: 1.25rem;
    z-index: 990;
    box-shadow: 0 2px 12px 0rgba(0,0,0,.16);
    cursor: pointer;
}
.kanban-board {
    position: relative;
    float: left;
    background: #e9ecef;
    transition: all .3s cubic-bezier(.23,1,.32,1);
    border-radius: 0.75rem;
}
.kanban-board .kanban-drag {
    min-height: auto;
    padding: 20px;
    max-height: 950px;
    overflow-y: auto;
}
.kanban-item {
    background: #fff;
    padding: 15px;
    margin-bottom: 20px;
    transition: all .3s cubic-bezier(.23,1,.32,1);
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.btn-faq {
  right: 0 !important;
  margin-right: 1.5rem;
  padding-top: 0.25rem !important;
  position: absolute;
}
.accordion {
  --bs-accordion-color: #fff;
  --bs-accordion-bg: #fff;
  --bs-accordion-transition: all 0.15s ease-in, border-radius 0.15s ease;
  --bs-accordion-border-color: rgba(0, 0, 0, 0.125);
  --bs-accordion-border-width: 0;
  --bs-accordion-border-radius: 0.8rem !important;
  --bs-accordion-inner-border-radius: 0.8rem !important;
  --bs-accordion-btn-padding-x: 1.5rem;
  --bs-accordion-btn-padding-y: 1.5rem;
  --bs-accordion-btn-color: #67748e;
  --bs-accordion-btn-bg: transparent;
  --bs-accordion-btn-icon: none;
  --bs-accordion-btn-icon-width: 1rem;
  --bs-accordion-btn-icon-transform: rotate(180deg);
  --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
  --bs-accordion-btn-active-icon: none;
  --bs-accordion-btn-focus-border-color: #e293d3;
  --bs-accordion-btn-focus-box-shadow: none;
  --bs-accordion-body-padding-x: 1.5rem;
  --bs-accordion-body-padding-y: 1.5rem;
  --bs-accordion-active-color: #344767;
  --bs-accordion-active-bg: transparent;
}

.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
  font-size: 2rem;
  color: var(--bs-accordion-btn-color);
  text-align: left;
  background-color: var(--bs-accordion-btn-bg);
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  transition: var(--bs-accordion-transition);
}
@media (prefers-reduced-motion: reduce) {
  .accordion-button {
    transition: none;
  }
}

.accordion-button:not(.collapsed) {
  color: var(--bs-accordion-active-color);
  background-color: var(--bs-accordion-active-bg);
  box-shadow: inset 0 calc(var(--bs-accordion-border-width) * -1) 0 var(--bs-accordion-border-color);
}

.accordion-button:not(.collapsed)::after {
  background-image: var(--bs-accordion-btn-active-icon);
  transform: var(--bs-accordion-btn-icon-transform);
}

.accordion-button::after {
  flex-shrink: 0;
  width: var(--bs-accordion-btn-icon-width);
  height: var(--bs-accordion-btn-icon-width);
  margin-left: auto;
  content: "";
  background-image: var(--bs-accordion-btn-icon);
  background-repeat: no-repeat;
  background-size: var(--bs-accordion-btn-icon-width);
  transition: var(--bs-accordion-btn-icon-transition);
}

@media (prefers-reduced-motion: reduce) {
  .accordion-button::after {
    transition: none;
  }
}

.accordion-button:hover {
  z-index: 2;
}

.accordion-button:focus {
  z-index: 3;
  border-color: var(--bs-accordion-btn-focus-border-color);
  outline: 0;
  box-shadow: var(--bs-accordion-btn-focus-box-shadow);
}

.accordion-header {
  margin-bottom: 0;
  font-size: calc(1.275rem + 0.3vw);
  font-weight: 800;
}

.accordion-item {
  color: var(--bs-accordion-color);
  background-color: var(--bs-accordion-bg);
  border: none !important;
  border-radius: var(--bs-accordion-border-radius);
  box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.05);
}

.accordion-item:first-of-type {
  border-radius: var(--bs-accordion-border-radius) !important;
  /*border-top-left-radius: var(--bs-accordion-border-radius);
  border-top-right-radius: var(--bs-accordion-border-radius);*/
}

.accordion-item:first-of-type .accordion-button {
  border-top-left-radius: var(--bs-accordion-inner-border-radius);
  border-top-right-radius: var(--bs-accordion-inner-border-radius);
}

.accordion-item:not(:first-of-type) {
  border-top: 0;
}

.accordion-item:last-of-type {
  border-radius: var(--bs-accordion-border-radius) !important;
  /*border-bottom-right-radius: var(--bs-accordion-border-radius);
  border-bottom-left-radius: var(--bs-accordion-border-radius);*/
}

.accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
  border-bottom-left-radius: var(--bs-accordion-inner-border-radius);
}

.accordion-item:last-of-type .accordion-collapse {
  border-bottom-right-radius: var(--bs-accordion-border-radius);
  border-bottom-left-radius: var(--bs-accordion-border-radius);
}

.accordion-body {
  padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x);
  color: var(--bs-body-color);
  font-size: 1.15rem;
  font-weight: 600;
}

.accordion-flush .accordion-collapse {
  border-width: 0;
}

.accordion-flush .accordion-item {
  border-right: 0;
  border-left: 0;
  border-radius: 0;
}

.accordion-flush .accordion-item:first-child {
  border-top: 0;
}

.accordion-flush .accordion-item:last-child {
  border-bottom: 0;
}

.accordion-flush .accordion-item .accordion-button {
  border-radius: 0;
}
.apps-list {
    display: flex !important;
}
@media (max-width: 991.98px){
  .dropdown.nav-item .dropdown-menu-animation.show {
    height: auto !important;
    /*max-height: 300px;*/
  }
  .apps-list {
    display: inherit !important;
  }
}
/***************************
 * Index Header
 * *************************
 */
.index-header {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/aniket-deole-294646-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header2 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/panoramic-1920s-oil-rigs.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header3 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/oil-well-clouds-dawn.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header4 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/rob-bye-20143-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header5 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/dino-reichmuth-84359-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header6 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/oil-dark-sun-pumpjack.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header7 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/pixpoetry-803552-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header8 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/sam-ekpil-522518-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header9 {
  /*padding-top: 140px !important;*/
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/david-emrich-800498-unsplash.jpg') no-repeat center center #D1D1D1;
  background-size: cover;
  position: relative;
}
.index-header10 {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/rawpixel-645297-unsplash.jpg') no-repeat center center / cover;
  height: 150px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .8)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), rgba(0,0,0,0), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}
.index-header11:before {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/aaron-burden-202486-unsplash.jpg') no-repeat center center / cover;
  height: 250px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .3)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.3), rgba(0,0,0,0), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}
.index-header12:before {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/anchor-lee-181406-unsplash.jpg') no-repeat center center / cover;
  height: 250px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}
.index-header13:before {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/pietro-jeng-266016-unsplash.jpg') no-repeat center center / cover;
  height: 550px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,1), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}
.index-header14:before {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/tim-mossholder-621524-unsplash.jpg') no-repeat center center / cover;
  height: 350px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,1), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}
.index-header15:before {
  /*padding-top: 140px !important;*/
  content: '';
  top: 0;
  left: 0;
  background: url('https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/rawpixel-745956-unsplash.jpg') no-repeat center center / cover;
  height: 150px;
  width: 100%;
  position: absolute;
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0,0,0,0)));
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,1), rgba(0,0,0,0));
  padding-top: 0px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  margin-top: 50px;
  z-index: -1;
}

/*******************
 * General
 * *****************
 */
::-webkit-scrollbar {
    display:none;
}
::-moz-scrollbar {
    display:none;
}
::-ms-scrollbar {
    display:none;
}
::-o-scrollbar {
    display:none;
}
::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: var(--bs-placeholder-color);
  }
  ::-moz-placeholder {
    /* Firefox 19+ */
    color: var(--bs-placeholder-color);
  }
  :-ms-input-placeholder {
    /* IE 10+ */
    color: var(--bs-placeholder-color);
  }
  :-moz-placeholder {
    /* Firefox 18- */
    color: var(--bs-placeholder-color);
  }
  ::placeholder {
    color: var(--bs-placeholder-color);
  }
 .content-wrapper {
    overflow: hidden;
    min-height: 100vh;
}
.column-max-w {
  overflow-x: auto;
  max-width: 400px; 
}
.bg-dots {
    background-image:url('/img/backgrounds/bg-dots.svg');
    background-repeat: repeat;
}
.bg-gradient-white {
  background-image: linear-gradient(310deg, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
}
 .border-avatar-profile {
    border: 5px solid rgba(255, 255, 255, 0.3);
}
.profile-avatar {
    background: transparent;
    border: none;
}
.profile-image {
  width: 200px !important;
  height: 200px !important;
  font-size: 3rem !important;
}
.popover-btn {
    color: inherit;
}
.popover-btn:hover {
    color: #0676CE;
}
 .h-nav {
    margin-left: auto;
    float: right;
 }
 .logo {
    width: 280px;
    padding: 3px;
    margin-right: auto;
    margin-left: auto;
    z-index:99;
}
.logo:hover {
    opacity: 0.8;
}
.btn {
    margin-bottom: 0;
 }
.g-icon {
  vertical-align: middle;
}
.z-index-4 {
  z-index: 4 !important;
}
.z-index-5 {
  z-index: 5 !important;
}
/*.btn-close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.25em 0.25em;
  color: #333 !important;
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
  border: 0;
  border-radius: 50%;
  opacity: 0.5;
}

.btn-close:hover {
  color: #333 !important;
  text-decoration: none;
  opacity: 0.75;
}

.btn-close:focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(203, 12, 159, 0.25);
  opacity: 1;
}

.btn-close:disabled,
.btn-close.disabled {
  pointer-events: none;
  user-select: none;
  opacity: 0.25;
}

.btn-close-white {
  filter: invert(1) grayscale(100%) brightness(200%);
}*/
.btn-nav {
    background: transparent;
    border-radius: 2rem;
    padding: 0.5rem;
    margin: -0.5rem;
}
.btn-nav:hover {
  color: rgba(0, 123, 255, 0.7);
    background: var(--bs-gray-200);
}
.btn-nav:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-block {
    display: block;
}
.btn-navy {
    background: #041FC9;
    border: 1px solid #00A8FF !important;
    color: #FFF !important;
    background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%);
}
.btn-navy:hover {
    background: #002391;
    border-color: #0088FF !important;
    background-image: linear-gradient(to bottom, #002391 0%, #3656BA 100%);
}
.btn-round {
  vertical-align: middle;
  color: inherit;
  line-height: 1;
  font-size:1rem;
  padding: 0.4rem;
  height: 40px;
  width: 40px;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1) !important;
  border-radius: 50%;
  webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.btn-round:hover,
.btn-round:focus,
.btn-round:active {
  color: rgba(0, 123, 255, 0.7);
  background: rgba(255,255,255,0.5);
  webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  -ms-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
}
.btn-square {
  vertical-align: middle;
  color: inherit;
  line-height: 1;
  padding: 0.5rem;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1) !important;
  border-radius: 0.5rem;
  webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.btn-square:hover,
.btn-square:focus,
.btn-square:active {
  color: rgba(0, 123, 255, 0.7);
  background: rgba(255,255,255,0.5);
  webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  -ms-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
}
.btn-profile-delete {
  color: inherit;
  background-color: transparent;
  border-radius: 2rem;
  padding:0.5rem 0.5rem;
  height: 20px;
  width: 20px;
  cursor: pointer;
}
.btn-profile-delete:hover {
  background-color: rgba(0, 0, 0, 0.04);
  color: rgba(255, 17, 0, 0.7) !important;
}
.btn-profile-delete:focus {
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-file > input[type="file"] {
    background-color: #fff;
    cursor: inherit;
    display: block;
    font-size: 100px;
    min-height: 100%;
    min-width: 100%;
    opacity: 0;
    outline: none;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
}
.btn.btn-file {
    overflow: hidden;
    position: relative;
}
.btn-row {
  color: var(--bs-body-color);
  background-color: transparent;
  border-radius: 2rem;
  padding:0.4rem;
  height: 20px;
  width: 20px;
}
.btn-row:hover {
  background-color: rgba(0, 0, 0, 0.04);
  color: rgba(0, 123, 255, 0.7);
}
.btn-row:focus {
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-db {
  background: transparent;
    border-radius: 2rem;
    padding: 0.5rem;
    height: 40px;
    width: 40px;
    color: var(--bs-body-color);
}
.btn-db:hover {
  background: rgba(0,0,0,0.06);
  color: rgba(0, 123, 255, 0.7);
}
.btn-db:focus {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-db-delete {
  background: transparent;
    border-radius: 2rem;
    padding: 0.5rem;
    height: 40px;
    width: 40px;
    color: var(--bs-body-color);
    cursor: pointer;
}
.btn-db-delete:hover {
  background: rgba(0,0,0,0.06);
  color: rgba(255, 17, 0, 0.7) !important;
}
.btn-db-delete:focus {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.support-btn {
  display: inline-flex;
}
.btn-ticket {
  background: transparent;
    border-radius: 2rem;
    padding: 0.45rem;
    height: 40px;
    width: 40px;
    color: inherit;
}
.btn-ticket:hover {
  background: rgba(0,0,0,0.06);
  color: rgba(0, 123, 255, 0.7);
}
.btn-ticket:focus {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-ticket-delete {
  background: transparent;
    border-radius: 2rem;
    padding: 0.45rem;
    height: 40px;
    width: 40px;
    color: inherit;
}
.btn-ticket-delete:hover {
  background: rgba(0,0,0,0.06);
  color: rgba(255, 17, 0, 0.7) !important;
}
.btn-ticket-delete:focus {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-barge-in-call {
  color: rgba(88,101,112,0.7);
  background-color: transparent;
  border-radius: 2rem;
  padding:0.4rem 0.4rem 0.6rem;
  height: 20px;
  width: 20px;
}
.btn-barge-in-call:hover {
  background-color: rgba(0, 0, 0, 0.04);
  color: rgba(0, 123, 255, 0.7);
}
.btn-barge-in-call:focus {
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-comment {
  position: absolute;
  right: 30px;
  bottom: 30px;
}
.btn-profile {
  color: inherit;
  background-color: transparent;
  border-radius: 50%;
  padding:0.5rem;
  height: 20px;
  width: 20px;
  cursor: pointer;
}
.btn-profile:hover {
  background-color: rgba(0, 0, 0, 0.04);
  color: rgba(0, 123, 255, 0.7);
}
.btn-profile:focus {
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.console-user-asset-delete {
    vertical-align: middle;
    position: relative;
    color: inherit !important;
    margin-left: auto;
    margin-right: 20px;
    width: 1em;
    max-width: 1em;
    /* overflow: hidden; */
    cursor: pointer;
    display: block;
    margin-top: -30px;
    float: right;
}
.console-user-asset-delete:hover {
    color: red !important;
}
.g-icon-file-download {
    vertical-align: middle !important;
    color: inherit !important;
}
.nav-user {
    padding: 2px 0 0 3px !important;
}
.img-circle {
    border-radius: 50% !important;
}
.branding-logo-wrapper {
  position: relative;
  margin-right: auto;
    margin-left: auto;
}
.branding-pre-logo {
    border-radius: 0.6rem;
    width: 100%;
    padding: 3rem 6rem;
    height: auto;
    border: 2px dashed rgba(206, 212, 218,1);
}
.branding-pre-logo {
  color: rgba(206, 212, 218,1) !important;
}
.branding-pre-logo:hover,
h6 .branding-pre-logo:hover {
    border: 2px dashed rgba(128, 189, 255, 1);
    color: rgba(128, 189, 255, 1) !important;
}
.branding-logo {
    border-radius: 0;
    width: 100%;
    max-width: 300px;
    height: auto;
    max-height: 6rem;
    /*border: 2px solid rgba(0,0,0,0.1);*/
}
/*.phone-settings-switch {
    display: inline-flex;
    float: right;
    font-size: 1.5rem;
    margin-right: -10px;
}*/
.upload-vm-btn {
    margin-right: 0px;
    margin-left: auto;
    float:right;
}
.upload-vm-input {
    height: 40px !important;
    width: 40px !important;
    border-radius: 50%;
}
.upload-asset-btn {
    padding:0.5rem;
    border-radius:0.5rem !important;
    width: 33px !important;
    height: 34px !important;
    float: right !important;
}
.upload-asset-input {
    height: 34px !important;
    width: 34px !important;
    border-radius: 50%;
    position: relative !important;
    /* overflow: hidden; */
    top: -8px !important;
    right: 8px !important;
    z-index: 1;
}
.upload-asset-icon {
  margin: -4px;
  position: relative;
  top: -34px;
}
.dropdown-icon {
    padding:0.37rem;
}
.fw-400 {
    font-weight: 400 !important;
}
.fw-500 {
    font-weight: 500 !important;
}
.fw-600 {
    font-weight: 600 !important;
}
.fw-700 {
    font-weight: 700 !important;
}
.fw-800 {
    font-weight: 800 !important;
}
.fw-900 {
    font-weight: 900 !important;
}
.float-right {
    float:right !important;
}
.ml-auto {
  margin-left: auto;
}
.mr-auto {
  margin-right: auto;
}
.status-add-btn {
  background:none;
  border-radius:3rem;
  padding:0.5rem;
}

.status-add-btn:hover {
  background: #ddd;
}

.status-tab-form {
  background: transparent;
  border: 2px solid transparent;
  height: 30px !important;
  width: 85px;
  border-radius: 0.6em !important;
  color: inherit;
  font-size:0.9rem;
  font-weight: 600;
  padding-left: 5px;
  padding-right: 5px;
}
.status-tab-form:focus, .status-tab-form:hover {
  width: 150px;
  background: #fff;
}
.status-tab-form::placeholder {
  color: var(--bs-body-color);
  font-weight: 600;
}
.status-tabs-title {
  font-size: 1rem;
  font-weight: 700;
}
.status-info {
  background-color: rgba(233,243,252,0.8);
    border-radius: 0.7rem;
    padding: 20px;
    margin-top: -20px;
    margin-bottom: 20px;
    color: inherit;
    display: inline-flex;
    width: 100%;
    height: auto;
    line-height: 1.25;
}
.blue-icon-color {
  color:rgba(34,139,230,1);
}
.custom-field-edit-icon {
  vertical-align: middle;
  padding-bottom: 0.1em;
  color: var(--bs-body-color);
}
.custom-field-edit-icon:hover {
  color: var(--bs-link-hover-color);
}
.status-info-text {
  margin-left: 20px;
  margin-bottom: 0;
  line-height: 1.3;
  font-size: 0.9rem;
}
.status-tab-edit-form {
  margin:-10px;
  background: transparent;
  border: 2px solid transparent;
  height: 30px !important;
  width: 85px;
  border-radius: 0.6em !important;
  color: inherit;
  font-size:1rem;
  font-weight: 600;
  padding-left: 5px;
  padding-right: 5px;
}
.status-tab-edit-form:focus{
  width: 150px;
  background: #fff;
  border: 2px solid #80bdff !important;
  border-color: #80bdff !important;
}
.form-control-db-contact {
    border-radius: 0.6rem;
    border: 0.10rem solid transparent;
    background: #FFF;
    color: #1E1E1E;
    border-color: transparent;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    padding:5px;
    font-size: 14px;
    font-weight: 300;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    -o-appearance: none !important;
    -webkit-inset: none;
    -moz-inset: none;
    -o-inset: none;
    inset: none;
}
.form-control-db-contact:focus {
    border: 0.10rem solid rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
 .form-control-db-contact::placeholder {
    color: var(--bs-body-color);
 }
 .phone-column-wrapper-db-edit {
    max-height:158px;
    width:100%;
    min-width:100%;
    overflow-y:auto;
    padding: 4px 2px 1px 2px;
}
.phone-column-db-edit {
    -webkit-column-count:2;
    -moz-column-count:2;
    -ms-column-count:2;
    -o-column-count:2;
    column-count:2;
    -webkit-column-gap:1px;
    -moz-column-gap:1px;
    -ms-column-gap:1px;
    -o-column-gap:1px;
    column-gap:1px;
    column-fill: auto;
}
.email-column-wrapper-db-edit {
    max-height:158px;
    width:100%;
    min-width:100%;
    /*max-width:300px;*/
    overflow-y:auto;
    padding: 4px 2px 1px 2px;
}
.email-column-db-edit {
    -webkit-column-count:2;
    -moz-column-count:2;
    -ms-column-count:2;
    -o-column-count:2;
    column-count:2;
    -webkit-column-gap:1px;
    -moz-column-gap:1px;
    -ms-column-gap:1px;
    -o-column-gap:1px;
    column-gap:1px;
    column-fill: auto;
}
.database-items-list {
  list-style: none;
    margin: 0;
    padding: 3px;
    overflow-x: auto;
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    white-space: nowrap;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 4px;
    -moz-column-gap: 4px;
    -ms-column-gap: 4px;
    -o-column-gap: 4px;
    column-gap: 4px;
    column-fill: auto;
}
.database-items-list li {
    margin-bottom: 5px;
    margin-left: 2px;
    display: flex;
}
.custom-field-dropdown {
    left: -137px !important;
    padding: 0.5rem !important;
    -webkit-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -o-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
}
.custom-field-dropdown .dropdown-item {
  border-radius: 0.5rem !important;
  cursor: pointer;
}
.no-hover:hover {
  color: #344767 !important;
}
.btn-round-transparent-sm {
  vertical-align: middle;
  padding: 0.4rem;
  border-radius: 2rem;
  width: 30px;
  height: 30px;
}
.btn-round-transparent-sm:hover {
  background: rgba(0,0,0,0.08);
  color: rgba(0, 123, 255, 0.7) !important;
}
.btn-visibility-icon {
  margin-top: -5px;
}
.btn-db-column {
  --bs-btn-padding-x: 1rem !important;
  --bs-btn-padding-y: 0.75rem !important;
  background: #fff !important;
}
.db-contact-container {
    height: auto;
    max-height: 350px;
    width: auto;
    max-width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}
.db-contact-wrapper {
    height: auto;
    overflow-y: auto;
    overflow-x: hidden;
}
.db-templates {
  margin-top: 15px;
  margin-bottom: 15px;
  padding:5px;
  height: auto;
  max-height: 300px;
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
}
.db-template-select {
  /*color:rgba(24,182,155,.9) !important;
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(24,182,155,.3);
  -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(24,182,155,.3);
  -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(24,182,155,.3);
  -o-box-shadow: 0 0 0.125rem 0.25rem rgba(24,182,155,.3);
  box-shadow: 0 0 0.125rem 0.25rem rgba(24,182,155,.3);
  background: rgba(24,182,155,.08) !important;*/
  
  /*color:rgba(77,162,255,1) !important;
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(128,189,255,.5);
  -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(128,189,255,.5);
  -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(128,189,255,.5);
  -o-box-shadow: 0 0 0.125rem 0.25rem rgba(128,189,255,.5);
  box-shadow: 0 0 0.125rem 0.25rem rgba(128,189,255,.5);
  background: rgba(128,189,255,.1) !important;*/
  width: 100%;
}
.db-field-delete {
    background: transparent;
    border-radius: 0px;
    top: -40px;
    right: -14px;
    float: right;
    display: block;
    position: relative;
    color: inherit;
    padding: 0.1rem;
    line-height: 1;
    transition: all ease 0.5s;
}
.db-field-delete:hover {
    background: #e9ecef;
    border-radius: 50%;
}
.db-field-edit {
    background: transparent;
    border-radius: 0px;
    top: -40px;
    right: -14px;
    float: right;
    display: block;
    position: relative;
    color: inherit;
    padding: 0.1rem;
    line-height: 1;
    transition: all ease 0.5s;
}
.db-field-edit:hover {
    background: #e9ecef;
    border-radius: 50%;
}
.template-selected {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(23, 235, 192,.4) !important;
  -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(23, 235, 192,.4) !important;
  -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(23, 235, 192,.4) !important;
  -o-box-shadow: 0 0 0.125rem 0.25rem rgba(23, 235, 192,.4) !important;
  box-shadow: 0 0 0 0.1875rem rgba(23, 235, 192,0.8) !important;
  /*background: rgba(23, 235, 192,.1) !important;*/
}
.db-template-demo-vid-wrapper {
  border-radius: 0.7rem;
  margin: -85px -16px -24px;
}
.small-box {
  border-radius: 0.6rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  display: block;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}
.small-box:hover {
  transform: scale(1.02);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  cursor: inherit;
}

.small-box > .inner {
  padding: 10px;
}

.small-box-header {
  height: 210px;
  text-align: center;
  margin: -10px -10px 0 -10px;
  background: rgba(233, 236, 239,1);
  overflow: hidden;
}
.small-thumbnail {
  position: relative;
  width: auto;
  max-height: 100%;
}
.small-box-footer {
  overflow: hidden;
}

.small-box h3 {
  font-size: 2.2rem;
  font-weight: 700;
  margin: 0 0 10px;
  padding: 0;
  white-space: nowrap;
}

@media screen and (min-width: 992px) {
  .col-xl-2 .small-box h3,
  .col-lg-2 .small-box h3,
  .col-md-2 .small-box h3 {
    font-size: 1.6rem;
  }
  .col-xl-3 .small-box h3,
  .col-lg-3 .small-box h3,
  .col-md-3 .small-box h3 {
    font-size: 1.6rem;
  }
}

@media screen and (min-width: 1200px) {
  .col-xl-2 .small-box h3,
  .col-lg-2 .small-box h3,
  .col-md-2 .small-box h3 {
    font-size: 2.2rem;
  }
  .col-xl-3 .small-box h3,
  .col-lg-3 .small-box h3,
  .col-md-3 .small-box h3 {
    font-size: 2.2rem;
  }
}

.small-box p {
  font-size: 1rem;
}

.small-box p > small {
  color: #f8f9fa;
  display: block;
  font-size: .9rem;
  margin-top: 5px;
}

.small-box h3,
.small-box p {
  z-index: 5;
}

.small-box .icon {
  color: inherit;
  z-index: 0;
}

.small-box .icon > i {
  font-size: 100px;
  position: absolute;
  right: 55px;
  top: 55px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.small-box .icon > i.fa, .small-box .icon > i.fas, .small-box .icon > i.far, .small-box .icon > i.fab, .small-box .icon > i.fal, .small-box .icon > i.fad, .small-box .icon > i.ion {
  font-size: 100px;
  /*top: 20px;*/
}

.small-box .icon svg {
  font-size: 70px;
  /*position: absolute;*/
  right: 15px;
  top: 15px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.small-box:hover {
  text-decoration: none;
}

.small-box:hover .icon > i, .small-box:hover .icon > i.fa, .small-box:hover .icon > i.fas, .small-box:hover .icon > i.far, .small-box:hover .icon > i.fab, .small-box:hover .icon > i.fal, .small-box:hover .icon > i.fad, .small-box:hover .icon > i.ion {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
    color: rgba(0, 102, 255, 0.9);
    transition: transform 0.1s linear;
}

.small-box:hover .icon > svg {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

@media screen and (max-width: 767.98px) {
  .small-box {
    text-align: center;
  }
  .small-box .icon > i.ion {
    font-size: 60px;
}
  .small-box p {
    font-size: 12px;
  }
.small-box .view-temp {
  color: rgba(0, 0, 0, 0.15);
  z-index: 0;
}
.small-box:focus {
  border: 2px solid green;
}
}
.small-box .view-temp > a {
  vertical-align: middle;
  font-size: 0.7rem;
  position: absolute;
  right: 15px;
  top: 15px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}
.btn-view-temp {
  vertical-align: middle;
  line-height: 0.5;
  color: rgba(88, 101, 112, 0.7);
  font-size:1.5rem;
  padding: 0.4rem;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1);
  border-radius: 2rem;
  margin-top: 0.6rem !important;
  margin-bottom: 0.6rem !important;
  float:right !important;
  webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.btn-view-temp:hover {
  color: blue !important;
  background: rgba(255,255,255,0.5);
  webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.crm-dealboard {
  box-shadow: 0 10px 10px 0 rgb(0, 0, 0, 5%);
  margin-top: 0.8rem !important;
  margin-bottom: 0.5rem !important;
}
.crm-dealboard-table {
  max-height: 69vh;
  overflow: auto;
}
.dealboard-columns {
  height: 300px;
  width: 200px;
}
.dealboard-column-field {
  margin-top: 10px;
  height: 243px;
}
.db-column-text {
  height: 100% !important;
  background: transparent !important;
  border-color: transparent !important;
}
.db-column-text:focus {
  background: #fff !important;
  border-color: #80bdff !important;
}
.status-tab-add-btn {
    vertical-align: middle;
  color: var(--bs-body-color);
  cursor: pointer;
}
.status-tab-add-icon {
  vertical-align: middle;
  padding: 0.15rem;
  border-radius: 50%;
}
.status-tab-add-icon:hover {
  background-color: rgb(229,231,235,1);
  color: rgba(0, 123, 255, 0.7);
}
.status-tab-icon {
  vertical-align: middle;
  line-height: 0.8;
  font-size:1.5rem;
  padding-bottom: 0.1em;
}
.name-tab {
  padding-top: 7px !important;
    padding-bottom: 8px !important;
    padding-left: 6px !important;
    margin-bottom: 2px !important;
}
.custom-field-add-btn {
  vertical-align: middle;
  color: inherit;
  line-height: 1;
  font-size:1.5rem;
  padding: 0.4rem;
  height: 40px;
  width: 40px;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1);
  border-radius: 2rem;
  /*margin-top: 0.6rem !important;
  margin-bottom: 0.6rem !important;*/
  float:right !important;
  webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.custom-field-add-btn:hover,
.custom-field-add-btn:focus,
.custom-field-add-btn:active {
  color: rgba(0, 123, 255, 0.7);
  background: rgba(255,255,255,0.5);
  webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.custom-field-delete-btn {
  vertical-align: middle;
  color: inherit;
  line-height: 1;
  font-size:1.5rem;
  padding: 0.5rem;
  height: 40px;
  width: 42px;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1);
  border-radius: 0.6rem;
  /*margin-top: 0.6rem !important;
  margin-bottom: 0.6rem !important;*/
  float:right !important;
  cursor: pointer;
  -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.custom-field-delete-btn:hover {
  background: rgba(255,255,255,0.5);
  color: rgba(255,0,0,0.6);
  webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.custom-fields-delete-btn {
  padding: 0.5rem;
    margin: 0.25rem;
}
.custom-fields-title {
  width: 100%;
}
.db-custom-section {
  display:inline-block;
  position:relative;
  white-space:nowrap;
  width:100%;
  max-width:100%;
}
.db-field-wrapper {
  background: #e9ecef;
  padding: 10px;
  border-radius: 0.7rem;
  margin-bottom: 5px;
}
.form-control-transparent {
  color: var(--bs-heading-color);
  display:inline;
  width: auto;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  font-weight: 700;
  background: transparent;
  background-clip: padding-box;
  border: none;
  border-radius: 0.7rem;
  appearance: none;
  box-shadow: none;
  cursor: text;
  transition: all ease 0.3s;
}
.form-control-transparent:focus {
  border: rgba(37,196,242,0.3) !important;
  border-color: rgba(37,196,242,0.3) !important;
  background: #fff;
}
.form-control-properties {
  padding: 0.1rem 0.4rem;
  font-size: 0.6rem;
  border: none !important;
  border-radius: 0.3rem !important;
}
.form-control-properties:focus {
  border-radius: 0.4rem;
  padding: 0.1rem 0.4rem;
  min-width: 80px;
  font-size: 0.6rem;
  color: var(--bs-heading-color);
}
.btn-add-property {
  float: right !important;
  padding: 0.4rem 0.9rem;
}
.oil-property-input {
  background-color: var(--bs-gray-200);
  border: 0.10rem solid transparent;
  border-radius: 0.4rem;
  margin: 0.2rem;
  padding: 0.25rem 0.5rem;
  color: var(--bs-heading-color);
  font-size: 0.8rem;
  font-weight: 500;
  width: 150px;
  -webkit-box-shadow: 0 0 0 0.25rem transparent;
    -moz-box-shadow: 0 0 0 0.25rem transparent;
    -ms-box-shadow: 0 0 0 0.25rem transparent;
    -o-box-shadow: 0 0 0 0.25rem transparent;
    box-shadow: 0 0 0 0.125rem transparent;
}
.oil-property-input:focus {
  border: 0.10rem solid rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.oil-property-select {
  background-color: var(--bs-gray-200);
  /*background: url('img/arrow.png') no-repeat right var(--bs-gray-200);*/
  border: 0.10rem solid transparent;
  border-radius: 0.4rem;
  margin: 0.2rem;
  padding: 0.25rem 0.5rem;
  color: var(--bs-heading-color);
  font-size: 0.8rem;
  font-weight: 500;
  width: 150px;
  -webkit-box-shadow: 0 0 0 0.25rem transparent;
  -moz-box-shadow: 0 0 0 0.25rem transparent;
  -ms-box-shadow: 0 0 0 0.25rem transparent;
  -o-box-shadow: 0 0 0 0.25rem transparent;
  box-shadow: 0 0 0 0.125rem transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.oil-property-select:focus {
  border: 0.10rem solid rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.btn-xs,
.btn-group-xs>.btn {
  --bs-btn-padding-y: 0.5rem;
  --bs-btn-padding-x: 1rem !important;
  --bs-btn-font-size: 0.75rem;
  --bs-btn-border-radius: 0.5rem;
}
.import-table-wrapper {
  margin: 1.5rem;
}
.import-table {
  width: 100%;
/*  max-width: 600px;*/
  margin: auto;
/*  margin-bottom: 1rem;*/
  padding: 0.25rem;
/*  border: 1px solid var(--bs-gray-300);*/
  border-radius: 0.6rem;
}
.import-table tr:hover {
    background-color: transparent !important;
}
/*thead {
    background-color: #e9ecef !important;
}
tr:hover {
    background-color: #f2f5f7 !important;
}
tr th:first-child {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
tr th:last-child {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
tr input td:first-child {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
tr td:last-child {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}*/
.todo-list .handle-h {
  cursor: move;
  display: inline-block;
  margin: 0;
}
.todo-list {
    list-style: none;
    margin: 0;
    padding: 3px;
    overflow-x: auto;
    position: initial;
    width: 100%;
    max-width: 100%;
    /*height: 55px;
    /*display: inline-block;*/
    white-space: nowrap;
}

.todo-list > li {
  border-radius: 0.7rem;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.35) 100%);
  border: 1px solid rgb(229,231,235,1);
  /*border-right: 2px solid #e9ecef;*/
  color: inherit;
  margin-bottom: 2px;
  padding: 10px;
  display: inline-block;
  -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
}
.todo-list::placeholder {
  background: green;
}

.todo-list > li:last-of-type {
  margin-bottom: 0;
}

.todo-list > li > input[type="checkbox"] {
  margin: 0 10px 0 5px;
}

.todo-list > li .text {
  display: inline-block;
  font-weight: 600;
  /*margin-left: 5px;*/
  margin-right: 5px;
  font-size: 0.9rem;
  color: inherit;
}

.todo-list > li .badge {
  font-size: .7rem;
  margin-left: 10px;
}

.todo-list > li .tools {
  color: inherit;
  display: none;
  margin-left: 8px;
  float: right;
}

.todo-list > li .tools > .fa,
.todo-list > li .tools > .fas,
.todo-list > li .tools > .far,
.todo-list > li .tools > .fab,
.todo-list > li .tools > .fal,
.todo-list > li .tools > .fad,
.todo-list > li .tools > .svg-inline--fa,
.todo-list > li .tools > .ion {
  cursor: pointer;
  margin-right: 5px;
}
.todo-list > li .tools > .material-icons-outlined {
  cursor: pointer;
  margin-right:2px;
}
.todo-list > li .tools > .fa:hover,
.todo-list > li .tools > .fas:hover,
.todo-list > li .tools > .far:hover,
.todo-list > li .tools > .fab:hover,
.todo-list > li .tools > .fal:hover,
.todo-list > li .tools > .fad:hover,
.todo-list > li .tools > .svg-inline--fa:hover,
.todo-list > li .tools > .ion:hover,
.todo-list > li .tools > .material-icons-outlined:hover {
  opacity: 0.7;
    color: red;
}

.todo-list > li:hover .tools {
  display: inline-block;
}

.todo-list > li.done {
  color: #697582;
}

.todo-list > li.done .text {
  font-weight: 500;
  text-decoration: line-through;
}

.todo-list > li.done .badge {
  background-color: #adb5bd !important;
}

.todo-list .primary {
  border-left-color: #007bff;
}

.todo-list .secondary {
  border-left-color: #6c757d;
}

.todo-list .success {
  border-left-color: #28a745;
}

.todo-list .info {
  border-left-color: #17a2b8;
}

.todo-list .warning {
  border-left-color: #ffc107;
}

.todo-list .danger {
  border-left-color: #dc3545;
}

.todo-list .light {
  border-left-color: #f8f9fa;
}

.todo-list .dark {
  border-left-color: #343a40;
}

.todo-list .lightblue {
  border-left-color: #3c8dbc;
}

.todo-list .navy {
  border-left-color: #001f3f;
}

.todo-list .olive {
  border-left-color: #3d9970;
}

.todo-list .lime {
  border-left-color: #01ff70;
}

.todo-list .fuchsia {
  border-left-color: #f012be;
}

.todo-list .maroon {
  border-left-color: #d81b60;
}

.todo-list .blue {
  border-left-color: #007bff;
}

.todo-list .indigo {
  border-left-color: #6610f2;
}

.todo-list .purple {
  border-left-color: #6f42c1;
}

.todo-list .pink {
  border-left-color: #e83e8c;
}

.todo-list .red {
  border-left-color: #dc3545;
}

.todo-list .orange {
  border-left-color: #fd7e14;
}

.todo-list .yellow {
  border-left-color: #ffc107;
}

.todo-list .green {
  border-left-color: #28a745;
}

.todo-list .teal {
  border-left-color: #20c997;
}

.todo-list .cyan {
  border-left-color: #17a2b8;
}

.todo-list .white {
  border-left-color: #fff;
}

.todo-list .gray {
  border-left-color: #6c757d;
}

.todo-list .gray-dark {
  border-left-color: #343a40;
}

.todo-list .handle {
  cursor: move;
  display: inline-block;
  margin: 0 2px;
  color:#495057;
}
.dark-mode .todo-list > li {
  background-color: #3f474e;
  border-color: #454d55;
  color: #fff;
}

.dark-mode .todo-list .primary {
  border-left-color: #3f6791;
}

.dark-mode .todo-list .secondary {
  border-left-color: #6c757d;
}

.dark-mode .todo-list .success {
  border-left-color: #00bc8c;
}

.dark-mode .todo-list .info {
  border-left-color: #3498db;
}

.dark-mode .todo-list .warning {
  border-left-color: #f39c12;
}

.dark-mode .todo-list .danger {
  border-left-color: #e74c3c;
}

.dark-mode .todo-list .light {
  border-left-color: #f8f9fa;
}

.dark-mode .todo-list .dark {
  border-left-color: #343a40;
}

.dark-mode .todo-list .lightblue {
  border-left-color: #86bad8;
}

.dark-mode .todo-list .navy {
  border-left-color: #002c59;
}

.dark-mode .todo-list .olive {
  border-left-color: #74c8a3;
}

.dark-mode .todo-list .lime {
  border-left-color: #67ffa9;
}

.dark-mode .todo-list .fuchsia {
  border-left-color: #f672d8;
}

.dark-mode .todo-list .maroon {
  border-left-color: #ed6c9b;
}

.dark-mode .todo-list .blue {
  border-left-color: #3f6791;
}

.dark-mode .todo-list .indigo {
  border-left-color: #6610f2;
}

.dark-mode .todo-list .purple {
  border-left-color: #6f42c1;
}

.dark-mode .todo-list .pink {
  border-left-color: #e83e8c;
}

.dark-mode .todo-list .red {
  border-left-color: #e74c3c;
}

.dark-mode .todo-list .orange {
  border-left-color: #fd7e14;
}

.dark-mode .todo-list .yellow {
  border-left-color: #f39c12;
}

.dark-mode .todo-list .green {
  border-left-color: #00bc8c;
}

.dark-mode .todo-list .teal {
  border-left-color: #20c997;
}

.dark-mode .todo-list .cyan {
  border-left-color: #3498db;
}

.dark-mode .todo-list .white {
  border-left-color: #fff;
}

.dark-mode .todo-list .gray {
  border-left-color: #6c757d;
}

.dark-mode .todo-list .gray-dark {
  border-left-color: #343a40;
}
.calls-progress-canvas {
    min-height: 200px;
    height: auto;
    max-height: 544px;
    overflow-y: auto;
}
.card.card-tabs .card-tools {
  margin: .3rem .5rem;
}
.card.card-outline-tabs .card-tools {
  margin: .5rem .5rem .3rem;
}
.card-header > .card-tools {
  float: right;
  margin-right: -0.625rem;
}

.card-header > .card-tools .input-group,
.card-header > .card-tools .nav,
.card-header > .card-tools .pagination {
  margin-bottom: -0.3rem;
  margin-top: -0.3rem;
}

.card-header > .card-tools [data-toggle="tooltip"] {
  position: relative;
}
.call-history-chart-btn-primary {
  border-radius: 0.5rem;
  padding: 0.3rem 0.6rem;
  background: transparent;
}
.call-history-chart-btn-primary:hover {
  background: rgba(216, 228, 237,0.4);
  box-shadow: 0 0 0 2px rgba(203, 12, 158,0.2);
}
.call-history-chart-btn-secondary {
  border-radius: 0.5rem;
  padding: 0.3rem 0.6rem;
  background: transparent;
}
.call-history-chart-btn-secondary:hover {
  background: rgba(216, 228, 237,0.4);
  box-shadow: 0 0 0 2px rgba(58, 65, 111, 0.2);
}
.call-history-chart-btn-info{
  border-radius: 0.5rem;
  padding: 0.3rem 0.6rem;
  background: transparent;
}
.call-history-chart-btn-info:hover {
  background: rgba(216, 228, 237,0.4);
  box-shadow: 0 0 0 2px rgba(23, 194, 232, 0.2);
}
.btn-barge-in {
  padding: 0.4rem 0.8rem;
  background: transparent;
  vertical-align: middle;
}
.btn-barge-in:hover {
  background-image: linear-gradient(310deg, #17ad37 0%, #98ec2d 100%);
  color: white !important;
  box-shadow: 0 4px 7px -1px rgba(0, 0, 0, 0.11), 0 2px 4px -1px rgba(0, 0, 0, 0.07) !important;
}
.btn-barge-out {
  padding: 0.4rem 0.8rem;
  background: transparent;
  vertical-align: middle;
}
.btn-barge-out:hover {
  background-image: linear-gradient(310deg, #ea0606 0%, #ff667c 100%);
  color: white !important;
  box-shadow: 0 4px 7px -1px rgba(0, 0, 0, 0.11), 0 2px 4px -1px rgba(0, 0, 0, 0.07) !important;
}
.console-user-asset-canvas {
    height: auto;
    max-height: 400px;
    overflow-y: auto;
    white-space: nowrap;
    list-style: none;
    padding: 0.4rem 1rem;
}
.console-user-asset-list {
    display: block;
    white-space: nowrap;
    overflow-x: hidden;
    position: relative;
    vertical-align: middle;
    text-overflow: ellipsis;
    max-width: 95%;
}
.console-user-asset {
    display: inline-block;
    width: auto;
    max-width: 225px;
    overflow-x: auto;
    white-space: nowrap;
}
.console-user-asset:hover {
    color: rgba(0, 123, 255, 0.7) !important;
}
.mailbox-read-time {
    color: #67748e;
    font-size: 0.9rem;
}
.card-title {
  float: left;
}
.form-control-gray {
  display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.4rem;
  color: #495057;
  background: #f2f4f5 !important;
  height: 40px !important;
  border-radius: 0.7rem !important;
  border: none;
}
.switch-icon {
  margin: -5px;
  opacity: 0.8;
}
@media (prefers-reduced-motion: reduce) {
  .form-control-gray {
    transition: none;
  }
}

.form-control-gray[type="file"] {
  overflow: hidden;
}

.form-control-gray[type="file"]:not(:disabled):not([readonly]) {
  cursor: pointer;
}

.form-control-gray:focus {
  color: #495057;
  background-color: #fff !important;
  border-color: #e293d3;
  outline: 0;
  box-shadow: 0 0 0 2px #80bdff;
}

.form-control-gray::-webkit-date-and-time-value {
  height: 1.4rem;
}

.form-control-gray::placeholder {
  color: var(--bs-placeholder-color);
  opacity: 1;
}

.form-control-gray:disabled,
.form-control-gray[readonly] {
  background-color: #e9ecef;
  opacity: 1;
}

.form-control-gray::file-selector-button {
  padding: 0.5rem 0.75rem;
  margin: -0.5rem -0.75rem;
  margin-inline-end: 0.75rem;
  color: #495057;
  background-color: #fff;
  pointer-events: none;
  border-color: inherit;
  border-style: solid;
  border-width: 0;
  border-inline-end-width: 1px;
  border-radius: 0;
  transition: all 0.15s ease-in;
}

@media (prefers-reduced-motion: reduce) {
  .form-control-gray::file-selector-button {
    transition: none;
  }
}

.form-control-gray:hover:not(:disabled):not([readonly])::file-selector-button {
  background-color: #f2f2f2;
}
.wrap-center {
    position: relative;
    max-width: 650px;
}
.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}
.pill-block {
    display: inline-flex;
    position: relative;
    vertical-align: middle !important;
}

@media screen and (max-width: 767px)  {
    .phone-column-wrapper-db-edit {
      max-height:158px;
      width:100%;
      min-width:100%;
      overflow-y:auto;
      padding: 2px 2px 2px 16px;
    }
    .phone-column-db-edit {
        -webkit-column-count:2;
        -moz-column-count:2;
        -ms-column-count:2;
        -o-column-count:2;
        column-count:2;
        -webkit-column-gap:1px;
        -moz-column-gap:1px;
        -ms-column-gap:1px;
        -o-column-gap:1px;
        column-gap:1px;
        column-fill: auto;
    }
    .email-column-wrapper-db-edit {
        max-height:158px;
        width:100%;
        min-width:100%;
        /*max-width:300px;*/
        overflow-y:auto;
        padding: 2px 4px 2px 2px;
    }
    .email-column-db-edit {
        -webkit-column-count:2;
        -moz-column-count:2;
        -ms-column-count:2;
        -o-column-count:2;
        column-count:2;
        -webkit-column-gap:1px;
        -moz-column-gap:1px;
        -ms-column-gap:1px;
        -o-column-gap:1px;
        column-gap:1px;
        column-fill: auto;
    }
}
@media screen and (max-width: 576px)  {
    .phone-column-wrapper-db-edit {
      max-height:158px;
      width:100%;
      min-width:100%;
      overflow-y:auto;
      padding: 2px 2px 2px 16px;
    }
    .phone-column-db-edit {
        -webkit-column-count:2;
        -moz-column-count:2;
        -ms-column-count:2;
        -o-column-count:2;
        column-count:2;
        -webkit-column-gap:1px;
        -moz-column-gap:1px;
        -ms-column-gap:1px;
        -o-column-gap:1px;
        column-gap:1px;
        column-fill: auto;
    }
    .email-column-wrapper-db-edit {
        max-height:158px;
        width:100%;
        min-width:100%;
        /*max-width:300px;*/
        overflow-y:auto;
        padding: 2px 4px 2px 2px;
    }
    .email-column-db-edit {
        -webkit-column-count:1;
        -moz-column-count:1;
        -ms-column-count:1;
        -o-column-count:1;
        column-count:1;
        -webkit-column-gap:1px;
        -moz-column-gap:1px;
        -ms-column-gap:1px;
        -o-column-gap:1px;
        column-gap:1px;
        column-fill: auto;
    }
}
/*********************
--- Welcome Page---
*********************/
.welcome-title-container {
    display: webkit-box;
    display: webkit-flex;
    display: ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}
.highlight-container {
    display: webkit-box;
    display: webkit-flex;
    display: ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}
.welcome-image-container {
    display: webkit-box;
    display: webkit-flex;
    display: ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    max-width: 1000px;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}
/*.welcome-title-container h1 {
    font-size: 40px;
}*/
.welcome-title {
  font-family: var(--bs-font-poppins);
    font-size: 55px !important;
    color: #fff;
    font-weight: 700;
    white-space: normal;
}
.welcome-subtitle {
    margin-top: 20px;
    font-size: 20px;
    font-weight: 600;
    white-space: normal;
    color: rgb(38,44,65,1);
}
.sign-up-title {
    font-size: 50px;
    color:inherit !important;
    font-weight: 800;
    white-space: normal;
}
.how-it-works-text {
    color: #101010;
    font-size: 35px !important;
    font-weight: 800;
    white-space: normal;
}
.reveal-from-right{
  position: relative;
  transform: translateX(600px);
  opacity: 0;
  transition: 1s all ease;
}
.reveal-from-bottom{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}
.reveal-from-left{
  position: relative;
  transform: translateX(-600px);
  opacity: 0;
  transition: 1s all ease;
}
.reveal-from-right.active{
  transform: translateY(0);
  opacity: 1;
}
.reveal-from-bottom.active{
  transform: translateX(0);
  opacity: 1;
}
.reveal-from-left.active{
  transform: translateX(0);
  opacity: 1;
}
.text-sm-dropdown {
  white-space: break-spaces;
  line-height: 1 !important;
  font-size: 0.875rem !important;
}
.dropdown-item:hover .text-primary-hover{
  color: #FF0080 !important;
}
.dropdown-item:hover .text-info-hover{
  color: #21d4fd !important;
}
.dropdown-item:hover .text-success-hover{
  color: #98ec2d !important;
}
.dropdown-item:hover .text-success-hover-2{
  color: #25F5D2 !important;
}
ul.dropdown-menu-labels {
  width: 100%;
/*  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);*/
  max-height: 200px;
  overflow-y: auto;
  -webkit-border-radius: 0.6rem;
  -moz-border-radius:0.6rem;
  -ms-border-radius: 0.6rem;
  -o-border-radius: 0.6rem;
  border-radius: 0.6rem;
  box-shadow: 0 8px 26px -4px hsl(0deg 0% 8% / 15%), 0 8px 9px -5px hsl(0deg 0% 8% / 6%) !important;
}
/*.dropdown-menu-labels .dropdown ul {
  height: 300px;
  overflow: hidden;
  overflow-y: scroll;
}*/
.btn-login {
    display: block !important;
    color: white !important;
    background-color: rgb(255 254 255 / 10%) !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-login:hover {
  background-color: rgb(255 254 255 / 30%) !important;
}
.btn-login-2 {
    display: block !important;
    color: var(--bs-heading-color);
    background-color: rgb(255 254 255 / 10%) !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-login-2:hover {
  color: rgba(37,196,242,1) !important;
  background-color: rgb(0 0 0 / 5%) !important;
}
.btn-text-white:hover,
a.btn-text-white:hover {
  color: white !important;
}
.btn-trans-white {
  color: #ffffff !important;
}
.btn-trans-white:hover {
  color: var(--bs-body-color) !important;
}
.nav-login-signup {
  float: right ;
  margin-left: auto;
}
.showcase-slide {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 5rem;
  padding-top: 4rem;
  padding-bottom: 4rem;
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}
.showcase-dialpad {
  margin: 8rem;
}
/*.showcase-item {
  padding-left: 1.4rem;
  padding-right: 1.4rem;
}*/
.showcase-bg-gradient-info {
  background: rgba(5, 201, 245,0.15);
  border-radius: 3rem;
  /*background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%);*/
  /*background: rgba(255,255,255,0.5);*/
}
/*.showcase-bg-gradient-info:before {
  content: "";
  background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
  opacity: 0.5 !important;
}*/
.showcase-nav-pill {
      width: 75% !important;
      white-space: nowrap;
    }
.showcase-nav-pill-2 {
      width: 50% !important;
      white-space: nowrap;
  }
.showcase-nav-pill-3 {
    width: 100% !important;
    /*white-space: nowrap;*/
}
video.demo-video{
  border-radius: 0.7rem;
  box-shadow: 0 5px 10px 5px rgb(0, 0, 0, 0.1) !important;
}
.demo-video video{
  border-radius: 0.7rem;
  box-shadow: 0 5px 10px 5px rgb(0, 0, 0, 0.1) !important;
}
.demo-main-video video {
  border-radius: 1rem;
  box-shadow: 0 23px 45px -11px rgb(20 20 20 / 25%) !important;
}
.video-js {
  background-color: transparent !important;
}
.computer-screen {
    width: 100%;
    height: auto;
    border-radius: 1rem;
    -webkit-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -o-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    box-shadow: 0 0.3125rem 3rem 0 rgba(0, 0, 0, 0.15);
}
.img-shadow {
    -webkit-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    -o-box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
    box-shadow: 0 0.3125rem 3rem 0 rgb(0 0 0 / 15%);
}
.halsell-icon-rocket-user {
    /*background-image: url("../vectors/rocket_takeoff_person.png") !important;*/
    background: center;
    background: no-repeat;
    width: 150px;
    height: auto;
    color: #333;
}
.how-works-icons {
    width: 250px;
    height: auto;
}
.how-works-text {
    color: #111 !important;
    margin-top:10px;
    font-weight: 700;
}
.highlight-vectors {
    width: 100%;
    height: auto;
    /*box-shadow: 1px 2px 10px -2px rgba(0,0,0,0.3);*/
}
.content-wrapper {
    overflow: hidden;
    min-height: 100vh;
}
.slick-slide {
    margin: 0px 20px;
}

.slick-slide img {
    width: 100%;
}

.slick-slider
{
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
            user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;
    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;
    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;
    height: auto;
    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
#hero {
    opacity: 0.6;
}
#hero-svg {
      -webkit-text-size-adjust: 100%;
    line-height: 1.5;
    font-family: GT America;
    color: #2c2f33;
    -webkit-font-smoothing: antialiased;
    box-sizing: inherit;
    border: 0 solid #a1aebb;
    display: block;
    vertical-align: middle;
    height: 800px;
    position: absolute;
    margin: 0 auto;
    top: 0;
    right: 0;
    /*bottom: 0;
    left: 0;*/
    width: 100% !important;
    visibility: visible;
}
.logo-center {
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    align-content: center;
}
.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.showcase-btn-hover {
  /*padding: 1rem;
  border-radius: 0.7rem;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  position: relative;
  z-index: 1;
  background-image: linear-gradient(310deg, #2152FF, #21D4FD);*/
  margin-top: 0;
  margin-bottom: 0.1rem;
  padding-bottom: 0.25rem;
  font-weight: 400;
  line-height: 1.2;
  font-size: 1.125rem !important;
  transition: all 0.1s ease-in-out;
}
.showcase-btn-hover.active {
  border-bottom: 3px solid rgba(0, 123, 255, 0.7) !important;
  color: rgba(0, 123, 255, 0.7) !important;
}
.showcase-btn-hover:hover {
  color: rgba(0, 123, 255, 0.7);
}
.showcase-btn-howto {
  /*padding: 1rem;
  border-radius: 0.7rem;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  position: relative;
  z-index: 1;
  background-image: linear-gradient(310deg, #2152FF, #21D4FD);*/
  border-left: 6px solid rgba(103, 116, 142, 0.25);
  margin-top: auto;
  margin-bottom: auto;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  padding-left: 2rem;
  font-weight: 400;
  line-height: 1.2;
  font-size: 1.125rem !important;
  transition: all 0.1s ease-in-out;
}
.showcase-btn-howto.active {
  border-left: 6px solid rgba(0, 123, 255, 0.7) !important;
  color: rgba(0, 123, 255, 0.7) !important;
}
.showcase-btn-howto:hover {
  color: rgba(0, 123, 255, 0.7);
}
.howto-text {
  margin-top: 1rem;
  margin-bottom: 0;
  color: var(--bs-body-color);
  display: none;
}
.showcase-btn-howto.active .howto-text {
  display: block;
}
/*.showcase-btn-hover.active {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #3A416F;
  background: transparent;
  background-image: linear-gradient(310deg, #2152FF, #21D4FD);
}*/
.showcase-text {
  line-height: 1 !important;
  font-size: 1.125rem !important;
}

#gradient-canvas {
  width:100%;
  height:100%;
  --gradient-color-1: #c3e4ff; 
  --gradient-color-2: #6ec3f4; 
  --gradient-color-4: #002391;
  /*--gradient-color-4: #001eff; */ 
  --gradient-color-3: #b9beff;
}
@media screen and (max-width: 1199px) {
  .showcase-nav-pill {
      width: 100% !important;
    }
    .showcase-nav-pill-2 {
      width: 75% !important;
    }
    .showcase-dialpad {
      margin: 5rem;
    }
  }
@media screen and (max-width: 991px) {
    .welcome-title {
        font-size: 48px !important;
    }
    .btn-sm-d-none {
      display: none !important;
    }
    .btn-login {
      margin: 5px auto 5px 0 !important;
      color: var(--bs-heading-color) !important;
    }
    a.btn-login:hover,
    .btn-login:hover {
      color: rgba(37,196,242,1) !important;
      background-color: transparent !important;
      /*background-color: rgb(0 0 0 / 5%) !important;*/
    }
    .nav-login-signup {
      float: none;
      /*margin: 0 0.5rem 0.5rem 0.5rem !important;*/
    }
    .profile-image {
      width: 150px !important;
      height: 150px !important;
      font-size: 2rem !important;
    }
    .showcase-slide {
      position: relative;
      margin-top: 1rem;
      margin-bottom: 5rem;
      padding-top: 3rem;
      padding-bottom: 3rem;
      padding-left: 2rem !important;
      padding-right: 2rem !important;
    }
    .showcase-text {
      font-size: 0.8rem !important;
    }
    .showcase-dialpad {
      margin-left: 10rem;
      margin-right: 10rem;
      margin-top: 5rem;
      margin-bottom: 0rem;
    }
}
@media screen and (max-width: 767px) {
    .welcome-title {
        font-size: 36px !important;
    }
    .welcome-subtitle {
    font-size: 1.2rem;
    }
    .welcome-title-container h1 {
    font-size: 30px;
    }
    .showcase-text {
      font-size: 1.2rem !important;
    }
    .showcase-dialpad {
      margin-left: 5rem;
      margin-right: 5rem;
      margin-top: 5rem;
      margin-bottom: 0rem;
    }
}
@media screen and (max-width: 557px) {
    .showcase-text {
      font-size: 1.2rem !important;
    }
}
@media screen and (max-width: 557px) {
    .welcome-title {
        font-size: 36px !important;
        font-weight: 700 !important;
    }
    .showcase-slide {
      margin-top: 0;
      padding-top: 0.3rem;
      padding-left: 1rem !important;
      padding-right: 1rem !important;
    }
    .showcase-dialpad {
      margin-left: 3rem;
      margin-right: 3rem;
      margin-top: 3rem;
      margin-bottom: 0rem;
    }
  }
@media screen and (max-width: 511px) {
    .welcome-title {
        font-size: 34px !important;
        font-weight: 700 !important;
    }
  }
@media screen and (max-width: 484px) {
    .welcome-title {
        font-size: 32px !important;
        font-weight: 700 !important;
    }
    .welcome-subtitle {
        font-size: 1rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
  }
@media screen and (max-width: 456px) {
    .welcome-title {
        font-size: 30px !important;
        font-weight: 700 !important;
    }
  }
@media screen and (max-width: 431px) {
    .welcome-title {
        font-size: 28px !important;
        font-weight: 700 !important;
    }
    .showcase-dialpad {
      margin-left: 2rem;
      margin-right: 2rem;
      margin-top: 2rem;
      margin-bottom: 0rem;
    }
  }
@media screen and (max-width: 408px) {
    .welcome-title {
        font-size: 26px !important;
        font-weight: 700 !important;
    }
    .logo {
      width: 135px;
    }
  }
@media screen and (max-width: 376px) {
    .welcome-title {
        font-size: 24px !important;
        font-weight: 700 !important;
    }
    .showcase-dialpad {
      margin-left: 1rem;
      margin-right: 1rem;
      margin-top: 1rem;
      margin-bottom: 0rem;
    }
  }
@media screen and (max-width: 350px) {
    .welcome-title {
        font-size: 22px !important;
        font-weight: 700 !important;
    }
  }
@media screen and (max-height: 1250px) {
  .crm-dealboard-table {
    max-height: 68vh;
    overflow: auto;
  }
}
@media screen and (max-height: 1150px) {
  .crm-dealboard-table {
    max-height: 64vh;
    overflow: auto;
  }
}
@media screen and (max-height: 1050px) {
  .crm-dealboard-table {
    max-height: 58vh;
    overflow: auto;
  }
}
@media screen and (max-height: 850px) {
  .crm-dealboard-table {
    max-height: 50vh;
    overflow: auto;
  }
}
@media screen and (max-height: 700px) {
  .crm-dealboard-table {
    max-height: 46vh;
    overflow: auto;
  }
}
@media screen and (max-height: 650px) {
  .crm-dealboard-table {
    max-height: 40vh;
    overflow: auto;
  }
}
/***************************
 ----- Auth Pages --------
* ************************/
.card-auth {
  max-width: 450px;
  min-width: 400px;
  margin-top: 0;
  padding: 0.5rem;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.card-register {
  top: 50px;
}
   .oblique {
    transform: skewX(16deg);
    overflow: hidden;
    width: 60%;
    right: -40rem;
    border-bottom-left-radius: 10rem;
    border-top-left-radius: 10rem;
}
.oblique .oblique-image {
  transform: skewX(0deg);
}
.oblique2 {
    transform: skewX(337deg);
    overflow: hidden;
    width: 60%;
    right: -40rem;
    border-bottom-left-radius: 20rem;
    border-top-left-radius: 10rem;
}
.oblique2 .oblique2-image {
  transform: skewX(0deg);
}
@media screen and (min-width: 1399px) {
  .oblique {
      right: -25rem;
    }
    .oblique2 {
      right: -25rem;
    }
  }
@media screen and (max-width: 1398px) {
  .oblique {
      right: -15rem;
    }
    .oblique2 {
      right: -15rem;
    }
  }
@media screen and (max-width: 400px) {
  .card-auth {
    min-width: 300px;
    margin: 20px auto !important;
  }
  .auth-overflow {
    overflow-x: auto;
  }
}
/******************************
 * Select2
 *****************************
 */

.select2-container--default:focus {
  border: 0.10rem solid rgba(37,196,242,0.3) !important;
  /*border-color: rgba(37,196,242,0.1) !important;*/
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.select2-container .select2-selection--multiple {
  min-height: 40px;
  /*background: var(--bs-gray-200);
  border-color: var(--bs-gray-200) !important;*/
}
.select2-selection--multiple {
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  padding: 2px 5px;
  color: inherit !important;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
  background-color: #e9ecef;
  cursor: default;
}
.select2-container--default .select2-selection--multiple {
    border: 1px solid #aaa;
    border-color: #d2d6da;
    border-width: 0.07rem;
    border-radius: 0.6rem;
    font-family: inherit;
    font-weight: 400;
    font-size: 15px;
    color: inherit !important;
    padding-bottom: 2px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -ms-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -o-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    /*height: 40px;
    max-height: 100px;
    /*overflow-y: auto;
    /*box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);*/
}
.select2-container--default .select2-selection--single {
    border-color: #d2d6da;
    /*border-color: rgba(225,225,225,0.5);*/
    border-width: 0.07rem;
    border-radius: 0.6rem;
    font-family: inherit;
    font-weight: 400;
    font-size: 14px;
    padding: 6px 2px;
    color: inherit !important;
    background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -ms-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    -o-box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);
}
.select2-selection--multiple--custom.select2-selection--custom {
    border: transparent !important;
    height: auto;
    max-height: 150px;
    overflow-y: auto;
    background: transparent;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 0.10rem solid rgba(37,196,242,0.3) !important;
    border-width: 0.07rem !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: inherit;
    line-height: 25px;
    padding-left: none;
    padding-right: none;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left:none;
    padding-right:none;
}
.select2-container .select2-search--inline .select2-search__field {
    /*padding: 2px;*/
    width: 100% !important;
    margin-top: 4px;
    padding-bottom: 1px;
    /*margin-bottom: -3px;*/
}
.select2-container .select2-selection--single {
    height: 40px;
    cursor: pointer;
    font-color: inherit;
    color: inherit !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: none;
    border-style: none;
    border-width: 0;
    height: 0;
    left: 50%;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    /*opacity: 0;*/
    border: none;
    background-repeat: no-repeat;
    background-position: 99.5% 50% !important;
    background-image: url(/img/svg/expand_more_gray_24dp.svg) !important;
    /*background-image: url("https://fonts.gstatic.com/s/i/materialiconsoutlined/expand_more/v12/24px.svg") !important;*/
    transform: rotate(0deg);
    transition: all 0.2s ease-in-out;
}
.select2-container--default.select2-container--open .select2-selection__arrow {
    transform: rotate(180deg);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    font-size: 14px;
    position: absolute;
    top: 7px;
    right: 8px;
    width: 26px;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    margin-bottom: -3px;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    list-style: none;
    width: 95%;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #F2F5F7;
    border: 1px solid #F5F5F5;
    border-radius: 0.6rem;
    cursor: default;
    float: left;
    margin-right: 5px;
    margin-top: 3px;
    padding: 2px 10px;
    color: inherit;
}
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #E9ECEF;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    margin-right: 10px;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom-left-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
}
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top-left-radius: 0.6rem;
    border-top-right-radius: 0.6rem;
}
.select2-search--dropdown {
  padding: 0;
}
.select2-container--open .select2-dropdown--below {
    border: 1px solid #F0F0F0;
    margin-top: 5px;
    border-radius: 0.6rem;
    padding: 5px;
    font-size: 14px;
    -webkit-box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    -moz-box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    z-index:9999 !important;
    /* border-top-left-radius: 0; */
    /* border-top-right-radius: 0; */
}
.select2-container--open .select2-dropdown--above {
    border: 1px solid #F0F0F0;
    margin-top: 0;
    border-radius: 0.6rem;
    padding: 5px;
    font-size: 14px;
    z-index:9999 !important;
    -webkit-box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    -moz-box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    box-shadow: 0px 5px 10px 1px rgb(0,0,0,0.07);
    /* border-top-left-radius: 0; */
    /* border-top-right-radius: 0; */
}
.select2-results__options {
    list-style: none;
    margin: 0;
    padding: 0;
}
.select2-results__option {
    padding: 6px;
    border-radius: 0.6rem;
    color: inherit;
    user-select: none;
    -webkit-user-select: none;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #F2F5F7;
    color: inherit !important;
}
.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin-bottom: 0;
    position: relative;
    vertical-align: middle;
    width: 100% !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: none;
    display:none;
    visibility: hidden;
}
.select2-container--default .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
    margin-top: 5px;
    margin-right: -1px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--bs-body-color);
}
.select2-container--default .select2-selection--single .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
    display: none;
}
/* Custom Select2 */

.custom-field-select2 {
  width: 100%;
  display: block;
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.4rem;
  background-color: #fff;
  background-clip: padding-box;
  border-radius: 0.6rem;
  appearance: none;
}
.custom-field-select2 .select2-search {
  margin: 0.1rem;
}
.custom-field-select2 .select2-search .select2-search__field {
  padding: 0.2rem 0.3rem;
  border: 1px solid rgba(213, 219, 224, 0.8);
  border-radius: 0.5rem;
}
.custom-field-select2 .select2-search .select2-search__field:focus {
  border-color: rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.1rem rgba(37,196,242,0.3) !important;
    -moz-box-shadow: 0 0 0 0.1rem rgba(37,196,242,0.3) !important;
    -ms-box-shadow: 0 0 0 0.1rem rgba(37,196,242,0.3) !important;
    -o-box-shadow: 0 0 0 0.1rem rgba(37,196,242,0.3) !important;
    box-shadow: 0 0 0 0.1rem rgba(37,196,242,0.3) !important;
}
.custom-field-select2 .select2-results__option--highlighted {

}
.custom-field-select2 .new-options {
    pointer-events:stroke !important;
    z-index: 9999;
}
.custom-field-select2 .select2-results__options {
    margin-top: 0.5rem;
    margin-bottom: 0.1rem;
}
.custom-field-select2 .select2-results__option {
    padding: 0.3rem;
}
.custom-field-select2 .select2-results__option:hover {
    background: rgba(213, 219, 224, 0.4) !important;
}
.delete-opt {
    background: transparent;
    vertical-align: middle;
    border-radius: 0px;
    float: right;
    display: block;
    position: relative;
    color: inherit;
    padding: 0.1rem;
    line-height: 1;
    transition: all ease 0.3s;
}
.delete-opt:hover {
  background: #ffffff;
  color: rgba(255, 0, 0, 0.8);
  border-radius: 50%;
}
/***********************
* Lead Search Engine
***********************/
.main-search {
  background: #e9ecef !important;
}
.main-search .form-holder {
  padding-top: 3px;
}
.main-search .form-control {
  background: inherit;
  border: 0;
  padding-left: 20px;
}
.main-search .form-control:focus {
  border: 0 !important;
}
.main-search .dropdown-holder {
  position: absolute;
  top: 5px;
  right: 170px;
}
.main-search .btn-holder {
  position: absolute;
  top: 0;
  right: 0;
  width: 170px;
}
.main-search .btn-holder .btn {
  padding-top: 13px;
  padding-bottom: 13px;
}
.main-search .dropdown-toggle {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.main-search .btn-dropdown {
  background: none;
  font-size: 12px;
  text-transform: capitalize;
  position: relative;
  padding-left: 10px;
  padding-right: 15px;
}
.main-search .btn-dropdown:after {
  content: "";
  position: absolute;
  top: 8px;
  left: 16px;
  width: 1px;
  height: 17px;
  background: #CACACA;
}
.main-search .dropdown-menu {
  margin: 0;
}
.main-search .dropdown-menu li a {
  font-size: 12px;
  padding: 3px 15px;
}
.btn-search-expand {
  padding: 0.2em 0.6em;
  margin: 0.25em 0.5em 0 0;
}
.search-results-header {
    text-align: center;
    margin-left: 20%;
}
.leads-search-table {
  overflow-x: auto;
}
.search-refine-wrapper  {
  margin-top: 0;
  transition: all 0.2s ease-in-out;
}
.search-refine-wrapper .collapse {
  margin-top: 20px;
  transition: all 0.2s ease-in-out;
}
.btn-search-pref {
    border-radius: 50%;
    padding: 0.6rem;
}
.btn-search-pref:hover {
  background: #f2f5f7;
  color: var(--bs-link-color);
  cursor: pointer;
}
.btn-search-pref:focus {
    outline: 0;
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    opacity: 1;
}
.btn-search-assign {
    font-family: "FontAwesome" !important;
    content: "\f077";
    font-size: 16px;
    color: inherit !important;
    padding: 0.65rem;
    margin-top: -2px;
}
.btn-search-assign:after {
    content: "\f077";
    color: inherit !important;
}
.btn-search-assign:hover {
    background: #fff;
    color: var(--bs-link-color) !important;
    cursor: pointer;
}
.btn-search-assign:focus {
     outline: 0;
      -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
      opacity: 1;
}
.btn-search-assign.collapsed:after {
    content: '\f078';
    color: inherit !important;
}
.btn-search-filter {
    font-family: "Ionicons" !important;
    content: "\f2d7";
    padding: 0.5rem 0.6rem;
    font-size: 20px;
    height: 42px;
    width: 42px;
    max-height: 42px;
    max-width: 42px;
    background-color: transparent;
    border-radius: 50%;
    color: inherit !important;
    margin-top: 2px !important;
    margin-right: 5px;
}
.btn-search-filter:after {
    font-size: 20px;
    content: "\f2d7";
    padding-left: 0.25rem;
    color: inherit !important;
}
.btn-search-filter:hover {
    background: #f2f5f7;
    color: var(--bs-link-color) !important;
    cursor: pointer;
}
.btn-search-filter:focus {
     outline: 0;
      -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
      opacity: 1;
}
.btn-search-filter.collapsed:after {
    content: '\f4a6';
    font-size: 20px;
    color: inherit !important;
}

/***********************
 * Dropzone
 ***********************/

/*.dropzone {
  min-height: 150px;
    border: 2px solid rgba(0,0,0,0.3);
    background: white;
    padding: 20px 20px;
}
.dropzone:hover {
  border-color: #002391;
}*/
.dropzone {
  display: block;
  width: 100%;
  margin-bottom: 5px;
  padding: 20px;
  /*color: #8d9499;*/
  color: #97A1A8;
  cursor: pointer;
  background: #fff;
  border: 2px dashed rgba(103, 116, 142,0.7);
    border-radius: 0.5em;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  -webkit-transition: box-shadow 0.3s,  border-color 0.3s;
  -moz-transition: box-shadow 0.3s,  border-color 0.3s;
  transition: box-shadow 0.3s,  border-color 0.3s;
  overflow: hidden;
}
.dropzone:hover, .hoverClass {
  border-color: #80bdff;
}
.dropzone .dropzone-icon {
  background: none;
    color: inherit;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: inherit;
  
  font-size: 50px;
  margin-bottom: -40px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.dropzone .dropzone-icon:hover, .hoverClass {
  border-color: #0676CE;
}
.filer.dragged .filer-input-dragDrop {
  border-color: #aaa;
  box-shadow: inset 0 0 20px rgba(0,0,0,.08);
}
.filer.dragged .filer-input-dragDrop * {
  pointer-events: none;
}
.filer.dragged .filer-input-icon {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.filer.dragged .filer-input-text, .filer.dragged .filer-input-choose-btn {
  filter: alpha(opacity=30);
  opacity: 0.3;
}
.filer-input-text h3 {
  margin: 0;
  font-size: 18px;
}
.filer-input-text span {
  font-size: 12px;
}
.filer-input-choose-btn {
  display: inline-block;
  padding: 8px 14px;
  outline: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  font-size: 12px;
  font-weight: bold;
  color: #8d9496;
  border-radius: 3px;
  border: 1px solid #c6c6c6;
  vertical-align: middle;
  background-color: #fff;
  box-shadow: 0px 1px 5px rgba(0,0,0,0.05);
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.filer-input-choose-btn:hover, .filer-input-choose-btn:active {
  color: inherit;
}
.filer-input-choose-btn:active {
  background-color: #f5f5f5;
}
#previewImage {
  margin-right: 5px;
  float: left;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  background-size: cover;
  background-position: center center;
}
.previewPhoto {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #FFF;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  /*background-image: url('http://localhost/gostock/public/uploads/16.jpg');*/
  display: none;
  cursor: default;
}
.dropzone.dz-clickable {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition:all 0.3s;
}
.dropzone.dz-clickable:hover {
    color: #80bdff;
}
/**************************
----Nav Pills Nav Link----
**************************/
/*.nav.nav-pills .nav-link {
    z-index: 1;
    color: #344767;
    border-radius: 0.5rem;
    background-color: inherit;
}
.nav-link {
  display: block;
  padding: 0.6rem 1rem;
  color: #3B57AF;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}*/
.nav-link-account {
    margin-top:4px;
    color: inherit !important;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -o-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    background: #fff !important;
    border: 0.15em solid transparent !important;
    border-radius: 0.7em !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
.nav-link-account:hover {
    background: #F8F8F8 !important;
    color: #0676CE !important;
}
.nav-link-account.active {
    color: #FFF !important;
    /*background-color: transparent !important; 
    background-image: linear-gradient(310deg, #2152ff 0%, #21d4fd 100%) !important;*/
    background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
    border: none !important;
    /*background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.15em solid #0676CE !important;*/
}
.nav-link-history {
    margin-top: 4px;
    color: inherit !important;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -o-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    background: #fff !important;
    /*border: 0.15em solid transparent !important;*/
    border-radius: 0.7em !important;
    max-height: 50px;
    /*padding: 0.2rem 1rem !important;*/
    overflow: hidden;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
.nav-link-history:hover {
    background: #F8F8F8 !important;
    color: #0676CE !important;
}
.nav-link-history.active {
    color: #FFF !important;
    background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
    border: none !important;
    /*background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.15em solid #0676CE !important;*/
}
.nav-link-success {
    margin-top: 4px;
    color: inherit !important;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -o-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    background: #fff !important;
    /*border: 0.15em solid transparent !important;*/
    border-radius: 0.7em !important;
    max-height: 50px;
    /*padding: 0.2rem 1rem !important;*/
    overflow: hidden;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
.nav-link-success:hover {
    background: #F8F8F8 !important;
    color: #17ad37 !important;
}
.nav-link-success-2:hover {
    background: #F8F8F8 !important;
    color: rgba(24,182,155,1) !important;
}
.nav-link-success.active {
    color: #FFF !important;
    background-image: linear-gradient(310deg, #17ad37 0%, #98ec2d 100%) !important;
    border: none !important;
    /*background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.15em solid #0676CE !important;*/
}
.nav-link-success-2.active {
    color: #FFF !important;
    background-image: linear-gradient(310deg, rgba(24,182,155,1) 0%, rgba(37, 245, 210,1) 100%) !important;
    border: none !important;
    /*background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.15em solid #0676CE !important;*/
}
.nav-link-dealboard {
    margin-top: 4px;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -o-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    background: #fff !important;
    border: 0.1em solid transparent !important;
    border-radius: 0.7em !important;
    max-height: 45px !important;
    min-width: 150px !important;
    padding: 0.2rem 1rem !important;
    overflow: hidden;
    color: #333;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
.nav-link-dealboard:hover {
    background: #F0F0F0 !important;
    color: #0676CE !important;
}
.nav-link-dealboard.active {
    color: #FFF !important;
    background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.1em solid #0676CE !important;
}
.nav-link-dealboard-text {
    vertical-align: middle !important;
    display: inline-flex;
    font-size: 14px;
    padding: 6px;
}
@media screen and (max-width: 991px) {
    .nav-link-dealboard-text p {
        font-size: 12px;
    }
}
@media screen and (max-width: 767px) {
    .nav-link-dealboard-text p {
        font-size:14px;
    }
}
@media (prefers-reduced-motion: reduce) {
  .nav-link {
    transition: none;
  }
}
.nav-link:hover, .nav-link:focus {
  /*color: #0a58ca;*/
  color: #63B3ED;
}
/*.nav-link.disabled {
  color: #6c757d;
  pointer-events: none;
  cursor: default;
}

.nav-tabs {
  border-bottom: 1px solid #dee2e6;
}
.nav-tabs .nav-link {
  margin-bottom: -1px;
  background: none;
  border: 1px solid transparent;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
  border-color: #e9ecef #e9ecef #dee2e6;
  isolation: isolate;
}
.nav-tabs .nav-link.disabled {
  color: #6c757d;
  background-color: transparent;
  border-color: transparent;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: #495057;
  background-color: #fff;
  border-color: #dee2e6 #dee2e6 #fff;
}
.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}*/
.nav.nav-pills {
    background: transparent;
    /*background: #f8f9fa;*/
    border-radius: 0.75rem;
    position: relative;
    z-index: 1;
}
.nav-pills > li + li {
  margin-left: 2px;
}
/*.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  color: #ffffff;
  background-color: #337ab7;
}

/*.nav-pills .nav-link {
  background: none;
  border: 0;
  border-radius: 0.25rem;
}
/*.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff;
  background-color: #0d6efd;
}*/

.nav-fill > .nav-link,
.nav-fill .nav-item {
  flex: 1 1 auto;
  text-align: center;
}

.nav-justified > .nav-link,
.nav-justified .nav-item {
  flex-basis: 0;
  flex-grow: 1;
  text-align: center;
}
.nav-pill-text p {
    position: relative;
    display: inline-block;
    line-height: 1;
    padding: 0.7em 0.7em;
    margin-bottom: -0.5em;
    font-size: 15px;
}
.nav-pill-p-text {
    margin-top: -0.4rem !important;
    font-weight: 600;
}
.nav-account-g-icon {
    vertical-align: middle !important;
    /*padding: 0.2em 0 0 0 !important;*/
}
.nav-fill .nav-item .nav-link,
.nav-justified .nav-item .nav-link {
  width: 100%;
}
.switch-md {
    height: 1.5em !important;
    width: 3em !important;
}
.switch-lg {
    height: 2em !important;
    width: 4em !important;
}
.table>:not(:first-child) {
    border-top: none !important;
}
/**************************
------Activity Sidebar------
**************************/

.fixed-plugin-activity .fixed-plugin-activity-button {
  background: #fff;
  border-radius: 50%;
  bottom: 20px;
  right: 20px;
  height: 54px;
  width: 54px;
  font-size: 1.25rem;
  z-index: 990;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16);
  cursor: pointer;
}

.fixed-plugin-activity .fixed-plugin-activity-button i {
  pointer-events: none;
}

.fixed-plugin-activity .card {
  position: fixed !important;
  right: -500px;
  top: 0;
  left: auto !important;
  transform: unset !important;
  width: 425px;
  border-radius: 0;
  padding: 0 10px;
  transition: .2s ease;
  z-index: 1020;
  height: 100%;
  min-height: 100%;
  max-height: 100%;
}

.fixed-plugin-activity .card .card-body {
  overflow: scroll;
}

.fixed-plugin-activity .badge {
  border: 1px solid #fff;
  border-radius: 50%;
  cursor: pointer;
  display: inline-block;
  height: 23px;
  margin-right: 5px;
  position: relative;
  width: 23px;
  transition: all 0.2s ease-in-out;
}

.fixed-plugin-activity .badge:hover,
.fixed-plugin-activity .badge.active {
  border-color: #344767;
}


.rtl .fixed-plugin-activity .fixed-plugin-activity-button {
  left: 30px;
  right: auto;
}
.rtl .fixed-plugin-activity .card {
  left: -360px !important;
  right: auto;
}
.rtl .fixed-plugin-activity.show .card {
  right: auto;
  left: 0 !important;
}

.dark-version .fixed-plugin-activity .btn.bg-gradient-dark,
.dark-version .fixed-plugin-activity .btn.btn-outline-dark {
  color: #fff !important;
  border: 1px solid #fff !important;
}


.dark-version h1,
.dark-version .h1,
.dark-version .h1,
.dark-version h2,
.dark-version .h2,
.dark-version .h2,
.dark-version h3,
.dark-version .h3,
.dark-version .h3,
.dark-version h4,
.dark-version .h4,
.dark-version .h4,
.dark-version h5,
.dark-version .h5,
.dark-version .h5,
.dark-version h6:not(.font-weight-bolder),
.dark-version .h6:not(.font-weight-bolder),
.dark-version .h6,
.dark-version a:not(.dropdown-item):not(.choices__item):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.btn):not(.nav-link):not(.fixed-plugin-activity-button):not(.opacity-5),
.dark-version .table thead tr th,
.dark-version .kanban-title-board {
  color: #fff !important;
}

@media screen and (max-width: 450px) {
    .fixed-plugin-activity .card {
      right: -500px;
      width: 100%;
    }
}

.fixed-plugin-activity .btn.bg-gradient-primary:not(:disabled):not(.disabled) {
  border: 1px solid transparent;
}

.fixed-plugin-activity .btn.bg-gradient-primary:not(:disabled):not(.disabled):not(.active) {
  background-color: transparent;
  background-image: none;
  border: 1px solid #cb0c9f;
  color: #cb0c9f;
}

.fixed-plugin-activity.show .card {
  right: 0;
}

.activity-sidebar {
      /*bottom: calc(3.5rem + 1px);
      position: absolute;
      top: calc(3.5rem + 1px);
      z-index: 1031;
    margin-right: 400px;*/
    
    position: fixed;/* need to use abolute here but it skips */
    display: block;
    top: 0;
    right: 0;
    background-color: #f4f6f9;
    width: 100%;
    max-width: 400px;
    height: 100%;
    min-height: 100vh;
    max-height: 100vh;
    z-index: 1;
    /*border-top: 1px solid #dee2e6;*/
    border-left: 1px solid #dee2e6;
    -webkit-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -moz-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -ms-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -o-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -webkit-animation-duration: 0.3s;
    -moz-animation-duration: 0.3s;
    -ms-animation-duration: 0.3s;
    -o-animation-duration: 0.3s;
    animation-duration: 0.3s;
}

/*.activity-sidebar, .activity-sidebar:before {
    bottom: calc(3.5rem + 1px);
    display: none;
    right: -400px;
    width: 400px;
    -webkit-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -moz-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -ms-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    -o-transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
    transition: right 0.3s ease-in-out, display 0.3s ease-in-out;
}*/
.activity-title {
    font-weight: 700;
    text-align: center;
    margin-left: 120px;
}
.activity-header {
    display: inline-flex;
    margin-top: 10px;
    margin-bottom: 10px;
}
.activity-body {
    overflow: auto;
    height: auto;
    max-height: 100%;
}
.activity-close-btn {
    margin-left: 10px;
}
.activity-icon {
    font-size: 16px !important;
}

.timeline {
  margin: 0 0 45px;
  padding: 0;
  position: relative;
}

.timeline::before {
  border-radius: 0.25rem;
  background-color: #dee2e6;
  bottom: 0;
  content: "";
  left: 31px;
  margin: 0;
  position: absolute;
  top: 0;
  width: 4px;
}

.timeline > div {
  margin-bottom: 15px;
  margin-right: 10px;
  position: relative;
}

.timeline > div::before, .timeline > div::after {
  content: "";
  display: table;
}

.timeline > div > .timeline-item {
  box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
  border-radius: 0.6rem;
  background-color: #fff;
  /*color: #495057;*/
  margin-left: 60px;
  margin-right: 15px;
  margin-top: 0;
  padding: 5px;
  position: relative;
}

.timeline > div > .timeline-item > .time {
  /*color: #999;*/
  float: right;
  font-size: 12px;
  padding: 10px;
}

.timeline > div > .timeline-item > .time > i {
  margin-right: 5px;
}

.timeline > div > .timeline-item > .timeline-header {
  /*border-bottom: 1px solid rgba(0, 0, 0, 0.125);*/
  /*color: #495057;*/
  font-size: 16px;
  line-height: 1.1;
  margin: 0;
  padding: 10px;
}

.timeline > div > .timeline-item > .timeline-header > a {
  font-weight: 700;
  /*color: #333;*/
}

.timeline > div > .timeline-item > .timeline-body > a {
  /*color: #333;*/
}

.timeline > div > .timeline-item > .timeline-body,
.timeline > div > .timeline-item > .timeline-footer {
  padding: 10px;
}

.timeline > div > .timeline-item > .timeline-body > img {
  margin: 10px;
}

.timeline > div > .timeline-item > .timeline-body > dl,
.timeline > div > .timeline-item > .timeline-body ol,
.timeline > div > .timeline-item > .timeline-body ul {
  margin: 0;
}

.timeline > div > .timeline-item > .timeline-footer > a {
  color: #fff;
}

.timeline > div > .fa,
.timeline > div > .fas,
.timeline > div > .far,
.timeline > div > .fab,
.timeline > div > .fal,
.timeline > div > .fad,
.timeline > div > .svg-inline--fa,
.timeline > div > .ion,
.timeline > div > .g-icon {
  background-color: #fff;
  border-radius: 50%;
  font-size: 18px;
  height: 30px;
  width: 30px;
  left: 18px;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 0;
  -webkit-box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
  -moz-box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
  -o-box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
  box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
}

.timeline > div > .svg-inline--fa {
  padding: 7px;
}

.timeline > .time-label > span {
  border-radius: 0.5rem;
    background-color: #fff;
    display: inline-block;
    font-weight: 600;
    padding: 7px;
    box-shadow: 0 1px 15px rgb(0 0 0 / 5%);
}
@media screen and (max-width: 991px) {
    .activity-sidebar {
        top: 58px;
    }
}
/******************************
 * Mineral Valuation Model
 ******************************/
.valuation-model input:hover {
}
.profit-measures table {
    min-width: 500px;
}
.profit-measures table caption {
    font-size: 16px;
    color: #333;
    font-weight: 500;
}
.profit-row-left {
    border-radius: 5px 0 0 5px;
    padding:5px;
}
.profit-row-right {
    border-radius: 0 5px 5px 0;
    padding:5px;
}
.profit-row-mid {
    padding:5px;
}
.parameter-inputs {
    margin-top: 20px;
}
.parameter-inputs table {
    min-width: 200px;
    padding: 5px;
}
.parameter-inputs table tbody tr:hover {
    background:none;
}
.parameter-inputs table caption {
    color: #333;
    font-size: 16px;
    font-weight: 500;
}
.valuation-table thead tr {
    background: #F1F1F1;
    font-size: 14px;
}
.valuation-table tbody tr {
    font-size: 14px;
}
.valuation-title {
    font-weight:700;
    font-size: 16px;
}
.valuation-main-title {
    font-weight: 700;
}
.parameter-head-border-left {
    border-radius: 5px 0 0 5px;
    width: 100px;
    padding:5px;
}
.parameter-head-border-right {
    border-radius: 0 5px 5px 0;
    width: 100px;
    padding:5px;
}
.profit-head-border-left {
    border-radius: 5px 0 0 5px;
    padding:5px;
}
.profit-head-border-right {
    border-radius: 0 5px 5px 0;
    padding:5px;
}
.profit-head-border-mid {
    padding:5px;
}
.metric-border {
    background: #fff;
    border: none;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.05);
}
.assign-btn-border {
    background: #fff;
    border: solid 1px #F1F1F1;
    border-radius: 10px;
    padding: 20px;
    /* margin: auto; */
    width: auto;
    max-width: 500px;
    display: flex;
}
.input-modal {
    border-radius: 5px;
    color: #1E1E1E;
    box-shadow: 1 1;
    border: solid 1px #fff;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    padding:5px;
    font-size: 14px;
    font-weight: 400;
}
.input-modal:focus {
    background-color: #F1F1F1;
    border: solid 1px #DAE4F8;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.valuation-results {
    margin-top: 15px;
}
.valuation-results table {
    width: 100%;
    font-size: 14px;
}
.valuation-results thead tr {
    background: #F1F1F1;
    font-size: 14px;
}
.data-head-border-left {
    border-radius: 0.5rem 0 0 0.5rem !important;
    padding:5px;
}
.data-head-border-right {
    border-radius: 0 0.5rem 0.5rem 0 !important;
    padding:5px;
}
.data-head-border-mid {
    padding:5px;
}
.data-row-left {
    border-radius: 0.5rem 0 0 0.5rem !important;
    padding:5px;
}
.data-row-right {
    border-radius: 0 0.5rem 0.5rem 0 !important;
    padding:5px;
}
.data-row-mid {
    padding:5px;
}
/*.data-row-mid-phone {
    padding:5px;
    min-width: 200px;
}*/
.parameter-buttons {
    display: inline;
    float:right;
    margin: 10px 0 10px 0;
    position: relative;
}
.results-label {
    font-weight:700;
    margin: 10px 0 0 0;
}
.parameter-label {
    font-weight:700;
}
/************************************
 * GridLex
 * http://gridlex.devlint.fr/index.html
 ************************************/

[class*=GridLex-grid] {
    box-sizing: border-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: 0
}
.GridLex-col, [class*=GridLex-col-] {
    box-sizing: border-box;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 0;
}
.GridLex-col {
    -webkit-flex: 1 1 0;
    -ms-flex: 1 1 0;
    flex: 1 1 0
}
.GridLex-grid.GridLex-col, .GridLex-grid[class*=GridLex-col-] {
    margin: 0;
    padding: 0
}
[class*=GridLex-grid-][class*=-noGutter] {
    margin: 0
}
[class*=GridLex-grid-][class*=-noGutter]>[class*=GridLex-col] {
    padding: 0
}
[class*=GridLex-grid-][class*=-center] {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}
[class*=GridLex-grid-][class*=-right] {
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    margin-left: auto
}
[class*=GridLex-grid-][class*=-top] {
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start
}
[class*=GridLex-grid-][class*=-middle] {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}
[class*=GridLex-grid-][class*=-bottom] {
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end
}
[class*=GridLex-grid-][class*=-reverse] {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}
[class*=GridLex-grid-][class*=-column] {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}
[class*=GridLex-grid-][class*=-column-reverse] {
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}
[class*=GridLex-grid-][class*=-spaceBetween] {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}
[class*=GridLex-grid-][class*=-spaceAround] {
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around
}
[class*=GridLex-grid-][class*=-equalHeight]>[class*=GridLex-col] {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}
[class*=GridLex-col-][class*=-top] {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start
}
[class*=GridLex-col-][class*=-middle] {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}
[class*=GridLex-col-][class*=-bottom] {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end
}
[class*=GridLex-col-][class*=-first] {
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1
}
[class*=GridLex-col-][class*=-last] {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1
}
[class*=GridLex-grid-1]>[class*=GridLex-col] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid-2]>[class*=GridLex-col] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid-3]>[class*=GridLex-col] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid-4]>[class*=GridLex-col] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid-5]>[class*=GridLex-col] {
    -webkit-flex-basis: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%
}
[class*=GridLex-grid-6]>[class*=GridLex-col] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid-7]>[class*=GridLex-col] {
    -webkit-flex-basis: 14.28571429%;
    -ms-flex-preferred-size: 14.28571429%;
    flex-basis: 14.28571429%;
    max-width: 14.28571429%
}
[class*=GridLex-grid-8]>[class*=GridLex-col] {
    -webkit-flex-basis: 12.5%;
    -ms-flex-preferred-size: 12.5%;
    flex-basis: 12.5%;
    max-width: 12.5%
}
[class*=GridLex-grid-9]>[class*=GridLex-col] {
    -webkit-flex-basis: 11.11111111%;
    -ms-flex-preferred-size: 11.11111111%;
    flex-basis: 11.11111111%;
    max-width: 11.11111111%
}
[class*=GridLex-grid-10]>[class*=GridLex-col] {
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    max-width: 10%
}
[class*=GridLex-grid-11]>[class*=GridLex-col] {
    -webkit-flex-basis: 9.09090909%;
    -ms-flex-preferred-size: 9.09090909%;
    flex-basis: 9.09090909%;
    max-width: 9.09090909%
}
[class*=GridLex-grid-12]>[class*=GridLex-col] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}

@media screen and (max-width:80em) {
[class*=_lg-1]>[class*=GridLex-col] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=_lg-2]>[class*=GridLex-col] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=_lg-3]>[class*=GridLex-col] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=_lg-4]>[class*=GridLex-col] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=_lg-5]>[class*=GridLex-col] {
    -webkit-flex-basis: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%
}
[class*=_lg-6]>[class*=GridLex-col] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=_lg-7]>[class*=GridLex-col] {
    -webkit-flex-basis: 14.28571429%;
    -ms-flex-preferred-size: 14.28571429%;
    flex-basis: 14.28571429%;
    max-width: 14.28571429%
}
[class*=_lg-8]>[class*=GridLex-col] {
    -webkit-flex-basis: 12.5%;
    -ms-flex-preferred-size: 12.5%;
    flex-basis: 12.5%;
    max-width: 12.5%
}
[class*=_lg-9]>[class*=GridLex-col] {
    -webkit-flex-basis: 11.11111111%;
    -ms-flex-preferred-size: 11.11111111%;
    flex-basis: 11.11111111%;
    max-width: 11.11111111%
}
[class*=_lg-10]>[class*=GridLex-col] {
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    max-width: 10%
}
[class*=_lg-11]>[class*=GridLex-col] {
    -webkit-flex-basis: 9.09090909%;
    -ms-flex-preferred-size: 9.09090909%;
    flex-basis: 9.09090909%;
    max-width: 9.09090909%
}
[class*=_lg-12]>[class*=GridLex-col] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
}

@media screen and (max-width:64em) {
[class*=_md-1]>[class*=GridLex-col] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=_md-2]>[class*=GridLex-col] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=_md-3]>[class*=GridLex-col] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=_md-4]>[class*=GridLex-col] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=_md-5]>[class*=GridLex-col] {
    -webkit-flex-basis: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%
}
[class*=_md-6]>[class*=GridLex-col] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=_md-7]>[class*=GridLex-col] {
    -webkit-flex-basis: 14.28571429%;
    -ms-flex-preferred-size: 14.28571429%;
    flex-basis: 14.28571429%;
    max-width: 14.28571429%
}
[class*=_md-8]>[class*=GridLex-col] {
    -webkit-flex-basis: 12.5%;
    -ms-flex-preferred-size: 12.5%;
    flex-basis: 12.5%;
    max-width: 12.5%
}
[class*=_md-9]>[class*=GridLex-col] {
    -webkit-flex-basis: 11.11111111%;
    -ms-flex-preferred-size: 11.11111111%;
    flex-basis: 11.11111111%;
    max-width: 11.11111111%
}
[class*=_md-10]>[class*=GridLex-col] {
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    max-width: 10%
}
[class*=_md-11]>[class*=GridLex-col] {
    -webkit-flex-basis: 9.09090909%;
    -ms-flex-preferred-size: 9.09090909%;
    flex-basis: 9.09090909%;
    max-width: 9.09090909%
}
[class*=_md-12]>[class*=GridLex-col] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
}

@media screen and (max-width:48em) {
[class*=_sm-1]>[class*=col] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=_sm-2]>[class*=col] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=_sm-3]>[class*=col] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=_sm-4]>[class*=col] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=_sm-5]>[class*=col] {
    -webkit-flex-basis: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%
}
[class*=_sm-6]>[class*=col] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=_sm-7]>[class*=col] {
    -webkit-flex-basis: 14.28571429%;
    -ms-flex-preferred-size: 14.28571429%;
    flex-basis: 14.28571429%;
    max-width: 14.28571429%
}
[class*=_sm-8]>[class*=col] {
    -webkit-flex-basis: 12.5%;
    -ms-flex-preferred-size: 12.5%;
    flex-basis: 12.5%;
    max-width: 12.5%
}
[class*=_sm-9]>[class*=col] {
    -webkit-flex-basis: 11.11111111%;
    -ms-flex-preferred-size: 11.11111111%;
    flex-basis: 11.11111111%;
    max-width: 11.11111111%
}
[class*=_sm-10]>[class*=col] {
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    max-width: 10%
}
[class*=_sm-11]>[class*=col] {
    -webkit-flex-basis: 9.09090909%;
    -ms-flex-preferred-size: 9.09090909%;
    flex-basis: 9.09090909%;
    max-width: 9.09090909%
}
[class*=_sm-12]>[class*=col] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
}

@media screen and (max-width:35.5em) {
[class*=_xs-1]>[class*=GridLex-col] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=_xs-2]>[class*=GridLex-col] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=_xs-3]>[class*=GridLex-col] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=_xs-4]>[class*=GridLex-col] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=_xs-5]>[class*=GridLex-col] {
    -webkit-flex-basis: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%
}
[class*=_xs-6]>[class*=GridLex-col] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=_xs-7]>[class*=GridLex-col] {
    -webkit-flex-basis: 14.28571429%;
    -ms-flex-preferred-size: 14.28571429%;
    flex-basis: 14.28571429%;
    max-width: 14.28571429%
}
[class*=_xs-8]>[class*=GridLex-col] {
    -webkit-flex-basis: 12.5%;
    -ms-flex-preferred-size: 12.5%;
    flex-basis: 12.5%;
    max-width: 12.5%
}
[class*=_xs-9]>[class*=GridLex-col] {
    -webkit-flex-basis: 11.11111111%;
    -ms-flex-preferred-size: 11.11111111%;
    flex-basis: 11.11111111%;
    max-width: 11.11111111%
}
[class*=_xs-10]>[class*=GridLex-col] {
    -webkit-flex-basis: 10%;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    max-width: 10%
}
[class*=_xs-11]>[class*=GridLex-col] {
    -webkit-flex-basis: 9.09090909%;
    -ms-flex-preferred-size: 9.09090909%;
    flex-basis: 9.09090909%;
    max-width: 9.09090909%
}
[class*=_xs-12]>[class*=GridLex-col] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
}
[class*=GridLex-grid]>[class*=GridLex-col-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=GridLex-col-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=GridLex-col-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=GridLex-col-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=GridLex-col-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=GridLex-col-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=GridLex-col-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=GridLex-col-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=GridLex-col-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=GridLex-col-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=GridLex-col-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=GridLex-col-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=off-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=off-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=off-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=off-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=off-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=off-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=off-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=off-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=off-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=off-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=off-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=off-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=off-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=off-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=off-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=off-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=off-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=off-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=off-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=off-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=off-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=off-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=off-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=off-11] {
    margin-right: 91.66666667%
}

@media screen and (max-width:80em) {
[class*=GridLex-grid]>[class*=_lg-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_lg-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_lg-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_lg-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_lg-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_lg-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_lg-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_lg-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_lg-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_lg-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_lg-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_lg-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_lg-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_lg-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_lg-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_lg-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_lg-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_lg-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_lg-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_lg-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_lg-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_lg-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_lg-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_lg-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_lg-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_lg-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_lg-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_lg-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_lg-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_lg-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_lg-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_lg-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_lg-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_lg-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_lg-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_lg-11] {
    margin-right: 91.66666667%
}
}

@media screen and (max-width:64em) {
[class*=GridLex-grid]>[class*=_md-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_md-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_md-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_md-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_md-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_md-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_md-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_md-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_md-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_md-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_md-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_md-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_md-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_md-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_md-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_md-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_md-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_md-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_md-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_md-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_md-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_md-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_md-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_md-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_md-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_md-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_md-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_md-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_md-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_md-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_md-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_md-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_md-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_md-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_md-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_md-11] {
    margin-right: 91.66666667%
}
}

@media only screen and (max-width: 1199px) {
[class*=GridLex-grid]>[class*=_mdd-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_mdd-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_mdd-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_mdd-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_mdd-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_mdd-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_mdd-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_mdd-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_mdd-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_mdd-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_mdd-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_mdd-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_mdd-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_mdd-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_mdd-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_mdd-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_mdd-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_mdd-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_mdd-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_mdd-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_mdd-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_mdd-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_mdd-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_mdd-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_mdd-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_mdd-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_mdd-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_mdd-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_mdd-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_mdd-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_mdd-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_mdd-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_mdd-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_mdd-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_mdd-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_mdd-11] {
    margin-right: 91.66666667%
}
}

@media only screen and (max-width: 991px) {
[class*=GridLex-grid]>[class*=_sm-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_sm-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_sm-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_sm-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_sm-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_sm-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_sm-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_sm-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_sm-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_sm-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_sm-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_sm-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_sm-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_sm-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_sm-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_sm-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_sm-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_sm-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_sm-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_sm-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_sm-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_sm-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_sm-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_sm-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_sm-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_sm-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_sm-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_sm-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_sm-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_sm-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_sm-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_sm-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_sm-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_sm-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_sm-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_sm-11] {
    margin-right: 91.66666667%
}
}

@media only screen and (max-width: 767px) {
[class*=GridLex-grid]>[class*=_xs-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_xs-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_xs-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_xs-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_xs-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_xs-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_xs-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_xs-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_xs-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_xs-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_xs-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_xs-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_xs-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_xs-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_xs-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_xs-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_xs-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_xs-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_xs-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_xs-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_xs-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_xs-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_xs-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_xs-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_xs-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_xs-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_xs-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_xs-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_xs-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_xs-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_xs-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_xs-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_xs-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_xs-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_xs-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_xs-11] {
    margin-right: 91.66666667%
}
}

@media (max-width: 479px) {
[class*=GridLex-grid]>[class*=_xss-1] {
    -webkit-flex-basis: 8.33333333%;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%
}
[class*=GridLex-grid]>[class*=_xss-2] {
    -webkit-flex-basis: 16.66666667%;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%
}
[class*=GridLex-grid]>[class*=_xss-3] {
    -webkit-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%
}
[class*=GridLex-grid]>[class*=_xss-4] {
    -webkit-flex-basis: 33.33333333%;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%
}
[class*=GridLex-grid]>[class*=_xss-5] {
    -webkit-flex-basis: 41.66666667%;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%
}
[class*=GridLex-grid]>[class*=_xss-6] {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%
}
[class*=GridLex-grid]>[class*=_xss-7] {
    -webkit-flex-basis: 58.33333333%;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%
}
[class*=GridLex-grid]>[class*=_xss-8] {
    -webkit-flex-basis: 66.66666667%;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%
}
[class*=GridLex-grid]>[class*=_xss-9] {
    -webkit-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%
}
[class*=GridLex-grid]>[class*=_xss-10] {
    -webkit-flex-basis: 83.33333333%;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%
}
[class*=GridLex-grid]>[class*=_xss-11] {
    -webkit-flex-basis: 91.66666667%;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%
}
[class*=GridLex-grid]>[class*=_xss-12] {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}
[class*=GridLex-grid]>[push-left*=_xss-0] {
    margin-left: 0
}
[class*=GridLex-grid]>[push-left*=_xss-1] {
    margin-left: 8.33333333%
}
[class*=GridLex-grid]>[push-left*=_xss-2] {
    margin-left: 16.66666667%
}
[class*=GridLex-grid]>[push-left*=_xss-3] {
    margin-left: 25%
}
[class*=GridLex-grid]>[push-left*=_xss-4] {
    margin-left: 33.33333333%
}
[class*=GridLex-grid]>[push-left*=_xss-5] {
    margin-left: 41.66666667%
}
[class*=GridLex-grid]>[push-left*=_xss-6] {
    margin-left: 50%
}
[class*=GridLex-grid]>[push-left*=_xss-7] {
    margin-left: 58.33333333%
}
[class*=GridLex-grid]>[push-left*=_xss-8] {
    margin-left: 66.66666667%
}
[class*=GridLex-grid]>[push-left*=_xss-9] {
    margin-left: 75%
}
[class*=GridLex-grid]>[push-left*=_xss-10] {
    margin-left: 83.33333333%
}
[class*=GridLex-grid]>[push-left*=_xss-11] {
    margin-left: 91.66666667%
}
[class*=GridLex-grid]>[push-right*=_xss-0] {
    margin-right: 0
}
[class*=GridLex-grid]>[push-right*=_xss-1] {
    margin-right: 8.33333333%
}
[class*=GridLex-grid]>[push-right*=_xss-2] {
    margin-right: 16.66666667%
}
[class*=GridLex-grid]>[push-right*=_xss-3] {
    margin-right: 25%
}
[class*=GridLex-grid]>[push-right*=_xss-4] {
    margin-right: 33.33333333%
}
[class*=GridLex-grid]>[push-right*=_xss-5] {
    margin-right: 41.66666667%
}
[class*=GridLex-grid]>[push-right*=_xss-6] {
    margin-right: 50%
}
[class*=GridLex-grid]>[push-right*=_xss-7] {
    margin-right: 58.33333333%
}
[class*=GridLex-grid]>[push-right*=_xss-8] {
    margin-right: 66.66666667%
}
[class*=GridLex-grid]>[push-right*=_xss-9] {
    margin-right: 75%
}
[class*=GridLex-grid]>[push-right*=_xss-10] {
    margin-right: 83.33333333%
}
[class*=GridLex-grid]>[push-right*=_xss-11] {
    margin-right: 91.66666667%
}
}
.GridLex-gap-center {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -30px;
    -ms-align-items: center;
    align-items: center;
    align-content: center;
}
.GridLex-gap-center > div > div > div {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    -ms-align-items: center;
    align-items: center;
    align-content: center;
}
.GridLex-gap-1 {
    margin-left: -1px;
    margin-right: 0;
    margin-bottom: -1px;
}
.GridLex-gap-1 > div > div > div {
    margin-left: 1px;
    margin-right: 0;
    margin-bottom: 1px;
}
.GridLex-gap-2 {
    margin-left: -1px;
    margin-right: -1px;
    margin-bottom: -2px;
}
.GridLex-gap-2 > div > div > div {
    margin-left: 1px;
    margin-right: 1px;
    margin-bottom: 2px;
}
.GridLex-gap-5 {
    margin-left: -5px;
    margin-right: -5px;
    margin-bottom: -10px;
}
.GridLex-gap-5 > div > div > div {
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 10px;
}
.GridLex-gap-10 {
    margin-left: -5px;
    margin-right: -5px;
    margin-bottom: -10px;
}
.GridLex-gap-10 > div > div > div {
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 10px;
}
.GridLex-gap-20 {
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: -20px;
}
.GridLex-gap-20 > div > div > div {
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
}
.GridLex-gap-30 {
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: -30px;
}
.GridLex-gap-30 > div > div > div {
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 30px;
}
.GridLex-gap-40 {
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: -40px;
}
.GridLex-gap-40 > div > div > div {
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 40px;
}
.GridLex-gap-50 {
    margin-left: -25px;
    margin-right: -25px;
    margin-bottom: -50px;
}
.GridLex-gap-50 > div > div > div {
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: 50px;
}
.GridLex-gap-10.no-mb, .GridLex-gap-20.no-mb, .GridLex-gap-30.no-mb {
    margin-bottom: 0;
}
.GridLex-gap-10.no-mb > div > div > div, .GridLex-gap-20.no-mb > div > div > div, .GridLex-gap-30.no-mb > div > div > div {
    margin-bottom: 0;
}
/************************
-----Team Documents------
************************/

.docs-box {
  border-radius: 0.6rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  display: block;
  margin-bottom: 20px;
  position: relative;
  width: 200px;
  height: 285px;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}
.docs-box:hover {
  transform: scale(1.02);
  cursor: inherit;
}

.docs-box > .inner {
  padding: 10px;
}

.docs-box-header {
  height: 210px;
  text-align: center;
  margin: -10px -10px 0 -10px;
  background: rgba(233, 236, 239,1);
  overflow: hidden;
}
.docs-thumbnail {
  position: relative;
  width: auto;
  max-height: 100%;
}
.docs-box-footer {
  overflow: hidden;
}

.docs-box > .docs-box-footer {
  background-color: rgba(0, 102, 255, 0.7);
  color: #fff;
  font-weight: 700;
  display: block;
  width:100%;
  padding: 3px 0;
  position: relative;
  text-align: center;
  text-decoration: none;
  border-bottom-left-radius: 0.6rem;
  border-bottom-right-radius: 0.6rem;
  z-index: 10;
}

.docs-box > .docs-box-footer:hover {
  background-color: rgba(0, 102, 255, 1);
  color: #fff;
}

.docs-box h3 {
  font-size: 2.2rem;
  font-weight: 700;
  margin: 0 0 10px;
  padding: 0;
  white-space: nowrap;
}

.inner.team-docs {
  margin-bottom: -25px;
}

.btn-team-doc {
    position: absolute;
    right: 7px;
    float: right;
}
.btn-team-doc-more {
    border: none;
    height: 32px;
    width: 32px;
    z-index:2;
    position: absolute;
    right: 7px;
    margin-top: 2px;
    padding: 0.1rem;
    float: right;
    color: var(--bs-body-color);
    border-radius: 50%;
}
.btn-team-doc-more:hover {
    background-color: rgba(0,0,0,0.08);
    /*border: 2px solid #D9D9D9;*/
}
.btn-team-doc-more:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.docs-box-pop {
  min-width: 120px;
  padding: 0.5rem;
  -webkit-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -o-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
}
.docs-box-pop .dropdown-item {
  border-radius: 0.5rem;
}
.docs-box-pop .dropdown-item:hover {
  cursor: pointer;
}

@media screen and (min-width: 992px) {
  .col-xl-2 .docs-box h3,
  .col-lg-2 .docs-box h3,
  .col-md-2 .docs-box h3 {
    font-size: 1.6rem;
  }
  .col-xl-3 .docs-box h3,
  .col-lg-3 .docs-box h3,
  .col-md-3 .docs-box h3 {
    font-size: 1.6rem;
  }
}

@media screen and (min-width: 1200px) {
  .col-xl-2 .docs-box h3,
  .col-lg-2 .docs-box h3,
  .col-md-2 .docs-box h3 {
    font-size: 2.2rem;
  }
  .col-xl-3 .docs-box h3,
  .col-lg-3 .docs-box h3,
  .col-md-3 .docs-box h3 {
    font-size: 2.2rem;
  }
}

.docs-box p {
  font-size: 1rem;
}

.docs-box p > small {
  color: #f8f9fa;
  display: block;
  font-size: .9rem;
  margin-top: 5px;
}

.docs-box h3,
.docs-box p {
  z-index: 5;
}

.docs-box .icon {
  color: inherit;
  z-index: 0;
}

.docs-box .icon > i {
  font-size: 100px;
  position: absolute;
  right: 55px;
  top: 55px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.docs-box .icon > i.fa, .docs-box .icon > i.fas, .docs-box .icon > i.far, .docs-box .icon > i.fab, .docs-box .icon > i.fal, .docs-box .icon > i.fad, .docs-box .icon > i.ion {
  font-size: 100px;
  /*top: 20px;*/
}

.docs-box .icon svg {
  font-size: 70px;
  /*position: absolute;*/
  right: 15px;
  top: 15px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.docs-box:hover {
  text-decoration: none;
}

.docs-box:hover .icon > i, .docs-box:hover .icon > i.fa, .docs-box:hover .icon > i.fas, .docs-box:hover .icon > i.far, .docs-box:hover .icon > i.fab, .docs-box:hover .icon > i.fal, .docs-box:hover .icon > i.fad, .docs-box:hover .icon > i.ion {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
    color: rgba(0, 102, 255, 0.9);
    transition: transform 0.1s linear;
}

.docs-box:hover .icon > svg {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

@media screen and (max-width: 767.98px) {
  .docs-box {
    text-align: center;
  }
  .docs-box .icon > i.ion {
    font-size: 60px;
    /* top: 20px; */
}
  .docs-box p {
    font-size: 12px;
  }
.edit-in-place-input {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    align-items: center;
    align-content: center;
    text-align: center;
    }
}
.edit-in-place-input {
    margin-top: 0;
    color: inherit;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    /*padding: 0.3rem;
    padding-top: 0;*/
    border-radius: 0.4rem;
    border: 1px solid transparent;
    width: 100%;
}
.edit-in-place-input.sm-text {
    color: inherit;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    font-size: 1rem !important;
    /*padding: 0.3rem;*/
    border: 1px solid transparent;
}
.edit-in-place-input::placeholder {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: var(--bs-placeholder-color);
    font-family: inherit;
}
.edit-in-place-input.sm-text::placeholder {
    font-size: 1rem !important;
    font-weight: 400 !important;
    color: var(--bs-placeholder-color);
    font-family: inherit;
}
.edit-in-place-input:focus::placeholder {
    color: var(--bs-placeholder-color);
}
.edit-in-place-input:focus {
    border: 1px solid #f1f1f1;
    background: #e9ecef;
}
.team-docs-title {
    color: inherit;
    font-weight: 700;
    padding: 0.5rem 0.1rem;
    line-height: 1.1 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    overflow-x: auto;
    height: 39px;
    width: 100%;
    white-space: nowrap;
    appearance: none;
    text-overflow: ellipsis;
    inset: none;
}
.team-docs-subtitle {
    font-weight: 400;
    color: inherit;
    padding: 0.1rem 0.1rem 0.5rem 0.1rem;
    line-height: 1.1 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    overflow-x: auto;
    height: 34px;
    width: 100%;
    white-space: nowrap;
    appearance: none;
    text-overflow: ellipsis;
    inset: none;
}
.docs-box-submit {
  background-color: rgba(0, 102, 255, 0.7);
  color: #fff;
  font-weight: 700;
  display: block;
  width:100%;
  padding: 3px 0;
  position: relative;
  text-align: center;
  text-decoration: none;
  /*border-top-left-radius: 0.6rem;
  border-top-right-radius: 0.6rem;*/
  z-index: 10;
  top: 151px;
}

.docs-box-submit:hover {
  background-color: rgba(0, 102, 255, 1);
  color: #fff;
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {

    .edit-in-place-input {
        display: block;
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 528px) and (max-width: 767px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (min-width: 428px) and (max-width: 527px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (min-width: 328px) and (max-width: 427px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (max-width: 327px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
#file-upload-form input[name='team-doc'] {
    width: 100%;
    height: 100%;
}
@media screen and (min-width: 1400px) {
  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.666667%;
  }
}

/**********************
---Company Directory---
**********************/
.media {
  margin-top: 15px;
}
.media:first-child {
  margin-top: 0;
}
.media,
.media-body {
  overflow: hidden;
  zoom: 1;
}
.media-body {
  width: 10000px;
  padding-bottom: 0.5rem;
}
.media-object {
  display: block;
}
.media-object.img-thumbnail {
  max-width: none;
}
.media-right,
.media > .pull-right {
  padding-left: 10px;
}
.media-left,
.media > .pull-left {
  padding-right: 10px;
}
.media-left,
.media-right,
.media-body {
  display: table-cell;
  vertical-align: middle;
}
.media-middle {
  vertical-align: middle;
}
.media-bottom {
  vertical-align: bottom;
}
.media-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.media-list {
  padding-left: 0;
  list-style: none;
    max-height: 500px;
    overflow-y: scroll;
    overflow-x: visible;
}
.company-directory-filters {
    display: inline;
}
.directory-search-filters {
    display: inline-block;
    width: 250px;
}
.container-user {
    background: #fff;
    margin-bottom: 20px;
    border-radius: 0.7em;
    border: none;
    padding: 30px 15px 30px 30px;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-sizing: border-box;
    position: relative;
    width: 100%;
    overflow: hidden;
}
.avatar-user {
    width: 100px;
    height: 100px;
    display: inline-block;
    margin-right: 15px;
}
.avatar-initials {
    background-color: rgba(0, 123, 255, 0.1);
    width: 40px;
    height: 40px;
    position: relative;
    align-items: center;
    display: flex;
    justify-content: center;
    line-height: inherit;
    letter-spacing: inherit;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
    color: rgba(0, 123, 255, 1);
    border-radius: 50%;
    top: -2px;
    cursor: pointer;
}
.avatar-initials:hover {
    background-color: var(--bs-gray-200);
    color: rgba(0, 123, 255, 0.7);
}
.avatar-initials-crm {
    background-color: rgba(207, 230, 255, 1);
    width: 36px;
    height: 36px;
    position: relative;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    line-height: inherit;
    letter-spacing: inherit;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
    color: rgba(0, 123, 255, 1);
    border-radius: 50%;
    padding: 0.5rem;
    white-space: nowrap;
    top: -11px;
    cursor: pointer;
    overflow: hidden;
}
.avatar-initials-crm:hover {
    background-color: var(--bs-gray-200);
    color: rgba(0, 123, 255, 0.7);
}
.avatar-sm {
    width: 36px !important;
    height: 36px !important;
    letter-spacing: -1px;
    font-size: 0.7rem;
}
.avatar-lg {
    width: 100px !important;
    height: 100px !important;
    letter-spacing: inherit;
    font-size: 1.5rem;
}
.member-avatar {
  display: flex;
  margin-left: 0.25rem;
  justify-content: center; 
  align-items: center; 
  vertical-align: middle;
}
.list-data-user li, .list-data-user li a {
    margin-bottom: 3px;
}
.wrap-loader {
  color: rgba(24,182,155,.9);
}
.text-green {
  color: rgba(24,182,155,.9) !important;
}
/******** Version 1.3 ***********/
/* MAX 767 */
@media screen and (max-width:767px) {
    .container-user .media-left {
        width: 100%;
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }
    .container-user .media-right {
        width: 100%;
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }
    .container-user .media-body {
        width: 100%;
        display: block;
        text-align: center;
    }
    .list-data-user {
        text-align: center;
    }
}
/**********************
 ---- Call History ----
 **********************/
.dnd-header {
    display: inline-block;
    margin-top: 26px;
    margin-bottom: 4px;
    margin-left: 24px;
    margin-right: -6px;
 }
 .history-header {
    display: inline-block;
    margin-bottom: 5px;
    margin-left: -6px;
    margin-right: -6px;
 }
 .call-history-filters{
    display: inline;
}
.user-select-filter{
    width: 170px !important;
    max-width: 170px !important;
    margin-right: 2px !important;
    margin-left: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}
/*.user-select-filter:focus {
    border: 0.11em solid #0676CE !important;
}*/
.start-date-filter{
    width: 170px !important;
    max-width: 170px !important;
    margin-right: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}
.start-date-filter:focus {
    border: 0.11em solid #0676CE !important;
}
.end-date-filter{
    width: 170px !important;
    max-width: 170px !important;
    margin-right: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}

.daterange-filter {
    width: 190px !important;
    max-width: 190px !important;
    margin-right: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}

.call-from-filter{
    width: 170px !important;
    max-width: 170px !important;
    margin-right: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}

.call-to-filter{
    width: 170px !important;
    max-width: 170px !important;
    margin-right: 2px !important;
    color: inherit;
    display: inline;
    background-color: #e9ecef !important;
    border: 0.11em solid #e9ecef !important;
    border-radius: 0.7em !important;
}

.text-message-filters {
    display: block !important;
    margin: 0px 15px !important;
    padding: 15px 0px 5px 0px !important;
}

.btn-compose-text {
    float: right;
    width: 150px;
    border-radius: 0.8em;
    margin-left: auto;
}
.search-messages-filter{
    width: 170px !important;
    max-width: 170px !important;
    color: inherit;
    display: inline-block !important;
    background-color: #e9ecef !important;
    border: 0.11em solid transparent !important;
    border-radius: 0.7em !important;
}
.text-message-table {
    position: relative;
    overflow: auto;
    margin: 0;
}
.text-message-td {
    max-width: 500px;
    margin-right: 10px !important;
    overflow-x: auto;
}
/***************************
------ Account Billing -----
***************************/
.payment-method {
    display: inline-block;
}
.payment-card {
    display: inline-block;
}
.btn-payment-card-delete {
    vertical-align: middle;
    color: rgba(88,101,112,0.7);
    background-color: transparent;
    border-radius: 50% !important;
    font-size: 28px !important;
    padding: 0rem 0.2rem;
    width: 30px;
    height: 30px;
    cursor: pointer;
}
.btn-payment-card-delete:hover {
    /*background-color: rgba(0, 0, 0, 0.04);*/
    color: rgba(255,0,0,0.7) !important;
}
.btn-payment-card-delete:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-default-payment {
    vertical-align: middle;
    color: rgba(88,101,112,0.7) !important;
    background-color: transparent;
    border-radius: 50% !important;
    font-size: 28px !important;
    padding: 0rem 0.2rem;
    width: 30px;
    height: 30px;
    cursor: pointer;
}
.btn-default-payment:hover {
    /*background-color: rgba(0, 0, 0, 0.04);*/
    color:rgba(24,182,155,.9) !important;
}
.btn-default-payment:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-default-payment-active {
    vertical-align: middle;
    color:rgba(24,182,155,.9) !important;
    background-color: transparent;
    border-radius: 50% !important;
    font-size: 28px !important;
    padding: 0rem 0.2rem;
    width: 30px;
    height: 30px;
    cursor: default;
}
.receipt-table {
    background: #fff;
    border: solid 1px #F1F1F1;
    border-radius: 10px;
    padding: 20px;
    font-size: 14px;
}
.receipt-table table {
    width: 100%;
}
.add-funds-table {
    width: 350px;
    margin-bottom: 20px;
    font-size: 1rem;
    
}
.add-funds-info {
    margin-left: 10px;
    font-size: 14px;
    color:#656B7A;
}
.total-bg-success {
    background: #1AB188 !important;
    color: #FFF !important;
}
.billing-text {
    font-size: 0.9rem !important;
}
/******************
-- Account Assets --
********************/
.user-assets-filename {
    padding: 0 0 1.1em 0 !important;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    white-space: nowrap !important;
    text-overflow: ellipsis;
    max-width: 95%;
}
/**************
--Automation--
***************/
select.hourselect, select.minuteselect, select.secondselect, select.ampmselect {
    background-repeat: no-repeat !important; 
    border-radius: 0.4rem;
}
.automation-bg {
    height: 100% !important;   
}
.date-container {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
}
.select-bot-mode label {
            font-size:10px;
            box-shadow: none;
            color:grey;
}
.select-bot-mode label.active {
           font-weight: bold;
           color:black;
}
.tui-full-calendar-floating-layer {
            bottom: 0px;
            top:auto !important;
}
.mode-select-title {
    position: relative;
    display: inline-flex;
}
.automation-event-date {
    position: relative;
    display: inline-block;
    min-width: 200px;
    padding-top: 14px;
}
.automation-event-job-percent {
    position: relative;
    display: inline-block;
}
.automation-event-destination {
    position: relative;
    display: inline-block;
    min-width: 200px;
    padding-top: 14px;
}
.progress-percent-chart-text {
    font-weight: 700;
    text-align: center;
}
.modal-section-title {
    font-size: 16px;
    font-weight: 700;
}
.btn-event {
    display: inline-flex;
    max-height: 40px;
    /*font-weight: 700;*/
}
.btn-event-icon {
    display: inline-flex;
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 3px;
}
/*.btn-create {
    border-radius: 0.6rem !important;
    font-size: 14px;
    font-weight: 400;
    padding: 3px 15px 3px;
    letter-spacing: 1px;
    height: 35px;
}*/
.progress-text {
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 0 !important;
}
.progress-percent {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0 !important;
}
.auto-progress-header {
    display: inline-block;
}
.auto-progress-switch {
    display: inline-block;
    float: right;
    /*font-size: 24px;*/
}
.automation-header-row {
    display: table;
}
.automation-header {
    display: table-cell;
}
.automation-header-title {
    font-weight: 700;
    color: inherit;
    text-align: left;
}
.select-mode-wrapper {
    width: 100%;
    margin-bottom: 20px;
}
.date-label {
    position: relative;
    display: inline-flex;
    margin-left:5px;
}
.start-date-wrapper {
    position: relative;
    display: inline-grid;
    width: 100% !important;
}
.end-date-wrapper {
    position: relative;
    display: inline-grid;
    width: 100% !important;
}
.select-audio-wrapper {
    margin: 20px 0 !important;
    display: flex;
}
.select-sms-data {
    margin: 5px 0 !important;
    display: flex;
}
.select-speed-wrapper {
    margin: 20px 0 !important;
}
.test-output-wrapper {
    margin: 0 0 20px 0;
}
.sms-message-wrapper {
    margin: 0 0 20px 0;
}
.test-number-wrapper {
    display: flex;
}
.multiple-number-input {
    width: 100%;
}
.tui-datepicker {
    left: 0;
    z-index: 999;
    border-color: #F0F0F0 !important;
    border-radius: 0.6rem !important;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 10%);
    -moz-appearance: 0 5px 15px 2px rgb(0 0 0 / 10%);
    -o-appearance: 0 5px 15px 2px rgb(0 0 0 / 10%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 10%);
}
.tui-datepicker:before {
    border-box: none !important;
}
.tui-datepicker:after {
    border-box: none !important;
}
.tui-calendar .tui-calendar-header {
    position: relative;
    border-bottom: 1px solid #efefef;
    border-top-left-radius: 0.6rem !important;
    border-top-right-radius: 0.6rem !important;
}
.tui-calendar .tui-calendar-header-inner {
    padding: 17px 50px 15px;
    height: 50px;
    border-radius: 0.7em !important;
}
.tui-timepicker .tui-timepicker-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: auto;
    border-radius: 0.6em !important;
}
.tui-full-calendar-week-container {
    width: 100%;
    height: inherit;
    display: inline-block;
    font-size: 10px;
    min-height: 600px;
    background: white;
    border-radius: 0.7em;
}
.tui-full-calendar-dayname-container {
    overflow-y: scroll;
    border-top: none !important;
    border-bottom: 1px solid rgb(229, 229, 229);
    height: 45px !important;
    background-color: inherit;
    text-align: left;
}
.tui-datepicker-footer .tui-timepicker {
    border-top: 1px solid #eee;
    border-bottom-left-radius: 0.6rem !important;
    border-bottom-right-radius: 0.6rem !important;
}
.tui-datepicker-input.tui-has-focus {
    color: #1E1E1E;
    background: #fff;
    border-color: rgba(225,225,225,0.8) !important;
    border-radius: 0.6rem !important;
    /*padding: 0.8rem 0 0.8rem 0;*/
    height: 40px;
    width: auto;
    margin: 5px;
    font-size: 15px;
    font-family: "Nunito";
    font-weight: 400;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
}
.tui-datepicker-input > input {
    width: 100%;
    height: 100%;
    padding: 12px 10px 12px 10px;
    font-size: 16px;
    line-height: 40px;
    vertical-align: top;
    border: 0;
    color: #333;
}
.flex-wrapper {
  display: flex;
  flex-flow: row nowrap;
}

.single-chart {
  width: 40%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    justify-content: space-around;
}

.circular-chart {
  display: block;
  margin: 10px auto;
  max-width: 80%;
  max-height: 350px;
  overflow: visible;
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 6.8;
}

.circle {
  fill: none;
  stroke-width: 4.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}

.circular-chart.orange .circle {
  stroke: rgba(252,157,3,0.7);
}

.circular-chart.green .circle {
  stroke: #4CC790;
}

.circular-chart.blue .circle {
  stroke: rgba(13,109,253,1);
}

.circular-chart.red .circle {
  stroke: rgba(252,3,3,0.6);
}

.percentage {
  fill: #67748e;
  font-family: "Nunito";
  font-size: 0.5em;
    font-weight: 700;
  text-anchor: middle;
}

.status-info {
  background-color: rgba(233,243,252,0.8);
    border-radius: 0.7rem;
    padding: 20px;
    margin-top: -20px;
    margin-bottom: 20px;
    color: inherit;
    display: inline-flex;
    width: 100%;
    height: auto;
    line-height: 1.25;
}
.blue-icon-color {
  color:rgba(34,139,230,1);
}

.status-info-text {
  margin-left: 20px;
  margin-bottom: 0;
}
.callback-actions-wrapper {
    width: 100%;
    display: inline-flex;
}
.callback-text {
  font-size: 12ppx;
  margin-bottom: 0;
}
.audio-file-canvas {
    font-size: 0.9rem;
    height:150px;
    padding: 0.3rem;
    border: solid 1px #ebebeb; 
    border-radius: 0.6rem; 
    width: 100%; 
    margin-bottom: 15px;
    overflow-y: auto;
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
}
.audio-greeting-canvas {
    font-size: 0.9rem;
    height:74px;
    padding: 0.3rem;
    border: solid 1px #ebebeb; 
    border-radius: 0.6rem; 
    width: 100%; 
    margin-bottom: 0px;
    overflow-y: auto;
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
}
.audio-play-icon {
    color: rgba(88,101,112,0.7);
    background-color: transparent;
    border-radius: 0rem;
    padding: 0.1rem;
    height: 25px;
    width: 25px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}
.audio-play-icon:hover {
    color: rgba(0,123,255,0.7);
    background-color: rgba(0,0,0,0.1);
    border-radius: 50%;
}
.audio-delete-icon {
    margin-right:1px;
    color: rgba(88,101,112,0.7);
    background-color: transparent;
    border-radius: 0rem;
    padding: 0.35rem;
    height: 35px;
    width: 35px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}
.audio-delete-icon:hover {
    color: rgba(255,0,0,0.7);
    background-color: rgba(0,0,0,0.1);
    border-radius: 50%;
}

@media screen and (max-width: 1099px) {
    .automation-event-job-percent {
        margin-top: 15px;
    }
    .select-audio-wrapper {
        display:block;
    }
}
@media screen and (max-width: 576px) {
    .callback-actions-wrapper {
        display: block;
    }
}
/***********************
 * Sidebar
 **********************/

.sidebar-inner {
}
.sidebar-module + .sidebar-module, .sidebar-module + .clear {
    margin-top: 50px;
}
.sidebar-module + .clear:last-child {
    margin-top: 0;
}
.sidebar-box {
    padding: 40px 0 0;
}
.sidebar-title {
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1;
    margin-bottom: 25px;
}
.sidebar-header {
    clear: both;
}
.sidebar-header h3 {
    float: left;
}
.sidebar-reset-filter {
    float: right;
}
ul.sidebar-category, ul.sidebar-archives {
    margin-bottom: -10px;
}
ul.sidebar-category li a, ul.sidebar-archives li a {
    color: #868686;
    line-height: 1.2;
    margin-bottom: 10px;
    display: block;
    position: relative;
    padding-left: 15px;
}
ul.sidebar-category li a:before, ul.sidebar-archives li a:before {
    content: "";
    width: 6px;
    height: 6px;
    border: 1px solid #002391;
    border-radius: 50%;
    display: block;
    position: absolute;
    left: 0;
    top: 4px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}
ul.sidebar-category li a:hover, ul.sidebar-archives li a:hover {
    color: #002391;
}
ul.sidebar-category li a:hover::before, ul.sidebar-archives li a:hover::before {
    background: #002391;
}
ul.sidebar-post li {
    border-bottom: 1px solid #EFEFEF;
    padding-bottom: 15px;
    margin-bottom: 15px;
}
ul.sidebar-post li h3 {
    font-size: 15px;
    line-height: 22px;
    margin: -3px 0 5px;
    letter-spacing: 0.7px;
    font-weight: 600;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}
ul.sidebar-post li .image {
    width: 80px;
    float: left;
}
ul.sidebar-post li .image img {
    display: block;
}
ul.sidebar-post li .content {
    margin-left: 95px;
}
ul.sidebar-post li .sidebar-post-meta {
    margin: 0;
    color: #A1A1A1;
    font-size: 12px;
    letter-spacing: 1.5px;
    font-style: italic;
}
ul.sidebar-post li a:hover h3 {
    color: #002391;
}
ul.sidebar-post.no-image li .content {
    margin-left: 0;
}
.tag-cloud span {
    display: block;
    float: left;
    line-height: 1;
    padding: 5px 7px;
    padding-left: 0;
    margin-left: 0;
    margin-bottom: 5px
}
.tag-cloud a {
    border: 1px solid #EFEFEF;
    line-height: 1;
    font-size: 12px;
    padding: 5px;
    margin-left: 3px;
    margin-bottom: 5px;
    display: block;
    float: left;
    color: #777;
}
.tag-cloud a:hover {
    background: #002391;
    color: #FFF;
    border-color: #002391;
}
.tag-cloud-wrapper {
    border-top: 1px solid #EFEFEF;
    position: relative;
    margin: 20px 0 0;
    padding: 20px 0 0;
}
.tag-cloud-wrapper .tag-cloud-heading {
    float: left;
}
.tag-cloud-wrapper .tag-cloud {
    margin-left: 50px;
    margin-top: 5px;
}
.sidebar-text-widget ul {
    margin: 0;
    margin-left: 25px;
    padding: 0;
}
.sidebar-text-widget ul li {
    list-style: circle;
}
ul.sidebar-menu {
    margin-bottom: 20px;
    padding-top: 5px;
    padding-bottom: 0;
    padding-left: 0;
    /*border: 1px solid #D6D6D6;*/
    background-color: none;
    font-weight: 500;
    font-size: 20px;
}
.scrollspy-sidebar .nav > li {
    margin-top: -2px;
}
ul.sidebar-menu li > a {
    display: block;
    color: inherit;
    padding: 14px 20px;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    line-height: 1;
    background: none;
    border-radius: 0.7rem;
    /*border-right: 1px solid #D6D6D6;
    border-left: 1px solid #F2F2F2;
    border-bottom: 1px solid #D6D6D6;*/
    margin-right: -1px;
    margin-left: -1px;
    margin-bottom: 1px;
    font-size: 16px;
    font-weight: 600;
    white-space: nowrap;
}
ul.sidebar-menu > li > h4 {
    text-transform: uppercase;
    line-height: 1;
    /*border-bottom: 1px solid #E8E8E8;*/
    margin: 0;
    margin-left: -1px;
    padding: 14px 20px;
}
ul.sidebar-menu > li > a:hover {
    background: #fff;
    color: #0676CE;
    /*border-right: 2px solid #002391;
    border-bottom: 1px solid #002391;*/
}
ul.sidebar-menu > li > a:focus {
    background: none;
    /*color: blue;
    /*border-color: #EEE;
    border-bottom: 1px solid #E8E8E8;*/
}
ul.sidebar-menu .active > a, ul.sidebar-menu .active:hover > a, ul.sidebar-menu > .active:focus > a {
    font-weight: 600;
    color: #0676CE;
    background: #fff;
    /*border-right: 1px solid #002391;
    border-bottom: 1px solid #E8E8E8;*/
}
ul.sidebar-menu > li:last-child > a {
    border-bottom: 0;
}
ul.sidebar-menu > li > ul {
    border-bottom: 1px solid #E8E8E8;
    margin-top: 15px;
    padding-bottom: 15px;
}
ul.sidebar-menu > li > ul > li > a {
    border: 0;
    padding: 0;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 25px;
    font-size: 90%;
    border-bottom: 0 !important;
}

@media only screen and (max-width: 767px) {
.sidebar {
    margin-bottom: 30px
}
}
/*****************************
------ Authentication --------
*****************************/
.logo-center {
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    align-content: center;
}
.forgot-password {
    display: inline-block;
    margin-bottom: 0px !important;
    float: right;
    vertical-align: bottom;
}
/************************
 * Contact Us
 ************************/

.contact-form-wrapper .help-block {
    line-height: 1.2;
    font-size: 12px;
}
.contact-form-container {
    display: webkit-box;
    display: webkit-flex;
    display: ms-flexbox;
    display: flex;
    width: 100%;
    height: auto;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}
.contact-text-featured-item h5 {
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}
.contact-text-featured-item .content p {
    font-weight: 300;
}
.contact-social a {
    margin-right: 5px;
}
.social-links {
  color: inherit;
}
.social-links:hover {
  color: var(--bs-link-color);
}
/************************
 * Footer
 ************************/
.footer-main {
    float: left;
    width: 100%;
    background-color: #FFF;
    padding: 30px 0;
    border-top: 1px solid #F0F0F0;
}
.subfooter {
    background-color: #FFF;
    color: inherit;
    float: left;
    width: 100%;
}
.subfooter-text {
    font-size: 14px !important;
}
.footer-slogan {
    font-size: 14px;
    color: inherit;
}
.ico-social {
    font-size: 24px;
    color: inherit;
    margin-right:10px;
}
/************************
 ---- Support Panel ----
 ************************/
.featured-icon .icon {
    font-size: 70px;
    line-height: 1;
    margin: 0 0 10px;
    -ms-align-items: center;
    align-items: center;
    color: #002392;
}
.featured-icon h5 {
    letter-spacing: 1px;
    font-weight: 700;
    line-height: 1.2;
    color: #181818;
}
.featured-icon p {
    color: #484848;
    font-size: 16px;
}
.featured-icon a {
    color: #fff;
}
.featured-icon a:hover {
    color: #0272E9;
}

/*************************
 ---- Pricing ----
 *************************/
.pricing-table {
    background: #fff;
    /*border: solid 1px #F1F1F1;*/
    border-radius: 10px;
    padding: 20px;
    font-size: 14px;
    overflow-x: auto;
    -webkit-box-shadow: 0 20px 27px 0 rgba(0,0,0,.05);
    -moz-box-shadow: 0 20px 27px 0 rgba(0,0,0,.05);
    -ms-box-shadow: 0 20px 27px 0 rgba(0,0,0,.05);
    -o-box-shadow: 0 20px 27px 0 rgba(0,0,0,.05);
    box-shadow: 0 20px 27px 0 rgba(0,0,0,.05);
}
.pricing-table table {
    width: 100%;
}
.features-table {
    border-radius: 10px;
    padding: 0;
    font-size: 14px;
/*    overflow-x: auto;*/
}
.features-table table {
    width: 100%;
    text-align: left ;
    position: relative ;
    border-collapse: collapse ; 
}
.features-table table tr th {
    height: 70px;
    font-size: 1.5rem;
    color: var(--bs-heading-color);
    background: var(--bs-gray-200);
    border-bottom: 1px solid var(--bs-gray-200);
    border-top: 1px solid var(--bs-gray-200);
    border-radius: 0;
}
.features-table table tr th {
  border-top: none !important;
}
.features-table table tr td {
  padding: 0.75rem;
  text-align: center;
  border-radius: 0;
}
.features-table table tr td:first-child {
    text-align: left !important;
    padding-left: 1.65rem;
}
/*.features-table table thead {
    box-shadow: 0 20px 27px 0 rgb(0 0 0 / 20%);
}
*/
.features-table table th {
  position: sticky !important;
  top: 0; /* Don't forget this, required for the stickiness */
/*  box-shadow: 0 20px 27px 0 rgb(0, 0, 0, 0.4);*/
}
.price-card-wrapper {
  flex: 0 0 auto;
  width: 400px !important;
}
.price-card {
  border-bottom: 3px solid transparent;
}
.border-bottom-dark {
  border-color: var(--bs-heading-color);
}
.border-bottom-info {
  border-color: rgba(33, 81, 255,0.8);
}
.fs-price {
  font-size: calc(3rem + 2.5vh) !important;
  font-weight: 700 !important;
}
.pricing-item {
  margin-left: 1rem !important;
  padding: 0.25rem 0.5rem !important;
}
.price-font-h1 {
  font-size: calc(1.725rem + 2.1vw) !important;
  text-align: center !important;
}
.price-font-h2 {
  font-size: calc(1.425rem + 2.1vw) !important;
  text-align: center !important;
}
.features-wrapper {
  padding-left: 2rem;
  padding-right: 2rem;
}
.btn-features {
  border-radius: 0.6rem;
}
.btn-features .icon-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    vertical-align: middle;
    -webkit-transition: transform 0.3s ease-in-out;
    -moz-transition: transform 0.3s ease-in-out;
    -ms-transition: transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
}
.btn-feautures .icon-rotate-180::after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media (min-width: 992px) {
  .price-card-wrapper {
    width: 470px !important;
  }
  .pricing-item {
  margin-left: 3rem !important;
  }
}
@media (min-width: 1200px) {
  .price-card-wrapper {
    width: 350px !important;
  }
  .pricing-item {
  margin-left: 0rem !important;
  }
}
@media (min-width: 1400px) {
  .price-card-wrapper {
    width: 400px !important;
  }
  .pricing-item {
  margin-left: 1rem !important;
  }
}
@media (max-width: 767px) {
  .features-table {
    overflow-x: auto;
  }
}
@media (max-width: 440px) {
  .pricing-item {
    margin-left: 0rem !important;
  }
}
/*********************************
 ---- Marketing | Real Estate ----
 *********************************/
.competitive-table {
    border-radius: 10px;
    padding: 0;
    font-size: 14px;
/*    overflow-x: auto;*/
}
.competitive-table table {
    width: 100%;
    text-align: left ;
    position: relative ;
    border-collapse: collapse ; 
/*    overflow-x: auto;*/
}
.competitive-table thead,
.competitive-table thead tr,
.competitive-table thead:hover,
.competitive-table thead tr:hover {
    background: transparent !important;
    background-color: transparent !important;
}
.competitive-table table tr th,
.competitive-table table tr th:hover {
    height: 70px;
    font-size: 1.5rem;
    color: var(--bs-heading-color);
    background: transparent !important;
    border-bottom: transparent !important;
    border-top: transparent !important;
    border-radius: 0;
}
.competitive-table table tr td {
  padding: 0.75rem;
  text-align: center;
}
.competitive-table table tr td:first-child {
    text-align: left !important;
    padding-left: 1.65rem;
}
.competitive-table tbody tr td:first-child {
    font-size: 16px;
    font-weight: 600;
}
.competitive-table tbody tr,
.competitive-table tbody tr {
    border-radius: 1rem;
}
.competitive-table tbody tr:hover {
  background-color: var(--bs-gray-200) !important;
}
.competitive-table tr:nth-child(even) {
    background-color: var(--bs-gray-200);
}
.competitive-table tr:nth-child(odd),
.competitive-table tr:hover
 {
    background-color: transparent !important;
}
/*.features-table table thead {
    box-shadow: 0 20px 27px 0 rgb(0 0 0 / 20%);
}
*/
.competitive-table table th {
  position: -webkit-sticky;
  position: sticky !important;
  top: 0; /* Don't forget this, required for the stickiness */
/*  box-shadow: 0 20px 27px 0 rgb(0, 0, 0, 0.4);*/
}
.competitor-box {
  background: white;
  border-radius: 0.75rem;
  text-align: center;
  padding: 1rem;
  margin-left: 1rem;
  margin-right: 1rem;
  -webkit-box-shadow: 0 5px 20px rgb(20 20 20 / 15%) !important;
  -moz-box-shadow: 0 5px 20px rgb(20 20 20 / 15%) !important;
  -ms-box-shadow: 0 5px 20px rgb(20 20 20 / 15%) !important;
  -o-box-shadow: 0 5px 20px rgb(20 20 20 / 15%) !important;
  box-shadow: 0 5px 20px rgb(20 20 20 / 15%) !important;
}
@media (max-width: 767px) {
  .competitive-table {
    overflow-x: auto;
  }
}
/*************************
 ------ Deal Board ------
 *************************/
.md-18 {
    font-size: 18px !important;
 }
.md-24 {
    font-size: 24px !important;
 }
 .md-32 {
    font-size: 32px !important;
 }
 .md-36 {
    font-size: 36px !important;
 }
 .md-48 {
    font-size: 48px !important;
 }
 .crm-canvas {
    position: relative;
    display: block;
    top: 0;
    bottom: 0;
    padding-top: 73px;
    padding-bottom: 50px;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    overflow: hidden;
    min-height: 100vh;
    max-height: 100vh;
 }
 .form-control-modal {
    border-radius: 0.6rem;
    border: 0.10rem solid transparent;
    background: #FFF;
    color: #1E1E1E;
    border-color: transparent;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    padding:6px 5px;
    font-size: 14px;
    font-weight: 300;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 6%) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    -o-appearance: none !important;
    -webkit-inset: none;
    -moz-inset: none;
    -o-inset: none;
    inset: none;
}
.form-control-modal:focus {
    border: 0.10rem solid rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
 .form-control-modal::placeholder {
    color: var(--bs-placeholder-color);
 }
.btn-cs-view {
    display: inline-flex; 
    color: inherit;
    background-color: transparent;
    border-radius: 50% !important;
    padding: 0.5rem 0.5rem;
    /*width: 20px;
    height: 20px;*/
}
.btn-cs-view:hover {
    background-color: rgba(0, 0, 0, 0.04);
    color: rgba(0, 123, 255, 0.7);
}
.btn-cs-view:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-cs-phone {
    color: inherit;
    background-color: transparent;
    border-radius: 50% !important;
    padding: 0.01rem 0.1rem;
    /*width: 20px;
    height: 20px;*/
}
.btn-cs-phone:hover {
    /*background-color: rgba(0, 0, 0, 0.04);*/
    color: rgba(0, 123, 255, 0.7);
}
.btn-cs-phone:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-cs-flag {
    background-color: transparent;
    border-radius: 50% !important;
    padding: 0.05rem 0.3rem;
    cursor: pointer;
    /*width: 20px;
    height: 20px;*/
}
.btn-cs-flag:hover {
    /*background-color: rgba(0, 0, 0, 0.04);
    color: rgba(0, 123, 255, 0.7);*/
}
.btn-cs-flag:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-cs-comments {
    display: inline-flex;
    line-height: 1.2;
    color: inherit;
    background-color: transparent;
    border-radius: 0.6rem !important;
    padding: 0.5rem;
}
.btn-cs-comments:hover {
    background-color: rgba(0, 0, 0, 0.04);
    color: rgba(0, 123, 255, 0.7);
}
.g-icon-launch {
    vertical-align: middle;
}
.g-icon-chat {
    vertical-align: middle;
    padding-left: 4px; 
    padding-right: 4px;
}
.modal-actions-column {
    height: auto;
    /*max-height: 153px;*/
    min-width: 100%;
    /*width: 153px;
    /*overflow-y: auto;
    overflow-x:hidden;*/
}
.textarea-comments {
    height: 3em !important;
    padding: 0.7em !important; 
}
.textarea-comments:focus {
    height: 6em !important; 
}
.textarea-comments::placeholder {
    color: var(--bs-placeholder-color);
}
.tagged-user {
  color: var(--bs-heading-color);
  font-weight: 700;
}
.property-action {
    min-width: 52px;
    vertical-align: middle;
}
.prospects-table {
    position: inherit;
    overflow: auto;
    margin: 0;
}
.properties-table {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border: none;
    white-space: normal;
}
.properties-table tbody {
    width: 100% !important;
}
.dataTables_empty {
    align-content: center;
    align-items: center;
    text-align: center;
}
.dataTables_processing {
    text-align: center !important;
    border: 0;
}
.modal-wrapper {
    background: none;
}
thead {
    background-color: #e9ecef !important;
}
tr:hover {
    background-color: #f2f5f7 !important;
}
tr th:first-child {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
tr th:last-child {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
tr td:first-child {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
tr td:last-child {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
/*table.table>tbody>tr.child:hover {
    background:#f5f5f5 !important
}*/
.properties-header {
    background-color: #FFF;
    height: 40px;
    /*border-bottom: 1px solid #AFAFAF;*/
}
.properties-rows {
    background-color: #FFF;
}

.lead-rows {
    background-color: #FFF;
}

.properties-rows:hover {
    background-color: #F5F5F5;
}

.lead-rows:hover {
    background-color: #F5F5F5;
}


.properties-summary {
    background-color: #FFFFFF;
    font-weight: 700;
    /*border-top: 1px solid #AFAFAF;*/
}
#results tr.properties-header,  #results tr.properties-rows {
        font-size:10px;
        white-space: nowrap;
    }
.search-owner-results-l {
    padding:0.5em;
    border-radius: 0.5em 0 0 0.5em;
}
.search-owner-results-r {
    padding:0.5em;
    border-radius: 0 0.5em 0.5em 0;
}
.modal-content {
  border: none;
}
.modal-content.model-content-leads {
  overflow: visible;
}
.modal-header.leads-modal-header {
    padding: 25px;
    margin: auto;
    /*width: 100%;*/
    /* background-image: linear-gradient(to bottom, #3656BA 0%, #00BEFF 100%) !important; */
    /*background: #fff !important;
    min-height: 1.42857143px;*/
    border-radius: 1rem 1rem 0 0;
    /*border-bottom: 1px solid rgba(0,0,0,0.1);*/
    overflow: hidden;
}
/*.leads-modal-title {
    margin: 0 0 0 100px;
    line-height: 1.42857143;
    font-weight: 700;
    text-align: center;
}*/
.dropdown-menu.leads-datepicker {
/*    width: 500px;*/
/*    width: auto;*/
}
.due-date-column {
  cursor: auto;
}
/*.leads-datepicker .due-date-column {
    width: 500px;
}*/
.leads-datepicker .due-date-column .daterangepicker {
  box-shadow: none !important;
  overflow: hidden;
}
.datepicker-subfooter {
  padding: 0.5rem;
  overflow: auto;
  height: 280px;
}
.due-date-column .daterangepicker .drp-buttons {
    display: block;
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 1rem;
}
.due-date-column .daterangepicker .drp-buttons .drp-selected {
  display: none;
}
.due-date-column .daterangepicker .drp-buttons .btn {
  padding: 5px 10px;
  border-radius: 0.4rem;
}
.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {
    color: #fff;
    border: solid var(--bs-body-color);
    border-width: 0 2px 2px 0;
    border-radius: 0;
    display: inline-block;
    padding: 3px;
}
.dropdown .dropdown-menu.leads-datepicker.show:before {
  left: 220px;
}
.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
    width: 50px;
    margin: 0 auto;
    background: var(--bs-gray-200);
    border: 1px solid var(--bs-gray-200);
    padding: 2px;
    outline: 0;
    font-size: 12px;
    color: inherit;
    border-radius: 0.3rem;
}
select.leads-timeselect {
    width: 50px;
/*    margin: 0 2px;*/
    background: var(--bs-gray-200);
    border: 1px solid var(--bs-gray-200);
    padding: 0.1rem 0.2rem !important;
    height: 28px;
    outline: 0;
    font-size: 14px;
    color: inherit;
    border-radius: 0.3rem;
}
.datepickerinputs {
  padding: 0.1rem 0.4rem;
    width: auto;
    margin-right: 5px;
    font-size: 14px;
  color: inherit;
  border-radius: 0.3rem !important;
  background: var(--bs-gray-200) !important;
  border: 1px solid var(--bs-gray-200) !important;
}
@media (max-width: 991.98px) {
  :not(.navbar) .dropdown .dropdown-menu {
    transform: none !important;
  }
  .dropdown .dropdown-menu.leads-datepicker.show:before {
    left: 230px;
  }
  .dropdown-menu.leads-datepicker {
    width: 100%;
    max-width: 500px;
  }
}
.tribute-input.comments {
  border-radius: 0.6rem;
  padding: 0.5rem 0.7rem;
  margin-bottom: 0 !important;
  border: 1px solid transparent;
}
.tribute-input:focus {
    padding: 0.45rem 0.66rem;
    border: 0.10rem solid rgba(37,196,242,0.3) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    background-color: #ffffff !important;
}

.leads-modal-title {
    line-height: 1.42857143;
    font-weight: 700;
    margin-bottom: 0;
}
.leads-email {
    margin-bottom:0.25rem;
    width:100%;
    /*max-width:146px;*/
}
.leads-phone {
    margin-bottom:0.25rem;
    min-width:100%;
    width:100%;
    /*max-width:146px;*/
}
.due-dates {
  display: inline-flex;
  border-radius: 0.5rem;
  font-size: 0.9rem;
  font-weight: 500;
  padding: 0.4rem 0.6rem;
  margin-bottom: 10px;
  background-color: rgba(218, 225, 235, 1);
}
.btn-add-member {
  background: transparent;
    border-radius: 2rem;
    padding: 0.35rem;
    position: relative;
    color: inherit;
    top: -10px;
    cursor: pointer;
    background-color: rgba(218, 225, 235, 0.7);
}
.btn-add-member:hover {
  color: rgba(0, 123, 255, 0.7);
  background-color: rgba(218, 225, 235, 1);
}
.btn-add-member-icon {
  position: relative;
  top:6px;
  left:-1px;
}
.btn-checked-items {
  position: relative;
  top: 2px;
  margin-left: 0rem;
  outline: 0;
  color: inherit;
  border-radius: 2rem;
  height: 23px;
  width: 23px;
}
.btn-checked-items:focus {
  -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-checked-items-icon {
  border-radius: 2rem;
  background-color: transparent;
  padding: 0.25rem;
  position: relative;
  top: -2px;
  left: -7px;
}
.btn-checked-items-icon:hover {
  color: rgba(0, 123, 255, 0.7);
  background-color: rgba(218, 225, 235, 1);
}
.btn-leads-expand {
    margin-left: -0.2rem;
    outline: 0;
    color: inherit;
}
.btn-leads-expand-icon {
  border-radius: 2rem;
  background-color: transparent;
}
.btn-leads-expand-icon:hover {
  color: rgba(0, 123, 255, 0.7);
  background-color: rgba(218, 225, 235, 1);
}
.btn-leads-expand.collapsed .icon-rotate-180 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    border-radius: 25px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: transform 0.3s ease-in-out;
    -moz-transition: transform 0.3s ease-in-out;
    -ms-transition: transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
}
.btn-leads-expand:focus .icon-rotate-180 {
    border-radius: 25px;
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.g-icon-edit-comments {
    margin: 0 0 0 0.4em;
    opacity: 1.0;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
}
.g-icon-edit-comments:hover {
    color: rgba(0, 123, 255, 0.7);
}
.g-icon-delete-comments {
    margin: 0 0 0 0.2em;
    opacity: 1.0;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
}
.g-icon-delete-comments:hover {
    color: rgba(255, 0, 0, 0.7);
}
.g-icon-delete-property {
    margin: -0.5em 0 0 0.2em;
    opacity: 1.0;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
}
.g-icon-delete-property:hover {
    opacity: 0.7;
    color: red;
}
.g-icon-owner-file-delete {
    vertical-align: middle;
    position: relative;
    color: inherit;
    margin-left: 0.1em;
    max-width: 1em;
    overflow: hidden;
    cursor: pointer;
}
.g-icon-owner-file-delete:hover {
    color: red !important;
}
.g-icon-offer-letter {
    display: inline-flex !important;
    margin: 0.2em 0.3em 0.3em 0;
    position: relative;
}
.g-icon-esign {
    display: inline-flex !important;
    margin: 0.2em 0.3em 0.3em 0;
    position: relative;
}
select.select-year {
    display: inline;
    margin-bottom:5px;
    padding: 0rem 0.5rem;
    max-width:80px;
    height: 30px;
    border-radius: 0.5rem !important;
    vertical-align: middle;
    line-height: 1.3;
    font-size: 12px;
    color: inherit;
    background-color: rgba(255,255,255,1) !important;
    background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%) !important;
    background-repeat:no-repeat;
    border: 1px solid rgb(229,231,235,1) !important;
    webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
}
.select-year:hover {
    color: rgba(0, 123, 255, 0.7);
    background: rgba(255,255,255,0.5);
    background-repeat:no-repeat;
    webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-offer-pref {
    display: inline;
    font-size: 0.7em;
    margin-bottom:5px;
    padding: 0.1rem 0.25rem;
    max-width: 30px;
    height: 30px;
    border-radius: 0.5rem !important;
    vertical-align: middle;
    line-height: 1.3;
    color: inherit;
    background-color: rgba(255,255,255,1);
    background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
    background-repeat:no-repeat;
    border: 1px solid rgb(229,231,235,1) !important;
    webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.btn-offer-pref:hover {
    color: rgba(0, 123, 255, 0.7);
    background: rgba(255,255,255,0.5);
    background-repeat:no-repeat;
    webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-offer {
    display: inline;
    font-size: 0.7em;
    margin-bottom:5px;
    padding: 0.1rem 0.7rem;
    max-width:150px;
    height: 30px;
    border-radius: 0.5rem !important;
    vertical-align: middle;
    line-height: 1.3;
    color: inherit;
    background-color: rgba(255,255,255,1);
    background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
    background-repeat:no-repeat;
    border: 1px solid rgb(229,231,235,1) !important;
    webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.btn-offer:hover {
    color: rgba(0, 123, 255, 0.7);
    background: rgba(255,255,255,0.5);
    background-repeat:no-repeat;
    webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.owner-attachments {
    border-radius: 6px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    /*font-size: 14px;*/
    letter-spacing: 1.5px;
    max-width: 100% !important;
    font-weight: 700;
    /*padding: 9px 25px 9px;*/
    margin-bottom: 0.1em;
    line-height: 1.42857143;
    height: 2.75em;
    font-family: 'Nunito';
    text-decoration: none;
    overflow: hidden;
    box-shadow: none !important;
}
.attachment-list-item {
    list-style: none;
    margin-left: -1em;
    white-space: nowrap;
}
.owner-file-download-icon {
    margin-right:0.3em;
}
.owner-attachment-filename {
    padding: 0 1rem 1rem 0 !important;
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
.leads-modal-city {
    padding-right:4px !important;
}
.leads-modal-state {
    padding-right:4px !important;
}
.leads-modal-county {
    padding-right: 4px !important;
}
.leads-modal-country {
    padding-right: 4px !important;
}
/*.leads-modal-zip {
    padding-left:4px !important;
}*/
.contact-columns {
  display: flex;
  column-gap: 4px;
}
.contact-container {
    height: auto;
    max-height: 400px;
    width: auto;
    max-width: 100%;
    overflow-y: auto;
    overflow-x:hidden;
}
.checklist-container {
    height: auto;
    width: auto;
    max-width: 100%;
    overflow-y: auto;
    overflow-x:hidden;
}
.description-wrapper {
    /*min-height: 224px;*/
    /*max-height: 400px;*/
    width: auto;
    max-width: 100%;
    /*margin-top: -15px;*/
    padding: 2px;
    /*overflow-y: auto;
    overflow-x:hidden;*/
}
.name-address-column {
    padding: 2px;
    max-height: 400px;
    overflow-y: auto;
    overflow-x:hidden;
}
.phone-column-wrapper {
    padding: 2px;
    max-height:400px;
    width:100%;
    min-width:100%;
    overflow-y:auto;
}
.phone-column {
    -webkit-column-count:2;
    -moz-column-count:2;
    -ms-column-count:2;
    -o-column-count:2;
    column-count:2;
    -webkit-column-gap:4px;
    -moz-column-gap:4px;
    -ms-column-gap:4px;
    -o-column-gap:4px;
    column-gap:4px;
    column-fill: auto;
}
.email-column-wrapper {
    padding: 2px;
    max-height:400px;
    width:100%;
    min-width:100%;
    /*max-width:300px;*/
    overflow-y:auto;
}
.email-column {
    -webkit-column-count:2;
    -moz-column-count:2;
    -ms-column-count:2;
    -o-column-count:2;
    column-count:2;
    -webkit-column-gap:4px;
    -moz-column-gap:4px;
    -ms-column-gap:4px;
    -o-column-gap:4px;
    column-gap:4px;
    column-fill: auto;
}
.add-lead-name-address-wrapper {
    height: auto;
    max-height:350px;
    width:100%;
    min-width:100%;
    /*max-width:300px;*/
    overflow-y:auto;
}
.add-lead-name-address-column {
    -webkit-column-count:2;
    -moz-column-count:2;
    -ms-column-count:2;
    -o-column-count:2;
    column-count:2;
    -webkit-column-gap:4px;
    -moz-column-gap:4px;
    -ms-column-gap:4px;
    -o-column-gap:4px;
    column-gap:4px;
    column-fill: auto;
    padding: 2px;
}
.col-block-one {
    padding-right:0px !important;
    margin-left: auto;
    margin-right: auto;
}
.col-block-two {
    padding-left:0px !important;
    padding-right: 1px !important;
    margin-left: auto;
    margin-right: auto;
}
.col-block-three {
    padding-left:0px !important;
    margin-right:auto;
    margin-left:auto;
}
.btn-add-p-e {
    float: right;
    position: relative;
    display: block;
    padding: 0.05rem 0.05rem;
    margin-right: 5px;
    margin-top: -35px;
    line-height: 0.5;
    height: 25px;
    width: 25px;
    color: inherit;
    cursor: pointer;
}
.btn-add-p-e:hover {
    color: rgba(0, 123, 255, 0.7);
    background: rgba(0,0,0,0.1);
    border-radius:50%;
    webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.contact-info-footer {
    padding: 15px;
    text-align: right;
}
.btn-highlight {
    padding: 0.4rem 0.8rem;
    vertical-align: middle;
    border-radius: 0.6rem;
    display: inline-block;
    background: white;
    border: 2px solid #F5F5F5;
    color: inherit;
    transition: all .15s ease-in;
}
.btn-highlight:hover {
    background: transparent;
    border: 2px solid #3693FF;
    color: #3693FF !important;
}
.btn-toggle.btn-refine {
    font-family: "Ionicons";
    content: "\f2d7";
    position: relative;
    display: inline-block;
    padding: 0.1em;
    font-size: 20px;
    background-color: transparent;
    width: 40px;
    height: 40px;
    border-radius: 25px;
    color: inherit;
}
.btn-toggle.btn-refine:after {
    font-size: 20px;
    content: "\f2d7";
}
.btn-toggle.btn-refine:hover {
    background-color: #d7ddde;
    color: inherit;
}
.btn-toggle.btn-refine:focus {
     outline: 0;
      -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
      opacity: 1;
}
.btn-toggle.btn-refine.collapsed:after {
    content: '\f4a6';
    font-size: 20px;
}
.btn-leads-modal-actions {
  vertical-align: middle;
  line-height: 1.3;
  height: 36px;
  max-height: 36px;
  width:100%;
  color: inherit;
  /*color: rgba(88, 101, 112, 0.7);*/
  padding: 0.3rem;
  margin-bottom: 0.2rem;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(229,231,235,1);
  border-radius: 0.6rem;
  -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
}
.btn-leads-modal-actions:hover {
  color: rgba(0, 123, 255, 0.7) !important;
  background: rgba(255,255,255,0.5);
  -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
    transform: none !important;
}
a.btn-leads-modal-actions:hover {
  color: rgba(0, 123, 255, 0.7) !important;
  font-color: rgba(0, 123, 255, 0.7) !important;
}
.btn-labels-refine {
  vertical-align: middle;
  line-height: 1.3;
  height: 40px;
  max-height: 40px;
  width:100%;
  color: inherit;
  font-size: 14px;
  font-weight: 400;
  text-transform: capitalize;
  text-align: left;
  /*color: rgba(88, 101, 112, 0.7);*/
  padding: 0.6rem;
  margin-bottom: 0.2rem;
  background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
  border: 1px solid rgb(210,214,215,1) !important;
  border-radius: 0.6rem;
  -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%) !important;
}
.btn-labels-refine:hover {
  
  /*background: rgba(255,255,255,0.5);
  -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;*/
    transform: none !important;
}

.dropdown .zeb-dropdown-toggle.dropdown-toggle:after,
  .dropup .zeb-dropdown-toggle.dropdown-toggle:after {
    background-repeat: no-repeat !important;
    background-position: 99.5% 50% !important;
    background-image: url(/img/svg/expand_more_gray_24dp.svg) !important;
    height: 25px !important;
    width: 25px !important;
    right: 8px !important;
    position: absolute;
    margin-top: -3px !important;
    content: "" !important;
  }
@media screen and (max-width: 991px) {
    .dropdown .zeb-dropdown-toggle.dropdown-toggle:after,
  .dropup .zeb-dropdown-toggle.dropdown-toggle:after {
    background-repeat: no-repeat !important;
    background-position: 99.5% 50% !important;
    background-image: url(/img/svg/expand_more_gray_24dp.svg) !important;
    height: 25px !important;
    width: 25px !important;
    right: 8px !important;
    position: absolute !important;
    margin-top: -3px !important;
    content: "" !important;
  }
  .dropdown-toggle::after {
    /* display: inline-block; */
    /* margin-left: 0.255em; */
    /* vertical-align: 0.255em; */
    /* content: ""; */
     border-top: none !important; 
     border-right: none !important; 
     border-bottom: none !important; 
     border-left: none !important; 
}
}
.modal-xlg {
    max-width: 1400px !important;
    margin: 30px auto !important;
}
.media-body-comments {
    padding: 15px 20px;
    background: #FFF;
    border-radius: 3px;
    box-shadow: 1px 2px rgba(0, 0, 0, 0.07);
    -webkit-box-shadow: 1px 2px rgba(0, 0, 0, 0.07);
}
.media-body-comments:before {
    content: "";
    position: absolute;
    left: 42px;
    top: 17px;
    width: 0px;
    height: 0px;
    border: 10px solid transparent;
    border-right: 10px solid #ffffff;
    border-right-color: #fff;
}
.comments-wrapper {
    padding: 1em 4em;
}
.comments-body {
    background: #FFF;
    border-radius: 0.5em;
    margin-top:0.5em;
    margin-bottom: 0.2rem;
    padding: 1.2em;
    font-size: 0.9rem;
}
.comments-body:focus-within {
  margin-left: 0.1rem;
  margin-right: 0.1rem;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
[contenteditable="true"]:active,
[contenteditable="true"]:focus {
  border: none;
  outline:none;
}
.comments-p {
    line-height: 17px;
    font-size: 14px;
    color: #525252;
    margin: 0;
}
.comments-p a {
    color: #F40808;
}
.editable-input {
    width: 100% !important;
}
.editable-clear-x {
  display: none !important;
}
.nav-link-dealboard {
    margin-top: 4px;
    margin-right: 3px;
    -webkit-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    -o-box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    box-shadow: 0 5px 15px 2px rgb(0 0 0 / 5%);
    background: #fff !important;
    border: 0.1em solid transparent !important;
    border-radius: 0.7em !important;
    max-height: 45px !important;
    min-width: 150px !important;
    padding: 0.2rem 1rem !important;
    overflow: hidden;
    color: #333;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
.nav-link-dealboard:hover {
    background: #F0F0F0 !important;
    color: #0676CE !important;
}
.nav-link-dealboard.active {
    color: #FFF !important;
    background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
    border: none !important;
    /*background-image: linear-gradient(to bottom, #3656BA 0%, #001A6C 100%) !important;
    border: 0.1em solid #0676CE !important;*/
}
.nav-link-dealboard-text {
    vertical-align: middle !important;
    display: inline-flex;
    font-size: 14px;
    padding: 6px;
}
@media screen and (max-width: 991px) {
    .nav-link-dealboard-text p {
        font-size: 12px;
    }
}
@media screen and (max-width: 767px) {
    .nav-link-dealboard-text p {
        font-size:14px;
    }
}
.dropdown.dropdown-hover .dropdown-menu.dropdown-menu-labels,
  .dropdown .dropdown-menu.dropdown-menu-labels {
/*    display: block;*/
    opacity: 0;
    top: 0;
    transform-origin: 50% 0;
    pointer-events: none;
    transform: none !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform, box-shadow;
  }
.dropdown.dropdown-hover:hover>.dropdown-menu.dropdown-menu-labels,
.dropdown .dropdown-menu.dropdown-menu-labels.show {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transform: none !important;
}
.dropdown.dropdown-hover:hover>.dropdown-menu.dropdown-menu-labels:before,
  .dropdown .dropdown-menu.dropdown-menu-labels.show:before {
    top: -20px;
  }

/*.dropdown.dropdown-hover:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -24px;
  width: 100%;
  height: 100%;
}*/

.dropdown:not(.dropdown-hover) .dropdown-menu.dropdown-menu-labels {
    margin-top: 45px !important;
}
.leads-carousel {
    /*margin-left: -17px;
    margin-right: -17px;
    margin-top: -78px;*/
    margin: -25px;
    margin-bottom: -25px !important;
}
.leads-carousel-inner {
    /*border-top-right-radius: 0.75rem !important;
    border-top-left-radius: 0.75rem !important;*/
    min-width: 100% !important;
    max-height: 700px !important;
}
.btn-close {
    border: 2px solid transparent;
    z-index:2;
    background: transparent !important;
}
.btn-close:hover {
    background-color: rgba(197, 215, 230, 0.7) !important;
    border-radius: 50%;
    /*border: 2px solid #D9D9D9;*/
}
.btn-close:focus {
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.btn-modal-close {
    /*margin-right: 10px !important;
    margin-top: 5px !important;*/
    position: absolute;
    top: 12px;
    right: 14px;
    padding: 0.5rem !important;
    z-index: 3;
    border-radius: 50%;
    background: transparent;
}
.btn-modal-close:hover {
    background: #dee2e6;
    color: #69748e;
}
.close-icon {
    color: var(--bs-heading-color) !important;
    margin: -4px;
}

@media  (min-width: 1099px) {
    .leads-city-state-zip-row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    /*margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));*/
}
}
@media screen and (max-width: 1099px) {
    .leads-modal-city {
        padding-right: 0px !important;
    }
    .leads-modal-zip {
        padding: 0px !important;
    }
    .modal-actions-column {
        padding-right:15px;
    }

}
@media screen and (max-width: 991px) {
    .modal-actions-column {
        padding-right:0px;
    }

}
@media screen and (max-width: 767px) {
    .col-block-one {
      padding-right: 12px !important;
    }
    .col-block-two {
      padding-left: 4px;
    }
    .name-address-column {
        width: 100%;
    }
    .phone-column-wrapper {
        padding-left: 15px;
        min-width:100%;
    }
    .phone-column  {
        column-width: 0px;
    }
    .leads-modal-title {
    margin: 0 0 0 50px;
    }
    .lead-modal-city {
        margin-left:auto;
        margin-right:auto;
    }
    .leads-modal-state {
        margin-left:auto;
        margin-right:auto;
    }
    .leads-modal-zip {
        margin-left:auto;
        margin-right:auto;
    }
}
@media screen and (max-width: 576px) {
  .col-block-one {
      padding-right: 12px !important;
    }
    .col-block-two {
      padding-left:10px !important;
      padding-right:10px !important;
    }
    .col-block-three {
      padding-left:10px !important;
      padding-right:10px !important;
    }
    .leads-modal-title {
    margin: 0 0 0 25px;
    }
    .phone-column-wrapper {
        padding: 2px 4px;
    }
    .email-column-wrapper {
        padding: 2px 4px;
    }
    .modal-actions-column {
        margin-top:5px;
    }
    .add-lead-name-address-column {
    -webkit-column-count:1;
    -moz-column-count:1;
    -ms-column-count:1;
    -o-column-count:1;
    column-count:1;
    -webkit-column-gap:4px;
    -moz-column-gap:4px;
    -ms-column-gap:4px;
    -o-column-gap:4px;
    column-gap:4px;
    column-fill: auto;
    padding: 2px;
}
}
@media screen and (max-width: 376px) {
    .leads-modal-title {
    margin: 0;
    text-align:left;
    }
}
/*************************
 ------ Pagination ------
 *************************/
.pagination {
  display: -ms-flexbox;
  display: flex;
  padding-left: 0;
  list-style: none;
  border-radius: 0.5rem !important;
}
.page-link {
  position: relative;
  display: block;
  padding: 0.4rem 0.8rem !important;
  margin-left: 5px;
  line-height: 1.25;
  color: #697a8d;
  background-color: rgba(0,0,0,0.05);
  border: none;
  border-radius: 0.5rem !important;
}

.page-link:hover {
  z-index: 2;
  color: rgba(37,196,242,1);
  text-decoration: none;
  background-color: rgba(0,0,0,0.09);
}

.page-link:focus {
  z-index: 2;
  outline: 0;
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.page-item .page-link,
.page-item span {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0 2px !important;
  min-width: 36px;
  width: auto;
  height: 36px;
  font-size: 0.875rem;
}
.pagination-sm .page-item .page-link, .pagination-sm .page-item span {
  min-width: 30px;
  width: auto !important;
}
.page-item .page-link {
    border-radius: 0.5rem !important;
}
.page-item:first-child .page-link {
  margin-left: 5px;
  border-radius: 0.5rem !important;
}

.page-item:not(:first-child) .page-link {
    margin-left: 4px;
}

.page-item:last-child .page-link {
  border-radius: 0.5rem !important;
}

.page-item.active .page-link {
  z-index: 1;
  color: #fff;
  background-color: rgba(37,196,242,0.6);
  box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.2);
  border-radius: 0.5rem !important;
}
.page-item.active .page-link:hover {
  background-color: rgba(37,196,242,0.9) !important;
  box-shadow: 0 0 0.125rem 0.125rem rgba(37,196,242,0.5) !important;
}

.page-item.disabled .page-link {
  color: inherit;
  pointer-events: none;
  cursor: auto;
  background-color: #fff;
  border-radius: 0.5rem !important;
}
.page-item.disabled {
  background-color: transparent !important;
}
.page-link.next {
  padding: 0.75rem 1.5rem;
}

.pagination-lg .page-link {
  padding: 0.75rem 1.5rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0.5rem !important;
}

.pagination-lg .page-item:first-child .page-link {
  border-radius: 0.5rem !important;
}

.pagination-lg .page-item:last-child .page-link {
  border-radius: 0.5rem !important;
}

.pagination-sm .page-link {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.5rem !important;
}

.pagination-sm .page-item:first-child .page-link {
  border-radius: 0.5rem !important;
}

.pagination-sm .page-item:last-child .page-link {
  border-radius: 0.5rem !important;
}
/*********************
    Phone Widget
*********************/
.offcanvas.offcanvas-end.phone-widget {
  width: 350px;
  border-left: 1px solid transparent;
}
.nav-wrapper.phone-widget {
  border-radius: 0.7rem;
}
.nav-wrapper.phone-widget .nav.nav-pills {
  background: var(--bs-gray-200);
}
.nav-wrapper.phone-widget .nav.nav-pills .nav-item .nav-link.active {
  color: rgba(0, 123, 255, 0.7);
}
.multi-select {
    width: 100% !important;
    height: 90px !important;
    border-radius: 0.6rem;
    background-color: #e9ecef !important;
    border: 1px solid rgba(103, 116, 142, 0.2);
    background: no-repeat;
    font-size: 0.7rem;
    color: inherit;
    appearance: none;
}
.multi-select option {
  border-radius: 0.4rem;
    padding: 0.2rem;
    margin: 0.2rem;
}
.multi-select option:checked,
.multi-select option:focus,
.multi-select option:active {
  background: #fff !important;
  color: var(--bs-heading-color);
  box-shadow: 0 1px 1px 1px hsl(0deg 0% 8% / 5%), 0 4px 5px -5px hsl(0deg 0% 8% / 6%);
}
/*select:focus.multi-select {
  background: #fff !important;
  color: var(--bs-heading-color);
  box-shadow: 0 1px 1px 1px hsl(0deg 0% 8% / 5%), 0 4px 5px -5px hsl(0deg 0% 8% / 6%);
}*/
.dialpad-container {
    display:absolute;
    position:relative;
    margin-top: 10px;
}
.dialpad-row {
    display: inline-flex;
    margin-left: -5px;
    margin-right: -5px;
}
.dialpad-btn {
    margin: 0.3rem;
    border-radius: 0.6rem !important;
    width: 95px;
    height: 40px;
    font-size: 18px !important;
    padding: 6px;
}
.btn-dialer {
  margin-right: 2px;
  --bs-btn-padding-y: 0.4rem;
  --bs-btn-padding-x: 0.5rem !important;
  --bs-btn-font-size: 0.65rem;
  --bs-btn-border-radius: 0.5rem;
  border: 1px solid var(--bs-gray-300) !important;
}
.btn-dialer:hover {
  color: rgba(0, 123, 255, 0.7) !important;
}
.form-control.phone-widget {
  border: 1px solid transparent;
  background: var(--bs-gray-200);
  background-color: var(--bs-gray-200) !important;
}
.inbound-number-pulse {
  background-color: transparent;
  color: #67748e;
  font-weight: 600;
  animation-name: pulsingNumber;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}
.inbound-call-pulse {
  border-radius: 2rem;
  background-color: transparent;
  animation-name: pulsingCall;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

@keyframes pulsingCall {
  0% {
    background-color: transparent;
  }
  50% {
    background-color: rgba(33, 213, 253,0.35);
  }
  100% {
    background-color: transparent;
  }
}
@keyframes pulsingNumber {
  0% {
    color: #67748e;
  }
  50% {
    color: rgba(0, 123, 255, 0.8);
  }
  100% {
    color: #67748e;
  }
}
/*********************
    Twilio Block
*********************/

.stickyFooter {
     position: fixed;
     bottom: 0px;
     width: 100%;
     max-width: 210px;
     overflow: auto;
     z-index: 99;
     padding-top: 1px;
     padding-bottom: 3px;
     background: var(--bs-gray-500);
     border-top: solid var(--bs-heading-color) 2px;
     border-left: solid var(--bs-heading-color) 2px;
     border-right: solid var(--bs-heading-color) 2px;
     /*background: radial-gradient( #379ADB 0%, #3C7DD1 40%, #001A6C 100%) !important;*/
     border-radius: 0.9em;
     -webkit-box-shadow: 0px 10px 25px 20px rgb(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 10px 25px 20px rgb(0, 0, 0, 0.1);
     -ms-box-shadow: 0px 10px 25px 20px rgb(0, 0, 0, 0.1);
     -o-box-shadow: 0px 10px 25px 20px rgb(0, 0, 0, 0.1);
     box-shadow: 0px 10px 25px 20px rgb(0, 0, 0, 0.1);
     height: auto;
     max-height: 400px;
}
/*label {
  text-align: left;
  font-family: Helvetica, sans-serif;
  font-size: 1.25em;
  color: #777776;
  display: block;
}*/
.invalid{
  color:red;
}
.valid{
  color:rgba(24,182,155,0.9);
}
.dnd {
  color: rgba(251, 207, 51,1);
}
div#controls {
  padding: 0.25em;
  /*max-width: 1200px;*/
  margin: 0 auto;
}

  div#controls div {
    float: left;
  }

    div#controls div#call-controls,
    div#controls div#info{
      width: 150px;
      margin: 1rem 1.25rem 0.5rem 1.25rem;
      text-align: center;
    }
    div#controls div#auto-settings{
      width: 400px;
      margin: 1em 0.5em;
      text-align: center;
    }
      div#controls div#info div#output-selection {
        display: block;
          width: 100%;
      }

      div#controls div#info a {
        font-size: 1.1em;
        color: khaki;
        text-decoration: underline;
        cursor: pointer;
      }

      div#controls div#info select {
        width: 160px;
        height: 60px;
        margin-bottom: 0.2em;
      }
        div#controls div#auto-settings select {
        width: auto;
        height: auto;
        margin-bottom: 0.2em;
      }
        div#controls div#auto-settings span {
        display: inline-block;
      }

      div#controls div#info label {
        width: 200px;
      }

      div#controls div#call-controls div#volume-indicators {
        display: none;
        padding: 5px;
        margin-top: 20px;
        width: 200px;
        text-align: left;
      }

        div#controls div#call-controls div#volume-indicators > div {
          display: block;
          height: 10px;
          width: 0;
        }

  div#controls p.instructions {
    text-align: left;
    font-family: "Nunito";
    font-style: oblique;
    font-size: 1.1em;
    margin-bottom: 0.5rem;
    color: white;
  }
  input#phone-number{
    background-color:white;
  }

  div#controls div#info #client-name {
    text-align: left;
    margin-bottom: 1em;
    font-family: "Nunito";
    font-size: 1.1em;
    color: #777776;
  }

  div#controls button {
    width: 3em;
    height: 2.5em;
    border-radius: 0.6rem;
    font-family: "Nunito";
    font-size: 1em;
    font-weight: 300;
    padding: 5px;
  }

    div#controls button:active {
      position: relative;
      top: 1px;
    }

  div#controls div#call-controls {
    display: none;
  }

    div#controls div#call-controls input {
        font-family: "Nunito";
        font-style: oblique;
        font-size: 0.8em;
        width: 150px;
        height: 2rem;
        padding: 0.4em;
        border: 2px solid #E6E6E6;
        border-radius: 0.6rem;
        display: block;
    }

    div#controls div#call-controls button {
      color: #fff;
      font-family: "Nunito";
      font-size: 1em;
      font-weight: 300;
      padding: 5px;
      margin-top:5px;
    }

      div#controls div#call-controls button#button-hangup {
        display: none;
      }

  div#controls div#log {
    border: 1px solid #686865;
    width: 35%;
    height: 9.5em;
    margin-top: 0.75em;
    text-align: left;
    padding: 1.5em;
    float: right;
    overflow-y: scroll;
  }

    div#controls div#log p {
      color: #686865;
      font-family: "Nunito";
      font-size: 1.25em;
      line-height: 1.25em;
      margin-left: 1em;
      text-indent: -1.25em;
      width: 90%;
    }
.phone-btns-container {
    display:absolute;
    position:relative;
    margin-top: 10px;
    width: 150px;
    height: 200px;
}
.phone-btns-row {
    display: inline-flex;
}
.phone-btn {
    margin: 0.3rem;
    border-radius: 4rem !important;
    width: 40px;
    height: 40px;
    font-size: 18px !important;
    padding: 6px;
}
.mic-settings-select {
    width: 100% !important;
    height: 90px !important;
    border-radius: 0.6rem;
    background-color: #f5f5f5 !important;
    background:no-repeat;
    font-size: 0.7rem;
    color: inherit;
}
.speaker-settings-select {
    width: 100% !important;
    height: 90px !important;
    max-width:350px;
    border-radius:0.6rem;
    background-color: #f5f5f5 !important;
    background:no-repeat;
    font-size: 0.7rem;
    color: inherit;
}
.volume-mic-indicators {
    display: inline-flex;
    height: 20px;
    width: 100%;
    margin-top: 10px;
}
.mic-indicator {
    width: 50%;
}
.volume-indicator {
    width: 50%;
}
.volume-icon {
    color: #fff;
}
.mic-icon {
    color: #fff;
}

@media screen and (max-width: 1099px) {

}

@media screen and (max-width: 768px) {

}

@media screen and (max-width: 584px) {

}

@media screen and (max-width: 479px) {
    .stickyFooter {
         width: 100%;
         max-width: 370px;
         height: auto;
         max-height: 400px;
    }
    div#controls button {
        width: 5em;
    }
    div#controls div#call-controls, div#controls div#info {
        width: 150px;
        margin: 0.8rem 0.5rem 0.5rem 1rem;
        text-align: center;
    }
}

@media screen and (max-width: 389px) {
    .stickyFooter {
         width: 100%;
         max-width: 210px;
         height: auto;
         max-height: 400px;
    }
    div#controls button {
        width: 3em;
    }
}
/******************************
 * Priority Label
 *****************************
 */
.priority-label-wrap {
  border-radius: 0.6rem;
  max-width: 100%;
  max-height: 100%;
  padding: 5px;
  overflow: hidden;
}
.priority-label-red {
    background-color: rgba(255,0,0,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #F8494A;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-orange {
    background-color: rgba(255,165,0,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #FCB54B;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-green {
    background-color: rgba(0,160,115,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #00A011;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-neon_green {
    background-color: rgba(0,255,40,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #00A40E;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-yellow {
    background-color: rgba(255,255,0,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #969900;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-pink {
    background-color: rgba(255,66,250,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #F780E2;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-purple {
    background-color: rgba(106,90,205,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #8A2A83;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-black {
    background-color: rgba(0,0,0,0.5);
    border-radius: 0.7em;
    color:#FFF;
    /*border: solid 1px #3D3D3D;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-grey {
    background-color: rgba(120,120,120,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #BDBDBD;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-blue {
    background-color: rgba(0,0,255,0.7);
    color:#FFF;
    border-radius: 0.7em;
    /*border: solid 1px #2356F8;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-light_blue {
    background-color: rgba(0,190,255,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #004E7B;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-turquoise {
    background-color: rgba(0,255,255,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #004E7B;*/
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    overflow: hidden;
}
.priority-label-none {
    /*border-radius: 0.7em;
    /*width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-red {
    background-color: rgba(255,0,0,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #F8494A;
    max-width: 50px;
    max-height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-orange {
    background-color: rgba(255,165,0,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #FCB54B;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-green {
    background-color: rgba(0,160,115,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #00A011;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-neon_green {
    background-color: rgba(0,255,40,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #00A40E;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-yellow {
    background-color: rgba(255,255,0,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #969900;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-pink {
    background-color: rgba(255,66,250,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #F780E2;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-purple {
    background-color: rgba(106,90,205,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #8A2A83;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-black {
    background-color: rgba(0,0,0,0.5);
    border-radius: 0.7em;
    color:#FFF;
    /*border: solid 1px #3D3D3D;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-grey {
    background-color: rgba(120,120,120,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #BDBDBD;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-blue {
    background-color: rgba(0,0,255,0.7);
    color:#FFF;
    border-radius: 0.7em;
    /*border: solid 1px #2356F8;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-light_blue {
    background-color: rgba(0,190,255,0.5);
    border-radius: 0.7em;
    /*border: solid 1px #004E7B;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-turquoise {
    background-color: rgba(0,255,255,0.7);
    border-radius: 0.7em;
    /*border: solid 1px #004E7B;
    width: 50px;
    height: 50px;*/
    overflow: hidden;
}
select option.select-priority-label-none {
    border-radius: 0.7em;
    /*width: 50px;
    height: 50px;*/
    overflow: hidden;
}
.bg-priority-light_green {
  background-color: rgba(183, 221, 176, 1);
}
.bg-priority-green {
  background-color: rgba(123, 200, 108, 1);
}
.bg-priority-dark_green {
  background-color: rgba(91, 172, 68, 1);
}
.bg-priority-light_lime {
  background-color: rgba(179, 241, 208, 1);
}
.bg-priority-lime {
  background-color: rgba(109, 236, 169, 1);
}
.bg-priority-dark_lime {
  background-color: rgba(78, 213, 132, 1);
}
.bg-priority-light_teal {
  background-color: rgba(143, 223, 235, 1);
}
.bg-priority-teal {
  background-color: rgba(41, 204, 229, 1);
}
.bg-priority-dark_teal {
  background-color: rgba(0, 173, 204, 1);
}
.bg-priority-light_blue {
  background-color: rgba(139, 188, 217, 1);
}
.bg-priority-blue {
  background-color: rgba(91, 164, 207, 1);
}
.bg-priority-dark_blue {
  background-color: rgba(2, 106, 167, 1);
}
.bg-priority-light_pink {
  background-color: rgba(249, 194, 228, 1);
}
.bg-priority-pink {
  background-color: rgba(255, 142, 212, 1);
}
.bg-priority-dark_pink {
  background-color: rgba(229, 104, 175, 1);
}
.bg-priority-light_purple {
  background-color: rgba(223, 192, 235, 1);
}
.bg-priority-purple {
  background-color: rgba(206, 141, 229, 1);
}
.bg-priority-dark_purple {
  background-color: rgba(168, 108, 193, 1);
}
.bg-priority-light_red {
  background-color: rgba(239, 179, 171, 1);
}
.bg-priority-red {
  background-color: rgba(239, 117, 100, 1);
}
.bg-priority-dark_ed {
  background-color: rgba(207, 80, 61, 1);
}
.bg-priority-light_orange {
  background-color: rgba(250, 209, 156, 1);
}
.bg-priority-orange {
  background-color: rgba(255, 175, 63, 1);
}
.bg-priority-dark_orange {
  background-color: rgba(231, 146, 23, 1);
}
.bg-priority-light_yellow {
  background-color: rgba(245, 233, 146, 1);
}
.bg-priority-yellow {
  background-color: rgba(245, 221, 41, 1);
}
.bg-priority-dark_yellow {
  background-color: rgba(230, 197, 13, 1);
}
.bg-priority-light_gray {
  background-color: rgba(80, 95, 121, 1);
}
.bg-priority-gray {
  background-color: rgba(52, 69, 99, 1);
}
.bg-priority-dark_gray {
  background-color: rgba(9, 30, 66, 1);
}

.fs-7 {
  font-size: 0.875rem !important;
}

.fs-8 {
  font-size: 0.75rem !important;
}

/***********************
--------- Blog ---------
***********************/
 .blog-logo {
    width: 280px;
    padding: 3px;
    /*margin-top: 10%;*/
    margin-bottom: auto;
    margin-right: auto;
    margin-left: auto;
    z-index:99;
}
.blog-logo:hover {
    opacity: 0.8;
}
.img-height-fixed {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.max-read-text {
  font-weight: 600;
  font-size: 13px;
}
.author-text {
  font-weight: 600;
}
.card.card-background:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
  display: block;
  content: "";
  background: rgba(0, 0, 0, 0) !important;
  border-radius: 1rem;
}
.card.card-background .full-background {
  background-position: 50%;
  background-size: cover;
  margin-bottom: 30px;
  width: 100%;
  height: 100% !important;
  position: absolute;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card.card-background .half-background {
  background-position: 50%;
  background-size: cover;
  margin-bottom: 30px;
  width: 100%;
  height: 60% !important;
  position: absolute;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card.card-article {
  /*width: 300px;
  height: 400px !important;*/
  position: relative;
  border-radius: 1rem !important;
}
.card-article-header {
  height: 300px;
  overflow: hidden;
  position: relative;
  width: 100%;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card-article-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 300px;
    min-height: 300px;
    max-height: 300px;
    overflow: hidden;
    width: auto;
}
.card-article-body {
  position: relative;
  height: 250px;
  border-top-left-radius: 0rem !important;
  border-top-right-radius: 0rem !important;
  border-bottom-left-radius: 1rem !important;
  border-bottom-right-radius: 1rem !important;
}
.card-article-footer {
  bottom: 10px;
  position: absolute;
  width: 100%;
}
/*******************
 ----- Payroll -----
 *******************/
.invoice-bg {
    position: relative;
    border-radius: 0.7rem;
    background: #fff;
    margin: 20px 0;
    width: 100%;
    box-shadow: 0 1px 1px rgb(0 0 0 / 10%);
    padding: 20px;
}
.create-invoice {
    float:right;
    margin-bottom:10px;
}
.create-invoice-btn {
    padding: 0.5em 1em !important;
    border-radius: 0.7em !important;
}
.invoice-table {
    border-radius: 0.7em;
    background: #FFF;
    font-size: 14px;
}
.invoice-table-head {
    border-radius: 0.7em;
}
.invoice-table-head-tr {
    border-radius: 0.7em;
}
.billing-dates {
    display: inline-flex;
    margin-bottom:10px;
}
.billing-start-date {
    margin-right:10px;
    width: 200px;
}
.billing-start-end {
    width: 200px;
}
.invoice-save-submit-btns {
    text-align: right;
}
.btn-invoice {
    padding: 0.5em 1.2em !important;
    border-radius: 0.7em !important;
    font-weight: 700 !important;
}
/***********************
------Esignature--------
***********************/
/*.esign-field {
  padding: 0.5rem 1rem;
  margin: 1rem;
  line-height: 2;
  font-size: 1.2rem;
}*/
.resize-drag {
  min-width: 100px;
  border-radius: 0.2rem;
  background-color: rgb(23,235,192,0.3) !important;
  border: 2px solid rgb(23,235,192,1) !important;
  color: var(--bs-heading-color) !important;
  touch-action: none;
  box-sizing: border-box;
}
.resize-drag-text {
  border-radius: 0.2rem;
  background-color: rgb(23,235,192,0.3) !important;
  border: 2px solid rgb(23,235,192,1) !important;
  color: var(--bs-heading-color) !important;
  touch-action: none;
  box-sizing: border-box;
}
.btn-field-cancel {
  color: var(--bs-heading-color);
  background: transparent;
  border-radius: 25%;
  float: right;
  padding: 1px;
  line-height:0.7;
}
.btn-field-cancel:hover,
.btn-field-cancel:focus,
.btn-field-cancel:active {
  background: rgba(255, 0, 0, 0.7);
  color: #ffffff;
}
.footer.bg-dark {
  background: rgba(0,0,0,0.6) !important;
  box-shadow: inset 0 1px rgba(255,255,255,0.3);
  bottom:0;
}
.btn-add-signatory {
    height: 40px;
    width: 40px;
    padding: 0.4rem;
    border-radius: 0.6rem;
    border: 0.07rem solid #d2d6da !important;
}
/***********************
---Products Dropdown----
***********************/
.w-200px {
  width: 200px !important;
}
/***********************
-----Sweet Alerts------
***********************/
.swal2-styled.swal2-confirm {
    border: 0;
    border-radius: 0.5em !important;
    background: initial;
    background-color: rgba(24,182,155,0.9) !important;
    background-image: linear-gradient(310deg,#18b69c,#07edc7) !important;
    color: #fff;
    font-size: 1em;
}
.swal2-styled.swal2-confirm:hover,
.swal2-styled.swal2-confirm:focus {
    background-color: rgba(24,182,155,0.9) !important;
    background-image: linear-gradient(310deg,#07edc7,#18b69c) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.swal2-styled.swal2-deny {
    border: 0;
    border-radius: 0.5em !important;
    background: initial;
    background-color: rgba(251, 208, 51,0.9) !important;
    background-image: linear-gradient(310deg,#fbd033,#fcf800) !important;
    color: #fff;
    font-size: 1em;
}
.swal2-styled.swal2-deny:hover,
.swal2-styled.swal2-deny:focus {
    background-color: rgba(251, 208, 51,0.9) !important;
    background-image: linear-gradient(310deg,#fcf800,#fbd033) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.swal2-styled.swal2-cancel {
    border: 0;
    border-radius: 0.5em !important;
    background: initial;
    background-color: rgba(234, 6, 6,0.9) !important;
    background-image: linear-gradient(310deg,#ea0606,#ff667c) !important;
    color: #fff;
    font-size: 1em;
}
.swal2-styled.swal2-cancel:hover,
.swal2-styled.swal2-cancel:focus {
    background-color: rgba(234, 6, 6,0.9) !important;
    background-image: linear-gradient(310deg,#ff667c,#ea0606) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}

/***********************
-----Marketing Learn------
***********************/
.card.card-background:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
  display: block;
  content: "";
  background: rgba(0, 0, 0, 0) !important;
  border-radius: 1rem;
}
.card.card-background .full-background {
  background-position: 50%;
  background-size: cover;
  margin-bottom: 30px;
  width: 100%;
  height: 100% !important;
  position: absolute;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card.card-background .half-background {
  background-position: 50%;
  background-size: cover;
  margin-bottom: 30px;
  width: 100%;
  height: 60% !important;
  position: absolute;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card.card-learn {
  /*width: 300px;
  height: 400px !important;*/
  position: relative;
  border-radius: 1rem !important;
}
.card-learn-header {
  height: 300px;
  overflow: hidden;
  position: relative;
  width: 100%;
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
  border-bottom-left-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
.card-learn-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 300px;
    min-height: 300px;
    max-height: 300px;
    overflow: hidden;
    width: auto;
}
.card-learn-body {
  position: relative;
  height: 100px;
  border-top-left-radius: 0rem !important;
  border-top-right-radius: 0rem !important;
  border-bottom-left-radius: 1rem !important;
  border-bottom-right-radius: 1rem !important;
}
.card-learn-footer {
  bottom: 10px;
  position: absolute;
  width: 100%;
}
.tut-hover-lift {
  padding: 0;
  text-decoration: none !important;
  text-transform: none !important;
  -webkit-transition: all 0.3s ease-in, border-radius 0.15s ease;
  transition: all 0.3s ease-in, border-radius 0.15s ease;
}
.tut-hover-lift h3,.tut-hover-lift p {
  color: var(--bs-heading-color);
}
.tut-hover-lift:hover {
  box-shadow: var(--bs-btn-focus-box-shadow) !important;
  background-color: transparent !important;
  background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%);
}
.tut-hover-lift:hover .icon {
  background-image: white !important;
  background: white !important;
  background-color: white !important;
}
.tut-hover-lift:hover .icon .ni {
  color: #0985eb;
}
.tut-hover-lift:hover p, .tut-hover-lift:hover h4 {
  color: white !important;
}
.tutorial-vid {
  border-radius: 1rem;
}


/*********************
  ---- navbar -------
*********************/
.nav-item-info-hover a {
  color: #FFFFFF;
  -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.nav-item-info-hover:hover a,
.nav-item-info-hover:active a,
.nav-item-info-hover:focus a,
.nav-item-info-hover:hover .nav-expand-icon,
.nav-item-info-hover:hover .nav-expand-icon2 {
  color: #17c1e8 !important;
  -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.dropdown-item-sm-text a,
.dropdown-item-sm-text:hover a {
  color: var(--bs-body-color) !important;
}
.icon-rotate-180 {
  -webkit-transition: transform 0.3s ease-out;
  -moz-transition: transform 0.3s ease-out;
  -ms-transition: transform 0.3s ease-out;
  -o-transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}
.nav-item-info-hover:hover .icon-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-transition: transform 0.3s ease-in-out;
  -moz-transition: transform 0.3s ease-in-out;
  -ms-transition: transform 0.3s ease-in-out;
  -o-transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;

}
.nav-expand-icon {
  vertical-align: middle;
  color: #FFFFFF;
  -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.nav-expand-icon2 {
  vertical-align: middle;
  color: var(--bs-heading-color) !important;
  -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}

.dropdown .dropdown-menu.dropdown-menu-end {
    right: 10px!important;
    left: auto!important;
}

@media (min-width: 992px) {
  .dropdown .dropdown-apps:before {
      font-family: FontAwesome;
      content: "\f0d8";
      position: absolute;
      top: 0;
      left: 841px;
      right: auto;
      font-size: 22px;
      color: #fff;
      transition: top .35s ease;
  }
  .dropdown.dropdown-hover .dropdown-apps, .dropdown .dropdown-apps {
    display: block;
    opacity: 0;
    top: 0;
    left: -830px;
    width: 900px;
    transform-origin: 50% 0;
    pointer-events: none;
    transform: perspective(999px) rotateX(-10deg) translateZ(0) translate3d(0,37px,0)!important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform,box-shadow;
  }
}
@media screen and (max-width: 991px) {
    .nav-expand-icon {
    color: var(--bs-body-color);
  }
}

/***********************************
 * ----- Project Management ------ *
 * *********************************/
 .pm-modal-title {
  font-weight: 700;
  display: block;
  width: 50%;
  color: var(--bs-heading-color);
  margin-bottom: 0;
  padding: 0.25rem 0.5rem;
  background: transparent;
  background-clip: padding-box;
  appearance: none;
  border: none;
  box-shadow: none;
 }
.pm-modal-title:focus {
  border-color: rgba(37,196,242,0.1) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.pm-add-column {
  width: 250px;
  margin-left: 0.25rem;
  padding-right: 5px;
}
.pm-add-column-btn-text {
  vertical-align: middle;
  line-height: 1;
  padding-left: 0.25rem;
}
.checklist-wrapper {
  list-style: none;
    margin: 0;
    padding: 3px;
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
}
.checklist-wrapper ul {
  min-width: 100% !important;
  width: 100% !important;
}
.checklist .handle-h {
  cursor: move;
  display: inline-block;
  margin: 0;
}
.checklist {
    list-style: none;
    margin: 0;
    padding: 3px;
    overflow: hidden;
    position: initial;
    width: 100%;
    max-width: 100%;
    display: inline-block;
    white-space: nowrap;
}

.checklist > li {
  border-radius: 0.6rem;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  /*border-right: 2px solid #e9ecef;*/
  color: inherit;
  margin-bottom: 2px;
  padding: 10px;
  display: block;
  -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%) !important;
  -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%) !important;
  -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%) !important;
  -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%) !important;
}

.checklist > li:hover {
  border-radius: 0.6rem;
  background-color: rgba(218, 225, 235, 1);
  /*background-color: rgba(255,255,255,1);
  background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.35) 100%);*/
  /*border: 1px solid rgb(229,231,235,1);*/
  /*border-right: 2px solid #e9ecef;*/
  color: inherit;
  margin-bottom: 2px;
  padding: 10px;
  display: block;
  /*-webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%) !important;*/
}
.checklist::placeholder {
  background: green;
}

.checklist > li:last-of-type {
  margin-bottom: 0;
}

.checklist > li > input[type="checkbox"] {
  margin: 0 10px 0 5px;
}

.checklist > li .text {
  display: block;
  font-weight: 500;
  /*margin-left: 5px;*/
  margin-right: 5px;
  padding: 0.2rem 0.5rem;
  font-size: 0.9rem;
  color: inherit;
  white-space: break-spaces;
  border-radius: 0.4rem;
  border: 1px solid transparent;
}

.checklist > li .text:focus {
  border: 1px solid rgba(37,196,242,0.4);
  -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}

.checklist > li .badge {
  font-size: .7rem;
  margin-left: 10px;
}

.checklist > li .tools {
  color: inherit;
  display: none;
  position: absolute;
  right: 16px;
  /*margin-left: auto;
  margin-right: auto;
  float: right;*/
}

.add-checklist {
    border-radius: 0.6rem;
    border: 1px solid transparent;
    background-color: none;
    background-image: none;
    color: inherit;
    font-size: 0.9rem;
    margin-bottom: 2px;
    margin-top: 3px;
    margin-left: 3px;
    width: 100px;
    padding: 0.3rem 0.6rem;
    display: inline-flex;
    background-color: rgba(218, 225, 235, 0.7);
    /*-webkit-box-shadow: 0 0 0 0.25rem rgba(0,0,0,0.05) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(0,0,0,0.05) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(0,0,0,0.05) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(0,0,0,0.05) !important;
    box-shadow: 0 0 0 0.125rem rgba(0,0,0,0.05) !important;*/
}

/*.add-checklist:hover,*/
.add-checklist:focus {
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
    background-color: rgba(255,255,255,1);
    background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.35) 100%);
    border: 1px solid rgba(37,196,242,0.4);
    width: 90%;
    height: auto;
    /* border-right: 2px solid #e9ecef; */
}

.btn-add-checklist-item {
  border-radius: 2rem;
    vertical-align: middle;
    /*padding: 0.18rem;*/
    line-height: 1;
    /*height: 16px;
    width: 16px;*/
    background-color: none;
  color: var (--bs-body-color) !important;
  cursor: pointer;
}
.btn-add-checklist-item:hover {
  vertical-align: middle;
  /*background-color: rgb(229,231,235,1);*/
}
.btn-add-checklist-item-icon {
  vertical-align: middle;
  padding: 0.2em;
  font-size:1.5rem;
  border-radius: 2rem;
  color: var(--bs-body-color);
  background-color: rgba(218, 225, 235, 0.7);
}
.btn-add-checklist-item-icon:hover {
    background-color: rgba(218, 225, 235, 1);
}
.add-checklist-form {
  background: rgb(0,0,0,0.05);
  border: 1px solid transparent;
  min-height: 30px !important;
  height: auto !important;
  width: 90px;
  border-radius: 0.6em !important;
  color: inherit;
  font-size:0.9rem;
  font-weight: 600;
  padding: 0.4rem 0.7rem;
}
.add-checklist-form:focus, .add-checklist-form:hover {
  width: 100%;
  background: #fff;
}
.add-checklist-form:focus {
  border: 1px solid rgba(37,196,242,0.4) !important;
  border-color: rgba(37,196,242,0.4) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.add-checklist-form::placeholder {
  color: var(--bs-body-color);
  font-weight: 600;
}
.editable-click {
  border-bottom: none !important;
}
.btn-assign-member-board {
  vertical-align: middle;
  color: white;
  line-height: 1;
  font-size:1.5rem;
  padding: 0.4rem;
  height: 40px;
  width: 40px;
  background-color: rgba(255,255,255,1);
  /*background-image: linear-gradient(to bottom, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);*/
  background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%);
  border: 1px solid rgb(229,231,235,1);
  border-radius: 2rem;
  /*margin-top: 0.6rem !important;
  margin-bottom: 0.6rem !important;*/
  float:right !important;
  webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -moz-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -ms-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    -o-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%) !important;
}
.btn-assign-member-board:hover {
  color: white;
  background-image: linear-gradient(310deg, #21d4fd 0%, #082fbf 100%);
  webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}
.checklist > li .tools > .fa,
.checklist > li .tools > .fas,
.checklist > li .tools > .far,
.checklist > li .tools > .fab,
.checklist > li .tools > .fal,
.checklist > li .tools > .fad,
.checklist > li .tools > .svg-inline--fa,
.checklist > li .tools > .ion {
  cursor: pointer;
  margin-right: 5px;
}
.checklist > li .tools > .material-icons-outlined {
  cursor: pointer;
  margin-right:2px;
}
.checklist > li .tools > .fa:hover,
.checklist > li .tools > .fas:hover,
.checklist > li .tools > .far:hover,
.checklist > li .tools > .fab:hover,
.checklist > li .tools > .fal:hover,
.checklist > li .tools > .fad:hover,
.checklist > li .tools > .svg-inline--fa:hover,
.checklist > li .tools > .ion:hover,
.checklist > li .tools > .material-icons-outlined:hover {
  opacity: 0.7;
    color: red;
}

.checklist > li:hover .tools {
  display: inline-block;
}

.checklist > li.done {
  color: #697582;
}

.checklist > li.done .text {
  font-weight: 500;
  text-decoration: line-through;
}

.checklist > li.done .badge {
  background-color: #adb5bd !important;
}

.checklist .primary {
  border-left-color: #007bff;
}

.checklist .secondary {
  border-left-color: #6c757d;
}

.checklist .success {
  border-left-color: #28a745;
}

.checklist .info {
  border-left-color: #17a2b8;
}

.checklist .warning {
  border-left-color: #ffc107;
}

.checklist .danger {
  border-left-color: #dc3545;
}

.checklist .light {
  border-left-color: #f8f9fa;
}

.checklist .dark {
  border-left-color: #343a40;
}

.checklist .lightblue {
  border-left-color: #3c8dbc;
}

.checklist .navy {
  border-left-color: #001f3f;
}

.checklist .olive {
  border-left-color: #3d9970;
}

.checklist .lime {
  border-left-color: #01ff70;
}

.checklist .fuchsia {
  border-left-color: #f012be;
}

.checklist .maroon {
  border-left-color: #d81b60;
}

.checklist .blue {
  border-left-color: #007bff;
}

.checklist .indigo {
  border-left-color: #6610f2;
}

.checklist .purple {
  border-left-color: #6f42c1;
}

.checklist .pink {
  border-left-color: #e83e8c;
}

.checklist .red {
  border-left-color: #dc3545;
}

.checklist .orange {
  border-left-color: #fd7e14;
}

.checklist .yellow {
  border-left-color: #ffc107;
}

.checklist .green {
  border-left-color: #28a745;
}

.checklist .teal {
  border-left-color: #20c997;
}

.checklist .cyan {
  border-left-color: #17a2b8;
}

.checklist .white {
  border-left-color: #fff;
}

.checklist .gray {
  border-left-color: #6c757d;
}

.checklist .gray-dark {
  border-left-color: #343a40;
}

.checklist .handle {
  cursor: move;
  display: inline-block;
  margin: 0 2px;
  color:#495057;
}
.dark-mode .checklist > li {
  background-color: #3f474e;
  border-color: #454d55;
  color: #fff;
}

.dark-mode .checklist .primary {
  border-left-color: #3f6791;
}

.dark-mode .checklist .secondary {
  border-left-color: #6c757d;
}

.dark-mode .checklist .success {
  border-left-color: #00bc8c;
}

.dark-mode .checklist .info {
  border-left-color: #3498db;
}

.dark-mode .checklist .warning {
  border-left-color: #f39c12;
}

.dark-mode .checklist .danger {
  border-left-color: #e74c3c;
}

.dark-mode .checklist .light {
  border-left-color: #f8f9fa;
}

.dark-mode .checklist .dark {
  border-left-color: #343a40;
}

.dark-mode .checklist .lightblue {
  border-left-color: #86bad8;
}

.dark-mode .checklist .navy {
  border-left-color: #002c59;
}

.dark-mode .checklist .olive {
  border-left-color: #74c8a3;
}

.dark-mode .checklist .lime {
  border-left-color: #67ffa9;
}

.dark-mode .checklist .fuchsia {
  border-left-color: #f672d8;
}

.dark-mode .checklist .maroon {
  border-left-color: #ed6c9b;
}

.dark-mode .checklist .blue {
  border-left-color: #3f6791;
}

.dark-mode .checklist .indigo {
  border-left-color: #6610f2;
}

.dark-mode .checklist .purple {
  border-left-color: #6f42c1;
}

.dark-mode .checklist .pink {
  border-left-color: #e83e8c;
}

.dark-mode .checklist .red {
  border-left-color: #e74c3c;
}

.dark-mode .checklist .orange {
  border-left-color: #fd7e14;
}

.dark-mode .checklist .yellow {
  border-left-color: #f39c12;
}

.dark-mode .checklist .green {
  border-left-color: #00bc8c;
}

.dark-mode .checklist .teal {
  border-left-color: #20c997;
}

.dark-mode .checklist .cyan {
  border-left-color: #3498db;
}

.dark-mode .checklist .white {
  border-left-color: #fff;
}

.dark-mode .checklist .gray {
  border-left-color: #6c757d;
}

.dark-mode .checklist .gray-dark {
  border-left-color: #343a40;
}
/*******************************
 * ------- Calendar ------------
 * ****************************/
 .choices__inner {
    display: flex;
    align-items: center;
    vertical-align: top;
    width: 100%;
    padding: 0.3rem 0.5rem !important;
    border: 1px solid #d2d6da;
    border-radius: 0.7rem;
    font-size: 14px;
    min-height: 40px;
    overflow: hidden;
}

.is-focused .choices__inner,
.is-open .choices__inner {
    
    border-color: rgba(37,196,242,0.1) !important;
    background-color: #e9ecef !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.choices__list--multiple .choices__item {
    display: inline-block;
    vertical-align: middle;
    border-radius: 20px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 500;
    margin-right: 3.75px;
    margin-bottom: 3px;
    background-color: #3a416f;
    border: 1px solid #3a416f;
    color: #fff;
    word-break: break-all;
    box-sizing: border-box;
}
.choices__input {
    display: inline-block;
    vertical-align: baseline;
    background-color: #fff;
    font-size: 14px;
    margin-bottom: 0 !important;
    border: 0;
    border-radius: 0;
    max-width: 100%;
    padding: 4px 0 4px 2px;
}
.choices__input:focus {
    background-color: #e9ecef !important;
}
.btn-date-nav {
    background: transparent;
    border-radius: 0.6rem;
    padding: 0.5rem 0.7rem;
    margin: -0.5rem;
    font-size: 0.875rem;
}
.btn-date-nav:hover {
    color: rgba(0, 123, 255, 0.7);
    background: var(--bs-gray-200);
}
.btn-date-nav:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.nav-dropdown-select {
    margin-right: 0.2rem;
    background: transparent;
    border-radius: 0.6rem;
    transition: all 0.1s ease-in-out !important;
}
.nav-dropdown-select:hover {
    color: rgba(0, 123, 255, 0.7) !important;
    background: var(--bs-gray-200);
}
.cal-form-control {
    display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  line-height: 1.4rem;
  color: #495057;
  background-color: transparent;
  background-clip: padding-box;
  border: 1px solid transparent;
  appearance: none;
  border-radius: 0.7rem;
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.cal-form-control:focus {
    border-color: rgba(37,196,242,0.1) !important;
    background-color: #e9ecef !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}
.fc-h-event {
    display: block;
    color: #fff;
    border: 1px solid rgba(33, 213, 253, 1);
    background-color: rgba(0, 39, 178, 1);
}
.fc-h-event:hover {
    color: rgba(33, 213, 253, 1);
}
.fc-unthemed td.fc-today {
    background: rgba(33, 213, 253, 0.2);
}
.event-close {
    vertical-align: middle;
    background: transparent;
    color: inherit;
    border-radius: 0.5rem;
}
.event-close:hover {
    background: rgba(255, 0, 0, 0.8);
    color: #fff;
}
.calendar-box {
  border-radius: 0.6rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  display: block;
  margin-bottom: 20px;
  position: relative;
  width: 300px;
  height: 100%;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}
.calendar-box:hover {
  transform: scale(1.02);
  cursor: inherit;
}

.calendar-box > .inner {
  padding: 10px;
}

.calendar-box-header {
  height: 150px;
  text-align: center;
  margin: -10px -10px 0 -10px;
  background: rgba(233, 236, 239,1);
  overflow: hidden;
}
.calendar-thumbnail {
  position: relative;
  width: auto;
  max-height: 100%;
}
.calendar-box-footer {
  overflow: hidden;
}

.calendar-box > .calendar-box-footer {
  background-color: rgba(0, 102, 255, 0.7);
  color: #fff;
  font-weight: 700;
  display: block;
  width:100%;
  padding: 3px 0;
  position: relative;
  text-align: center;
  text-decoration: none;
  border-bottom-left-radius: 0.6rem;
  border-bottom-right-radius: 0.6rem;
  z-index: 10;
}

.calendar-box > .calendar-box-footer:hover {
  background-color: rgba(0, 102, 255, 1);
  color: #fff;
}

.calendar-box h3 {
  font-size: 2.2rem;
  font-weight: 700;
  margin: 0 0 10px;
  padding: 0;
  white-space: nowrap;
}

.inner.calendar {
  margin-bottom: -25px;
}

.btn-calendar {
    position: absolute;
    right: 7px;
    float: right;
}
.btn-calendar-more {
    border: none;
    height: 32px;
    width: 32px;
    z-index:2;
    position: absolute;
    right: 7px;
    margin-top: 2px;
    padding: 0.1rem;
    float: right;
    color: var(--bs-body-color);
    border-radius: 50%;
}
.btn-calendar-more:hover {
    background-color: rgba(0,0,0,0.08);
    /*border: 2px solid #D9D9D9;*/
}
.btn-calendar-more:focus {
    -webkit-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -moz-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -ms-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    -o-box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
    box-shadow: 0 0 0.125rem 0.25rem rgba(37,196,242,0.3);
}
.calendar-box-pop {
    min-width: 120px;
    width: 120px!important;  
    padding: 0.5rem;
    -webkit-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    -o-box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
    box-shadow: 0 20px 27px 0 rgb(0 0 0 / 15%);
}
.calendar-box-pop .dropdown-item {
  border-radius: 0.5rem;
}
.calendar-box-pop .dropdown-item:hover {
  cursor: pointer;
}

@media screen and (min-width: 992px) {
  .col-xl-2 .calendar-box h3,
  .col-lg-2 .calendar-box h3,
  .col-md-2 .calendar-box h3 {
    font-size: 1.6rem;
  }
  .col-xl-3 .calendar-box h3,
  .col-lg-3 .calendar-box h3,
  .col-md-3 .calendar-box h3 {
    font-size: 1.6rem;
  }
}

@media screen and (min-width: 1200px) {
  .col-xl-2 .calendar-box h3,
  .col-lg-2 .calendar-box h3,
  .col-md-2 .calendar-box h3 {
    font-size: 2.2rem;
  }
  .col-xl-3 .calendar-box h3,
  .col-lg-3 .calendar-box h3,
  .col-md-3 .calendar-box h3 {
    font-size: 2.2rem;
  }
}

.calendar-box p {
  font-size: 1rem;
}

.calendar-box p > small {
  color: #f8f9fa;
  display: block;
  font-size: .9rem;
  margin-top: 5px;
}

.calendar-box h3,
.calendar-box p {
  z-index: 5;
}

.calendar-box .icon {
  color: inherit;
  z-index: 0;
}

.calendar-box .icon > i {
  font-size: 100px;
  height: 150px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  cursor: pointer;
  margin: auto;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.calendar-box .icon > i.fa, .calendar-box .icon > i.fas, .calendar-box .icon > i.far, .calendar-box .icon > i.fab, .calendar-box .icon > i.fal, .calendar-box .icon > i.fad, .calendar-box .icon > i.ion {
  font-size: 80px;
  /*top: 20px;*/
}

.calendar-box .icon svg {
  font-size: 70px;
  /*position: absolute;*/
  right: 15px;
  top: 15px;
  transition: -webkit-transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}

.calendar-box:hover {
  text-decoration: none;
}

.calendar-box:hover .icon > i, .calendar-box:hover .icon > i.fa, .calendar-box:hover .icon > i.fas, .calendar-box:hover .icon > i.far, .calendar-box:hover .icon > i.fab, .calendar-box:hover .icon > i.fal, .calendar-box:hover .icon > i.fad, .calendar-box:hover .icon > i.ion {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
    color: rgba(0, 102, 255, 0.9);
    transition: transform 0.1s linear;
}

.calendar-box:hover .icon > svg {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

@media screen and (max-width: 767.98px) {
  .calendar-box {
    text-align: center;
  }
  .calendar-box .icon > i.ion {
    font-size: 60px;
    /* top: 20px; */
}
  .calendar-box p {
    font-size: 12px;
  }
.edit-in-place-input {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    align-items: center;
    align-content: center;
    text-align: center;
    }
}
.edit-in-place-input {
    margin-top: 0;
    color: inherit;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    /*padding: 0.3rem;
    padding-top: 0;*/
    border-radius: 0.4rem;
    border: 1px solid transparent;
    width: 100%;
}
.edit-in-place-input.sm-text {
    color: inherit;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    font-size: 1rem !important;
    /*padding: 0.3rem;*/
    border: 1px solid transparent;
}
.edit-in-place-input::placeholder {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: var(--bs-placeholder-color);
    font-family: inherit;
}
.edit-in-place-input.sm-text::placeholder {
    font-size: 1rem !important;
    font-weight: 400 !important;
    color: var(--bs-placeholder-color);
    font-family: inherit;
}
.edit-in-place-input:focus::placeholder {
    color: var(--bs-placeholder-color);
}
.edit-in-place-input:focus {
    border: 1px solid #f1f1f1;
    background: #e9ecef;
}
.calendar-title {
    color: inherit;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 0.5rem 0.1rem;
    line-height: 1.1 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    overflow-x: auto;
/*    height: 35px;*/
    width: 100%;
    white-space: nowrap;
    appearance: none;
    text-overflow: ellipsis;
    inset: none;
}
.calendar-subtitle {
    font-weight: 400;
    color: inherit;
    padding: 0.1rem 0.1rem 0.5rem 0.1rem;
    line-height: 1 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    overflow-x: auto;
/*    height: 34px;*/
    width: 100%;
    white-space: nowrap;
    appearance: none;
    text-overflow: ellipsis;
    inset: none;
}
.calendar-description {
    font-weight: 400;
    color: inherit;
    padding: 0.1rem 0.1rem 0.25rem 0.1rem;
    line-height: 1 !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    overflow-x: auto;
/*    height: 34px;*/
    width: 100%;
    white-space: nowrap;
    appearance: none;
    text-overflow: ellipsis;
    inset: none;
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {

    .edit-in-place-input {
        display: block;
        width: 100%;
        overflow-x: auto;
    }
}
@media screen and (min-width: 528px) and (max-width: 767px) {

    .edit-in-place-input {
        width: 100%;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (min-width: 428px) and (max-width: 527px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (min-width: 328px) and (max-width: 427px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
@media screen and (max-width: 327px) {

    .edit-in-place-input {
        width: 100%;
        font-size: 1rem !important;
        overflow-x: auto;
    }
    .edit-in-place-input.sm-text {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input::placeholder {
        font-size: 1rem !important;
    }
    .edit-in-place-input.sm-text::placeholder {
        font-size: 0.8rem !important;
    }
    .edit-in-place-input.sm-text:focus::placeholder {
        font-size: 0.8rem !important;
    }
}
#file-upload-form input[name='team-doc'] {
    width: 100%;
    height: 100%;
}
@media screen and (min-width: 1400px) {
  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.666667%;
  }
}
/****************************************/
/*          Quill Overrides            */
/****************************************/
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
  outline: none;
}
.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: rgba(6, 119, 206, 0.7) !important;
  background: rgba(218, 225, 235, 0.5);
  border-radius: 0.3rem;
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: rgba(6, 119, 206, 0.7) !important;
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: rgba(6, 119, 206, 0.7) !important;
}
@media (pointer: coarse) {
  .ql-snow.ql-toolbar button:hover:not(.ql-active),
  .ql-snow .ql-toolbar button:hover:not(.ql-active) {
    color: var(--bs-heading-color) !important;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    color: var(--bs-heading-color) !important;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    color: var(--bs-heading-color) !important;
  }
}
.ql-snow {
  box-sizing: border-box;
}
.ql-snow * {
  box-sizing: border-box;
}
.ql-snow .ql-hidden {
  display: none;
}
.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
  visibility: hidden;
}
.ql-snow .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-snow .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-snow .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-snow .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-snow .ql-formats:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow .ql-stroke {
  fill: none;
  stroke: var(--bs-heading-color) !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-snow .ql-stroke-miter {
  fill: none;
  stroke: var(--bs-heading-color) !important;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: var(--bs-heading-color) !important;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: var(--bs-heading-color) !important;
}
.ql-snow .ql-empty {
  fill: none;
}
.ql-snow .ql-even {
  fill-rule: evenodd;
}
.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-snow .ql-transparent {
  opacity: 0.4;
}
.ql-snow .ql-direction svg:last-child {
  display: none;
}
.ql-snow .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-snow .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-snow .ql-editor h1 {
  font-size: 2em;
}
.ql-snow .ql-editor h2 {
  font-size: 1.5em;
}
.ql-snow .ql-editor h3 {
  font-size: 1.17em;
}
.ql-snow .ql-editor h4 {
  font-size: 1em;
}
.ql-snow .ql-editor h5 {
  font-size: 0.83em;
}
.ql-snow .ql-editor h6 {
  font-size: 0.67em;
}
.ql-snow .ql-editor a {
  text-decoration: underline;
}
.ql-snow .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-snow .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-snow .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-snow .ql-editor img {
  max-width: 100%;
}
.ql-snow .ql-picker {
  color: var(--bs-heading-color) !important;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle;
}
.ql-snow .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-snow .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-snow .ql-picker-options {
  background-color: #fff;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-snow .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  color: #ccc;
  z-index: 2;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
  width: 28px;
}
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-snow .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-snow .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-snow .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
  content: attr(data-label);
}
.ql-snow .ql-picker.ql-header {
  width: 98px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: 'Heading 1';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: 'Heading 2';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: 'Heading 3';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: 'Heading 4';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: 'Heading 5';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: 'Heading 6';
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-snow .ql-picker.ql-font {
  width: 108px;
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: 'Sans Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: 'Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: 'Monospace';
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family: Georgia, Times New Roman, serif;
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family: Monaco, Courier New, monospace;
}
.ql-snow .ql-picker.ql-size {
  width: 98px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: 'Small';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: 'Large';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: 'Huge';
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    border-top-right-radius: 0.5rem;
    border-top-left-radius: 0.5rem;
    box-sizing: border-box;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    padding: 8px;
}
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 15px;
}
.ql-toolbar.ql-snow .ql-picker-label {
  border: 1px solid transparent;
}
.ql-toolbar.ql-snow .ql-picker-options {
  border: 1px solid transparent;
  box-shadow: rgba(0,0,0,0.2) 0 2px 8px;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
  border-color: #000;
}
.ql-toolbar.ql-snow + .ql-container.ql-snow {
  border-top: 0px;
}
.ql-snow .ql-tooltip {
  background-color: #fff;
  border: none !important;
  box-shadow: 0px 0px 5px #ddd;
  color: #444;
  padding: 5px 12px;
  white-space: nowrap;
}
.ql-snow .ql-tooltip::before {
  content: "Visit URL:";
  line-height: 26px;
  margin-right: 8px;
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border: 1px solid #ccc;
  font-size: 13px;
  height: 26px;
  margin: 0px;
  padding: 3px 5px;
  width: 170px;
}
.ql-snow .ql-tooltip a.ql-preview {
  display: inline-block;
  max-width: 200px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.ql-snow .ql-tooltip a.ql-action::after {
  border-right: 1px solid #ccc;
  content: 'Edit';
  margin-left: 16px;
  padding-right: 8px;
}
.ql-snow .ql-tooltip a.ql-remove::before {
  content: 'Remove';
  margin-left: 8px;
}
.ql-snow .ql-tooltip a {
  line-height: 26px;
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
  display: none;
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
  display: inline-block;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: 'Save';
  padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
  content: "Enter link:";
}
.ql-snow .ql-tooltip[data-mode=formula]::before {
  content: "Enter formula:";
}
.ql-snow .ql-tooltip[data-mode=video]::before {
  content: "Enter video:";
}
.ql-snow a {
  color: #06c;
}
.ql-container.ql-snow {
  border: none !important;
}
.ql-toolbar.ql-snow+.ql-container.ql-snow {
    border-top: 0;
    border-bottom-left-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
}
.ql-editor {
    border-bottom-left-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
}
.ql-toolbar {
  border-color: transparent !important;
}
@media (max-width: 991px) {
  .ql-toolbar {
  border-color: transparent !important;
}
}
/*.ql-editor:focus,
.ql-toolbar + .description-editor {
  border: 1px solid transparent;
    border-color: transparent !important;
    background-color: #fff !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}*/
.description-editor p {
  font-size: 0.9rem;
}
.description-editor {
  background: transparent;
  border-radius: 0.6rem;
}
.ql-editor:focus + .description-editor {
  background: #fff !important;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -moz-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -ms-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    -o-box-shadow: 0 0 0 0.25rem rgba(37,196,242,0.4) !important;
    box-shadow: 0 0 0 0.125rem rgba(37,196,242,0.4) !important;
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label, .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-radius: 0.5rem;
    border-color: #ccc;
}
.template-block-2-editor {
  border-radius: 0.6rem;
}
.template-block-1-editor {
  border-radius: 0.6rem;
}

/****************************************/
/*    Minerals Home Page Flip Cards     */
/****************************************/
.home-cards {
  display: block;
  width: auto;
  height: auto;
  text-align: center;
  align-content: center;
  margin: auto;
}
.home-cards .section-title {
  z-index: 2;
  position: relative;
}
.home-cards p {
  font-family: "Open Sans";
  font-size: 13px;
  margin-top: 10px;
  font-weight: 700;
}

.home-square-flip {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -ms-perspective: 1000;
  perspective: 1000;
  -webkit-transform: perspective(1000px);
  -moz-transform: perspective(1000px);
  -ms-transform: perspective(1000px);
  transform: perspective(1000px);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  /*border:1px solid #efefef;*/
  position: relative;
  margin: 20px;
  width: 400px;
  height: 400px;
}
.home-square, .home-square2 {
  width: 100%;
  height: 100%;
}
.home-square {
  background-size: cover;
  background-position: center center;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  overflow: hidden;
  position: absolute;
  top: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 0.7rem;
}
.home-square-flip .home-square {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  transform-style: preserve-3d;
  z-index: 1;
}
.home-square-flip:hover .home-square {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  transform-style: preserve-3d;
}
.home-square2 {
  background: radial-gradient( rgba(24,182,155,1) 0%, rgba(37,245,210,1) 100%);
  background-size: cover;
  background-position: center center;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  overflow: hidden;
  position: absolute;
  top: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.home-square-flip .home-square2 {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  transform: rotateY(180deg);
  transform-style: preserve-3d;
  z-index: 1;
}
.home-square-flip:hover .home-square2 {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  transform-style: preserve-3d;
}
/*Square content*/
.home-square-container {
  padding: 40px;
  text-align: center;
  position: relative;
  overflow: hidden;
  top: 50%;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transform: translateY(-50%) translateX(6px) scale(1);
  -ms-transform: translateY(-50%) translateX(6px) scale(1);
  transform: translateY(-50%) translateX(6px) scale(1);
  transform-style: preserve-3d;
  z-index: 2;
}
.front-card {
  width: 100%;
  height: 100%;
}
.home-square-flip:hover .home-square-container {
  -webkit-transform: translateY(-50%) translateX(-100px) translateZ(0) scale(1);
  -ms-transform: translateY(-50%) translateX(-100px) translateZ(0) scale(1);
  transform: translateY(-50%) translateX(-100px) translateZ(0) scale(1);
  transform-style: preserve-3d;
}
.home-square-container2 {
  padding: 40px;
  text-align: center;
  position: relative;
  top: 50%;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(1);
  -ms-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(1);
  transform: translateY(-50%) translateX(650px) translateZ(60px) scale(1);
  transform-style: preserve-3d;
  z-index: 2;
}
.home-square-flip:hover .home-square-container2 {
  -webkit-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  -ms-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  transform-style: preserve-3d;
}
/*Style text*/
.home-square-flip h2 {
  color: white;
}
.home-square-flip h3 {
  color: white;
  line-height: 26px;
}
.home-square-flip h4 {
  color: white;
  line-height: 26px;
}
.home-square-flip h5 {
  color: white;
  line-height: 26px;
}
/*Elements*/
.home-flip-overlay {
  display: block;
  background: rgba(0,0,0,0.6);
  width: 100%;
  height: 100%;
  position: absolute;
  border: solid 2px rgba(37,245,210,1);
  border-radius: 0.7rem;
  top: 0;
}
.home-blue-overlay {
  display: block;
  background: radial-gradient(#21d4fd 0%, #082fbf 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  border: solid 2px #379ADB;
  border-radius: 0.7rem;
  top: 0;
  opacity: 1.0;
}
.home-green-overlay {
  display: block;
  background: radial-gradient(rgba(37,245,210,1) 0%, rgba(24,182,155,1) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  border: solid 2px rgba(37,245,210,1);
  border-radius: 0.7rem;
  top: 0;
  opacity: 1.0;
}
.align-center {
  margin: 0 auto;
}
.kallyas-button {
  display: block;
  width: 160px;
  padding: 18px 30px;
  font-family: "Open Sans";
  font-weight: 600;
  color: #fff;
  background: #FF2024;
  margin: 0 auto;
  border-radius: 2px;
  text-decoration: none;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa067+0,ff2959+49,ff2024+100 */
  background: #ffa067; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa067', endColorstr='#ff2024', GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/*ADD SHADOWS OPTIONAL*/
.home-square-flip .home-square .boxshadow, .home-square-flip .home-square .textshadow, .home-square-flip .home-square2 .boxshadow, .home-square-flip .home-square2 .textshadow {
  -ms-transition: 0.60s;
  transition: 0.60s;
  -webkit-transition: 0.60s;
}
.home-square-flip .home-square .boxshadow {
  -webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.home-square-flip .home-square .textshadow {
  -webkit-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.home-square-flip:hover .home-square .boxshadow, .home-square-flip:hover .home-square .textshadow {
  -webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.home-square-flip .home-square2 .boxshadow {
  -webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.home-square-flip .home-square2 .textshadow {
  -webkit-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.home-square-flip:hover .home-square2 .boxshadow, .home-square-flip:hover .home-square2 .textshadow {
  -webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.home-flipcard-icon .icon {
  font-size: 100px;
  line-height: 1;
  margin: 0 0 10px;
  color:rgba(37,245,210,1);
}
.home-centerflipcards {
  display: block;
  width: 1330px;
  height: 440px;
  text-align: center;
  margin: 0 auto;
  margin-top: 50px;
  margin-bottom: 200px;
}
.clearfix {
  clear: both;
}
.home-centerflipcards p {
  font-family: "Open Sans";
  font-size: 13px;
  margin-top: 10px;
  font-weight: 700;
}
.counting-wrapper {
  padding-top: 30px;
  padding-bottom: 25px;
  background: url('../img/banner/panoramic-1920s-oil-rigs.jpg');
  background-size: cover;
  /*background: radial-gradient( #379ADB 0%, #3C7DD1 40%, #001A6C 100%);*/
  z-index: 0;
}
.counting-item {
  margin-bottom: 30px;
  text-align: center;
  font-size: 18px;
  font-weight: 200;
  letter-spacing: 2px;
  color: #fff;
  text-transform: uppercase;
}
.counting-item .h1 {
  font-size: 66px;
  line-height: 1;
}
#blue-overlay {
  position: relative;
  right: 0;
  bottom: 0;
  top: 10;
  width: 100vw;
  height: auto;
  background: radial-gradient( #21d4fd 0%,  #082fbf 100%);
  z-index: 2;
  opacity: 1.0
}
.blue-overlay {
  display: block;
  background: radial-gradient( #379ADB 0%, #3C7DD1 40%, #001A6C 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  opacity: 1.0;
}
.section-title-special {
  text-align: center;
  font-size: 17px;
  line-height: 23px;
  margin: 0 0 40px;
  z-index: 3;
}
.section-title-special h2 {
  font-size: 38px;
  line-height: 40px;
  margin: 0 0 30px;
}
.section-title-special p {
  font-size: 22px;
  line-height: 30px;
  letter-spacing: 1.2px;
  font-weight: 300;
}
.section-title-special-right {
  text-align: right;
  font-size: 17px;
  line-height: 23px;
  margin: 0 0 40px;
  z-index: 3;
}
.section-title-special-right h2 {
  font-size: 38px;
  line-height: 40px;
  margin: 0 0 30px;
}
.section-title-special-right p {
  font-size: 22px;
  line-height: 30px;
  letter-spacing: 1.2px;
  font-weight: 300;
}
/***********************
 * Areas of Interest
 **********************/
.areas-of-interest {
  background-image: url(https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/US_map_blue_gradient_permian_basin.jpg);
    background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: center center;
  position: relative;
    right: 20px;
  height: 500px;
  width: 100%;
  margin: 20px;
}
@media only screen and (max-width: 1199px) {
    .areas-of-interest {
        background-image: url(https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/US_map_blue_gradient_permian_basin.jpg);
        background-repeat: no-repeat;
        background-size: auto 100%;
        background-position: center center;
        position: relative;
        right: 20px;
        height: 500px;
        width: 100%;
        margin: 20px;
    }
}

@media only screen and (max-width: 991px) {
    .areas-of-interest {
        background-image: url(https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/US_map_blue_gradient_permian_basin.jpg);
        background-repeat: no-repeat;
        background-size: auto 100%;
        background-position: center center;
        position: relative;
        right: 20px;
        height: 350px;
        width: 100%;
        margin: 20px;
    }
}

@media only screen and (max-width: 767px) {
    .areas-of-interest {
        background-image: url(https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/US_map_blue_gradient_permian_basin.jpg);
        background-repeat: no-repeat;
        background-size: auto 100%;
        background-position: center center;
        position: relative;
        right: 20px;
        height: 250px;
        width: 100%;
        margin: 20px;
    }
}

@media (max-width: 479px) {
    .areas-of-interest {
        background-image: url(https://halselloil.s3.us-east-2.amazonaws.com/site_img/banner/US_map_blue_gradient_permian_basin.jpg);
        background-repeat: no-repeat;
        background-size: auto 100%;
        background-position: center center;
        position: relative;
        right: 20px;
        height: 200px;
        width: 100%;
        margin: 20px;
    }
}
/*****************************/
/*    Benefits Flip Card     */
/*****************************/
.benefits-cards {
  display: block;
  width: auto;
  height: auto;
  text-align: center;
  margin: auto;
  margin-top: 50px;
  margin-bottom: 50px;
}
.benefits-cards .section-title {
  z-index: 2;
  position: relative;
}
.benefits-cards p {
  font-family: "Open Sans";
  font-size: 13px;
  margin-top: 10px;
  font-weight: 700;
}
.square-flip-2 {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -ms-perspective: 1000;
  perspective: 1000;
  -webkit-transform: perspective(1000px);
  -moz-transform: perspective(1000px);
  -ms-transform: perspective(1000px);
  transform: perspective(1000px);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  /*border:1px solid #efefef;*/
  position: relative;
  margin: 20px;
  width: 400px;
  height: 400px;
}
.square-2, .square2-2 {
  width: 100%;
  height: 100%;
}
.square-2 {
  background-size: cover;
  background-position: center center;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  overflow: hidden;
  position: absolute;
  top: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 5px;
}

.square-flip-2 .square-2 {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  transform-style: preserve-3d;
  z-index: 1;
}
.square-flip-2:hover .square-2 {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  transform-style: preserve-3d;
}
.square2-2 {
  background: radial-gradient( #379ADB 0%, #3C7DD1 40%, #001A6C 100%);
  background-size: cover;
  background-position: center center;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  overflow: hidden;
  position: absolute;
  border-radius: 5px;
  top: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.square-flip-2 .square2-2 {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  transform: rotateY(180deg);
  transform-style: preserve-3d;
  z-index: 1;
}
.square-flip-2:hover .square2-2 {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  transform-style: preserve-3d;
}
/*Square content*/
.square-container-2 {
  padding: 40px;
  text-align: center;
  position: relative;
  top: 50%;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transform: translateY(-50%) translateX(0px) scale(1);
  -ms-transform: translateY(-50%) translateX(0px) scale(1);
  transform: translateY(-50%) translateX(0px) scale(1);
  transform-style: preserve-3d;
  z-index: 2;
}
.square-flip-2:hover .square-container-2 {
  -webkit-transform: translateY(-50%) translateX(-650px) scale(.88);
  -ms-transform: translateY(-50%) translateX(-650px) scale(.88);
  transform: translateY(-50%) translateX(-650px) scale(.88);
  transform-style: preserve-3d;
}
.square-container2-2 {
  padding: 40px;
  text-align: center;
  position: relative;
  top: 50%;
  -ms-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transition: transform 0.60s cubic-bezier(.5, .3, .3, 1);
  -webkit-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);
  -ms-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);
  transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);
  transform-style: preserve-3d;
  z-index: 2;
}
.square-flip-2:hover .square-container2-2 {
  -webkit-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  -ms-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  transform-style: preserve-3d;
}
/*Style text*/
.square-flip-2 h2 {
  color: white;
}
.square-flip-2 h3 {
  color: white;
  line-height: 26px;
}
.square-flip-2 h4 {
  color: white;
  line-height: 26px;
}
.square-flip-2 h5 {
  color: white;
  line-height: 26px;
}
/*Elements*/
.flip-overlay-2 {
  display: block;
  background: rgba(0,0,0,0.4);
  width: 100%;
  height: 100%;
  position: absolute;
  border: solid 2px #379ADB;
  border-radius: 5px;
  top: 0;
}
.blue-overlay-2 {
  display: block;
  background: radial-gradient( #379ADB 0%, #3C7DD1 40%, #001A6C 100%);
  width: 100%;
  height: 100%;
  border: solid 2px #379ADB;
  border-radius: 5px;
  position: absolute;
  top: 0;
  opacity: 1.0;
}
.align-center {
  margin: 0 auto;
}
.kallyas-button-2 {
  display: block;
  width: 160px;
  padding: 18px 30px;
  font-family: "Open Sans";
  font-weight: 600;
  color: #fff;
  background: #FF2024;
  margin: 0 auto;
  border-radius: 2px;
  text-decoration: none;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa067+0,ff2959+49,ff2024+100 */
  background: #ffa067; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #ffa067 0%, #ff2959 49%, #ff2024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa067', endColorstr='#ff2024', GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/*ADD SHADOWS OPTIONAL*/
.square-flip-2 .square-2 .boxshadow, .square-flip-2 .square-2 .textshadow, .square-flip-2 .square2-2 .boxshadow, .square-flip-2 .square2-2 .textshadow {
  -ms-transition: 0.60s;
  transition: 0.60s;
  -webkit-transition: 0.60s;
}
.square-flip-2 .square-2 .boxshadow {
  -webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.square-flip-2 .square-2 .textshadow {
  -webkit-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.square-flip-2:hover .square-2 .boxshadow, .square-flip-2:hover .square-2 .textshadow {
  -webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.square-flip-2 .square2-2 .boxshadow {
  -webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.square-flip-2 .square2-2 .textshadow {
  -webkit-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  -moz-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
  text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
}
.square-flip-2:hover .square2-2 .boxshadow, .square-flip-2:hover .square2-2 .textshadow {
  -webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  -moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
  box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
}
.operations-icon .icon {
  font-size: 100px;
  line-height: 1;
  margin: 0 0 10px;
  color:#3791D8;
}

/*********************
 * Image Background
 *********************/

.image-bg-wrapper {
  position: relative;
  padding: 0px 0 0px;
  background-size: cover;
  background-position: center center;
}
.image-bg-wrapper:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.2);
}
.image-bg-wrapper.overlay-black:before {
  background: rgba(0, 0, 0, 0.7);
}
.image-bg-wrapper.overlay-white:before {
  background: rgba(255, 255, 255, 0.9);
}
.image-bg-wrapper.no-overlay:before {
  display: none;
}
.image-bg-wrapper h1, .image-bg-wrapper h2, .image-bg-wrapper h3, .image-bg-wrapper h4, .image-bg-wrapper h5, .image-bg-wrapper h6 {
}
.image-bg-wrapper-2 {
  position: relative;
  padding: 0px 0 0px;
  position: relative;
  background-size: cover;
  background-position: center center;
}
.image-bg-wrapper-2:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.4);
}
.image-bg-wrapper-2.overlay-black:before {
  background: rgba(0, 0, 0, 0.7);
}
.image-bg-wrapper-2.overlay-white:before {
  background: rgba(255, 255, 255, 0.5);
}
.image-bg-wrapper-2.no-overlay:before {
  display: none;
}
.image-bg-wrapper-2 h1, .image-bg-wrapper-2 h2, .image-bg-wrapper-2 h3, .image-bg-wrapper-2 h4, .image-bg-wrapper-2 h5, .image-bg-wrapper-2 h6 {
}
.featured-resources-bg-none {
  padding: 20px;
  background: none;
}
.bg-none {
  background: none !important;
}
.featured-resources-bg {
  width: 300px;
  height: 200px;
  padding: 20px 0px;
  border: solid 2px #002391;
  border-radius: 5px;
  background: rgba(255,255,255,0.5);
}
.featured-resources-bg:hover {
  padding: 20px;
  border: solid 2px #002391;
  border-radius: 5px;
  background: rgba(255,255,255,0.8);
}
.featured-bg {
  position: relative;
  padding: 20px;
  border: solid 2px transparent;
  border-radius: 0.7rem;
  background: rgba(255,255,255,0.5);
}
.featured-bg:hover {
  padding: 20px;
  border: solid 2px #21D4FD;
  background: rgba(255,255,255,1) !important;
}
.featured-item-text {
  margin: 15px 0;
}
.featured-item-text h4 {
  border-bottom: 1px solid #B270B5;
  padding-bottom: 10px;
  margin: 0 0 15px;
  letter-spacing: 2px;
}
.featured-item-01 {
  text-align: center;
  line-height: 22px;
  margin-bottom: 30px;
}
.featured-item-01 .icon {
  font-size: 64px;
}
.featured-item-01 h3 {
  text-transform: uppercase;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 2px;
  margin: 20px 10px 15px;
  font-weight: 400;
}
.featured-item-01.ph {
  padding: 0 10px;
}
.featured-icon .icon {
  font-size: 70px;
  line-height: 1;
  margin: 0 0 10px;
  -ms-align-items: center;
  align-items: center;
  color: #002392;
}
.featured-icon h5 {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
  line-height: 1.2;
  color: #181818;
}
.featured-icon p {
  font-size: 16px;
  line-height: 1.2;
}
.featured-icon a {
  color: #fff;
}
.featured-icon a:hover {
  color: #0272E9;
}
/****************************
 ------- Product Tour -------
 ****************************/
 .introjs-overlay{
     position:absolute;
    box-sizing:content-box;
    z-index:999999;
    opacity:0;
    transition:all .3s ease-out 
}
 .introjs-showElement{
    z-index:9999999!important
}
tr.introjs-showElement>td{
    z-index:9999999!important;
    position:relative
}
tr.introjs-showElement>th{
    z-index:9999999!important;
    position:relative
}
.introjs-disableInteraction{
    z-index:99999999!important;
    position:absolute;
    background-color:#fff;
    opacity:0
}
.introjs-relativePosition{
    position:relative
}
.introjs-helperLayer{
    box-sizing:content-box;
    position:absolute;
    z-index:9999998;
    border-radius:4px;
    transition:all .3s ease-out
}
.introjs-helperLayer *{
    box-sizing:content-box
}
.introjs-helperLayer :before{
    box-sizing:content-box
}
.introjs-helperLayer :after{
    box-sizing:content-box
}
.introjs-tooltipReferenceLayer{
    font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif;
    box-sizing:content-box;
    position:absolute;
    visibility:hidden;
    z-index:100000000;
    background-color:transparent;
    transition:all .3s ease-out
}
.introjs-tooltipReferenceLayer *{
    font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif
}
.introjs-helperNumberLayer{
    font-family:"Helvetica Neue",Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif;
    color:#9e9e9e;
    text-align:center;
    padding-top:10px;
    padding-bottom:10px
}
.introjs-arrow{
    border:5px solid transparent;
    content:"";
    position:absolute
}
.introjs-arrow.top{
    top:-10px;
    left:10px;
    border-bottom-color:#fff
}
.introjs-arrow.top-right{
    top:-10px;
    right:10px;
    border-bottom-color:#fff
}
.introjs-arrow.top-middle{
    top:-10px;
    left:50%;
    margin-left:-5px;
    border-bottom-color:#fff
}
.introjs-arrow.right{
    right:-10px;
    top:10px;
    border-left-color:#fff
}
.introjs-arrow.right-bottom{
    bottom:10px;
    right:-10px;
    border-left-color:#fff
}
.introjs-arrow.bottom{
    bottom:-10px;
    left:10px;
    border-top-color:#fff
}
.introjs-arrow.bottom-right{
    bottom:-10px;
    right:10px;
    border-top-color:#fff
}
.introjs-arrow.bottom-middle{
    bottom:-10px;
    left:50%;
    margin-left:-5px;
    border-top-color:#fff
}
.introjs-arrow.left{
    left:-10px;
    top:10px;
    border-right-color:#fff
}
.introjs-arrow.left-bottom{
    left:-10px;
    bottom:10px;
    border-right-color:#fff
}
.introjs-tooltip{
    box-sizing:content-box;
    position:absolute;
    visibility:visible;
    background-color:#fff;
    min-width:250px;
    max-width:300px;
    border-radius: 0.5rem !important;
    box-shadow:0 3px 30px rgba(33,33,33,.3);
    transition:opacity .1s ease-out
}
.introjs-tooltiptext{
    padding:20px;
    font-size: 0.9rem;
    line-height: 1.5;
}
.introjs-dontShowAgain{
    padding-left:20px;
    padding-right:20px
}
.introjs-dontShowAgain input{
    padding:0;
    margin:0;
    margin-bottom:2px;
    display:inline;
    width:10px;
    height:10px
}
.introjs-dontShowAgain label{
    font-size:14px;
    display:inline-block;
    font-weight:400;
    margin:0 0 0 5px;
    padding:0;
    background-color:#fff;
    color:#616161;
    -webkit-user-select:none;
    user-select:none
}
.introjs-tooltip-title{
    font-size:18px;
    width:90%;
    min-height:1.5em;
    margin:0;
    padding:0;
    font-weight:700;
    line-height:1.5
}
.introjs-tooltip-header{
    position:relative;
    padding-left:20px;
    padding-right:20px;
    padding-top:10px;
    min-height:1.5em
}
.introjs-tooltipbuttons{
    border-top:1px solid transparent !important;
    padding:10px;
    text-align:right;
    white-space:nowrap
}
.introjs-tooltipbuttons:after{
    content:"";
    visibility:hidden;
    display:block;
    height:0;
    clear:both
}
.introjs-button{
    box-sizing:content-box;
    position:relative;
    overflow:visible;
    padding:.5rem 1rem;
    border:1px solid transparent !important;
    text-decoration:none;
    text-shadow: none !important;
    font-size:14px;
    font-weight: 500;
    color: inherit !important;
    white-space:nowrap;
    cursor:pointer;
    outline:0;
    /*background-color:#f4f4f4;*/
    background-color: none !important;
    background-image: linear-gradient(310deg, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%) !important;
    border-radius:.5rem !important;
    zoom:1;
    display:inline
}
.introjs-button:hover{
    outline:0;
    text-decoration:none;
    border-color:#9e9e9e;
    background-color:#e0e0e0;
    background-image: linear-gradient(310deg, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%);
    color:#212121
}
.introjs-button:focus{
    outline:0;
    text-decoration:none;
    /*background-color:#eee;*/
    background-color: none !important;
    background-image: linear-gradient(310deg, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%) !important;
    -webkit-box-shadow:0 0 0 .2rem rgba(37,196,242,0.8) !important;
    -moz-box-shadow:0 0 0 .2rem rgba(37,196,242,0.8) !important;
    -ms-box-shadow:0 0 0 .2rem rgba(37,196,242,0.8) !important;
    -o-box-shadow:0 0 0 .2rem rgba(37,196,242,0.8) !important;
    box-shadow:0 0 0 .2rem rgba(37,196,242,0.8) !important;
    border:1px solid #616161;
    color:#212121
}
.introjs-button:active{
    outline:0;
    text-decoration:none;
    background-color: none !important;
    /*background-color:#e0e0e0;*/
    background-image: linear-gradient(310deg, rgba(245,245,245,.1) 0%, rgba(229,231,235,.5) 100%) !important;
    border-color:#9e9e9e;
    color:#212121
}
.introjs-button::-moz-focus-inner{
    padding:0;
    border:0
}
.introjs-skipbutton{
    position:absolute;
    top:0;
    right:0;
    display:inline-block;
    width:45px;
    height:45px;
    line-height:45px;
    color:#616161;
    font-size:22px;
    cursor:pointer;
    font-weight:700;
    text-align:center;
    text-decoration:none
}
.introjs-skipbutton:focus,.introjs-skipbutton:hover{
    color:#212121;
    outline:0;
    text-decoration:none
}
.introjs-prevbutton{
    float:left;
}
.introjs-nextbutton{
    float:right;
}
.introjs-disabled{
    color:#9e9e9e;
    border-color:#bdbdbd;
    box-shadow:none;
    cursor:default;
    background-color:#f4f4f4;
    background-image:none;
    text-decoration:none
}
.introjs-disabled:focus,.introjs-disabled:hover{
    color:#9e9e9e;
    border-color:#bdbdbd;
    box-shadow:none;
    cursor:default;
    background-color:#f4f4f4;
    background-image:none;
    text-decoration:none
}
.introjs-hidden{
    display:none
}
.introjs-bullets{
    text-align:center;
    padding-top:10px;
    padding-bottom:10px
}
.introjs-bullets ul{
    box-sizing:content-box;
    clear:both;
    margin:0 auto 0;
    padding:0;
    display:inline-block
}
.introjs-bullets ul li{
    box-sizing:content-box;
    list-style:none;
    float:left;
    margin:0 2px
}
.introjs-bullets ul li a{
    transition:width .1s ease-in;
    box-sizing:content-box;
    display:block;
    width:6px;
    height:6px;
    background: transparent !important;
    background-image: linear-gradient(310deg, #21d4fd 0%, #21d4fd 100%) !important;
    border-radius:10px;
    text-decoration:none;
    cursor:pointer
}
.introjs-bullets ul li a:focus,.introjs-bullets ul li a:hover{
    width:15px;
    background: transparent !important;
    background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
    text-decoration:none;
    outline:0
}
.introjs-bullets ul li a.active{
    width:15px;
    background: transparent !important;
    background-image: linear-gradient(310deg, #082fbf 0%, #21d4fd 100%) !important;
}
.introjs-progress{
    box-sizing:content-box;
    overflow:hidden;
    height:10px;
    margin:10px;
    border-radius:4px;
    background-color:#e0e0e0
}
.introjs-progressbar{
    box-sizing:content-box;
    float:left;
    width:0%;
    height:100%;
    font-size:10px;
    line-height:10px;
    text-align:center;
    background-color:#08c
}
.introjsFloatingElement{
    position:absolute;
    height:0;
    width:0;
    left:50%;
    top:50%
}
.introjs-fixedTooltip{
    position:fixed;
    -webkit-box-shadow: rgb(37,196,242,0.9) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
    -moz-box-shadow: rgb(37,196,242,0.9) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
    -ms-box-shadow: rgb(37,196,242,0.9) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
    -o-box-shadow: rgb(37,196,242,0.9) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
    box-shadow: rgb(37,196,242,0.9) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
}
.introjs-hint{
    box-sizing:content-box;
    position:absolute;
    background:0 0;
    width:20px;
    height:15px;
    cursor:pointer
}
.introjs-hint:focus{
    border:0;
    outline:0
}
.introjs-hint:hover>.introjs-hint-pulse{
    background-color:rgba(60,60,60,.57)
}
.introjs-hidehint{
    display:none
}
.introjs-fixedhint{
    position:fixed
}
@keyframes introjspulse{
    0%{
        transform:scale(.95);
        box-shadow:0 0 0 0 rgba(0,0,0,.7)
    }
    70%{
        transform:scale(1);
        box-shadow:0 0 0 10px transparent
    }
    100%{
        transform:scale(.95);
        box-shadow:0 0 0 0 transparent
    }
}
.introjs-hint-pulse{
    box-sizing:content-box;
    width:15px;
    height:15px;
    border-radius:30px;
    background-color:rgba(136,136,136,.24);
    z-index:10;
    position:absolute;
    transition:all .2s ease-out;
    animation:introjspulse 2s infinite
}
.introjs-hint-no-anim .introjs-hint-pulse{
    animation:none
}
.introjs-hint-dot{
    box-sizing:content-box;
    background:0 0;
    border-radius:60px;
    height:50px;
    width:50px;
    position:absolute;
    top:-18px;
    left:-18px;
    z-index:1;
    opacity:0
}
.introjs-dontShowAgain label {
    font-size: 14px;
    display: inline-block;
    font-weight: 400;
    margin: 0 0 0 5px;
    padding: 0;
    background-color: #fff;
    color: inherit;
    -webkit-user-select: none;
    user-select: none;
}
.highlighted-dt-row{
  background-color: rgba(37,196,242,0.4);
}