:root {
	--highlightcolor: #3c2718;
	--highlightopp: white;
	--coverimage: url('../img/geese-light.jpg');
	--covertextcolor: #0a0a0a;
	--covertextshadow: 0.25vw 0.25vw 0.5vw rgb(0,0,0,0.3), -0.25vw -0.25vw 0.5vw rgb(0,0,0,0.3), 0 0 3px var(--bgcolor);
	--covertextaltshadow: 0.25vw 0.25vw 0.5vw rgb(0,0,0,0.3), -0.25vw -0.25vw 0.5vw rgb(0,0,0,0.3), 0 0 3px var(--highlightopp);
}

@media screen and (prefers-color-scheme: dark) {
	:root {
		--highlightcolor: #d5b198;
		--highlightopp: black;
		--coverimage: url('../img/geese-dark.jpg');
		--covertextcolor: white;
		--covertextshadow: 0.5vw 0.5vw 1vw rgb(0,0,0,0.5), -0.5vw -0.5vw 1vw rgb(0,0,0,0.5), 0 0 3px var(--bgcolor);
		--covertextaltshadow: 0.5vw 0.5vw 1vw rgb(0,0,0,0.5), -0.5vw -0.5vw 1vw rgb(0,0,0,0.5), 0 0 3px var(--highlightopp);
	}
}

input[type='email'], input[type='number'], input[type='password'], input[type='search'], input[type='tel'], input[type='text'], input[type='url'], input[type='color'], input[type='date'], input[type='month'], input[type='week'], input[type='datetime'], input[type='datetime-local'], input:not([type]), textarea, select, .login-form input[type=email], .login-form input[type=password], .login-form input[type=text], .login-form textarea, .column-form textarea, .password-container
{
        border: unset;
        background-color: var(--bgcolor);
        color: var(--fgcolor);
        border-radius: 1.9rem;
}

select > option {
    font-style: normal;
    color: var(--fgcolor);
}

select option[value=""], select option:not([value]) {
    display: unset;
}

.custom-select select {
	appearance: none;
}

.custom-select {
	position: relative;
}

.custom-select::after {
	--size: clamp(3px, 2vw, 6px);
	position: absolute;
	content: "";
	right: clamp(10px, 4vw, 25px);
	pointer-events: none;
	border-left: var(--size) solid transparent;
	border-right: var(--size) solid transparent;
	border-top: var(--size) solid var(--highlightcolor);
	top: calc(50% - var(--size) / 2);
}

.custom-select:hover:after {
	transform: scale(1.1);
}

#explore-panel-right .custom-select::before {
	background-image: linear-gradient(to right, rgba(255, 0, 0, 0) 5%, var(--bgcolor) 55%);
	position: absolute;
	height: clamp(22px, 7.5vw, 34px);
	width: clamp(18px, 24vw, 56px);
	right: clamp(5px, 1vw, 20px);
	content: "";
	top: clamp(6px, 1.1vw, 21px);
	pointer-events: none;
	border-radius: 1.9rem;
}

.explore.content {
	display: flex;
	flex-direction: column;
	padding: 0;
}

.explore.content #topbar {
	width: 100%;
}

.explore.content #explore-panel {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
	background: var(--sadcbiz);
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid var(--highlightcolor);
}

#explore-panel-right {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;
	flex-grow: 10;
}

.language-selector {
	margin-left: 1.8rem;
	flex-grow: 0;
}

#explore-panel .language-selector select {
	background-color: var(--sadcbiz);
	color: var(--highlightcolor);
	opacity: 0.8;
	width: clamp(60px, 27vw, 120px);
	border: none;
	margin: clamp(5px, 1vw, 20px);
	border-radius: 1.9rem;
	font-size: clamp(8px, 3vw, 13px);
	height: clamp(25px, 8vw, 38px);
	padding: clamp(2px, 1vw, 10px) clamp(5px, 2vw, 20px);
	line-height: normal;
}

#explore-panel .language-selector select:hover {
	transform: scale(1.02);
	box-shadow: 1px 1px 8px rgb(0,0,0,0.5);
}

#explore-panel .language-selector select > option {
   	color: var(--highlightcolor);
}

#explore-panel-right select, #explore-panel-right input {
	margin: clamp(5px, 1vw, 20px);
	border-radius: 1.9rem;
	width: clamp(60px, 27vw, 200px);
	font-size: clamp(8px, 2vw, 13px);
	height: clamp(25px, 8vw, 38px);
	padding: clamp(2px, 1vw, 10px) clamp(5px, 2vw, 20px);
	line-height: normal;
}

.results #explore-panel-right select, .results #explore-panel-right input {
	width: clamp(45px, 22vw, 200px);
}

#explore-panel-right input[type='submit'] {
	background-color: var(--highlightcolor);
	color: var(--highlightopp);
	box-shadow: 1px 1px 4px rgb(0,0,0,0.5);
	border: unset;
	letter-spacing: clamp(-1px, 0.1vw, 0.1rem);
	font-size: clamp(9px, 2.5vw, 13px);
	margin: clamp(5px, 1vw, 20px);
	border-radius: 1.9rem;
	font-size: clamp(8px, 3vw, 13px);
	height: clamp(25px, 8vw, 38px);
	padding: clamp(2px, 1vw, 10px) clamp(15px, 2vw, 20px);
	line-height: normal;
	width: fit-content;
}
#explore-panel-right input[type='submit']:hover {
	transform: scale(1.01);
	box-shadow: 1px 1px 8px rgb(0,0,0,0.5);
}

#explore-panel-right div.search {
	flex-grow: 0;
	align-items: center;
}

#coverimage {
	padding: 5vw 3vw;
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
	min-height: calc(100vh - 250px);
	align-items: center;
	background-image: var(--coverimage);
	background-size: cover;
	background-position: center center;
	gap: clamp(20px, 5vw, 200px);
	margin-bottom: 2vw;
}

#coverimage div {
	opacity: 1;
	z-index: 20;
}

.results #coverimage {
	min-height:0;
	padding:2vw;
	justify-content:start;
	flex-wrap:nowrap;
	flex-direction:row-reverse;
}

#covertext {
	font-size: clamp(14px, 4vw, 30px);
	font-weight: bold;
	text-shadow: var(--covertextshadow);
	width: clamp(250px, 33vw, 400px);
	color: var(--covertextcolor);
}

#covertext span.alternate {
	color: var(--highlightcolor);
	text-shadow: var(--covertextaltshadow);
}

.results #covertext {
	font-size: clamp(14px, 3vw, 26px);
}

#search-panel {
	width: clamp(280px, 33vw, 600px);
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	padding: clamp(12px, 3vw, 20px);
	border-radius: 1.9rem;
	background: rgb(0,0,0,0.75);
	color: white;
	backdrop-filter: blur(4px);
}

#search-panel div.search {
	flex-grow: 0;
}

#search-panel p {
	flex-grow: 10;
	font-size: clamp(8px, 3vw, 16px);
}

#search-panel h3 {
	padding: 3rem 0 1rem;
	color: white;
}

#search-panel input[type='submit'] {
	border-radius: 50%;
	width: min-content;
	padding: 0 1rem;
	align-self: center;
}

#search-text {
	margin-bottom: 0;
}

#search-panel-searchfield {
	position: relative;
}

#search-panel svg#search-icon.page-action {
	fill: var(--highlightcolor);
	position: absolute;
	top: 7px;
	right: 7px;
}

#search-panel svg#search-icon.page-action:hover {
	transform: scale(1.05);
}

#buttons-panel {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
}

#buttons-panel input[type='submit'] {
	background-color: var(--highlightcolor);
	color: var(--highlightopp);
	border-radius: 1.9rem;
	box-shadow: 1px 1px 4px rgb(0,0,0,0.5);
	border: unset;
	font-size: clamp(9px, 1.4vw, 13px);
	letter-spacing: clamp(-1px, 0.02vw, 0.1rem);
}

#buttons-panel input[type='submit']:hover {
	transform: scale(1.01);
	box-shadow: 1px 1px 8px rgb(0,0,0,0.5);
}

.results #buttons-panel {
	width:unset;
}

#searchresults {
	margin: 1rem;
	width: fit-content;
	align-self: center;
}

#results {
	display: flex;
	flex-direction: column;
	justify-content: start;
	align-items: start;
	padding: 3vw 5vw;
}

.explore-result {
	display: flex;
	width: clamp(250px, 87vw, 800px);
	flex-direction: column;
	padding-bottom: 2vw;
}

.explore-result-companyname {
	font-size: clamp(14px, 6vw, 24px);
	font-weight: bold;
	color: var(--sadcbiz);
}

.explore-result:hover .explore-result-companyname, .explore-result:hover .explore-result-siteaddress {
	color: var(--highlightcolor);
	transition: all 0.5s ease-out;
}

.explore-result-overlaytext {
	font-size: clamp(12px, 3.5vw, 20px);
	padding-bottom: 0.5vw;
}

.explore-result-excerpt {
	font-size: clamp(10px, 3vw, 16px);
	padding-bottom: clamp(8px, 2vw, 16px);
	border-bottom: 1px dotted var(--sadcbiz);
}

.explore-result-siteaddress {
	font-size: clamp(8px, 2.5vw, 12px);
	align-self: end;
	padding-top: clamp(2px, 0.5vw, 10px);
	color: var(--sadcbiz);
}

@media screen and (max-width: 1064px) {
	.explore.results.content #explore-panel {
		flex-direction: column;
		padding-top: 1vw;
		padding-bottom: 2vw;
	}
	.results #explore-panel .language-selector select {
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 850px) {
	.explore.content #explore-panel {
		flex-direction: column;
		padding-top: 1vw;
		padding-bottom: 2vw;
	}
	#explore-panel .language-selector select {
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 620px) {
	.explore.content {
		padding-bottom: 60px;
	}
	.explore.content #explore-panel {
		flex-wrap: wrap;
		border-bottom: unset;
	}
	#search-panel {
		width: 80vw;
	}
	#buttons-panel {
		flex-direction: column;
	}
	#buttons-panel input[type='submit'] {
		width: 80vw;
		font-size: clamp(9px, 3vw, 11px);
		letter-spacing: clamp(-1px, 0.2vw, 0.1rem);
	}
	.results #buttons-panel input[type='submit'] { 
		width:unset; 
	}
	.sadcbiz-logo {
		justify-content: center;
		border-bottom: 2px solid var(--highlightcolor);
	}
	.results #covertext {
		font-size: clamp(11px, 3vw, 20px);
	}
}

@media screen and (max-width: 550px) {
	.results #explore-panel-right {
		flex-direction: column;
		align-items: center;
	}
	.results #explore-panel-right select, .results #explore-panel-right input {
		width: 90vw;
	}
	.results #explore-panel-right input[type='submit'] {
		width: fit-content;
	}
	.results form.searchform {
		display: flex;
		flex-direction: column-reverse;
	}
	.results #coverimage {
		margin-bottom: 0;
	}
}