#interContainer{
position: absolute;
width: 100vw; /*Width of interstitial box*/
height:100vh;
left: 0;
top: 0;
/*padding: 15px;*/
margin-top: 0;
background-color: #FFF;
visibility: hidden;
z-index: 6;
filter:alpha(opacity=8); 
-moz-opacity: 0.8;
opacity: 0.8;
	background-image:url(newyear.png);
	background-size:100vw;
	background-repeat:no-repeat;
	background-position:center;
animation-name: fadeInAnime;/*1で解説*/
animation-fill-mode:backwards;/*2で解説*/
animation-duration:3s;/*3で解説*/
animation-iteration-count:1;/*4で解説*/
animation-timing-function:ease;/*5で解説*/
animation-delay: 0.5s;/*6で解説*/
animation-direction:normal;/*7で解説*/
}
@media only screen and (max-width: 780px) {
#interContainer{
	background-image:url(newyears.png);
}
}

#interContainer .headerbar{ /*CSS for header bar of interstitial box*/
color: gray;
padding: 5px 0;
text-align: right;
}

#interContainer .headerbar a{ /*CSS for header bar links of interstitial box*/
font-size: 120%;
text-decoration: none;
}


#interContent{ /*CSS for div that holds the content to show*/
}

#interVeil{ /*CSS for background veil that covers entire page while interstitial box is visible*/
position: absolute;
background: black url(whitedot.png);
right: 0;
width: 10px;
top: 0;
z-index: 5;
visibility: hidden;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=90);
opacity: 0.8;
}


/*1で解説*/
@keyframes fadeInAnime{
  0% {
    opacity: 0;
  }

  100% {
    opacity: 0.8;
  }
}