body {
	font-family: 'Roboto Condensed', sans-serif;
	overflow: hidden;
	margin:0;
	padding:0;
}

.bold {
	font-weight: 700;
}

h2 {font-size:1.5rem;}

.coachcol {color: #00bcd3; text-transform: uppercase;}
.pilotcol {color: #36444d; text-transform: uppercase;}
.scientistcol {color: #004fa3; text-transform: uppercase;}
.engineercol {color: #faa61a; text-transform: uppercase;}

.modal-body h2 { margin: 0; }

img.imageMap {
	width: 100%;
	height: 100%;
}

img.handPointer {
	width: 10%;
	position: absolute;
	top: 17%;
	left: 25%;
}

@-webkit-keyframes handIcons {
	0% { -webkit-transform: initial; transform: initial; }
	25% { -webkit-transform: translate(140%, 120%); transform: translate(140%, 120%); }
	50% { -webkit-transform: translate(0%, 240%); transform: translate(0%, 240%); }
	75% { -webkit-transform: translate(-140%, 120%); transform: translate(-140%, 120%); }
}

@keyframes handIcons {
	0% { -webkit-transform: initial; transform: initial; }
	25% { -webkit-transform: translate(140%, 120%); transform: translate(140%, 120%); }
	50% { -webkit-transform: translate(0%, 240%); transform: translate(0%, 240%); }
	75% { -webkit-transform: translate(-140%, 120%); transform: translate(-140%, 120%); }
}

.handIcons {
  -webkit-animation-name: handIcons;
          animation-name: handIcons;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

blockquote.blockquote {
	margin: 0;
}

blockquote p {
	font-size: 18px;
	line-height: 23px;
	margin-top: 0.3rem;
}

.blockquote-footer {
	font-size: 65%;
	margin-top: 0.3rem;
}

.center {
	text-align: center;
}

.iframeContent {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

div.info {
    width: 40%;
    position: absolute;
    text-align: center;
    height: 100%;
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    right: 2.5%;
    font-size: 18px;
    line-height: 25px;
}

.modal {
	overflow: visible;
	width: 95%;
	max-width: 95%;
	padding: 10px 20px;
}

.blocker {
	background-color: rgba(0,0,0,0.5);
}

.modal a.close-modal {background-image: url(../img/close.png);}

@media screen and ( max-width: 635px) {

	.modal h2 {
		font-size: 18px;
		margin-bottom: 3px;
	}

    blockquote p, .blockquote-footer {
	    font-size: 16px;
	    line-height: 21px;
	    margin-top: 0.1rem;
	}

	div.info {
	    font-size: 16px;
	    line-height: 23px;		
	}
}

@media screen and ( max-width: 410px) {

    blockquote p, .blockquote-footer {
	    font-size: 12px;
	    line-height: 15px;
	}	

	div.info {
	    font-size: 13px;
	    line-height: 16px;			
	}

	.modal {
		padding: 5px 10px;
	}

}