html {
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: #f1f3f5;
  margin: 0 !important;
  overflow: hidden;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: 0.022em;
  font-size: 16px !important;
  padding: 0 !important;
  -webkit-overflow-scrolling: touch;
  overflow-y: hidden;
  overflow-x: hidden;
  color: #b9bac9;
}

.responsive-container {
  width: 100%;
  overflow: scroll;
}

.letter-spacing-medium {
  letter-spacing: 0.1em;
}

.letter-spacing-low {
  letter-spacing: 0.05em;
}

.echarts-tooltip {
  text-align: left;
}

.tippy-box[data-theme~='coin-tooltip'] {
  background: #24283c;
  color: #afb0ca;
  padding: 5px 10px;
  font-size: 12px;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.main-container {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  z-index: 0;
  overflow: auto;
}

.component-box {
  box-shadow: 2px 2px 10px rgb(0 0 0 / 18%);
  border-radius: 10px;
  margin: 0 auto;
  border-spacing: 0;
  background: white;
}

.highlight-box-table {
box-shadow: 2px 2px 10px rgb(0 0 0 / 18%);
    border-radius: 10px;
    margin: 0 auto;
    border-spacing: 0;
    background: #0c0a17;
    padding: 3px 15px;
    margin-left: -10px;
}

.component-box.dark-theme {
  background: rgba(23, 23, 39, 0.90);
}

.dark-theme .dataTable {
  color: #aab7d0 !important;
}

.dark-theme .dataTable td {
  border-bottom: 1px solid rgba(241, 243, 255, 0.02) !important;
}

.dark-theme .dataTable th {
  color: #bdbed0;
  background: #11111e;
}

.dark-theme .dataTable thead th:first-child {
  text-align: left !important;
  /* border-top-left-radius: 8px;
  border-bottom-left-radius: 8px; */
}

.dark-theme .dataTable thead th:last-child {
  text-align: right !important;
  /* border-top-right-radius: 8px;
  border-bottom-right-radius: 8px; */
}

.dark-theme .dataTables_filter {
  margin: 0 auto;
  padding-top: 10px;
  width: 300px !important;
  text-align: right;
  float: none;
  display: none;
}

.dark-theme .paginate_button {
  background: #1d1d2f !important;
  height: 40px;
  border-radius: 5px !important;
  line-height: 30px !important;
  padding: 5px 15px 5px 15px !important;
  border: 1px solid #232d3e !important;
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.3) !important;
  margin: 8px !important;
  cursor: pointer !important;
  color: #74a0f1 !important;
  font-weight: 500 !important;
}

.dark-theme .paginate_button.current {
  background: rgb(13, 64, 142) !important;
  border: 1px solid #395d9e !important;
}

.dark-theme button.dt-button {
  border: none;
  font-weight: 600;
  font-size: 13px;
  padding: 5px !important;
  width: 60px;
  border-radius: 4px;
  line-height: 1;
  color: #d3d4e2;
  height: 30px;
  background: #5839d6;
  margin-right: 6px;
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.23);
}

.dark-theme input[type="search"] {
  -webkit-appearance: none;
  border: none !important;
  color: #f0f0f3;
  box-shadow: none;
  background: rgb(174 174 255 / 7%);
  border-bottom: 4px solid #559fb1 !important;
  border-radius: 1px !important;
}

.dark-theme input::placeholder {
  color: #8e8ebd !important;
}

.dark-theme input::-webkit-input-placeholder {
  color: #8e8ebd !important;
}

.dark-theme input::-moz-placeholder {
  color: #8e8ebd !important;
}

.classic_navbar_2 {
  width: 360px !important;
}

.classic_navbar_2 .classic_navbar_item_left {
  width: 50% !important;
}

.classic_navbar_2 .classic_navbar_item_right {
  width: 50% !important;
}

.background-verydark {
  background: #12121c !important;
}

.background-lightdark {
  background: #202031 !important;
}

.background-kpic {
  background: #191a27 !important;
}

.background-kpic-gradient {
  background: -webkit-radial-gradient(50% top, circle, #1d2131 0, rgb(10 18 30 / 59%) 75%), -webkit-radial-gradient(right top, circle, #18182f 0, rgb(31 20 41 / 97%) 57%) !important;
}

.background-kpic-gradient2 {
  background: -webkit-radial-gradient(50% top, circle, #1a1829 0, rgb(10 18 30 / 59%) 75%), -webkit-radial-gradient(right top, circle, #141627 0, rgb(14 9 18 / 97%) 57%) !important;
}


.classic_navbar {
  position: fixed;
  top: 65px;
  left: 0;
  right: 0;
  height: 55px;
  width: 100%;
  background: #202238;
  margin: 0 auto;
  border-radius: 0;
  /* border-bottom: 1px solid #ffffff05; */
  font-size: 0;
  text-align: center;
  box-shadow: 0 0 20px #00000033;
  z-index: 100000;
}

.classic_navbar_item_container {
  width: 150px;
  font-size: 13px;
  transition: background 0.15s;
}

.classic_navbar_item {
  opacity: 0.6;
}

.classic_navbar_item_container.classic_navbar_item_selected .classic_navbar_item_icon,
.classic_navbar_item_container.classic_navbar_item_selected .classic_navbar_item {
  opacity: 1;
}

.classic_navbar_item_container:hover {
  border-bottom: 2px solid #ff8e36;
  cursor: pointer;
  transition: border-bottom 0.3s;
}

.classic_navbar_item_container.classic_navbar_item_selected:hover {
  background: none;
  transition: none;
}

.classic_navbar_item_selected .classic_navbar_item {
  color: #ff8e36;
}

.classic_navbar_item_selected {
  border: 1px solid #ff8e3680 !important;
}

.classic_navbar_item_selected:hover {
  color: #ff8e36;
}

.classic_navbar_item_icon {
  opacity: 0.6;
  margin-right: 10px;
  width: 16px;
  height: 43px;
  filter: grayscale(1);
  display: none !important;
}

.classic_navbar_item_selected .classic_navbar_item_icon_selected {
  filter: inherit;
}

.classic_navbar_item_icon_kpi {
  background-image: url(../images/icons/speed.svg);
  background-size: 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.classic_navbar_item_icon_risk {
  background-image: url(../images/icons/shield_warning.svg);
  background-size: 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.classic_navbar_item_icon_status {
  background-image: url(../images/icons/calendar.svg);
  background-size: 130% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.classic_navbar_item_container.classic_navbar_item_left,
.classic_navbar_item_container.classic_navbar_item_middle,
.classic_navbar_item_container.classic_navbar_item_right {
  height: 35px;
  font-size: 12px;
  line-height: 35px;
  font-weight: 500;
  border: 1px solid #ffa5002e;
  border-radius: 25px;
  margin: 10px 10px;
  color: #ecc8aa;
  width: 160px;
  font-weight: 500;
}


.kpinc-select {
  position: relative;
  display: inline-block;
  padding: 0.75rem 0;
  cursor: pointer;
  z-index: 400;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
}

.kpinc-select:after {
  content: '';
  width: 0.35rem;
  height: 0.35rem;
  display: block;
  position: absolute;
  inset: 50% 1rem auto auto;
  translate: 0 -75% 0;
  rotate: 0 0 1 45deg;
  border-right: 0.125rem solid #ddd;
  border-bottom: 0.125rem solid #ddd;
}

.kpinc-select select,
.kpinc-select .custom-select {
  position: relative;
  appearance: none;
  background: transparent;
  color: #f6b12c;
  font-family: inherit;
  height: 50px;
  line-height: 50px;
  outline: none;
  padding: 0 35px 0 20px;
  transition: all 0.15s ease-in-out;
  width: auto;
  font-size: 14px;
  font-weight: 600;
  /* text-transform: uppercase; */
  box-sizing: border-box;
  border: 1px solid #594139;
  border-radius: 11px;
  cursor: pointer;
}

.kpinc-select select:hover,
.kpinc-select .custom-select:hover {
  border: 1px solid #f6b12c8f;
  cursor: pointer;
}

.kpinc-select .select-options {
  position: absolute;
  inset: 100% 0 auto;
  display: flex;
  flex-direction: column;
  background: #161620;
  box-shadow: 2px 2px 10px #0c0d17b8;
  border: 1px solid #594139;
  border-radius: 11px;
  list-style: none;
  padding: 0;
  margin: 0.75rem 0;
  translate: 0 1rem 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  max-height: 250px;
  overflow-y: auto;
  transition: 0.1s ease-in-out all;
}

.kpinc-select .select-options li {
  height: 3rem;
  line-height: 3rem;
  font-size: 13px;
  outline: none;
  padding: 0 20px 0 20px;
  text-transform: none;
  letter-spacing: 0.015rem;
  border-bottom: 1px solid #2d261f;
  cursor: pointer;
  transition: padding-left 0.3s, background 0.3s;
}

.kpinc-select .select-options li:hover {
  padding-left: 27px;
  background: #1a1a25;
  transition: padding-left 0.3s, background 0.3s;
}


.custom-select.kpinc-select-selected .select-options {
  translate: 0 0 0;
  opacity: 1;
  left: -1px;
  right: -1px;
  visibility: visible;
  pointer-events: all;
}



.admin_navbar_container {
  text-align: center;
  position: fixed;
  top: 0;
  z-index: 5000;
  width: 100%;
}

.admin_navbar_object {
  padding-top: 20px;
  padding-bottom: 20px;
  width: 100%;
  background: #f7f7f7;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.07);
}

.admin-navbar-handle {
  width: 100px;
  background: #4d4d69;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  color: white;
  padding: 5px;
  font-size: 14px;
  margin: 0 auto;
}

.admin_navbar {
  display: inline-block;
}

.popup {
  position: fixed;
  background: #191a27;
  z-index: 10000;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: 20px;
  box-shadow: 0 0 20px rgb(0 0 0 / 34%);
  border-radius: 10px;
  border-top-right-radius: 10px;
  border: 1px solid #45b6d659;
}

.popup-small-right {
  width: 500px;
  left: auto;
}

.popup_header {
  height: 80px;
  position: absolute;
  width: 100%;
  z-index: 200000;
  padding: 20px;
  background: #191a27;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.popup_header_big {
  height: 150px;
  position: absolute;
  width: 100%;
  z-index: 200000;
  padding: 50px;
  background: #191a27;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.popup_content {
  padding: 50px;
  overflow: auto;
  position: absolute;
  top: 80px;
  bottom: 0;
  left: 0;
  right: 0;
}

.popup_content_big {
  padding: 50px;
  overflow: auto;
  position: absolute;
  top: 100px;
  bottom: 0;
  left: 0;
  right: 0;
}

.popup .input-name-registration {
  margin-bottom: 5px;
  font-size: 14px;
}

.popup input::placeholder {
  color: #bdbdbd;
}


/* OLD BLACK CIRCLE POPUP */

.popup_close_button.popup_close_button_regular {
  width: 45px;
  height: 45px;
  line-height: 45px;
  margin: -7px -5px 0px 0px;
  padding: 0;
  /* margin-right: -5px; */
  font-size: 18px;
  font-weight: 300;
  float: right;
  text-align: center;
  cursor: pointer;
  color: #2de3ff;
  border-radius: 50px;
  background: #06060a;
  box-shadow: 0 0 5px rgb(0 0 0 / 20%);
}

.popup_close_button {
  position: absolute;
  right: 0;
  top: 0;
  background: #00000063;
  color: #67ddf8;
  border: 1px solid #2e758b;
  border-radius: 5px;
  font-weight: 500;
  width: 40px;
  text-align: center;
  padding: 10px 15px;
  /* float: right; */
  margin: 20px 20px 20px 0;
  font-size: 11px;
  cursor: pointer;
  transition: background 0.3s;
}

.popup_close_button:hover {
  background: #1e1e2f;
  transition: background 0.3s;
}

.popup_overlay {
  position: fixed;
  background: -webkit-radial-gradient(50% top, circle, #13a2b9ad 0, rgb(37 87 179 / 40%) 75%), -webkit-radial-gradient(right top, circle, #00ddffa8 0, rgb(85 36 214 / 54%) 57%) !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 4999;
}

.popup_overlay .popup_overlay_purple {
  position: fixed;
  background: -webkit-radial-gradient(50% top, circle, #13a2b9ad 0, rgb(37 87 179 / 40%) 75%), -webkit-radial-gradient(right top, circle, #00ddffa8 0, rgb(85 36 214 / 54%) 57%) !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 4999;
}

.popup_overlay_purple {
  background: -webkit-radial-gradient(73% top, circle, #161ca86b 0, rgb(50 81 138 / 29%) 52%), -webkit-radial-gradient(right top, circle, #572265a8 0, rgb(44 13 128 / 71%) 97%) !important;
}

.popup .form-control {
  width: 100%;
  margin-top: 5px;
  font-size: 14px;
  padding: 10px;
  margin-bottom: 18px;
  font-weight: 500;
  color: #5d78e8;
  outline: none;
  height: 40px;
  box-shadow: 0 0 5px #0000000a;
  border: 1px solid #d6d6d67a;
}

a {
  text-decoration: none;
}

.resize {
  max-width: 1024px;
  margin: 0 auto;
}

.content-button-purple-fill {
  font-size: 14px;
  text-align: center;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0);
  box-shadow: 0 0 5px #00075d33;
  width: 150px;
  padding: 4px;
  margin: 20px;
  cursor: pointer;
  width: 150px;
  transition: border 1s;
  box-sizing: border-box;
  background: #6b7fd2;
  color: #fff;
  transition: background .3s, transform 0.1s;
  /* backface-visibility - prevents text anomalies on scale */
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-style: preserve-3d;
}

.content-button-purple-fill:hover {
  /* background: #4c81f3 !important; */
  transform: scale(1.03);
  transition: transform 0.3s;
}

.important {
  color: #8656de !important;
  font-weight: 500;
}

.overflow-scroll {
  overflow: scroll;
}

.overflow-hidden {
  overflow: hidden;
}


.pentaho-page-background {
  background-color: #efeff1 !important;
  background-image: none !important;
}

.kpinc-select-container {
  position: relative;
}

.ui-box {
  padding: 50px;
  background: #00000042;
  border-radius: 10px;
  box-shadow: 0 0 10px #00000030;
  border: 1px solid #03bdc233;
  margin-right: 10px;
}


/* datatables overrides */

.dataTable td {
  /* background-color: #fff!important; */
  border-bottom: 0 !important;
  border-right: 1px solid rgba(0, 0, 0, .02) !important;
  border-top: 1px solid rgba(0, 0, 0, .02) !important;
  border-left: none !important;
  padding: 14px !important;
  padding-right: 50px !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  white-space: nowrap;
  height: auto;
}

/* .dt-scroll-head {
  display: none;
} */

table.dataTable tbody tr>.dtfc-fixed-start {
  z-index: 1;
  background-color: #12121c !important;
}

table.dataTable tbody tr>.dtfc-fixed-end {
  z-index: 1;
  background-color: #12121c !important;
  font-weight: 500;
  color: #ffbb00 !important;
}

div.dt-container div.dt-layout-cell {
  padding: 0 !important;
}

table.dataTable tbody tr>.dtfc-fixed-end {
  border-left: 1px solid #182a30 !important;
}

.dataTable {
  border-spacing: 0 !important;
  font-size: 14px !important;
  line-height: 2 !important;
  color: #464f56 !important;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3) !important;
  margin: 0 auto !important;
  width: 100% !important;
}

.dataTable tbody td.no-padding {
  padding: 0;
}

button.dt-button.buttons-collection.buttons-colvis {
  width: 130px;
  background: #778ada;
  color: white;
}

.dt-buttons {
  margin-bottom: -63px;
  width: 350px !important;
  float: none !important;
}

button.dt-button:hover {
  border: none !important;
  background: #8f8fef !important;
  color: white;
  /* transform: scale(1.07); */
  transition: background 0.1s, color 0.1s;
  backface-visibility: hidden;
}

button.dt-button {
  border: none;
  font-weight: 600;
  font-size: 13px;
  width: 60px;
  height: 39px;
  background: white;
  margin-right: 6px;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, 0.23);
}

.dataTables_wrapper .dataTables_filter {
  margin: 0 auto 50px auto !important;
  width: 300px !important;
  text-align: right;
  float: none;
}

.dataTables_wrapper .dataTables_filter label {
  color: transparent;
}

.dataTables_processing {
  background: #36364d;
  position: absolute;
  color: #a2a3c0;
  height: 150px;
  width: 100%;
  border-radius: 5px;
  text-align: center;
  line-height: 100px;
}

td.details-control {
  background-image: url(../images/details_icon.svg) !important;
  background-size: 25px 25px !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  opacity: .5;
  background-color: white;
  transform: scale(1);
  transition: transform .4s, opacity .3s;
  cursor: pointer;
}

input[type="search"] {
  -webkit-appearance: none;
  border: none !important;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
  border-radius: 1px !important;
  height: 40px !important;
  margin-left: 0 !important;
  width: 100% !important;
  padding: 3px 20px 3px 20px !important;
  text-align: left;
  font-size: 14px;
  outline: none;
}


/* .dataTable tr {
    background: white !important;
} */

.dataTable tr.shown {
  background: rgb(199, 198, 218) !important;
}


td.col-subdate,
td.col-expdate {
  text-align: right;
}

.dataTable tr.shown td .reg_highlight,
.dataTable tr.shown td .premium_highlight,
.dataTable tr.shown td .admin_highlight,
.dataTable tr.shown td .paid_highlight,
.dataTable tr.shown td .trial_highlight {
  color: #cbd0e3 !important;
}

.dataTable tr.shown td {
  color: #cbd0e3 !important;
}

td.childRow-generalClass {
  vertical-align: top;
}

td.childRow-generalClass:first-child {
  color: #343b40 !important;
  border-bottom: 10px solid #7a7b8e !important;
  border-left: none !important;
  padding: 20px !important;
  font-weight: 400;
}

td:first-child {
  border-left: 5px solid #778ad9 !important;
  border-top: none !important;
  color: #778bd8;
  font-weight: 500;
  /* font-size: 14px; */
}

th {
  /* background: #7488ea;
    color: #e9ecfc; */
  text-align: left !important;
}

th.col-subdate,
th.col-expdate,
th.col-role {
  text-align: right !important;
}

td.col-phone {
  font-weight: 600;
}

.col-stage {
  text-align: right !important;
  cursor: pointer;
}

td.col-stage {
  /* background: #f7f7f7; */
  transition: background 0.2s;
}

td.col-stage:hover {
  background: #e6e4f1;
  transition: background 0.2s;
}

td.col-company,
td.col-company .nocompany_highlight,
td.col-owner {
  max-width: 120px !important;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  white-space: nowrap;
}

td.col-subdate {
  font-size: 12px;
  /* font-weight: 500; */
}

.dataTable tr.shown td.col-stage {
  background: #e8e5e5;
  border-right: 1px solid #0000000d !important;
}


table.dataTable thead th,
table.dataTable thead td {
  padding: 10px 18px;
  border-bottom: none !important;
}

.dataTables_paginate {
  height: 70px !important;
  margin-top: 25px !important;
  line-height: 40px !important;
  text-align: center !important;
}

.paginate_button {
  background: white !important;
  height: 40px;
  line-height: 30px !important;
  padding: 5px 15px 5px 15px !important;
  border: 1px solid #ffffff !important;
  border-radius: 1px !important;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3) !important;
  margin: 8px !important;
  cursor: pointer !important;
  color: #428bca !important;
  font-weight: 500 !important;
}

.paginate_button.current {
  background: rgba(0, 97, 255, 0.2) !important;
  border: 1px solid #428BCA !important;
}

.dataTables_wrapper .dataTables_paginate {
  font-size: 11px;
  height: 70px;
  float: none;
  /* background: rgb(247, 247, 249); */
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.16); */
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: #333 !important;
}

.info_row.phone_row {
  font-weight: 500;
  font-size: 24px;
}

.comment_row {
  font-weight: 500;
  font-size: 24px;
}

.font-0 {
  font-size: 0;
}

/* CREATE USER STYLES */

input#client_password {
  color: #3c3abb5c;
  cursor: not-allowed;
}

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

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

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

.text-big1 {
  font-size: 19px;
}

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

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

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

.separator {
  border-bottom: 1px solid rgba(24, 15, 95, 0.12);
  margin: 10px 0 40px 0;
}

.f-left {
  text-align: left;
}

.f-color-green {
  color: #2edea5;
}

.f-color-yellow {
  color: #f5d335;
}

.f-color-red {
  color: #ff6f7c;
}

.v-align-b {
  vertical-align: bottom !important;
}

.v-align-m {
  vertical-align: middle !important;
}

.v-align-auto {
  vertical-align: initial !important;
}

.inline-block {
  display: inline-block;
  vertical-align: top;
}

.inline-block-valign {
  display: inline-block;
  vertical-align: middle;
}

.dropdown_arrow {
  display: inline-block;
  width: 20%;
  height: 8px;
  background: url(../../../images/icons/dropdown_arrow_dark_oval.svg);
  background-size: 11px;
  opacity: 1;
  background-repeat: no-repeat;
  background-position: center;
  transition: transform .3s;
}

/* BACKGROUNDS */

.bg-gradient-purple-blue {
  background-color: #6f57cc !important;
  background-image: -webkit-radial-gradient(50% top, circle, #35b4ae 0, rgba(84, 90, 182, 0) 75%), -webkit-radial-gradient(right top, circle, #00ffa1 0, rgba(118, 77, 228, .77) 57%) !important;
}

.bg-gradient-reports {
  background-color: #6f57cc !important;
  background-image: -webkit-radial-gradient(50% top, circle, #555d96 0, rgba(84, 90, 182, 0) 75%), -webkit-radial-gradient(right top, circle, #08b8ca 0, rgba(118, 77, 228, .77) 57%) !important;
}

/* INFOGRAPHICS */

.rect-auto,
.c100.p51 .slice,
.c100.p52 .slice,
.c100.p53 .slice,
.c100.p54 .slice,
.c100.p55 .slice,
.c100.p56 .slice,
.c100.p57 .slice,
.c100.p58 .slice,
.c100.p59 .slice,
.c100.p60 .slice,
.c100.p61 .slice,
.c100.p62 .slice,
.c100.p63 .slice,
.c100.p64 .slice,
.c100.p65 .slice,
.c100.p66 .slice,
.c100.p67 .slice,
.c100.p68 .slice,
.c100.p69 .slice,
.c100.p70 .slice,
.c100.p71 .slice,
.c100.p72 .slice,
.c100.p73 .slice,
.c100.p74 .slice,
.c100.p75 .slice,
.c100.p76 .slice,
.c100.p77 .slice,
.c100.p78 .slice,
.c100.p79 .slice,
.c100.p80 .slice,
.c100.p81 .slice,
.c100.p82 .slice,
.c100.p83 .slice,
.c100.p84 .slice,
.c100.p85 .slice,
.c100.p86 .slice,
.c100.p87 .slice,
.c100.p88 .slice,
.c100.p89 .slice,
.c100.p90 .slice,
.c100.p91 .slice,
.c100.p92 .slice,
.c100.p93 .slice,
.c100.p94 .slice,
.c100.p95 .slice,
.c100.p96 .slice,
.c100.p97 .slice,
.c100.p98 .slice,
.c100.p99 .slice,
.c100.p100 .slice {
  clip: rect(auto, auto, auto, auto);
}

.pie,
.c100 .bar,
.c100.p51 .fill,
.c100.p52 .fill,
.c100.p53 .fill,
.c100.p54 .fill,
.c100.p55 .fill,
.c100.p56 .fill,
.c100.p57 .fill,
.c100.p58 .fill,
.c100.p59 .fill,
.c100.p60 .fill,
.c100.p61 .fill,
.c100.p62 .fill,
.c100.p63 .fill,
.c100.p64 .fill,
.c100.p65 .fill,
.c100.p66 .fill,
.c100.p67 .fill,
.c100.p68 .fill,
.c100.p69 .fill,
.c100.p70 .fill,
.c100.p71 .fill,
.c100.p72 .fill,
.c100.p73 .fill,
.c100.p74 .fill,
.c100.p75 .fill,
.c100.p76 .fill,
.c100.p77 .fill,
.c100.p78 .fill,
.c100.p79 .fill,
.c100.p80 .fill,
.c100.p81 .fill,
.c100.p82 .fill,
.c100.p83 .fill,
.c100.p84 .fill,
.c100.p85 .fill,
.c100.p86 .fill,
.c100.p87 .fill,
.c100.p88 .fill,
.c100.p89 .fill,
.c100.p90 .fill,
.c100.p91 .fill,
.c100.p92 .fill,
.c100.p93 .fill,
.c100.p94 .fill,
.c100.p95 .fill,
.c100.p96 .fill,
.c100.p97 .fill,
.c100.p98 .fill,
.c100.p99 .fill,
.c100.p100 .fill {
  position: absolute;
  border: 0.09em solid #000000;
  width: 0.82em;
  height: 0.82em;
  clip: rect(0em, 0.5em, 1em, 0em);
  border-radius: 50%;
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.pie-fill,
.c100.p51 .bar:after,
.c100.p51 .fill,
.c100.p52 .bar:after,
.c100.p52 .fill,
.c100.p53 .bar:after,
.c100.p53 .fill,
.c100.p54 .bar:after,
.c100.p54 .fill,
.c100.p55 .bar:after,
.c100.p55 .fill,
.c100.p56 .bar:after,
.c100.p56 .fill,
.c100.p57 .bar:after,
.c100.p57 .fill,
.c100.p58 .bar:after,
.c100.p58 .fill,
.c100.p59 .bar:after,
.c100.p59 .fill,
.c100.p60 .bar:after,
.c100.p60 .fill,
.c100.p61 .bar:after,
.c100.p61 .fill,
.c100.p62 .bar:after,
.c100.p62 .fill,
.c100.p63 .bar:after,
.c100.p63 .fill,
.c100.p64 .bar:after,
.c100.p64 .fill,
.c100.p65 .bar:after,
.c100.p65 .fill,
.c100.p66 .bar:after,
.c100.p66 .fill,
.c100.p67 .bar:after,
.c100.p67 .fill,
.c100.p68 .bar:after,
.c100.p68 .fill,
.c100.p69 .bar:after,
.c100.p69 .fill,
.c100.p70 .bar:after,
.c100.p70 .fill,
.c100.p71 .bar:after,
.c100.p71 .fill,
.c100.p72 .bar:after,
.c100.p72 .fill,
.c100.p73 .bar:after,
.c100.p73 .fill,
.c100.p74 .bar:after,
.c100.p74 .fill,
.c100.p75 .bar:after,
.c100.p75 .fill,
.c100.p76 .bar:after,
.c100.p76 .fill,
.c100.p77 .bar:after,
.c100.p77 .fill,
.c100.p78 .bar:after,
.c100.p78 .fill,
.c100.p79 .bar:after,
.c100.p79 .fill,
.c100.p80 .bar:after,
.c100.p80 .fill,
.c100.p81 .bar:after,
.c100.p81 .fill,
.c100.p82 .bar:after,
.c100.p82 .fill,
.c100.p83 .bar:after,
.c100.p83 .fill,
.c100.p84 .bar:after,
.c100.p84 .fill,
.c100.p85 .bar:after,
.c100.p85 .fill,
.c100.p86 .bar:after,
.c100.p86 .fill,
.c100.p87 .bar:after,
.c100.p87 .fill,
.c100.p88 .bar:after,
.c100.p88 .fill,
.c100.p89 .bar:after,
.c100.p89 .fill,
.c100.p90 .bar:after,
.c100.p90 .fill,
.c100.p91 .bar:after,
.c100.p91 .fill,
.c100.p92 .bar:after,
.c100.p92 .fill,
.c100.p93 .bar:after,
.c100.p93 .fill,
.c100.p94 .bar:after,
.c100.p94 .fill,
.c100.p95 .bar:after,
.c100.p95 .fill,
.c100.p96 .bar:after,
.c100.p96 .fill,
.c100.p97 .bar:after,
.c100.p97 .fill,
.c100.p98 .bar:after,
.c100.p98 .fill,
.c100.p99 .bar:after,
.c100.p99 .fill,
.c100.p100 .bar:after,
.c100.p100 .fill {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.wrapper {
  width: 1200px;
  margin: 0 auto;
}

.c100 {
  position: relative;
  font-size: 160px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  margin-left: 60px;
  background-color: #dfe8ed;
}

.c100 *,
.c100 *:before,
.c100 *:after {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.c100>span {
  position: absolute;
  width: 100%;
  z-index: 1;
  left: 0;
  top: 0;
  width: 5em;
  line-height: 5em;
  font-size: 0.2em;
  color: #3c4761;
  display: block;
  text-align: center;
  white-space: nowrap;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.c100:after {
  position: absolute;
  top: 0.09em;
  left: 0.09em;
  display: block;
  content: " ";
  border-radius: 50%;
  background-color: #ffffff;
  width: 0.82em;
  height: 0.82em;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

.c100 .slice {
  position: absolute;
  width: 1em;
  height: 1em;
  clip: rect(0em, 1em, 1em, 0.5em);
}

.c100.p1 .bar {
  -moz-transform: rotate(3.6deg);
  -ms-transform: rotate(3.6deg);
  -webkit-transform: rotate(3.6deg);
  transform: rotate(3.6deg);
}

.c100.p2 .bar {
  -moz-transform: rotate(7.2deg);
  -ms-transform: rotate(7.2deg);
  -webkit-transform: rotate(7.2deg);
  transform: rotate(7.2deg);
}

.c100.p3 .bar {
  -moz-transform: rotate(10.8deg);
  -ms-transform: rotate(10.8deg);
  -webkit-transform: rotate(10.8deg);
  transform: rotate(10.8deg);
}

.c100.p4 .bar {
  -moz-transform: rotate(14.4deg);
  -ms-transform: rotate(14.4deg);
  -webkit-transform: rotate(14.4deg);
  transform: rotate(14.4deg);
}

.c100.p5 .bar {
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -webkit-transform: rotate(18deg);
  transform: rotate(18deg);
}

.c100.p6 .bar {
  -moz-transform: rotate(21.6deg);
  -ms-transform: rotate(21.6deg);
  -webkit-transform: rotate(21.6deg);
  transform: rotate(21.6deg);
}

.c100.p7 .bar {
  -moz-transform: rotate(25.2deg);
  -ms-transform: rotate(25.2deg);
  -webkit-transform: rotate(25.2deg);
  transform: rotate(25.2deg);
}

.c100.p8 .bar {
  -moz-transform: rotate(28.8deg);
  -ms-transform: rotate(28.8deg);
  -webkit-transform: rotate(28.8deg);
  transform: rotate(28.8deg);
}

.c100.p9 .bar {
  -moz-transform: rotate(32.4deg);
  -ms-transform: rotate(32.4deg);
  -webkit-transform: rotate(32.4deg);
  transform: rotate(32.4deg);
}

.c100.p10 .bar {
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -webkit-transform: rotate(36deg);
  transform: rotate(36deg);
}

.c100.p11 .bar {
  -moz-transform: rotate(39.6deg);
  -ms-transform: rotate(39.6deg);
  -webkit-transform: rotate(39.6deg);
  transform: rotate(39.6deg);
}

.c100.p12 .bar {
  -moz-transform: rotate(43.2deg);
  -ms-transform: rotate(43.2deg);
  -webkit-transform: rotate(43.2deg);
  transform: rotate(43.2deg);
}

.c100.p13 .bar {
  -moz-transform: rotate(46.8deg);
  -ms-transform: rotate(46.8deg);
  -webkit-transform: rotate(46.8deg);
  transform: rotate(46.8deg);
}

.c100.p14 .bar {
  -moz-transform: rotate(50.4deg);
  -ms-transform: rotate(50.4deg);
  -webkit-transform: rotate(50.4deg);
  transform: rotate(50.4deg);
}

.c100.p15 .bar {
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -webkit-transform: rotate(54deg);
  transform: rotate(54deg);
}

.c100.p16 .bar {
  -moz-transform: rotate(57.6deg);
  -ms-transform: rotate(57.6deg);
  -webkit-transform: rotate(57.6deg);
  transform: rotate(57.6deg);
}

.c100.p17 .bar {
  -moz-transform: rotate(61.2deg);
  -ms-transform: rotate(61.2deg);
  -webkit-transform: rotate(61.2deg);
  transform: rotate(61.2deg);
}

.c100.p18 .bar {
  -moz-transform: rotate(64.8deg);
  -ms-transform: rotate(64.8deg);
  -webkit-transform: rotate(64.8deg);
  transform: rotate(64.8deg);
}

.c100.p19 .bar {
  -moz-transform: rotate(68.4deg);
  -ms-transform: rotate(68.4deg);
  -webkit-transform: rotate(68.4deg);
  transform: rotate(68.4deg);
}

.c100.p20 .bar {
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -webkit-transform: rotate(72deg);
  transform: rotate(72deg);
}

.c100.p21 .bar {
  -moz-transform: rotate(75.6deg);
  -ms-transform: rotate(75.6deg);
  -webkit-transform: rotate(75.6deg);
  transform: rotate(75.6deg);
}

.c100.p22 .bar {
  -moz-transform: rotate(79.2deg);
  -ms-transform: rotate(79.2deg);
  -webkit-transform: rotate(79.2deg);
  transform: rotate(79.2deg);
}

.c100.p23 .bar {
  -moz-transform: rotate(82.8deg);
  -ms-transform: rotate(82.8deg);
  -webkit-transform: rotate(82.8deg);
  transform: rotate(82.8deg);
}

.c100.p24 .bar {
  -moz-transform: rotate(86.4deg);
  -ms-transform: rotate(86.4deg);
  -webkit-transform: rotate(86.4deg);
  transform: rotate(86.4deg);
}

.c100.p25 .bar {
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.c100.p26 .bar {
  -moz-transform: rotate(93.6deg);
  -ms-transform: rotate(93.6deg);
  -webkit-transform: rotate(93.6deg);
  transform: rotate(93.6deg);
}

.c100.p27 .bar {
  -moz-transform: rotate(97.2deg);
  -ms-transform: rotate(97.2deg);
  -webkit-transform: rotate(97.2deg);
  transform: rotate(97.2deg);
}

.c100.p28 .bar {
  -moz-transform: rotate(100.8deg);
  -ms-transform: rotate(100.8deg);
  -webkit-transform: rotate(100.8deg);
  transform: rotate(100.8deg);
}

.c100.p29 .bar {
  -moz-transform: rotate(104.4deg);
  -ms-transform: rotate(104.4deg);
  -webkit-transform: rotate(104.4deg);
  transform: rotate(104.4deg);
}

.c100.p30 .bar {
  -moz-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  -webkit-transform: rotate(108deg);
  transform: rotate(108deg);
}

.c100.p31 .bar {
  -moz-transform: rotate(111.6deg);
  -ms-transform: rotate(111.6deg);
  -webkit-transform: rotate(111.6deg);
  transform: rotate(111.6deg);
}

.c100.p32 .bar {
  -moz-transform: rotate(115.2deg);
  -ms-transform: rotate(115.2deg);
  -webkit-transform: rotate(115.2deg);
  transform: rotate(115.2deg);
}

.c100.p33 .bar {
  -moz-transform: rotate(118.8deg);
  -ms-transform: rotate(118.8deg);
  -webkit-transform: rotate(118.8deg);
  transform: rotate(118.8deg);
}

.c100.p34 .bar {
  -moz-transform: rotate(122.4deg);
  -ms-transform: rotate(122.4deg);
  -webkit-transform: rotate(122.4deg);
  transform: rotate(122.4deg);
}

.c100.p35 .bar {
  -moz-transform: rotate(126deg);
  -ms-transform: rotate(126deg);
  -webkit-transform: rotate(126deg);
  transform: rotate(126deg);
}

.c100.p36 .bar {
  -moz-transform: rotate(129.6deg);
  -ms-transform: rotate(129.6deg);
  -webkit-transform: rotate(129.6deg);
  transform: rotate(129.6deg);
}

.c100.p37 .bar {
  -moz-transform: rotate(133.2deg);
  -ms-transform: rotate(133.2deg);
  -webkit-transform: rotate(133.2deg);
  transform: rotate(133.2deg);
}

.c100.p38 .bar {
  -moz-transform: rotate(136.8deg);
  -ms-transform: rotate(136.8deg);
  -webkit-transform: rotate(136.8deg);
  transform: rotate(136.8deg);
}

.c100.p39 .bar {
  -moz-transform: rotate(140.4deg);
  -ms-transform: rotate(140.4deg);
  -webkit-transform: rotate(140.4deg);
  transform: rotate(140.4deg);
}

.c100.p40 .bar {
  -moz-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  -webkit-transform: rotate(144deg);
  transform: rotate(144deg);
}

.c100.p41 .bar {
  -moz-transform: rotate(147.6deg);
  -ms-transform: rotate(147.6deg);
  -webkit-transform: rotate(147.6deg);
  transform: rotate(147.6deg);
}

.c100.p42 .bar {
  -moz-transform: rotate(151.2deg);
  -ms-transform: rotate(151.2deg);
  -webkit-transform: rotate(151.2deg);
  transform: rotate(151.2deg);
}

.c100.p43 .bar {
  -moz-transform: rotate(154.8deg);
  -ms-transform: rotate(154.8deg);
  -webkit-transform: rotate(154.8deg);
  transform: rotate(154.8deg);
}

.c100.p44 .bar {
  -moz-transform: rotate(158.4deg);
  -ms-transform: rotate(158.4deg);
  -webkit-transform: rotate(158.4deg);
  transform: rotate(158.4deg);
}

.c100.p45 .bar {
  -moz-transform: rotate(162deg);
  -ms-transform: rotate(162deg);
  -webkit-transform: rotate(162deg);
  transform: rotate(162deg);
}

.c100.p46 .bar {
  -moz-transform: rotate(165.6deg);
  -ms-transform: rotate(165.6deg);
  -webkit-transform: rotate(165.6deg);
  transform: rotate(165.6deg);
}

.c100.p47 .bar {
  -moz-transform: rotate(169.2deg);
  -ms-transform: rotate(169.2deg);
  -webkit-transform: rotate(169.2deg);
  transform: rotate(169.2deg);
}

.c100.p48 .bar {
  -moz-transform: rotate(172.8deg);
  -ms-transform: rotate(172.8deg);
  -webkit-transform: rotate(172.8deg);
  transform: rotate(172.8deg);
}

.c100.p49 .bar {
  -moz-transform: rotate(176.4deg);
  -ms-transform: rotate(176.4deg);
  -webkit-transform: rotate(176.4deg);
  transform: rotate(176.4deg);
}

.c100.p50 .bar {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100.p51 .bar {
  -moz-transform: rotate(183.6deg);
  -ms-transform: rotate(183.6deg);
  -webkit-transform: rotate(183.6deg);
  transform: rotate(183.6deg);
}

.c100.p52 .bar {
  -moz-transform: rotate(187.2deg);
  -ms-transform: rotate(187.2deg);
  -webkit-transform: rotate(187.2deg);
  transform: rotate(187.2deg);
}

.c100.p53 .bar {
  -moz-transform: rotate(190.8deg);
  -ms-transform: rotate(190.8deg);
  -webkit-transform: rotate(190.8deg);
  transform: rotate(190.8deg);
}

.c100.p54 .bar {
  -moz-transform: rotate(194.4deg);
  -ms-transform: rotate(194.4deg);
  -webkit-transform: rotate(194.4deg);
  transform: rotate(194.4deg);
}

.c100.p55 .bar {
  -moz-transform: rotate(198deg);
  -ms-transform: rotate(198deg);
  -webkit-transform: rotate(198deg);
  transform: rotate(198deg);
}

.c100.p56 .bar {
  -moz-transform: rotate(201.6deg);
  -ms-transform: rotate(201.6deg);
  -webkit-transform: rotate(201.6deg);
  transform: rotate(201.6deg);
}

.c100.p57 .bar {
  -moz-transform: rotate(205.2deg);
  -ms-transform: rotate(205.2deg);
  -webkit-transform: rotate(205.2deg);
  transform: rotate(205.2deg);
}

.c100.p58 .bar {
  -moz-transform: rotate(208.8deg);
  -ms-transform: rotate(208.8deg);
  -webkit-transform: rotate(208.8deg);
  transform: rotate(208.8deg);
}

.c100.p59 .bar {
  -moz-transform: rotate(212.4deg);
  -ms-transform: rotate(212.4deg);
  -webkit-transform: rotate(212.4deg);
  transform: rotate(212.4deg);
}

.c100.p60 .bar {
  -moz-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  -webkit-transform: rotate(216deg);
  transform: rotate(216deg);
}

.c100.p61 .bar {
  -moz-transform: rotate(219.6deg);
  -ms-transform: rotate(219.6deg);
  -webkit-transform: rotate(219.6deg);
  transform: rotate(219.6deg);
}

.c100.p62 .bar {
  -moz-transform: rotate(223.2deg);
  -ms-transform: rotate(223.2deg);
  -webkit-transform: rotate(223.2deg);
  transform: rotate(223.2deg);
}

.c100.p63 .bar {
  -moz-transform: rotate(226.8deg);
  -ms-transform: rotate(226.8deg);
  -webkit-transform: rotate(226.8deg);
  transform: rotate(226.8deg);
}

.c100.p64 .bar {
  -moz-transform: rotate(230.4deg);
  -ms-transform: rotate(230.4deg);
  -webkit-transform: rotate(230.4deg);
  transform: rotate(230.4deg);
}

.c100.p65 .bar {
  -moz-transform: rotate(234deg);
  -ms-transform: rotate(234deg);
  -webkit-transform: rotate(234deg);
  transform: rotate(234deg);
}

.c100.p66 .bar {
  -moz-transform: rotate(237.6deg);
  -ms-transform: rotate(237.6deg);
  -webkit-transform: rotate(237.6deg);
  transform: rotate(237.6deg);
}

.c100.p67 .bar {
  -moz-transform: rotate(241.2deg);
  -ms-transform: rotate(241.2deg);
  -webkit-transform: rotate(241.2deg);
  transform: rotate(241.2deg);
}

.c100.p68 .bar {
  -moz-transform: rotate(244.8deg);
  -ms-transform: rotate(244.8deg);
  -webkit-transform: rotate(244.8deg);
  transform: rotate(244.8deg);
}

.c100.p69 .bar {
  -moz-transform: rotate(248.4deg);
  -ms-transform: rotate(248.4deg);
  -webkit-transform: rotate(248.4deg);
  transform: rotate(248.4deg);
}

.c100.p70 .bar {
  -moz-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  -webkit-transform: rotate(252deg);
  transform: rotate(252deg);
}

.c100.p71 .bar {
  -moz-transform: rotate(255.6deg);
  -ms-transform: rotate(255.6deg);
  -webkit-transform: rotate(255.6deg);
  transform: rotate(255.6deg);
}

.c100.p72 .bar {
  -moz-transform: rotate(259.2deg);
  -ms-transform: rotate(259.2deg);
  -webkit-transform: rotate(259.2deg);
  transform: rotate(259.2deg);
}

.c100.p73 .bar {
  -moz-transform: rotate(262.8deg);
  -ms-transform: rotate(262.8deg);
  -webkit-transform: rotate(262.8deg);
  transform: rotate(262.8deg);
}

.c100.p74 .bar {
  -moz-transform: rotate(266.4deg);
  -ms-transform: rotate(266.4deg);
  -webkit-transform: rotate(266.4deg);
  transform: rotate(266.4deg);
}

.c100.p75 .bar {
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}

.c100.p76 .bar {
  -moz-transform: rotate(273.6deg);
  -ms-transform: rotate(273.6deg);
  -webkit-transform: rotate(273.6deg);
  transform: rotate(273.6deg);
}

.c100.p77 .bar {
  -moz-transform: rotate(277.2deg);
  -ms-transform: rotate(277.2deg);
  -webkit-transform: rotate(277.2deg);
  transform: rotate(277.2deg);
}

.c100.p78 .bar {
  -moz-transform: rotate(280.8deg);
  -ms-transform: rotate(280.8deg);
  -webkit-transform: rotate(280.8deg);
  transform: rotate(280.8deg);
}

.c100.p79 .bar {
  -moz-transform: rotate(284.4deg);
  -ms-transform: rotate(284.4deg);
  -webkit-transform: rotate(284.4deg);
  transform: rotate(284.4deg);
}

.c100.p80 .bar {
  -moz-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  -webkit-transform: rotate(288deg);
  transform: rotate(288deg);
}

.c100.p81 .bar {
  -moz-transform: rotate(291.6deg);
  -ms-transform: rotate(291.6deg);
  -webkit-transform: rotate(291.6deg);
  transform: rotate(291.6deg);
}

.c100.p82 .bar {
  -moz-transform: rotate(295.2deg);
  -ms-transform: rotate(295.2deg);
  -webkit-transform: rotate(295.2deg);
  transform: rotate(295.2deg);
}

.c100.p83 .bar {
  -moz-transform: rotate(298.8deg);
  -ms-transform: rotate(298.8deg);
  -webkit-transform: rotate(298.8deg);
  transform: rotate(298.8deg);
}

.c100.p84 .bar {
  -moz-transform: rotate(302.4deg);
  -ms-transform: rotate(302.4deg);
  -webkit-transform: rotate(302.4deg);
  transform: rotate(302.4deg);
}

.c100.p85 .bar {
  -moz-transform: rotate(306deg);
  -ms-transform: rotate(306deg);
  -webkit-transform: rotate(306deg);
  transform: rotate(306deg);
}

.c100.p86 .bar {
  -moz-transform: rotate(309.6deg);
  -ms-transform: rotate(309.6deg);
  -webkit-transform: rotate(309.6deg);
  transform: rotate(309.6deg);
}

.c100.p87 .bar {
  -moz-transform: rotate(313.2deg);
  -ms-transform: rotate(313.2deg);
  -webkit-transform: rotate(313.2deg);
  transform: rotate(313.2deg);
}

.c100.p88 .bar {
  -moz-transform: rotate(316.8deg);
  -ms-transform: rotate(316.8deg);
  -webkit-transform: rotate(316.8deg);
  transform: rotate(316.8deg);
}

.c100.p89 .bar {
  -moz-transform: rotate(320.4deg);
  -ms-transform: rotate(320.4deg);
  -webkit-transform: rotate(320.4deg);
  transform: rotate(320.4deg);
}

.c100.p90 .bar {
  -moz-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  -webkit-transform: rotate(324deg);
  transform: rotate(324deg);
}

.c100.p91 .bar {
  -moz-transform: rotate(327.6deg);
  -ms-transform: rotate(327.6deg);
  -webkit-transform: rotate(327.6deg);
  transform: rotate(327.6deg);
}

.c100.p92 .bar {
  -moz-transform: rotate(331.2deg);
  -ms-transform: rotate(331.2deg);
  -webkit-transform: rotate(331.2deg);
  transform: rotate(331.2deg);
}

.c100.p93 .bar {
  -moz-transform: rotate(334.8deg);
  -ms-transform: rotate(334.8deg);
  -webkit-transform: rotate(334.8deg);
  transform: rotate(334.8deg);
}

.c100.p94 .bar {
  -moz-transform: rotate(338.4deg);
  -ms-transform: rotate(338.4deg);
  -webkit-transform: rotate(338.4deg);
  transform: rotate(338.4deg);
}

.c100.p95 .bar {
  -moz-transform: rotate(342deg);
  -ms-transform: rotate(342deg);
  -webkit-transform: rotate(342deg);
  transform: rotate(342deg);
}

.c100.p96 .bar {
  -moz-transform: rotate(345.6deg);
  -ms-transform: rotate(345.6deg);
  -webkit-transform: rotate(345.6deg);
  transform: rotate(345.6deg);
}

.c100.p97 .bar {
  -moz-transform: rotate(349.2deg);
  -ms-transform: rotate(349.2deg);
  -webkit-transform: rotate(349.2deg);
  transform: rotate(349.2deg);
}

.c100.p98 .bar {
  -moz-transform: rotate(352.8deg);
  -ms-transform: rotate(352.8deg);
  -webkit-transform: rotate(352.8deg);
  transform: rotate(352.8deg);
}

.c100.p99 .bar {
  -moz-transform: rotate(356.4deg);
  -ms-transform: rotate(356.4deg);
  -webkit-transform: rotate(356.4deg);
  transform: rotate(356.4deg);
}

.c100.p100 .bar {
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

.c100:hover {
  cursor: default;
}

.c100:hover>span {
  width: 3.33em;
  line-height: 3.33em;
  font-size: 0.3em;
  color: #3c4761;
}

.c100:hover:after {
  top: 0.07em;
  left: 0.07em;
  width: 0.86em;
  height: 0.86em;
}

.c100.blue .bar,
.c100.blue .fill {
  border-color: #00dd80 !important;
}

.c100.blue:hover>span {
  color: #3c4761;
}

.c100.pink .bar,
.c100.pink .fill {
  border-color: #d74680 !important;
}

.c100.pink:hover>span {
  color: #3c4761;
}

.c100.green .bar,
.c100.green .fill {
  border-color: #15c7a8 !important;
}

.c100.green:hover>span {
  color: #3c4761;
}

.c100.orange .bar,
.c100.orange .fill {
  border-color: #eb7d4b !important;
}

.c100.orange:hover>span {
  color: #3c4761;
}

#container {
  width: 100%;
}

#background-container {
  display: block;
}

/* MENU ELEMENTS */

.button {
  font-size: 14px;
  height: 75px;
  font-weight: 400;
  line-height: 75px;
  cursor: pointer;
  margin-right: 59px;
  text-align: center;
  float: left;
  color: rgb(204, 204, 204);
  box-sizing: border-box;
  /* border-right: 1px solid #222636; */
  transition: color 0.5s;
}


.button:hover {
  color: #367cff;
  transition: color 0.5s;
}

/* RESIZE - for section content - preserve everthing in 960px width */
/*-------------------------------------------------*/
.resize-huge {
  max-width: 1440px;
  margin: 0 auto;
  border-spacing: 0;
}

.resize-big {
  max-width: 1280px;
  margin: 0 auto;
  border-spacing: 0;
}

.resize {
  max-width: 1024px;
  margin: 0 auto;
  border-spacing: 0;
}

.resize-medium {
  max-width: 840px;
  margin: 0 auto;
}

.resize-small {
  max-width: 640px;
  margin: 0 auto;
}

.resize-tiny {
  max-width: 480px;
  margin: 0 auto;
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*_________________________________________________________*/
/* GLOBAL CLASSES */
/*_________________________________________________________*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/* DISPLAY PROPERTIES */
/*-------------------------------------------------*/

.show {
  display: block;
}

.hide {
  display: none;
}

.unselect {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Old versions of Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}

.notap {
  -webkit-tap-highlight-color: transparent;
}

.f-red-highlightbox {
  background: #cf3156;
  display: inline-block;
  padding: 0 10px;
  color: #000000;
  border-radius: 12px;
  height: 25px;
  line-height: 25px;
}


/* DIV box and background styles */
/*-------------------------------------------------*/

.black {
  background-color: rgba(0, 0, 0, 1);
  color: #b7b7b7;
  text-align: center;
}

.white {
  background-color: rgb(255, 255, 255);
  text-align: center;
}

.color {
  background-color: rgba(16, 46, 187, 0.33);
  color: #333;
  text-align: center;
}

.snowflake {
  background: rgba(16, 46, 187, 0.03);
  box-shadow: 0px 0px 50px rgba(25, 32, 255, 0.05) inset;
}

.glass-white {
  background: rgba(255, 255, 255, 0.8) none repeat scroll 0% 0%;
}

.glass-white-opacity {
  background: rgba(255, 255, 255, 0.5) none repeat scroll 0% 0%;
}

.glass-white-gradient {
  background: transparent linear-gradient(rgba(255, 255, 255, 0.85), #FFF) repeat scroll 0% 0%;
}

.glass-black {
  background: rgba(9, 2, 23, 0.85) none repeat scroll 0% 0%;
}

.glass-trans-black {
  background: rgba(0, 0, 0, 0.3) none repeat scroll 0% 0%;
}

.glass-colour {
  background-color: rgba(96, 0, 255, 0.26);
}

.content-button {
  color: rgb(177, 177, 177);
  border: 1px solid rgba(255, 255, 255, 0.43);
  border-radius: 20px;
  padding: 10px;
  margin: 20px;
  cursor: pointer;
  transition: border 0.5s, color 0.5s;
}

.content-button:hover {
  color: #528EFF;
  border: 1px solid rgba(98, 126, 255, 0.43);
  transition: border 0.5s, color 0.5s;
}

.border {
  border: 1px solid rgba(255, 255, 255, 0.23);
  border-radius: 20px;
}

.border-kpic {
  padding: 5px 0;
  width: 100%;
  border-bottom: 1px solid #383a54;
}

.border-gray {
  border: 1px solid #333e56;
}

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

.border-teal {
  border: 1px solid #223f48 !important;
}

.border-blue {
  border: 1px solid #528dff94 !important;
}

.border-teal2 {
  border: 1px solid #29d2d685 !important;
}

.border-purple {
  border: 1px solid #3a3369 !important;
}

.border-orange {
  border: 1px solid #532e2a !important;
}

.border-orange-light {
  border: 1px solid #cb663e !important;
}

/* FONT PROPERTIES */
/*-------------------------------------------------*/


/*  size  */

h1 {
  font-size: 64px !important;
  line-height: 1.47 !important;
}

h2 {
  font-size: 52px !important;
  line-height: 1.47 !important;
}

h3 {
  font-size: 40px !important;
  line-height: 1.47 !important;
}

h4 {
  font-size: 30px !important;
  line-height: 1.47 !important;
}

h5 {
  font-size: 24px !important;
  margin-bottom: 0px;
  line-height: 1.47 !important;
}

h6 {
  font-size: 20px !important;
  margin-bottom: 0px;
  line-height: 1.47 !important;
}

p {
  font-size: 16px !important;
  font-weight: 400;
  line-height: 1.5;
}

.shadow-underline {
  padding: 10px;
  /* border-bottom: 1px solid #926aff91; */
  box-shadow: 0 30px 50px -40px #3925ff;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgb(75, 51, 142) 50%, rgba(255, 255, 255, 0) 100%);
  background-size: 100% 1px;
  background-position: bottom;
  background-repeat: no-repeat;
}

.shadow-underline-premium {
  padding: 30px;
  /* border-bottom: 1px solid #926aff91; */
  box-shadow: 0 30px 50px -40px #1bbcaf;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgb(67, 189, 179) 50%, rgba(255, 255, 255, 0) 100%);
  background-size: 100% 1px;
  background-position: bottom;
  background-repeat: no-repeat;
}

li {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
}

.mobile-no.hide {
  display: none;
}

.mobile-only {
  display: none;
}

.mobile-only-table-cell {
  display: none;
}

.f-dim {
  opacity: 0.6;
}
/*  weight  */

.f-thin {
  font-weight: 100;
}

.f-light {
  font-weight: 300;
}

.f-regular {
  font-weight: 400;
}

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

.f-heavy {
  font-weight: 600;
}

/* colors */

.f-white {
  color: #bec7eb !important;
}

.f-dimmed {
  color: rgb(202 206 235 / 60%);
}

.f-purewhite {
  color: white;
}

.f-grey {
  color: rgba(255, 255, 255, 0.6);
}

.f-darkgrey {
  color: #626262;
}

.f-greyblue {
  color: rgba(2, 0, 47, 0.49);
}

.f-black {
  color: #343b40 !important;
}

.f-blue {
  color: #528EFF !important;
}

.f-tealblue {
  color: #14a2df !important;
}

.f-orange {
  color: #ff7b45 !important;
}

.f-darkblue {
  color: #3F5B8E !important;
  ;
}

.f-lightblue {
  color: #7893C4 !important;
  ;
}

.f-yellowgreen {
  color: #6bdb6c !important;
}

.f-green {
  color: rgb(15 235 185) !important;
}

.f-pinkpurple {
  color: #c049ca !important;
}

.f-pink {
  color: #ff5775 !important;
}

.f-red {
  color: #ff3b63 !important;
}

.f-bright-red {
  color: #ff3a3a !important;
  ;
}

.f-lightgreen {
  color: #1dffba !important;
}

.f-semigold {
  color: #c4bc49 !important;
}

.f-gold {
  color: rgb(198, 137, 27) !important;
  ;
}

.f-yellow {
  color: #ffb645 !important;
  ;
}

.f-coldblue {
  color: #C7D5FF !important;
  ;
}

.f-purple {
  color: #8c75ff !important;
}

.f-teal {
  color: #28d2d6 !important;
  ;
}

.f-cyan {
  color: #42deff !important;
}


/* alignment */

.f-center {
  text-align: center !important;
}

.f-right {
  text-align: right !important;
}

.f-left {
  text-align: left !important;
}

.f-vertical {
  vertical-align: middle;
}

.f-vertical-top {
  vertical-align: top;
}


/* WIDTH ELEMENTS */


/*-------------------------------------------------*/
.wd-auto {
  width: auto !important;
}

.wd10 {
  width: 10px;
}


.wd20 {
  width: 20px;
}

.wd30 {
  width: 30px;
}

.wd40 {
  width: 40px;
}

.wd50 {
  width: 50px;
}

.wd100 {
  width: 100px;
}

.wd120 {
  width: 100px !important;
}

.wd150 {
  width: 150px !important;
}

.wd200 {
  width: 200px;
}

.wd300 {
  width: 300px;
}

.wd320 {
  width: 320px;
}

.wd400 {
  width: 400px;
}

.wd500 {
  width: 500px;
}

.wd600 {
  width: 600px;
}

.wd700 {
  width: 700px;
}

.wdfull {
  width: 100% !important;
}


/* HEIGHT ELEMENTS */


/*-------------------------------------------------*/
.ht1 {
  height: 1px;
}

.ht5 {
  height: 5px;
}

.ht10 {
  height: 10px;
}

.ht20 {
  height: 20px;
}

.ht25 {
  height: 25px;
}

.ht30 {
  height: 30px;
}

.ht40 {
  height: 40px;
}

.ht50 {
  height: 50px;
}

.ht60 {
  height: 60px;
}

.ht75 {
  height: 75px;
}

.ht75-menu {
  height: 75px;
}

.ht100 {
  height: 100px;
}

.ht120 {
  height: 120px;
}

.ht150 {
  height: 150px;
}

.ht200 {
  height: 200px;
}

.ht250 {
  height: 250px;
}

.ht300 {
  height: 300px;
}

.ht400 {
  height: 400px;
}

.ht500 {
  height: 500px;
}

.ht600 {
  height: 600px;
}

.ht700 {
  height: 700px;
}

.ht800 {
  height: 800px;
}

.ht100scalable {
  height: 100px;
}

.ht120scalable {
  height: 120px;
}

.ht150scalable {
  height: 150px;
}

.ht200scalable {
  height: 200px;
}

.htfull {
  min-height: 100%;
}

.htvh {
  height: 100vh;
}

.ht100perc {
  height: 100% !important;
}

.dynamic-height {
  /* new div with scrollbar */
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  /* hack for smooth scrolling on iOS devices */
  -webkit-overflow-scrolling: touch;
}

/* CHECKBOX */
.control {
  font-family: arial;
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 12px;
  padding-top: 2px;
  cursor: pointer;
  font-size: 16px;
}

.control input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}

.control_indicator {
  position: absolute;
  top: 2px;
  left: 0;
  height: 20px;
  width: 20px;
  background: #e6e6e6;
  border: 0px solid #000000;
  border-radius: 3px;
}

/* .control-radio .control_indicator {
    border-radius: 3px;
  } */

.control:hover input~.control_indicator,
.control input:focus~.control_indicator {
  background: #cccccc;
}

.control input:checked~.control_indicator {
  background: #2aa1c0;
}

/* .control:hover input:not([disabled]):checked ~ .control_indicator,
  .control input:checked:focus ~ .control_indicator {
    background: #0e6647d;
  } */

.control input:disabled~.control_indicator {
  background: #e6e6e6;
  opacity: 0.6;
  pointer-events: none;
}

.control_indicator:after {
  box-sizing: unset;
  content: '';
  position: absolute;
  display: none;
}

.control input:checked~.control_indicator:after {
  display: block;
}

.control-checkbox .control_indicator:after {
  left: 8px;
  top: 4px;
  width: 3px;
  height: 8px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.control-checkbox input:disabled~.control_indicator:after {
  border-color: #7b7b7b;
}


/* LINKS AND FORMS*/
/*-------------------------------------------------*/

a {
  color: inherit;
  text-decoration: none;
}

nav a {
  color: inherit;
  text-decoration: none;
}

form {
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 10px;
}

form input,
form textarea {
  font-size: 1rem;
  line-height: 1.5;
  display: block;
  width: 100%;
  padding: .625rem .75rem;
  transition: all .2s cubic-bezier(.68, -.55, .265, 1.55);
  color: #8898aa;
  border: 1px solid #cad1d7;
  border-radius: .25rem;
  background-color: #fff;
  background-clip: padding-box;
  transition: box-shadow .15s ease;
  border: 0;
  margin-bottom: 10px;
  box-shadow: 0 1px 3px rgba(50, 50, 93, .15), 0 1px 0 rgba(0, 0, 0, .02);
  outline: none;
}

form input:focus,
form textarea:focus {
  border-radius: 10px;
  color: #4B59AD;
}

#contact_info_container form #contact_submit:focus {
  border-radius: 30px;
  color: white;
}

form textarea {
  height: 126px;
}

form input,
select,
textarea {
  color: #2b89d2;
}

hr {
  border: 0;
  height: 1px;
  background: rgba(129, 129, 129, 0.19);
}

.a-hoverable:hover {
  color: #69CE89;
}


/* PADDING AND MARGIN ELEMENTS */


/*-------------------------------------------------*/

.margin0 {
  margin-top: 50px;
}

.margin20 {
  margin: 20px;
}

.margin-top100 {
  margin-top: 100px;
}

.margin-b0 {
  margin-bottom: 0;
}

.margin-b50 {
  margin-bottom: 50px;
}

.margin-b100 {
  margin-bottom: 80px;
}

.margin-b20 {
  margin-bottom: 20px;
}

.margin-b10 {
  margin-bottom: 10px;
}

.margin-t0 {
  margin-top: 0;
}

.margin-t10 {
  margin-top: 10px;
}

.margin-t15 {
  margin-top: 15px;
}

.margin-t20 {
  margin-top: 20px;
}

.margin-t30 {
  margin-top: 30px;
}

.margin-t50 {
  margin-top: 50px;
}

.margin-top75 {
  margin-top: 75px;
}

.margin-none {
  margin: 0;
}

.center {
  margin: 0 auto !important;
}

.statement-type-selector.center {
  margin: 0 auto !important;
}

.padding50 {
  padding: 50px;
}

.padding50-lr {
  padding: 0 50px;
}

.padding10-lr {
  padding: 0 10px;
}

.padding100 {
  padding: 100px;
}

.padding30 {
  padding: 30px;
}

.padding20 {
  padding: 20px;
}

.padding10 {
  padding: 10px;
}

.padding0 {
  padding: 0 !important;
}


/* RESPONSIVE LAYOUT GRID SYSTEM */


/*  sections aka TABLES  */
.section-container {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.no-smoothing {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

.font-smoothing {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.section-web {
  display: table;
  border-spacing: 0;
  border-collapse: separate;
  clear: both;
  position: relative;
  z-index: 2;
}

.section {
  display: table;
  border-spacing: 0;
  border-collapse: separate;
  clear: both;
  position: relative;
  z-index: 2;
}


html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

.row {
  display: table-row;
}

.chart-col {
  vertical-align: top;
  display: inline-block;
}

.col {
  vertical-align: top;
  display: table-cell;
}

.col-inline {
  display: inline-block;
  vertical-align: top;
}

.col_no_span {
  vertical-align: top;
  display: table-cell;
}

/*  GROUPING  */

.group:before,
.group:after {
  content: "";
  display: table;
}

.group:after {
  clear: both;
}

.group {
  zoom: 1;
  /* For IE 6/7 */
}


/*  GRID OF TWELVE  */

.fixed {
  /*Fixed Center Content width */
  width: 800px;
}

.span_12_of_12 {
  width: 100%;
}

.span_11_of_12 {
  width: 91.53%;
}

.span_10_of_12 {
  width: 83.3%;
}

.span_9_of_12 {
  width: 75%;
}

.span_8_of_12 {
  width: 66.66%;
}

.span_7_of_12 {
  width: 58.33%;
}

.span_6_of_12 {
  width: 50%;
}

.span_5_of_12 {
  width: 41.66%;
}

.span_4_of_12 {
  width: 33.33%;
}

.span_3_of_12 {
  width: 25%;
}

.span_2_of_12 {
  width: 16.66%;
}

.span_1_of_12 {
  width: 8.333%;
}

.no_span_12_of_12 {
  width: 100%;
}

.no_span_11_of_12 {
  width: 91.53%;
}

.no_span_10_of_12 {
  width: 83.3%;
}

.no_span_9_of_12 {
  width: 75%;
}

.no_span_8_of_12 {
  width: 66.66%;
}

.no_span_7_of_12 {
  width: 58.33%;
}

.no_span_6_of_12 {
  width: 50%;
}

.no_span_5_of_12 {
  width: 41.66%;
}

.no_span_4_of_12 {
  width: 33.33%;
}

.no_span_3_of_12 {
  width: 25%;
}

.no_span_2_of_12 {
  width: 16.66%;
}

.no_span_1_of_12 {
  width: 8.333%;
}

.arconmarLoader {
  text-align: center;
  margin: 0 auto;
  width: 60px;
  vertical-align: middle;
}

.arconmarLoader-text {
  color: #5ed9fc;
  padding: 150px 0 50px 0;
}

.arconmarLoader-container {
  position: absolute;
  background: -webkit-radial-gradient(50% top, circle, #1d2131 0, rgb(10 18 30 / 59%) 75%), -webkit-radial-gradient(right top, circle, #18182f 0, rgb(31 20 41 / 97%) 57%) !important;
  border-radius: 5px;
  text-align: center;
  border-radius: 10px;
  border: 1px solid #22a7bb14;
  width: calc(100% - 60px);
  min-height: 600px;
  z-index: 300;
  top: 0;
  bottom: 0;
}

.arconmarLoader-width-50 {
  width: calc(100% - 100px) !important;
}

.arconmarLoader-width-full {
  width: 100%;
}

.arconmarLoader:after {
  content: " ";
  display: block;
  width: 60px;
  height: 60px;
  margin: 0px;
  border-radius: 50%;
  border: 6px solid #fff;
  border-color: #5ed9fc transparent #5ed9fc transparent;
  animation: arconmarLoader 1.5s linear infinite;
}

@keyframes arconmarLoader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.signal-bars {
  display: inline-block;
  height: 40px;
  width: 50px;
}

.signal-bars .bar {
  width: 12%;
  margin-left: 1%;
  min-height: 20%;
  display: inline-block;
}

.signal-bars .bar.first-bar {
  height: 20%;
}

.signal-bars .bar.second-bar {
  height: 40%;
}

.signal-bars .bar.third-bar {
  height: 60%;
}

.signal-bars .bar.fourth-bar {
  height: 80%;
}

.signal-bars .bar.fifth-bar {
  height: 99%;
}

.five-bars .bar {
  background-color: #17eab2;
}

.four-bars .bar {
  background-color: #17eab2;
}

.three-bars .bar {
  background-color: #f8c248;
}

.two-bars .bar {
  background-color: #ed6625;
}

.one-bar .bar {
  background-color: #e74c3c;
}

.four-bars .bar.fifth-bar,
.three-bars .bar.fifth-bar,
.three-bars .bar.fourth-bar,
.one-bar .bar:not(.first-bar),
.two-bars .bar:not(.first-bar):not(.second-bar) {
  background-color: #474b59;
}