body, html {
margin:0;
padding:0;
background:#20723d;
}

a:link{color:#ffffff;text-decoration:none;transition:.3s ease-out;}
a:visited{color:#ffffff;text-decoration:none;}
a:hover{color:#ffffff;text-decoration:none;opacity: 0.7;
  filter: alpha(opacity=70); /* For IE8 and earlier */}

a.white:link{color:#ffffff;text-decoration:none;}
a.white:visited{color:#ffffff;text-decoration:none;}
a.white:hover{color:#ffffff;text-decoration:none;}

a.green:link{color:#20723d;text-decoration:none;}
a.green:visited{color:#20723d;text-decoration:none;}
a.green:hover{color:#20723d;text-decoration:none;}

a.black:link{color:#000000;text-decoration:none;}
a.black:visited{color:#000000;text-decoration:none;}
a.black:hover{color:#000000;text-decoration:none;}

.skip-link {
position:absolute;
top:-100px;
  transform: translateY(-100%);
height:0;
}

.skip-link:focus-within {
position:absolute;
top:0px;
  transform: translateY(0%);
height:20px;
z-index:99999999999;
}

.whitebutton{
display:inline-block;
background:#ffffff;
color:#20723d;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-family: 'tomato';
font-size:1.4em;
line-height:1.4em;
letter-spacing:.07em;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.whitebutton:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

/* Smartphones (portrait and landscape) ----------- */
@media (min-width : 320px) and (max-width : 640px) {
/* Styles */

.mobilepadhome{
margin-top:88px;
}

.header {
  background-color:#ffffff;
  position: fixed;
  width: 100%;
  z-index: 1;
}

.header ul {
  margin: 0;
  padding: 0 0 0 0;
  list-style: none;
  overflow: hidden;
  background:#ffffff !important;

}

.header li a {
  display: block;
  padding: 5px 20px;
  border-right: 0;
  text-decoration: none;
  font-size:.9em;
  text-align:right;
  background:#ffffff !important;
font-family: 'tomato';
line-height:1.4em;
letter-spacing:.07em;
}

.header li a:hover,
.header .menu-btn:hover {
  background-color: #;
}

.header .logo {
  display: block;
  float: left;
  font-size: 1.3em;
  padding: 10px 20px;
  text-decoration: none;
}

/* menu */

.header .menu {
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
background:#ffffff;
}

/* menu icon */

.header .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 45px 20px 18px 20px;
  position: relative;
  user-select: none;
}

.header .menu-icon .navicon {
  background: #20723d;
  display: block;
  height: 2px;
  position: relative;
  transition: background .2s ease-out;
  width: 18px;
}

.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
  background: #20723d;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

.header .menu-icon .navicon:before {
  top: 5px;
}

.header .menu-icon .navicon:after {
  top: -5px;
}

/* menu btn */

.header .menu-btn {
  display: none;
}

.header .menu-btn:checked ~ .menu {
  max-height: 540px;
}

.header .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

.header .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.header .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}


.headsection{
display:none;
}

.navvright{
float:right;
position:relative;
right:0;
top:55px;
width:50%;
text-align:right;
padding:0 30px 0 0;
}

.toplogo{
width:200px;
float:left;
padding:30px;
}

.greenbutton{
display:inline-block;
background:#20723d;
color:#ffffff;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.greenbutton:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.whitebutton2{
display:inline-block;
background:#20723d;
color:#ffffff;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.whitebutton2:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.headimagecontain{
width:100%;
padding-top:90px;
background:#ffffff;
}

.headimagecontaintwo{
width:100%;
background-image:url('/img/head4.jpg');
background-size:100%;
background-repeat:no-repeat;
background-position:center center;
height:28vh;
}

.headimage1, .headimage3{
display:none;
}

.headimage2{
width:100%;
float:left;
}

.headspace{
display:none;
}

.maindescription{
background:#20723d;
position:relative;
top:-15px;
padding:40px 0;
text-align:center;
}

.mainsecondary{
background:#20723d;
position:relative;
padding:120px 0 40px;
text-align:center;
}

.boxcontainermob{
width:87%;
margin:0 5%;
}

.boxcontainerdesk{
display:none;
}

.box1, .box2, .box3, .box4{
width:100%;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
}

.boxm1{
width:100%;
background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),url('/img/takeout3.jpg');background-size:cover;background-position:center bottom;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
border:5px solid #ffffff;
}

.boxm2{
background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),url('/img/PBSCateringFront.jpg');background-size:cover;background-position:center center;
width:100%;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
border:5px solid #ffffff;
}

.boxm3{
background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),url('/img/slices4.jpg');background-size:cover;background-position:center center;
width:100%;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
border:5px solid #ffffff;
}

.boxm4{
background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),url('/img/gluten3.jpg');background-size:cover;background-position:center center;
width:100%;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
border:5px solid #ffffff;
}

.boxm5{
background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),url('/img/PlanParty2.jpg');background-size:cover;background-position:center center;
width:100%;
margin:0 0 30px 0;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
border:5px solid #ffffff;
}

.boxmtext{
padding:70px 0;
}

.tagline{
width:80%;
margin:40px 10% 10px 10%;
font-family: 'DIN Condensed';
font-size:1.2em;
letter-spacing:.09em;
color:#ffffff;
text-align:center;
}

.divider{
width:90%;
margin:0 5%;
}

.salphoto{
width:80%;
margin:0 10% 20px 10%;
border:7px solid #ffffff;
transform: rotate(4deg);
}

.salphoto2{
width:80%;
margin:0 10% 20px 10%;
border:7px solid #ffffff;
transform: rotate(4deg);
}

.menu1{
width:90%;
float:left;
margin:20px 5%;
}

.menu2{
width:90%;
float:left;
margin:20px 5%;
}

.footadd{
width:80%;
margin:30px 10% 20px 10%;
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
}

.ballyhoowhite{
position:relative;
top:0;
width:110px;
margin:20px auto 10px auto;
}

.location{
width:100%;
font-family: 'DIN Condensed';
font-size:.8em;
margin-bottom:10px;
}

.catermenu{
width:90%;
margin:0 5%;
}

.cta{
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
width:100%;
margin:50px auto 5px auto;
}

.break{
display:none;
}

.break2{
opacity:0;
clear:both;
}

}

/* iPads (portrait and landscape) ----------- */
@media (min-width : 640px) and (max-width : 1150px) {
/* Styles */

.mobnav{
display:none;
}

.headsection{
height:auto;
width:100%;
background:#20723d;
font-family: 'tomato';
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
overflow:auto;
}

.navvright{
float:right;
position:relative;
right:0;
top:55px;
width:70%;
text-align:right;
padding:0 30px 0 0;
}

.toplogo{
width:200px;
float:left;
padding:30px;
}

.greenbutton{
display:inline-block;
background:#20723d;
color:#ffffff;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.greenbutton:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.whitebutton2{
display:inline-block;
background:#20723d;
color:#ffffff;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.whitebutton2:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.headimagecontain{
width:100%;
background:#ffffff;
}

.headimagecontaintwo{
width:100%;
background-image:url('/img/head4.jpg');
background-size:100%;
background-repeat:no-repeat;
background-position:center center;
height:60vh;
}

.headimage1, .headimage3{
width:23.5%;
float:left;
}

.headimage2{
width:51%;
float:left;
}

.headspace{
width:1%;
float:left;
}

.maindescription{
background:#20723d;
position:relative;
top:-15px;
padding:40px 0;
text-align:center;
}

.mainsecondary{
background:#20723d;
position:relative;
top:-15px;
padding:40px 0;
text-align:center;
}

.boxcontainermob{
display:none;
}

.boxcontainerdesk{
width:85%;
margin:0 7.5%;
}

.box1, .box2, .box3, .box4{
width:20%;
display:inline-block;
margin:0 2%;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
vertical-align:top;
}

.tagline{
width:80%;
margin:60px 10% 40px 10%;
font-family: 'DIN Condensed';
font-size:1.2em;
letter-spacing:.09em;
color:#ffffff;
text-align:center;
}

.divider{
width:30%;
margin:0 35%;
}

.salphoto{
float:left;
width:20%;
border:7px solid #ffffff;
transform: rotate(-4deg);
margin:20px 30px 40px 0;
}

.salphoto2{
width:100%;
border:7px solid #ffffff;
transform: rotate(-4deg);
margin:0
}

  .flex-v-center {
    display:flex;
    align-items: center;
  }

.col-md-6 {
  border:0
}

.padleft{
padding-left:50px;
}

.menu1{
width:45%;
float:left;
margin:20px 0 40px 5%;
}

.menu2{
width:45%;
float:left;
margin:20px 5% 40px 0;
}

.footadd{
width:60%;
margin:60px 20%;
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
}

.ballyhoowhite{
position:relative;
top:0;
width:110px;
margin:20px auto 10px auto;
}

.location{
display:inline-block;
font-family: 'DIN Condensed';
font-size:.9em;
}

.catermenu{
width:70%;
margin:0 15%;
}

.cta{
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
width:100%;
margin:50px auto 5px auto;
}

.break{
display:inline-block;
width:30px;
text-align:center;
color:#ffffff;
font-family: 'DIN Condensed';
position:relative;
top:1px;
}

.break2{
display:inline-block;
width:30px;
text-align:center;
color:#ffffff;
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
position:relative;
top:1px;
}

}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1150px) {
/* Styles */

.mobnav{
display:none;
}

.headsection{
height:auto;
width:100%;
background:#20723d;
font-family: 'tomato';
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
overflow:auto;
}

.navvright{
float:right;
position:relative;
right:0;
top:55px;
width:70%;
text-align:right;
padding:0 30px 0 0;
}

.toplogo{
width:200px;
float:left;
padding:30px;
}

.greenbutton{
display:inline-block;
background:#20723d;
color:#ffffff;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
}

.greenbutton:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.whitebutton2{
display:inline-block;
background:#ffffff;
color:#20723d;
padding:10px 15px 8px 15px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
 opacity: 1;
filter: alpha(opacity=100);
  transition: 0.3s;
font-size:1em;
}

.whitebutton2:hover{
  opacity: 0.8;
filter: alpha(opacity=80);
}

.headimagecontain{
width:100%;
background:#ffffff;
}

.headimagecontaintwo{
width:100%;
background-image:url('/img/head4.jpg');
background-size:100%;
background-repeat:no-repeat;
background-position:center center;
height:60vh;
}

.headimage1, .headimage3{
width:23.5%;
float:left;
}

.headimage2{
width:51%;
float:left;
}

.headspace{
width:1%;
float:left;
}

.maindescription{
background:#20723d;
position:relative;
top:-15px;
padding:40px 0;
text-align:center;
}

.mainsecondary{
background:#20723d;
position:relative;
top:0;
padding:40px 0;
text-align:center;
}

.boxcontainermob{
display:none;
}

.boxcontainerdesk{
width:85%;
margin:0 7.5%;
}

.box1, .box2, .box3, .box4{
width:20%;
display:inline-block;
margin:0 2%;
color:#ffffff;
font-family: 'tomato';
text-align:center;
font-size:1.4em;
line-height:.8em;
letter-spacing:.07em;
vertical-align:top;
}

.tagline{
width:80%;
margin:60px 10% 40px 10%;
font-family: 'DIN Condensed';
font-size:1.2em;
letter-spacing:.09em;
color:#ffffff;
text-align:center;
}

.divider{
width:30%;
margin:0 35%;
}

.salphoto{
float:left;
width:20%;
border:7px solid #ffffff;
transform: rotate(-4deg);
margin:20px 30px 40px 0;
}

.salphoto2{
width:100%;
border:7px solid #ffffff;
transform: rotate(-4deg);
margin:0;
}

  .flex-v-center {
    display:flex;
    align-items: center;
  }

.col-md-6 {
  border:0
}

.padleft{
padding-left:50px;
}

.menu1{
width:45%;
float:left;
margin:20px 0 40px 5%;
}

.menu2{
width:45%;
float:left;
margin:20px 5% 40px 0;
}

.footadd{
width:60%;
margin:60px 20%;
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
}

.ballyhoowhite{
position:relative;
top:0;
width:110px;
margin:20px auto 10px auto;
}

.location{
display:inline-block;
font-family: 'DIN Condensed';
font-size:.9em;
}

.catermenu{
width:50%;
margin:0 25%;
}

.cta{
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
width:100%;
margin:50px auto 5px auto;
}

.break{
display:inline-block;
width:30px;
text-align:center;
color:#ffffff;
font-family: 'DIN Condensed';
position:relative;
top:1px;
}

.break2{
display:inline-block;
width:30px;
text-align:center;
color:#ffffff;
color:#ffffff;font-family: 'tomato';text-align:center;font-size:1.4em;line-height:1.4em;letter-spacing:.07em;
position:relative;
top:1px;
}

}