html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: 'Arial', sans-serif;
}

.gfds-width--1-of-1 {
  width: 100%;
}
.gfds-width--1-of-2 {
  width: 50%;
}
.gfds-width--1-of-3 {
  width: 33%;
}
.gfds-width--1-of-4 {
  width: 25%;
}
.gfds-width--1-of-5 {
  width: 20%;
}
.gfds-width--2-of-3 {
  width: 66%
}
.gfds-width--3-of-4 {
  width: 75%;
}

.gfds-width--1-of-12 {
  width: calc(100%/12);
}
.gfds-width--2-of-12 {
  width: calc(100%/12 * 2);
}
.gfds-width--3-of-12 {
  width: 25%;
}
.gfds-width--4-of-12 {
  width: calc(100%/12 * 4);
}
.gfds-width--8-of-12 {
  width: calc(100%/12 * 8);
}
.gfds-width--9-of-12 {
  width: calc(100%/12 * 9);
}
.gfds-width--10-of-12 {
  width: calc(100%/12 * 10);
}

.gfds-width--5px {
  width: 5px;
}
.gfds-width--8px {
  width: 8px;
}
.gfds-width--10px {
  width: 20px;
}

.gfds-height--8px {
  height: 8px;
}
.gfds-height--5px {
  height: 5px;
}
.gfds-height--10px {
  height: 20px;
}
.gfds-width--60px {
  width: 60px;
}
.gfds-width--120px {
  width: 100px;
}
.gfds-height--120px {
  height: 100px;
}
.gfds-height--240px {
  height: 240px;
}

.gfds-height--auto{
  height: auto;
}
.gfds-height--1-of-1 {
  height: 100%;
}

.gfds-margin--h-auto {
  margin-left: auto;
  margin-right: auto;
}
.gfds-margin--h-md {
  margin-left: 10px;
  margin-right: 10px;
}
.gfds-margin--v-none {
  margin-top: 0;
  margin-bottom: 0;
}
.gfds-margin--v-sm {
  margin-top: 5px;
  margin-bottom: 5px;
}
.gfds-margin--v-md {
  margin-top: 10px;
  margin-bottom: 10px;
}
.gfds-margin--top-sm {
  margin-top: 5px;
}
.gfds-margin--bottom-sm {
  margin-bottom: 5px;
}
.gfds-margin--bottom-md {
  margin-bottom: 10px;
}
.gfds-margin--bottom-lg {
  margin-bottom: 20px;
}
.gfds-margin--bottom-x-lg {
  margin-bottom: 30px;
}
.gfds-margin--bottom-none {
  margin-bottom: 0;
}

.gfds-margin--top-auto {
  margin-top: auto;
}
.gfds-margin--top-sm {
  margin-top: 5px;
}
.gfds-margin--top-md {
  margin-top: 10px;
}
.gdfs-margin--top-lg {
  margin-top: 20px;
}
.gdfs-margin--top--x-lg {
  margin-top: 30px;
}
.gdfs-margin--top--xx-lg {
  margin-top: 40px;
}
.gdfs-margin--top--xxx-lg {
  margin-top: 50px;
}
.gdfs-margin--top--xxxx-lg {
  margin-top: 60px;
}
.gdfs-margin--top--xxxxx-lg {
  margin-top: 70px;
}
.gfds-margin--top-none {
  margin-top: 0;
}

.gfds-margin--left-md {
  margin-left: 10px;
}
.gfds-margin--left-lg {
  margin-left: 20px;
}
.gfds-margin--left-x-lg {
  margin-left: 30px;
}

.gfds-margin--right-md {
  margin-right: 10px;
}
.gfds-margin--right-lg {
  margin-right: 20px;
}
.gfds-margin--right-x-lg {
  margin-right: 30px;
}
.gfds-margin--right-xx-lg {
  margin-right: 40px;
}
.gfds-margin--right-xxx-lg {
  margin-right: 50px;
}
.gfds-margin--right-xxxx-lg {
  margin-right: 60px;
}

.gfds-display--block {
  display: block;
}

.gfds-display--flex {
  display: flex;
}
.gfds-flex-wrap--wrap {
  flex-wrap: wrap;
}
.gfds-flex-direction--column {
  flex-direction: column;
}
.gfds-display--justify-space-between {
  justify-content: space-between;
}
.gfds-display--justify-start {
  justify-content: flex-start;
}
.gfds-display--justify-end {
  justify-content: flex-end;
}
.gfds-display--justify-center {
  justify-content: center;
}
.gfds-align--self-center {
  align-self: center;
}
.gfds-align--self-end {
  align-self: end;
}

.gfds-display--align-flex-start {
  align-items: flex-start;
}
.gfds-display--align-center {
  align-items: center;
}

.gfds-border--red {
  border-color: #fb5454;
}
.gfds-border--orange {
  border-color: #f3a232;
}
.gfds-border--gray {
  border-color: #E7E7E7;
}
.gfds-border--light-gray {
  border-color: #f1f1f1;
}
.gfds-border--gray-dark {
  border-color: #d3d3d3;
}
.gfds-border--bottom-gray {
  border-bottom-color: #E7E7E7;
}
.gfds-border--bottom-gray-not-last:not(:last-child) {
  border-bottom-color: #E7E7E7;
}
.gfds-border--size-1 {
  border-width: 1px;
  border-style: solid;
}
.gfds-border--bottom-size-1 {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
.gfds-border--bottom-size-1-not-last:not(:last-child) {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

.gfds-border--right-size-1 {
  border-right-width: 1px;
  border-right-style: solid;
}

.gfds-border--right-gray {
  border-right-color: #bababa;
}
.gfds-border--right-light-gray {
  border-right-color: #f1f1f1;
}

.gfds-border--none {
  border: none;
}
.gfds-outline--none {
  outline: none;
}

.gfds-border--rounded {
  border-radius: 10px;
}
.gfds-border--rounded-top {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.gfds-border--rounded-sm {
  border-radius: 4px;
}
.gfds-border--rounded-md {
  border-radius: 8px;
}
.gfds-border--rounded-full {
  border-radius: 50%;
}

.gfds-padding--sm {
  padding: 5px;
}
.gfds-padding-top--sm {
  padding-top: 5px;
}
.gfds-padding-bottom--sm {
  padding-bottom: 5px;
}

.gdfs-padding--xx-lg {
  padding: 40px;
}
.gfds-padding--md {
  padding: 10px;
}
.gfds-padding--lg {
  padding: 20px;
}
.gfds-padding--v-lg {
  padding-top: 20px;
  padding-bottom: 20px;
}
.gfds-padding--v-md {
  padding-top: 10px;
  padding-bottom: 10px;
}
.gfds-padding--v-sd {
  padding-top: 5px;
  padding-bottom: 5px;
}
.gfds-padding--h-md {
  padding-left: 10px;
  padding-right: 10px;
}
.gfds-padding--h-lg {
  padding-left: 20px;
  padding-right: 20px;
}
.gfds-padding-bottom-md {
  padding-bottom: 10px;
}
.gfds-padding-bottom--lg {
  padding-bottom: 20px;
}
.gfds-padding-bottom--x-lg {
  padding-bottom: 30px;
}

.gfds-padding-right-lg {
  padding-right: 20px;
}
.gfds-padding-right-x-lg {
  padding-right: 30px;
}

.gfds-padding--left-md {
  padding-left: 10px;
}
.gfds-padding--left-x-lg {
  padding-left: 30px;
}

.gfds-padding--left-none {
  padding-left: 0;
}
.gfds-padding--right-none {
  padding-right: 0;
}

.gfds-font--size-sm-xx {
  font-size: 12px;
}
.gfds-font--size-sm {
  font-size: 16px;
}
.gfds-font--size-min {
  font-size: 14px;
}
.gfds-font--size-md {
  font-size: 18px;
}
.gfds-font--size-lg {
  font-size: 22px;
}
.gfds-font--size-lg-xxx {
  font-size: 34px;
}

.gfds-color--green {
  color: #3DBE43;
}
.gfds-color--black {
  color: black;
}
.gfds-color--white {
  color: white;
}
.gfds-color--gray {
  color: #bababa;
}
.gfds-color--gray-dark {
  color: #676767;
}
.gfds-color--red {
  color: #fd2f2f;
}

.gfds-bg--color-transparent {
  background-color: transparent;
}
.gfds-bg--color-white {
  background-color: white;
}
.gfds-bg--color-blue {
  background-color: #4786CF;
}
.gfds-bg--color-blue-light {
  background-color: #c6ddff;
}
.gfds-bg--color-orange {
  background-color: #f3a232;
}
.gfds-bg--color-red {
  background-color: #fb5454;
}
.gfds-bg--color-green {
  background-color: #3DBE43;
}
.gfds-bg--color-green-light {
  background-color: #9aff9e;
}
.gfds-bg--color-gray {
  background-color: #efefef;
}
.gfds-bg--color-gray-light {
  background-color: #f4f4f4;
}
.gfds-bg--color-gray-transparent {
  background: rgba(80, 80, 80, 0.75);
}
.gfds-bg--color-semi-transparent {
  background-color: rgba(76, 76, 76, 0.8);
}

.gfds-font--weight-normal {
  font-weight: normal;
}
.gfds-font--weight-bold {
  font-weight: bold;
}

.gfds-text--align-center {
  text-align: center;
}
.gfds-text--align-right {
  text-align: right;
}

.gfds-text--line-height-1-6 {
  line-height: 1.6;
}

.gfds-cursor--pointer {
  cursor: pointer;
}

.gfds-position--relative {
  position: relative;
}
.gfds-position--absolute {
  position: absolute;
}
.gfds-position--fixed {
  position: fixed;
}
.gfds-z-index--negative-1 {
  z-index: -1;
}

.gfds-top--0 {
  top: 0;
}
.gfds-bottom--0 {
  bottom: 0;
}
.gfds-left--0 {
  left: 0;
}
.gfds-right--0 {
  right: 0;
}

.gfds-text-decoration--inherit{
  text-decoration: inherit;
}

.gfds-shadow {
  -webkit-box-shadow: 0px 0px 5px 0px rgba(242, 242, 242, 1);
  -moz-box-shadow: 0px 0px 5px 0px rgba(242, 242, 242, 1);
  box-shadow: 0px 0px 5px 0px rgba(242, 242, 242, 1);
}

.gfds-shadow--sm {
  -webkit-box-shadow: 0px 0px 2px 0px rgba(207, 207, 207, 1);
  -moz-box-shadow: 0px 0px 2px 0px rgba(207, 207, 207, 1);
  box-shadow: 0px 0px 2px 0px rgba(207, 207, 207, 1);
}

.gfds-input {
  padding: 10px;
  border: 1px solid #cccccc;
}

.gfds-input.ng-touched.ng-invalid {
  border: 1px solid red;
}

.gfds-input-button--text {
  background: none;
  border: none;
}

.gfds-background--image {
  background-image: url("assets/img/gofinance-background.webp");
}
.gfds-background--image-blurred {
  background-image: url("assets/img/gofinance-background.webp");
  filter: blur(5px);
}


.gfds-overflow--auto {
  overflow: auto;
}

@media only screen and (max-width: 720px) {

  .mobile-gfds-flex-wrap--wrap {
    flex-wrap: wrap;
  }

  .mobile-gfds-width--1-of-1 {
    width: 100%;
  }
  .mobile-gfds-width--10-of-12 {
    width: calc(100%/12*10);
  }

  .mobile-gfds-background--image {
    background-image: url("assets/img/gofinance-background.webp");
  }

  .mobile-gfds-margin--right-none {
    margin-right: 0;
  }
  .mobile-gfds-margin--left-none {
    margin-left: 0;
  }

  .mobile-gfds-margin--left-md {
    margin-left: 10px;
  }

  .mobile-gfds-margin--h-none {
    margin-left: 0;
    margin-right: 0;
  }

  .mobile-gfds-margin--top-md {
    margin-top: 10px;
  }
  .mobile-gfds-margin--top-lg {
    margin-top: 20px;
  }
  .mobile-gfds-margin--top-x-lg {
    margin-top: 30px;
  }
  .mobile-gfds-margin--top-xx-lg {
    margin-top: 40px;
  }

  .mobile-gfds-margin--bottom-md {
    margin-bottom: 10px;
  }

  .mobile-gfds-margin--right-x-lg {
    margin-right: 30px;
  }
}
