

/* ========== (All) ========== */
/* Products
/* ========= Section ========= */


#products:hover .sand
{
	abox-shadow: inset 2px -0px 5px 1px black;
}

/* ========= Header ========== */

section.scroll h2
{	
	margin:0px auto!important;
}

/* ========= Input  ========== */
#scroll1-in
{	
	margin: 0 15px;
	vertical-align: middle;
}

section .input
{
	text-align: center;
	margin:auto;
	max-width:90%;
	position:relative;
	width:300px;
}

#scroll1-input
{
	background-color:white;
	color:navy;
	font-size:1em;
}

section .input div
{
	background:aqua;
	right:0;
	bottom:-0.5em;
	position:absolute;
	vertical-align: middle;
	z-index:1;
}

/* ========== LIST  ========== */


.sand-box
{
	display:block;
	position:relative;
}

.sand
{
	height:15em;
	max-height:15em;
	overflow-Y:scroll;
}


#scroll1-ul li:hover
{
	background-color: yellow;
	color:red;
}


			body, h2, h3 {
				font-weight: normal;
				font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
				color: #333;
			}
			body {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				aheight: 90vh;
				max-width:100%;
				text-align: center;
			}
			
			pre
			{
				background:rgba(0,0,0,0.50);
				border-color:white;
				border-style:solid;
				border-width:3px;
				color:cyan;
				font-size:1.75em;
				font-weight:700;
				line-height:2em;
				margin:2em auto;
				overflow-wrap: hidden;
				padding:2em;
				text-align:left;
				max-width:90%;
				white-space: pre-line;
			}
			
			h2 {
				font-size: 26px;
				text-align: center;
			}
			h3
			{
				background:yellow;
				display:inline-block;
				font-size: 24px;
				margin:0 auto;
				padding:0 1em;
			}

			h3.success
			{
				color: #008000;
			}

			h3.fail
			{
				color: #ff0000;
			}

			.container
			{
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
			}

			.searchbar
			{
				padding: 6px 10px;
				width: 400px;
				max-width: 100%;
				border: none;
				margin-top: 1px;
				margin-right: 8px;
				font-size: 1em;
				border-bottom: #333 solid 2px;
				transition: 0.3s;
			}

			.searchbar::placeholder
			{
				font-size: 1em;
			}

			.searchbar:focus
			{
				outline: none;
			}

			.btn-search
			{	color:yellow;
				cursor: pointer;
				text-decoration: none !important;
				font-size: 1.5em;
				padding-top: 5px;
				padding-bottom: 5px;
				background-color: transparent;
				border: none;
				outline: none;
			}

