@font-face {
  font-family: sf-bold;
  src: url("../sf-font/SFPRODISPLAYBOLD.OTF");
}
@font-face {
  font-family: sf-regular;
  src: url("../sf-font/SFPRODISPLAYREGULAR.OTF");
}
@font-face {
  font-family: sf-italics;
  src: url("../sf-font/SFPRODISPLAYLIGHTITALIC.OTF");
}
body {
  background-color: #F9F9F9;
  font-family: sf-regular;
}
.italics {
  font-family: sf-italics;
}
.pos-abs {
  position: absolute;
}
.pos-rel {
  position: relative;
}
.pos-fixed {
  position: fixed;
}
.btn {
  color: hsl(51, 100%, 50%);
}
.btn-primary {
  background-color: #0657C9;
}
.btn-yellow {
  background: #FFF7CC;
  color: #444;
}
.btn-lg {
  padding: 1em !important;
  width: 200px;
  border-radius: 20px !important;
}
.down-1x {
  margin-bottom: 1%;
}
.down-2x {
  margin-bottom: 2%;
}
.down-5x {
  margin-bottom: 5%;
}
.down-10x {
  margin-bottom: 10%;
}
.down-20x {
  margin-bottom: 20%;
}
.up-1x {
  margin-top: 1%;
}
.up-2x {
  margin-top: 2%;
}
.up-5x {
  margin-top: 5%;
}
.up-10x {
  margin-top: 10%;
}
.up-20x {
  margin-top: 20%;
}
.bold {
  font-weight: bold;
}
.bolder {
  font-weight: bolder;
}
.clickable {
  cursor: pointer;
}
.btn-white-ai {
  background-color: #ffffff;
  color: #0657C9;
}
.btn-theme,
button[type='button'] {
  background-color: #0657C9;
}
.theme-blue {
  background: #0657C9;
}
.white-bg {
  background-color: #F9F9F9;
}
.bg-pattern {
  background-image: url("../images/stretches.png");
}
p.active {
  border-bottom: solid 4px #0657C9;
}
.theme-blue-bg {
  background-color: #0657C9;
  color: #ffffff;
}
.theme-blue-text {
  color: #0657C9;
}
.box-gradient {
  background: hsl(0, 0%, 98%);
  background: linear-gradient(135deg, hsl(0, 0%, 98%) 0%, hsl(215, 94%, 41%) 0%, hsl(215, 94%, 41%) 53%, hsl(215, 94%, 41%) 53%, hsl(213, 87%, 62%) 96%);
  background: -moz-linear-gradient(135deg, hsl(0, 0%, 98%) 0%, hsl(215, 94%, 41%) 0%, hsl(215, 94%, 41%) 53%, hsl(215, 94%, 41%) 53%, hsl(213, 87%, 62%) 96%);
}
.collapse-bg {
  background-color: #E6EEFA;
  border-radius: 15px;
  margin-top: 2%;
}