@font-face {
    font-family: 'PlantinStd-Bold';
    src: url('fonts/PlantinStd-Bold.otf');
    src: local('PlantinStd-Bold'), local('PlantinStd-Bold'), url('fonts/PlantinStd-Bold.otf') format('opentype');
}
body{
	background-color: rgb(0,0,221);
	font-family:: 'PlantinStd-Bold', serif;
	color: white;
	font-size: 25pt;
	text-transform: lowercase;
	display: flex;
}

input[type=text]{
    background-color: rgb(0,0,221);
	font-family: 'PlantinStd-Bold', serif;
	color: white;
	font-size: 50pt;
	border: none;
	text-transform: lowercase;
    width: 400px;
    margin: auto;

}
input:focus{
	outline:none;
}

* { margin: 0; padding: 0; }


#search-container {
    position: relative;
    display: inline-block;
    margin: auto;
    width: 100%;
    height: 100%;
}

#search-container input {
	position: absolute;
	top: 0;
	left: 0; 
    bottom: 0;
    right:0;

}

#search {
    position: relative;
    color: white;
    z-index: 10;
  	background: transparent;
  	text-transform: lowercase;
}

#suggestion {
    position: relative;
	z-index: 0;
  	color: #ccc;
    background: transparent;
    text-transform: lowercase;
}