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

	#login {
		margin: 0;
		width: calc(100% - (20px * 2));
	}


	#privacy {
		margin: 0;
		width: 100%;
	}

	#privacy > h2 {
		line-height: 140%;
	}

	#privacy > p {
		text-align: left;
	}


	#list > .top {
		padding: 0 0 10px 0;
	}

	#list > .top > input {
		width: 100%;
	}

	#list > .collection > .content > .stats > div {
		padding: 20px;
		width: calc(100% - (20px * 2));
	}

	#list > .collection > .content > #dragScroll > table > tbody > tr:not(.highlight):hover,
	#list > .collection > .content > #dragScroll > table > tbody > tr > .name > a:hover,
	#list > .collection > .content > #dragScroll > table > tbody > tr > .collection > a:hover {
		background-color: transparent;
	}



	#website {
		margin: 10px;
		width: calc(100% - (10px * 2)) !important;
	}

	#manage > form {
		margin-top: 20px;
	}

	#manage > form > .side-by-side,
	#manage > form > .bought > .side-by-side {
		display: block;
	}

	#manage > form > .side-by-side > .item,
	#manage > form > .bought > .side-by-side > .item {
		margin-top: 20px;
		margin-left: 0 !important;
	}

	#manage > form > .side-by-side > .item > .field > input,
	#manage > form > .bought > .side-by-side > .item > .field > input,
	#manage > form > .various > .side-by-side > .item.weight > .field > input {
		width: calc(100% - (10px * 2)) !important;
	}

	#manage > form > .side-by-side > .item > .field > select,
	#manage > form > .bought > .side-by-side > .item > .field > select {
		width: calc(100% - (11px * 2)) !important;
	}

	#manage > form > .side-by-side > .item > .field > textarea {
		width: 100% !important;
	}

	#manage > form > .various > .side-by-side > .item.weight > .field > input {
		width: 110px !important;
	}

	#manage > form > .various > .side-by-side > .item.rate {
		margin-top: 30px;
		margin-left: 20px;
		width: 100%;
	}

	#manage > form > .item.notes {
		margin-top: 50px;
	}

	#manage > .images {
		justify-content: space-around;
	}



	.radios {
		margin: 20px !important;
	}

	.radios > .item {
		display: block;
		margin: 10px 0;
		width: 100%;
	}



	#shared {
		margin: 0;
		width: 100%;
	}

	#shared > .item {
		display: block;
	}

	#shared > .item > .media {
		margin: 0 auto 50px auto;
	}

	#shared > .item > .info {
		width: 100%;
	}

	#shared > .item > .info > .item > .label,
	#shared > .item > .info > .yes-no > .item > .label,
	#shared > .item > .info > .geeky-stuff > .item > .label {
		width: auto;
	}

	#shared > .item > .info > .item > .line,
	#shared > .item > .info > .yes-no > .item > .line,
	#shared > .item > .info > .geeky-stuff > .item > .line {
		display: flex;
	}

	#shared > .item > .info > .yes-no > .item > .value {
		width: 100px;
	}

	#shared > .item > .media > .rating {
		margin-top: 25px;
	}

}







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

	#manage > form > .various > .side-by-side {
		display: block;
	}

	#manage > form > .various > .side-by-side > .item.weight > .field > input {
		width: calc(100% - (10px * 2)) !important;
	}

	#manage > form > .various > .side-by-side > .item.size {
		margin-top: 20px;
		margin-left: 0;
	}

}
