@media only screen and (max-width: 740px) {

	html {
		background-color: var(--main);
	}

	a#header {
		margin: 5px;
	}

	#website {
		margin: 0;
	}

	#website > main {
		border: 0;
	}

	#website > footer > a:hover {
		opacity: .7;
	}
    
    .checkbox > .desc {
	    width: calc(100% - 50px);
        text-align: left;
    }

	#send > form > .item.message > .desc > summary:hover {
		background-color: transparent;
	}

	#send > form > .item.message > .desc[open] > summary {
		background-color: var(--highlight);
	}

	#send > form > .item.password > .field > a#randomize:hover,
	#send > .share > .item > .field > a#copy-url:hover,
	#send > .share > .item > .field > a#copy-pw:hover {
		background-color: transparent;
		color: var(--text);
	}

	#send > form > .item.password > .field > a#rand-password:hover,
	#send > form > .item.password > .field > a#rand-passphrase:hover {
		background-color: transparent;
		color: var(--text);
	}

	#send > form > .item.message > .formatting > div > a:not(#delete):hover > svg {
		stroke: var(--text);
	}

	#send > form > .item.message > .formatting > div > a#delete:hover > svg {
		fill: var(--text);
	}

	#send > form > .item.message > .formatting > div > a#quote:hover > svg {
		fill: var(--text);
		stroke: transparent;
	}

	#send > .share > .item > .field > .error,
	#send > .share > .further-info > .item > .field > .error {
		width: 264px;
	}

	/*#send > form > .item.password > .length > datalist > option,
	#send > form > .item.password > .length > datalist > option:hover {
		font-weight: 400;
		opacity: 1;
	}*/

	#send > .about > .content > p {
		text-align: left;
	}

	#read > .error > .options,
	#read > .content > .options {
		display: flex;
		flex-flow: column nowrap;
	}

	#read > .error > .options > a#status,
	#read > .content > .options > a#status {
		margin-left: 0;
	}

	.length > datalist > option {
		opacity: 1;
	}

}



@media only screen and (max-width: 400px) {

	#read > .list > .item {
		align-items: flex-start;
		flex-flow: column nowrap;
	}

	#read > .list > .item:not(:first-child) {
		margin-top: 10px;
	}

	#read > .list > .item > .line {
		display: none;
	}

}



@media only screen and (max-width: 297px) {

	.length > datalist > option[value="32"] {
		margin-right: 0;
	}

	.length > datalist > option[value="48"] {
		margin-left: 0;
	}

}