#leftBar, #rightBar {
	position: relative;
	display: block;
	width: 450px;
	padding: 0 0 60px 0;
	margin: 0;
}
#leftBar {float: left;}
#rightBar {float: right;}

.servBox {
	position: relative;
	display: block;
	width: 450px;
	height: 320px;
	overflow: visible;
	padding: 8px;
	border: 4px solid #dbae3f;
	background-color: rgba(0,0,0,0.3);
	float: left;
	text-decoration: none;
}
.servBox:hover {text-decoration: none;border: 4px solid #ffcf58; color: inherit;}
#right_content .leftlink {float: left; line-height: 20px; margin: 20px 0 10px 0;}
#right_content .rightlink {float: right; line-height: 20px; margin: 20px 0 10px 0;}
#right_content .rightlink a, #right_content .leftlink a {color: #dbae3f; font-weight: bold;}
#right_content .rightlink a:hover, #right_content .leftlink a:hover {text-decoration: underline;}

/* max 480 pixel széles monitoron */
@media screen and (max-width: 480px) {
	h1 {text-align: center;}
	.servBox {width: auto; height: auto; margin: 10px;}
	.servBox img {margin: 10px auto !important; width: 100% !important; max-width: 450px;}
}
/* max 680 pixel széles monitoron */
@media screen and (min-width: 480px) and (max-width: 680px) {
	h1 {text-align: center;}
	.servBox {width: auto; height: auto; margin: 10px;}
	.servBox img {margin: 10px auto !important; width: 100% !important; max-width: 450px;}
}
/* max 1000 pixel széles monitoron */
@media screen and (min-width: 680px) and (max-width: 1000px) {
	h1 {text-align: center;}
	.servBox {width: 45%; height: 350px; margin: 10px 2px;}
	.servBox img {margin: 10px auto !important; width: 100% !important; max-width: 450px;}
}
/* max 1200 pixel széles monitoron */
@media screen and (min-width: 1000px) and (max-width: 1200px) {
	.servBox {margin: 55px 13px;}
}
/* 1200pixel vagy szélesebb monitoron */
@media screen and (min-width: 1200px) {
	.servBox {margin: 55px 63px;}
}
.servBox img {
	position: relative;
	display: block;
	width: 450px;
	border: none;
	margin: 10px 0;
}