@charset "UTF-8";
/* CSS Document */

/*  -  -  -  -  - Global -  -  -  -  -  */
@import url(http://fonts.googleapis.com/css?family=Fjalla+One);
@import url(http://fonts.googleapis.com/css?family=Raleway:400,700);
@import url(http://fonts.googleapis.com/css?family=Vollkorn);

body {margin: 0;font-family: 'Raleway', sans-serif;}
a {text-decoration: none; color: #000;}
a img {border: 0;}
p {margin: 0;}
h1 {font-size: 36px;text-transform: uppercase;margin: 0;}
h2 {font-size: 28px;text-transform: uppercase;}
.c {clear:both;}


.section {
	width: 100%;
}

.content {
	margin: 0 auto;
	display: block;
	width: 80%;
	text-align: center;	
}

/*  -  -  -  -  - Section Navbar -  -  -  -  -  */
#secn {
	box-shadow: 0px 2px 0px rgba(0,0,0,0.3);
	transition: height 3s;
}

.navbar {
	background-color: rgba(255, 255, 255, 1.0);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
}

.cn {
	padding: 3px 0;
	width: 95%;
	text-align: left;
	margin-bottom: -19px;
	font-family: 'Fjalla One', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 18px;
}

.cn img.logo {
	margin: 0 25px;
	position: relative;
	width: 170px;
	left: 0;
	top: 0;
	transition: width 1s;
}

.mobilenav {display:none;}
.mobilenav a {color:#000;}

.mainnav {
	position: relative;
	bottom: 38px;
	margin-left: -20px;
	display: inline-block;
	width: 675px;
	transition: bottom 1000ms;
}

.mainnav li {
	display: inline;
	padding: 20px 10px;
}

.mainnav li a {
	color: #323232;
}

.mainnav li a:hover {
	color: #c52c23;
}

a#pull {
	display: none;
}		

.social {
	position: absolute;
	top: 12px;
	right: 15px;
	list-style-type: none;
	display: inline-block;
	transition: top 1000ms;
}


.social li {
	background-image: url(assets/social.png);
	line-height: 32px;
	width: 32px;
	height: 32px;
	background-position: 0px -32px;
    background-repeat: no-repeat;
    display: inline-block;
}

.social li:hover {
	cursor: pointer;
	opacity: 0.8;
	
}

.social li a {
	display: inline-block;
	height: 32px;
	width: 32px;
}


.social li.fb {background-position: 0px -32px;}
.social li.tw {background-position: 0px -288px;}
.social li.in {background-position: 0px -160px;}

/*  -  -  -  -  - Section Infobox -  -  -  -  -  */

.infobox {
	position: fixed;
	top: 75px;
	right: 25px;
	z-index: 100;
	width: 300px;
	background-color: #18c87b;
	padding: 10px;
	text-align: center;
	box-shadow: 3px 3px 3px rgba(0,0,0,.4);
}

.infobox h1 {
	font-size: 24px;
	padding-bottom: 6px;
	border-bottom: 1px solid rgba(0,0,0,0.4);
}

.infobox h2 {
	font-size: 15px;
	text-transform: none;
}

.infobox p {
	font-size: 13px;
}

.infobox a {
	background-color: #fbff5e;
	box-shadow: 0 4px 0 0 #9c9e21;
	border-radius: 5px;
	font-size: 19px;
	font-weight: bold;
	padding: 10px;
	display: inline-block;
	text-decoration: none;
	margin: 15px 0;
}

.infobox a:active {
	box-shadow: 0 3px 0 0 #9c9e21;
	margin: 17px 0 13px 0;
}

.openclose {
	font-size: 18px;
	font-weight: bold;
	position: absolute;
	width: 10px;
	top: 0px;
	right: 12px;
	cursor: pointer;
}

.noinfo {
	display: none;
}

.changewidth {
	width: 6px;
}

.rotater {
	-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
    top: -2px;
	right: 9px;
}

/*  -  -  -  -  - Section 1 -  -  -  -  -  */

.one {
	background: url(assets/pizzatest.jpg) no-repeat top center; 
	background-size: cover;
	background-attachment: fixed;
}

.logo-large {
	margin-bottom: 15px;
}

.one h1, .one h2 {
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,.9);
	font-family: 'Fjalla One', sans-serif;
}

.c1 {
	padding: 220px 0 240px 0;

}


/*  -  -  -  -  - Section 2 -  -  -  -  -  */

.two {
	background-color: #a9251e;
    background-image: linear-gradient(90deg, #b32f28 50%, #a9251e 50%, #a9251e);
}


.c2 {
	padding: 15px 0 45px 0;
	color: #fff;
	max-width: 1150px;
}

.c2 ul {

}

.c2 li {
	display: inline;
	list-style-type: none;
	margin: 0 3%;
	float: left;
	width: 25%;
	font-size: 18px;
}

.menu {
	background-color: #fbfbfb;
	position: relative;
	padding: 2em 1.5em;
	color: #000;
	-webkit-box-shadow: -3px 4px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: -3px 4px 0px rgba(0,0,0,0.3);
    box-shadow: -3px 4px 0px rgba(0,0,0,0.3);
    overflow: hidden;
}

.menu:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	border-width: 0 70px 70px 0;
	border-style: solid;
	border-color: #a9251e #a9251e #fbfbfb #fbfbfb;
	background: #fbfbfb;
	display: block;
	width: 0;
	-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.3), -1px 2px 2px rgba(0,0,0,0.4);
    -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.3), -1px 2px 2px rgba(0,0,0,0.4);
    box-shadow: 0 2px 2px rgba(0,0,0,0.3), -1px 2px 2px rgba(0,0,0,0.4);
}

.square {
	width: 260px;
	margin: 20px auto;
	display: block;
}

.menu img {
	display: block;
	margin: 0 auto;
}

.menu h2, .menu h3 {
	font-family: 'Fjalla One', sans-serif;
}

.menu h2 {
	margin: 35px auto 20px auto;
}

.menu h2.title {
	margin: 10px auto 25px auto;
}

.regular li {
	display: block;
	margin: 0 auto;
}

.menu p {
	margin: 15px;
	font-size: 18px;
}

.menu p.pdf {
	position: absolute;
	top: 42px;
	font-size: 19px;
	right: 29px;
	font-weight: bold;
	margin: 0;
}

.menu p.pdf a {
	text-decoration: none;
}

#toppings {
	height: 125px;
	width: 80%;
	margin: 0 auto;
}

.menu span {
	font-style: italic;
	font-size: .9em;
	font-weight: normal;
}

.menu a {
	text-decoration: underline;
}

#specialties {
	margin-top: 40px;
}

#specialties li {
	float: none;
	margin: 0 0 30px 0;
	display: block;
	width: 100%;
	font-weight: bold;
}

img.margherita {
	float: right;
	margin: -20px 50px 0 -40px;
	border: 5px solid rgba(239,236,46,0.5);
}

img.caprese {
	float:left;
	margin: 10px 10px 0 40px;
	border: 5px solid rgba(239,236,46,0.5);
}

.highlight {
	background-color: rgba(239,236,46,0.5);
	padding: 3px 5px;
}


/*  -  -  -  -  - Section 3 -  -  -  -  -  */

.three {
    background-color: #fff;
	box-shadow: -10px 0px 25px black;
	z-index: 10;
	position: relative;
}

.c3 {
	padding: 50px 0;
}

.c3 img {
	margin: 0 50px 35px 50px;
}

.intro {
	font-size: 22px;
	width: 100%;
}


/*  -  -  -  -  - Section 4 -  -  -  -  -  */
.four {
	background-color: #000;
	border-top: 25px solid #000;
	border-bottom: 25px solid #000;
	display: none;
}
.c4 {
	
}

.caption p {
	color: #fff;
	background-color: rgba(0,0,0,.7);
	padding: 5px;
	width: 200px;
	margin: 0 auto;
	text-align: left;
	font-weight: bold;
	position: relative;
	bottom: 70px;
	left: -20%;
}

.video-container {
    position: relative;
    padding-bottom: 50%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

}



/*  -  -  -  -  - Section 5 -  -  -  -  -  */

.five {
	background-image: url(assets/map-background.jpg);
}

.c5 {
	padding: 240px 0;
}

.visitbox {
	width: 300px;
	position: relative;
	left: 5%;
	background-color: #b5e0c3;
	border: 5px solid #fff;
	box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	padding: 10px;

}

.visitbox h2 {
	font-size: 22px;
	margin-top: -3px;

}

/*  -  -  -  -  - Section 6 -  -  -  -  -  */

.six {
	/*background-color: #1c2135;*/
	background: linear-gradient(rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.3)), url(assets/theoven.jpg) no-repeat top center; 
	background-size: cover;
	background-attachment: fixed;
	
}
.c6 {
	padding: 15px 0;
	width: 960px;
}

.c6 h2.news {
	color: #fff;
	text-shadow: 4px 4px 8px rgba(0,0,0,0.7);
}

.c6 article {
  background-color: #fbfbf8;
  width: 280px;
  height: 400px;
  padding: 10px;
  margin: 10px;
  box-shadow: 2px 2px 3px rgba(0,0,0,.3);
  float: left;
}

.c6 article h2 {
  font-family: 'Fjalla One', sans-serif;
  text-transform: uppercase;
  padding: 0 10px;
  margin: 10px 0;
  text-align: center;
  font-size: 20px;
}

.c6 article h2 span.storydate {
  font-family: 'Fjalla One', sans-serif;
  font-size: 14px;
  position: relative;
  top: 0;
  right: 0;
}

.c6 article p {
  font-family: 'Vollkorn', sans-serif;
  padding: 0 10px;
  margin: 5px 0;
}

.c6 article img {
  width: 280px;
}

.c6 article a {
  color: #fff;
  text-transform: uppercase;
  background-color: #b32f28;
  padding: 2px 4px 1px 4px;
  font-size: 12px;
  font-family: 'Fjalla One', sans-serif;
}



/*  -  -  -  -  - Section 7 -  -  -  -  -  */

.seven {
	background-color: #fff;

}
.c7 {
	padding: 30px 0;
}

.c7 h1 {
	color: #fff;
}

#contactsection {
	margin: 0 auto; 
	float: left;
}

.form {
  padding: 0 0 35px 0;
  margin: 20px;
  border: 1px solid #aaa;
  background: #eee;
  width: 540px; 
}

.form {margin-bottom: 0;}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
  border: 0;
  outline: 0;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input[type='text'], input[type='tel'], input[type='email'], input[type='submit'] {
  width: 160px;
  padding: 10px 10px 12px 60px;
  font-size: 12px;
  color: #555;
  border: 1px solid #aaa;
  background-color: #fff;
}

input[type='submit'] {
  cursor:pointer;
  margin: 10px 32px 12px 40px;
  padding: 10px 0 12px 10px;
  width: 160px;
}

.field {
  display: inline-block;
  position: relative;
  margin: 15px 5px 0 0;
}

.field input {
  transition: .1s all linear;
}

.field label {
  position: absolute;
  top: 13px;
  left: 15px;
  font-size: 12px;
  color: #aaa;
  transition: .1s all linear;
  cursor: text;
}

.contactform .field.active input {
  padding-left: 15px;
  margin-left: 0px;
  width: 205px;
}

.contactform .field.active input[type='submit'] {
  padding-left: 0px;
  margin: 0 12px;
  width: 205px;
}

.contactform .field.active label {
  top: -15px;
  left: 0;
  padding: 3px 5px;
  font-size: 10px;
  color: #fff;
  background: #aaa;
}

.contactform .field.active input#additionalinfo {
  padding-left: 15px;
  margin-left: 0px;
  width: 205px;
}

.contactinfo {
	float: right;
	/*width: 425px;*/
    width: -webkit-calc(100% - 600px);
    width: -moz-calc(100% - 600px);
    width: calc(100% - 600px);
	text-align: left;
	margin: 0 auto;
}

.contactinfo h2 {
	
}
.contactinfo p {
	
}


/*  -  -  -  -  - Section 8 -  -  -  -  -  */

.eight {
	background: url(assets/foodtrucktest.jpg) no-repeat top center; 
	background-size: cover;
	background-attachment: fixed;
}

.c8 {
	padding: 180px 0;
}



/*  -  -  -  -  - Section Footer -  -  -  -  -  */

.footer {
	background-color: #fff;

}
.cf {
	padding: 10px 0;
}

.cf p {
	color: #000;
	font-size: 14px;
}

.cf a {
	color: #000;
	text-decoration: underline;
}

.break {
	display: none;
}

.nobreak {
	display: inline;
	letter-spacing: -3px;
}

/*  -  -  -  -  - Responsive Stuff -  -  -  -  -  */

@media only screen and (min-width: 1650px) {
	.c1 {padding: 180px 0 290px 0;}
}

@media only screen and (max-width: 1280px) {
	img.margherita {float:none; margin:0 auto;}
	menu p.linkpic2 {margin: 0 15px;}
	.c7 {width: 95%;}
	
}

@media only screen and (max-width: 1160px) {
	.c7 {padding: 65px 0;}
	#contactsection, .contactinfo {float:none;}
	.contactinfo {margin: 60px auto 30px auto; width: 80%; text-align: center;}
	.form {margin: 20px auto;}
}

@media only screen and (max-width: 1070px) {
	.mainnav {font-size:16px;}
}

@media only screen and (max-width: 1000px) {
	.mainnav {display: none;}
	.social  {display: none;}
	.cn {text-align:center;height:79px;width:100%;}
	.cn img.logo {width: 120px;}
	
	.mobilenav {
		height: auto;
		width: 100%;
		/*margin: 25px 0 56px -40px;*/
		padding: 10px 0;
		background-color: #fff;
		margin-top: 0;
	}

	.mobilenav li {  
        display: block;    
   		padding: 15px;	
   		text-align: center;
   		color: #fff;
   		border-bottom: 1px solid rgba(255,255,255,0.2);  
    }  
    
    .mobilenav li:nth-child(1) {  
   		border-top: 1px solid rgba(255,255,255,0.2);  
    }

	a#pull {
		display: block;  
        width: 100%;  
        position: relative;
    }

    a#pull:after {  
        content:"";  
        background: url('assets/menu-black.png') no-repeat;  
        width: 24px;  
        height: 24px;  
        display: inline-block;  
        position: absolute;  
        bottom: 21px;
        right: 25px;
    } 

    .one {margin-top: 50px;}
	.c1 {padding: 190px 0 270px 0;} 
	.c6 { width: 780px;}
    .c6 article { width: 220px;}
    .c6 article img { width: 220px;}
} 


@media only screen and (max-width: 980px) {
	img.caprese {float:none; margin:15px auto;}
	#specialties {margin-top: 0;padding-left:0;}
}

@media only screen and (max-width: 850px) {
	.navbar {background-color: #fff;}
	
    .infobox {display: none;}
    .cn {margin-bottom:-3px;height:64px;}

	.c1 {padding: 100px 0 80px 0;}

    .c2 {padding: 15px 0 45px 0;}
    .c2 li {float: none; width: auto;display: block;}
    #toppings {height: auto;padding-left: 0;}

	.c5 {padding: 80px 0 190px 0;}
	.five {background-image: url(assets/map-background-small.jpg);}
	.visitbox {width: 100%;left:0%;}

	.c6 {width: 520px;}
	#contactform {height:500px;}
}

@media only screen and (max-width: 750px) {
	.intro {width:100%;}
	.c3 {width:80%;}
	.c3 img {margin: 0 35px 35px 35px;width: 75px;}
	.visitbox h2 {font-size: 19px;}
	.c5 {padding: 70px 0 190px 0;}
	.eight {background: url(assets/foodtruck-small.jpg) no-repeat top center;}
}

@media only screen and (max-width: 650px) {
	.one {background: url(assets/pizzatest-small.jpg) no-repeat top center;}
	.form {width: 300px;}
	.form h2 {font-size: 20px;}
}

@media only screen and (max-width: 550px) {
	.c3 {width: 90%;}
    .c3 img {margin: 0 15px 35px 15px; width: 60px;}
	.c6 { width: 260px;}
}

@media only screen and (max-width: 480px) {
	h1 {font-size: 32px;}
	h2 {font-size: 24px;}

	.c1 {padding: 80px 0 130px 0;}

	.c2 li {
		display: block;
		float: none;
	}
	img.caprese {width: 200px;}
	img.margherita {width: 200px;}

	.five {background-image: url(assets/map-background-smaller.jpg);}
	.visitbox {width:90%;left:0%;}
	.visitbox h2 {display:none;}
	.c5 {padding: 65px 0 200px 0;}

	.c7 h1 {font-size:26px;}
	
	.break {display:inline;}
	.nobreak {display:none;}
	
	p {font-size: 17px;}
	.six {background-image: none; background-color: #000; }
	.c6 article {height: 440px;}
}

@media only screen and (max-width: 350px) {
	.c2 {width: 95%;}
	.menu img {margin-top: 20px;}
	.menu img.menulogo {margin-top:-15px;}
	.menu:before {border-width: 0 50px 50px 0;}
	.menu p.pdf {top: 29px;font-size: 15px;right: 20px;}
	.c5 {padding: 80px 0 200px 0;}
	.five {background-image: url(assets/map-background-smallest.jpg);}
	.c6 {width: 320px;}
	.c6 article { width: 280px;}
    .c6 article img { width: 280px;}
	.eight {background-image: url(assets/foodtruck-smallest.jpg);}
	.c8 {padding: 95px 0;}
	
}


@media only screen and (min-width: 850px) {
	.mainnav-shrink {bottom: 23px;}
	.social-shrink {top: 1px;}
	.cn img.logo-shrink {width: 120px;}
	.navbar-shrink {background-color: rgba(255, 255, 255, 0.9);}
}