/* This is my custom css file */
body {
	background-color: wheat;
	font-family: Arial, Helvetica, sans-serif;
	color: black;
}

h1 {
	font-style: italic;
	font-size: 45px;
}

h2 {
	font-size: 30px;
}

a {
	font-weight: bolder;
	color: #2200CC;
}

a:hover {
	text-decoration: none;
	color:grey;
}

.nav-wrapper {
	font-family: Arial, Helvetica, sans-serif;
	background-color: black;
	padding-top: 0px;
}

/* Using the span in html to change color of 
different parts of word 'exscruzme'*/
.nav-wrapper #ex {
	color:white;
	float: left;
}

.nav-wrapper #scruz {
	color:wheat;
	float: left;
}

.nav-wrapper #me {
	color:white;
	float: left;
}

/* Customizing hover color of 
each link in navbar */
.nav-wrapper ul #link1 a:hover {
	color:blanchedalmond;
}

.nav-wrapper ul #link2 a:hover {
	color:turquoise;
}

.nav-wrapper ul #link3 a:hover {
	color:magenta;
}

.nav-wrapper ul #link4 a:hover {
	color:yellow;
}

.content {
	font-size: 20px;
	text-align: right;
}

.content p {
	text-align: right-justify;
}

.content ul li {
	list-style-type: disc;
	list-style-position: inside;
}

/* Adjusting Bootstrap's original grid
system to change size of my columns */
.col-xs-12 {
	margin-left: 60px;
	padding-left: 25px;
	width: 700px;
}

/* Specific formatting for intro section */
#intro ul li{
	list-style-type: none;
}

/* Following blocks are specific formatting
for each image */
#Steph img{
	padding-top: 20px;
	width: 400px;
	float:left;
}

#MichIMG img {
	width: 400px;
	float:right;
	text-align: text-bottom;
}

#UFIMG img {
	width: 400px;
	float:right;
	text-align: text-bottom;
}

#tennisIMG img {
	width: 278px;
	float:left;
}

#tennisIMG2 img {
	width: 352px;
}

#climbIMG img {
	width:386px;
	float:left;
}

#climbIMG2 img {
	width:264px;
}

#exscruzmeIMG img{
	padding-top: 20px;
	width:700px;
}

/* Centering footer */
#footer footer{
	padding-top:100px;
	text-align: center;
}