@charset "UTF-8";
body {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	background:#C42126;
	text-decoration:none;
}
#pageContent {
	top:0px;
	left:0px;
	text-align:center;
	width:100%;
	height:auto;
	
}
#slogon {
	font-family: Zapfino, Arial, Helvetica, sans-serif;
	transform: rotate(-15deg);
	margin-top: -2.25%;
	margin-left: 10%;
	width: auto;
	font-size: 32px;
	font-weight:bold;
	color: #fff;
	text-shadow: 3px 5px 8px #a42126;
	z-index:100;
}
#slogon h2 {
	font-family: Arial, Helvetica, sans-serif;
	transform: rotate(0deg);
	margin-top: -2.75%;
	margin-left: 6%;
	font-size: 18px;
	color: #fff;
	letter-spacing: 2px;
	word-spacing: 0px;
	text-shadow: 2px 3px 5px #a42126;
}


#logoSite {
	position: absolute;
	left: 7.5%;
	top: 5%;
	width: 120px;
	height: 120px;
	background-image: url(../images/logos/LunchWunchLogo254.png);
	background-size: cover;
	border-radius: 60px;
	z-index: 200;
	box-shadow:3px 5px 8px #a42126;
	
}

#logoSite:hover {
	animation: logoRevolve 5s infinite;
}
#navBar {
	background-color:#c42126;
	position: absolute;
	left: 32.5%;
	float:right;
	top: 9.5%;
	width: 60%;
	height: 50px;
	z-index: 300;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFF;
	border-left-color: #FFF;
	border-bottom-color: #FFFFFF;
	border-right-color: #c42126;
	border-radius: 25px 0px 0px 25px;
}
#callBox {
	position: absolute;
	background-color:#ffcb00;
	box-sizing:border-box;
	border: 3px solid #ffcb00;
	left: 70%;
	top: 0%;
	width: 30%;
	height: 50px;
	z-index: 400;
}
#callBox:before {
	position:absolute;
	content: '';
	width: 15px;
	height: 15px;
	left:0px;
	top:15px;
	background-color:#ffcb00;
	transform: translate(-50%,0%) rotate(45deg);
	border-radius:3px;
}

#callBox:hover {
	animation: pocking 2s infinite;
	
}

#callBox h3 {
	font-size: 18px;
	text-align: center;
	color: #C42126;
	line-height: 0px;
	letter-spacing: 1px;
}
#callBox p {
	text-transform:uppercase;
	font-size: 10.5px;
	text-align: center;
	text-decoration:none;
	color: #C42126;
	line-height: 0px;
	top:0px;
}

#footerPan {
	position:absolute;
	top:90%;
	bottom: 0px;
	width: 100%;
	height: 430px;
	background-color:#b42126;
	z-index: 600;
}
#footerLeft {
	position:relative;
	float:left;
	text-align:center;
	top:0px;
	left:0px;
	height:100%;
	width:25%;
	background-color:#c42126;
	
}

#footerLogo {
	margin-top:7%;
	clear:both;
	height:130px;
	width:100%;
	border: none;
	background-image:url(../images/logos/LunchWunchLogo254.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	border-radius:74px;
	transform:rotate(15deg);
	
}

#footerLeft p {
	color:#fff;
	padding-left:5%;
	padding-right:5%;
	font-size:14px;
	
}
#aitmadLogo {
	margin-top:5%;
	clear:both;
	height:100px;
	width:100%;
	border: none;
	background-image:url(../images/logos/aitmadLogo.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;

}

#contactForm {
	position:relative;
	float:left;
	text-align:center;
	top:0px;
	left:0px;
	height:100%;
	width:50%;
	background-color:#c42126;
	transition:all 1s ease-in-out;

}
	
#contactForm h2 {
	margin-top:5%;
	margin-bottom:4%;
	font-size:22px;
	line-height:10px;
	color:#ffcb00;
	
}
input[type=text], select, textarea {
  width: 70%;
  padding: 12px;
  font-size:16px;
  border: none;
  border-radius: 5px;
  box-sizing: border-box;
  margin-top: 3px;
  margin-bottom: 6px;
  resize: vertical;
  transition:all 1s ease-in-out;
}

input[type=submit] {
	width:70%;
	background-color: #ffcb00;
	font-size:20px;
	font-weight:bold;
	color: #b42126;
	padding: 12px 20px;
	border: none;
 	border-radius: 5px;
	cursor: pointer;
	transition:all 0.25s ease-in-out;

}

input[type=submit]:hover {
	background-color: #a42126;
	color:#fff;
}

#comingSoon {
	position: absolute;
	background-image:url(../images/coming_soon.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	background-trasparant: 50%;
	top: 30%;
	width: 100%;
	height: 500px;
}

#comingSoon h1{
	color:#fff;
	text-shadow:4px 6px 8px black;
	margin-top:15%;
	text-align:center;

}


@keyframes pocking {
	85% {
		left:68%;
		width:32%;

	}
}

@keyframes logoRevolve {
	50% {
	transform:rotate(15deg);
	}
	
}