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

#responsive-menu-button { width: 29px; display: block; /*background-image: url(images/menu-button.png);*/ float: left; }
#responsive-menu-button .line {  
	-webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    height: 2px;
    background-color: #fff;
    margin: 5px 0;
}

#responsive-bar { background-color: #005B2D; padding: 10px 10px 5px; position: fixed; left: 0; z-index: 2000;
-webkit-box-shadow: 0px 0px 15px rgba(33, 33, 33, 0.5); 
-moz-box-shadow: 0px 0px 15px rgba(33, 33, 33, 0.5); 
box-shadow:0px 0px 15px rgba(33, 33, 33, 0.5);}

.display-none { display: none; }

html.scroll, body.scroll { overflow: hidden; height: 100%; }


/* 
	 Responsive Menu 
 	 --------------------------------------------------------------------
*/

.responsive-menu{ left: -50%; position: absolute; position: fixed; height: 100%; z-index: 1999; width: 40%; overflow-x: hidden; overflow-y: auto; background-color: rgba(64,64,65,0.9); color: #5e5e5e; top: 48px; 
-webkit-box-shadow: 0px 0px 15px #222; 
-moz-box-shadow: 0px 0px 15px #222; 
box-shadow:0px 0px 15px #222; 
-webkit-transition: left 0.5s; 
-moz-transition: left 0.5s; 
-o-transition: left 0.5s; 
transition: left 0.5s; }

.responsive-menu.activate { left: 0; }

.responsive-menu .responsive-menu-inner{ padding: 0 0 15px }

.responsive-menu.right{ left: auto; right: -260px }

.responsive-menu.left{ left: -260px; right: auto }

.responsive-menu h1,.responsive-menu h2,.responsive-menu h3,.responsive-menu h4,.responsive-menu h5,.responsive-menu h6 { font-size: 11px; font-weight: normal; padding: 0 15px; margin: 0 0 5px; color: #fff; line-height: 24px; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d4d4d), color-stop(100%, #1a1a1a)); background-image: -webkit-linear-gradient(#4d4d4d,#1a1a1a); background-image: -moz-linear-gradient(#4d4d4d,#1a1a1a); background-image: -o-linear-gradient(#4d4d4d,#1a1a1a); background-image: linear-gradient(#4d4d4d,#1a1a1a); -webkit-box-shadow: 0 5px 5px 3px rgba(0,0,0,0.2); -moz-box-shadow: 0 5px 5px 3px rgba(0,0,0,0.2); box-shadow: 0 5px 5px 3px rgba(0,0,0,0.2) }

.responsive-menu p{ margin: 0 0 12px }

.responsive-menu p a{ color: rgba(255,255,255,0.9) }

.responsive-menu ul { margin: 0; }

.responsive-menu ul li{ display: block; margin: 0; line-height: 40px; border-top: 1px solid #fff; font-weight: 300; font-size: 1.6em; }

.responsive-menu ul li.menu-item-first { border-top: 0; }

.responsive-menu ul li.menu-item-last { padding-bottom: 100px; }

.responsive-menu ul li:hover,.responsive-menu ul li.active,.responsive-menu ul li.responsive-menu-class-active{ }

.responsive-menu ul li a,.responsive-menu ul li span{ padding: 0 15px; display: block; text-decoration: none;  color: #fff; text-transform: uppercase; }

.responsive-menu ul li ul{ border-bottom: none; margin: 0; }

.responsive-menu ul li ul li{ line-height: 40px; }

.responsive-menu ul li ul li:last-child{ border-bottom: none }

.responsive-menu ul li ul li a,.responsive-menu ul li ul li span{ padding-left: 30px }

.responsive-menu form{ margin: 0 15px }

.responsive-menu label{ font-size: 13px }

.responsive-menu input[type="text"],.responsive-menu input[type="password"],.responsive-menu input[type="date"],.responsive-menu input[type="datetime"],.responsive-menu input[type="email"],.responsive-menu input[type="number"],.responsive-menu input[type="search"],.responsive-menu input[type="tel"],.responsive-menu input[type="time"],.responsive-menu input[type="url"],.responsive-menu textarea,.responsive-menu select{ width: 100%; font-size: 13px; padding: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0 0 10px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; border: none; background: rgba(0,0,0,0.1); color: rgba(255,255,255,0.6); display: block; clear: both }

.responsive-menu input[type=checkbox]{ width: auto; display: inline; clear: none }

.responsive-menu input[type=button],.responsive-menu input[type=submit]{ color: #333; background: #fff }

.responsive-menu input[type=button]:hover,.responsive-menu input[type=submit]:hover{ background: rgba(255,255,255,0.9) }

.responsive-menu a:hover { color: #a5a5a5; }
  
/* 
	 Responsive Media Queries
 	 --------------------------------------------------------------------
*/

@media screen and (max-width: 960px) {
	
		
		div.page-section-back.header div.page-section { margin-top: 48px; height: 150px; }
		div#header.full-width { margin-top: 48px; }
		div#header-inner div.inner-container { background-size: 430px; background-position: center center; padding-top: 52px; }
		div#header { border-top: 0px; /* height: 219px; */ }
		div#header-inner { height: 161px; text-align: center; }
		
		div#share-container,
		div#header-inner div.inner-container,
		div.page-section-inner,
		div.page-section-back div.page-section { width: 748px; }
		
		.wrongfuel-logo { padding: 15px 0 0 0; position: static; }
		
		#trustpilot-widgets { width: 420px; margin: 0 auto; padding: 15px 0 10px; float: none; }
		#trustpilot-widgets .trustpilot-widget { float: left; margin-top: 7px; }
		#trustpilot-widgets .trustpilot-widget.collector { margin: 0px; }
		#trustpilot-widgets .trustpilot-widget.collector iframe { width: 120px !important; height: 33px !important;  }
		
		#share-container-inner { float: right; }
		#share-container-inner ul { margin-bottom: 0px; }
		#share-container-inner ul li { list-style-type: none;  margin-bottom: 0px; margin-right: 20px; }
		
		#contact { display: none; }
		.contact-responsive { display: block; background-color: #404041; padding: 12px 0 8px; position: fixed; width: 100%; z-index: 1000; }
		.contact-responsive p { color: #fff; margin-bottom: 0px; }
		.contact-responsive .contact-inner { margin: 0 auto; width: 361px;}
		.contact-responsive .contact-inner p { float: left; }
		.contact-responsive .contact-inner p.tel { margin-right: 20px; }
		.contact-responsive .contact-inner a { color: #fff; }
		
		img.pay { display: none; }
		
		#trustpilot-widget-responsive { background-color: #c2c2c2; }
		#trustpilot-widgets .trustpilot-widget { margin-top: 0px; }
		#trustpilot-widgets { width: 280px; }
		
		div#footer div.copyright { padding: 0 20px; }
		
	/* Rows and Columns */
		div.row { width: 748px; }
		div.row.long { width: 778px; }
		div.row div.column-full { width: 748px; }
		/*div.row div.column-main { width: 359px; }
		div.row div.column-sidebar { width: 359px; }*/
		
		/* 2 Columns */
		div.row.two-col div.column-one { width: 359px; }

		div.row div.column-main { width: 100%; margin-right: 0px; }
		div.row div.column-sidebar { width: 100%; }
		
		
		/* 3 Columns */
		div.row.three-col div.column-one { width: 359px; }
		div.row.three-col div.column-two { width: 359px; }
		
		/* 4 Columns */
		div.row.four-col div.column-one { width: 164px; }
		div.row.four-col div.column-one-fit { width: 165px; }
		div.row.four-col div.column-two { width: 359px; }
		div.row.four-col div.column-three { width: 523px; }
		div.row.four-col div.column-three-fit { width: 524px; }
		
	/* 
		 Slides 748px
	 	 --------------------------------------------------------------------
	*/
		
		#dummy { min-height: 320px; }
		#slideshow .cycle-slide .cycle-overlay .cycle-overlay-inner { width: 748px; }
		#slideshow .cycle-slide .cycle-overlay .cycle-overlay-inner p.slide-text-one { font-size: 4.5em; }
		#slideshow .cycle-slide .cycle-overlay .cycle-overlay-inner p { font-size: 2em; }

		
	/* Home */
	
		img.sales-icons { width: 157px; height: 157px; }	
		div.phone-now p.large { font-size: 3em; }
		
		div.testimonials-box { width: 748px; text-align: center; float: none; }
		div.testimonials-box img { float: none; display: inline-block; }
		div.testimonials-box .testimonial-text { display: inline-block; text-align: left; }
		
		div.page-section.darker-grey div.column-two p.big { font-size: 3em; }
		div.page-section.darker-grey div.column-two p { font-size: 2em; }
		div.page-section.darker-grey div.column-one p { font-size: 2.6em; }
		
		#van-pics { width: 748px; text-align: center; }
		#van-pics .van-pic { float: none; display: inline-block; }
		
		.graphic img { width: 748px; height: auto; }
		.footer-logo { width: 100%; height: auto; }
		
		div.row.three-col.stamps div.column-one { width: 748px; margin-bottom: 20px;}
		div.row.three-col.stamps div.column-small-one,
		div.row.three-col.stamps div.column-large-one { width: 748px; }
		
		.mob-friendly { display: block; }
		
	/* Default Page */
	
		.blockit { width: 359px; }
		.sidebar-box { margin: 30px auto 0; width: 359px; }
		
	/* Fleet Page */
	
		div.page-section.grey.fleets { background-size: cover; }
		
	/* Areas We Cover Page */
		
		#interactive-map { width: 480px; margin: 0 auto; }
 
	/* Contact Page */
		
		div#enquiry-form input[type="submit"],
		div#enquiry-form textarea, 
		div#enquiry-form input { width: 708px !important; }
		
}


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

	/* 
		 General 496px
	 	 --------------------------------------------------------------------
	*/
		.responsive-menu{ left: -60%; width: 50%; }
		
		div.page-section-back div.page-section { width: 496px; }
		
		
		/* Rows and Columns */
		div.row { width: 496px; }
		div.row.long { width: 526px; }
		div.row div.column-full { width: 496px; }
		div.row div.column-main { width: 496px; }
		div.row div.column-sidebar { width: 496px; }
		
		/* 2 Columns */
		div.row.two-col div.column-one { width: 496px; }
		
		/* 3 Columns */
		div.row.three-col div.column-one { width: 496px; }
		div.row.three-col div.column-two { width: 496px; }
		
		/* 4 Columns */
		div.row.four-col div.column-one { width: 233px; }
		div.row.four-col div.column-one-fit { width: 233px; }
		div.row.four-col div.column-two { width: 496px; }
		div.row.four-col div.column-three { width: 496px; }
		div.row.four-col div.column-three-fit { width: 496px; }
		
	/* 
		 Slides 496px
	 	 --------------------------------------------------------------------
	*/	

		#dummy { min-height: 150px; }
		#slideshow .cycle-slide .cycle-overlay .cycle-overlay-inner { display: none; }
		div#slider-pager { display: none; }
		
	/* Home */
		
		div#share-container,
		div#header-inner div.inner-container,
		div.page-section-inner,
		div.page-section-back div.page-section { width: 496px; }
		
		img.pay { display: none; }
		
		div#header-inner div.inner-container { padding-top: 51px; }
		div#header-inner { height: 171px; }

		
		#van-pics,
		div.testimonials-box { width: 496px; }
		
		img.sales-icons { width: 210px; height: 210px; margin-bottom: 20px; margin-right: 76px; }
		img.sales-icons.end-of-row { margin-right: 0px; }
		
		div.page-section.partners p { font-size: 2.6em; }
		
		div.page-section.foot p { text-align: left; }
		div#payment-options  { float: none; margin-bottom: 20px; } 
		div#socmed { float: none; }
		div.row.three-col.stamps div.column-one { width: 496px; margin-bottom: 20px;}
		div.row.three-col.stamps div.column-small-one,
		div.row.three-col.stamps div.column-large-one { width: 496px; }
		
		.graphic img { width: 496px; }
		.mobile-graphic { display: block; width: 300px height: auto; }
		.horiz-graphic { display: none; }
		
		.main-loop-content.home { overflow: hidden; padding-right: 0px; }
		
		div.page-section.darker-grey div.column-two p.big { font-size: 2.5em; }
		div.page-section.darker-grey div.column-one p { margin-top: 20px; } 
		div.page-section.darker-grey div.column-two p { margin-top: 5px; }
		
	/* Default Page */
	
		.blockit { width: 496px; }
		.sidebar-box { width: 100%; }
		
	/* Fleet Page */
	
		div.page-section.grey.fleets { background-image: none; }
		
	/* Contact Page */
		
		div#enquiry-form input[type="submit"],
		div#enquiry-form textarea, 
		div#enquiry-form input { width: 456px !important; }
		
		
}


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

	/* 
		 General 300px
	 	 --------------------------------------------------------------------
	*/
		
		.responsive-menu{ left: -110%; width: 100%; }
		
		div.page-section-back div.page-section { width: 300px; }
		
		
		div.page-section-back.header div.page-section { background-position: right 0px top -60px; }
		div#logo { width: 300px; }
		div#logo img { margin: 0 auto; }
		div.header-buttons { display: none; }
		p.caption { width: 300px; text-align: center; }
		
		h1 { font-size: 3.1em; }
		h2 { font-size: 3em; }
		h3 { font-size: 2.4em; }
		p.intro { font-size: 2.2em; }
		p { font-size: 1.8em; }
		
		div.panel { width: 295px; }
		div.past-events .panel { width: 255px; }
		div.past-events .btn { margin-top: 20px; }
		
		/* Rows and Columns */
		div.row { width: 300px; }
		div.row.long { width: 330px; }
		div.row div.column-full { width: 300px; }
		div.row div.column-main { width: 300px; }
		div.row div.column-sidebar { width: 300px; }
		
		/* 2 Columns */
		div.row.two-col div.column-one { width: 300px; }
		
		/* 3 Columns */
		div.row.three-col div.column-one { width: 300px; }
		div.row.three-col div.column-two { width: 300px; }
		
		/* 4 Columns */
		div.row.four-col div.column-one { width: 300px; }
		div.row.four-col div.column-one-fit { width: 300px; }
		div.row.four-col div.column-two { width: 300px; }
		div.row.four-col div.column-three { width: 300px; }
		div.row.four-col div.column-three-fit { width: 300px; }
		
		
	/* 
		 Slides 300px
	 	 --------------------------------------------------------------------
	*/	

		div#cycle-container { display: none; }
		
	
	/* Home */
	
		div#header-inner div.inner-container { width: 300px; background-size: contain; padding-top: 83px; }		
		div#header { /* height: 270px; */ }
		div#header-inner { height: 173px;  }
		
		.wrongfuel-logo { width: 300px; }
		
		div#share-container,
		div.page-section-inner,
		div.page-section-back div.page-section { width: 300px; }
		
		.contact-responsive .contact-inner { width: 300px; }
		.contact-responsive .contact-inner p.tel { margin-right: 0px; }
		.contact-responsive .contact-inner p { font-size: 2.1em; text-align: center; float: none; }

		#trustpilot-widgets { width: 295px; padding: 15px 0; }
		#trustpilot-widgets .trustpilot-widget { float: none; }
		#trustpilot-widgets .trustpilot-widget.stars iframe { width: 300px !important; height: 25px !important; }
		#trustpilot-widgets .trustpilot-widget.collector { margin-top: 5px; }
		#trustpilot-widgets .trustpilot-widget.collector iframe { width: 300px !important; height: 42px !important; }
		
		div.phone-now p { font-size: 2.4em; }
		div.phone-now p.large { font-size: 2em; }

		#van-pics, 
		div.testimonials-box { width: 300px; }
		div.testimonials-box .testimonial-text { text-align: center; }
		div.testimonials-box img { margin-right: 0px; }
		#van-pics .van-pic { margin-right: 0px; margin-bottom: 15px; }
		#van-pics .van-pic.end { margin-bottom: 0px }
		
		img.sales-icons { margin-right: 0px; float: none; margin: 0 auto 30px; margin-right: auto !important; }
		
		.main-loop-content.home { margin-top: 20px; }
		
		div.row.three-col.stamps div.column-one { width: 300px; margin-bottom: 20px;}
		div.row.three-col.stamps div.column-small-one,
		div.row.three-col.stamps div.column-large-one { width: 300px; }
		
		.graphic img { width: 300px; }

		
	/* Default Page */
	
		.blockit { width: 300px; }
		div.sidebox p.size2 { font-size: 4.8em; }
		
	/* Testimonials */
	
		div.testimonials-page-box p { font-size: 1.8em; }
	
	/* Areas We Cover Page */
		
		#interactive-map { width: 300px; margin: 0 auto; }
	
	
	/* FAQ's */
		
		.blog-container p,
		div.faq-box p { font-size: 1.8em; line-height: 1.4em; }
	
	/* Contact Page */
		
		div#enquiry-form input[type="submit"],
		div#enquiry-form textarea, 
		div#enquiry-form input { width: 260px !important; }	
		
		
}

