body {
	background-color: white;
	margin: 0;
	color: black;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	cursor: default;
	text-align: center;
}

nav {
	width: 100%;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	position: fixed;
	background-image: linear-gradient(45deg, rgb(135, 225, 237, 0.8), rgba(90, 230, 255, 0.8));
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	z-index:50;
}

nav img {
	height: 75%;
}

nav #searchBarContainer {
	width: 500px;
	height: 50%;
	border: 2px solid cornflowerblue;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 50px;
}

nav #searchBarContainer img {
	height: 25px;
	margin-right: 25px;
}

nav #searchBarInnerContainer {
	width: 75%;
	height: 100%;
}

#searchBar {
	width: 100%;
	height: calc(100% - 2px);
	border-radius: 50px 0 0 50px;
	border: none;
	background-color: transparent;
	padding-left: 10px;
	color: black;
}

#searchBar::placeholder {
	color: lightgrey;
	font-weight: bold;
}

#searchBar:focus {
	border: none;
	outline: none;
}

#searchBar:focus::placeholder {
	color: grey;
}

#searchResults {
	height: 65vh;
	width: 95%;
	background-color: rgb(212, 212, 212);
	border-radius: 50px;
	margin: auto;
	overflow: auto;
	display:none;
}

.searchResult {
	width: 90%;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	background-color: gray;
	border-radius: 15px;
	margin: 20px;
}

.searchResult a {
	transition: 0.5s;
	background-color: blue;
	color: rgb(0, 0, 165);
	border: 5px solid rgb(0, 0, 179);
	border-radius: 5px;
	text-decoration: none;
	padding: 5px;
}

.searchResult a:hover {
	background-color: darkblue;
}

.info {
	height: 35vh;
	width: 45%;
	background-color: rgb(228, 228, 228);
	border-radius: 50px;
	display: inline-block;
	margin: auto;
}

#infoContainer {
	margin: auto;
	float: center;
	text-align: center;
	align-items: center;
	align-self: center;
	align-content: center;
	display: flex;
	justify-content: center;
}

.info a {
	color: black;
	border: 3px solid black;
	text-decoration: none;
}

a {
	font-weight: bold;
	font-size: larger;
	color: white;
	text-decoration: underline;
}

#ioSearchInfoBrowser a {
	font-weight: bold;
	font-size: larger;
	color: blue;
	text-decoration: underline;
}

.customizing {
	margin: 34px;
	border-radius: 25px;
	width: 60%;
	background-color: #ffe4c4;
	padding: 34px;
	margin: auto;
	margin-top: 45px;
}

#CustomizingHeader {
	background-color: rgb(0, 119, 255);
	display: inline;
	padding: 15px;
	border-radius: 15px;
	color: white;
	transition: 0.5s;
}

#CustomizingHeader:hover {
	font-size: 2.5rem;
	border-radius: 10px;
	background-color: rgb(0, 0, 179);
}

#secondlyHeader:hover {
	font-size: 2.3rem;
	color: gold;
}

#SettingsSPANQ9u {
	background-color: rgb(255, 197, 197);
	padding: 3px;
	border-radius: 5px;
	transition: 0.5s;
}

#SettingsSPANQ9u:hover {
	font-size: xx-large;
}

#settingsThemeSpanId {
	transition: 0.5s;
}

#settingsThemeSpanId:hover {
	font-size: xx-large;
	color: rgb(170, 170, 243);
}

legend {
	font-size: 2rem;
}

fieldset {
	border: 5px solid black;
}

.download {
	color: white;
	background-color: blue;
	border-radius: 15px;
	padding: 10px;
	text-decoration: none;
}

#logoMove {
	height: 60px;
	border: 5px solid lightgray;
	width: 90vw;
	margin: auto;
	overflow: hidden;
}

#contentSlider {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.conetent {
	width: 33%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
}


.spin-logo{
    animation: rotation 3s infinite linear;
    border-radius: 5px;
    margin-top: -8%;
    height:150px;
    width:150px;
}

@keyframes  rotation  {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}