﻿
.content{
	width:100%;
	position:relative;
	margin-top:120px;
}

.cent{
	margin:0 auto 100px 0;
	text-align:center;
}

#top1, #top2, .over{
	 width:900px; 
	 height:500px; 
	 margin-left:auto; 
	 margin-right:auto;
}

#top1, #top2{
 	 background-position:center top; 
	 background-repeat:no-repeat;
 	 margin-bottom:120px;
 	 position:relative;
}

#top1 a, #top2 a{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-999px;
}

#top1{
	 background-image:url('../pic/top/_DSC2346.jpg'); 
}

#top2{
	 background-image:url('../pic/top/_DSC8465.jpg'); 
}

.over{
	transition:1.5s; 
}

.over:hover{
	opacity:0;
	transition:0.8s;
}

#top1 > .over{
	background-image:url('../pic/top/_DSC2346-mono.jpg'); 	
}

#top2 > .over{
	background-image:url('../pic/top/_DSC8465-mono.jpg'); 	
}

.p-title{
	font-size: 300%;
	padding:30px 0 0 40px;
}

.p-font{
	font-size: 300%;
	text-align:left;
	color:black;
	margin:0px 0 40px 30px;
}

.p-com{
	font-size:120%;
	padding:20px 0 0 40px;
}

hr {
  height: 1px;
  background: white;
  width:300px;
  border: none;
  outline: none;
  margin:50px 0 0 40px;
  position: relative;
}

/* css animation (prefixes are cut) */
.appear {
	transform-origin:center;
	animation:show 1s both;
	animation-delay:1s;
}

span.appear {
	display:inline-block;
}
@keyframes show {
	0% {
		transform:translate(0,2em);
		opacity:0;
		text-shadow:0 0 0 #0f0;
	}
	50% {
		text-shadow:0 0 0.5em #0f0;
	}
	100% {
		transform:translate(0,0);
		opacity:1;
		text-shadow:none;
	}
}

