/* ---------------------------------------- 
Taylor
---------------------------------------- */

/* NOTES:

1. DO NOT use width or height properties for any parent-level divs (these are divs you will be adding classes to).
2. Use % over px for sizing interior divs
3. Remember: if you do not give dimention and style to interior divs, we will not see them. By default, divs are invisible.

*/

/* so we can tell that our file is loading */
body {
	background: url(../images/map_1.jpg);
	background-attachment: fixed;
	background-size: cover;
}

div {border: dotted transparent 1px; }

.th {
	background-color: transparent;


}

.path {
	background-color: transparent;

}

.path:hover {
	background: url(../images/vor.jpg);
	background-position: center;
	background-size: contain;
	transform: rotate(0deg);
}

.path div {
	background: url(../images/planewbackground.jpg);
	border-radius: 50%;
	width: 50%;
	height: 50%;
	transform: rotate(360deg);
	margin-top: 25%;
	margin-bottom: 25%;
	background-position: center;
	background-size: contain;
	transform: scale(50%);
}
.path div:hover {
	transform: rotate(340deg);
}

.boat div {
	background: url(../images/landing.jpg);
	border-radius: 100%;
	width: 75%;
	height: 75%;
	margin-top: 25%;
	margin-bottom: 25%;
	margin-left: 25%;
	background-position: center;
	background-size: contain;
	transform: scale(30%);
	transform: rotate(45deg);
}

.boat:hover {
	background: url(../images/runway.jpg);
	background-size: contain;
	background-position: center;
}

.boat div:hover {
	transform: rotate(0deg);
}
.mark:hover {
	background: url(../images/runway.jpg);
	background-size: contain;
	background-position: center;
}
.mark div {
	background: url(../images/takeoff.jpg);
	border-radius: 50%;
	width: 50%;
	height: 50%;
	transform: rotate(0deg);
	margin-top: 25%;
	margin-bottom: 25%;
	background-position: center;
	background-size: contain;
	
}
.mark div:hover {
	background: url(../images/takeoff.jpg);
	background-size: contain;
	transform: rotate(340deg);
}