@import url('https://fonts.googleapis.com/css?family=Luckiest+Guy&display=swap');
@font-face{
  font-family:HuiFontP109;
  src:url(/fonts/HuiFontP109.eot);
  src:
  url(/fonts/HuiFontP109.eot?#iefix) format('embedded-opentype'),
  url(/fonts/HuiFontP109.woff) format('woff'),
  url(/fonts/HuiFontP109.ttf) format('truetype'),
  url(/fonts/HuiFontP109.svg#HuiFontP109) format('svg');
}

body{
  background-image: url("/img/background2.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: #464646;
  background-size: cover;
  transition: all .5s ease;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  height: 1000px;
  display: flex;
  margin: 0px;
}



  body {
    background-image: url("https://images2.alphacoders.com/782/782992.png");
  }


body:hover{
  background-image: url("https://images3.alphacoders.com/704/704387.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: #464646;
  background-size: cover;
  transition: all .5s ease;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  height: 1000px;
}

header{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  background-color: whitesmoke;
  border-radius: 10px;
  width: 15em;
  height: 100%;
}

header .logo-img{
  background-image: url("http://logo.dmsk.com/wp-content/uploads/2016/02/konosuba.png");
  background-size:100% 100%;
  background-repeat:no-repeat;
  height: 100px;
  margin-bottom: 100px;
}



header ul{
  list-style: none;
  padding-left: 30px;
}

header ul li{
  padding:10px 0px;
}

header ul li a{
  text-decoration: none;
}

.main{
  width: 100%;
}


 .main h1 {
  font-family: 'Luckiest Guy', cursive;
  font-size: 5em;
  font-style: bold;
  text-align:center;
  padding-top:150px;
  padding:auto;
} 

.yun{
  background: rgba(255,255,255,0.8);
  width: 530px;
  height: auto;
  margin:auto auto;
  border-radius: 10px;
  padding: 30px;
  text-align: center;
}

.yun p{
  text-align: left;
  font-family: HuiFontP109;
  font-size: 20px;
}

#yun_name{
  text-align: right;
}

.yun ul {
  list-style: none;
}

.yun li a{
  color: #fe0066;
  font-weight: bold;
  font-size: 20px;
}

.yun li:first-child a{
  color: #fe8d07;
}

.yun li:last-child a{
  color: #fe8d07;
}

.yun li a{
  text-decoration: none;
}

.yun .link-f{
  text-align: center;
}