html{
	overflow-x:hidden;
	width: 100vw;
	margin: 0;
	padding: 0;
	height: auto;
}
body{
	margin: 0;
	padding: 0;
	background-image: url("back.jpg");
	background-repeat: repeat;
	background-size: 100vw auto;
	font-family: 'Righteous', cursive;
	overflow-x:hidden;
	width: 100vw;
}
::-webkit-scrollbar {
    display: none;
}
#logo{
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	margin-top:30px;
}
#tel{
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	color: #ffffff;
	font-weight: bold;
	text-align: center;
	font-size:80px;
	margin-top:50px;
}
#gumb{
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	background-color: #CC333A;
	width: 100px;
	text-align: center;
	padding: 10px 10px 10px 10px;
	font-size: 20px;
	border-style: solid;
	margin-top:30px;
	transition: 0.3s;
}
#gumb:hover{
	transition: 0.3s;
	background-color: #93252D;
}
a{
	text-decoration: none;
	color: #ffffff;
}
#pizza{
	margin-bottom: 500px;
	width: 1000px;
	height: 1000px;
	background-size: cover;
	background-position: center;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	background-image: url("pizza.png");
}
#flex{
	display: flex;
	width: 100%;
	flex-direction: row;
	flex-wrap: 2;
}
#vrijeme{
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 400px;
	top: 200px;
	color: #ffffff;
	font-size: 40px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme2{
	text-align: center;
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 400px;
	top: 200px;
	color: #ffffff;
	font-size: 18px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme4{
	text-align: center;
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 400px;
	top: 200px;
	color: #ffffff;
	font-size: 58px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme1{
	background-color: #41474C;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 400px;
	top: 200px;
	color: #ffffff;
	font-size: 20px;
	text-align: center;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme3{
	background-color: rgba(255, 255, 255, 0.8);
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 400px;
	top: 200px;
	color: #000000;
	font-size: 20px;
	text-align: center;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
	line-height: 30px;
}
#pnaslov{
	text-align: center;
}
.pleft{
	line-height: 5px;
	text-align: left;
}
.pright{
	line-height: 5px;
	right: 50px;
	position: absolute;
	text-align: right;
}

#Layer_1{
	z-index: 10;
	width: 400px;
	position: fixed;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	overflow: visible;
	animation: p ease-in 0.7s 2.2s both;
}
#bgi{
	z-index: 9;
	position: fixed;
	animation: p ease-in 0.7s 2.2s both;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	width: 100vw;
	height: 100vh;
	background-color: #ffffff;
}
#p1{
	animation: p1 ease 0.8s;
}
#p2{
	animation: p2 ease 0.8s 0.2s;
}
#p3{
	animation: p3 ease 0.8s 0.4s;
}
#p4{
	animation: p4 ease 0.8s 0.6s;
}
#p5{
	animation: p5 ease 0.8s 0.8s;
}
#p6{
	animation: p6 ease 0.8s 1s;
}
#p7{
	animation: p7 ease 0.8s 1.2s;
}
#p8{
	animation: p8 ease 0.8s 1.4s;
}
@keyframes p {
  0%   {top: 50%;}
  100%   {top: -150%;}
}
@keyframes p1 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(25px,-50px);}
  100%   {transform: translate(0,0);}
}
@keyframes p2 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(50px,-25px);}
  100%   {transform: translate(0,0);}
}
@keyframes p3 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(50px,25px);}
  100%   {transform: translate(0,0);}
}
@keyframes p4 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(25px,50px);}
  100%   {transform: translate(0,0);}
}
@keyframes p5 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(-25px,50px);}
  100%   {transform: translate(0,0);}
}
@keyframes p6 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(-50px,25px);}
  100%   {transform: translate(0,0);}
}
@keyframes p7 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(-50px,-25px);}
  100%   {transform: translate(0,0);}
}
@keyframes p8 {
  0%   {transform: translate(0,0);}
  50% {transform: translate(-25px,-50px);}
  100%   {transform: translate(0,0);}
}
@media only screen and (max-width: 600px) {
  #logo{
	width: 300px;
}
#Layer_1{
	z-index: 10;
	width: 200px;
	position: fixed;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	overflow: visible;
	animation: p ease-in 0.7s 2.2s both;
}
#tel{
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	color: #ffffff;
	font-weight: bold;
	text-align: center;
	font-size:40px;
	margin-top:50px;
}
#vrijeme{
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 200px;
	top: 200px;
	color: #ffffff;
	font-size: 20px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme2{
	text-align: center;
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 200px;
	top: 200px;
	color: #ffffff;
	font-size: 15px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme4{
	text-align: center;
	background-color: #CC333A;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 200px;
	top: 200px;
	color: #ffffff;
	font-size: 58px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme1{
	background-color: #41474C;
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 200px;
	top: 200px;
	color: #ffffff;
	font-size: 20px;
	text-align: center;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#vrijeme3{
	background-color: rgba(255, 255, 255, 0.8);
	position: relative;
	transform: translateX(-50%);
	left: 50%;
	width: 200px;
	top: 200px;
	color: #000000;
	font-size: 20px;
	text-align: center;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
	line-height: 30px;
}
#pizza{
	margin-bottom: 500px;
}

}