﻿@media (min-width: 768px) {
  .footer {
    min-width: 700px;
  }
}

@media (min-width: 1600px) {
  .footer {
    margin: 0px auto;
    max-width: 1536px;
  }
}

@media (max-width: 1600px) {
  .footer {
    margin: 0px 50px;
  }

    .footer > .row {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
    }
}

@media (max-width: 700px) {
  .footer-cta {
    margin-right: 10px;
  }

  .footer-product {
    margin-right: 20px;
  }
}

.footer {
  height: auto !important;
  background-color: #2F3538 !important;
  padding: 0px !important;
  font-family: 'Noto-Sans', sans-serif
}

.button {
  display: inline-block;
  padding: 0.75em 1.25em;
  font-weight: bold;
  font-size: 16px;
  white-space: nowrap;
}

.button-yellow {
  background: #fccf0a;
  color: #2f3538 !important;
}

.footer > .row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.footer-text {
  color: #D7D8D9;
}

.footer-menu {
  display: grid;
  columns: 1;
  margin-bottom: 15px;
  white-space: nowrap;
  min-width: 220px;
}

  .footer-menu > a {
    margin-bottom: 8px;
    color: #9AA6AD;
    height: 22px;
  }

    .footer-menu > a:hover {
      font-weight: bold;
      text-decoration-line: underline;
      color: #D7D8D9;
    }

.footer-header {
  color: #F3F4F4;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 11px;
  font-size: 16px;
}



.footer-text {
  width: 248px;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  color: #F3F4F4;
}

.footer-logo {
  width: 248px;
  margin-bottom: 32px;
}

.footer-menu {
  display: grid;
  columns: 1;
  margin-bottom: 15px;
  white-space: nowrap;
  font-size: 16px;
  line-height: 22px;
}

  .footer-menu > a {
    margin-bottom: 8px;
    color: #9AA6AD
  }

    .footer-menu > a:hover {
      font-weight: bold;
      text-decoration-line: underline;
      color: #D7D8D9;
    }

.footer-button__yellow {
  background-color: #FCCF0A;
  font-weight: bold;
  padding: 13px 30px;
  display: inline-block;
  font-size: 16px !important;
  border: none;
}

  .footer-button__yellow > a {
    color: #2F3538;
  }

    .footer-button__yellow > a:hover {
      color: #0077BA !important;
    }

.footer-container {
  background-color: #2F3538 !important;
  padding: 60px 0 45px;
  border-top: 3px solid #353a3e;
  color: #83939C;
  -moz-box-shadow: inset 0 0 5px 5px #353a3e;
  -webkit-box-shadow: inset 0 0 5px 5px#353a3e;
  box-shadow: inset 0 0 5px 5px #353a3e;
}

  .footer-container .form-control {
    background-color: #363636;
    border-color: #222222;
  }

  .footer-container > h3 {
    font-weight: bold;
    padding: 10px 0;
    font-size: 18px;
    text-transform: uppercase;
  }

.footer-cta {
  flex: 1 0 25%;
}

.footer-product {
  flex: 1 0 calc((75% / 4));
}

.footer-pricing {
  flex: 1 0 calc((75% / 4));
}

.footer-resources {
  flex: 1 0 calc((75% / 4));
}

.footer-support {
  flex: 1 0 calc((75% / 4));
}

@media(max-width: 1400px) {
}

@media(min-width: 1100px) {
  .bottom_bar {
    padding: 10px 192px;
  }
}

@media(max-width: 1100px) {

  .footer {
    margin: 0px 50px;
  }

  .bottom_bar {
    padding: 10px 50px;
  }
}

@media(max-width: 768px) {

  .footer {
    margin: 0px 25px;
  }

  .footer-pricing {
    width: 200px;
  }

  .bottom_bar {
    padding: 10px 25px;
  }
}


.bottom_bar {
  display: flex;
  flex-wrap: nowrap;
  background-color: #60717B;
}


.bottom_bar-button_bar {
  flex: 1;
}

.bottom_bar-button_bar {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: right;
}

.bottom_bar-legal {
  flex: 1;
  text-align: left;
}

  .bottom_bar-legal > p {
    color: #FFFFFF;
    margin: 0px !important
  }

.bottom_bar-button_bar > div > a {
  color: #FFFFFF;
}

  .bottom_bar-button_bar > div > a:hover {
    color: #36C2F1;
  }

.bottom_bar-ruler {
  height: 20px;
  margin-left: 10px;
  width: 2px;
  margin-right: 10px;
  background: #B9BFC3;
}

.social {
  float: left;
}

.footer-cta > div > p {
  margin: 0 0 20px;
}
