.intro {

height: 100%;
background-color: #1b2386;
/*position: relative;*/

}

h1, h2 {
	font-family: "Courier New", Courier, monospace;
	font-weight: bolder;
	margin: 0px;
}

.sky {
	background-color: #1c2487;
	
	height:200px;
}

.logo {
	position: absolute;
	background-image: url("images/t57-001logoedit.png");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	background-attachment: fixed;
	width: 100%;
	bottom: 0px;
	height: 600px;
	z-index: 1;
	}
	
body, html {
	height: 100%;
	margin: 0px;
}


#title {
	position: fixed;
	width: 100%;
	top: 200px;
	z-index: 2;
	text-align: center;
	color: white;
	/*opacity: .7;*/
}

/*#title h1{
	
	text-align: center;
	color: white;
	opacity: .7;
	
}*/

#title h2{
	opacity: .7;
}

#get {
	display:flex;
	align-items: center;
	justify-content: center;
	font-weight:bolder;
	margin-top:30px;
	
}

#get h2 {
	opacity:1;
}

#get img {
	width:120px;
}

#whatIs {


width:100%;
display:inline-block;
}

#whatIs h2 {
	padding: 2rem;
	padding-left:5rem;
	font-size: 3rem;
	letter-spacing: 11px;
	padding-bottom:1rem;
	text-shadow: -1px -1px 0 #5eba90,
				 -1px 1px 0 #5eba90,
				 1px -1px 0 #5eba90,
				 1px 1px 0 #5eba90;
	color:white;
	font-family: "Arial Black", Gadget, sans-serif;
	font-style: italic;
	
}

p { padding: 0rem 5rem 3rem 5rem;}

.double-underline {
	position: relative;
	border-top: 5px double #b8dbcb;
	height: 20px;
	margin-left:9rem;
	width: 43rem;

}

#menu {
	background-color:gray;
	justify-content: flex-start;
	display: flex;
	flex-wrap: wrap;
	transition: 1s;
	
}

.menu-row1,
.menu-row2 {
	display:flex;
	justify-content: space-between;
}

.menu-row2 {
	flex-direction: row-reverse;
	justify-content: flex-end;	
}

.menu-row2 + .link {
	
	flex: 2;
}

.menu-column {
	display: flex;
	flex-direction: column;
	align-content: center;
}

.link {
	
	text-align: center;
	padding:2rem 2rem;
	transition: 1s;
	
}

.link a {
	text-decoration: none white;
	color:white;
	transition: 1s;
}

.menuButton {
		width: 2rem;
		height: 2rem;
		background-color: white;
		border-radius: 50%;
		margin:auto;
		margin-top: 1rem;
		transition: 1s;
}

.timeline1 {
	height:0px;
	width: 30%;
	border-top: 5px solid white;
	border-right: 5px solid white;
	border-bottom: 5px solid white;
	position: absolute;
	margin-top: 0px;
	transition: 1s ease-in;
	
}

.timeline2 {
	height: 0px;
	width: 0px;
	border-top: 5px solid white;
	border-left: 5px solid white;
	border-bottom: 5px solid white;
	position: absolute;
	margin-left: 1rem;
	
	transition: 1s, height 1s ease 4s, margin-left 1s ease 3s, width 1s ease 3s ;
	
}

.container {
	position:relative;
}

@media (max-width: 828px) {
	.double-underline{
		width:14rem;
		margin-left: 6rem;
	}
	
	#whatIs h2 {
		padding: 1rem;
		padding-left: 3rem;
		font-size: 2rem;
	}
	
	p {
		padding: 0rem 1rem 2rem 3rem;
	}
}


#team {
	display:flex;
	flex-direction: row;
	justify-content: center;
	background-color:#f2f2f2;
}

.teamMate {
	background-color:#e8e8e8;
	width: 300px;
	border-style: outset;
	border-width: 3px;
	border-color: #d6d6d6;
	max-width:100%;
}

.teamMate img {
	width: 100px;
	
	/*margin-left: 100px;
	margin-right: 100px;*/
	border-radius:50px;
}

.teamMate h3 {
	text-align: center;
	font-size: 1.3em;
}

.teamMate h4, h5 {
	text-align:center;
	margin:.5em;
}

.teamMate h4 img {
	height: .8em;
	width: .8em;
	border-radius: 0px;
	margin: 0em .5em 0em 0em;
}



.teamMate p {
	padding-left: 2em;
	padding-right: 2em;
}

a {
	color:black;
	text-decoration: none;
}

#playIt {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

#playItch {
	display:flex;
	align-items: baseline;
}

#playIt a img {
	padding:24px;
	height:30px;
	padding-right:24px;
}


#playItch img{
	transform: scaleX(-1);
	padding:10px;
	height:60px;
	padding-right:18px;
}


#playItch a img {
	padding:13px;
	height:30px;
	transform: scaleX(1);
}

@media (max-width: 1024px){
	#team{
		flex-direction: column;
		align-items: center;
		justify-content: center;
		
	}
	
	.teamMate{
		width:auto;
	}
}

.centerTHIS {
	margin:auto;
	width:100px;
}

@media (max-width: 768px) {
	.teamMate h4 img {
	height: 1.8em;
	width: 1.8em;
	border-radius: 0px;
	margin: 0em .5em 0em 0em;
	}
}

@media (max-width: 385px) {
	
	
	#playItch img{
	transform: scaleX(-1);
	padding:10px;
	height:60px;
	padding-right:10px;
	padding-left: 5px;
	}

	#playIt a img {
	padding:24px;
	height:30px;
	padding-right:10px;
	padding-left:5px;
	}
}