html {
	font-size: 100%;
}

* {
	box-sizing: border-box;	
}


body {
	margin: 0 auto;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	background-color: #282828;
	background: #282828 url("../img/bg-texture.png") repeat;
}


h1 {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: "Lobster", Arial, sans-serif;
	font-weight: 400;
	font-size: 6.0625em;
	color: #FFF;
	line-height: 0.5em;
	text-align: center;
}

	h1:first-line {
		color: #FF3E3E;
		font-size: 0.5em;
	}


h2 {
	margin: 78px 0 0 0;
	padding: 0;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 1.5em;
	font-weight: 300;
	color: #F1F1F1;
	width: 173px;	
}

p {
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 1.125em;
	font-weight: 300;
	color: #FFF;
	margin: 0;
	padding: 0;	
}

a {
	text-decoration: none;
}

.text-red {
	color:#FF3E3E;
}
	
	
.container-content {
	display: block;
	width: 218px;
	margin: 0 auto;
	padding: 0;
}




.group:before,
.group:after {
     content: " ";
     display: table;
}

.group:after {
     clear: both;
}

.group {
     *zoom: 1;
}




header {
}

	header p {
		display: table;
		margin: 40px auto 0 auto;
		padding: 0 0 5px 0;
		font-family: "Open Sans", Arial, sans-serif;
		font-size: 1.125em;
		color: #F1F1F1;
		text-transform: uppercase;
		border-bottom: 1px solid #F1F1F1;
	}

	header #header-image {
		display: block;
		width: 100%;
		height: 296px;
		background: url("../img/najlepsia-pizza-m.png") center center no-repeat;
		margin: 78px 0 0 0;
	}


main {
}

section {
	margin: 70px 0 0 0;
}

section h3 {
	display: table;
	max-width: 100%;
	margin: 70px auto 0 auto;
	padding: 0 0 5px 0;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 1.2857142857em;
	font-weight: 700;
	color: #FF3E3E;
	text-align: center;
	text-transform: uppercase;
	border-bottom: 1px solid #FF3E3E;
}

	section h3 + p {
		margin-top: 27px;
	}

section h4 {
	width: 100%;
	margin: 0 auto 27px auto;
	padding: 0 0 5px 0;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 1.2em;
	font-weight: 700;
	color: #FFF;
	text-align: center;
	text-transform: uppercase;
}

section#contact-form {
	background-color: #434343;
	background: url("../img/bg-pizza-m.jpg") no-repeat center center;
	background-size: cover;
	padding: 50px 0;
}


form {
}


	form label {
		display: block;
		width: 100%;
		margin: 0 0 15px 0;
		font-family: "Open Sans", Arial, sans-serif;
		font-size: 1em;
		font-weight: 300;
		color: #F1F1F1;
	}
	
	form input {
		display: block;
		margin: 5px 0 0 0;
		padding: 3px 3px;
		width: 100%;
		height: 35px;
		font-family: "Open Sans", Arial, sans-serif;
		font-size: 1em;
		font-weight: 400;
		color: #282828;		
		border: none;
	}
	
	form button {
		display: block;
		margin: 35px 0 0 0;
		width: 100%;
		height: 45px;
		font-family: "Open Sans", Arial, sans-serif;
		font-size: 1em;
		font-weight: 700;
		background-color: #FF3E3E ;
		border: none;
		color: #FFF;
		text-transform: uppercase;
	}

	form .error input {
		background-color: #FF8686;
	}


		section#contact-form form.send label,
		section#contact-form form.send input,
		section#contact-form form.send button,
		section#contact-form form.send h4 {
			display: none;
		}
		
			section#contact-form form.send:after {
				display: block;
				font-size: 1.1em;
				font-weight: 300;
				text-align: center;
				color: #F1F1F1;
				content: "Formulár bol odoslaný. Díky moc za pozvanie, teší ma Váš záujem. Určite sa v krátkej dobe ozvem.";
			}


footer {
	background: url("../img/footer-pizza-m.png") center top no-repeat;
	margin: 60px 0 60px 0;
	padding-top: 130px;
	text-align: center;
}

	footer .shareaholic-canvas {
		margin: 0 0 5px 25px;
	}

	footer .fb-like {
		margin: 0 auto 0 0;
	}

	footer p {
		margin: 30px 0 0 0;
		font-size: 0.875em;
		color: #9B9B9B;
	}
	
		footer p:last-child {
			margin-top: 0;
		}
		
	footer a {
		color: #989898;
		text-decoration: none;
	}

		footer a:after {
			content: " →";
		}

@media only screen and (min-width: 768px) {

	header p {
		margin: 60px auto 0 auto;
		font-size: 2em;
	}
	
	header #header-image {
		display: block;
		width: 100%;
		height: 296px;
		background: url("../img/najlepsia-pizza-t.png") center center no-repeat;
		margin: 110px 0 0 0;
	}

	h1 {
		font-size: 8.5625em;
	}
	
	h2 {
		width: 400px;
		font-size: 2.125em;
		margin: 100px 0 0 0;
	}
	
	p {
		font-size: 1.375em;
	}
	
	.container-content {
		display: block;
		width: 450px;
		margin: 0 auto;
		padding: 0;
	}

	section {
		margin: 120px 0 0 0;
		position: relative;
	}
	
		section h3 {
			margin: 120px auto 0 auto;
			padding: 0 0 5px 0;
			font-size: 1.75em;
		}

			section h3 + p {
				margin-top: 37px;
			}
		
		section h4 {
			margin: 0 auto 37px auto;
			font-size: 1.375em;
		}


	section#co:before {
		display: block;
		position: absolute;
		top: -100px;
		right: 0;
		width: 138px;
		height: 172px;
		background: url("../img/ico-paradajka-t.png") no-repeat;
		background-size: 138px 172px;
		content: " ";
	}

	section#vy:before {
		display: block;
		position: absolute;
		top: -20px;
		left: 0;
		width: 118px;
		height: 150px;
		background: url("../img/ico-sampion-t.png") no-repeat;
		background-size: 118px 150px;
		content: " ";
	}

	section#vy:after {
		display: block;
		position: absolute;
		bottom: -240px;
		right: 0;
		width: 118px;
		height: 200px;
		background: url("../img/ico-paprika-t.png") no-repeat;
		background-size: 118px 200px;
		content: " ";
	}

	section#contact-form {
		background: url("../img/bg-pizza.jpg") no-repeat center center;
		background-size: cover;
		padding: 80px 0;
	}


		form label {
			display: block;
			float: left;
			width: 217px;
			margin: 0 15px 15px 0;
		}
	
	
			form label:nth-child(2n+2) {
				margin: 0 0 15px 0;
			}
	
			form input {
				padding: 5px;
				height: 40px;
				font-size: 1em;
			}

	/* nastavenie section nemate kvoli hoveru a paddingu */

	section#nemate {	
		margin-top: 90px;
	}
	
		section#nemate .container-content {
			width: 510px;
		}
		
		section#nemate .container-box {
			padding: 30px 40px 30px 40px;		
		}
		
			section#nemate h3 {
				margin: 0;
			}
	
		section#nemate .container-box:hover {
			background-color: #222;
		}

	footer {
		background: url("../img/footer-pizza-t.png") center top no-repeat;
		margin: 50px 0 50px 0;
		padding-top: 290px;
		text-align: center;
	}


}


@media only screen and (min-width: 1024px) {

	header p {
		margin: 117px auto 0 auto;
		font-size: 2.5em;
	}

	header #header-image {
		display: block;
		width: 100%;
		height: 460px;
		background: url("../img/najlepsia-pizza-d.png") center center no-repeat;
		margin: 180px 0 0 0;
	}

	h1 {
		font-size: 10em;
	}
	
	h2 {
		width: 600px;
		font-size: 2.8125em;
		margin: 100px 0 0 49px;
	}
	
	p {
		font-size: 1.375em;
	}
	
	.container-content {
		display: block;
		width: 764px;
		margin: 0 auto;
		padding: 0;
	}

	.container-box {
		width: 550px;
	}

		section h4 {
			font-size: 1.6em;
		}


	section#kto .container-box,
	section#nemate .container-box {
		margin: 0 auto;
	}

	section#vy .container-box {
		margin: 0 0 0 214px;
	}

	section#co:before {
		display: block;
		position: absolute;
		top: -100px;
		right: 50%;
		margin-right: -480px;
		width: 180px;
		height: 206px;
		background: url("../img/ico-paradajka-d.png") no-repeat;
		background-size: 180px 206px;
		content: " ";
	}

	section#vy:before {
		display: block;
		position: absolute;
		top: -20px;
		left: 50%;
		margin-left: -430px;
		width: 169px;
		height: 186px;
		background: url("../img/ico-sampion-d.png") no-repeat;
		background-size: 169px 186px;
		content: " ";
	}

	section#vy:after {
		display: block;
		position: absolute;
		bottom: -320px;
		right: 0;
		width: 165px;
		height: 299px;
		background: url("../img/ico-paprika-d.png") no-repeat;
		background-size: 165px 299px;
		content: " ";
	}

	#odmena h2 {
		margin-top: 150px;
	}
	
	section#contact-form {
		background: url("../img/bg-pizza.jpg") no-repeat center center fixed;
		background-size: cover;
		padding: 100px 0;
	}

		form label {
			display: block;
			float: left;
			width: 360px;
			margin: 0 40px 20px 0;
		}
	
	
			form label:nth-child(2n+2) {
				margin: 0 0 15px 0;
			}
	
			form input {
				padding: 5px;
				height: 40px;
				font-size: 1em;
			}
			
			form button:hover {
				cursor: pointer;
				background-color: #DC3030;
			}

			section#contact-form form.send:after {
				width: 650px;
				margin: 0 auto;
				font-size: 1.3em;
			}


	/* nastavenie section nemate kvoli hoveru a paddingu */

	section#nemate {	
	}
	
		section#nemate .container-content {
			width: 824px;
		}

		section#nemate .container-box {
			width: 610px;
		}

	footer {
		background: url("../img/footer-pizza-d.png") center top no-repeat;
		margin: 120px 0 50px 0;
		padding-top: 120px;
		text-align: center;
	}
	
		footer a:hover {
			color: #FFF;
		}
		
			footer a:after {
			}
}

@media only screen and (min-width: 1400px) {

	section h4 {
		font-size: 1.7em;
	}


	section#co:before {
		display: block;
		position: absolute;
		top: -100px;
		right: 50%;
		margin-right: -35%;
		width: 180px;
		height: 206px;
		background: url("../img/ico-paradajka-d.png") no-repeat;
		background-size: 180px 206px;
		content: " ";
	}

	section#vy:before {
		display: block;
		position: absolute;
		top: -20px;
		left: 50%;
		margin-left: -30%;
		width: 169px;
		height: 186px;
		background: url("../img/ico-sampion-d.png") no-repeat;
		background-size: 169px 186px;
		content: " ";
	}

	section#vy:after {
		display: block;
		position: absolute;
		bottom: -320px;
		right: 0;
		width: 165px;
		height: 299px;
		background: url("../img/ico-paprika-d.png") no-repeat;
		background-size: 165px 299px;
		content: " ";
	}

	section#contact-form {
		padding: 150px 0;
	}


}