/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Playfair+Display:700,700italic);

@import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);

/*MOBILE*/
@media (max-width: 800px) and (min-width:500px) {
body{padding: 0; margin: 0; width: 100%;}

h3{font-family: 'Playfair Display', serif; font-size: 1em;letter-spacing: .15em; line-height: 2em; text-transform: uppercase; color: #FFF;}
h4{font-family: 'Playfair Display', serif; font-size: 1em;letter-spacing: .15em; line-height: 1.5em; text-transform: uppercase; color: #CCC; padding: 2%;}
p{font-family: 'Oswald', sans serif; font-size: 1.5em; color: #CCC; font-weight: 300; line-height: 2em;}
p a{text-decoration: none; color: #D44525;}
p span{color: #CCC;}

#map{position: relative; width: 100%;}
#map img{width: 100%; padding: 0; margin-left: 0; margin-right: 0;}

#title{margin-bottom: 3%; padding: 5%; text-align: center; text-transform: uppercase; font-family: 'Playfair Display', serif; font-size: 1.25em;letter-spacing: .15em; line-height: 1.5em; color: #FFF; background: url(../img/gray_flag_r.png) no-repeat; background-size: 100%;}

#hours{text-align: center; width: 100%; position: relative; z-index: 2; margin: 1%; margin-bottom: 3%; font-family: 'Oswald', sans serif; font-size: 1.5em; font-color: #A7A9AB; font-weight: 300; line-height: 1.25em;}

#addy{text-align: center; width: 100%; position: relative; z-index: 2; margin: 1%; margin-bottom: 3%; font-family: 'Oswald', sans serif; font-size: 1.5em; font-color: #A7A9AB; font-weight: 300; line-height: 1.25em;}

#about{width: 100%; position: relative; margin-top: 3%;}

#intro{position: relative; margin-top: 23%; background: #666;}
#intro h3{position: absolute; top: -3em; left: 0; z-index: 2; width: 90%; padding: 3%; margin-bottom: 3%; background: url(../img/orange_flag_l.png) no-repeat; background-size: 100%;}
#intro p{background: #666; display: inline-block; margin-left: 5%; margin-right: 5%; padding: 10%;}
#intro img{position: absolute; bottom: 0; right: 0; z-index: 2; width: 20%; background: #049DBF; margin-top: 2%;}

#process{position: relative; margin-top: 20%; background: #666;}
#process h3{position: absolute; top: -3em; right: 0; z-index: 2; width: 78%; padding: 3%; padding-left: 15%; margin-bottom: 3%; background: url(../img/green_flag_r.png) no-repeat; background-size: 100%;}
#process p{background: #666; display: inline-block; margin-left: 5%; margin-right: 5%; padding: 10%;}
#process img{position: absolute; bottom: 0; right: 0; z-index: 2; width: 20%; background: #BD902D; margin-top: 2%;}

#trucks{width: 100%; position: relative; margin-top: 20%;}
#trucks h3{font-size: 1em; position: absolute; top: -3em; left: 0; z-index: 4; width: 90%; padding: 3%; margin-bottom: 3%; background: url(../img/red_flag_l.png) no-repeat; background-size: 100%;}

#categories{position: relative; z-index: 3; background: #666; padding: 2%; padding-top: 10%;}
#categories ul{display: inline;}
#categories ul li{font-family: 'Oswald', sans serif; font-size: 1.5em; font-weight: 400; line-height: 2em; letter-spacing: .05em; text-transform: uppercase;  text-align: center; background: #666;}
#categories ul li a{text-decoration: none; color: #CCC;}
#categories ul li a:hover{border-bottom: thin solid #CCC;}

#lists{text-align: center; position: relative; z-index: 2; margin-top: 3%; margin-bottom: 3%; }
#lists ul{list-style: none; display: block; text-align: center;}
#lists ul li a{margin-top: 5%; text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #D44525; font-weight: 300; line-height: 2.255em;}
#lists ul li a:hover{border-bottom: thin solid #D44525;}
#lists img.icons{width: 10%; margin-left: 2%; padding-right: 2%;}
#lists h3{font-size: 1em; float: right; position: relative; z-index: 2; width: 90%; padding: 3%; margin-bottom: 3%; margin-top: 10%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

/*START jQuery mods content*/
#american ul{list-style: none; display: block; text-align: center;}
#american ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#american img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#american h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#asian ul{list-style: none; display: block; text-align: center;}
#asian ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#asian img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#asian h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#latin ul{list-style: none; display: block; text-align: center;}
#latin ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#latin img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#latin h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#european ul{list-style: none; display: block; text-align: center;}
#european ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#european img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#european h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#sandwich ul{list-style: none; display: block; text-align: center;}
#sandwich ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#sandwich img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#sandwich h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#dessert ul{list-style: none; display: block; text-align: center;}
#dessert ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#dessert img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#dessert h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

#combo ul{list-style: none; display: block; text-align: center;}
#combo ul li a{text-decoration: none; font-family: 'Oswald', sans serif; font-size: 2em; color: #666; font-weight: 300; line-height: 2.255em;}
#combo img.icons{width: 5%; margin-left: 2%; padding-right: 2%;}
#combo h3{float: right; position: relative; z-index: 2; width: 90%; padding: 3%; padding-left: 10%; margin-bottom: 3%; margin-top: 3%; margin-left: 50%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}

/*END jQuery mods*/

#legend{position: relative; margin-top: 20%; background: #666;}
#legend h3{font-size: 1em; position: absolute; top: -3em; left: 0; z-index: 2; width: 90%; padding: 3%; margin-bottom: 3%; background: url(../img/red_flag_l.png) no-repeat; background-size: 100%;}
#legend ul{background: #666; list-style-type: none; margin-left: 5%; margin-right: 5%; padding: 10%;}
#legend ul li{font-family: 'Oswald', sans serif; font-size: 1.25em; color: #CCC; font-weight: 400; line-height: 1.5em; letter-spacing: .05em; text-transform: uppercase; padding-bottom: 3%;}

img.icons{width: 8%; padding-right: 2%;}

#questions{width: 100%; position: relative; margin-top: 20%;}

#faq{position: relative; background: #666; padding-top: 10%; padding-bottom: 10%;}
#faq h3{position: absolute; top: -3em; right: 0; z-index: 2; width: 78%; padding: 3%; padding-left: 15%; margin-bottom: 3%; background: url(../img/blue_flag_r.png) no-repeat; background-size: 100%;}
#faq ul{list-style-type: none;}
#faq ul li{text-decoration: none; background: #666; display: inline-block; margin-left: 5%; margin-right: 5%;}
#faq img{position: absolute; bottom: 0; left: 0; z-index: 2; width: 20%; background: #f26a37;}

#directions{position: relative; margin-top: 20%; background: #666;}
#directions h3{position: absolute; top: -3em; left: 0; z-index: 2; width: 89%; padding: 3%; margin-bottom: 3%; background: url(../img/yellow_flag_l.png) no-repeat; background-size: 100%;}
#directions p{background: #666; display: inline-block; margin-left: 5%; margin-right: 5%; padding: 10%;}
#directions img{position: absolute; bottom: 0; right: 0; z-index: 2; width: 20%; background: #4C8C40; margin-top: 2%;}

#profiles{position: relative; width: 100%;}

.review{position: relative;}
.review h3{position: absolute; top: -3%; right: 0; z-index: 2; width: 80%; padding: 3%; padding-left: 10%; margin-bottom: 3%; background: url(../img/red_flag_r.png) no-repeat; background-size: 100%;}
.review p{background: #666; display: inline-block; margin-left: 5%; margin-right: 5%; padding: 10%;}

footer{position: relative; width: 100%; background: #666; margin-top: 20%;}
footer p{padding: 10%;}

.top{}