@-webkit-keyframes fade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes fade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

.popup img {
width: 100% !important;
max-width: 240px !important;
}

html, body {
padding:0;
margin:0;
}

body {
font-family:Arial, Helvetica, sans-serif;
background:#000;
}

#map-content a {
color:#fff;
text-decoration:none;
}

#map-content h1 {
	color: #606060;
	font-size: 88px;
	font-weight: normal;
	text-align: center;
}

.teammap {
	float: left;
	height: 700px;
	width: 100%;
}

#map-content .menu {
	margin-bottom: 40px;
	text-align: center;
}

#map-content .menu a {
	color: #D7363A;
	font-size: 11px;
	font-weight: bold;
	margin: 0px 10px;
}

.preloader {
	background: url("../images/loader.gif") no-repeat scroll center center #FFFFFF;
}

.marker {
background: none repeat scroll 0 0 rgb(255, 180, 18);
border-radius: 50%;
cursor: pointer;
display: none;
height: 12px;
outline: medium none;
text-indent: -9999px;
transition: all 0.4s ease-in-out 0s;
width: 12px;
margin-top: -5px;
margin-left: -5px;
}

.marker.hover .markerInner {
	background: none repeat scroll 0 0 rgba(255, 180, 18, 0.5);
	margin: -12px;
	height: 36px;
	width: 36px;
	border-radius: 50%;
    -webkit-animation-name: fade-in;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction:alternate;
    -webkit-animation-iteration-count: infinite;
    animation-name: fade-in;
    animation-duration: 1s;
    animation-timing-function: ease-in;
    animation-direction:alternate;
    animation-iteration-count: infinite;
    opacity: 1;
}

.marker.hover.active  .markerInner {
	background: transparent;
}

.marker.active  .markerInner, .marker.hover.active  .markerInner {
	background: none repeat scroll 0 0 rgba(255, 180, 18, 0.5);
	margin: -30px;
	height: 72px;
	width: 72px;
	border-radius: 50%;
    -webkit-animation-name: fade-in;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction:alternate;
    -webkit-animation-iteration-count: infinite;
    animation-name: fade-in;
    animation-duration: 1s;
    animation-timing-function: ease-in;
    animation-direction:alternate;
    animation-iteration-count: infinite;
    opacity: 1;
}

.popup {
background: none repeat scroll 0% 0% #FFFFFF;
color: #FFFFFF;
padding: 0px;
position: absolute;
width: 570px;
height: 308px;
cursor: default;
}

.popup h3 {
	font-family: 'Cabin Condensed',sans-serif;
	font-size: 20px;
	font-weight: normal;
	margin: 0px 0px 10px;
}

.popup .close {
	background: url("../img/close_btn.png") no-repeat scroll 0% 0% transparent;
	cursor: pointer;
	display: block;
	height: 20px;
	outline: medium none;
	position: absolute;
	right: 4px;
	text-indent: -9999px;
	top: 4px;
	width: 20px;
}

.relative {
	position: relative;
}

#controls-wrap {
	float: left;
	 height: 118px; 
	margin: -118px 0px 0px;
	overflow: hidden;
	position: relative;
	width: 100%;
}

#controls-wrap a {
display: block;
float: left;
font-size: 11px;
font-weight: bold;
line-height: 28px;
margin-bottom: 0px;
outline: medium none;
padding: 9px 5px;
text-decoration: none;
margin-left: 2px;
}

#controls-wrap .active {
	background: none repeat scroll 0% 0% #D7363A;
	color: #FFFFFF;
}

#controls-wrap a img {
	width: 100px;
	margin: 0px;
}

.controls {
height: 118px;
overflow: hidden;
position: relative;
width: 100%;
background-color: rgba(0,0,0,0.6);
z-index: 20;
}

#map-prev {
	background: url("../images/prevnext.JPG") no-repeat scroll right top rgba(0, 0, 0, 0.4);
	cursor: pointer;
	height: 100px;
	position: absolute;
	width: 25%;
	z-index: 30;
	top: 9px;
	padding-bottom: 9px;
}

#map-next {
	background: url("../images/prevnext.JPG") no-repeat scroll left -100px rgba(0, 0, 0, 0.4);
	cursor: pointer;
	height: 109px;
	right: 0;
	position: absolute;
	width: 25%;
	z-index: 30;
	top: 9px;
}

.greybox {
	background: none repeat scroll 0px 0px rgba(0, 0, 0, 0.5);
	height: 100px;
	position: absolute;
	width: 100px;
	z-index: 100;
}

.greybox:hover {
	background: none repeat scroll 0% 0% transparent;
}

#map-content {
display: inline;
float: left;
width: 100%;
margin-top: -29px;
}