/*=============================*/
/*==========Buttons============*/
/*=============================*/

.btn:link,
.btn:visited {
  text-decoration: none;
  display: inline-block;
  font-size: 2rem;
  font-size: 2.4rem;
  font-weight: 400;
  /* padding: 2rem 4.5rem; */
  padding: 2.6rem 4.5rem;
  color: var(--color-black);

  border-radius: 1rem;
  cursor: pointer;
  transition: all 0.3s;
}

.btn:hover,
.btn:active {
  font-weight: 500;
  transform: translateY(-2px);
  box-shadow: 0 1rem 2rem 0 rgba(var(--color-black), 0.2) !important;
}

.btn__white {
  background-color: var(--color-white);
  margin-top: 4.2rem;
}

.btn__white:hover {
  background-color: var(--accent-color);
  color: var(--color-white);
}

/* btn yellow */

.btn__yellow {
  background-color: yellow;
  margin-left: 2.5rem;
}

.btn__yellow:hover {
  background-color: var(--color-black);
  color: yellow;
}

@media only screen and (max-width: 37.5em) {
  .btn:link,
  .btn:visited {
    font-size: 1.4rem;
    padding: 1.2rem 2rem;
  }

  .btn__white {
    background-color: var(--color-white);
    color: var(--color-black);
    margin-top: 2.4rem;
  }
}
/* Tab port */
@media only screen and (max-width: 56.25em) {
  .btn:link,
  .btn:visited {
    font-size: 1.8rem;
    padding: 2.2rem 4rem;
  }
}

/*  links */

.nav-link:link,
.nav-link:visited {
  font-size: 1.6rem;
  font-weight: 400;
  text-decoration: none;
  color: var(--color-grey-dark-2);
  transition: all 0.3s;
}

.nav-link:hover,
.nav-link:active {
  font-weight: 600;
  border-bottom: 0.2rem solid var(--color-primary);
  padding-bottom: 0.9rem;
  color: var(--color-grey-dark-1);
}

@media only screen and (max-width: 37.5em) {
  .nav-link:link,
  .nav-link:visited {
    font-size: 1.8rem;
  }

  .nav-link:hover,
  .nav-link:active {
    font-weight: 600;
    border-bottom: 0.2rem solid var(--color-primary);
    padding-bottom: 0.9rem;
    color: var(--color-grey-dark-1);
  }
}

/* header nav link */

.header__nav-link:link,
.header__nav-link:visited {
  color: var(--color-white);
  border-bottom: 0.2rem solid transparent;
}

.header__nav-link:hover,
.header__nav-link:active {
  border-bottom: 0.2rem solid var(--accent-color);
  color: var(--color-white);
}

/* @media only screen and (max-width: 375px) { */
@media only screen and (max-width: 450px) {
  .header__nav-link:link,
  .header__nav-link:visited {
    font-size: 1.2rem;
  }
}

/* footer nav link */

.footer__nav-link:link,
.footer__nav-link:visited {
  color: var(--color-grey-dark-2);
}

.footer__nav-link:hover,
.footer__nav-link:active {
  border-bottom: 0.2rem solid var(--color-grey-dark-1);
  color: var(--accent-color);
}

/* footer link for tc */
.footer__tc-link {
  font-size: 1.2rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--color-black);
}