html,
body {
/*  font-family: 'Tajawal', serif; */
  font-family: 'Ubuntu', sans-serif;
  font-size: 1rem;
  font-weight: 400;
}

html {
  background-color: #0c526b;
}

p.subtitle {
  color: #ccc;
  padding-top: .2rem; 
}

a {
  color: #fff;
}

.title {
  font-family: 'Ubuntu', sans-serif;
  font-style: italic;
  font-weight: 700;
  font-size: 4rem;
  color: #fff;
}

.footer-text a {
  color: white;
}

.title {
  animation-delay: 1s;
  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: fadein 2s; /* Firefox < 16 */
  -ms-animation: fadein 2s; /* Internet Explorer */
  -o-animation: fadein 2s; /* Opera < 12.1 */
  animation: fadein 2s;
}

.subtitle {
  animation-delay: 0s;
  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: fadein 2s; /* Firefox < 16 */
  -ms-animation: fadein 2s; /* Internet Explorer */
  -o-animation: fadein 2s; /* Opera < 12.1 */
  animation: fadein 2s;
}

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

/* Firefox < 16 */
@-moz-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

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

/* Internet Explorer */
@-ms-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}