/*
Theme Name: Five Points Pizza
Description: A Snapshot Interactive website.
Author: Snapshot Interactive
*/

/* layout */

a, img {border:none; }
.more-link{
	white-space: nowrap;
}

p.attribution{
	text-align: right;
}

article.post{
	margin-bottom: 18px;
	border-bottom: 1px solid #E6E6E6;
}

header .menu-action {
    float: left;
    margin-top: 0;
    position: absolute;
    top: 1px;
    right: 20px;
}

header .menu-action .button.small {
    padding: 8px;
}

header .menu-action .button.small svg {
    opacity: 0.5;
}

.mobile-nav-container{
	margin-left: -100%;
	float: left;
	width: 50%;
	position: absolute;
	top: 100px;
}


.active .mobile-nav-container{
    display: block;
    width: 100%;
    margin-left: -15px;
    height: 100%;
}

.active #main{

}

.mobile-nav-container,
#main{
	-moz-transition: all 0.25s ease-in 0s;
}

.side-nav{
        background-color: rgba(0,0,0,0.9);
        height: 100%;
}

ul.tabs.vertical {
    height: auto;
}

ul.tabs {
    display: block;
    height: 40px;
    margin-bottom: 20px;
    padding: 20px 0;
}

ul.tabs.vertical li {

}

ul.tabs.vertical li, ul.tabs.vertical li {
    float: none;
    height: auto;
}

ul.tabs li:first-child {
    margin-left: 0;
}

ul.tabs li {
    display: block;
    float: left;
    margin: 0;
    padding: 0;
}

ul.tabs.vertical li a {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    color: white;
    display: block;
    font-size: 24px;
    height: auto;
    line-height: 1;
    padding: 15px 20px;
    text-transform: uppercase;
}

ul.tabs li a {
    display: block;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    padding: 0 23.8px;
}

/* typography */
h1, h2, h3, h4, h5, h6{
    font-family: 'Roboto Slab', serif; font-weight: 700;
}

h1, h2 {
	font-weight: 700; text-transform:uppercase;
}

h3 {
	font-weight: 700;
}

/* INFO SECTION */



.siteinfo h1{ font-weight: 800; }

#gift-cards-info {
    background: url('images/blackandwhite.jpg');
    height: 150px;
    width: 100%;
    max-width: 450px;
    margin-bottom: 20px;
    margin-top: 30px;
}

#gift-cards-info a, #donations-info a, #employment-info a {
    margin-top: 100px;
    border: solid black 1px;
    margin-right: 5px;
}

#donations-info {
    background: url('images/pizza.jpg');
    height: 150px;
    width: 100%;
    max-width: 450px;
    margin-bottom: 20px;
}

#employment-info {
    background: url('images/five_points_employment.jpg');
    height: 150px;
    width: 100%;
    max-width: 450px;
}
#CDSWIDCOE {
	margin:0 auto !important;
}


/* post styling */

#main p.meta{
	font-style: italic;
	color: #808080;
}

div[id*='attachment_']{
	max-width: 100%;
	height: 100%;
}

#main article img{
}

.center {
	text-align: center;
}

h1.single-title{
	line-height: 1.1;
}

img.alignleft{
	margin-right: 10px;
	float: left;
}

img.alignright{
	margin-left: 10px;
	float: right;
}

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

p.tags a:hover{
	color: #f0f0f0;
}

video {
	max-width: 100%;
	height: auto;
}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	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%;
}

.video-wrapper {
	width: 630px;
	max-width: 100%;
	margin-bottom: 18px;
}

pre {
    background-color: #F5F5F5;
    border: 1px solid rgba(0, 0, 0, 0.15);
    display: block;
    font-size: 12px;
    line-height: 18px;
    margin: 0 0 18px;
    padding: 8.5px;
    white-space: pre-wrap;
    word-wrap: break-word;
}

code {
    color: rgba(0, 0, 0, 0.75);
    padding: 1px 3px;
}

code, pre {
    font-family: Monaco,Andale Mono,Courier New,monospace;
    font-size: 12px;
	padding: 5px 15px;
}

/* featured posts slider */
#featured{
	border: 1px solid #E6E6E6;
}

#featured div{
	padding: 0 15px;
}

#featured h3{
	margin-top: .2em;
	padding-left: .05em;
}

#featured p{
	padding-left: .1em;
}

#featured h3,
#featured p{
	width: 100%;
}

/* page styling */

.page-template-page-homepage-php #main {
	border-bottom: none;
}

/* comments */

#comments{
	line-height: 3.1rem;
	margin-bottom: 18px;
}

ol.commentlist,
ol.commentlist ul.children{
	list-style-type: none;
	margin-left: 0;
}

ol.commentlist div.avatar{
	float: left;
	margin-right: 10px;
}

ol.commentlist time{
	font-size: .8em;
	color: #eeeeee;
}

ol.commentlist div.comment-author{
	position: relative;
}

.panel ol.commentlist a.comment-edit-link{
	color: #ffffff;
	text-decoration: none;
}

ol.commentlist span.edit-comment{
	position: absolute;
	right: 1.5em;
	top: 0;
}

.comment h4{
	margin-bottom: 0;
}

a.comment-reply-link{
	position: absolute;
	right: 1.5em;
	bottom: 0;
}

#cancel-comment-reply{
	padding-left: 20px;
}

#comment-nav ul{
	list-style-type: none;
	margin: 0;
}

#comment-form-elements{
	list-style-type: none;
	margin: 0;
}

/* specific post-type styles */

/* image attachment */

.attachment #main .post_content img{
	max-width: 100%;
}

li.next{
	text-align: right;
}

#sidebar1 .metadata,
#sidebar1 .caption{
	padding-bottom: 20px;
}

/* widget styles */

.widget{
	margin-bottom: 18px;
}

.widget li{
	margin-bottom: 2px;
}

.widget ul.children{
	margin-bottom: 0;
}

.widget ul.children li{
	margin-left: 9px;
}

#tag-cloud{
	margin-bottom: 18px;
}

a[class^='tag-link-']:hover{
	color: #f0f0f0;
}

@media only screen and (min-width: 768px) {
	ol.commentlist div.avatar{
		margin-right: 0;
	}

	#main{
		border-bottom: none;
	}

	#featured h3{
		margin-top: 2em;
		padding-left: 2em;
	}

	#featured p{
		padding-left: 4em;
	}

	#featured h3,
	#featured p{
		width: 66%;
	}
	a[href^=tel] {
	        pointer-events: none;
	}
}

@media only screen and (min-width: 940px) {
	/* desktop specific styles */

	#main{
		margin-bottom: 0;
	}

	ol.commentlist div.avatar{
		margin-right: 0;
	}

}

/******************************************
* :SETUP
******************************************/
body {
	background: url(images/background.jpg) repeat;
}

.container {

}

h1 {
	font-size: 33px;
	color: #43484b;
}

article h1 {
    margin-left: 30px;
}

h2 {
	font-size: 24px;
	color: #43484b;
}

h3 {
	color: #43484b;
	font-size:20px;
}

span.price, h3 span.price, h3 strong{
	color: #f79221;
	font-size: 20px;
}

.date {
	color: #f79221;
	text-transform:uppercase;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	line-height: 2;
}

span.location {
	font-size:16px;
	text-align: right;
	display: inherit;
	margin-top: -34px;
	color: #ff9820;
	font-family: 'Roboto Slab', serif;
	font-weight:900;
}

span.gift-cards {
	line-height: 2;
}

.gift-cards a {
	text-decoration:underline;
	color: #ff8800;
}



p {
	margin-bottom: 10px;
	color: #43484b;
}

em {
	font-weight:700;
}

/* permanent fancy-box arrow navigation */
.fancybox-nav span {
  visibility: visible !important;
}

/******************************************
* :HEADER
******************************************/

#top-nav-links {
	height: 35px;
	color:	#f4f1ea;
	font-family: 'Roboto Slab', serif;
	font-size:14px;
	line-height:35px;
	font-weight: 600;
}

#top-nav-links span {
    opacity: .5;
    margin: 0 4px;
}

#top-nav-links a, #top-nav-links a:active, #top-nav-links a:focus, #top-nav-links a:visited {
	color: #f79221;
}

#top-nav-links a:active {
	color: #df8118;
}

#top-nav-links a img {
    margin-bottom: -10px;
}

#top-nav-links .twelve {
    display: none;
    text-align: center;
}

#top-nav-container {
    background-color: black;
}

/* Floats text right on the top header nav*/
#top-nav-links div:nth-child(2) {
    text-align: right;
}

.nav-bar {
    background: none;
    font-family: 'Raleway', sans-serif;
    text-transform:uppercase;
}

.nav-bar > li {
    border: none;
    float: none;
    display: inline-block;
    margin-top: 18px;
}

.nav-bar > li > a:before {
	content: "♦";
	position:absolute;
	margin-right: 10px;
	font-size:7px;
	margin-left: -20px;
	color: #f62629;
	transition:0.3s;
        -webkit-transition: 0.3s;
}

.nav-bar > li > a:hover:before {
	font-size:14px;
	margin-left:-20px;
}

.nav-bar > li > a:after {
	content: "♦";
	position:absolute;
	margin-left: 13px;
	font-size:7px;
	color: #f62629;
	transition: 0.3s;
        -webkit-transition: 0.3s;
}

.nav-bar > li > a:hover:after {
	font-size:14px;
	margin-left: 6px;
}

@-moz-document url-prefix() {
	.nav-bar > li > a:hover:after {
		margin-left: 10px;
	}
}

.flyout > li > a:hover:before {
	content: "♦";
	position:absolute;
	margin-left: -28px;
	margin-top:4px;
	font-size:7px;
	color: #f62629;
}

.flyout > li > a:hover:after {
	content: "♦";
	position:absolute;
	margin-left: 20px;
	margin-top:4px;
	font-size:7px;
	color: #f62629;
}

.nav-bar > li > a:first-child {
	font-size:16px;
	color: black;
	border-top: 1px solid #989692;
	border-bottom: 1px solid #989692;
	margin: 0 10px;
}

.nav-bar > li:last-child > a:first-child {
	margin-right: 0;
}

/*.nav-bar > li:nth-child(2) {
	margin-right: 20%;
}*/

.nav-bar > li > a:Active, .nav-bar > li > a:hover, .flyout > li a:hover {
	color:#f15626;
}

.nav-bar > li:last-child {
	border-right: none;
}

.nav-bar > li:hover {
  background: none;
}

#top-header {
	height: 100px;
}

.siteinfo {
	text-align: left;
	width: 100%;
	display: inline-block;
	position: absolute;
}

.siteinfo #logo img {
	margin-left: 24px;
	transition: .5s;
        -webkit-transition: .5s;
}

.siteinfo #logo img:hover {
transform: rotate(360deg);
-ms-transform: rotate(360deg); /* IE 9 */
-webkit-transform: rotate(360deg); /* Safari and Chrome */

}

.siteinfo h1 {
	margin-top: -6px;
}



ul#menu-main-navigation-menu {
	text-align: right;
}

ul#menu-main-navigation-menu .has-flyout {
	text-align: center;
}


.nav-bar > li.has-flyout > a.flyout-toggle {
	display: none;
}

ul.flyout > li:first-child {
	margin-top:20px;
}

ul.flyout > li:last-child {
	padding-bottom:10px;
}

ul.flyout > li:first-child a {
	border-top: 1px solid #989692;
}

ul.flyout {
	background: url(images/background.jpg) repeat;
}

ul.flyout > li {
	background: url(images/background.jpg) repeat;
}

ul.flyout li a {
	font-size:14px;
	color: black;

	border-bottom: 1px solid #989692;
	margin: 0 8px;
}

.siteinfo img#logo-background {
	margin-top: -16px;
}

.header-main-nav-wrapper {
	-moz-box-shadow: 0px 0px 18px #444;
	-webkit-box-shadow: 0px 0px 18px #444;
	box-shadow: 0px 0px 18px #444;
}

#abs-header{
	position:fixed;
	margin: 0 auto;
	width: 100%;
	background: url(images/background.jpg) repeat;
         z-index:15;
}

section {
	padding-top: 40px;
}
section#home {
	padding-top: 156px;
}
@media only screen and (max-width: 768px) {
    .header-social {
        display: none;
    }
    #top-nav-links {
	    text-align: center;
    }
}

/******************************************
* :CONTENT
******************************************/
.post-wrapper {
	border-bottom: solid 1px #e1dfd9;
	padding-top:10px;
}

.post-wrapper:last-child {
	border-bottom: none;
}

#contact-wrapper {
	/*background: url(images/contact.png) no-repeat;
	min-height:895px;
	background-position:center; */
}

.contact-container {
	height: 644px;
	width: 484px;
	padding: 25px;
	background-color: rgba(45,45,45, .95);
	border-radius: 5px;
	margin-top: 125px;
}

.contact-right {
	color: white;
	text-align: right;
	float: right;
}

.contact-right:after {
	clear:both;
}

.hours-location {
	color: white;
}

.location-button-container {
	display: block;
	float: right;
	margin-top: 45px;
}

.maps-image {
	position: absolute;
	margin-left: -29px;
	margin-top: -36px;
}

.download-menu {
    float: right;
    background-color: #ede8dd;
    padding: 12px 20px;
    color: #bab4a5;
    font-weight: 700;
    border: 1px solid #ccc;
    transition: 0.5s;
    -webkit-transition: .5s;
}

.download-menu:after {
    clear: both;
}

.download-menu:hover {
    	color: white;
	background: #f06f46;
        border-color: black;
}

/* AWARDS STYLES */

.awardsimg {
	padding-top: 15px;
	padding-bottom: 15px;
}




.maps-button {
	color: white;
	background: #f06f46;
	padding: 13px;
	border-radius: 3px;
	background-image: linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -o-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -moz-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -webkit-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -ms-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	/*ie gradient*/
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f06f46', endColorstr='#f0501e');
	float: right;
	margin-top: -39px;
	display: block;
	font-family: 'Raleway', sans-serif;
	font-size:14px;
	text-transform:uppercase;
	transition: .2s;
        -webkit-transition: .2s;
}

a.maps-button:hover {
    color: #fff;
    background-image: linear-gradient(top, #cc5028 0%, #cb3000 100%);
    background-image: -o-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -moz-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -webkit-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -ms-linear-gradient(top, #cc5028 0%, #cb3000 100%);
}

section#gallery img {
	width: 118px;
	height: 118px;
	margin-right:20px;
	margin-bottom:20px;
	transition: .5s;
        -webkit-transition: .5s;
}

section#gallery img:hover {
	transform: scale(1,5,1.5);
	-ms-transform: scale(1.5,1.5); /* IE 9 */
	-moz-transform: scale(1.5,1.5);
	-webkit-transform: scale(1.5,1.5); /* Safari and Chrome */
}

.closed {
    font-size: 14px;
}

.closed:before, .closed:after {
    content: '*';
    font-size:20px;
}

section#gallery a:nth-child(7n + 8) img {
	margin-right:0;
}

section#pizza-menu {
    padding-top: 50px;
}
#media-press {
	/*overflow: scroll;*/
	/*height: 500px;*/
}

#media-press img {
	margin-top: 10px;
	transition: .5s;
        -webkit-transition: .5s;
}

#media-press h3 {
	transition: .2s;
        -webkit-transition: 0.2s;
}

#media-press h3:hover {
	text-decoration:underline;
	font-size:28px;
}

#media-press img:hover {
	transform: scale(1,2,1.2);
	-ms-transform: scale(1.2,1.2); /* IE 9 */
	-moz-transform: scale(1.2,1.2);
	-webkit-transform: scale(1.2,1.2); /* Safari and Chrome */
}

#media-press h3 {
	/*line-height: 0;
	margin-top: 24px;*/
        margin: 0;
        line-height:1.25;
}
.TA_award {
	text-align:center;
	margin:0 0 0px;
}
.awards-logo-container {
	text-align: center;
}

.awards-logo-container .columns {
	width: 33%;
}

.awards-logo-container .columns a.award-logo {
	text-align: center;
	width: 100%;
}

.award-logo img {
	max-height: 80px;
	margin-bottom: 20px;
}

.awards-logo-container .columns p {
	font-weight: 600;
}

.TA_award:before {
	content:'';
	display:inline-block;
	vertical-align:middle;
	height:100%;
}
.TA_award > div {
   display:inline-block !important;
	vertical-align:middle;
}

.wpcf7-submit {
	float: right;
	color: white;
	background: black;
	height: 40px;
	width: 125px;
	font-family: 'Raleway', sans-serif;
	font-size: 18px;
	border-radius: 5px;
	border: white 1px solid;
	cursor: pointer;
	transition: .5s;
        -webkit-transition: .5s;
}
.wpcf7-submit:hover {
	font-size:24px;
}

.wpcf7-response-output {
    background-color: white;
}

.opener {
	cursor: pointer;
}

span.contact-span {
	text-transform:uppercase;
	font-size: 18px;
	color: white;
	font-family: 'Raleway', sans-serif;
	line-height: 2;
}

.logo-contact {
	font-family: 'Raleway', sans-serif;
}

.logo-contact span.contact-span {
	line-height: 1;
}

span.phone-number {
	color: #f89320;
	font-size:18px;
	line-height: 2;
}

.hours-location {
	font-family: 'Raleway', sans-serif;
	margin-top: 12px;
}

#map_canvas{
    position: absolute;
    width: 100%;
    height: 895px;
}

/* POPUP BOX */
.ui-dialog-title {
	font-family: 'Roboto Slab', serif; font-weight: 700;
	color: #43484b;
	font-size:20px;
}

.ui-widget-content {
	background: url(images/background.jpg) repeat;
}

.ui-widget-content p {
	font-family: 'Roboto Slab', serif; font-weight: 700;

}



/* SCROLL BOX ON PHONES */

.scroll-box a {
    display: none;
	position: fixed;
	font-size: 24px;
	width: 120px;
	margin-left: -130px;
	margin-top: -50px;
	height: 34px;
	padding: 4px;
	left: 100%;
	z-index: 9999999;
	top: 100%;
	background-color: rgba(255,255,255, .8);
	border-radius: 3px;
}

.view-more-button {
	color: white;
	background: #f06f46;
	padding: 13px;
	border-radius: 3px;
	background-image: linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -o-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -moz-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -webkit-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	background-image: -ms-linear-gradient(top, #f06f46 0%, #f0501e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f06f46', endColorstr='#f0501e');
	display: block;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	transition: .2s;
	-webkit-transition: .2s;
	border: solid black 1px;
	display: inline-block;
	margin-top: 12px;
}

a.view-more-button:hover {
    color: #fff;
    background-image: linear-gradient(top, #cc5028 0%, #cb3000 100%);
    background-image: -o-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -moz-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -webkit-linear-gradient(top, #cc5028 0%, #cb3000 100%);
	background-image: -ms-linear-gradient(top, #cc5028 0%, #cb3000 100%);
}

/*.nav-bar > li.active {*/
	/*background: none;*/
	/*border-color: none;*/
/*}*/

/*ul.flyout li.active a, .nav-bar li ul li.active a {*/
	/*color: inherit;*/
	/*border-top: 1px solid #989692;*/
/*}*/
.text-center {
	text-align: center;
}

.italic,
.italics {
	font-style: italic;
}

.bold {
	font-weight: 700;
}

.expand-button {
  float: right;
  height: 20px;
  margin-top: 2px;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.main-accordion-container .active .expand-button {
	-ms-transform: rotate(45deg); /* IE 9 */
  -webkit-transform: rotate(45deg);
  transform:rotate(45deg);
}

.main-accordion-container .menu-section-break {
	width: 100%;
	display: block;
	height: 20px;
}

.main-accordion-container .accordion-title {
    background-color: #ece9e4;
    padding: 10px 20px;
    margin-bottom: 0;
    cursor: pointer;
}
.main-accordion-container .active .accordion-title,
.main-accordion-container .accordion-title:hover {
	background-color: #f79221;
}
.main-accordion-container .panelcontent {
	display: none;
	padding: 0px 20px 10px 20px;
}
.main-accordion-container .item {
	position: relative;
}
.main-accordion-container .item h3 {
	border-bottom: 1px dashed #bbb4a4;
}

.main-accordion-container .item span.name {
	background-image: url(images/background.jpg);
	padding-right: 10px;
}
.main-accordion-container .item span.price {
	position: absolute;
	right: 0px;
	background-image: url(images/background.jpg);
	line-height: 24px;
	padding-left: 20px;
}

.main-accordion-container .item span.price.smaller {
	right: 50px;
	padding-right: 20px;
}

.main-accordion-container .panelcontent p {
	margin-top: 10px;
}

.main-accordion-container .panelcontent p.description {
	margin: -10px 0 0 0;
}


.pizza-sizes h3 {
	position: relative;
	height: 20px;
}
.pizza-sizes span.size.larger {
	position: absolute;
	right: 0px;
	line-height: 24px;
	padding-left: 20px;
}

.pizza-sizes span.size.smaller {
	position: absolute;
	right: 50px;
	padding-right: 20px;
}

@media (max-width: 480px) {
    .scroll-box a {
        display: block;
		 color: #f79221;
    }
}


@media only screen and (max-width: 900px) {
	.nav-bar > li > a:first-child {
		margin: 0 12px;
		font-size: 22px;
	}

	.nav-bar > li:last-child > a:first-child {
		margin-right: 0;
	}

    .header-text {
        display: none;
    }

    section#gallery a:nth-child(7n + 8) img {
        margin-right:20px;
    }

    #top-nav-links .six {
        display: none;
    }

    #top-nav-links .twelve {
        display: block;
    }

}

@media only screen and (max-width: 768px) {
	.header-main-nav-wrapper {
		padding-top: 20px;
	}

        #mobile-nav-button {
            z-index: 30;
        }

        .mobile-nav-container{
            z-index: 20;
        }

        .siteinfo {
            z-index: 25;
            margin-left: -15px;
        }

        .siteinfo #logo img {
            z-index:20;
        }

        .siteinfo img#logo-background {
            z-index:20;
        }

        #abs-header{
            position: relative;
        }

        section#home {
            padding-top: 0;
        }

}

@media only screen and (max-width: 480px) {

    article h1 {
        margin-left: 0;
    }

    .contact-container {
            height: 100%;
            width: 100%;
            padding: 10px;
    }

    span.location {
        text-align: inherit;
        margin-top: auto;

    }
}