footer {
  width: 100%;
  height: 80px;
  margin: 0px;
  overflow: hidden;
  text-align: center;
  background-color: #edf8ee;
}

footer.hearst {
  height: 80px;
  overflow: auto;
}

footer.mobile {
  height: 70px;
}

footer a,
footer a:link {
  text-decoration: none;
}

.copyright {
  font-family: Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-size: 9px;
  line-height: 28px;
  color: gray; /*color can exchange*/
}

footer.hearst .copyright {
  margin-top: -22px;
}

footer .logo {
  line-height: 70px;
  margin-right: 5px;
  vertical-align: middle;
}

footer.mobile .logo.icon-bazaar-logo,
footer.hearst .logo.icon-bazaar-logo {
  margin-right: 3px;
}

/*-- footer logo-color can exchange --*/
footer .logo.icon-elle-logo,
footer .logo.icon-wh-logo {
  font-size: 26px;
}

footer .logo.icon-elle-logo {
  color: #db0029;
}

footer .logo.icon-cosmo-logo,
footer .logo.icon-cosmocom-logo {
  color: #f8199d;
  font-size: 26px;
}

footer .logo.icon-bazaar-logo {
  color: white;
  font-size: 36px;
}
@media screen and (max-width: 768px) {
  footer,
  footer.hearst,
  footer.mobile {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 150px;
    min-height: 150px;
    overflow: visible;
  }

  footer .logo.icon-elle-logo,
  footer .logo.icon-cosmo-logo,
  footer .logo.icon-cosmocom-logo,
  footer .logo.icon-wh-logo {
    font-size: calc(3.75 * var(--remBasicSize));
  }

  footer .logo.icon-bazaar-logo {
    font-size: calc(5 * var(--remBasicSize));
  }

  footer .logo {
    margin-right: calc(0.3125 * var(--remBasicSize));
    line-height: calc(4.375 * var(--remBasicSize));
  }

  footer a,
  footer a:link {
    position: relative;
    top: -40px;
  }

  .copyright {
    display: none;
  }
}