*{
  background-color:  #b3ecff;
  font-size: 30px;

  color: #3B5DBA; 
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

body {
  animation: fadeInAnimation ease 3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
  @keyframes fadeInAnimation {
  0% {
      opacity: 0;
  }

  100% {
      opacity: 1;
  }
}


/*Welcome title*/
h3{
  font-weight: 600;
  font-family: "Kanit", sans-serif;
}
.welcome:hover{
  color: #63b4e0;
  transition: .3s;
}


/*Adele's Eclectic Elysium*/
h1{
  font-weight: 700;
  font-family: "Archivo Black", sans-serif;
}

.A, .d, .e, .l, .e2, .apostrophe, .s, .e3, .c, .l2, .e4, .c2, .t, .i, .c3, .e5, .l3, .y, .s2, .i2, .u, .m, .exclamation {
  font-size: 70px;
  transition: 0s .3s;
}
.A:hover{
  color: #ff0000;
  transition: 0s;
}
.d:hover{
  color: #ff6200;
  transition: 0s;
}
.e:hover{
  color: #ff8c00;
  transition: 0s;
}
.l:hover{
  color: #ffbf00;
  transition: 0s;
}
.e2:hover{
  color: #f2ff00;
  transition: 0s;
}
.apostrophe:hover{
  color: #b7ff00;
  transition: 0s;
}
.s:hover{
  color: #73ff00;
  transition: 0s;
}
.e3:hover{
  color: #00ff33;
  transition: 0s;
}
.c:hover{
  color: #00ff8c;
  transition: 0s;
}
.l2:hover{
  color: #00ffe1;
  transition: 0s;
}
.e4:hover{
  color: #00d5ff;
  transition: 0s;
}
.c2:hover{
  color: #0091ff;
  transition: 0s;
}
.t:hover{
  color: #0059ff;
  transition: 0s;
}
.i:hover{
  color: #0800ff;
  transition: 0s;
}
.c3:hover{
  color: #4c00ff;
  transition: 0s;
}
.e5:hover{
  color: #8400ff;
  transition: 0s;
}
.l3:hover{
  color: #b700ff;
  transition: 0s;
}
.y:hover{
  color: #ee00ff;
  transition: 0s;
}
.s2:hover{
  color: #ff00bf;
  transition: 0s;
}
.i2:hover{
  color: #ff0095;
  transition: 0s;
}
.u:hover{
  color: #ff0059;
  transition: 0s;
}
.m:hover{
  color: #ff0000;
  transition: 0s;
}
.exclamation:hover{
  color: #ffffff;
  transition: 0s;
}


/*Bubble button links to other pages*/
a.button{
  display: inline-block;
  text-decoration: none; /* not underligned */
  text-align: center; /* center the text horizontally */
  line-height: 60px; /* center the text vertically */
  background: #63b4e0; /* background of the button */
  color: white;
  border: none; /* button contouring */
  border-radius: 30px; /* round borders */
  width: 320px;
  height: 60px;
  padding: 20px 20px; /* make space around the button */
  font-weight: 400;
  font-family: "Kanit", sans-serif;
}

a.button:hover{
  color: white;
  background-color: #3281a8;
  transition: .1s;
  font-weight: 390;
}

.interrail, .armadillo{
  text-align: center;
  margin: auto;
  padding: 60px;
  color: #244d78;
}