

/*  MAKE LAYOUT RESPONSIVE at 1024px FOR SMALLER SCREENS ================================================================ */
@media only screen and (max-width: 1024px) and (min-width: 769px) {
	.cont {
		width:93.75%; /* 960px / 1024px */
	}
	.home #featured h2 {
		margin:2.5em 1.5em;
	}
	
	#featured .entry {
		width:360px;
	}
	#featured .entry header {
		width:360px;
		height:auto;
	}
	
	#content .entry {
		width:360px;
	}
	#content .entry header {
		height:110px;
	}
	#content .entry header img,
	#content .entry.rt header img {
		width:360px;
		height:auto;
	}
	#content .image img {
		width:100%;
		height:auto;
	}
}

/*  MAKE LAYOUT RESPONSIVE at 768px FOR IPAD PORTRAIT ================================================================ */
@media only screen and (max-width: 768px) and (min-width: 481px) {
	.cont {
		width:93.75%; /* 720px / 768px */
	}
	.home #featured h2 {
		margin:1.8em 1.3em;
	}
	
	#featured .entry {
		width:320px;
	}
	#featured .entry header {
		width:320px;
		height:auto;
	}
	
	#content .entry {
		width:320px;
	}
	#content .entry header {
		height:100px;
	}
	#content .entry header img {
		width:100%;
		height:auto;
	}
	#content .entry section {
		min-height:160px;
		padding-top:20px;
	}
	#content .image img {
		width:100%;
		height:auto;
	}
	
	#extras h2 {
		margin-right:0.5em;
		margin-left:0.5em;
	}
	#help h2 {
		margin-right:0.8em;
		margin-left:0.8em;
	}
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	/*body.home {
		background-position:center -100px;
	}*/
	.cont {
		width: 93.75%; /* 450px / 480px */
	}
	#banner aside {
		margin-top:0.7em;
	}
	#banner aside p span {
		display:block;
		background-position:left 2px;
	}
	
	.home #featured h2 {
		font-size:2.571em;
		margin:2em 0.5em;
	}
	
	.col { 
		margin: 1% 0 1% 0%;
	}
	.span_2_of_2,
	.span_1_of_2,
	.span_1_of_3,
	.span_2_of_3,
	.span_3_of_3 { width: 100%; }
	
	#featured .entry {
		width:100%;
		float:inherit !important;
		margin:inherit !important;
	}
	#featured .entry header {
		width:100%;
		height:auto;
	}
	
	#content ul {
		margin-left:1em;
	}
	#content .entry {
		width:100%;
		float:inherit !important;
		margin:inherit !important;
	}
	.kontakt #content .entry {
		width:100%;
		padding-bottom:2em;
		text-align:center;
	}
	#content .entry header {
		height:110px;
	}
	#content .entry header img {
		width:100%;
		height:auto;
	}
	#content .entry section {
		min-height:130px;
		padding-top:50px;
	}
	#content .image img {
		width:100%;
		height:auto;
	}
	
	#extras h2 {
		font-size:2.571em;
	}
	#extras .entry {
		margin-bottom:3em;
	}
	#extras .span_1_of_2 .entry {
		margin-left:0 !important;
		margin-right:0 !important;
	}
	#help header,
	#help section,
	#help footer {
		margin-left:10px;
		margin-right:10px;
	}
	#help h2 {
		font-size:2.571em;
	}
	#contentinfo {
		text-align:center;
	}
	
	#form .span_1_of_2 .entry {
		margin-top:3em !important;
		margin-left:0 !important;
		margin-right:0 !important;
	}
}


/*  GO FULL WIDTH AT LESS THAN 360 PIXELS */
@media only screen and (max-width: 360px) {
	#banner aside {
		margin-top:2.5em;
	}
	#banner aside p,
	#banner aside a:link,
	#banner aside a:visited {
		color:#333;
	}
	#banner aside p span {
		background-image:url(../images/ico_obalka_oranzova.png);
		background-position:left 2px;
	}
	#banner aside p span.telefon {
		background-image:url(../images/ico_telefon_oranzova.png);
	}
	
	.home #featured {
		height:auto;
	}
	.home #featured h2 {
		font-size:2.571em;
		margin:0.7em 0.5em 0.9em 0.5em;
		line-height:1.1em;
	}
	
	#content ul {
		margin-left:0.5em;
	}
	#content .entry header {
		height:80px;
	}
	#content .entry.rt footer {
		border-radius: 0px 0px 0px 50px;
		-moz-border-radius: 0px 0px 0px 50px;
		-webkit-border-radius: 0px 0px 0px 50px;
	}
	#content .entry.lt footer {
		border-radius: 0px 0px 50px 0px;
		-moz-border-radius: 0px 0px 50px 0px;
		-webkit-border-radius: 0px 0px 50px 0px;
	}
	#content .image img {
		width:100%;
		height:auto;
	}
	
	input {
		margin-bottom:0px;
	}
	.w30 {
		width:100%;
	}
	.w70 {
		width:100%;
		float:inherit;
	}
}