/* Used colors from https://www.w3schools.com/css/css_colors.asp to give color to the heading and text alignment from https://www.w3schools.com/css/css_text_align.asp to align the text */
h1 {
	color: black;
	text-align: center;
}
/* Used background-color from https://www.w3schools.com/css/css_background.asp to give background color to the website.*/
body {
	background-color: lightskyblue;
}
/* Used margins from https://www.w3schools.com/css/css_margin.asp to give spacing on outer side and used font family from https://www.w3schools.com/css/css_font.asp for the body. */
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}
/* Used overflow property from https://www.w3schools.com/css/css_overflow.asp to controls what happens to content that is too big to fit into an area.*/
.topnav {
  overflow: hidden;
  background-color: #333;
}
/* Used float from https://www.w3schools.com/css/css_float.asp to either put it on left or right side and Used padding from https://www.w3schools.com/css/css_padding.asp to give space inside the border */
/* Used text decoration from https://www.w3schools.com/css/css_text_decoration.asp to set or remove decorations from text and Used font size from https://www.w3schools.com/css/css_font_size.asp to set the size of the text.*/
.topnav a {
  float: left;
  margin-left: 180px;
  color: #f2f2f2;
  text-align: left;
  padding: 20px 60px;
  text-decoration: none;
  font-size: 17px;
}
/* Used active feature from https://www.w3schools.com/css/css_navbar_horizontal.asp to highlight the current tab on the website. */
.active {
	background-color: coral;
	padding: 10px;
}
/* Used hover feature from https://www.w3schools.com/css/css_navbar_horizontal.asp to highlight whenever cursor hovers over it on the website. */
.topnav a:hover {
  background-color: coral;
  color: black;
}
/* Used border from https://www.w3schools.com/css/css_border.asp to give a solid border around the paragraph to make it look nicer and separate from other things. */
.para {
	border: 3.5px solid black;
	margin-left: 545px;
	margin-right: 445px;
	text-align: center;
	background-color: white;
	padding: 10px;
}	
/* Used display property from https://www.w3schools.com/css/css_display_visibility.asp which specifies if/how an element is displayed. */
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 15px 10px;
}
/* Below styling is for the paragraph 3 for main page. */
.p3 {
	border: 3.5px solid black;
	margin-left: 545px;
	margin-right: 445px;
	background-color: white;
	text-align: center;
	padding: 10px;
}
/* Below styling is used for image in main page/. */
.image {
	margin-top: 15px;
	margin-left: auto;
	margin-right: auto;
	padding-top : 20px;
}
/* Below styling is for a box used in 2nd page of about*/
.box {
	border: 3.5px solid black;
	margin-top: 50px;
	margin-left: 70px;
	margin-right: 680px;
	text-align: left;
	background-color: white;
	padding: 10px;
}
/* Below styling is used for about me*/
.me {
	margin-right: 100px;
	margin-top: 30px;
}
/* Below stlying is used for image in model-1 website. */
.bee {
	margin-top: 20px;
	margin-left: 50px;
	margin-right: 50px;
	text-align: center;
	font-size: 20px;
	background-color: gold;
	padding: 10px;
	border: 3.5px solid black;
}
/* Used table format from https://www.w3schools.com/css/css_table.asp to create tables and add data to it. */
table {
	width: 30%;
	margin-top: 15px;
	margin-left: 595px;
}
/* Used table format from https://www.w3schools.com/css/css_table.asp to create tables and add data to it. */
th, caption {
	text-align: center;
	margin-bottom: 10px;
	border: 3.5px solid black;
	padding: 5px;
	font-size: 16px;
	background-color: white;
}
/* Used table format from https://www.w3schools.com/css/css_table.asp to create tables and add data to it. */
table, th, td {
    border: 3.5px solid black;
    border-collapse: collapse;
	background-color: white;
}
/* Below stlying is used for image in model-2 website. */
.prime {
	margin-top: 20px;
	margin-left: 50px;
	margin-right: 50px;
	text-align: center;
	font-size: 20px;
	background-color: steelblue;
	color: white;
	padding: 10px;
	border: 3.5px solid black;
}
/* Below stlying is used for image in model-2 website. */
.gun {
	margin-top: 20px;
}
/* Below stlying is used for figure in model-2 website. */
.figures {
	margin-top: 15px;
	margin-left: 595px;
	margin-right: 445px;
	text-align: center;
	font-size: 15px;
	background-color: steelblue;
	padding: 1px;
	color: white;
	border: 3.5px solid black;
}