.header {
position: fixed;
top: 0;
width: 100%;
height: 50px;
background-color: darkgrey;
}

.html {
  -webkit-overflow-scrolling: touch;
}

.body {
	background-color: #CCCCCC;
	background-image:url("/image/thumb2.png");
	background-position: center;
	background-size: cover;
	background-repeat: repeat-y;
}


.main {
padding-top: 50px;
overflow: scroll;
}
.shutter{

  width: 100%;

  height: 100%;

  position:fixed;

  top:0;

  left:0;

  right:0;

  bottom:0;

  margin: auto;

  background-color:#CCCCCC;

  z-index:99;

  -webkit-animation: byeShutter 2.4s forwards;

  animation: byeShutter 2.4s forwards;

}

.text1 {  
    font-size: 20px;
    font-family: "Times New Roman";
}

.logo {

  position: absolute;

  width: 1000px;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  margin: auto;

  -webkit-animation: logo 0.8s forwards;

  animation: logo 0.8s forwards;

  animation-delay: 0.2s;

}

@keyframes byeShutter {

70% {

  opacity: 1;

}

100% {

  display: none;

  opacity: 0;

  z-index: -1;

}

}

@keyframes logo {

0% {

  opacity: 1;

}

 

50% {

  transform: rotate(0deg);    

}

  100% {

  transform: scale(0.8);

  }

}

 


.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 50px;
background-color: darkgrey;
}