<commit_before>// <----- START: Default styles ----->
svg {
  display: block;
  margin: auto;
}

body {
  font-family: "Montserrat", 'HelveticaNeue-Light', sans-serif !important;
  background-image: url("https://s3.amazonaws.com/comparable/DeathtoStock_Creative+Community3.jpg");
  background-size: cover;
  background-attachment: fixed;
}

#app {
  background-color: rgba(248, 248, 248, 0.7);
}

p {
  font-family: "Montserrat", 'HelveticaNeue-Light', sans-serif !important;
}
// <----- END: Default styles ----->

#home h1 {
  color: #2092e1;
}

#home .btn.btn-lg {
  color: #2092e1;
  border-radius: 35px;
}

#home .btn.btn-lg:hover {
  color: #fff;
  background-color: #ff8a37;
  border-radius: 35px;
}


.vertical-center {
  min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
  min-height: 100vh; /* These two lines are counted as one :-)       */

  display: flex;
  align-items: center;
}

// <----- START: Navbar styles ----->
.navbar-default .navbar-nav > li > a {
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  text-transform: uppercase;
}

.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
  margin-left: 0;
}

.navbar {
  padding: 5px 0px;
}

.navbar-brand {
  font-family: "Montserrat", sans-serif !important;
  padding-top: 14px;
  text-transform: uppercase;
}

.navbar-default .navbar-brand, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > li > a {
  color: #2092e1;
}

.navbar-brand:hover {
  color: #ff8a37 !important;
}

.navbar-default .navbar-nav > li > a:hover {
  color: #ff8a37;
}

#offer-btn {
  margin: 0 5px 0 5px;
  border: 2px solid #2092e1;
  border-radius: 35px;
  background-color: #f8f8f8;
  padding: 15px 24px !important;
  color: #2092e1 !important;
}

#offer-btn:hover {
  border: 2px solid #ff8a37 !important;
  background: #ff8a37 !important;
  color: #fff !important;
}

.has-warning .form-control:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.has-warning .form-control {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.login-btn {
  cursor: pointer;
}
// <----- END: Navbar styles ----->

.axis path,
.axis line {
  fill: none;
  stroke: black;
  shape-rendering: crispEdges;
}

.axis text {
  font-family: sans-serif;
  font-size: 11px;
}

.controls button {
  display: block;
  margin: 4em auto 4em auto;
  background-color: 'aquawhite';
}

#equity {
  position: relative;
  top: -500px;
}

#salary {
  text-align: center;
}

.displayList {
  list-style: none
}

.offerTitle {
  font-size: 1.2em;
}

.offer-input .form-group {
  margin: 0px 3px;
}

.offer-form {
  text-align: center;
}

.offer-form .panel-default {
  margin-top: 10px;
}

.offer-form .panel-heading {
  background-color: #2092e1;
  color: #f8f8f8;
}

.btn.btn-success {
  border-radius: 35px;
  padding: 12px 18px !important;
}

.btn.btn-success:hover {
  // background-color: #ff8a37;
  background-color: #4caf50;
  color: #FFFFFF;
}

.toggle-btn {
  float: right;
  // border: 2px solid #2092e1;
  // border-radius: 35px;
  // background-color: #f8f8f8;
  // padding: 4px 8px !important;
  // color: #2092e1 !important;
}

.toggle-btn > button {
  border: 1px solid #2092e1;
  border-radius: 35px;
  background-color: #f8f8f8;
  padding: 4px 8px !important;
  color: #2092e1;
}

.toggle-btn > .btn:focus {
  border: 1px solid #ff8a37;
  background: #ff8a37;
  color: #fff;
}

// Badge Circles
.responsive-circle {
    font-size: 16px;
    font-weight: 700;
    margin: 0 20px 20px;
    width: 115%;
}

.responsive-circle::after {
    border-radius: 50%;
    content: "";
    display: block;
    height: 0;
    margin-bottom: 20px;
    padding-bottom: 100%;
    width: 100%;
}

.responsive-circle div {
    color: white;
    float: left;
    line-height: 1em;
    margin-top: -0.5em;
    padding-top: 40%;
    text-align: center;
    width: 100%;
}

.red-circle::after {
  background: #ff4d4d;
}

.green-circle::after {
  background: #5cd65c;
}

[class^=arr-]{
  border:       solid currentColor;
  border-width: 0 .2em .2em 0;
  display:      inline-block;
  padding:      .20em;
}

.arr-up    {transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}
.arr-down  {transform:rotate(45deg);   -webkit-transform:rotate(45deg);}

/*BUBBLE CHART CSS*/

.bubble-chart-container {
  flex: 1;
  position: relative;
  display: flex;
  user-select: none;
  justify-content: center;
}

/* Center text in the circle, and hide any overflow */
.bubble-chart-container .bubble-chart-text .bubble-label {
  text-align: center;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-around;
  border-radius: 50%;
  will-change: left, top, height, width;
}

/* Show the overflow when hovering over a label */
.bubble-chart-container .bubble-chart-text .bubble-label:hover {
  overflow: visible;
  font-weight: bold;
}

/* Optional, but recommended - reduce the size of text on medium bubbles */
.bubble-chart-container .bubble-chart-text .bubble-label.medium {
  font-size: 0.8em;
}

/* Optional, but recommended - hide the text on small bubbles */
.bubble-chart-container .bubble-chart-text .bubble-label.small {
  font-size: 0;
}
/* Make sure to unhide the text when hovering */
.bubble-chart-container .bubble-chart-text .bubble-label.small:hover {
  font-size: 0.8em;
}

.bubble-chart-d3 {
  width: 1000px;
  height: 1000px;
}
.bubble-legend {
  display: none;
}

// <--- Tooltips --->
.tooltip {
  padding: 3px;
  border: 2px solid;
  border-radius: 4px;
  background-color: #eeeeee;
  opacity: 1;
  justify-content: center;
  align-items: center;
}

// <--- END: Tooltips --->

// <--- Loader --->

.loader-container {
  width: 1080px;
  height: 900px;
  padding: 30px;
  text-align: -webkit-center;
  text-align: center;
  position: relative;
}

.loader-img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.offerCard {
  background: #fff;
  border-radius: 2px;
  height: 200px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  color: #555F61;
  font-size: 1.5em;
}

.cardTitle {
  padding: 0 0 0 .7em;
  font-weight: 600;
  color: #2092e1;
}

.offersHeading {
  padding: 10px;
  font-size: 3em;
  font-weight: bold;
  color: #2092e1;
}
<commit_msg>(enhancement) Update Body CSS background property:<commit_after>// <----- START: Default styles ----->
svg {
  display: block;
  margin: auto;
}

body {
  font-family: "Montserrat", 'HelveticaNeue-Light', sans-serif !important;
  background: linear-gradient(
      rgba(248, 248, 248, 0.7),
      rgba(248, 248, 248, 0.7)
    ),
     url("https://s3.amazonaws.com/comparable/DeathtoStock_Creative+Community3.jpg");
  background-size: cover;
  background-attachment: fixed;
}

p {
  font-family: "Montserrat", 'HelveticaNeue-Light', sans-serif !important;
}
// <----- END: Default styles ----->

#home h1 {
  color: #2092e1;
}

#home .btn.btn-lg {
  color: #2092e1;
  border-radius: 35px;
}

#home .btn.btn-lg:hover {
  color: #fff;
  background-color: #ff8a37;
  border-radius: 35px;
}


.vertical-center {
  min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
  min-height: 100vh; /* These two lines are counted as one :-)       */

  display: flex;
  align-items: center;
}

// <----- START: Navbar styles ----->
.navbar-default .navbar-nav > li > a {
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  text-transform: uppercase;
}

.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
  margin-left: 0;
}

.navbar {
  padding: 5px 0px;
}

.navbar-brand {
  font-family: "Montserrat", sans-serif !important;
  padding-top: 14px;
  text-transform: uppercase;
}

.navbar-default .navbar-brand, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > li > a {
  color: #2092e1;
}

.navbar-brand:hover {
  color: #ff8a37 !important;
}

.navbar-default .navbar-nav > li > a:hover {
  color: #ff8a37;
}

#offer-btn {
  margin: 0 5px 0 5px;
  border: 2px solid #2092e1;
  border-radius: 35px;
  background-color: #f8f8f8;
  padding: 15px 24px !important;
  color: #2092e1 !important;
}

#offer-btn:hover {
  border: 2px solid #ff8a37 !important;
  background: #ff8a37 !important;
  color: #fff !important;
}

.has-warning .form-control:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.has-warning .form-control {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.login-btn {
  cursor: pointer;
}
// <----- END: Navbar styles ----->

.axis path,
.axis line {
  fill: none;
  stroke: black;
  shape-rendering: crispEdges;
}

.axis text {
  font-family: sans-serif;
  font-size: 11px;
}

.controls button {
  display: block;
  margin: 4em auto 4em auto;
  background-color: 'aquawhite';
}

#equity {
  position: relative;
  top: -500px;
}

#salary {
  text-align: center;
}

.displayList {
  list-style: none
}

.offerTitle {
  font-size: 1.2em;
}

.offer-input .form-group {
  margin: 0px 3px;
}

.offer-form {
  text-align: center;
}

.offer-form .panel-default {
  margin-top: 10px;
}

.offer-form .panel-heading {
  background-color: #2092e1;
  color: #f8f8f8;
}

.btn.btn-success {
  border-radius: 35px;
  padding: 12px 18px !important;
}

.btn.btn-success:hover {
  // background-color: #ff8a37;
  background-color: #4caf50;
  color: #FFFFFF;
}

.toggle-btn {
  float: right;
  // border: 2px solid #2092e1;
  // border-radius: 35px;
  // background-color: #f8f8f8;
  // padding: 4px 8px !important;
  // color: #2092e1 !important;
}

.toggle-btn > button {
  border: 1px solid #2092e1;
  border-radius: 35px;
  background-color: #f8f8f8;
  padding: 4px 8px !important;
  color: #2092e1;
}

.toggle-btn > .btn:focus {
  border: 1px solid #ff8a37;
  background: #ff8a37;
  color: #fff;
}

// Badge Circles
.responsive-circle {
    font-size: 16px;
    font-weight: 700;
    margin: 0 20px 20px;
    width: 115%;
}

.responsive-circle::after {
    border-radius: 50%;
    content: "";
    display: block;
    height: 0;
    margin-bottom: 20px;
    padding-bottom: 100%;
    width: 100%;
}

.responsive-circle div {
    color: white;
    float: left;
    line-height: 1em;
    margin-top: -0.5em;
    padding-top: 40%;
    text-align: center;
    width: 100%;
}

.red-circle::after {
  background: #ff4d4d;
}

.green-circle::after {
  background: #5cd65c;
}

[class^=arr-]{
  border:       solid currentColor;
  border-width: 0 .2em .2em 0;
  display:      inline-block;
  padding:      .20em;
}

.arr-up    {transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}
.arr-down  {transform:rotate(45deg);   -webkit-transform:rotate(45deg);}

/*BUBBLE CHART CSS*/

.bubble-chart-container {
  flex: 1;
  position: relative;
  display: flex;
  user-select: none;
  justify-content: center;
}

/* Center text in the circle, and hide any overflow */
.bubble-chart-container .bubble-chart-text .bubble-label {
  text-align: center;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-around;
  border-radius: 50%;
  will-change: left, top, height, width;
}

/* Show the overflow when hovering over a label */
.bubble-chart-container .bubble-chart-text .bubble-label:hover {
  overflow: visible;
  font-weight: bold;
}

/* Optional, but recommended - reduce the size of text on medium bubbles */
.bubble-chart-container .bubble-chart-text .bubble-label.medium {
  font-size: 0.8em;
}

/* Optional, but recommended - hide the text on small bubbles */
.bubble-chart-container .bubble-chart-text .bubble-label.small {
  font-size: 0;
}
/* Make sure to unhide the text when hovering */
.bubble-chart-container .bubble-chart-text .bubble-label.small:hover {
  font-size: 0.8em;
}

.bubble-chart-d3 {
  width: 1000px;
  height: 1000px;
}
.bubble-legend {
  display: none;
}

// <--- Tooltips --->
.tooltip {
  padding: 3px;
  border: 2px solid;
  border-radius: 4px;
  background-color: #eeeeee;
  opacity: 1;
  justify-content: center;
  align-items: center;
}

// <--- END: Tooltips --->

// <--- Loader --->

.loader-container {
  width: 1080px;
  height: 900px;
  padding: 30px;
  text-align: -webkit-center;
  text-align: center;
  position: relative;
}

.loader-img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.offerCard {
  background: #fff;
  border-radius: 2px;
  height: 200px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  color: #555F61;
  font-size: 1.5em;
}

.cardTitle {
  padding: 0 0 0 .7em;
  font-weight: 600;
  color: #2092e1;
}

.offersHeading {
  padding: 10px;
  font-size: 3em;
  font-weight: bold;
  color: #2092e1;
}

{'fraction_non_alphanumeric': 0.16290055901110148, 'fraction_numerical': 0.04842138414298087, 'mean_word_length': 3.0400763358778624, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 45, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '71192', 'n_tokens_mistral': 5462, 'n_tokens_neox': 4936, 'n_words': 1140}