﻿.renewable-calc {
  font-family: "Open Sans", sans-serif;
}

.renewable-calc {
  padding-top: 2%;
  max-width: 890px;
}
.renewable-calc .row.d-flex.justify-content-space-evenly {
  margin-bottom: 0;
}

.btn-primary.ce-button {
  width: 100%;
  height: 48px;
  padding: auto;
  border: 4px solid #1565C0;
  border-radius: 6px;
  background: transparent;
  color: #1565C0;
  font-weight: bold;
  cursor: pointer;
}
.btn-primary.ce-button:hover {
  background: #1565C0;
  border-radius: 6px;
  color: #ffffff;
  font-weight: bold;
  cursor: pointer !important;
}
.btn-primary.ce-button:active {
  background: #1565C0;
  border-radius: 6px;
  color: #ffffff;
  font-weight: bold;
  cursor: pointer !important;
}

.btn-primary.ce-button-input {
  width: 100%;
  height: 48px;
  padding: 0 15px;
  border: 4px solid #1565C0;
  border-radius: 0 6px 6px 0;
  background: transparent;
  color: #1565C0;
  font-weight: bold;
  cursor: pointer;
}
.btn-primary.ce-button-input:hover {
  background: #1565C0;
  border-radius: 0 6px 6px 0;
  color: #ffffff;
  font-weight: bold;
  cursor: pointer !important;
}

.is-active {
  background: #1565C0 !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-weight: bold !important;
}

.boxed-in {
  background: #f5f5f5;
  border-radius: 14px;
}

.input-group-append > .numbers {
  height: 48px !important;
  border-top: 4px solid #cccccd !important;
  border-right: 0 solid #cccccd !important;
  border-bottom: 4px solid #cccccd !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  padding-left: 10px !important;
  background: #ffffff !important;
}

.numbers {
  width: 100%;
  max-width: 100%;
  height: 48px;
  border: 4px solid #cccccd;
  border-radius: 6px;
  padding-left: 10px;
  background: #ffffff;
}

.green-icon {
  color: #188431;
  font-size: 64px;
  padding-bottom: 15px;
}

.number-text {
  color: #4b4b4b;
  font-weight: 700;
  font-size: 24pt;
}

.green-text {
  color: #188431;
}

.blue-text {
  color: #1565C0;
}

.tiny-text {
  font-size: 12px;
  margin-bottom: 0.5rem !important;
}

.blue-result-text {
  color: #1565C0;
  font-size: 40px;
  font-weight: 700;
}

.blue-heading {
  font-size: 25pt;
  color: #1565C0;
  font-weight: 700;
}

.gray {
  color: #929292;
  font-size: 18px;
}

.dark-gray-bg {
  background: #dfdfdf;
  border-radius: 14px;
}

.boldtxt {
  font-size: 20px;
  font-weight: 700;
}

.small-txt {
  font-size: 13pt;
  font-weight: 500;
  color: #4b4b4b;
}

.big-green-numbers {
  color: #188431;
  font-size: 30px;
}
.big-green-numbers span {
  color: #188431;
  font-size: 30px;
}

.big-blue-numbers {
  color: #1565C0;
  font-size: 30px;
}
.big-blue-numbers span {
  color: #1565C0;
  font-size: 30px;
}

.results-text {
  font-size: 12px;
  font-weight: 700;
  color: #000000;
}

.ce-hr {
  border-bottom: 1px solid #999999;
}

.heading-4 {
  font-size: 18px;
}

.small-margin-top {
  margin-top: 10px;
}

@media screen and (min-width: 1024px) {
  .small-margin-top {
    margin-top: 45px !important;
  }
  .hide-for-desktop {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .hide-for-mobile {
    display: none !important;
  }
  .input-group-append > .numbers {
    height: 48px !important;
    border-top: 4px solid #cccccd !important;
    border-right: 0 solid #cccccd !important;
    border-bottom: 4px solid #cccccd !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    padding-left: 10px !important;
    background: #ffffff !important;
  }
  .heading {
    padding-left: 10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .hide-for-tablet {
    display: none !important;
  }
}
