hr.fade-out {
  margin-top: 40px;
  margin-bottom: 40px;
  display: block;
  border: none;
  color: white;
  height: 2px;
  background: black;
  background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 250, from(#176E8A), to(#fff));
}

.footer{
    background-color: white;
    color: #505050;
    padding: 5%;
}

.footer > div > ul {
    list-style: none; padding-left: 0;
}

.footer-item-header {
    color: #404040;
    font-weight: 600;
    font-size: 18px;
    padding-bottom: 15px;
}

.footer-item-text, footer-item-text:hover {
    color: #505050;
    font-weight: 400;
    font-size: 16px;
    text-decoration: none!important;
}

.section {
  display: table;
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 40px;
  clear: both;
}

h2.section-title {
  padding-top: 10px;
  padding-bottom: 20px;
  color: #202020;
  text-align: left;
}

.list-disc {
    list-style-type: disc;
}

.list-upper-alpha {
    list-style-type: upper-alpha;
}

.list-upper-roman {
    list-style-type: upper-roman;
}

.text-404040 {
    color: #404040;
}

.text-505050 {
    color: #505050;
}

.text-707070 {
    color: #707070;
}

.text-a0a0a0 {
    color: #A0A0A0;
}

.brown-text {
    color: #987554;
}

.cyan-green-text {
    color: #059142;
}

.dark-green-text {
    color: #0A5E2A;
}

.green-text-important {
    color: #32CD32!important;
}

.grey-text {
    color: #606060;
}

.kelly-green-text {
    color: #4CBB17;
}

.light-black-text {
    color: #202020;
}

.light-blue-text {
    color: #89CFF0;
}

.orange-text {
    color: #FF6347;
}

.prussian-blue-text {
    color: #003152;
}

.red-text {
    color: #C82424;
}

.resource-text {
    color: #3792CB;
}

.site-text {
  color: #111111;
  font-size: 15px;
}

.status-dashboard-incident-orange-text {
    color: #FF4D00;
}

.white-text {
    color: #FFFFFF;
}

.yellow-text {
    color: #FFCE1B;
}

.bold-blue-text {
  color: #176E8A;
  font-weight: 600;
}

.accordion {
  background-color: #FFFFFF;
  color: #606060;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  outline: none;
  transition: 0.4s;
}

.panel {
  padding: 40px;
  display: none;
  background-color: white;
  overflow: hidden;
  font-size: 14px;
  font-color: #606060;
}

.dashboard-body {
    background-color: #FFFFFF;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.grey-border {
    border-color: #909090!important;
}

.grey-input {
    border-color: #808080;
    font-size: 14px;
}

.light-grey-border {
    border-color: #D0D0D0!important;
}

.beige-bg {
    background-color: #FFF8DC;
}

.caption-bg {
    background-color: #FAFAFA;
}

.dark-grey-bg {
    background-color: #464E51;
}

.dashboard-topbar-bg {
    background-color: #36454F;
}

.deep-blue-bg {
    background-color: #23395D;
}

.full-metal-bg {
    background: linear-gradient(to bottom, #D5DEE7 0%, #E8EBF2 50%, #E2E7ED 100%),
        linear-gradient(to bottom, rgba(0,0,0,0.02) 50%, rgba(255,255,255,0.02) 61%, rgba(0,0,0,0.02) 73%),
        linear-gradient(33deg, rgba(255,255,255,0.20) 0%, rgba(0,0,0,0.20) 100%);
    background-blend-mode: normal,color-burn;
}

.indigo-bg {
    background-color: #6B7FA9;
}

.e0e0e0-bg {
    background-color: #E0E0E0;
}

/*************************/
.info-financial-services-bg {
    background: #188692;
    background: linear-gradient(135deg, #188692, #53DE96);
}

.info-government-bg {
    background: #363A30;
    background: linear-gradient(135deg, #363A30, #4598AD);
}

.info-health-care-bg {
    background: #3093A2;
    background: linear-gradient(135deg, #3093A2, #22DDFD);
}

.info-industrial-plants-bg {
    background: #DA7F5F;
    background: linear-gradient(135deg, #DA7F5F, #EEEE28);
}

.info-integrations-bg {
    background: #9C55D1;
    background: linear-gradient(135deg, #9C55D1, #2649BD);
}

.info-retail-bg {
    background: #E6315C;
    background: linear-gradient(135deg, #E6315C, #BA6111);
}

.info-blue-arrow-pattern-bg {
    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 200 200'%3E%3Cpolygon fill='%23DCEFFA' points='100 0 0 100 100 100 100 200 200 100 200 0'/%3E%3C/svg%3E");
}

.info-brown-bg {
    background-color: #D3B683; /*#BBAA99;*/
}

.info-yellow-cubes-pattern-bg {
	--sz: 10px; /*** size ***/
	--c0: #3a1b0f;
	--c1: #ffc56f;
    --c2: #d99838;
    --c3: #9b5e05;
    --ts: 50%/ calc(var(--sz) * 12.8) calc(var(--sz) * 22);
    background:
        /*bottom*/
        conic-gradient(from 120deg at 50% 86.5%, var(--c1) 0 120deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from 120deg at 50% 86.5%, var(--c1) 0 120deg, #fff0 0 360deg) var(--ts),
        /*bottom dark*/
        conic-gradient(from 120deg at 50% 74%, var(--c0) 0 120deg, #fff0 0 360deg) var(--ts),
        /*right*/
        conic-gradient(from 60deg at 60% 50%, var(--c1) 0 60deg, var(--c2) 0 120deg, #fff0 0 360deg) var(--ts),
        /*left*/
        conic-gradient(from 180deg at 40% 50%, var(--c3) 0 60deg, var(--c1) 0 120deg, #fff0 0 360deg) var(--ts),
        /*top dark*/
        conic-gradient(from 0deg at 90% 35%, var(--c0) 0 90deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from -90deg at 10% 35%, var(--c0) 0 90deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from 0deg at 90% 35%, var(--c0) 0 90deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from -90deg at 10% 35%, var(--c0) 0 90deg, #fff0 0 360deg) var(--ts),
        /*top*/
        conic-gradient(from -60deg at 50% 13.5%, var(--c1) 0 120deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from -60deg at 50% 13.5%, var(--c1) 0 120deg, #fff0 0 360deg) var(--ts),
        conic-gradient(from -60deg at 50% 41%, var(--c2) 0 60deg, var(--c3) 0 120deg, #fff0 0 360deg) var(--ts), var(--c0);
}

.info-brown-triangle-pattern-bg {
    background-color: #FFF8DC;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='200' viewBox='0 0 160 80'%3E%3Cg fill='%23B0A090' %3E%3Cpolygon points='0 10 0 0 10 0'/%3E%3Cpolygon points='0 40 0 30 10 30'/%3E%3Cpolygon points='0 30 0 20 10 20'/%3E%3Cpolygon points='0 70 0 60 10 60'/%3E%3Cpolygon points='0 80 0 70 10 70'/%3E%3Cpolygon points='50 80 50 70 60 70'/%3E%3Cpolygon points='10 20 10 10 20 10'/%3E%3Cpolygon points='10 40 10 30 20 30'/%3E%3Cpolygon points='20 10 20 0 30 0'/%3E%3Cpolygon points='10 10 10 0 20 0'/%3E%3Cpolygon points='30 20 30 10 40 10'/%3E%3Cpolygon points='20 20 20 40 40 20'/%3E%3Cpolygon points='40 10 40 0 50 0'/%3E%3Cpolygon points='40 20 40 10 50 10'/%3E%3Cpolygon points='40 40 40 30 50 30'/%3E%3Cpolygon points='30 40 30 30 40 30'/%3E%3Cpolygon points='40 60 40 50 50 50'/%3E%3Cpolygon points='50 30 50 20 60 20'/%3E%3Cpolygon points='40 60 40 80 60 60'/%3E%3Cpolygon points='50 40 50 60 70 40'/%3E%3Cpolygon points='60 0 60 20 80 0'/%3E%3Cpolygon points='70 30 70 20 80 20'/%3E%3Cpolygon points='70 40 70 30 80 30'/%3E%3Cpolygon points='60 60 60 80 80 60'/%3E%3Cpolygon points='80 10 80 0 90 0'/%3E%3Cpolygon points='70 40 70 60 90 40'/%3E%3Cpolygon points='80 60 80 50 90 50'/%3E%3Cpolygon points='60 30 60 20 70 20'/%3E%3Cpolygon points='80 70 80 80 90 80 100 70'/%3E%3Cpolygon points='80 10 80 40 110 10'/%3E%3Cpolygon points='110 40 110 30 120 30'/%3E%3Cpolygon points='90 40 90 70 120 40'/%3E%3Cpolygon points='10 50 10 80 40 50'/%3E%3Cpolygon points='110 60 110 50 120 50'/%3E%3Cpolygon points='100 60 100 80 120 60'/%3E%3Cpolygon points='110 0 110 20 130 0'/%3E%3Cpolygon points='120 30 120 20 130 20'/%3E%3Cpolygon points='130 10 130 0 140 0'/%3E%3Cpolygon points='130 30 130 20 140 20'/%3E%3Cpolygon points='120 40 120 30 130 30'/%3E%3Cpolygon points='130 50 130 40 140 40'/%3E%3Cpolygon points='120 50 120 70 140 50'/%3E%3Cpolygon points='110 70 110 80 130 80 140 70'/%3E%3Cpolygon points='140 10 140 0 150 0'/%3E%3Cpolygon points='140 20 140 10 150 10'/%3E%3Cpolygon points='140 40 140 30 150 30'/%3E%3Cpolygon points='140 50 140 40 150 40'/%3E%3Cpolygon points='140 70 140 60 150 60'/%3E%3Cpolygon points='150 20 150 40 160 30 160 20'/%3E%3Cpolygon points='150 60 150 50 160 50'/%3E%3Cpolygon points='140 70 140 80 150 80 160 70'/%3E%3C/g%3E%3C/svg%3E");
}

.info-green-square-pattern-bg {
    background-color: #487346;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg %3E%3Cpolygon fill='%234c8e43' points='100 57.1 64 93.1 71.5 100.6 100 72.1'/%3E%3Cpolygon fill='%236aac5f' points='100 57.1 100 72.1 128.6 100.6 136.1 93.1'/%3E%3Cpolygon fill='%234c8e43' points='100 163.2 100 178.2 170.7 107.5 170.8 92.4'/%3E%3Cpolygon fill='%236aac5f' points='100 163.2 29.2 92.5 29.2 107.5 100 178.2'/%3E%3Cpath fill='%2389CC7C' d='M100 21.8L29.2 92.5l70.7 70.7l70.7-70.7L100 21.8z M100 127.9L64.6 92.5L100 57.1l35.4 35.4L100 127.9z'/%3E%3Cpolygon fill='%23768c3a' points='0 157.1 0 172.1 28.6 200.6 36.1 193.1'/%3E%3Cpolygon fill='%2396ac58' points='70.7 200 70.8 192.4 63.2 200'/%3E%3Cpolygon fill='%23B6CC76' points='27.8 200 63.2 200 70.7 192.5 0 121.8 0 157.2 35.3 192.5'/%3E%3Cpolygon fill='%2396ac58' points='200 157.1 164 193.1 171.5 200.6 200 172.1'/%3E%3Cpolygon fill='%23768c3a' points='136.7 200 129.2 192.5 129.2 200'/%3E%3Cpolygon fill='%23B6CC76' points='172.1 200 164.6 192.5 200 157.1 200 157.2 200 121.8 200 121.8 129.2 192.5 136.7 200'/%3E%3Cpolygon fill='%23768c3a' points='129.2 0 129.2 7.5 200 78.2 200 63.2 136.7 0'/%3E%3Cpolygon fill='%23B6CC76' points='200 27.8 200 27.9 172.1 0 136.7 0 200 63.2 200 63.2'/%3E%3Cpolygon fill='%2396ac58' points='63.2 0 0 63.2 0 78.2 70.7 7.5 70.7 0'/%3E%3Cpolygon fill='%23B6CC76' points='0 63.2 63.2 0 27.8 0 0 27.8'/%3E%3C/g%3E%3C/svg%3E");
}

.info-octagon-pattern-bg {
  --s: 120px; /* control the size */
  --c1: #4E395D;
  --c2: #8EBE94;
  --_g:var(--c1) 15%,var(--c2) 0 28%,#0000 0 72%,var(--c2) 0 85%,var(--c1) 0;
  background:
    conic-gradient(from 90deg at 2px 2px,#0000 25%,var(--c1) 0) -1px -1px,
    linear-gradient(-45deg,var(--_g)),linear-gradient(45deg,var(--_g)),
    conic-gradient(from 90deg at 40% 40%,var(--c1) 25%,var(--c2) 0) calc(var(--s)/-5) calc(var(--s)/-5);
  background-size: var(--s) var(--s);
}

.info-orange-wall-pattern-bg {
    background-color: #ee5522;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 200 200'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='100' y1='33' x2='100' y2='-3'%3E%3Cstop offset='0' stop-color='%23000' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='100' y1='135' x2='100' y2='97'%3E%3Cstop offset='0' stop-color='%23000' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='%23d23d09' fill-opacity='0.6'%3E%3Crect x='100' width='100' height='100'/%3E%3Crect y='100' width='100' height='100'/%3E%3C/g%3E%3Cg fill-opacity='0.5'%3E%3Cpolygon fill='url(%23a)' points='100 30 0 0 200 0'/%3E%3Cpolygon fill='url(%23b)' points='100 100 0 130 0 100 200 100 200 130'/%3E%3C/g%3E%3C/svg%3E");
}

.info-blue-purple-gradient-bg {
    background: #E87091;
    background: linear-gradient(135deg, #E87091, #58A1BE);
}

.info-dark-blue-section-bg {
    background-color: #033F63;
}

.info-green-section-bg {
    background-color: #32CD32;
}

.info-light-blue-section-bg {
    background-color: #6EC5E9;
}

.info-orange-section-bg {
    background-color: #FF6700;
}

.info-purple-section-bg {
    background-color: #800080;
}

.info-red-section-bg {
    background-color: #FF1818;
}

.info-sherpa-blue-section-bg {
    background-color: #014D4E;
}

.info-soft-green-section-bg {
    background-color: #0ABD6C;
}

.info-yellow-section-bg {
    background-color: #FFBF00;
}

.kelly-green-bg {
    background-color: #4CBB17;
}

.light-grey-bg {
    background-color: #EAEAEA !important;
}

.light-slate-bg {
    background-color: #E2E9F3;
}

.orange-bg {
    background-color: #FF6C2F;
}

.purple-1-bg {
    background-color: #F5E1FD;
}

.purple-2-bg {
    background-color: #EFBBFF;
}

.purple-3-bg {
    background-color: #EE82EE;
}

.purple-4-bg {
    background-color: #BE29EC;
}

.sea-mist-green-bg {
    background-color: #C1E1C1;
}

.silver-bg {
    background-color: #C0C0C0;
}

.soft-grass-bg {
    background-image: linear-gradient(to top, #c1dfc4 0%, #deecdd 0%);
}

.start-trial-html-bg {
    background: #E0EAFC;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #CFDEF3, #E0EAFC);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #CFDEF3, #E0EAFC); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.status-dashboard-bg {
    background-color: #FFFAF1;
}

.status-dashboard-incident-orange-bg {
    background-color: #FF4D00;
}

.status-dashboard-subscription-grey-bg {
    background-color: #F9F9F9;
}

.sub-segment-bg {
    background-color: #EDEDED;
}

.transparent-bg {
    background-color: transparent;
}

.white-bg {
    background-color: white !important;
}

.info-blue-gradient-bg {
    background: rgb(116,116,191);
    background: linear-gradient(168deg, rgba(116,116,191,1) 0%, rgba(52,138,199,1) 99%);
    background-size: 100%;
    margin: 0px;
    overflow: hidden;
}


.pg-back-text {
    color: #909090;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    display: block;
    margin-bottom: 15px;
}

.pg-back-text > a {
    color: #909090;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.green-input {
    border-color: #23DC00;
    font-size: 14px;
}

.feather-13 {
    height: 13px;
    width: 13px;
}

.feather-15 {
    height: 15px;
    width: 15px;
}

.feather-16 {
    height: 16px;
    width: 16px;
}

.feather-18 {
    height: 18px;
    width: 18px;
}

.feather-20 {
    height: 20px;
    width: 20px;
}

.feather-24 {
    height: 24px;
    width: 24px;
}
.feather-30 {
    height: 30px;
    width: 30px;
}
.feather-40 {
    height: 40px;
    width: 40px;
}
.feather-50 {
    height: 50px;
    width: 50px;
}
.feather-100 {
    height: 100px;
    width: 100px;
}
.feather-63w-50h {
    height: 50px;
    width: 63px;
}
.feather-88w-30h {
    height: 30px;
    width: 88px;
}
.feather-106w-60h {
    height: 60px;
    width: 106px;
}

.table-border-custom {
    border: 1px solid #C2C2C2!important;
}

.table-header {
    height: 40px;
    color: #444444;
    font-size: 13px;
    font-weight: 700;
    padding: .35em 1em;
    border-radius: 3px;
    background-color: #FFFFFF;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));
    text-shadow: 0 1px 1px rgba(255,255,255,.7);
    box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7);
}

.table-header-sm {
    height: auto!important;
    font-size: 13px!important;
    padding-top: 8px!important;
    padding-bottom: 8px!important;
}

.table-header > td {
    vertical-align: middle;
}


.table-header-blue {
    font-size: 13px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #007D8C;
}

.table-row {
    font-size: 12px;
    font-weight: 500;
    color: #606060;
}

.table-row > td {
    padding-right: 3px;
}

.incident-title {
    color: #FF6347;
    font-size: 14px;
    font-weight: 700;
}

.blue-text {
    color: #007D8C;
    font-size: 12px;
}

.light-blue-text {
    color: #399cbd;
}

.bold {
    font-weight: bold;
}

.semi-bold {
    font-weight: 700;
}

.bold-600 {
    font-weight: 600;
}

.bold-500 {
    font-weight: 500;
}

.bold-400 {
    font-weight: 400;
}

.blue-header {
    color: #007D8C;
    font-size: 14px;
    font-weight: bold;
}

.side-tab {
    background-color: white;
    border: 1px #B0B0B0 solid;
    margin-bottom: 10px;
}

.h-class {
    font-weight: 600;
    color: #007D8C;
}

a, .h-class > a, .h-class > a:hover {
    text-decoration: none;
    color: #007D8C;
}

.inline-tab {
    color: #007D8C;
    font-size: 12px;
    min-width: 120px;
}

.message-bar {
    text-align: left;
    border: 0px;
    background-color: white;
    width: 100%;
}

.small-sectional {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 3%;
    max-width: 500px;
    border: 1px solid #D0D0D0;
    border-radius: 5px;
    background-color: #FFFFFF;
}

.small-sectional-footer {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 1%;
    max-width: 500px;
}

.info-label {
    font-size: 15px;
    color: #606060;
}

.header-label {
    color: #176E8A;
    margin-bottom: 18px;
}

.size-10 {
    font-size: 10px;
}

.size-11 {
    font-size: 11px;
}

.size-12 {
    font-size: 12px;
}

.size-13 {
    font-size: 13px;
}

.size-14 {
    font-size: 14px;
}

.size-15 {
    font-size: 15px;
}

.size-16 {
    font-size: 16px;
}

.size-18 {
    font-size: 18px;
}

.size-20 {
    font-size: 20px;
}

.size-22 {
    font-size: 22px;
}

.size-24 {
    font-size: 24px;
}

.size-26 {
    font-size: 26px;
}

.size-30 {
    font-size: 30px;
}

.size-36 {
    font-size: 36px;
}

.size-40 {
    font-size: 40px;
}

.size-45 {
    font-size: 45px;
}

.size-50 {
    font-size: 50px;
}

.stroke-1 {
    stoke-width: 1;
}

.stroke-4 {
    stroke-width: 4;
}

.date-box {
    font-size: 12px;
    border: 1px solid #808080;
}

.positive-metric {
    font-size: 15px;
    font-weight: bold;
    color: #4CBB17;
}

.negative-metric {
    font-size: 15px;
    font-weight: bold;
    color: #C00000;
}

.warning-metric {
    font-size: 15px;
    font-weight: bold;
    color: orange;
}

.bold-metric {
    font-size: 15px;
    font-weight: bold;
}

.emphasized-col-text {
    color: #3792CB;
    font-weight: 600;
}

.user-metric-panel {
    background-color: #176E8A;
    color: white;
    font-size: 13px;
    border-radius: 5px 5px 0px 0px;
    padding: 5px;
    text-align: center;
}

.user-metric-text {
    text-align: center;
    color: #176E8A;
    font-size: 30px;
}

.grey-metric-panel-header {
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    height: 20px;
}

.dropdown-body > ul > li:hover {
    background-color: #ECECEC;
    color: #111111;
}

.small-input {
    max-height: 25px;
}


input[type="time"]::-webkit-clear-button,
input[type="time"]::-webkit-inner-spin-button,
input[type="time"]::-webkit-outer-spin-button {
    display: none;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    display: none;
}

.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('/static/images/Preloader_11.gif') center no-repeat #fff;
}

.cell-border-green {
    border-left: 5px solid #059142;
    padding-left: 10px;
}

.cell-border-red {
    border-left: 5px solid #DD0000;
    padding-left: 10px;
}

.cell-border-yellow {
    border-left: 5px solid #FCE205;
    padding-left: 10px;
}

.cell-border-grey {
    border-left: 5px solid #909090;
    padding-left: 10px;
}

.cell-border-grey-sm {
    border-left: 2px solid #606060;
}

.cell-border-top-light-grey {
    border-top: 1px #A0A0A0 solid;
}

.cell-border-blue {
    border-left: 5px solid #4C3EFF;
    padding-left: 10px;
}

.custom-mb-25 {
    margin-bottom: 25px;
}

.input-fixed-size {
    max-height: 30px;
    max-width: 400px;
}

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

/*---------------------------
  Tables
---------------------------*/

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

.no-decoration {
    text-decoration: none!important;
}

.tc-rounded-10 {
    border-radius: 10px;
}

@media only screen and (max-device-width: 480px) {
    .tc-border-left-grey-2 {
        border-left: 0px;
    }
}
@media only screen and (min-device-width: 481px){
    .tc-border-left-grey-2 {
        border-left: 2px solid #606060;
    }
}

.green-link {
    color: #059142;
    text-decoration: none;
}

.red-link {
    color: #D62828;
    text-decoration: none;
}


/*---------------------------
    Opacity, Width, Height
---------------------------*/

.tc-opacity-10 {
    opacity: 0.10;
}

.tc-width-auto {
    width: auto;
}

.tc-width-50 {
    width: 50px;
}

.tc-width-60 {
    width: 60px;
}

.tc-width-70 {
    width: 70px;
}

.tc-width-80 {
    width: 80px;
}

.tc-width-100 {
    width: 100px;
}

.tc-width-110 {
    width: 110px;
}

.tc-width-120 {
    width: 120px;
}

.tc-width-130 {
    width: 130px;
}

.tc-width-150 {
    width: 150px;
}

.tc-width-160 {
    width: 160px;
}

.tc-width-180 {
    width: 180px;
}

.tc-width-200 {
    width: 200px;
}

.tc-width-220 {
    width: 220px;
}

.tc-width-perc-9 {
    width: 9%;
}

.tc-width-perc-11 {
    width: 11%;
}

.tc-width-perc-12 {
    width: 12%;
}

.tc-width-perc-14 {
    width: 14%;
}

.tc-width-perc-15 {
    width: 15%;
}

.tc-width-perc-20 {
    width: 20%;
}

.tc-width-perc-28 {
    width: 28%;
}

.tc-width-perc-30 {
    width: 30%;
}

.tc-width-perc-35 {
    width: 35%;
}

.tc-width-perc-40 {
    width: 40%;
}

.tc-width-perc-50 {
    width: 50%;
}

.tc-width-perc-60 {
    width: 60%;
}

.tc-width-perc-70 {
    width: 70%;
}

.tc-width-perc-80 {
    width: 80%;
}

.tc-width-perc-85 {
    width: 85%;
}

.tc-width-perc-100 {
    width: 100%;
}

.tc-min-width-40 {
    min-width: 40px;
}

.tc-min-width-80 {
    min-width: 80px;
}

.tc-min-width-100 {
    min-width: 100px;
}

.tc-min-width-120 {
    min-width: 120px;
}

.tc-min-width-150 {
    min-width: 150px;
}

.tc-min-width-180 {
    min-width: 180px;
}

.tc-min-width-200 {
    min-width: 200px;
}


.tc-min-width-250 {
    min-width: 250px;
}

.tc-min-width-400 {
    min-width: 400px;
}

.tc-max-width-40 {
    max-width: 40px;
}

.tc-max-width-45 {
    max-width: 45px;
}

.tc-max-width-60 {
    max-width: 60px;
}

.tc-max-width-70 {
    max-width: 70px;
}

.tc-max-width-80 {
    max-width: 80px;
}

.tc-max-width-100 {
    max-width: 100px;
}

.tc-max-width-120 {
    max-width: 120px;
}

.tc-max-width-150 {
    max-width: 150px;
}

.tc-max-width-160 {
    max-width: 160px;
}

.tc-max-width-180 {
    max-width: 180px;
}

.tc-max-width-200 {
    max-width: 200px;
}

.tc-max-width-240 {
    max-width: 240px;
}

.tc-max-width-250 {
    max-width: 250px;
}

.tc-max-width-300 {
    max-width: 300px;
}

.tc-max-width-500 {
    max-width: 500px;
}

.tc-max-width-800 {
    max-width: 800px;
}

.tc-max-width-perc-40 {
    max-width: 40%;
}

.tc-max-width-perc-45 {
    max-width: 45%;
}

.tc-max-width-perc-50 {
    max-width: 50%;
}

.tc-max-width-perc-60 {
    max-width: 60%;
}

.tc-max-width-perc-70 {
    max-width: 70%;
}

.tc-max-width-perc-75 {
    max-width: 75%;
}

.tc-max-width-perc-80 {
    max-width: 80%;
}

.tc-max-width-perc-90 {
    max-width: 90%;
}

.tc-max-width-perc-100 {
    max-width: 100%;
}

.tc-height-auto {
    height: auto;
}

.tc-height-10 {
    height: 10px;
}

.tc-height-25 {
    height: 25px;
}

.tc-height-30 {
    height: 30px;
}

.tc-height-34 {
    height: 34px;
}

.tc-height-40 {
    height: 40px;
}

.tc-height-42 {
    height: 42px;
}

.tc-height-45 {
    height: 45px;
}

.tc-height-50 {
    height: 50px;
}

.tc-height-55 {
    height: 55px;
}

.tc-height-60 {
    height: 60px;
}

.tc-height-70 {
    height: 70px;
}

.tc-height-100 {
    height: 100px;
}

.tc-height-110 {
    height: 110px;
}

.tc-height-150 {
    height: 150px;
}

.tc-height-180 {
    height: 180px;
}

.tc-height-200 {
    height: 200px;
}

.tc-height-250 {
    height: 250px;
}

.tc-height-300 {
    height: 300px;
}

.tc-height-100-vh {
    height: 100vh;
}

.tc-min-height-40 {
    min-height: 40px;
}

.tc-min-height-50 {
    min-height: 50px;
}

.tc-min-height-250 {
    min-height: 250px;
}

.tc-min-height-400 {
    min-height: 400px;
}

.tc-max-height-perc-100 {
    max-height: 100%;
}

.tc-height-perc-80 {
    height: 80%;
}

.tc-height-perc-90 {
    height: 90%;
}

.tc-height-perc-100 {
    height: 100%;
}

.tc-line-height-25 {
    line-height: 25px;
}

.tc-line-height-60 {
    line-height: 60px;
}

.tc-line-height-100 {
    line-height: 100px;
}

.tc-cursor {
    cursor: pointer;
}

.tc-word-break-all {
    word-break: break-all;
}

.tc-object-fit-cover {
    object-fit: cover;
}

.z-index-1 {
    z-index: 1;
}

.z-index-2 {
    z-index: 2;
}

.z-index-1020 {
    z-index: 1020;
}


.tc-pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}


/*---------------------------
  Blogs, Templates
---------------------------*/
.blog-banner-img {
    height: 250px;
    background-size: cover!important;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 5px 5px 0 0;
}

.blog-banner-img-on-call-management {
    background: url('https://taskcallapp.com/images/blog/MultipleSupportTeamOnPhone.jpg');
}

.blog-banner-img-incident-response {
    background: url('https://taskcallapp.com/images/blog/FloatingScreensSecurity.jpg');
}

.blog-banner-img-live-call-routing {
    background: url('https://taskcallapp.com/images/info-site/web-snapshots/analytics/AnalyticsLiveCalls.png');
}

.blog-banner-holder {
    height: 350px;
    color: white;
    background-color: #708090;
    border-radius: 0 0 5px 5px;
}

.support-email-holder {
    width: 300px;
    background-color: #DDDDDD;
    border-radius: 5px;
}

.tutorials-html-bg {
    margin-top: 60px;
    padding-top: 100px;
    padding-bottom: 100px;
    background: rgb(144,238,144);
    background: linear-gradient(135deg, rgba(144,238,144,1) 0%, rgba(50,205,50,1) 35%, rgba(76,187,23,1) 100%);
}

.tutorials-frame {
    object-fit: cover;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
}

.green-underline {
    color: #008000;
    text-decoration: underline;
}

.cookie-container {
    position: fixed;
    left: 20px;
    bottom: 20px;
    right: 10px;
    background-color: white;
    border-radius: 5px;
    max-width: 600px;
    z-index: 2048;
}


.blog-font {
    font-family: Arial, Helvetica, sans-serif;
}

.blog-title-box {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.blog-title {
    padding-top: 15px;
    padding-bottom: 15px;
    color: #404040;
    text-align: left;
    font-weight: 400;
    font-size: 48px;
}

.blog-subtitle {
    color: #404040;
    font-size: 14px;
    font-weight: 400;
}

.blog-text {
    color: #505050;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 400;
}

.blog-section-header {
    font-weight: 600;
    font-size: 20px;
    padding-top: 20px;
    padding-bottom: 10px;
}

.similar-blog-textbox {
    position: relative;
    height: 350px;
    color: white;
    background-color: #708090;
    border-radius: 0 0 5px 5px;
}

.similar-blog-footer {
    position: absolute;
    bottom: 15px;
}


/*****************************
    Common info page styles
*****************************/

@media only screen and (max-device-width: 480px) {
    #show-mobile {
        display: block;
    }
    #hide-mobile {
        display: none;
    }
}

@media only screen and (min-device-width: 481px) {
    #show-mobile {
        display: none;
    }
    #hide-mobile {
        display: block;
    }
}

.tick-span {
    color: #32CD32;
    font-size: 14px;
}

.cross-span {
    color: #C82424;
    font-size: 14px;
}

.web-sub-text {
    text-align: center;
    font-size: 13px;
}

.card-frame-div {
    background-color: white;
    padding: 0px;
    border-radius: 10px 10px 0px 0px;
    border: 1px solid #23DC00;
}

.card-header-div {
    background-color: white;
    border-radius: 10px;
}

.card-header-text {
    padding: 15px;
    color: #4CBB17;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.card-fee-text {
    color: black;
    text-align: center;
    float: left;
}

.card-unit-text {
    color: black; padding: 10;
    font-size: 14;
    text-align: center;
}

.btn-card-details {
    color: white;
    font-weight: bold;
    padding: 10px;
}

.zoom-effect {
    overflow: hidden;
}

.zoom-effect img {
    transition: all 0.5s ease-in;
}

.zoom-effect:hover img {
    transform: scale(1.2);
}


/**************
    Top Bar
**************/

@media only screen and (max-device-width: 992px) {
    #navMain {
        background-color: white; border-bottom: 1px solid #E3E3E3; min-height: 70px;
    }
    .sub-menu {
        background-color: white;
        z-index: 1;
        margin-top: 20px;
        max-height: 400px;
        height: auto;
        overflow-y: scroll;
    }
    .submenu-desc-section-bg {
        background-color: #C1E1C1;
    }
    .hide-mobile {
        display: none;
    }
    .show-mobile {
        display: block;
    }
}

@media only screen and (min-device-width: 993px) {
    #navMain {
        background-color: white; border-bottom: 1px solid #E3E3E3; height: 70px;
    }
    .sub-menu {
        background-color: white;
        position: absolute;
        z-index: 1;
        min-width: 1000px;
        margin-top: 20px;
    }
    .submenu-desc-section-bg {
        background-color: #C1E1C1;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1500'%3E%3Cdefs%3E%3Crect stroke='%23C1E1C1' stroke-width='.5' width='1' height='1' id='s'/%3E%3Cpattern id='a' width='3' height='3' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cuse fill='%23bfdfbf' href='%23s' y='2'/%3E%3Cuse fill='%23bfdfbf' href='%23s' x='1' y='2'/%3E%3Cuse fill='%23bddcbd' href='%23s' x='2' y='2'/%3E%3Cuse fill='%23bddcbd' href='%23s'/%3E%3Cuse fill='%23bbdabb' href='%23s' x='2'/%3E%3Cuse fill='%23bbdabb' href='%23s' x='1' y='1'/%3E%3C/pattern%3E%3Cpattern id='b' width='7' height='11' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23b9d8b9'%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' y='5' /%3E%3Cuse href='%23s' x='1' y='10'/%3E%3Cuse href='%23s' x='2' y='1'/%3E%3Cuse href='%23s' x='2' y='4'/%3E%3Cuse href='%23s' x='3' y='8'/%3E%3Cuse href='%23s' x='4' y='3'/%3E%3Cuse href='%23s' x='4' y='7'/%3E%3Cuse href='%23s' x='5' y='2'/%3E%3Cuse href='%23s' x='5' y='6'/%3E%3Cuse href='%23s' x='6' y='9'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='h' width='5' height='13' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23b9d8b9'%3E%3Cuse href='%23s' y='5'/%3E%3Cuse href='%23s' y='8'/%3E%3Cuse href='%23s' x='1' y='1'/%3E%3Cuse href='%23s' x='1' y='9'/%3E%3Cuse href='%23s' x='1' y='12'/%3E%3Cuse href='%23s' x='2'/%3E%3Cuse href='%23s' x='2' y='4'/%3E%3Cuse href='%23s' x='3' y='2'/%3E%3Cuse href='%23s' x='3' y='6'/%3E%3Cuse href='%23s' x='3' y='11'/%3E%3Cuse href='%23s' x='4' y='3'/%3E%3Cuse href='%23s' x='4' y='7'/%3E%3Cuse href='%23s' x='4' y='10'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='c' width='17' height='13' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23b7d5b7'%3E%3Cuse href='%23s' y='11'/%3E%3Cuse href='%23s' x='2' y='9'/%3E%3Cuse href='%23s' x='5' y='12'/%3E%3Cuse href='%23s' x='9' y='4'/%3E%3Cuse href='%23s' x='12' y='1'/%3E%3Cuse href='%23s' x='16' y='6'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='d' width='19' height='17' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23C1E1C1'%3E%3Cuse href='%23s' y='9'/%3E%3Cuse href='%23s' x='16' y='5'/%3E%3Cuse href='%23s' x='14' y='2'/%3E%3Cuse href='%23s' x='11' y='11'/%3E%3Cuse href='%23s' x='6' y='14'/%3E%3C/g%3E%3Cg fill='%23b5d3b5'%3E%3Cuse href='%23s' x='3' y='13'/%3E%3Cuse href='%23s' x='9' y='7'/%3E%3Cuse href='%23s' x='13' y='10'/%3E%3Cuse href='%23s' x='15' y='4'/%3E%3Cuse href='%23s' x='18' y='1'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='e' width='47' height='53' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23F60'%3E%3Cuse href='%23s' x='2' y='5'/%3E%3Cuse href='%23s' x='16' y='38'/%3E%3Cuse href='%23s' x='46' y='42'/%3E%3Cuse href='%23s' x='29' y='20'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='f' width='59' height='71' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23F60'%3E%3Cuse href='%23s' x='33' y='13'/%3E%3Cuse href='%23s' x='27' y='54'/%3E%3Cuse href='%23s' x='55' y='55'/%3E%3C/g%3E%3C/pattern%3E%3Cpattern id='g' width='139' height='97' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'%3E%3Cg fill='%23F60'%3E%3Cuse href='%23s' x='11' y='8'/%3E%3Cuse href='%23s' x='51' y='13'/%3E%3Cuse href='%23s' x='17' y='73'/%3E%3Cuse href='%23s' x='99' y='57'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23b)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23h)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23c)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23d)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23e)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23f)' width='100%25' height='100%25'/%3E%3Crect fill='url(%23g)' width='100%25' height='100%25'/%3E%3C/svg%3E");
        background-attachment: fixed;
        background-size: cover;
    }
    .hide-mobile {
        display: block;
    }
    .show-mobile {
        display: none;
    }
}

.main-item {
    font-size: 15px;
    font-weight: 500;
    color: #111111;
}

#info-site-navbar .nav-item {
    position: relative;
    color: #111111;
    padding-left: 14px;
    padding-right: 14px;
}

.nav-item > .nav-link {
    color: #202020;
    font-size: 15px;
}

.nav-item > .nav-link:hover,
.nav-item > .nav-link:focus,
.nav-item > .nav-link:active {
    color: #169928;
}


/**************
    Buttons
**************/

.switch-tab {
    background-color: transparent!important;
    border: none!important;
    outline: none!important;
    text-align: left;
    font-size: 14px;
    font-weight: 600;
    color: #606060;
}

.switch-tab.active {
    border-bottom: 2px solid blue!important;
    color: blue;
}

.plain-btn {
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: none;
    z-index: auto;
    width: inherit;
    height: auto;
    position: static;
    cursor: pointer;
    opacity: 1;
    padding: 7px 10px;
    min-width: 70px;
    border: 1px solid #0F9B0F;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    color: rgb(255, 255, 255);
    -o-text-overflow: clip;
    text-overflow: clip;
    background: -webkit-linear-gradient(-90deg, rgb(90,190,87) 0, rgb(53,146,56) 100%), rgb(90, 190, 87);
    background: -moz-linear-gradient(180deg, rgb(90,190,87) 0, rgb(53,146,56) 100%), rgb(90, 190, 87);
    background: linear-gradient(180deg, rgb(90,190,87) 0, rgb(53,146,56) 100%), rgb(90, 190, 87);
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
    -webkit-box-shadow: 0 2px 1px 0 rgba(0,0,0,0.2) ;
    box-shadow: 0 2px 1px 0 rgba(0,0,0,0.2) ;
    text-shadow: 0 1px 2px rgb(50,114,40) ;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
    -webkit-transform: none;
    transform: none;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
}


.plain-btn:hover {
    color: rgb(255, 255, 255);
    background: rgb(90, 190, 87);
    -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.11) ;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.11) ;
    text-shadow: 0 1px 2px rgb(50,114,40) ;
    -webkit-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    -moz-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    -o-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
}


.alert-btn {
    border: 1px solid #E1E1E1;
    background-color: #F1F1F1;
    color: red;
    font-size: 12px;
    font-weight: 600;
    padding: 5px;
    min-width: 70px;
    cursor: pointer;
}

.alert-btn:hover {
    border: 1px solid #D1D1D1;
    background-color: #E1E1E1;
}


.dull-btn {
    border: 1px solid #E1E1E1;
    border-radius: 4px;
    background-color: #F1F1F1;
    color: #4C4E57;
    font-size: 12px;
    font-weight: 600;
    padding: 5px;
    min-width: 70px;
    cursor: pointer;
}

.dull-btn:hover, .dull-btn.hover {
    background-color: #EAEEF1;
}

.standard-btn {
    height: auto;
    color: #4C4E57;
    font-size: 12px;
    font-weight: 600;
    padding: 7px 10px;
    border: 1px solid #E9E9E9;
    border-radius: 3px;
    background-color: #FFFFFF;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));
    text-shadow: 0 1px 1px rgba(255,255,255,.7);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.15), 0 1px 2px rgba(0,0,0,0.15), inset 0 1px 2px rgba(255,255,255,.7);
    cursor: pointer;
}

.standard-btn:hover, .standard-btn.hover {
    background-color: #EAEEF1;
}

.standard-btn:active, .standard-btn.active {
    border: 1px solid #D3D3D3;
    background-color: #D0D3D6;
    background-image: linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,0));
    box-shadow: inset 0 0 2px rgba(0,0,0,.2), inset 0 2px 5px rgba(0,0,0,.2), 0 1px rgba(255,255,255,.2);
}


.yellow-btn {
    height: auto;
    color: #202020;
    font-size: 12px;
    font-weight: 600;
    padding: 7px 10px;
    border: 1px solid #F9C70C;
    border-radius: 3px;
    background-color: #FCE205;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));
    text-shadow: 0 1px 1px rgba(255,255,255,.7);
    box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7);
}

.yellow-btn:hover, .yellow-btn.hover {
    background-color: #FFFF00;
}

.yellow-btn:active, .yellow-btn.active {
    border: 1px solid #D5B60A;
    background-color: #ECD41C;
    background-image: linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,0));
    box-shadow: inset 0 0 2px rgba(0,0,0,.2), inset 0 2px 5px rgba(0,0,0,.2), 0 1px rgba(255,255,255,.2);
}


.custom-btn-sm {
    padding: 5px 10px;
}


.floating-btn {
    padding: 10px 20px 10px 20px;
    background: #32CD32;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 20px;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 500;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.25);
    transition: background 0.25s;
    outline: 0;
    border: none;
    cursor: pointer;
}

.floating-btn-container {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 2;
}

.floating-btn:active {
    background: #005700;
}

.no-focus-btn:focus{
    outline: 0;
}

.top-right-button {
    float: right;
    background-color: transparent;
    color: white;
    border: 0px;
}

@media screen and (max-width:576px) {
  .btn-group {
    display: flex;
    flex-direction: column;
  }
}

.btn-group-days {
    color: #606060!important;
    font-size: 11px!important;
    border: 1px solid #949494!important;
    border-radius: 4px;
    outline: none!important;
    box-shadow: none!important;
}

.btn-group-days.active, .btn-group-days:hover {
    color: #FFFFFF!important;
    border: 1px solid #0275D8!important;
    background-color: #0275D8!important;
}

.btn-sharp-corners {
    border-radius: 0px !important;
}

.bootstrap-btn-min-width {
    min-width: 80px;
}


.purple-btn {
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: none;
    z-index: auto;
    width: inherit;
    height: auto;
    position: static;
    cursor: pointer;
    opacity: 1;
    padding: 7px 10px;
    min-width: 100px;
    border: 1px solid #5D3FD3;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    font-family: Arial;
    color: rgb(255, 255, 255);
    -o-text-overflow: clip;
    text-overflow: clip;
    background: -webkit-linear-gradient(-90deg, rgb(93,63,211) 0, rgb(93,63,211) 100%), rgb(93,63,211);
    background: -moz-linear-gradient(180deg, rgb(93,63,211) 0, rgb(93,63,211) 100%), rgb(93,63,211);
    background: linear-gradient(180deg, rgb(93,63,211) 0, rgb(93,63,211) 100%), rgb(93,63,211);
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
    -webkit-box-shadow: 0 2px 1px 0 rgba(0,0,0,0.3) ;
    box-shadow: 0 2px 1px 0 rgba(0,0,0,0.3) ;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
    -webkit-transform: none;
    transform: none;
    -webkit-transform-origin: 50% 50% 0;
    transform-origin: 50% 50% 0;
}


.purple-btn:hover {
    color: rgb(255, 255, 255);
    background: rgb(93,63,211);
    -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.11) ;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.11) ;
    -webkit-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    -moz-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    -o-transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
    transition: all 150ms cubic-bezier(0.42, 0, 0.58, 1);
}


.btn-success-old {
  color: #fff;
  background-color: #32CD32;
  border-color: #32CD32;
/*  background-color: #28a745;
  border-color: #28a745;*/
}

.btn-success-old:hover {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
}

.btn-success-old:focus, .btn-success-old.focus {
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.btn-success-old.disabled, .btn-success-old:disabled {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success-old:not(:disabled):not(.disabled):active, .btn-success-old:not(:disabled):not(.disabled).active,
.show > .btn-success-old.dropdown-toggle {
  color: #fff;
  background-color: #1e7e34;
  border-color: #1c7430;
}

.btn-success-old:not(:disabled):not(.disabled):active:focus, .btn-success-old:not(:disabled):not(.disabled).active:focus,
.show > .btn-success-old.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.btn-dark-old {
  color: #fff;
  background-color: #343a40;
  border-color: #343a40;
}

.btn-dark-old:hover {
  color: #fff;
  background-color: #23272b;
  border-color: #1d2124;
}

.btn-dark-old:focus, .btn-dark-old.focus {
  color: #fff;
  background-color: #23272b;
  border-color: #1d2124;
  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
}

.btn-dark-old.disabled, .btn-dark-old:disabled {
  color: #fff;
  background-color: #343a40;
  border-color: #343a40;
}

.btn-dark-old:not(:disabled):not(.disabled):active, .btn-dark-old:not(:disabled):not(.disabled).active,
.show > .btn-dark-old.dropdown-toggle {
  color: #fff;
  background-color: #1d2124;
  border-color: #171a1d;
}

.btn-dark-old:not(:disabled):not(.disabled):active:focus, .btn-dark-old:not(:disabled):not(.disabled).active:focus,
.show > .btn-dark-old.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
}

.feature-button,
.feature-button:active,
.feature-button:focus {
    border: 0px;
    background-color: transparent;
    outline: none!important;
}

.feature-button:hover {
    background-color: #EAEAEA;
    color: #0A5E2A;
    border: 0px;
    border-radius: 0px;
}

.feature-button.active {
    background-color: #C1E1C1;
    color: #202020;
    border: 0px;
    border-radius: 0px;
}


/**********************
    Index Page CSS
**********************/

@media only screen and (max-device-width: 480px) {
    #mainHeader {
        margin-top: 20%;
    }
    #integration-image {
        display: none;
    }
    .notification-image-one, .notification-image-three {
        width: 50%;
    }
    .notification-image-two {
        top: 35%;
    }
    .neural-image {
        width: 50%;
    }
    .neural-border-left {
        border: 0;
    }
    .neural-border-right {
        border: 0;
    }
    .switchable-segments > div {
        height: 650px;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1199px) {
    .notification-image-one, .notification-image-three {
        width: 45%;
    }
    .notification-image-two {
        top: 55%;
    }
    .neural-image {
        width: 90%;
    }
    .neural-border-left {
        border-left: 3px solid #606060;
        border-left-style: dashed;
    }
    .neural-border-right {
        border-right: 3px solid #606060;
        border-right-style: dashed;
    }
    .switchable-segments > div {
        height: 650px;
    }
}


@media only screen and (min-device-width: 1200px){
    .notification-image-one, .notification-image-three {
        width: 45%;
    }
    .notification-image-two {
        top: 55%;
    }
    .neural-image {
        width: 90%;
    }
    .neural-border-left {
        border-left: 3px solid #606060;
        border-left-style: dashed;
    }
    .neural-border-right {
        border-right: 3px solid #606060;
        border-right-style: dashed;
    }
    .switchable-segments > div {
        height: 550px;
    }
}

.index-main-bg {
    background: rgb(105,190,197);
    background: linear-gradient(168deg, rgba(105,190,197,1) 0%, rgba(172,219,226,1) 99%);
}

.index-main-image-bg {
    min-height: 400px;
    background: url('https://taskcallapp.com/images/info-site/graphic-images/WritingsOnGlassWindow.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 10px;
    position: relative;
}

.notification-image-one {
    position: absolute;
    top: 5%;
    left: -15%;
}

.notification-image-two {
    position: absolute;
    top: 40%;
    left: -10%;
    width: 45%;
}

.notification-image-three {
    position: absolute;
    bottom: 30%;
    right: -12%;
}

.modernize-html-bg {
    min-height: 200px;
    overflow: hidden;
    background: white;
    color: #deb887;
    background-image: radial-gradient(#9CC3D5 52px, transparent 0);
    background-size: 100px 100px;
    background-position: -70px -50px;
    border-radius: 5px;
}

.integrations-html-bg {
    min-height: 200px;
    overflow: hidden;
    background: white;
    color: #deb887;
    background-image: radial-gradient(#F5F5F5 200px, transparent 0);
    background-size: 420px 420px;
    background-position: -100px -50px;
}

.integrations-icon-img {
    width: auto;
    max-height: 100%;
}

.benefits-html-bg {
    min-height: 100px;
    overflow: hidden;
    background: #FFF8DC;
    color: #deb887;
    background-image: radial-gradient(#deb887 50px, transparent 0);
    background-size: 130px 5px;
    background-position: -20px -20px;
}

.neural-html-bg {
    min-height: 200px;
    overflow: hidden;
    background: white;
    background-image: radial-gradient(#F5F5F5 200px, transparent 0);
    background-size: 420px 420px;
    background-position: -100px -50px;
}


/************************
    Tabular
************************/

.packages {
	margin-top: 50px;
	border: none;
	width: 100%;
	background: none;
	border-collapse: collapse;
	border-spacing: 0;
}
.packages thead {
	background: none;
}
.packages thead td {
	padding: 9px 10px;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	font-size: 16px;
}
.packages thead td.gold {
	border-radius: 0;
	color: #8E610D;
}
table.packages tbody tr:nth-child(even), table.packages tbody tr:nth-child(odd) {
	background: none;
}
.packages tr:hover td {
	background: #EEE7C6;
}
.packages tr:hover td.feature, .packages tr:hover td.blank {
	background: inherit;
}
.packages tr.register:hover td, .packages tr:hover td.blank.gold {
	background: #fff;
}
.packages tr.register:hover td.feature {
	background: transparent;
}
.packages td {
	background: #fff;
	text-align: center;
	border-bottom: 1px solid #EEE7C6;
	font-size: 15px;
	color: #808080;
	line-height: 15px;
	padding: 15px 10px;
	position: relative;
	z-index: 2;

}
.packages tr.bottom td {
  border: none;
}
.packages td {
	box-shadow: inset -4px 0 4px -2px rgba(0,0,0,0.30);
	-webkit-box-shadow: inset -4px 0 4px -2px rgba(0,0,0,0.30);
	position: relative;
}
.packages thead td:after {
	box-shadow: inset -4px 0 4px -2px rgba(0,0,0,0.30);
	-webkit-box-shadow: inset -4px 0 4px -2px rgba(0,0,0,0.30);
}
.packages tr td:last-child, .packages tr td:last-child:after {
	box-shadow: none;
	-webkit-box-shadow: none;
}

.packages td.feature:after {
	position: absolute;
	content: "";
	left: 0;
	border-bottom: 1px solid #423D31;
	bottom: 0;
	right: -20px;
}
.packages .register td.feature:after, .packages .highlight td.feature:after, .packages td.feature.no-border:after  {
	display: none;
}
.packages td.blank {
	border: none;
}

.packages td.feature, .packages td.blank {
	background: none;

}
.packages td.feature {
	font-size: 12px;
	color: #FFFFFF;
	line-height: 15px;
	text-align: left;
	border-bottom: none;
	position: relative;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.packages td.gold {
	border-left: 10px solid #E4D7A0;
	border-right: 10px solid #E4D7A0;
}
.packages .top td.gold {
	height: 20px;
	background: #fff;
	border: 10px solid #E4D7A0;
	border-bottom: none;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
}
.packages .bottom td.gold {
	height: 20px;
	background: #fff;
	border: 10px solid #E4D7A0;
	border-top: none;
	border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
}

.packages .highlight td {
	padding: 18px 10px;
	vertical-align: middle;
	line-height: 15px;
	height: 120px;
}
.packages .highlight td span {
	font-size: 16px;
	margin-bottom: 20px;
	display: inline-block;
}

.packages .register td {
	padding: 18px 10px;
	vertical-align: middle;
	border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
}
.packages .register td.gold {
	border-bottom: 0;
	border-radius: 0 ;
	-webkit-border-radius: 0;
}
.packages td {

position: relative;
}
.packages td:after {
	content: "";
	position: absolute;
	}

.packages thead td {
	border-radius: 0;
	position: relative;
	text-transform: uppercase;
}
.packages thead td.first {
	border-radius: 10px 10px 0 0;
	}
.packages thead td.second:after {
	content: "";
	position: absolute;
	bottom: 100%;
	height: 10px;
	width: 100%;
	left: 0;
	background: #fff;
	border-radius: 10px 10px 0 0;
}
.packages thead td.third:after {
	content: "";
	position: absolute;
	bottom: 100%;
	height: 20px;
	width: 100%;
	left: 0;
	background: #fff;
	border-radius: 10px 10px 0 0;
}
.packages thead td.fourth:after {
	content: "";
	position: absolute;
	bottom: 100%;
	height: 30px;
	width: 100%;
	left: 0;
	background: #fff;
	border-radius: 5px  0 0;
}
.packages thead td.fifth:after {
	content: "";
	position: absolute;
	bottom: 100%;
	height: 40px;
	width: 100%;
	left: 0;
	background: #fff;
	border-radius: 5px 5px 0 0;
}

.packages td.feature {
	padding-right: 20px !important;
	min-width: 250px;
}
.packages td.feature:after {


}
.packages thead td.active {

	}
.packages td.active {
	background: #2D281B;
	color: #fff;
	border-bottom: 1px solid #575349;
}
.packages .bottom td.first {
	border-radius: 0 0 0 5px;
}
.packages tr:hover td {
	background: #fff;
}
.packages tr:hover td.active {
	background: #2D281B;
}
.packages tr:hover td.feature {
	background: transparent;
}
.packages .plans td {
	padding: 18px 10px;
	line-height: 15px;

}
.packages .plans td span {
	font-size: 16px;
	margin-bottom: 20px;
	display: inline-block;
}
.packages .plans td .button {
	margin-top: 20px;
}


/*-------------------
    Pricing
--------------------*/

.table-section-header {
    width: 100%;
    background-color: #E2E2E2;
    color: #505050;
    font-weight: 700;
    font-size: 16px;
    padding: 15px;
}
table > tbody > tr > .feature-row {
    padding: 15px 15px 15px 15px;
}
.feature-title {
    color: #404040;
    font-weight: 600;
    font-size: 15px;
    width: 20%;
}
.feature-data {
    text-align: center;
    color: #707070;
    font-weight: 500;
    font-size: 14px;
    width: 20%;
}
table > tbody > tr > .col-right-border {
    border-right: 1px solid #EAEAEA;
}
.accordion:focus, .accordion:hover {
    background-color: #EAEAEA;
}
.half-background {
    background: rgb(36,198,220);
    background: linear-gradient(168deg, rgba(36,198,220,1) 0%, rgba(81,74,157,1) 99%);
}
.lime-green-color {
    color: #32CD32 !important;
}


/*-------------------
    Blog
--------------------*/

.blog-html-bg {
    margin-top: 60px;
    padding-top: 30px;
    padding-bottom: 5px;
    background: rgb(230,204,0);
    background: linear-gradient(315deg, rgba(230,204,0,1) 0%, rgba(230,155,0,1) 35%, rgba(228,114,0,1) 100%);
}

.blog-toc,
.blog-toc li,
.blog-toc li a {
    padding-left: 0;
    margin-left: 0;
    color: #7F7E72;
    color: #676767;
    font-size: 13px;
    list-style-type: none;
}