/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.5;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*code starts here*/
@media screen and (max-width:1280px) {
	#container {
		width:1280px;
	}

	div.square {
		height: auto;
	}
}


#container{
	display: flex;
	width: 100%;
	margin-left:auto;
	margin-right:auto;
	flex-direction: column;
	align-items: center;
}

body {
	font-family: "Roboto", sans-serif;
	color: #575757;
}

#header {
	display: flex;
	width: 100%;
	justify-content: center;
	margin-bottom:20px;
	padding: 30px;
	align-items: center;
	background-color: #dbdbdb;
}

#menu {
	display: flex;
	width: 100%;
	overflow: hidden;
	justify-content: center;
	cursor:pointer;
}


#menu a {
	/*float: right;*/
	font-family:"Roboto";
 	text-decoration: none;
 	color: #575757;
 	padding: 15px;
}

#menu a:hover {
	color: black;
	text-decoration: underline;
}

#menu a:focus {
	color: black;
	text-decoration: underline;
	font-weight: bold;
}

#content {
	width: 90%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

#search_container {
	display: flex;
	width: 90%;
	align-items: center;
	justify-content: center;
}

#keyword {
	width: 60%;
	padding: 10px; /*padding and height give the same results to change the height of the search bar*/

}

#search {
	width: 60%;
	padding: 10px; /*padding and height give the same results to change the height of the search bar*/

}


#parse {
	margin:20px;
	padding: 10px;
	background-color: #60ab22;
	border-radius: 2px;
	color: #fff;

}

#process {
	margin:20px;
	padding: 10px;
	background-color: #60ab22;
	border-radius: 2px;
	color: #fff;

}


.result {
	width: 50%;
	display: block; /* Change from flex to block */
    text-align: left; /* Ensures text aligns properly */
    padding: 10px;

}

.result ul {
    padding-left: 20px; /* Adds indentation for list */
}

.result li {
    margin-bottom: 5px; /* Adds space between items */
}