@font-face {
    font-family: Adler;
    src: url(../fonts/adler.ttf);
}

.headerDate {
    font-family: 'Adler';
}
.sliderText {
  font-size: 2rem;
}
.sliderText-slogan {
  font-size: 3rem;
}

#imgcontainer {
	/* display: inline-block; */
  background-size: 100% 100%;
	overflow: hidden;            /* clip the excess when child gets bigger than parent */
}
#imgcontainer img {
  display: block;
  transition: transform .4s;   /* smoother zoom */
}
#imgcontainer:hover img {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  transform-origin: 50% 50%;
}

.img-container {
  position: relative;
}
.img-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #b90c7f;
  color: #f7ea64;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}
.img-container:hover .img-overlay {
  height: 100%;
}
.img-text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

a.link {
  text-decoration: none;
  font-weight: bold;
  color: black;

  &:hover {
    text-decoration: underline;
  }
}

a.lineup-link {
  text-decoration: none;
  font-size: 0.8em;
  color: black;
}

.bottom-left {
  position: absolute;
  font-size: 20px;
  font-weight: bolder;
  text-transform: uppercase;
  background-color: #343a40;
  color: #f7ea64;
  bottom: 0px;
  left: 0px;
  padding: 6px;
}

.pink-background {
  background-color: #b90c7f !important;
}

.text-yellow {
  color: #f7ea64;
  font-weight: bold;

  &:hover {
    color: #f7ea64;
  }
}


/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.social-icon {
  font-size: 0.8rem;
  color: white;

  transition-property: transform;
  transition-duration: 0.3s;
  transition-timing-function: ease;
  transition-delay: 0s;
} 
.social-icon:hover {
  color: white;
  transform: translateY(-10px);
}

.news-social-icons {
  color: black;
  text-decoration: none;
}

.footer-link {
  &:hover {
    text-decoration: underline;
  }
}