/* =Responsive (Mobile) Design
-------------------------------------------------------------- */

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

	.map-right {
		left: 0;
	}

	#header {
		padding-right: 0;
	}

}



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


	#header  {
	width: 985px;
	}
	
	.header-right {
		height: 112px;
	}

	.menu li {
		margin-right: 15px;
	}
	.menu a {
		font-size: 16px;
		margin: 11px 15px 11px 0;
	}

	.header-apply {
		font-size: 16px;
		margin: 12px 0 0;
		padding: 8px 38px 8px 26px;
	}
	
	.eroute-velo a + a {
		border-right: 1px solid #d4d4d4;
		margin: 0 10px 0 0;
		padding: 0 12px 0 0;
	}
	
	.eroute-velo a {
		font-size: 8px;
	}
	
	#menu-top-navigation-francais li {
		margin-right: 12px;
	}
		
	#menu-top-navigation-francais a {
		font-size: 13px;
		margin: 9px 12px 9px 0;
	}
	
	#menu-top-navigation-deutsch li {
		margin-right: 8px;
	}
		
	#menu-top-navigation-deutsch a {
		font-size: 12px;
		margin: 9px 8px 9px 0;
	}
	
	
	#menu-top-navigation-netherlands li {
		margin-right: 9px;
	}
	
	
	#menu-top-navigation-netherlands a {
		font-size: 12px;
		margin: 9px 9px 9px 0;
	}
	
	#menu-top-italian li {
		margin-right: 14px;
	}	
	
	#menu-top-italian a {
		font-size: 14px;
		margin: 9px 14px 9px 0;
	}

	#container, .container {
		width: 929px;
	}

	.map-right {
		float: right;
		right: 0;
		top: 36px;
		width: 91%;
	}

	.map-text h1 {
		font-size: 42px;
		margin: 0 0 13px;
	}

	.map-text p {
		font-size: 21px;
		}
		
	.map-text select {
		font-size: 26px;
	}
	
	.map-right {
		height: 521px;
		top: 21px;
	}

	.pin {
		width: 30px;
	}

	.pin:hover {
		width: 37px;
	}

	.uk {
		left: 445px;
		top: 112px;
	}

	.ireland {
		left: 377px;
		top: 96px;
	}

	.norway {
		right: 159px;
		top: 15px;
	}
	
	.belgium {
		left: 496px;
		top: 143px;
	}
	
	.luxemburg {
    left: 520px;
    top: 165px;
    z-index: 99;
	}

	.sweden {
		right: 236px;
		top: 68px;
	}

	.german {
		left: 581px;
		top: 163px;
	}

	.netherlands {
		right: 268px;
		top: 117px;
	}

	.france {
		left: 423px;
		top: 228px;
	}

	.spain {
		bottom: 150px;
		left: 115px;
	}

	.italy {
		bottom: 140px;
		right: 237px;
	}

	.map-right {
		top: 21px;
	}
	
	.cardbox-title h2 {
		font-size: 26px;
	}
	
	#tabs .cardbox {
    width: 44%;
	}

	.app-lightgrey, .app-darkgrey {
	height: 415px;
	}
	
		
	.appsubcards h4 {
		margin: 10px 0;
	}
	
	.page-template-fuelcards-page-php h1 {
	font-size: 35px;
	margin: 0 0 30px;
	}
	
	#homepage-content .one_fourth h3 { min-height: 79px; }

	.threeboximg {
		height: 143px;
	}
	
	.home-box p {
		height: 160px;
	}
	
	.apply-sub-nl .applypage-submit {
    font-size: 10px;
    padding: 0 20px 0 10px;
    width: 128px;
	}
	
	.apply-sub-nl .applypage-submit:after {
	padding: 0 0 0 14px;
	}
	
	/* Cards Row */
	.fcr-stats { width: 387px; }
	.fcr-pie .chart .percent { right: 0px; }
	.pcr-pieText { right: 0px; }
	.fcr-pie { padding: 0 13px 0 6px; }
	.fcr-btns { float: left; width: 100%; background: #818181; position: inherit; height: 65px; }
	.fcr-btns div { position: inherit; float: right; margin: 10px 20px 0 0; }
	
	
	.cardimages { margin-top: 34px; }
	.cardfront { top: -118px; }



}


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

	body {
	}

	.grid,
	.grid-right {
		display: block;
		float: none;
		width: 100%;
		margin-right: 0;
	}

	.copyright,
	.scroll-top,
	.powered {
		float: left;
	}

	#featured-image .fluid-width-video-wrapper {
		margin: 20px 0 0 0;
	}

	.front-page  #widgets {
		margin-top: 40px;
	}

	.top-widget,
	.front-page  .top-widget {
		margin-top: 0 !important;
	}

	.hide-desktop {
		display: block;
	}

	.show-desktop {
		display: none;
	}

	.hide-980 {
		display: none;
	}

	.show-980 {
		display: block;
	}
	
	
	
	
}



/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {

	#header  {
	width: 750px;
	}

	#container, .container  {
	width: 703px;
	}
	.header-apply {
		font-size: 13px;
		margin: 12px 0 0;
		padding: 5px 34px 7px 20px;
	}

	.strapline {
		font-size: 13px;
	}

	.top-links ul {
		padding-left: 10px;
	}

	.top-links li.manage-li a {
		font-size: 10px;
		padding: 8px 13px 8px 35px;
	}

	#lang_sel li a {
		font-size: 10px;
	}
	
	.eroute-velo {
		display: none;
	}

	.main-nav {
	width: 100%;
	}

	.menu li {
		margin-right: 22px;
	}

	.menu a {
		font-size: 15px;
		margin: 11px 22px 11px 0;
	}
	
	#menu-top-navigation-francais a {
		font-size: 14px;
	}
	
	#menu-top-navigation-deutsch a {
		font-size: 12px;
	}
	
	#menu-top-navigation-netherlands a {
		font-size: 12px;
	}
	
	#menu-top-italian li {
		margin-right: 17px;
	}

	#menu-top-italian a {
		font-size: 14px;
	}
	
	#lang_sel {
		z-index: 1000;
	}
	
	.map-right {
		top: 0;
	}

	.map-text h1 {
		font-size: 34px;
		margin: 0 0 10px;
	}

	.map-text p {
		font-size: 15px;
	}

	.map-text select {
		font-size: 21px;
	}

	.pin {
		width: 24px;
	}

	.uk {
		left: 351px;
		top: 93px;
	}

	.ireland {
		left: 300px;
		top: 78px;
	}	

	.belgium {
		left: 397px;
		top: 119px;
	}
	
	.luxemburg {
    left: 418px;
    top: 136px;
	}

	.norway {
		right: 138px;
		top: 13px;
	}

	.german {
		left: 458px;
		top: 137px;
	}

	.netherlands {
		right: 214px;
		top: 95px;
	}
	
	.france {
		left: 339px;
		top: 181px;
	}

	.spain {
		bottom: 113px;
		left: 87px;
	}

	.italy {
		bottom: 209px;
		right: 179px;
	}

	.footersmaller-widget {
		width: 22%;
	}

	.footersmaller-widget .widget-title h3 {
		font-size: 15px;
		}
		
	.hero-strapline {
		font-size: 26px;
	}
	
	.hero-subtext {
		font-size: 16px;
	}
	
	.doublecard-box {
		height: 145px;
	}
	
	.home-cardbox-title h2 {
		font-size: 14px;
	}
	
	.home-cardbox-title h2:after {
		font-size: 11px;
	}
	
	.home-box .greybtn {
    font-size: 13px;
    width: 177px;
	}
	
	.fuelcard-header {
    margin: 40px auto 30px;
	}
	
	#homepage-content .one_fourth p { min-height: 63px; }
	
	h1 {
    font-size: 38px;
	}
	
	body .ui-state-default a, body .ui-state-active a {
	font-size: 19px;
	}
	
	.page-template-fuelcards-page-php .cardselect {
    height: 145px;
	}
		
	#tabs .cardbox {
		width: 46%;
	}
	
	#tabs .middle-cardbox {
		margin: 0 0 0 5%;
	}
	
	.cardbox-title h2 {
		font-size: 22px;
	}
	
	#tabs .cardbox-title h2 {
    margin: 21px 0 15px;
	}
	
	.cardbox-bottom {
	width: 100%;
	}
	
	#tabs .cardbox-bottom {
    width: 282px;
	}	
	
	.cardbox-bottom .stations {
		font-size: 24px;
		font-weight: 600;
		padding: 14px 10px 15px 6px;
	}

	.cardbox-bottom  .details-btn {
		float: left;
		padding: 19px 8px 10px 9px;
	}
	
	#tabs .stations {
		font-size: 26px;
		padding: 14px 18px 15px 24px;
	}
	
	#tabs .details-btn {
		padding: 19px 10px 10px 15px;
	}
	
	.card-detail-content .two_thirds, .card-detail-content .one_third  {
		width: 100%;
		margin: 0;
	}
	
	.carddetail-appform {
		width: 92%;
	}
	
	.app-vehicles {
		width: 100%;
	}
	
	.applypage-submit {
	margin-top: 7px;
	}
	
	.app-lightgrey, .app-darkgrey {
	height: 430px;
	}
		
	body .appsubcards ul li {
		display: block;
		float: none;
		margin: 0 auto;
		text-align: center;
	}
	
	.appsubcards ul li + li {
		border-left: medium none;
		padding: 0;
	}
	
	.page-template-apply-page-php .cardselect {
    height: 133px;
    margin-top: 12px;
    position: relative;
	}
	
	.page-template-fuelcards-page-php h1 {
	font-size: 24px;
	margin: 0 0 37px;
	}
	
	.largeeroute {
	width: 52%;
	}
	
	.doublecard {
		width: 33%;
	}

	.prod-card1 {
		left: -122px;
		width: 100%;
	}
	

	.threeboximg {
		height: 160px;
	}

	.home-box h3 {
		height: 57px;
	}

	.home-box p {
		height: 253px;
		margin: 10px auto 30px;
	}

	.home-box .greybtn {
		font-size: 12px;
		width: 179px;
		padding-left: 6px;
	}
	
	
	
	/* Cards Row */
	.fcr-details { width: 350px; height: 370px; }
	.fcr-cardname { width: 349px; }
	.fcr-cardname h2 { padding: 15px 14px 10px; }
	.fcr-cardimg { width: 254px; border-right: none; background-color: transparent; }
	.fcr-cardimg.cardselect img { max-width: 166px;}
	.fcr-cardimg.cardselect .card0 { top: 30px; left: 62px; }
	.fcr-cardimg.cardselect.onecard .card0 { top: 13px; left: 90px; max-width: 180px; }
	.fcr-cardimg.cardselect .card1 { top: 15px; left: 110px; }
	.fcr-text { width: 349px; }
	.fcr-stats { width: 300px; }
	.fcr-statslist { width: 300px; }
	.fcr-statimg { padding-left: 46px; }
	.fcr-statfig { width: 192px; }
	.fcr-pie { margin-left: 69px; }
	
	
	.cardimages { margin-top: 78px; height: 235px; }
	.cardfront { top: -95px; }



}



/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {

	#header  {
	width: 576px; margin: 10px auto;
	}

	#container, .container  {
	width: 551px; padding: 0px;
	}
	
	.header-top { width: 86%; position: relative; }
	.header-right { height: auto; }
	
	#logo { max-width: 75px; }
	
	#lang_sel { margin-top: 12px; }
	#langChangeArea { position: absolute; right: 0px; float: none; }
	#lang_sel img.iclflag { width: 32px; height: 22px; }
	#langChangeArea .small-headtext { display: none; }
	 #lang_sel li a.lang_sel_sel { 
		line-height: 0;
		font-size: 0px;
		color: transparent;
		width: auto;
	}
	#lang_sel li:hover a.lang_sel_sel,
	#lang_sel li a:focus.lang_sel_sel { 
		line-height: inherit;
		font-size: 11px;
		color: inherit;
		width: 240px;
	}
	#lang_sel li:hover img.iclflag,
	#lang_sel li:focus img.iclflag { width: 18px; height: 12px; }
	div#lang_sel ul ul { right: 0; left: auto; }

	.js .main-nav {
		/*position: relative;*/
		background-color: #585858;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#585858), to(#3d3d3d));
		background-image: -webkit-linear-gradient(top, #585858, #3d3d3d);
		background-image: -moz-linear-gradient(top, #585858, #3d3d3d);
		background-image: -ms-linear-gradient(top, #585858, #3d3d3d);
		background-image: -o-linear-gradient(top, #585858, #3d3d3d);
		background-image: linear-gradient(top, #585858, #3d3d3d);
		clear: both;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#585858, endColorstr=#3d3d3d);
		margin: 0 auto;
	}
	
	.js .main-nav .menu {
		border: 1px solid #ccc;
		display: none;
		padding: 0;
		position: absolute;
		top: 52px;
		/*width: 442px;*/
		left: 0;
		right: 0;
	}

	.js .main-nav .menu ul {
		margin-top: 1px;
	}

	.js .main-nav .menu li {
		float: none;
		background-color: #ffffff;
		border: none;
	}

	.js .main-nav .menu li a {
		color: #444444;
		font-size: 13px;
		font-weight: normal;
		height: 45px;
		line-height: 45px;
		padding: 0 15px;
		border: none;
		border-bottom: 1px solid #f5f5f5;
		text-shadow: none;
		text-align: left;
		cursor: pointer;
		margin: 0;
	}

	.js .main-nav .menu li.current_page_item,
	.js .menu .current_page_item a,
	.js .menu .current-menu-item a {
		background-color: #f5f5f5;
	}

	.js .main-nav .menu li li:hover {
		background: none !important;
	}

	.js .main-nav .menu li li a {
		position: relative;
		padding: 0 10px 0 30px;
	}

	.js .main-nav .menu li li li a {
		position: relative;
		padding: 0 10px 0 40px;
	}

	.js .main-nav .menu li a:hover,
	.js .main-nav .menu li li a:hover {
		background-image: none;
		filter: none;
		background-color: #f5f5f5 !important;
	}

	.js .main-nav .menu li li a::before {
		content: '\2013';
		position: absolute;
		top: 0;
		left: 20px;
	}

	.js .main-nav .menu li li li a::before {
		content: '\2013';
		position: absolute;
		top: 0;
		left: 20px;
	}

	.js .main-nav .menu li li li a::after {
		content: '\2013';
		position: absolute;
		top: 0;
		left: 30px;
	}

	.js .main-nav .menu li ul {
		position: static;
		visibility: visible;
		background-color: #ffffff;
	}

	.js .main-nav .menu ul {
		min-width: 0;
	}

	.js .main-nav #responsive_current_menu_item {
		display: none;
	}

	.js .main-nav a#responsive_menu_button {
		position: absolute;
		display: block;
		top: 12px;
		right: 0;
		height: 40px;
		line-height: 40px;
		width: 10%;
		/*background: url('../images/select-icons.png') 0 5px no-repeat;*/
		background-color: #e31936;
		color: #fff;
		cursor: pointer;
		text-align: center;
		font-size: 28px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
	}
	.js .main-nav a#responsive_menu_button:before { content: "\f0c9"; font-family: FontAwesome; }

	.js .main-nav a#responsive_menu_button.responsive-toggle-open {
		/*background: url('../images/select-icons.png') 0 -46px no-repeat;*/
		background-color: #ccc;
		-webkit-border-bottom-right-radius: 0px;
		-webkit-border-bottom-left-radius: 0px;
		-moz-border-radius-bottomright: 0px;
		-moz-border-radius-bottomleft: 0px;
		border-bottom-right-radius: 0px;
		border-bottom-left-radius: 0px;
	}
	.js .main-nav a#responsive_menu_button.responsive-toggle-open:before { content: "\f00d"; }
		
	.header-left {
		width: 18%;
	}

	.header-right {
		float: right;
		margin: 0;
		width: 82%;
		
		position: relative;
	}

	.top-links ul {
		float: none;
		padding-left: 0;
	}
		
	.countryselect form {
		margin: 0;
	}
	
	.countryselect form div {
	margin: 0;
	}
	
	.straplineTable { display: table; width: 83%; float: left; height: 63px; }
	.strapline {
		display: table-cell;
		font-size: 20px;
		margin: 0;
		width: 100%;
		vertical-align: middle;
		float: none;
	}

	.top-links li {
		border-left: 1px solid #d4d4d4;
		float: left;
		height: auto;
		list-style: outside none none;
		margin: 0;
		width: 45%;
	}
	
	.nav-container {
    border-top: none;
    /*position: relative;*/
    z-index: 10;
	}
	
	body .menu a, body .menu li {
	margin: 0!important;
	}

	.map-left {
		position: relative;
		text-align: center;
	}
	
	.countryselect form {
		margin: 0 auto;
		width: 100%;
	}
	
	.top-links .dd-options li, #lang_sel li li {
    width: 100%;
	}

	.map-right {
		top: 0;
		width: 100%;
	}

	.pin {
		width: 19px;
	}

	.pin:hover {
		width: 23px;
	}

	.uk {
		left: 290px;
		top: 74px;
	}

	.ireland {
		left: 245px;
		top: 66px;
	}

	.norway {
		right: 107px;
		top: 11px;
	}

	.luxemburg {
		left: 338px;
		top: 110px;
		z-index: 99;
	}

	.german {
		left: 378px;
		top: 110px;
	}

	.netherlands {
		right: 175px;
		top: 78px;
	}


	.france {
		left: 270px;
		top: 148px;
	}

	.belgium {
		left: 321px;
		top: 95px;
	}

	.italy {
		right: 151px;
		top: 216px;
	}

	.footer-top {
		text-align: center;
	}

	.footersmaller-widget {
		text-align: center;
		width: 100%;
	}

	.footersmaller-widget .widget-title h3 {
		text-align: center;
	}

	.footer-widget {
		float: none;
		text-align: center;
		width: 100%;
	}
		
	.page-template-fuelcards-page-php #tabs {
		position: relative;
		top: -32px;
	}
	
	
	.cardbox-bottom .stations {
		font-size: 20px;
		padding: 14px 7px 15px 5px;
	}
	
	
	.stations .stations-text {
		font-size: 11px;
	}
		
	.cardbox-bottom .details-btn {
		padding: 22px 1px 10px 5px;
	}
		
	.details-btn a {
		font-size: 11px;
		width: 82px;
	}
	
	.cardbox-title h2 {
		font-size: 16px;
		height: 40px;
	}
		
	#tabs .cardbox-bottom {
		width: 100%;
	}
	
	#tabs .stations {
		padding: 14px 9px 15px 12px;
	}
	
	#tabs .stations .stations-text {
	font-size: 12px;	
	}
	
	#tabs .details-btn {
    padding: 19px 10px 10px;
	}
	
	#tabs .details-btn a {
	font-size: 14px;
	width: 115px;
	}	
	
	#tabs .cardbox-title h2 {
    font-size: 23px;
	height: auto;
	}
	
	#countrySelectorHead {
	position: relative;
	}
	
	.home-top {
		background-image: url("../images/esso-home-bg-mob.jpg"); background-size: auto 100%; padding: 15px 0 50px;
	}
	
	.home-top .half {
		width: 100%;
	}
	
	.home-cardbox {
		float: none;
		text-align: center;
		width: 100%;
	}
	
	.home-cardbox img {
		width: auto;
	}
		
	body .home-cardbox-img {
		height: 212px;
		margin: 7px auto 10px;
		width: 56%;
	}
	.home-cardbox .cardselect .card0 { left: -40px; }
	.home-cardbox .cardselect .card1 { left: 52px; }
	
	.home-cardbox-title h2 { padding: 10px 32px 10px 27px; }
	.home-cardbox-title h2:after { padding: 0 10px 0 9px; margin: 0 -28px 0 8px; }
	
	#homepage-content .one_fourth h3 { min-height: auto; margin-top: 60px; }
	#homepage-content .one_fourth p { min-height: auto; }
	#homepage-content .one_fourth img { display: block; margin: 0px auto; }
	
	.home-box p {
		min-height: 10px;
	}
	
	.home-box {
		border-bottom: 1px solid #dddddd;
		margin: 0 0 24px;
		padding: 0 0 25px;
		text-align: center;
	}
	
	body.home div.one_half.last { border-left: none; }
	.full-container-grey .one_half { text-align: center; }
	
	.card-header {
		width: 100%;
	}
	
	.maincard-img {
		float: none;
		position: relative;
		text-align: center;
		top: 16px;
		width: 100%;
	}
	
	.contactpage-form input[type="text"] {
	width: 100%;
	}
	
	.contactpage-form input[type="email"] {
	width: 100%;
	}
	
	.contactpage-form textarea {
		width: 100%;
	}	
		
	#widgets .textwidget a {
		display: block;
		text-align: center;
	}
	
	.checkout-cards {
    width: 100%;
	}

	.applypage-container .cardselect img {
		position: static;
		text-align: center;
		width: 42%;
	}
	
	.page-template-apply-page-php .cardselect {
    height: 192px;
	text-align: center;
	}
	
	body .appsubcards ul li {
		display: inline-block;
		float: left;
		}
		
		.appsubcards ul li + li {
		border-left: 1px solid #ccc;
	}

	.application-container {
		margin-left: 0;
		width: 92%;
	}

	.card-header {
		float: none;
	}
	
	.prod-card1 {
		left: 0;
		width: 55%;
	}
	
	.prod-card2 {
		left: 131px;
		position: relative;
		width: 55%;
	}
	
		
	.threeboximg {
		height: auto;
	}


	.home-box h3 {
		height: auto;
	}


	.home-box p {
		height: auto;
	}
	
	
	/* Cards Row */
	.fcr-details { width: 248px; height: 370px; }
	.fcr-cardname { width: 248px; }
	.fcr-cardname h2 { padding: 15px 14px 10px; }
	.fcr-cardimg { width: 232px; }
	.fcr-cardimg.cardselect .card0 { left: 24px; }
	.fcr-cardimg.cardselect.onecard .card0 { left: 35px; }
	.fcr-cardimg.cardselect .card1 { left: 60px; }
	.fcr-text { width: 248px; }
	.fcr-stats { width: 300px; }
	.fcr-statslist { width: 300px; }
	.fcr-statimg { padding-left: 54px; }
	.fcr-statfig { width: 152px; }
	.fcr-pie { margin-left: 70px; margin-bottom: 20px; }
	
	
	
	.card-header p { width: 295px; }
	.cardimages { margin-top: -165px; height: 195px; }
	.cardimages.singlecard { margin-top: -140px; height: 160px; }
	.grey-bar .container { font-size: 20px; }

}



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

	body {
	}


	.grid,
	.grid-right {
		float: none;
	}

	#featured-image .fluid-width-video-wrapper {
		margin: 20px 0 0 0;
	}
	
	#header {
    /*width: 92%;*/
	}

	.top-widget {
		float: none;
		margin: 0 auto 10px auto;
		position: relative;
		text-align: center;
		width: auto;
	}

	.top-widget .widget-title h3 {
		text-align: center;
	}

	.js .sub-header-menu {
		display: none;
	}

	.top-menu,
	.footer-menu li {
		float: none;
		font-size: 11px;
		text-align: center;
	}

	#author-meta {
		padding: 20px;
	}

	#wrapper .gallery .gallery-item {
		max-width: 100%;
	}

	.hide-650 {
		display: none;
	}

	.show-650 {
		display: block;
	}

	.hide-mobile {
		display: none;
	}

	#footer {
		text-align: center;
	}

	#footer .social-icons {
		padding-bottom: 10px;
		text-align: center;
	}
}

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

	body {
		min-width: 320px;
	}

	.grid,
	.grid-right {
		float: none;
	}

	#featured-image .fluid-width-video-wrapper {
		margin: 20px 0 0 0;
	}

	.featured-title {
		font-size: 40px;
		padding: 40px 20px 0 20px
	}

	.featured-subtitle {
		font-size: 24px;
	}

	.navigation .next,
	.navigation .previous {
		display: block;
		margin: 0 auto;
		text-align: center;
	}

	.menu ul,
	.menu li,
	.top-menu,
	.footer-menu li,
	.sub-header-menu li {
		float: none;
		text-align: center;
		text-rendering: optimizeSpeed;
	}

	#wrapper .gallery .gallery-item {
		float: none;
	}
	
	#header {
		/*width: 300px;*/
		width: 90%;
	}
	.header-top { width: auto; margin-right: 56px; }
	.straplineTable { display: none; }
	.strapline { display: none; }
	
	.js .main-nav .menu {
		/*width: 100%;*/
	}
	.js .main-nav a#responsive_menu_button { width: 40px; }

	#logo {
		/*float: none;*/
		margin: 0 auto;
		text-align: center;
		width: 33%;
	}

	.header-right {
		float: none;
		margin: 0;
		text-align: center;
		width: 100%;
	}

	.top-links li {
		border-left: medium none;
		float: left;
		height: auto;
		list-style: outside none none;
		margin: 0;
		width: auto;
	}

	#lang_sel {
		margin: 12px auto 0;
	}
	#lang_sel li:hover a.lang_sel_sel, #lang_sel li a.lang_sel_sel:focus { width: 216px; }
	div#lang_sel ul ul { left: 0; }
	.top-links .dd-options li, #lang_sel li li { width: 100%; }
	#lang_sel ul ul a { width: auto; }
	
	.top-links .dd-selected {
		padding: 7px 10px 8px 22px;
	}
	
	.top-links .dd-select label {
	font-size: 10px;
	}

	.map-text h1 {
		font-size: 24px;
		margin: 0 0 10px;
	}

	.map-right {
		display: none;
	}	
	
	.countryselect form {
		margin: 0 auto;
		width: 100%;
	}
	
	.page-template-homepage-php #countrySelectorDD {
	float: none;
	}	
		
	.page-template-homepage-php #ccselpg {
		display: block;
		float: none;
		margin: 10px auto;
		width: 91px;
	}

	#container, .container {
		padding: 0;
		width: 300px;
	}
	
	.hide-480 {
		display: none;
	}

	.show-480 {
		display: block;
	}

	#footer {
		text-align: center;
	}

	#footer .social-icons {
		text-align: center;
	}
		
	.cardbox, #tabs .cardbox {
		width: 100%;
	}
	
	.cardbox-bottom {
    width: 82%;
	}

	#tabs.cardbox-bottom {
		width: 100%;
	}
	
	.cardbox-bottom .stations {
		padding: 14px 9px 15px 12px;
		font-size: 28px;
	}
	
	.cardbox-bottom .details-btn {
		padding: 19px 10px 10px;
	}
	
	.details-btn a {
		font-size: 14px;
		width: 115px;
	}
	
	#countrySelectorDD {
    display: block;
    margin: 0 auto;
	}
	
	body .ui-state-default a, body .ui-state-active a {
    font-size: 14px;
	}
	
	body .ui-state-default a, body .ui-state-active a {
    font-size: 14px;
	}
	
	body .ui-state-default a {
	padding: 8px 19px !important
	}
	
	body .ui-state-active a {
		padding: 13px 19px !important;
	}
	
	#tabs .middle-cardbox {
	margin: 0;
	}
	
	h1 {
		font-size: 29px;
	}
		
	.page-template-fuelcards-page-php #tabs {
		position: relative;
		top: -20px;
	}
	
	.home-cardbox img {
    width: 72%;
	}
	
	body .home-cardbox-img {
		height: 162px;
		width: 90%;
	}	
	.home-cardbox .cardselect .card0 { left: 8px; }
	.home-cardbox .cardselect .card1 { left: 64px; }
	
	.grey-bar-left {
		width: 100%;
		text-align: center;
		float: none;
		font-size: 15px;
	}
		
	.grey-bar-right {
		border-top: 1px solid #4a4a4a;
		float: none;
		margin: 14px 0 0;
		padding: 10px 0 0;
		width: 100%;
	}
	
	.grey-bar-right p {
		font-size: 17px;
	}
	
	.light-grey-bar {
		margin: 0 0 15px;
	}
	
	.carddetail-appform {
    position: relative !important;
	width: 83%;
	}
	
	.carddetail-appform .app-logo {
		width: 23%;
	}
	
	.carddetail-appform h3 {
		font-size: 21px;
	}
	
	.contactpage-form tr td {
		display: block;
	}
	
	
	
	/* Cards Row */
	.fcr-details { width: 298px; height: auto; padding-bottom: 15px; border-right: none; border-bottom: 1px solid #b1b1b1; }
	.fcr-cardname { width: 298px; }
	.fcr-cardname h2 { padding: 15px 14px 10px; }
	.fcr-cardimg { width: 298px; }
	.fcr-cardimg.cardselect.onecard .card0 { left: 60px; }
	.fcr-cardimg.cardselect .card0 { left: 36px; }
	.fcr-cardimg.cardselect .card1 { left: 84px; }
	.fcr-text { width: 298px; }
	.fcr-stats { width: 298px; }
	.fcr-statslist { width: 298px; }
	.fcr-statimg { padding-left: 50px; }
	.fcr-statfig { width: 152px; }
	.fcr-pie { margin-left: 74px; margin-bottom: 20px; }
	.fcr-btns { height: 112px; }
	.fcr-btns a { width: 238px; }
	
	
	
	.card-header h2 { font-size: 22px; }
	.card-header p { width: auto; font-size: 17px; }
	.cardimages { margin-top: 0; height: 116px; width: 100%; text-align: right; }
	.cardimages.singlecard { margin-top: -8px; height: 159px; }
	.cardimages img { max-width: 46%; }
	.cardimages.singlecard img { max-width: 76%; margin: 0 12%; }
	.cardfront { top: -85px; text-align: left; }
	.grey-bar .container { font-size: 17px; line-height: 26px; }
	
	
}

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

	body {
	}

	#featured p {
		font-size: 12px;
		line-height: 1.5em;
	}

	.featured-title {
		font-size: 35px;
	}

	.featured-subtitle {
		font-size: 15px;
	}

	.call-to-action a.button {
		font-size: 14px;
		padding: 7px 17px;
	}

	.hide-320 {
		display: none;
	}

	.show-320 {
		display: block;
	}
}

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

	body {
	}

	#featured p {
		font-size: 11px;
		line-height: 1.5em;
	}

	.featured-title {
		font-size: 20px;
	}

	.featured-subtitle {
		font-size: 11px;
	}

	.call-to-action a.button {
		font-size: 12px;
		padding: 5px 15px;
	}

	.top-widget area,
	.top-widget select,
	.top-widget textarea,
	.top-widget input[type="text"],
	.top-widget input[type="password"],
	.top-widget input[type="email"] {
		width: 75%;
	}

	.widget-title h3,
	.widget-title-home h3 {
		font-size: 14px;
		height: 13px;
		line-height: 13px;
		text-align: left;
	}

	.hide-240 {
		display: none;
	}

	.show-240 {
		display: block;
	}
}