Responsive CSS code for twelvetwenty.nl

_resonsive.scss

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

	article.app-detail {

		.form {
			position: relative;
			padding-top: 0 !important;
		}

		.half.centered, .half.left, .half.right {
			text-align: center;
		}

		.full, .half, .full.bigger {
			width: 320px;

			img {
				max-width: 320px;
			}
		}

		.video.border {
			background-image: none;

			width: 320px;
			height: 180px;

			iframe {
				width: 320px;
				height: 180px;
				margin-top: 12px;
			}
		}

		.screenshot.border {
			background-image: none;
			background-position: left center;
			height: inherit;
			width: 320px;

			img {
				margin-top: 12px;
			}
		}

		.price-tag {
			background-position: center top;
			background-image: url('../img/price-tag-vertical.png');
			background-size: 166px 836px;
			width: 166px;
			height: 418px;

			p {
				left: 13px;
				top: 291px;
			}
		}

		.price-tag:hover {
			background-position: center bottom;
		}
	}

}

@media only screen and (max-device-width: 480px) {
	.apps .app {
		display: block;
		margin: 0px auto;
		width: 160px;
	}
}