html {
  box-sizing: border-box;
  font-size: 100%;
}

*,
:after,
:before {
  box-sizing: inherit;
}

body {
  /* background-image: url(back.png); */
  background-color: #898c8c;  
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  text-align: center;
  font-family: "Nunito+Sans", sans-serif;
  max-width: 100%;
  min-height: 100vh;
  height: auto;
  letter-spacing: 0.1em;
}

.logo {
    width : 20%;
    height: auto; /*to preserve the aspect ratio of the image*/
};
}

h2 {
  color: #024873;
}

.links_item {
  display: block;
  max-width: 550px;
  margin: 0 auto 15px;
  margin-bottom: 5px;
  padding: 15px 20px;
  font-size: 0.95rem;
  line-height: 1.5;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
  color: black;
}

.links_item .links1:hover {
  background-color: #898c8c;
}

.links_item .links2:hover {
  background-color: #898c8c;
}

.links_item .links3:hover {
  background-color: #898c8c;
}

.links_item .links4:hover {
  background-color: #898c8c;
}

.links_item .links5:hover {
  background-color: #898c8c;
}

.links_item .links6:hover {
  background-color: #898c8c;
}

.links_item .links7:hover {
  background-color: #898c8c;
}

.links_item .links8:hover {
  background-color: #898c8c;
}
  

.links_item .links1 {
  border-bottom: 3px solid #ffa093;
  box-shadow: inset 0 -1px 0 #ffa093;
  border-radius: 25px;
  border: 2px solid #ffa093;
  background-color: #ffa093;
}

.links_item .links2 {
  border-bottom: 3px solid #80d6ff;
  box-shadow: inset 0 -1px 0 #80d6ff;
  border-radius: 25px;
  border: 2px solid #80d6ff;
  background-color: #80d6ff;
}

.links_item .links3 {
  border-bottom: 3px solid #bedde8;
  box-shadow: inset 0 -1px 0 #bedde8;
  border-radius: 25px;
  border: 2px solid #bedde8;
  background-color: #bedde8;
}

.links_item .links4 {
  box-shadow: inset 0 -1px 0 #73e2a7;
  border-radius: 25px;
  border: 2px solid #73e2a7;
  background-color: #73e2a7;
}

.links_item .links5 {
  border-bottom: 3px solid #ffc15e;
  box-shadow: inset 0 -1px 0 #ffc15e;
  border-radius: 25px;
  border: 2px solid #ffc15e;
  background-color: #ffc15e;
}

.links_item .links6 {
  border-bottom: 3px solid #fafc0d7;
  box-shadow: inset 0 -1px 0 #fef0d7;
  border-radius: 25px;
  border: 2px solid #faf0d7;
  background-color: #fef0d7;
}

.links_item .links7 {
  border-bottom: 3px solid #92a0cf;
  box-shadow: inset 0 -1px 0 #92a0cf;
  border-radius: 25px;
  border: 2px solid #92a0cf;
  background-color: #92a0cf;
}

.links_item .links8 {
  border-bottom: 3px solid #fec8d8;
  box-shadow: inset 0 -1px 0 #fec8d8;
  border-radius: 25px;
  border: 2px solid #fec8d8;
  background-color: #fec8d8;
}

.channels {
  display: flex;
  max-width: 400px;
  margin: 0 auto;
}

.channels .channels1 {
  flex: 1;
  margin-right: 5px;
  transition: transform 0.2s;
}

.channels1:hover {
  transform: scale(1.5);
}