/*

Pizza Perfecto - Responsive Stylesheet
http://www.pizzaperfecto.co.uk/
Handwritten by Oliver Coningham

*/

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

#logo a {
    width: 100%;
}

#logo img {
        width: 100% !important;
        height: auto;
        float: left;
        margin-bottom: 20px;
}

	#header {
		padding: 20px 0;
		}
		
	#search {
		clear: both;
		margin: 20px 0;
		position: static;
		width: 100%;
		}
		
	#search button {
		float: right;
		width: 10%;
		}
		
	#cart {
		clear: both;
		margin: 0;
		position: static;
		width: 100%;
		}

	#nav {
		font-size: 16px;
		}
		
	#nav nav a {
		padding: 20px 10px;
		}
		
	#slideshow .caption span,
	#slideshow .rslides_tabs {
		display: none;
		}
		
	#slideshow .title span {
		font-size: 60px;
		line-height: 60px;
		margin-bottom: 20px;
		}

	#features {
		margin-bottom: 20px;
		}
		
	#features p {
		margin-top: 20px;
		padding: 0 20px;
		width: 50%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		}
		
	#heroes {
		padding: 0 10px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		}
		
	#heroes #hero-1b .title strong,
	#heroes #hero-3b .title strong {
		font-size: 25px;
		line-height: 25px;
		}
		
	#popular-products .product-list,
	#offers .product-list {
		padding: 0 10px;
		}
		
	#popular-products .product-list li,
	#offers .product-list li {
		margin-bottom: 20px;
		padding: 0 10px;
		}

	#featured-products {
		padding: 0 10px;
		}
				
	#featured-products .featured-product {
		padding: 0 10px;
		}
		
	#featured-products .button a {
		margin-top: 10px;
		}
		
	footer {
		margin-top: 20px;
		padding: 20px 10px;
		}
		
	#footer-info section {
		margin-bottom: 20px;
		padding: 0 10px;
		}
		
	#footer-info section ul {
		margin-top: 10px;
		}
		
	#footer-info .footer-address {
		padding-left: 20px;
		}
		
	#furniture {
		margin: 0 10px;
		padding-top: 20px;
		}
		
	#breadcrumbs {
		margin: 20px 20px 0 20px;
		max-width: 1170px;
		}
		
	#content {
		padding: 20px 10px 0 10px;
		}
		
	#column-1 {
		padding: 0 10px;
		}
		
	#column-1 .page-menu {
		margin-bottom: 20px;
		padding: 20px;
		}
		
	#category-introduction {
		padding: 0 10px;
		}
		
	#category-introduction-content {
		padding: 20px;
		}
		
	.page-category #column-1 {
		display: none;
		}
		
	.page-category #column-2 {
		width: 100%;
		}
		
	#order-content {
		margin: 20px;
		}

	#order-content table {
		margin-bottom: 20px;
		}
		
	#order-content h1 {
		margin-bottom: 20px;
		}
		
	#order-content .login-form,
	#order-content .register-form {
		width: calc(50% - 10px);
		}
			
	#order-content .login-form form .submit, 
	#order-content .register-form form .submit {
		padding-top: 0;
		}		
		
	#order-content .guest-form {
		padding-top: 20px;
		}
		
	#order-content .alert {
		margin-bottom: 20px;
		}	
		
	#order-content #order-method,
	#order-content #order-total {
		position: static;
		top: auto;
		width: 100%;
		}	
		
	#order-content #order-total {
		margin-top: 20px;
		}	
		
	#order-confirmation {
		margin: 20px;
		}
		
	#order-confirmation h1 {
		padding-bottom: 0;
		}
		
	#register-content {
		margin: 20px 20px 0 20px;
		}
		
	.section-view-order #register-content .error {
		margin-top: 20px;
		}
		
	#register-content h1 {
		margin-bottom: 20px;
		}
		
	#login-content {
		margin: 20px 20px 0 20px;
		}
	
	#login-content h1 {
		margin-bottom: 20px;
		}
		
	#register-content #address-list,
	#register-content #order-list,
	#register-content #order-details {
		margin-top: 20px;
		}
		
	#register-content .button a {
		margin-top: 20px;
		}
		
	.page-account #column-2 {
		padding: 0;
		}
		
	.page-loyalty #column-2 {
		padding: 0 0 20px 0;
		}
		
	.page-account #column-2 #register-content,
	.page-loyalty #column-2 #register-content {
		margin: 0 10px;
		}
		
	.error-404 {
		padding: 30px 20px 10px 20px;
		}
		
}


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

	#nav {
		font-size: 20px;
		}

	#nav-button { 
		display: block;
		}

	#nav-button a { 
		color: #fff;
		display: block;
		padding: 20px 15px;
		text-decoration: none;
		}
		
	#nav-button a i { 
		display: inline-block;
		padding-right: 10px;
		}
		
	#nav ul { 
		border-top: 3px solid #fff;
		display: none;
		}
		
	#nav ul ul { 
		display: none;
		}
			
	#nav nav a {
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;		
		}
		
	#slideshow .overlay,
	#slideshow .rslides_nav {
		display: none;
		}
		
	#heroes {
		display: none;
		}
		
	#popular-products h2,
	#offers h2 {
		margin-top: 10px;
		}
		
	#popular-products .product-list li,
	#offers .product-list li {
		width: 33.3333333333333333333333333333%;
		}
		
	#featured-products .featured-product-content {
		top: 20px;
		}
	
	#featured-products .featured-product .caption {
		display: none;
		}

	#footer-info section {
		width: 33.33333333333333333333%;
		}
	
	#footer-info .footer-address {
		border: none;
		clear: both;
		padding: 0 10px;
		width: 100%;
		}
		
	#furniture {
		text-align: center;
		}
		
	#copyright {
		float: none;
		}

	#credit {
		padding-top: 10px;
		float: none;
		}
		
	#product-photo {
		padding: 0 10px;
		width: 50%;
		}
		
	#product-info {
		padding: 0 10px;
		width: 50%;
		}
		
	#product-order {
		padding: 0 10px;
		width: 100%;
		margin-top: 20px;
		}
		
	#column-1 .page-menu,
	#column-1 .mini-loyalty {
		display: none;
		}
		
	#column-2 {
		width: 100%;
		}
		
	#column-2 h2 {
		margin: 20px 10px 0 10px;
		}
		
	#column-2 .product-list li {
		margin-top: 20px;
		padding: 0 10px;
		}
		
	#meal-deal-order {
		padding: 0 10px;
		}
		
	#price.affix {
		background-color: #fff;
		position: fixed;
		top: 0px;
		left: 20px;
		width: 100%;
		width: calc(100% - 40px);
  		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;		
		z-index: 80;	
		}
		
	#product-order-content form.affix {
		padding-top: 100px;		
		}

	#meal-deal-order h2 {
		margin: 0 10px 20px 10px;
		}
		
	#meal-deal-order h2.affix {
		padding-top: 80px;		
		}

/*		
	#meal-deal-order form .meal-deal-quantity {
		clear: both;
		display: block;
		float: none;
		margin-bottom: 20px;
		padding: 0 10px;
		width: 100%;		
		}
*/
		
	#meal-deal-order-content {
		padding: 20px 10px;
		}
		
	#meal-deal-order .meal-deal-option {
		margin-bottom: 20px;
		padding: 0 10px;
		}
	/*		
	#meal-deal-order .meal-deal-add {
		padding: 0 10px;
		}
	*/
		
	#order-content .login-form,
	#order-content .register-form {
		width: 100%;
		}
		
	#order-content .register-form {
		margin-top: 20px;
		}

	#meal-deal-order .meal-deal-footer .meal-deal-quantity input {
		text-align: center;
		width: 50px;
		}
		
}


@media screen and (max-width: 750px) {
		
	#features p {
		width: 100%;
		}
		
	#popular-products .product-list li,
	#offers .product-list li {
		width: 50%;
		}
		
	#featured-products .featured-product {
		margin-bottom: 20px;
		width: 100%;
		}

	#featured-products .featured-product .caption {
		display: inline-block;
		}
		
	footer {
		margin-top: 0;
		}
		
	#column-2 h2 {
		margin: 20px 10px 0 10px;
		}
		
	#column-2 .category-list li {
		margin-top: 20px;
		padding: 0 10px;
		width: 33.3333333333333333333%;
		}

	#column-2 .product-list {
		margin-bottom: 20px;
		}
				
	#column-2 .product-list li {
		margin-top: 20px;
		padding: 0 10px;
		}
		
	#product-order {
		margin-bottom: 20px;
		}
		
	body.page-meal-deals #column-2 .product-list li {
		width: 50%;
		}
		
	body.page-meal-deals #product-order {
		margin-bottom: 0;
		}
		
	#meal-deal-order .meal-deal-option {
		width: 50%;
		}
		
	#meal-deal-order-content {
		padding: 20px 10px;
		margin-bottom: 20px;
		}
		
	#order-content table .image,
	#order-content table .total span,	
	#order-content table .quantity span {
		display: none;
		}	
		
	#register-content form {
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		}	
		
	#login-content form {
		margin-bottom: 20px;
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		}	
		
	#register-content #address-list {
		margin-top: 20px;
		}
		
	#register-content {
		margin-bottom: 20px;
		}
		
	.page-account #column-2 #register-content form {
		margin-bottom: 20px;
		}
		
	.page-account #column-2 #register-content #address-list,
	.page-account #column-2 #register-content #order-list {
		margin: 0 0 20px 0;
		}						

	#meal-deal-order .meal-deal-footer {
		height: auto;
		overflow: visible;
		}
		
	#meal-deal-order .meal-deal-footer #price2 {
		border-bottom: 1px solid #515151;
		border-right: none;
		float: none;
		height: auto;
		line-height: 40px;
		margin-right: 0;
		overflow: auto;
		}
		
	#order-content #order-method #discount-area input:not([type="radio"]):not([type="checkbox"]), 
	#order-content #order-method #discount-area textarea, 
	#order-content #order-method #discount-area select {
		float: none;
		width: 100%;
		}
		
	#order-content #order-method #discount-area #apply-discount, 
	#order-content #order-method #discount-area #remove-discount {
		float: none;
		margin-top: 10px;
		padding: 15px 20px;
		width: 100%;
		}	
		
	.error-404 {
		padding: 30px 20px;
		}	
				
}


@media screen and (max-width: 520px) {
	
	#column-2 .product-list li {
		width: 50%;
		}
		
	#meal-deal-order .meal-deal-option {
		width: 100%;
		}
		
	#order-content #order-method #address {
		clear: both;
		color: #333;
		display: block;
		font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
		font-size: 16px;
		line-height: 21px;
		width: 100%; 
		}	
		
	#order-content #order-method #preorder {
		clear: both;
		color: #333;
		font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
		font-size: 16px;
		line-height: 21px;
		}	
		
	#order-content #order-method #order-your-details input {
		margin-bottom: 10px;
		width: 100%;
  		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;			
		}			
			
	#order-content #order-method div {
		margin-bottom: 10px;
		}
		
	#order-content #order-method .deliver input[type="text"], 
	#order-content #order-method .deliver textarea {
		width: 100%;
  		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;				
		}

	#meal-deal-order .meal-deal-footer .meal-deal-quantity {
		height: auto;
		overflow: visible;
		width: 100%;
		border-bottom: 1px solid #515151;
		padding-bottom: 20px;
		}
		
	#meal-deal-order .meal-deal-add input {
		margin-top: 0;
		}
		
	table.opening-times {
		width: 100%;
		}
				
}


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

	#featured-products {
		padding: 0 20px;
		}

	#featured-products .featured-product {
		background-color: #fff;
		padding: 0;
		-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);			
		}

	#featured-products img {
		position: absolute;
		z-index: 10;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;	
		}
		
	#featured-products .featured-product-content {
		padding: 20px;
		position: relative;
		left: 0;
		top: 0;
		text-align: right;
		z-index: 20;
		}

	#featured-products .featured-product .caption {
		margin-top: 10px;
		}
				
	#featured-products .button a {
		margin-top: 20px;
		}
				
	#footer-info section {
		width: 100%;
		}
		
	#furniture {
		font-size: 14px;
		}
		
	#popular-products .product-list li,
	#offers .product-list li {
		width: 100%;
		}
		
	#column-2 .category-list li {
		width: 50%;
		}
		
	#column-2 .product-list li {
		width: 100%;
		}
	
	body.page-product #breadcrumbs li.here {
		display: none;
		}
		
	.page-cart #breadcrumbs li.here {
		display: inline-block;
		}
		
	#product-photo {
		width: 100%;
		}
		
	#product-info {
		margin-top: 20px;
		width: 100%;
		}
		
	body.page-meal-deals #column-2 .product-list li {
		width: 100%;
		}
		
	#order-content .button a {
		float: right;
		}

	#order-content .button-continue a {
		margin-bottom: 20px;
		}
		
	#order-content .login-form form label, 
	#order-content .register-form form label {
		display: block;
		width: 100%;
		padding-bottom: 10px;
		}	
	
	#order-content .login-form form input, 
	#order-content .register-form form input {
		width: 100%;
		}	
		
	#order-content #order-method #preorder {
		margin-top: 10px;
		width: 100%;
		}	
		
	#register-content form label {
		width: 100%;
		padding-bottom: 10px;
		}		

	#login-content form .forgot p {
		padding-left: 0;
		}	
				
	#register-content form input {
		width: 100%;
		}
		
	#login-content form label {
		width: 100%;
		padding-bottom: 10px;
		}		
		
	#login-content form input {
		width: 100%;
		}
		
	#register-content #address-list th {
		font-size: 16px;
		}
		
	#register-content .button-previous a {
		float: right;
		}
		
	#register-content .button-reorder a {
		clear: both;
		}

	.page-account #column-2 #register-content .account-button a {
		height: auto;
		line-height: 20px;
		text-align: center;
	}

	.page-account #column-2 #register-content .account-button i {
		float: none;
		margin: 0;
	}

	.page-account #column-2 #register-content .account-button span {
		display: block;
		float: none;
		line-height: 20px;
		margin-top: 20px;
	}

	.page-account #column-2 #register-content .loyalty-button a {
		height: auto;
		line-height: 20px;
		text-align: center;
	}

	.page-account #column-2 #register-content .loyalty-button i {
		float: none;
		margin: 0;
	}

	.page-account #column-2 #register-content .loyalty-button span {
		display: block;
		float: none;
		line-height: 20px;
		margin-top: 20px;
	}
		
	.page-account #breadcrumbs li.here {
		display: none;
		}
		
	#order-content #order-total table th {
		width: 50% !important;
		}
		
	#order-content #order-total table td {
		width: 50% !important;
		}
							
}


@media all and (orientation:portrait) and (max-width: 450px) {

	#order-content table {
		overflow-x: auto;
		/* display: block; */
		}
		
	#order-content table th {
		font-size: 16px;
		}
		
	#order-content table td.order-content-total {
		font-size: 20px;
		font-weight: 600;
		line-height: 20px;
		}	
		
	#order-content table td.order-content-total strong {
		display: none;
		font-weight: 600;
		}	
		
	#order-content table td.order-content-qty input {
		padding: 10px 0;
		text-align: center;
		width: 100%;
		}
		
	#topbar li.topbar-welcome span {
		display: none;
		}	

	#order-content #order-total table th {
		width: 100%;
		}
		
	#register-content form .checkbox {
		padding: 10px 0 0 0;
		}

	#register-content form .g-recaptcha {
		padding-left: 0;
		}

	#register-content form .submit input {
		float: left;
		}
		
/*
	#rotate {
		display: block;
		background: rgba(0, 0, 0, 0.9);
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		color: white;
		text-align: center;
		padding-top: 40%;
		}
	
	#rotate p {
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 40px;
		}
		
	#order-content table {
		display: none;
		}			
*/	
}