/**********************************  STUFF ASSOCIATED WITH RESPONSIVE GRID ********************************/
/* the width of entire white stuff is 1020. The width that we work with e.g. length of navbar is 960 */
div.container {max-width:960px; padding:0 30px; margin:0 auto; border:none; outline:0; background-color:#FFFFFF}

/* recommended by responsivegridsystem. Means space cols disappear when in mobile mode. */
.push {visibility: hidden;}
div.lblue {background-color:#33CCFF; text-align:center;}  /* temp for testing */

#fdse_TermsEx {width: 10em; height: 2em; border-radius: 5px; display: flex; align-items: center; justify-content: space-around; margin-top: 0.3em;}


html {font-size:15px;}

/************************************ STANDARD HTML REDECLARED **********************************************/

body {font-size:100%; 
margin:0 auto;
padding:0;
font-family: Arial, Helvetica, sans-serif;
line-height: 1.3em;
background-color: #FFFFFF}  /*#F1EDE2; background-image:url(background_gradient.png); background-repeat:repeat-x;*/

h1.toptitle {font-size:0.5em; position:absolute;
left:0;
margin-left:50%;
top:0;
z-index:-1;
}

h1 {margin-top:0; font-family: 'Trebuchet MS', serif;}

h2, h3, h4, h5, h6, address {
	margin-top:1em; font-family: 'Trebuchet MS',serif;}
h1 {font-size:1.25em; font-weight:bold; margin-bottom:1em}
h2 {font-size:1.125em; font-weight:bold; margin-bottom:1em}
h3 {font-size:1em; font-weight:bold; margin-bottom:1em}
h5 {font-size:0.8em; text-align:center; font-weight:bold; margin-bottom:1em}  /* click on the picture... */
h6 {font-size:1em; font-weight:bold; margin-bottom:1em}

table {border-style:solid; border-color:#006600; margin:0 auto; }
td, th {font-size:0.86666666em; border-style:solid; border-width:0.2em; border-color:#006600; padding:0.25em;}
th {font-weight:bold; text-align:center; }

ul {margin:0; padding:0 0 0 4em;}
ol {margin:0; padding:0 0 0 4em;}
li { margin:0; padding:0 0 1em 0;}

/*p {font-size:1em; margin-bottom:1em; line-height:1.3em;}  /* slightly less than the default */
p {font-size:1em; margin:0 0 1.2em 0; padding:0; line-height:1.3em;}  /* slightly less than the default */
b {font-weight:bold; margin:0; padding:0;} 
a {text-decoration:none; /*vertical-align:middle;*/ color:#005C09; font-weight:bold; font-family: 'Trebuchet MS';}
a:hover {text-decoration: underline} 
hr {margin:0; padding:0; border-color: #d7be69;}

div.localwebsitehighlight {background-color:crimson; font-weight:bold;}

p.prominentmessage {color:crimson; font-weight:bold; text-align:center; padding-top:0.4em;}
div.messagemob {display: none;}

img {max-width:100%; padding-right:0.4em; }
img.noborders {margin:0; padding:0; border:none; outline:0; }
img.brandlogoimage {padding:3em 1em 0.8em 2em; float:right;}

select, input { border-radius:5px; padding:0 0.1em; margin:0.1em;}

select {width: 10em;}


.alignright {text-align:right; float:right; color: #005C09;}
.aligncenter {text-align:center; margin: 0 auto;}
.rightbold {text-align:right; font-weight:bold; }


div.bordercentre { border: 0.1em solid darkgreen; font-size:0.8666666em; padding:0.4em 0; margin:0; text-align:center; }
div.bordercentre a {line-height:1.4em;}

/* All tables should be removed.  But following is for backwards compatibility on old webpages. Once remaining tables are removed can remove this section*/  
 
table.basktab {page-break-after: auto; width:100%; border: 2px solid darkgreen }
td.basktab {font-size:13px; padding:6px;  text-align:center; border: 2px solid darkgreen}
th.basktab {font-size:13px; padding:6px; font-weight:bold; text-align:center; border: 2px solid darkgreen}

table.bordercentre { width:90%; border: 2px solid darkgreen }
td.bordercentre {font-size:13px; padding:6px; border: 2px solid darkgreen;  text-align:center;}
th.bordercentre {font-size:13px; padding:6px; border: 2px solid darkgreen; text-align:center;}

table.borderleft { width:90%; border: 2px solid darkgreen}
td.borderleft {font-size:13px; padding:6px; border: 2px solid darkgreen; text-align:left;}
th.borderleft {font-size:13px; padding:6px; border: 2px solid darkgreen; text-align:left;}

table.lefttab { width:90%; border: none;}
td.lefttab {font-size:13px; padding:6px; border: none; text-align:left;}
th.lefttab {font-size:13px; padding:6px; border: none; text-align:left;}

table.price {page-break-after: auto; border:none; margin-left: auto; margin-right: auto; }
td.price {font-size:13px;  text-align:center; padding-bottom:15px; border: none;}
th.price {font-size:13px;  font-weight:bold; text-align:center; border: none;}

table {page-break-after: auto; border: none; margin-left: auto; margin-right: auto; }
td {font-size:13px;  text-align:left; padding-bottom:15px; border: none;}
th {font-size:13px;  font-weight:bold; text-align:center; border: none;}




/************************************ MAIN TEMPLATE **********************************************/


/* banner stuff */
div.bannerreview {height: 4em; visibility: hidden;}
div.bannerlogo {height: 4em;}
img.bannerlogo {height:4.5em;}
form.currencyform {margin-top: 0.5em; margin-right: 0em;  border-color: #d7be69; color: #046307;}
button.currencyform {float: right; margin-top: 0.5em; margin-right: 0.2em;border-color: #d7be69; color: #046307;}
select.currencyform {width: 100%; float: center; border-radius: 5px; border-color: #d7be69; color: #046307;}


form.ideasform {margin-top: 0.5em; margin-right: 0em;}
button.ideasform {float: right; margin-top: 0.5em; margin-right: 0.2em;} /*position: relative; display: inline-block;*/
select.ideasform {width: 100%; float: center; border-radius: 5px;}
div.contactboxmob {display: none; height:2.5em; width: 100%; margin-bottom:0.2em;}
img.contact {float: right; margin-bottom: 1em; height: 1.5em; margin-right: 1.3em;}
p.contactus {display: none; margin-top: 1em; margin-bottom: 0.2em; text-align: center;}
a.contactus {color: #d7be69; font-weight: normal;}
img.contactmob {padding-top: 0.5em; margin-left: 10%;}


/************************** NAV Bars *********************/
.mobtogoff {display:none;} 

#navtopgreen {
	width: 100%;
	float: left;
	margin: 0 0 0.5em 0;
	padding: 0;
	background-color: #046307;
	height: 2em;
	}

#navtopgreen ul {
	list-style: none;
	width: 960px;
	margin: 0 auto;
	padding: 0; }

#navtopgreen li {
	float: right; }

/*specific to phone number*/	
#navtopgreen li.number {
	float: left; }
	
		
#navtopgreen li a {
	color: #FFFFFF;
	display: block;
	padding: 5px 8px;
	text-decoration: none;
	font-weight: normal;
	}

#navtopgreen li a.xmas {
	color: gold;
	}	
		
#navtopgreen li:first-child a {
	 }

#navtopgreen	 li a:hover {
	color: #d7be69;
	}


li.mobnav {
	display: inline;
	}


nav a {
    color:white;
	width: 100%;
    display: inline-block;
    text-align:center;
    text-decoration:none;
    line-height: 2.5em;
	font-weight: normal;
	}
	
fdse_TermsExsearchmob {display: none;}

/**************************************** Gold Nav specific ***********************************************/

#goldnavnew {background: #e7bc44; height: 2.5em; font-size:0.9em;}

a.goldnavnew {background-color: #e7bc44; height: 2.5em; font-weight: bold; color: #FFFFFF; font-weight:normal;} /*#ffde59*/

nav a.goldnavnew:hover {background:#005C09; text-decoration:none; height: 2.5em;}

#fdse_TermsExsearch {color: #046307;; font-weight: lighter; text-align: center; margin-top: 0.4em; border: 1px solid #d7be69; width: 99%; border-radius: 0px; height:2.5em; border-radius: 5px;} 

#searchbartext {color: #046307; font-size:0.9em; font-weight:bold; margin-top:0.2em;; text-decoration:none; background-color:#FFFFFF; border-radius: 0px;}
input:focus, textarea:focus, select:focus, form:focus, button:focus {outline: none; border-color: #d7be69;}

div.searchbarmob {display: none;} /* Hidden until screen resolution is reduced */

nav a.pull {display: none;}     

#gnav-toggle, #snav-toggle, #goldnav-toggle #mob-toggle {
	display:none; 	
	width: 100%;
	position: relative;	
	text-align:left;
	text-indent: 0.5em;
	margin-top: 0.5em;
}


nav img.mobilemenu {height:1em; float:right; margin-top: 0.5em; margin-bottom: 0.5em; margin-right: 0.5em;}



/*************************************** Green Nav specific *********************************************/

		#greennavnew {background: #FFFFFF; height: 3em; border-top: solid #d7be69 1px; border-bottom: solid #d7be69 1px; margin-bottom: 0.2em; letter-spacing: 0.02em;}

nav a.greennavnew:hover {color:#d7be69; text-decoration:none;}

	a.greennavnew {background-color: #FFFFFF; height: 2.5em; text-align:center; font-weight: bold; color: #046307; font-family: 'Trebuchet MS'; width:85%; font-size: 15px; line-height:1.15em; margin-top: 0.4em;}


div.greennav-toggle {display: none; background:#005C09; height: 2.5em;}
a.greennavtoggle {text-align:left; margin-left: 0.5em;}

a.greennavmob {width: 100%; text-align: center; color: #FFFFFF; float: right; background-color: #046307; font-weight: normal; border: solid 1px #d7be69; height: 3em; padding-top: 1.5em; letter-spacing: 0.08em; }


/************************************** Green Nav Dropdown *********************************************/

.mobnavtopgreen {display: none;}


/* mob dropdown */
.mobdrop {
 padding-top: 1em;
 position: absolute; 
 display: none;
 background-color: #046307;
 z-index: 1000;
 width: 100%;
 margin-left: 0em;
}



.drop {
 position: relative; 
 display: inline-block;
}

.drop-content-games-tables {
 position: absolute;
 background-color: #FFFFFF;
 min-width: 800px;
 padding: 0em 0em 0.5em 0em;
 z-index: 10000;
 display: none; 
 border: solid #d7be69 1px;
 float: left;
}

.drop-content {
 position: absolute;
 background-color: #FFFFFF;
 min-width: 594px;
 padding: 0em 0em 0.5em 0em;
 z-index: 10000;
 display: none; 
 border: solid #d7be69 1px;
 float: left;
}

.drop-content-small {
 position: absolute;
 background-color: #FFFFFF;
 min-width: 350px;
 padding: 0em 0em 0.5em 0em;
 z-index: 10000;
 display: none; 
 border: solid #d7be69 1px;
 float: left;
}

.drop-content-right {
 position: absolute;
 background-color: #FFFFFF;
 min-width: 250px;
 padding: 0em 0em 0.5em 0em;
 z-index: 10000;
 display: none; 
 border: solid #d7be69 1px;
 float: right;
 right: 0;
 text-align: right;
}

a.dropdown {text-align:left; margin-left: 0.5em; color: #046307; font-weight: normal; height: 0.1em; font-size:smaller; line-height: 1.6em;}

a.dropdownright {text-align:right; color: #046307; font-weight: normal; height: 0.2em; margin-top: 0.1em; font-size:smaller;}

a.dropdown:hover {color: #d7be69; text-decoration: none;}

.drop:hover .drop-content {
 display: block; 
}

.drop:hover .drop-content-right {
 display: block; 
}

.drop:hover .drop-content-small {
 display: block; 
}

.drop:hover .drop-content-games-tables {
 display: block; 
}

.column {
  float: left;
  width: 24%;
  padding: 0.2em;
  background-color: #FFFFFF;  
}

.column2 {
  float: left;
  width: 31%;
  padding: 0.2em;
  background-color: #FFFFFF;  
}

.column3 {
  float: left;
  width: 40;
  padding: 0.2em;
  background-color: #FFFFFF; 
}

.column h4 {
padding-left: 0.5em;
margin-top: 0em;
padding-top: 0em;
}

.column2 h4 {
padding-left: 0.5em;
margin-top: 0em;
}

a.dropdowntitle {color: black; text-align: left; font-weight: bold; padding-top: 0; margin-top: -1em;}


#darkness {
    background:rgba(0, 0, 0, 0.5);
    display:none;
    height:100%;
    left:0;
    top:11.3em;
	position: absolute;
    width:100%;
    z-index:5;
}

/************************************** Footer ***********************************************************/

#smalltext {font-size:0.75em; line-height:1.5em}
div.smallboldtext {font-weight:bold; line-height:2em}
div.footericons {font-size:1em; text-align:right; font-weight:bolder; padding:0; margin-bottom:1em; }
img.footericons {height:2.5em; margin-top:0; margin-bottom:0; margin-right:0.5em; padding:0;}
img.footericonsnomargin {height:2.5em; margin:0; padding:0;}
img.footericons2 {height:4.5em; vertical-align:top; padding:0; margin:0;}
img.footericons3 {height:3em; vertical-align:top; padding:0; margin:0;}


/********************************* PAGE CONTENT  *******************************/


/* spacers */
#dividerbar {height:0.625em; background-color:#046307; margin-top:0; margin-bottom:0.625em}
#spacerow5 {height:0.3em; line-height:0.3em;}
div.spacerrow {height:0.9375em; font-size:0.8125em; }


/* first row in main part of page */
div.breadcrumb {height:0.9375em; font-size:0.8em; line-height:1em; vertical-align:bottom; margin-top:0.6em; margin-bottom:1em; display:inline-block;}

div.socialmediaicon {text-align:right; margin-top:0.4em; margin-bottom:0.4em;}
img.socialmediaicon {padding:0 0 0 0.25em; }

/* sidebar and wotnot */
#sidebarbox {padding-top:0; text-align: left; }
#sidebarboxright {padding-top:0; text-align:right; }
#sidebarbox h4 {padding-left:0.4em; margin:0;}
div.sidebarelement {padding-top:0; padding-bottom:0.4em;  margin-bottom:0.75em; line-height:1.2em; width:100%;
background-color: #f1ede2; 
background-size: 100% 100%;  /*The first value sets the width, the second value sets the height. */
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/design/product_box_gradient.png',sizingMethod='scale'); /* IE hack for scaling bg image */
/*border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;*/ 
}

a.sidebarlink {font-size:0.8em; font-weight:bold; }
a.sidebarlink:hover {text-decoration:underline}
p.sidebartoplevelnav {padding-left:0.4em;  font-weight:bold; margin:0;}

h3.relatedproducts {font-size:1.25em;}

.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%;
}

div.desktopinvisible {display: none;}

p.subscribetext {text-align: center; margin-bottom: 0.5em;}	
p.subscribebutton {text-align: center;}
a.subscribebutton {border: solid 1px #d7be69; padding: 0.3em; border-radius: 5px;}

#fieldName {display: block; margin: 1em 0; height: 2.5em; width: 50%; border: 2px solid grey; outline: none; padding-left: 1em;}
#fieldEmail {display: block; margin: 1em 0;height: 2.5em; width: 50%; border: 2px solid grey; outline: none; padding-left: 1em;}



/*  ***************** HOME PAGE SPECIFIC STUFF ****************************** */

/* override slider defaults */
div.flexslider, ul.slides, div.flexslider ul li img {margin:0.05em 0 0 0; padding:0; border:none; outline:none; /*border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; border-bottom-left-radius:0; -webkit-border-bottom-left-radius:0; -moz-border-bottom-left-radius:0; border-bottom-right-radius:0; -webkit-border-bottom-right-radius:0; -moz-border-bottom-right-radius:0;*/}
.flex-direction-nav {opacity:1;   filter: alpha(opacity=100);}   
.flex-direction-nav a {  width: 30px;   height: 30px;   top: 90%;}
.flex-direction-nav a:before { font-size: 30px;}
.flexslider:hover .flex-direction-nav .flex-prev {   opacity: 0.5;}
.flexslider:hover .flex-direction-nav .flex-next {  opacity: 0.5;}

.flex-direction-nav .flex-prev {left:10px;}
.flex-direction-nav .flex-next {right:10px;}



pre {font-size:0.7em; font-family:Lucida Console, Courier New; line-height:0.9em;}

/* to vertically align, if you have only a single line of text & you can specify a fixed-height for the parent element. */
/* [ seems to work to set the line height to be the height of the cell - easy! ] */



.adcell {text-align:center; margin:0; border:none; outline:none; padding:0;}
a.adcelllinktext {font-size:0.8em; text-align:center; display:inline-block; border:0 0 0.5em 0; margin:0;}
/* #adtitle {height:1.875em; line-height:1.875em; margin-bottom:1em; margin-top:0; font-size:1em; border-bottom:0.065em solid #254b28; text-align:center; color:#254b28; } */
#adtitle {margin-bottom:1em; margin-top:0; font-size:1em; border-bottom:0.065em solid #e7bc44; text-align:center; color:#046307; } 

#dividerbar {height:0.625em; background-color:#046307; margin-top:0; margin-bottom:0.625em}
#dividerspace {height:1.25em;}

#homepicture {height:20em;}  /* 320px */

#mainpicfloatright {float:right;}
div.floatright {float:right;}

h2.featured {text-align: center;}

/*********************************************** Unique Selling Points section on homepage **********************************************************/

div.uspbox {margin-bottom:1em;}
div.uspbutton {background-color:#F5F5F5; height:4em; color:#005C09; text-decoration:none;}
img.uspicon {display:block; margin:0 0 0 0.8em; padding:0; }
p.usptext {display:block; margin:0.5em 0.6em 0 0; padding:0; font-weight: bold; text-align:center; }
p.usptextsecond {display:block; padding:0; font-size: smaller; line-height: 10%; color: black; text-align:center;}
div.uspleft {display:inline-block; width:24%; margin:0; padding:0; }
div.uspright {display:inline-block; width:100%; padding:0; margin:0; text-align:center;}
div.uspbullets {display: none;}
ul.uspbullets {display:none; margin-top:0.866667em;}
ul.contactbullets {display:none; margin-top:0.866667em;}
.uspbutton a {text-decoration:none; font-weight: normal; color: #005C09;}
.uspbutton a:hover {text-decoration: none; color: #e7bc44;}
ul.contactbullets {display:none; margin-top:0.866667em;}

/******************************************************************************************************************************************************/

div.displaytable {display:table; height:100%; overflow:hidden;}

/****************************************************** Start Shopping Button on homepage *************************************************************/

div.startshopping {background-color: #ffffff; margin-bottom:1em;  padding:0.2em 0 0.2em 0; display: flex; align-items: center; justify-content: center; border-radius: 10px;} 

a.startshop {
	font-weight:bold;
	background-color:#046307;
	border: 0.125em solid rgba(33, 68, 72, 0.59);
	color: #FFFFFF;
	text-align: center;
	display: block; height:2.5em; line-height:2.5em;  /* this is what centres the text vertically */
	border-radius: 10px;
	}

a.startshop:hover {text-decoration:none; background: #d7be69;}

/********************************************************************************************************************************************************/

div.beigebox {background-color: #f1ede2;/* border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; */padding:0 0 0.5em 0; } 
/* cannot use the following text block technique if you nest a flexible grid within the text block. Instead apply the beige above to the outer flex grid div */
div.textblockinteriorbeige { border-bottom: solid #d7be69 1px; margin:0 0 1em 0; 
	/* #f1ede2 *border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;*/ 
	} 
div.textblockinteriorgrey {background-color: #ecf0ec; margin:0 0 1em 0; 
	/*border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; */
	} 
span.textblockinterior {display:block; margin:0; padding:0.5em 0.5em 0.01em 0.5em;} 

/* having it outside means the lines all line up automatically but bullets are too far to left. Use the div to push to right  */
div.salesbullets {margin:0 0 0 1em; padding:0;}
ul.salesbullets {list-style-position:outside; padding:0; margin:0}  



#introtitle {margin-top:1em;} 

div.introtexthomepage { padding: 0.5em; border-bottom: solid #d7be69 1px; border-top: solid #d7be69 1px; margin-bottom: 4em;} 
.introtexthomepage h1 {color: #005C09;} 
.introtexthomepage p {line-height: 120%;} 
div.logos {background-color: #FFFFFF; /*border-radius:0.4em;-webkit-border-radius:0.4em; -moz-border-radius:0.4em; */margin-bottom:1em;  padding:0.2em 0 0.2em 0;} 

p.homepagegridtext {font-size:0.75em; margin:0.25em 0 0 0; padding:0; text-align:center; }
p.homepagebrands {font-size:0.75em; margin:0.25em 0 0 0; padding-left:0.3em ; text-align:left; } 
p.homepagemobile {font-size:0.75em; margin:0.25em 0 0 0; padding:0; text-align:center; }


div.white {background-color: white; margin-top: 0.5em; margin-bottom: 0.5em;}

div.brand {height: 9em;}

img.brand {max-height: 7em; float: right; padding-top: 0.5em;}

img.logo {padding-top: 0.5em;}


p.homepagemobile {display: none;}


#map-plug {display:none;}

/*********************************************************************** Google Reviews ********************************************************************************/

#map-plug {display:none;}

#google-reviews {
display:flex;
flex-wrap:wrap;
//display: grid;
//grid-template-columns: repeat( auto-fit, minmax(320px, 1fr));
}

.review-item {
border:solid 1px rgba(190,190,190,.35);
margin:0 auto;
padding:1em;
flex: 1 1 20%;
}

@media ( max-width:1200px) {
  .review-item { flex: 1 1 40%; }
}

@media ( max-width:450px) {
  .review-item { flex: 1 1 90%; }
}

.review-meta, .review-stars {text-align:center; font-size:115%;}
.review-author { text-transform: capitalize; font-weight:bold; }
.review-date {opacity:.6; display:block;}
.review-text {  line-height:1.55; text-align:left; max-width:32em; margin:auto;}

 

.review-stars ul {
display: inline-block;
list-style: none;
margin:0; padding:0;
}

.review-stars ul li {
float: left;
margin-right: 1px;
line-height:1;
}

.review-stars ul li i {
  color: #E4B248;
  font-size: 1.4em;
  font-style:normal;
}
.review-stars ul li i.inactive { color: #c6c6c6;}
.star:after { content: "\2605"; }

div.white {background-color: white; margin-top: 0.5em; margin-bottom: 0.5em;}

div.brand {height: 9em;}

img.brand {max-height: 7em; float: right; padding-top: 0.5em;}

img.logo {padding-top: 0.5em;}


p.homepagemobile {display: none;}

/**********************   Buttons *******************/ 

a.button {
	font-weight:normal;
	background-color: #005C09;
	height:2.5em;
	display: block;
	color: white;
	text-align: center;
	border-radius: 5px;
	}
a.button:hover {text-decoration:none; background-color: #e7bc44; /*background-image:url(lower_nav_gradient_roll.png)*/}

div.button {
	font-weight:normal;
	height:1.5em;
	display: block;
	border:0.125em solid rgba(33, 68, 72, 0.59);
	padding-top:0.375em;
	color: white;
	text-align: center;
	border-radius: 0px;
	}

.hiddenbuttonclass { display:none; }  

.addtobasketbutton {
	font-size:0.75em;
	font-weight:normal;
	max-width:3em;
	background-color: #005C09;
	height:2em; 
	line-height:2em; 
	border:none;
	color: white;
	text-align: center;
	display:inline-block; 
	width:3em; 
	margin:0.2em; 
	padding:0;
	border-radius: 0px;
	cursor:pointer;
	border-radius: 5px;
	}  

.submitbutton {
	
	font-weight:normal;
	width: 100%; 
	max-width:9em;
	background-color: white;
	height:2em;
	display: block;
	border:solid 1px #d7be69 ;
	color: black;
	text-align: center;
	cursor: pointer;
	border-radius: 5px;	
	display: flex; align-items: center; justify-content: space-around;
	text-decoration:none;
	}

.submitbuttonbig {
	
	font-weight:bold;
	padding:0;
	width: 100%; 
	max-width:100%;
	background-color: #046307;
	height:2.5em; 
	display: block;
	border:none;
	color: white;
	text-align: center;
	cursor: pointer;
	border-radius: 5px;	
	}
	
.submitbuttonbig:hover {
	background-color: #d7be69;
	height:2.5em; 
	display: block;
	border:none;
	text-decoration:none;
	}	
	
#newbutton {width:3em; margin:0; padding:0;}

.submitbuttonpay {
	border: none;
	font-weight:normal;
	width: 100%; 
	max-width:15em;
	background-color: #046307;
	height:3em;
	display: block;
	color: white;
	text-align: center;
	cursor: pointer;
	border-radius: 5px;	
	display: flex; align-items: center; justify-content: space-around;
	text-decoration:none;
	}
	
.subbutton {
	border: none;
	font-weight:normal;
	width: 25%; 
	background-color: #046307;
	height:2.5em;
	display: block;
	color: white;
	text-align: center;
	cursor: pointer;
	border-radius: 5px;	
	text-decoration:none;
	margin-top: 2em;
	}

/* for some buttons in the basket */
div.submitbutton a {
	display: block;
	display: flex; align-items: center; justify-content: space-around;
	color: black;
	padding: 0;
	font-size:small;
	text-align: center;
	border-radius: 5px;
	font-weight: normal;
	height: 2em;
	font-size:normal;
	text-decoration:none;
	}
	
#paypal-button-container {
	width:15em;
	margin: 0 auto;
}

div.paychoicebutton {
	width:15em;
	margin: 0 auto;
}

/************************* PRODUCT/PRICE ON SALES PAGE *******************/

.pricetablecontainer {background-color:#ecf0ec; line-height:1em;margin:0; padding:0; 
	/*border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;*/ 
}
.pricetableline { display:block; margin:0.4em 0; padding:0;}
#pricedescriptiontext {font-weight:normal; text-decoration:none; margin:0; padding:0 0.4em;}
p.priceincentive {font-size:0.8em; margin:0; padding:0 0.4em; }
.pricestrikethrough {text-decoration:line-through; margin:0; padding:0 0.4em;   }
.pricemain {font-size:1em; margin:0; padding:0;  font-weight:bold; color: #CC0000}
p.priceother {font-size:0.8em; margin:0; padding:0 0.4em; color: #999999;  }
img.changecurr {vertical-align:middle; height:0.8em;}
/*form.addtobasketform {display:inline-block; float:right; text-align:right; margin:0; padding:0 0.4em; } commented 13 Apr 2018 not sure it's doing anything*/

p.hiddenprice {display:none; font-size:0.3em; color: #999999;}

.pricetablecontainer p {margin:0; padding:0 0.4em;}

div.factoidbullets { background-color:#f1ede2;margin-bottom: 1em; padding-top: 1em;} /*border: #d7be69 1px; border-style: solid none none none;*/
ul.factoidbullets {padding-left: 1.2em;}
#dimscontainer {background-color:#f1ede2; padding:0; margin:0 0 2em 0; line-height:1.2em; font-size:0.75em;
	/*border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;*/ 
	}
#dimscontainer hr {margin:0.2em 0; padding:0;}
p.dims {margin:0; padding:0.4em;}
#dimscontainer p {margin:0; padding:0.4em;}

.imperfectitemcontainer {background-color:#ecf0ec; line-height:1em; margin:0 0 1em 0; padding:1em; }

/* following to be deleted */
#pricetablecontainer {background-color:#ecf0ec; line-height:1em; }
#pricetableline { display:block; border-bottom:none; outline:0; margin: 0; padding:0 0.625em;}
div.pricecellpadleft {font-size:1em; margin:0; padding-top:0; padding-bottom:0; padding-left:0.625em; padding-right:0; min-height:1.875em;}
div.pricecellpadright {font-size:1em; margin:0; padding-top:0; padding-bottom:0; padding-left:0; padding-right:0.625em; min-height:1.875em;}
div.pricecellnopad {margin:0; padding:0; min-height:1.875em;}
#dimensionstext {font-size:0.8em; font-weight:normal; padding:0 0.4em 0 0.6em; text-decoration:none; margin-bottom:0.6875em;} /* to be removed once flex is fully done */

#smallitalics  {font-size:0.8em; font-style:italic; text-align:right; margin-top:0.25em;}

img.centreimage {display:block; margin:0.2em auto; } 
a.tableimage:hover {background:#ffffff; text-decoration:none; } /*BG color is a must for IE6*/
a.tableimage span {display:none; padding:0.125em 0.1875em; margin-left:0.5em; width:18.75em; text-align:center;}
a.tableimage:hover span{display:inline; position:absolute; background:#ffffff; border:0.065em solid #cccccc; color:#6c6c6c; z-index:100;}

div.salesthumbanchor {position:relative; } 
img.salespic {margin:0; padding:0;}  /* don't put height in here or else it gets squashed */
a.salespic:hover {background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
a.salespic span {display:none;}
a.salespic:hover span{display:inline; position:absolute; padding:0; margin:0; width:25.625em; background:#ffffff; vertical-align:bottom; border:0.065em solid #cccccc; color:#6c6c6c;  z-index:100; top:0; left:6.25em;}
div.picturesblock {margin-right:2em; margin-bottom:2em;}

#introcol {position:absolute; width:12.5em; left:-12.5em;}

/* This is the beige box into which product thumbnails should fit - sized for 4 thumbnails across the page*/
div.productimggrid { 
	background-color:#FFFFFF; /*#f1ede2*/
	border: 1;
	vertical-align: middle; 
	display:table-cell;  
	/*border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; */
	text-align:center;    /* otherwise IE does not centre image */ 
    }
img.productimggrid { 
	display:block;
	margin:auto;   /* this centers horizontally */
	padding:0;
	display: table-cell;
	text-align:center;   /* otherwise IE does not centre image */
	vertical-align:middle;
	}
	
/* Widths need careful calculations. See spreadsheet for width calculations.
/*  e.g. 32.26% is size of grid fullwidth grid so width is 960 * 32.26% / 15  */
div.productimggrid3fullwidth { /*HOME PAGE - FULL WIDTH*/
	width:20.6464em; 
	max-width:20.6464em;   /* Need max-width for IE only - otherwise does not shrink image to fit width */ 
	height: 16.5em; }  /* not sure why - but if too small, pic width reduces */
img.productimggrid3fullwidth {
	max-width:100%;  /* This must be %, not ems, otherwise grid overlaps at smaller screen widths i.e. not flexible.  100% = no margin so that it lines up with the USP boxes above */
	max-height:16.4em;  }  /* max-height in ems as a % does not work for Edge/IE */


div.productimggrid2startsmalldontreduce {  
	/* width:50%;   */
	width:23.2em;   /* 960 * 49.20% / 15 */
	max-width: 96%;  
    /* margin: 0 auto;  */
	height: 8em;    /* if there's a gap between pic/text, reduce this value in both places */
	}  /* calc. width first then do golden ratio: / 1.618. However, for grid2, this (19.7) is too high. So had to reduce it - reduces pic size automatically */
/* img.productimggrid2 { max-width:96%;  max-height:14em;}   */
img.productimggrid2startsmalldontreduce { max-width:96%;  max-height:8em;}   

div.productimggrid2 {  /*  the beige box */
	width:23.2em;   /* 960 * 49.20% / 15 */
	max-width: 96%;  
	height: 14em;    /* if there's a gap between pic/text, reduce this value in both places */
	}  /* calc. width first then do golden ratio: / 1.618. However, for grid2, this (19.7) is too high. So had to reduce it - reduces pic size automatically */
img.productimggrid2 { max-width:96%;  max-height:14em;}   




div.productimggrid3 {  /* the beige box */
	width: 17.151em;
	max-width:17.151em;  
	height: 10.6em; }  /* Golden ratio */
img.productimggrid3 {max-width:96%;  max-height:10em; }   


div.productimggrid4fullwidth {  /* Search results */
	width:15.232em; max-width:15.232em; 
	height: 9.414em; } /* Golden ratio */
img.productimggrid4fullwidth {	max-width:96%;  max-height:96%; }


div.productimggrid4 {
	width: 12.6532em;   	max-width:12.6532em;  /* As ht of image is 126px high = 126/15 = 8.4em, no pt making it more than this as pic won't stretch to fill */
	height: 8.75em; }    /* changed to 8.4 / 0.96 was 9.125em */
img.productimggrid4 {	max-width:96%;  	max-height:8.7em; } 

div.productimggrid4short {
	width: 12.6532em;   	max-width:12.6532em;  /* As ht of image is 126px high = 126/15 = 8.4em, no pt making it more than this as pic won't stretch to fill */
	height: 6.52em; 
	background-color: white;}    /* changed to 8.4 / 0.96 was 9.125em */
img.productimggrid4short {	max-width:96%;  	max-height:6.52em; } 


div.productimggrid5short { /*HOME PAGE BRAND ICONS - FULL WIDTH SHORT HEIGHT */
	width:11.9808em;      	max-width:11.9808em;  	height: 4em; 	}
img.productimggrid5short {	max-width:98%;  	max-height:4em	;	}


div.productimggrid8fullwidth { /* used for related products */
	width:7.104em;     	max-width:7.104em;  height: 4.391em;	}   /* Golden Ratio */
img.productimggrid8fullwidth { 	max-width:96%;  max-height:4.3em;}


/*
div.productgrid4img {
	background-color:#f1ede2; 
	border:0;  
	vertical-align: middle;
	display:table-cell;  
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;
	text-align:center;   
	width: 12.53em;     
	max-width:12.53em;  
	height: 9.125em;    
	}
img.productgrid4img {
	display:block;
	margin:auto;   
	padding:0;
	display: table-cell;
	text-align:center;   
	vertical-align:middle;
	max-width:96%;  
	max-height:98%; 
	}
	
div.productgrid3img {
	background-color:#f1ede2; 
	border:0;  
	vertical-align: middle;
	display:table-cell;  
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;
	text-align:center;   
	width: 16.66em;      
	max-width:16.66em;  
	max-height:12em;
	height: 12em;    
	}
img.productgrid3img {
	display:block;
	margin:auto;   
	padding:0;
	display: table-cell;
	text-align:center;   
	vertical-align:middle;
	max-width:96%;  
	max-height:11.64em;  
	}

div.productgrid3fullwidthimg { 
	background-color:#f1ede2; 
	border:0; 
	vertical-align: middle; 
	display:table-cell;  
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; 
	text-align:center;    
	width:20.6464em;      
	max-width:20.6464em;  
	height: 16.5em;
    }

img.productgrid3fullwidthimg {
	display:block;
	margin:auto;   
	padding:0;
	display: table-cell;
	text-align:center;   
	vertical-align:middle;
	max-width:96%;  
	max-height:16.1em; 
	}

div.productgrid5shortimg { 
	background-color:#f1ede2; 
	border:0; 
	vertical-align: middle; 
	display:table-cell;  
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; 
	text-align:center;    
	width:11.9808em;        
	max-width:11.9808em;  
	height: 4em; 
	}

img.productgrid5shortimg {
	display:block;
	margin:auto;   
	padding:0;
	display: table-cell;
	text-align:center;   
	vertical-align:middle;
	max-width:98%;  
	max-height:4em;
	}

div.productgrid8fullwidthimg {
	margin: 0 auto;
	background-color:#f1ede2; 
	border:0;
	vertical-align: middle;
	display:table-cell;
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;
	text-align:center;   
	width:7.104em;      
	max-width:7.104em;  
	height: 4.5em;
	}

img.productgrid8fullwidthimg {
	display:block;
	margin:auto;   
	padding:0;
	display: table-cell;
	text-align:center;   
	vertical-align:middle;
	max-width:97%;  
	max-height:4.4em;
	}

div.productgrid4fullwidthimg {
	background-color:#f1ede2; 
	border:0;  
	vertical-align: middle;
	display:table-cell;  
	border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em;
	text-align:center;   
	width:16em;     
	max-width:16em;     
	height: 9.125em;    
	max-height:9.125em;
	}
img.productgrid4fullwidthimg {
	display:block;
	margin:auto;  
	padding:0;
	display: table-cell;
	text-align:center;  
	vertical-align:middle;
	max-width:96%;  
	max-height:96%;
	}
*/


p.productgridlinktext {font-size:0.75em; text-align:center; margin:0.25em 0 0 0; padding:0;}
p.productgridprice {font-size:0.75em; text-align:center; margin:0.25em 0 0 0; padding:0; font-weight:bold;}
p.productgridbrieftext {font-size:0.75em; margin:0.25em 0 0 0; padding:0;}

div.webtable {background-color:#F5F2EB; background:url(product_box_gradient.png); background-repeat:repeat; border:0.0625em;} 


/* responsive embedded videos */
.embeddedvideocontainer {
  position: relative;
  height: 0;
  overflow: hidden;
}
 
/* 16x9 Aspect Ratio */
.embeddedvideocontainer16x9 {
  padding-bottom: 56.25%;
}
 
/* 4x3 Aspect Ratio */
.embeddedvideocontainer4x3 {
  padding-bottom: 75%;
}
 
.embeddedvideocontainer iframe {
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}



/******************** SHOULD REMOVE WHEN ALL TABLES HAVE GONE ******************/
table.bordercentre { width:90%; border: 2px solid darkgreen }
td.bordercentre {font-size:13px; padding:6px; border: 2px solid darkgreen;  text-align:center;}
th.bordercentre {font-size:13px; padding:6px; border: 2px solid darkgreen; text-align:center;}
																																																																																																																																																																																																																																																																																																																																																																																																																																															
div.rulescol { text-align:center; font-size:0.8666666em; padding:0.4em 0; margin:0; }
div.rulescol a {line-height:1.4em; }

/*************************** BASKET / ORDER ****************/

div.baskrow {margin-bottom: 1em; display: flex; align-items: center;}

	div.titlerow {margin:0; padding:0.6em 0.4em 0.4em 0.4em; font-weight:bold; text-align:center; color: #005C09; }
div.baskouterrow {border-bottom: solid 1px #CCC;} 
div.baskouterrowoutlet {margin:0; padding:0; background-color: #FFFFFF ; border-style:solid; border-color:black; border-width:0 0 1px 0; } 

div.baskborderleft {margin:0; padding:0; border-style:solid; border-color:black; border-width:0 0 0 1px; } /*not sure what this does - can it be removed?* (17/09/2019)*/

	
#smallerbutton {width:5em; margin:0.4em; padding:0; border-radius: 0px; background-color: #F5F5F5; border: solid 1px #d7be69; border-radius: 5px; }
#smallerbutton a {color: black;}
p.baskpricemain {font-size:1em; margin:0; padding:0.4em; color:black; text-align:right;}
p.baskpriceother {font-size:0.8em; margin:0; padding:0.4em 0.4em 0 0.4em; color:grey; text-align:right;}
p.bottombaskdescription {margin:0; padding:0.4em;}
p
input.qtyinput {margin:0.2em 0; padding:0;}

p.smalldebug {font-size:0.75em; background-color:#F5F5F5; border-style:solid; border-color: #CCCCCC; border-width:1px;}
div.smalldebug {font-size:0.75em; background-color:#F5F5F5; border-style:solid; border-color: #CCCCCC; border-width:1px;}

p.basktext {padding-top: 0.6em;}

#destcodeinputid {border-radius: 5px;}
#vatnum {border-radius: 5px;}

/******************** ORDER DETAILS ******************/

#custform {border: solid #e7bc44 1px;} /*{border-radius:0.4em; -webkit-border-radius:0.4em; -moz-border-radius:0.4em; }*/
div.orderdetailsblock  {
	background-color: #F5F5F5;  
	margin:0 0 1em 0;
	border-radius: 5px;
	} 
.custfield {width:16.5625em; margin-bottom: 0.4em; height: 1.5em; border-radius: 5px;}         /* 7 * 30 + 60 */
.custfieldname {text-align:left; margin-top: 0.1em;}
div.orderformtitle {font-weight:bold;}

#custtitle {width: 4em;}

.subscriptionfield {width:12em; }

.promofield {width:50%; display: block; margin: 0 auto; height: 2em; border-radius: 5px; text-align: center;}
.addpromobutton {width:25%; display: block; margin: 0 auto; height: 2em; border-radius: 5px; text-align: center; background-color: #005C09; color: white; cursor:pointer;}

.feedbackform {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

input#fdbform[type=text], textarea {
  width: 95%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
}

label#formtitle {
  padding: 12px 12px 12px 0;
  display: inline-block;
}

input#subfeedback[type=submit] {
  background-color: green;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}

.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .col-25, .col-75, input#subfeedback[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}

/********************************************************************* Mobile Responsive CSS ********************************************************************/

@media screen and (max-width: 999px) {
div.titlerow {padding:0.4em 0.2em 0.2em 0.2em;}


@media screen and (max-width: 987px) {
#greennavnew {letter-spacing: 0em;}
#navtopgreen ul {width: 900px;}
}



@media screen and (max-width: 960px) {
.drop-content {min-width: 14em;}
.drop-content-right {min-width: 14em;}

}

@media screen and (max-width: 950px) {
/*img.banneralign {display: none;} think this can be removed */
p.usptextsecond {display: none;}
p.homepagebrands {display: none;}
p.homepagemobile {display: block;}
img.contact{display: block;}
p.contactus {display: none;}
a.contactus {display: block;}
}

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

/* think all this can be removed */

/*nav { 
height: auto;
}

nav a.snav {margin:0 1.5em 0 0;}

nav ul.snav, nav ul.gnav, nav ul.goldnav {
padding:0; margin:0;
width: 100%;
display: block;
height: auto;
}

nav li.snav {width:16.6666666667%;} /* 2*100/12 */
/*nav li.snav a  {margin:0; padding:0;}

nav ul.snav {display:none;}
#snav-toggle { 
	display: block;
}

img.banneralign {display: none;}*/



.custfield {width:14em; }         /* 7 * 30 + 60 */
.subscriptionfield {width:10em; margin:0; padding:0;}

nav a {font-size: small; line-height: 3em;}

.drop-content {min-width: 10em;}
.drop-content-right {min-width: 10em;}
p.usptext {padding-top: 1em;}
#navtopgreen ul {width: 850px;}

}

@media screen and (max-width: 880px) {
#navtopgreen ul {width: 800px;}
}

@media screen and (max-width: 840px) {
nav a {font-size: smaller;}
#navtopgreen ul {width: 725px }
}


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

img.bannerlogo {height:4em;}
div.drop {display: none; width:100%; margin-left: 0em;}
#gnav-toggle {display: block;}
a.greennavnew {width: 100%; text-align: center; height: 2.5em; font-size: normal; font-weight: bold;}
.drop-content {display:none;}
.drop-content-right {display: none;}
.drop-content-games-tables {display: none;}
.drop-content-small {display: none;}
.column {display: none;}
.column2 {display: none;}
nav a {font-size: normal;}
a.dropdown {display: none;}
a.dropdowntitle {display: none;}
img.contact {margin-right: 0.5em;}
.drop:hover .drop-content {
 display: none; 
}
.drop:hover .drop-content-right {
 display: none; 
}
.drop:hover .drop-content-games-tables {
 display: none; 
}
.drop:hover .drop-content-small {
 display: none; 
}
#fdse_TermsEx {width: 8em;}
}




@media screen and (max-width: 799px) {
nav a {font-size: smaller;}
nav a.goldnavnew:hover {height: 3em;}
nav a.greennavnew:hover {height: 3em;}

form.currencyform {margin-top: 0.5em;}
form.ideasform {margin-top: 0.5em;}
}


@media screen and (max-width: 790px) {
div.baskrow {width: 100%; display: flex; justify-content: center; text-align:center;}
.alignright {float: none;}
.submitbuttonbig {max-width: 50%; height: 2.5em;}
.submitbuttonbig:hover {height: 2.5em;}
#fdse_TermsEx {text-align: center;}
}

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

div.container {padding:0 15px; }

/* go full width early */
div.fullwidthearly {width:100%;}
#bannerfullwidthearly {width:100%;}
#maincontentwidth {width:100%;}  
#sidebarboxright {width:100%; text-align:center;}

/*nav a.goldnav { margin:0 1em 0 0;}
nav li.goldnav input {width:8em;}*/



p.usptext {margin:0.8em 0.2em 0 0.8em; font-size:0.8em;}



.custfield {width: 80%; /*width:11em; */margin-bottom:0.5em; padding:0; height: 2em;}         /* 7 * 30 + 60 */
.nametitles {font-weight:bold; font-size:0.875em; margin:0; padding:0;}
.custfieldname {font-weight:bold; font-size:0.875em; margin:0; padding:0;}

.subscriptionfield {width:8em; margin:0; padding:0;}



div.container {padding:0 15px; }

/* go full width early */
div.fullwidthearly {width:100%;}
#bannerfullwidthearly {width:100%;}
#maincontentwidth {width:100%;}  
#sidebarboxright {width:100%; text-align:center;}

p.usptext {margin:0.8em 0.2em 0 0.8em; font-size:0.8em;}


}


@media screen and (max-width: 749px) {
#navtopgreen ul {width: 700px ;}
}

@media screen and (max-width: 710px) {
#navtopgreen ul {width: 650px;}
}


@media screen and (max-width: 670px) {
#navtopgreen ul {width: 600px;}
}


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

#navtopgreen {display: none;}
div.mobnavtopgreen {display: block; height: 2.5em; width: 100%; background-color: #046307;}
img.mobnavicon {margin-top: 0.3em; margin-left: 15.5%;}

#fdse_TermsExsearch {display: none;}
div.searchbarmob {display: inline-block; text-align: center; width: 100%;}
#fdse_TermsExsearchmob {width: 90%; text-align: center; border: 1px solid #e7bc44; border-radius: 3px; height: 3em; font-weight: lighter;}

div.container {margin-right:0 4px; }

p.usptext {margin:0.8em 0.2em 0 0.8em; font-size:0.8em;}
#ideasfortitlecell {height:1.875em; line-height:1.875em; font-size:1.05em; text-indent:0.35em;}
a.ideasfortextbutton {	font-size:1.05em; line-height:1.95em; }
.subscriptionfield {width:7em; margin:0; padding:0;}

div.banner {height:4em; width: 100%; margin-bottom: 2em}

a.bannertext {display: inline-block; text-align: center;}

.rightbold {text-align:left; font-weight:bold; }

.push {display: none;}
.pushifempty:empty {display: none;}

/* Google: It is reasonable for infrequently-used links or buttons to be smaller than the recommended size of 7mm, 
but there should still be no other tap targets within 5mm (32 CSS pixels) [32/15=2.13333], both horizontally and vertically */
/* increasing tap target gap */

a.bannertext {margin: 0em }
nav {margin:0 0 0.4em 0; }
a.sidebarlink {line-height:2em;}


a.menubartextbutton {width:100%; }	
img.menubardivider {display:none;}
a.topnavtextbutton { width:100%;}



div.white {margin-bottom:1em; text-align:center;} /* need a vertical gap between each one */
div.brand {margin-bottom:0em; text-align:center; height: 3.5em;} /* need a vertical gap between each one */ 
img.brand {display: none;}

div.productgridgap {margin-bottom: 3em; text-align:center;} /* need a vertical gap between each one */
div.productgridgapwhite {margin-bottom:3em; text-align:center; background-color: white;} /* need a vertical gap between each one */
div.footericons {text-align:center; margin-top:2em;}
div.smallboldtext {font-weight:bold; line-height:2em; text-align:center;}
#sidebarbox {text-align: center;}

div.socialmediaicon {margin-top:0.1em; margin-bottom:1em; }
div.socialmediaicon a {margin-left:1.6em; }
div.breadcrumb {margin-top:0.4em; margin-bottom:2em;}

#smalltext a {line-height:2.2em;} /* only to increase tap target gap */

#ideasfortitlecell {margin-top:2em;}

ul {padding:0 0 0 1em;}
ol {padding:0 0 0 1em;}

.pricetablecontainer p {margin:0.4em 0; padding:0 0.4em;}
.pricetableline { display:block; border-bottom:none; outline:0; margin: 0; padding:0;}

.mobtogoff {display:block;} 
.mobtogon {display:none;}

nav {
	border-bottom:0;
	background:none;
}
nav ul {
	height: auto;
    border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;
}
nav a {
border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;
}
nav a:hover, nav a:active {
	border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; 
}


nav li.gnav {    width:50%; 	}

nav li.gnav a {
    border-right:0;
}
nav li.gnav:last-child a {border-right: 0;}

nav li.snav {width:50%;} /* 3*100/12 */

nav ul.gnav {display:none;}




nav a.pull {
	display: block;
	width: 100%;
	position: relative;
	margin:0; padding:0;
}
nav a.pull:after {
	content:"";
	display: inline-block;
	position: absolute;
	right: 15px;
	top: 10px;
}

#gnav-toggle { 
	display: inline;
}

#mob-toggle { 
	display: inline;
}


#sidebarboxright {padding-top:0; text-align:center; }


div.contactdetails {margin-top: 0em; margin-bottom: 0em; padding-top:0.5em;}
div.uspbutton {display:none;}
div.ideasfordd {display: none;}
div.uspbullets {display:none; height: 7em; margin-bottom: 1.5em;}
ul.uspbullets {display: inherit; background-color:#FFFFFF; padding-top: 1em; list-style:none; text-align:center; border-top: solid #d7be69 1px; border-bottom: solid #d7be69 1px;}

img.bannertest {margin: 0;}
div.banner {height:4em;}
div.bannerreview {display: none;}

div.titlerow {display:none;}
#mobileleft {text-align:left;}

.custfieldname {text-align:left; margin:1em 0 0 0;}
.nametitles {margin:1em 0 0 0;}
div.orderformtitle {text-align:center;}

img.banneralign {display: inline-block; /*margin: 0 auto;*/ float:right; margin: 0.2em 0 0.2em 0.4em; padding: 0em;}
a.bannertext {display: inline-block; text-align: center;/*display: none; /*margin: 0 0 1em 0;*/ margin: 0.2em 0em 0.2em 0; padding: 0em; }



.aligncenter {text-align:center; margin: 0 auto; margin-bottom: 1.5em;}
div.productimggrid {display:block; margin:auto;}
img.productimggrid {vertical-align:middle; text-align:center;}

	
	
.flex-direction-nav a {  width: 20px;   height: 20px;   top: 75%; }
.flex-direction-nav a:before { font-size: 20px;}

.flex-direction-nav {opacity:1;   filter: alpha(opacity=100);}   	
.flex-direction-nav .flex-prev {   opacity: 0.75; }
.flex-direction-nav .flex-next {  opacity: 0.75; }
div.basket-contact {display: none;}
div.blank {display: none;}
div.introtexthomepage {text-align:center;}
img.bannerlogo {display: block; margin-left: auto; margin-right: auto; width: 50%;}
#greennavnew {border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;}
a.greennavnew {border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;}
div.bannerlogo {width: 100%; margin-bottom: 1em; margin-top:0.5em;}
#greennavnew {display: none;}
a.dropdowntitle {display: none;}
p.bottombaskdescription {text-align: left; padding: 0em; margin: 0em;}
baskouterrow {text-align:left;}
p.subscribe {text-align: center;}

div.mobileinvisible {display: none;}
div.desktopinvisible {display: block;}
div.message {display: none;}
div.messagemob {display: block;} 
form.ideasform {display: none;}
form.currencyform {width: 33.3%; margin: 0 auto; margin-top: 0.5em;}
select.currencyform {height: 1.5em;}
form.js-cm-form {margin: 0 auto; text-align:center;}
.subbutton {margin: 2em auto;}
#fieldName {width: 75%; margin: 1em auto;}
#fieldEmail {width: 75%; margin: 1em auto;}
}

@media only screen and (max-width : 500px) {
h3.relatedproducts {font-size:1em; border-bottom:0.065em solid #e7bc44; text-align:center; color:#046307;}
div.productimggrid8fullwidth { /* used for related products */
	width:12.6532em;     	max-width:12.6532em;  height: 8.75em;	}   /* Golden Ratio */
img.productimggrid8fullwidth { 	max-width:96%;  max-height:8.7em;}
.submitbuttonbig {max-width: 100%;}
.submitbutton {display: flex; align-items: center; justify-content: space-around; height: 2.5em; color: black; background-color: white; border: solid 1px #d7be69;}
div.submitbutton a {display: flex; align-items: center; justify-content: space-around; height: 2.5em; color: black;}
.submitbutton:hover {display: flex; align-items: center; justify-content: space-around; height: 2.5em;}
div.submitbutton a:hover {display: flex; align-items: center; justify-content: space-around; height: 2.5em; color: black;}
#fdse_TermsEx {height: 2.5em;}
#paypal-button-container {
	max-width:90%;
	margin-bottom: 2em;
}
div.paychoicebutton {
	max-width:100%;
	margin-bottom: 2em;
}


}

@media only screen and (max-width : 450px) {
img.mobnavicon {margin-left: 14%; height:1.5em; padding-top:0.2em; padding-bottom: 0.1em;}
div.uspbox {display: none;}
img.bannerlogo {width: 75%;}
h1, h2 {text-align: center;}
.pricetablecontainer {text-align: center}
}

@media only screen and (max-width : 419px) {
img.mobnavicon {margin-left: 14%;}
}

@media only screen and (max-width : 390px) {
img.mobnavicon {margin-left: 13%; height:1.5em; padding-top:0.2em; padding-bottom: 0.1em;}
}

/* Testing new larger checkout button
@media only screen and (max-width : 375px) {
div.baskrow {line-height:1.5em; margin: 0; margin-bottom: 0.3em;}
.submitbuttonbig {max-width: 100%; margin: 0; height: 3em; font-size: 14px; padding: 0;}

}
*/

@media only screen and (max-width : 320px) {
div.productimggrid {width: 90%;}
img.bannerlogo {width: 80%;}
}