CamilleA3/index.html

## index.html
<!DOCTYPE html>
<html>
  <header>
   <div class="header" style="text-align: center">
     <h1 id="title">Annie Easley </h1>
     <h3>"The Human Computer"</h3> </div>

    <div class="pictures">
      <img src="https://aaregistry.org/wp-content/uploads/2021/02/annie-easley.jpg" height="170"  width="160" id="blueoutfit2"/>

   <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzLnKsTF5ykb29BioXE68FyLu157JJc56DUmzCnXP_D-c5s_Av7ETETGAlIF4NBZsb9BY&usqp=CAU" height="170" width="160" id= "pinkoutfit"/>
    </div>
  </header>

  <body id="main">
   <br>
<figure>
 <div style="text-align: center"> <iframe width="400" height="250" class="youtubevid"src="https://www.youtube.com/embed/0NMBmCMK45M" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
  <figure id="img-div" style="text-align: center" class="imagetwo">
    <img src="https://miro.medium.com/max/1200/1*93t7Xk8cR2Sq6Qn1gMa8Og.png" width="400" height="350" id="image" />

  <figcaption id="img-caption" > <b>A Brief History About Annie</b></figcaption>
    </figure>
  <hr>
<div id="listandtitle">  <p id="listtitle"><b>Here's a Few Fun Facts About Annie!</b></p>
  <ul>
    <li>She was most known for being a human-computer and performed complex calculations.</li>
    <li>She co-authored numerous papers about nuclear engines in rockets.</li>
    <li>When she started her career at NASA in 1955, it was called National Advisory Committee for Aeronautics, or NACA.</li>
    <li>She was a founding member and one-term president of the NASA Lewis Ski Club, even though she didn’t start skiing until she was 46.</li>
    <li>She became interested in NACA after reading news regarding twin sisters who worked as human computers in a Cleveland newspaper.</li>
    <li>As of February 1, 2021, the IAU named a crater on the moon after rocket scientist Annie Easley.</li>
    </ul>
  </div>
    <p id="tribute-info" style="text-align: center"> Brief summary about Annie Easley</p>

  <p>Annie J. Easley was a computer scientist, mathematician, and rocket scientist who worked for the majority of her career at NASA. She worked in the Lewis Research Center (now Glenn Research Center) of the National Aeronautics and Space Administration (NASA) and its predecessor, the National Advisory Committee for Aeronautics (NACA). She was a leading member of the team which developed software for the Centaur rocket stage, and was one of the first Black women to work as a computer scientist at NASA. After high school, she went to Xavier University in New Orleans, Louisiana, and orignially majored in pharmacy for about two years. </p>
    <p>
    In 1954, she returned to Birmingham. As part of the Jim Crow laws that established and maintained racial inequality, African Americans were required to pass an onerous literacy test and pay a poll tax in order to vote. She remembers the test giver looking at her application and saying only, "You went to Xavier University. Two dollars." Subsequently, she helped other African Americans prepare for the test. Her 34-year career included developing and implementing computer code that analyzed alternative power technologies, supported the Centaur high-energy upper rocket stage, determined solar, wind and energy projects, identified energy conversion systems and alternative systems to solve energy problems. Her energy assignments included studies to determine the life use of storage batteries, such as those used in electric utility vehicles. Her computer applications have been used to identify energy conversion systems that offer the improvement over commercially available technologies. She retired in 1989 (some sources say 1991).When Easley registered as a first-time voter, some restrictions did not allow Africans-Americans to register and vote. As one of them, Easley helped African-Americans to register and vote.

She studied battery-powered vehicles that work similarly to modern hybrid cars. When she worked with NASA, she worked on the launching of the shuttle that was used to measure ozone destruction. The software helped in testing and designing the NASA nuclear reactor.

In the 1970s, Easley returned to school to earn her degree in mathematics from Cleveland State, doing much of her coursework while also working full time. A firm believer in education and in her mother’s advice “You can be anything you want to be, but you have to work at it,” Easley was very dedicated in her outreach efforts at NASA. She not only participated in school tutoring programs but was a very active participant in the speaker’s bureau—telling students about NASA’s work and inspiring especially female and minority students to consider STEM careers.


</p>
  </body>
    <hr>
  <footer> <b>Learn more about Annie Easley at this
      <a href="https://www.blackpast.org/african-american-history/annie-j-easley-1933-2011/" id="tribute-link" target= "_blank"><u>website</u></b></a>
    </footer>

    <p style="text-align: center"><em>Coded by Camille Atlan</em></p>

</html>

## script.babel
// !! IMPORTANT README:

// You may add additional external JS and CSS as needed to complete the project, however the current external resource MUST remain in place for the tests to work. BABEL must also be left in place.

/***********
INSTRUCTIONS:
  - Select the project you would
    like to complete from the dropdown
    menu.
  - Click the "RUN TESTS" button to
    run the tests against the blank
    pen.
  - Click the "TESTS" button to see
    the individual test cases.
    (should all be failing at first)
  - Start coding! As you fulfill each
    test case, you will see them go
    from red to green.
  - As you start to build out your
    project, when tests are failing,
    you should get helpful errors
    along the way!
    ************/

// PLEASE NOTE: Adding global style rules using the * selector, or by adding rules to body {..} or html {..}, or to all elements within body or html, i.e. h1 {..}, has the potential to pollute the test suite's CSS. Try adding: * { color: red }, for a quick example!

// Once you have read the above messages, you can delete all comments.


/*
Hello Camper!

Please read the README below in the JS Editor before beginning. Feel free to delete this message once you have read it. Good luck and Happy Coding!

- The freeCodeCamp Team
*/

## scripts
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

## style.css
<style>
.crop {
  width: 35px;
  height: 40px;
  overflow: hidden;
    }
.crop img{
  width: 160px;
  height: 170px;
}

#pinkoutfit{
  border-radius:50%;
}
#blueoutfit2{
  border-radius:50%;
  object-fit: cover;
}
.pictures img {
  float: center;
  width: 100px;
  height: 100px;
  background: #555;
}
header h1 {
  float: left;
  position: relative;
  left: 150px;
  color: #D2691E;
 }
header h3{
  float: left;
  position: relative;
  left: -42px;
  top: 40px;
  color: #D2691E;
}
header .pictures{
display:flex;
flex-direction: row;
max-width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
display: block;
}
#image{
max-width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
display: block;
position: center;
/*right: 10px;*/
padding-bottom: 5px;
}
#img-caption{
  color:#D2691E;
}
ul{
  line-height:25px;
  background-color:#E6E6FA;
}
#listandtitle{
  background-color:#E6E6FA;
}
#listtitle{  color: black;
}
.youtubevid{
 padding-top: 30px;
 padding-bottom:30px;
 padding-left: 15rem;
 padding-right: 15rem;
 margin: -34px 5rem 20px 5rem;
 position: center;
 /*right: 20rem;*/
 background-color: #D2691E;

}
header{
background-color: #2F4F4F;
}
#main{ background-color: #8FBC8F;
}
#tribute-info{
  background-color:#2F4F4F;
  padding-top: 10px;
  padding-bottom: 10px;
  color: #D2691E;

}
footer{
    background-color:#2F4F4F;
    padding-top:10px;
    padding-bottom:10px;
    text-align: center;
}
/*p{
   background-color:#E6E6FA;
}*/
a:visited {
 /* color: #DAA520;*/
  color: #D2691E;
  background-color: transparent;
  text-decoration: none;
}
 a:hover {
  color: #8FBC8F;
  background-color: transparent;
  text-decoration: underline;
}
  a:link {
  color: green;
  background-color: transparent;
  text-decoration: none;
}
</style>

## tribute-page.markdown

      
    Raw
  

              tribute-page.markdown
            
          
    Tribute Page

A Pen by CamilleA3 on CodePen.
License.
	<!DOCTYPE html>
	<html>
	<header>
	<div class="header" style="text-align: center">
	<h1 id="title">Annie Easley </h1>
	<h3>"The Human Computer"</h3> </div>

	<div class="pictures">
	<img src="https://aaregistry.org/wp-content/uploads/2021/02/annie-easley.jpg" height="170" width="160" id="blueoutfit2"/>

	<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzLnKsTF5ykb29BioXE68FyLu157JJc56DUmzCnXP_D-c5s_Av7ETETGAlIF4NBZsb9BY&usqp=CAU" height="170" width="160" id= "pinkoutfit"/>
	</div>
	</header>

	<body id="main">
	<br>
	<figure>
	<div style="text-align: center"> <iframe width="400" height="250" class="youtubevid"src="https://www.youtube.com/embed/0NMBmCMK45M" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
	<figure id="img-div" style="text-align: center" class="imagetwo">
	<img src="https://miro.medium.com/max/1200/1*93t7Xk8cR2Sq6Qn1gMa8Og.png" width="400" height="350" id="image" />

	<figcaption id="img-caption" > <b>A Brief History About Annie</b></figcaption>
	</figure>
	<hr>
	<div id="listandtitle"> <p id="listtitle"><b>Here's a Few Fun Facts About Annie!</b></p>
	<ul>
	<li>She was most known for being a human-computer and performed complex calculations.</li>
	<li>She co-authored numerous papers about nuclear engines in rockets.</li>
	<li>When she started her career at NASA in 1955, it was called National Advisory Committee for Aeronautics, or NACA.</li>
	<li>She was a founding member and one-term president of the NASA Lewis Ski Club, even though she didn’t start skiing until she was 46.</li>
	<li>She became interested in NACA after reading news regarding twin sisters who worked as human computers in a Cleveland newspaper.</li>
	<li>As of February 1, 2021, the IAU named a crater on the moon after rocket scientist Annie Easley.</li>
	</ul>
	</div>
	<p id="tribute-info" style="text-align: center"> Brief summary about Annie Easley</p>

	<p>Annie J. Easley was a computer scientist, mathematician, and rocket scientist who worked for the majority of her career at NASA. She worked in the Lewis Research Center (now Glenn Research Center) of the National Aeronautics and Space Administration (NASA) and its predecessor, the National Advisory Committee for Aeronautics (NACA). She was a leading member of the team which developed software for the Centaur rocket stage, and was one of the first Black women to work as a computer scientist at NASA. After high school, she went to Xavier University in New Orleans, Louisiana, and orignially majored in pharmacy for about two years. </p>
	<p>
	In 1954, she returned to Birmingham. As part of the Jim Crow laws that established and maintained racial inequality, African Americans were required to pass an onerous literacy test and pay a poll tax in order to vote. She remembers the test giver looking at her application and saying only, "You went to Xavier University. Two dollars." Subsequently, she helped other African Americans prepare for the test. Her 34-year career included developing and implementing computer code that analyzed alternative power technologies, supported the Centaur high-energy upper rocket stage, determined solar, wind and energy projects, identified energy conversion systems and alternative systems to solve energy problems. Her energy assignments included studies to determine the life use of storage batteries, such as those used in electric utility vehicles. Her computer applications have been used to identify energy conversion systems that offer the improvement over commercially available technologies. She retired in 1989 (some sources say 1991).When Easley registered as a first-time voter, some restrictions did not allow Africans-Americans to register and vote. As one of them, Easley helped African-Americans to register and vote.

	She studied battery-powered vehicles that work similarly to modern hybrid cars. When she worked with NASA, she worked on the launching of the shuttle that was used to measure ozone destruction. The software helped in testing and designing the NASA nuclear reactor.

	In the 1970s, Easley returned to school to earn her degree in mathematics from Cleveland State, doing much of her coursework while also working full time. A firm believer in education and in her mother’s advice “You can be anything you want to be, but you have to work at it,” Easley was very dedicated in her outreach efforts at NASA. She not only participated in school tutoring programs but was a very active participant in the speaker’s bureau—telling students about NASA’s work and inspiring especially female and minority students to consider STEM careers.


	</p>
	</body>
	<hr>
	<footer> <b>Learn more about Annie Easley at this
	<a href="https://www.blackpast.org/african-american-history/annie-j-easley-1933-2011/" id="tribute-link" target= "_blank"><u>website</u></b></a>
	</footer>

	<p style="text-align: center"><em>Coded by Camille Atlan</em></p>

	</html>
	// !! IMPORTANT README:

	// You may add additional external JS and CSS as needed to complete the project, however the current external resource MUST remain in place for the tests to work. BABEL must also be left in place.

	/***********
	INSTRUCTIONS:
	- Select the project you would
	like to complete from the dropdown
	menu.
	- Click the "RUN TESTS" button to
	run the tests against the blank
	pen.
	- Click the "TESTS" button to see
	the individual test cases.
	(should all be failing at first)
	- Start coding! As you fulfill each
	test case, you will see them go
	from red to green.
	- As you start to build out your
	project, when tests are failing,
	you should get helpful errors
	along the way!
	************/

	// PLEASE NOTE: Adding global style rules using the * selector, or by adding rules to body {..} or html {..}, or to all elements within body or html, i.e. h1 {..}, has the potential to pollute the test suite's CSS. Try adding: * { color: red }, for a quick example!

	// Once you have read the above messages, you can delete all comments.


	/*
	Hello Camper!

	Please read the README below in the JS Editor before beginning. Feel free to delete this message once you have read it. Good luck and Happy Coding!

	- The freeCodeCamp Team
	*/
	<style>
	.crop {
	width: 35px;
	height: 40px;
	overflow: hidden;
	}
	.crop img{
	width: 160px;
	height: 170px;
	}

	#pinkoutfit{
	border-radius:50%;
	}
	#blueoutfit2{
	border-radius:50%;
	object-fit: cover;
	}
	.pictures img {
	float: center;
	width: 100px;
	height: 100px;
	background: #555;
	}
	header h1 {
	float: left;
	position: relative;
	left: 150px;
	color: #D2691E;
	}
	header h3{
	float: left;
	position: relative;
	left: -42px;
	top: 40px;
	color: #D2691E;
	}
	header .pictures{
	display:flex;
	flex-direction: row;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	display: block;
	}
	#image{
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	display: block;
	position: center;
	/right: 10px;/
	padding-bottom: 5px;
	}
	#img-caption{
	color:#D2691E;
	}
	ul{
	line-height:25px;
	background-color:#E6E6FA;
	}
	#listandtitle{
	background-color:#E6E6FA;
	}
	#listtitle{ color: black;
	}
	.youtubevid{
	padding-top: 30px;
	padding-bottom:30px;
	padding-left: 15rem;
	padding-right: 15rem;
	margin: -34px 5rem 20px 5rem;
	position: center;
	/right: 20rem;/
	background-color: #D2691E;

	}
	header{
	background-color: #2F4F4F;
	}
	#main{ background-color: #8FBC8F;
	}
	#tribute-info{
	background-color:#2F4F4F;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #D2691E;

	}
	footer{
	background-color:#2F4F4F;
	padding-top:10px;
	padding-bottom:10px;
	text-align: center;
	}
	/*p{
	background-color:#E6E6FA;
	}*/
	a:visited {
	/* color: #DAA520;*/
	color: #D2691E;
	background-color: transparent;
	text-decoration: none;
	}
	a:hover {
	color: #8FBC8F;
	background-color: transparent;
	text-decoration: underline;
	}
	a:link {
	color: green;
	background-color: transparent;
	text-decoration: none;
	}
	</style>