/**
 * #.# Common SCSS
 *
 * Can include things like variables and mixins
 * that are used across the project.
*/
/**
 * #.# Styles
 *
 * CSS for both Frontend+Backend.
 */
.wp-block-cgb-block-eecs-cover-block {
  border: none;
  color: #000000;
  margin: 20px 0;
  padding: 0;
  background-color: transparent;
  -webkit-animation: fadein 1s;
  animation: fadein 1s; }

.image-container {
  padding-bottom: 56.25%;
  background-size: cover;
  position: relative; }

.image-container .screen-reader {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px); }

.cover-image-content {
  font-family: "IBM Plex Sans Condensed", sans-serif;
  font-size: 24px;
  font-weight: 600;
  text-align: center;
  color: #ffffff;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 40px; }

.cover-image-content p {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%; }

.color-overlay {
  background: rgba(0, 39, 76, 0.8);
  mix-blend-mode: multiply;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  display: -ms-flexbox;
  display: flex; }

@keyframes fadein {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

/* Firefox < 16 */

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

/* Internet Explorer */

/* Opera < 12.1 */

@media only screen and (max-width: 40em) {
  .cover-image-content {
    font-size: 20px;
    padding: 20px; } }

@media only screen and (max-width: 31.25em) {
  .cover-image-content {
    font-size: 18px; } }