/* Corporate Identity Colors */
/* Input fields */
/* Errors */
/* Button colors */
.columnsComponents {
  display: block;
  position: relative; }
  .columnsComponents .container {
    width: auto;
    float: none;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px; }
    .columnsComponents .container .wrapper {
      width: 100%;
      padding: 0px;
      padding-top: 30px;
      padding-bottom: 50px; }
      .columnsComponents .container .wrapper .content {
        width: 100%; }
        .columnsComponents .container .wrapper .content .column {
          width: 100%; }
          .columnsComponents .container .wrapper .content .column h3 + div {
            margin-top: 20px; }
          .columnsComponents .container .wrapper .content .column div + div {
            margin-top: 20px; }

#twoColumnsComponent {
  width: 100%;
  display: block; }
  #twoColumnsComponent > .wrapper {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    float: left;
    box-sizing: border-box; }
    #twoColumnsComponent > .wrapper > div {
      width: 100%;
      float: right;
      box-sizing: border-box; }
      #twoColumnsComponent > .wrapper > div > img {
        width: 100%;
        display: block; }
      #twoColumnsComponent > .wrapper > div > ul {
        padding: 0px; }
        #twoColumnsComponent > .wrapper > div > ul > li > a {
          text-decoration: underline;
          letter-spacing: normal;
          font-size: 18px;
          font-weight: normal; }
        #twoColumnsComponent > .wrapper > div > ul > li > a:hover {
          text-decoration: none; }
      #twoColumnsComponent > .wrapper > div h2 {
        font-size: 48px; }
      #twoColumnsComponent > .wrapper > div > h3 {
        font-size: 18px;
        margin-bottom: 5px; }
      #twoColumnsComponent > .wrapper > div > h3 + p {
        margin-top: 5px; }
      #twoColumnsComponent > .wrapper > div > h4 {
        font-size: 18px;
        font-family: 'Crimson Text', cursive;
        font-weight: bold; }

@media (min-width: 768px) {
  .columnsComponents .container {
    padding-left: 30px;
    padding-right: 30px; }
    .columnsComponents .container .wrapper {
      padding-left: 100px;
      padding-right: 100px; } }

@media (min-width: 1024px) {
  #twoColumnsComponent > .wrapper {
    padding-bottom: 100px;
    display: flex;
    flex-direction: row-reverse; }
    #twoColumnsComponent > .wrapper > div {
      width: 50%; }
    #twoColumnsComponent > .wrapper > div.leftColumn {
      padding-right: 50px; }
    #twoColumnsComponent > .wrapper > div.rightColumn {
      padding-left: 50px;
      display: flex;
      justify-content: center;
      align-items: center; }
  .appHeadingComponent {
    box-sizing: border-box;
    padding-left: 130px;
    padding-right: 130px; }
    .appHeadingComponent h2 {
      font-size: 48px;
      margin-bottom: 20px;
      margin-top: 40px; }
  .appSupplementComponent .container .wrapper {
    background-color: #EEEEEE; } }

@media (min-width: 1280px) {
  .columnsComponents .container .wrapper.half .content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; }
    .columnsComponents .container .wrapper.half .content .column {
      width: 47%; } }

@media (min-width: 1440px) {
  #twoColumnsComponent > .wrapper {
    padding: 30px 100px;
    padding-bottom: 100px; } }

@media (min-width: 1680px) {
  #twoColumnsComponent > .wrapper {
    padding: 30px 280px;
    padding-bottom: 100px; } }

@media (min-width: 1920px) {
  .columnsComponents .container {
    margin: 0px 0px;
    box-sizing: border-box; }
    .columnsComponents .container .wrapper {
      margin: 0px 120px;
      box-sizing: border-box;
      width: auto;
      padding-top: 70px;
      padding-bottom: 100px; }
    .columnsComponents .container .wrapper.full .content {
      padding: 0px 150px;
      box-sizing: border-box;
      width: auto; }
      .columnsComponents .container .wrapper.full .content .column {
        padding: 0px;
        width: 100%; }
    .columnsComponents .container .wrapper.half .content {
      padding: 0px 0px;
      box-sizing: border-box;
      width: auto;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .columnsComponents .container .wrapper.half .content .column {
        padding: 0px;
        width: 47%; }
    .columnsComponents .container .wrapper.thirds .content {
      padding: 0px 160px;
      box-sizing: border-box;
      width: auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      .columnsComponents .container .wrapper.thirds .content .column {
        padding: 0px;
        width: 32%; } }