#footerDummy {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden
}

#footer {
  position: relative;
  bottom: 0;
  width: 100%;
  height: auto;
  background-color: var(--web-background);
  overflow: hidden;
  text-align: center;
  border-top: 1px solid var(--black)
}

.centeredContent {
  width: 1100px
}

.columnsContainer {
  margin: 50px auto;
  width: 90%;
  position: relative;
  height: auto;
  overflow: hidden;
  display: flex;
  justify-content: space-between
}

.columnLeft {
  width: 50%
}

.column {
  float: left;
  color: var(--black);
  width: calc(100% / 3)
}

.columnHeading {
  font-weight: 400;
  margin-bottom: 20px;
  color: #767676;
  text-align: left;
  font-size: 12px;
  display: block;
  margin-top: 12px
}

.columnItem {
  width: fit-content;
  color: var(--black);
  margin-top: 12px;
  text-align: left;
  font-size: 12px;
  font-weight: 400;
  transition: border-bottom 1s;
  position: relative;
}
.columnItem::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    opacity:0;
    bottom: 0;
    left: 0;
    background-color: black;
    transition:  opacity 0.5s ease;
}
.columnItem:hover::before {
    opacity: 1;
}
.centerWrapper {
  position: relative;
  display: inline-block;
  width: auto;
  height: auto;
  overflow: hidden
}

.lastRow {
  width: 100%;
  float: left;
  margin-top: 108px;
  color: #fff;
  margin-bottom: 15px;
  font-size: 13px
}

.footerColumn {
  position: relative;
  float: left;
  height: auto;
  overflow: hidden;
  margin-top: 80px;
  color: #fff;
  width: 198px;
  margin-right: 35px;
  margin-left: 35px;
  text-align: left
}

.footerLogo {
  width: 100px;
  float: left
}

.followUsColumn {
  width: 135px
}

.footerColumnLink {
  cursor: pointer
}

.footerColumnLink:hover {
  text-decoration: underline
}

.newsletterColumn {
  width: 250px;
  margin-right: 0;
  display: flex;
  float: left;
  color: #fff
}

.newsletterTitle {
  font-weight: bold;
  color: var(--black);
  text-align: left;
  font-size: 13px;
  font-family: var(--font2);
  text-transform: uppercase;
  display: block;
  margin: 12px 0
}

.newsletterSubtitle {
  font-weight: 400;
  margin-bottom: 20px;
  text-align: left;
  font-size: 13px;
  color: #767676;
  margin-top: 6px
}

.footerColumnTitle {
  position: relative;
  text-align: left;
  font-size: 15px;
  margin-bottom: 20px;
  letter-spacing: 2px;
  margin-bottom: 30px;
  text-transform: uppercase
}

.footerColumnRow {
  position: relative;
  font-size: 12px;
  margin-bottom: 10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-top: 13px;
  float: left;
  width: 100%
}

#emailFooterInput {
  position: relative;
  width: 100%;
  height: 30px;
  color: #58595b;
  line-height: 30px;
  font-size: 13px;
  float: left;
  font-weight: 100;
  border-bottom: 1px solid var(--menu-font);
}

.newsletterGo {
  position: absolute;
  cursor: pointer;
  font-size: 13px;
  text-transform: capitalize;
  text-align: center;
  color: #767676;
  line-height: 30px;
  right: 0;
  font-weight: 500;
}

.newsletterGo:hover {font-weight: 800;}

#emailFooterInput::-webkit-input-placeholder {
  color: #58595b;
  opacity: 1;
  font-weight: 100
}

#emailFooterInput:-moz-placeholder {
  color: #58595b;
  opacity: 1;
  font-weight: 100
}

#emailFooterInput::-moz-placeholder {
  color: #58595b;
  opacity: 1;
  font-weight: 100
}

#emailFooterInput:-ms-input-placeholder {
  color: #58595b;
  opacity: 1;
  font-weight: 100
}

#emailFooterInput::-ms-input-placeholder {
  color: #58595b;
  opacity: 1;
  font-weight: 100
}

#subscribeNewsletterButton {
  position: absolute;
  height: 10px;
  margin-top: 11px;
  float: right;
  cursor: pointer;
  margin-right: 0
}

#subscribeNewsletterButton:hover {
  opacity: .6
}

#footerSocialIcons {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 30px;
  text-align: center
}

.footerSocialIcon {
  position: relative;
  width: 42px;
  margin-right: 20px
}

.newsletter_go {
  width: 15px;
  background-color: transparent;
  right: 32px;
  float: left;
  position: relative;
  height: 32px;
  border-radius: 2px
}

#footerBottom {
  background-color: var(--menu-font);
}

#footerBottom .rights {
  margin-left: 4%;
  color: var(--white);
  text-align: left
}

@media screen and (max-width: 768px) {
  #footer {
      height:auto;
      overflow: hidden
  }

  .columnLeft {
      width100%;width: 100%;
      text-align: left
  }

  .rights {
      margin-right: 0
  }
  .newsletterGo {
      right: 5%;
  }
  .footerLogo {
      display: block;
      width: 80px;
      height: auto;
      margin: 0 auto;
      margin-top: 10px;
      float: none;
      margin-bottom: 15px
  }

  .centerWrapper {
      display: block;
      width: 100%
  }

  .footerColumn {
      width: 100%;
      margin-top: 40px;
      float: none;
      margin-left: 0;
      text-align: center
  }

  .column {
      float: none
  }

  .column.footerLogoColumn {
      display: block;
      margin: 0 auto;
      float: none;
      height: auto;
      overflow: hidden
  }

  .newsletterColumn {
      margin: 0 auto;
      margin-top: 0;
      display: flex;
      float: none;
      margin-bottom: 30px
  }

  .newsletterColumn {
      width: 90%!important;
      float: left;
      float: left;
      color: #fff;
      padding-top: 30px;
      margin: 0 auto;
      margin-bottom: 20px
  }

  .footerColumnTitle {
      font-size: 15px;
      text-transform: uppercase;
      margin-bottom: 15px;
      text-align: center
  }

  .footerColumnRow {
      font-size: 12px;
      margin-top: 7px;
      margin-bottom: 7px
  }

  .footerColumnTime {
      position: relative;
      float: left;
      font-size: 12px;
      margin-right: 10px
  }

  .footerSocialIcon {
      margin-bottom: 20px
  }

  .column {
      width: 90%!important;
      margin: 0 auto
  }

  .columnsContainer {
      width: 100%;
      margin-top: 10px;
      flex-direction: column-reverse;
      justify-content: center;
      align-items: center
  }

  #footer-mobile .centeredContent {
      width: 100%!important;
      margin-bottom: 30px
  }

  .columnHeading {
      font-size: 14px;
      text-align: left;
      margin-bottom: 20px;
      margin-top: 40px
  }

  .columnItem {
      font-size: 13px;
      text-align: left;
      font-weight: 300;
      line-height: 18px;
      margin-bottom: 15px;
      margin-top: 0
  }

  .lastRow {
      margin-top: 15px
  }

  #emailFooterInput {
      margin: 0 auto
  }

  .newsletter_go {
      width: 4px;
      right: 24px
  }
}
