/* CSS Document */

#map {width:702px; height:582px; background-image:url(../images/map.png); position:absolute; top:60px;}
#province {width:83px; height:166px; background-image:url(../images/province.png); position:absolute; top:336px; left:180px; opacity:0; transition:opacity 1s;}
#province.clicked {opacity:1;}
#text_map {position:absolute; top:0px; right:0px;}

#margin_left_one {margin-left:50px;}




#pin {border-radius: 80px 80px 80px 0; width: 40px; height: 40px; border: 40px solid #003366;  position:absolute; right:0px; top:138px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg); cursor: pointer;
	}
	
#pin:hover {animation-name: pin_bounce;
	animation-duration:.4s;
	animation-iteration-count:1;
	animation-timing-function:ease-in;
	}
@keyframes pin_bounce{
	0% {top:138px}
	50% {top:152px}
	100% {top:138px}
	}