style.css

/* Alternative Header Graphics
------------------------------------------------------------ */

.single #header,
.header-wrench #header {
	background: #fff url(images/header-bg-single.jpg) repeat-x;
}

.single #header .wrap,
.header-wrench #header .wrap {
	background: url(images/header-center-single.png) no-repeat left top;
}

.single #header .header-graphic,
.header-wrench #header .header-graphic {
	background: url(images/wrench.png) no-repeat;
	position: absolute;
	bottom: 0;
	left: 55px;
	width: 288px;
	height: 298px;
}

.category #header,
.header-search #header {
	background: url(images/header-bg-category.jpg) repeat-x;
}

.category #header .wrap,
.header-search #header .wrap {
	background: url(images/header-center-category.png) no-repeat;
}

.category #header .header-graphic,
.header-search #header .header-graphic {
	background: url(images/header-magnifying-glass.png) no-repeat;
	position: absolute;
	bottom: 0;
	left: 122px;
	width: 301px;
	height: 270px;
}

.post-type-archive-yoast_plugins #header,
.header-wordpress #header {
	background: url(images/header-bg-wordpress.jpg) repeat-x;
}

.post-type-archive-yoast_plugins #header .wrap,
.header-wordpress #header .wrap {
	background: url(images/header-center-wordpress.png) no-repeat;
}

.post-type-archive-yoast_plugins #header .header-graphic,
.header-wordpress #header .header-graphic {
	background: url(images/header-wordpress.png) no-repeat;
	position: absolute;
	bottom: 0;
	left: 29px;
	width: 408px;
	height: 293px;
}

...


@media only screen and (max-width: 910px) {
	#header .header-graphic {
		width: 305px;
		height: 214px;
		background-size: 305px 214px;
	}

	.single #header .header-graphic,
	.header-wrench #header .header-graphic {
		width: 207px;
		height: 214px;
		background-size: 207px 214px;
	}


	.category #header .header-graphic,
	.header-search #header .header-graphic {
		left: 40px;
		width: 239px;
		height: 214px;
		background-size: 239px 214px;
	}
	
	.post-type-archive-yoast_plugins #header .header-graphic,
	.header-wordpress #header .header-graphic {
		width: 298px;
		height: 214px;
		background-size: 298px 214px;
	}
}

...


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

	#header .header-graphic {
		left: -30px;
	}

	.single #header .header-graphic,
	.header-wrench #header #header-graphic {
		left: -20px;
	}

	.category #header .header-graphic,
	.header-search #header .header-graphic {
		left: -60px;
	}
	
	.post-type-archive-yoast_plugins #header .header-graphic,
	.header-wordpress #header .header-graphic {
		left: -40px;
	}
}