/*You can change the hexidecimal number to change the colors on your nonlinear story.  
You can also change the font family, font sizes, font styles, or alignments*/

/*overall style*/
div {
    width: 75%;
	margin: 0 auto;

}

body {
	background: #ffffff; /*to change, look up color codes on Adobe Color, Cooler, or Photoshop*/
	font-family: 'Times New Roman', Times, serif; /*to change, look up other font families*/
}

body.altone {
	background: #f5edf9; /*to change, look up color codes on Adobe Color, Cooler, or Photoshop*/
	font-family: 'Times New Roman', Times, serif; /*to change, look up other font families*/
}

body.alttwo {
	background: #f4e3fb; /*to change, look up color codes on Adobe Color, Cooler, or Photoshop*/
	font-family: 'Times New Roman', Times, serif; /*to change, look up other font families*/
}

body.altthree {
	background: #f3defc; /*to change, look up color codes on Adobe Color, Cooler, or Photoshop*/
	font-family: 'Times New Roman', Times, serif; /*to change, look up other font families*/
}


body.alt {
	background: #eecbff; /*to change, look up color codes on Adobe Color, Cooler, or Photoshop*/
	font-family: 'Times New Roman', Times, serif; /*to change, look up other font families*/
}

/*heading style*/
h1 {
	font-family: 'Brush Script MT', Gadget, sans-serif;
	color: #000000; 
	text-align: center; 
	font-size: 48px; /*you can change all font sizes by changing the pixels*/
	font-weight: bold;
}

h1.alt {
	font-family: 'Brush Script MT', Gadget, sans-serif;
	color: #00760e; 
	text-align: center; 
	font-size: 48px; /*you can change all font sizes by changing the pixels*/
	font-weight: bold;
}
/*image style*/
img {
	height:350px; /*change height of image*/
    display: block;
    margin: auto;
    border:5px solid #000000; 
}

/*paragraph style*/
p {	
	font-size: 16px;
	text-align: center; /*may change this to left, right or center*/
	color: #000000; /*change this to the hexidecimal number for the paragraph text color you prefer*/
}
/*unvisited link style*/
a {
	color: #00760e;
    text-align: center;
	transition: all 0.5s ease;
}

a.alt {
	color: #ffffff;
    text-align: center;
	transition: all 0.5s ease;
}

a.cancer {
	color: #a90000;
    text-align: center;
	transition: all 0.5s ease;
}
/*hovered over link style*/
a:hover {
	color: #5DA6A8; 
}
/*visited link style*/
a:visited {
	color: #00760e;
	transition: all 0.5s ease;

}

a:visited.alt {
	color: #ffffff;
	transition: all 0.5s ease;

}

a:visited.cancer {
	color: #a90000;
	transition: all 0.5s ease;

}

/*list styles*/
ul {
   display: block;
    margin:auto; 
    text-align: left;
	padding-left: 35%;
  	list-style-position: inside;
}

li {
	font-size: 16px;
	font-style:italic; 
	color: #FF0078;
	}


.fade-in-text {
	font-family: Arial;
	font-size: 150px;
	animation: fadeIn 8s;
}

  @keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
  }

.footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	
	color: white;
	text-align: center;
	
}

.row {
	display: flex;
  }
  
  .column {
	flex: 33.33%;
	padding: 5px;
  }