/* thumbsget4web - Gets the maxres or hq thumbnail for YouTube videos from
original video URL. Not associated with YouTube or Google/Alphabet.
Copyright (C) 2019-2020, 2025 Drew Naylor

thumbsget4web is a port of thumbsget to a webpage.
You can get the code for thumbsget and thumbsget4web from:
https://codeberg.org/DrewNaylor/thumbsget

YouTube and all related words are copyright
and trademark Google/Alphabet. Explained more in About window.
 Google/Alphabet is not affiliated with either the thumbsget/thumbsget4web project or Drew Naylor
 and does not endorse this software.
 Any other companies mentioned own their respective copyrights/trademarks.
(Note that the copyright years include the years left out by the hyphen.)

This file is part of thumbsget4web.

thumbsget4web is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

thumbsget4web is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with thumbsget4web.  If not, see <http://www.gnu.org/licenses/>. */

div[id="noscript"] {
	display: flex;
	flex-direction: column;
	place-content: end;
	font-family: Arial,sans-serif;
	font-size: 13px;
	width: 95vw;
}

div {
	display: flex;
	flex-direction: column;
	place-items: center;
	width: 95vw;
}

label {
	font-family: Arial,sans-serif;
	font-size: 13px;
}

details {
	font-family: Arial,sans-serif;
	font-size: 13px;
}

summary {
	font-family: Arial,sans-serif;
	font-size: 13px;
}

input {
	font-family: Arial,sans-serif;
	font-size: 13px;
}

input[type="text"] {
	/* Based on this SO answer:
	https://stackoverflow.com/a/2125516 */
	width: 432px;
	max-width: 94vw;
}

input[type="button"] {
	margin-top: 8px;
	height: 29px;
	width: 209px;
}

input[type="checkbox"] {
	margin-top: 8px;
	max-width: 100%;
}

img {
	height: 243px;
	width: 432px;
/* 	object-fit info from here:
	https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit 
	this seems to make the image box work like zooming in the Windows Forms one. */
	object-fit: contain;
	max-width: 100%;
	margin-top: 8px;
	font-family: Arial,sans-serif;
	font-size: 12.5px;
	border: 1px solid gray;
}

a {
	font-family: Arial,sans-serif;
	font-size: 13px;
}