/* ==================== Site StyleSheet + Table of Contents =================================================================
	1 Reset
	2 Typography
		Font Family
		Base Colour
		Headings
		Paragraph / Blockquote / Hr
		Bullet Lists

	3 Site Elements
		Links
		Font Classes
		Floats / Aligns
		Clears
		Wraps
		Button Style

	4 Layout Blocks
	5 Page Styles
	
	6 Modules
	7 Forms		
	8 Navigation / Site-Menu
	9 Media Queries
	10 Font Face

==== Z-index/Stacking Order ================================
	banner = 10
	selectmenu = 5
	nav/menu = 5
	right = 0
	left = 0
	container = 1
	footer = 0
	#wrapper = 0
	html/body = 0
================================================================================================================ */
/* ========== 1 Reset ============================================== */
* { margin:0; padding:0; } html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike, strong,sub,sup,tt,var,b, u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead, tr,th,td,article,aside,canvas,details,embed,figure,figcaption, footer,header,hgroup,menu,nav, output,ruby,section,summary,time, mark,audio,video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;} article, aside,details,figcaption,figure,footer, header,hgroup,menu, nav,section {display: block;} input[type=text],input[type=submit],input[type=password],input[type=button]{padding:0px;margin:0px;border:1px solid #000000;} hr {border: solid #CCC;border-width: 1px 0 0;clear: both;margin: 0.5em 0 1em;height: 0;} ol,ul,li{padding:0px;margin:0px;list-style:none;}blockquote,q {quotes:none;} blockquote:before,blockquote:after,q:before,q:after {content: '';content:none;} table {border-style: none;border-width:0px;border-collapse:collapse;border-spacing: 0;}td {vertical-align: middle;} body{line-height:1;padding:0;margin:0;background:#FFFFFF;color: #000000;font-family: Arial, Helvetica,sans-serif;font-size:1em;line-height:1.2em;text-align: center;background-image:none;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;} img {-ms-interpolation-mode: bicubic;}textarea { overflow: auto;resize: none; } span.skype_pnh_container{display:none!important;} span.skype_pnh_print_container{display:inline!important;} span[class^='skype_pnh_container']{display:none!important;} span[class^='skype_pnh_print_container']{display:inline!important;}
/* ========== 2 Typography ========================================== */
h1, h2, h3, h4, h5, h6, p, blockquote, ul, li, table, td, th, label, .bttn {padding: 0px;margin: 0px;border-style: none;font-family: Arial, Helvetica, sans-serif;color: #000000;text-align: left;text-indent: 0px;white-space: normal;word-spacing: normal;letter-spacing: normal;font-weight: normal;background-image: none;text-transform: none;font-size: 1em;line-height: 1.5em;text-rendering: optimizeLegibility;}
/* ==== FontFamily =============================== */
h1, h2, h3, h4, h5, h6, div, p, blockquote, ul, li, table, td, th, label, form, .bttn, input {
	font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
h1, h6 {
	font-family: "robotobold", Arial, Helvetica, sans-serif;
}
blockquote, .bttn {
	font-family: "robotoregular", Arial, Helvetica, sans-serif;
}
/* ==== BaseColour ============================== */
h1, h2, h3, h4, h5, h6, div, p, blockquote, ul, li, table, td, th, label, form, input {
	color: #444444;
}
/* ==== Headings ================================ */
h1 {
	font-size: 1.5em;
	line-height: 1.25em;
	margin-bottom: 0.15em;
}
h2 {
	font-size: 1.25em;
	line-height: 1em;
	margin-bottom: 1em;
}
h3 {
	font-size: 1.25em;
	line-height: 1em;
	margin-bottom: 0.5em;
}
h4 {
	font-size: 1.15em;
	line-height: 1em;
	margin-bottom: 0.3em;
}
h5 {
	font-size: 1.15em;
	line-height: 1em;
	margin-bottom: 0.3em;
}
h6 {
	font-size: 1.1em;
	line-height: 1em;
	margin-bottom: 0.5em;
	font-weight: bold;
}
.headingbreak {
	padding-bottom: 0.25em;
	font-family: "robotoregular", Arial, Helvetica, sans-serif;
	color: #333;
}
.headingbreak span {
	font-size: inherit;
	line-height: 1px;
	text-indent: -999em;
	height: 1px;
	display: block;
	margin: 0.25em 0em 0.2em 0em;
	padding: 0em;
	clear: both;
	border-bottom: 1px solid #C0C0C0;
	background-image: none;
}

/* ==== Paragraphs/Blockquotes/Hr ==================== */
p {
	font-size: 0.9em;
	line-height: 1.3em;
	margin-bottom: 2em;
}
p.copyright, p.sitemap {
	padding: 0.25em;
	font-size: 1.25em;
	line-height: 1.25em;
	margin-bottom: 0em;
	display: block;
	font-weight: bold;
	color: #FFFFFF;
	text-align: left;
	width: 45%;
}
p.copyright {float: left;text-align: left;}
p.sitemap {text-align: right;float: right;clear: none;}
p.sitemap a {font-size: 80%;font-weight: normal;}
p.sitemap a:hover, p.sitemap a:active {color: #FFF;}
p.contacts {margin-bottom: 0.75em;}
p.fontbold {color: #6E6E6E;}
blockquote {
	padding: 1.25em;
	margin: 1em 2em 2em 2em;
	font-size: 0.875em;
	line-height: 1.5em;
	text-align: left;
	font-style: italic;
	background-color: #F2FBFF;
	color: #808080;
}
blockquote span {
	color: #B30000;
	font-size: 90%;
	line-height: 1.5em;
	text-align: center;
	font-style: normal;
	display: block;
	padding: 0.25em 0em 0em 0em;
	margin: 0em;
}
hr {
	border-color: #E6E6E6;
	margin-right: 1em;
	margin-left: 1em;
}
/* ==== BulletLists ============================== */
ul, ul ul {
	padding: 0em;
	margin: 1em 0em 2em 1em;
	text-align: left;
	font-size: 1em;
	line-height: 1.5em;
}
ul li {
	padding: 0em;
	margin: 0em 0em 0.75em 0em;
	font-size: 0.9em;
	line-height: 1.2em;
	list-style-type: square;
	list-style-position: outside;
	font-weight: normal;
	text-transform: none;
	text-align: left;
}
ul ul {
	margin: 0.75em 1em 0.75em 1.5em;
}
ul ul li {font-size: 1em;}
ul li a, ul li a:visited {text-decoration: none;}
ul li a:hover {text-decoration: none;}
.sitemap-list li {
	list-style-type: none;
	border-bottom: 1px #E6E6E6 solid;
	padding-bottom: 1em;
}
.sitemap-list li:last-of-type {border-bottom: none;}
.sitemap-list li span {font-weight: bold;display: block;margin-bottom: 0.25em;}
/* ========== 3 Site Elements ======================================== */
a, a:visited {
	color: #B30000;
	text-decoration: none;
	outline: none;
}
a:hover {
	text-decoration: none;
	color: #1C266C;
	cursor: pointer;
	outline: none;
}
a:active {
	color: #000000;
	text-decoration: none;
	background-color: transparent;
	outline: none;
}
a:focus {outline: none;}
/* ==== Font Classes ============================== */
em, i {font-style: italic;line-height: inherit;}
strong, b {font-weight: bold;line-height: inherit;}
small {font-size: 60%;line-height: inherit;}
code {font-family: Consolas, "Liberation Mono", Courier, monospace;font-weight: bold;color: #7f0a0c;}
.fontbold {font-weight: bold;}
.fontnormal {font-weight: normal;}
.fontitalic {font-style: italic;}
.fontsmall {font-size: 60%;}
.fontbig {font-size: 140%;}
.fontcolour, .fontcolour li span {color: #1C266C;}
.fontcolour2 {color: #B30000;}
.wordbreak {-ms-word-break: break-word;word-break: break-all;word-break: break-word;}
.sup {vertical-align: super;font-size: 70%;}
.txtshadow {text-shadow: 0px -1px 0px #000;}
/* ==== Image ================================= */
img.flexyleft, img.flexyright, img.page404 {
	border: 1px solid #CCC;
	font-size: 1em;
	text-align: center;
	vertical-align: top;
	width: 40%;
	height: auto;
	display: block;
	padding: 0em;
}
img.page404 {
	margin-right: auto;
	margin-left: auto;
	border: none;
	width: 100%;
	max-width: 300px;
	margin-bottom: 1em;
}
img.flexyleft {
	float: left;
	clear: both;
	text-align: left;
	margin: 0em 1em 1em 0em;
}
img.flexyright {
	float: right;
	clear: both;
	text-align: right;
	margin: 0em 0em 1em 1em;
}
img.responsive {
	font-size: 1em;
	text-align: left;
	vertical-align: top;
	border-style: none;
	width: 100%;
	height: auto;
	display: block;
	float: none;
	padding: 0em;
	margin: 0em;
	line-height: 1em;
}
/* ==== Floats / Aligns ============================= */
.fltleft {float: left;}
.fltright {float: right;}
.fltmid {margin-right: auto;margin-left: auto;}
.agnleft {text-align: left;}
.agnright {text-align: right;}
.agnmid {text-align: center;}
.botgap {margin-bottom: 2em;}
.smbotmarg {margin-bottom: 1em;}
.nobotmarg {margin-bottom: 0em;}
/* ==== Clears ================================== */
.afltclear, .aclear, .allfloatclear 
{overflow: hidden;border-style: none;padding: 0px;margin: 0px;width: 100%;height: 0;visibility: hidden;clear: both;display: block;background-image: none;float: none;}
.clearfix:after {clear: both;content: ' ';display: block;font-size: 0;line-height: 0;visibility: hidden;width: 0;height: 0;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* ==== Wraps ================================== */
.rowwrap {padding: 0em;margin: 0em;text-align: center;vertical-align: top;}
.wrap {padding: 0em;margin: 0em;text-align: center;vertical-align: top;}
.fiftypercent {width: 50%;}
.cubebutton {font-size: 1em;text-align: left;padding: 0em;margin: 0em 0em 2em 0em;display: block;float: none;clear: both;}
.cubebutton a {
	font-size: 1.5em;
	display: inline-block;
	padding: 0.5em;
	margin: 0em;
	text-align: center;
	max-width: 240px;
}
.cubebutton a {*display: inline;}
/* ==== Show/Hide ==== */
.shown {visibility: visible;}
.hidden {font-size: 0px;line-height: 0px;padding: 0px;margin: 0px;width: 0px;height: 0px;visibility: hidden;display: none;overflow: hidden;}
/* ==== BorderBox Model ============================ */
.bbox {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
/* ==== ContentBox Model ========================== */
.cbox {
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}
/* ==== Button Style (bttn) =========================== */
/* ==== Button Hero ==== */
.bttn, .bttn:visited, a.bttn, a.bttn:visited, input[type=submit].bttn {
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	outline: none;
	display: block;
	color: #FFFFFF!important;
	border: 1px solid #1A2364;
	background-image: none;
	background-color: #1C266C;
}
/* === Button (Transition) === */
.bttn, .bttn:visited, a.bttn, a.bttn:visited, input[type=submit] {
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
/* === Hover State === */
.bttn:hover, .bttn:active, a.bttn:hover, a.bttn:active, input[type=submit]:hover, input[type=submit]:active {
	border-color: #1A2364;
	text-decoration: none;
	color: #1C266C!important;
	background-image: none;
	background-color: #FFF;
}
/* ======== 4 Layout Blocks ========================================== */
html, body {width: 100%;height: 100%;background-color: #111;}
body {font-size: 1em;text-align: center;padding: 0em;margin: 0em;border-style: none;}
/* ==== Element Re-set ==== */
#wrapper, #banner, #footer, #container, #left, #right
{font-size: 1em;line-height: 1.5em;border-style: none;display: block;min-height: 50px;position: relative;}
.wrapper {
	overflow: hidden;
	padding: 0em;
	margin: 0em auto 0em auto;
	width: 80%;
	text-align: center;
	max-width: 1300px;
	z-index: 0;
}
#banner  {
	padding: 0.5em 0em 0em 0em;
	margin: 0em;
	text-align: left;
	float: none;
	clear: both;
	width: 100%;
	z-index: 10;
	background-color: #FFFFFF;
	font-size: 1em;
}
#footer {
	margin: 0em 0em 1em 0em;
	text-align: center;
	line-height:1.25em;
	padding: 0em;
	float: none;
	clear: both;
	z-index: 0;
}
#container {
	padding: 2em 0em 2em 0em;
	margin: 0em 0em 0em 0em;
	text-align: left;
	float: none;
	clear: both;
	width: 100%;
	min-height: 500px;
	z-index: 1;
	background-color: #FFFFFF;
	background-image: url('../images/crossandstorer-exterior.jpg');
	background-repeat: no-repeat;
	background-position: left -1px;
	background-size: 100% auto;
}
body.ourservices #container {
	background-image: url('../images/crossandstorer-booth.jpg');
}
body.aboutus #container {
	background-image: url('../images/crossandstorer-wheel.jpg');
}
body.contactpage #container {
	background-image: none;
}
body.strap #container {
	background-image: url('../images/strap.png');
	background-repeat: repeat-x;
	background-position: left top;
	background-size: auto auto;
}
#left {
	width: 70%;
	float: left;
	padding: 1em;
	margin: 0em;
	text-align: left;
	clear: both;
	z-index: 0;
	background-color: #FFF;
}
#right {
	width: 26%;
	float: right;
	padding: 0em;
	margin: 0em;
	text-align: left;
	clear: none;
	z-index: 0;
}
#left, #right {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
/* == Float Clearing == */
#wrapper:after, #banner:after, #footer:after, #container:after, #left:after, #right:after
{ content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
/* ========== 5 Page Styles ========================================== */
/* ==== Banner ================================= */
.sitelogo {
	text-align: left;
	vertical-align: top;
	font-size: 1em;
	padding: 0em;
	margin: 0em 0em 0.5em 0em;
	max-width: 255px;
	display: block;
	float: left;
	clear: both;
}
.sitelogo img {
	display: block;
	float: none;
	width: 100%;
	height: auto;
}
/* ==== BannerContact ============================ */
.bannercontact {
	font-size: 1em;
	margin: 25px 0em 0em 0em;
	padding: 0em;
	text-align: right;
	display: block;
	float: right;
	clear: none;
	line-height: 1em;
	width: 300px;
}
.bannercontact h6.phonenumber {
	padding: 0em;
	margin: 0em;
	text-align: right;
	font-size: 2em;
	font-weight: 400;
	line-height: 1em;
	color: #444;
}
.bannercontact p {
	text-align: right;
	padding: 0em;
	margin: 0em;
	display: block;
	font-size: 1em;
	line-height: 1.1em;
	font-weight: normal;
}
/* ==== Feature Headings ========================= */
h1.feature {
	border-style: none;
	padding: 0em;
	font-size: 2.5em;
	margin-bottom: 0.5em;
	font-weight: 300;
	color: #FFF;
	text-shadow: 0px -1px 0px #000;
}
h2.feature {
	font-size: 1.25em;
	line-height: 1.5em;
	margin-bottom: 2em;
	font-weight: 600;
	color: #F8F8F8;
	text-shadow: 0px 1px 0px #333;
}
/* ==== Footer Contact =========================== */
#footer h6.qcontact {
	text-align: center;
	margin-bottom: 1em;
	font-size: 1.5em;
	font-weight: bold;
	padding-top: 1em;
	color: #FFFFFF;
}
/* ==== Tel-Buttons ==== */
#footer a.more {font-size: 2em;font-weight: bold;text-align: left;line-height: 50px;padding: 0em 0em 0em 2%;margin: 0em 0.5em 0.5em 0.5em;display: block;clear: both;float: none;text-shadow: none;}
#footer a.more {background-size: 40px 40px;background-repeat: no-repeat;background-position: 98% center;}
#footer a.more.email {background-image: url('../images/icon-email-white.png');}
#footer a.more.tele {background-image: url('../images/icon-phone-white.png');}
#footer a.more.email:hover {background-image: url('../images/icon-email-blue.png');}
#footer a.more.tele:hover {background-image: url('../images/icon-phone-blue.png');}
/* ==== Right Column -============================ */
.imgwrap {
	font-size: 1em;
	text-align: center;
	vertical-align: top;
	padding: 1px;
	margin: 0em 0px 1em 0px;
	display: block;
	background-color: #FFFFFF;
	color: #333;
	border: 1px solid #CCC;
	clear: both;
}
.imgwrap img {
	width: 100%;
	height: auto;
	display: block;
}
/* ==== Opening Times ============================ */
.whitebox {
	font-size: 1em;
	text-align: center;
	padding: 1em;
	margin: 0em 0em 2em 0em;
	border: 1px solid #E6E6E6;
	background-color: #FFFFFF;
}
.opening-times {
	font-size: 1em;
	padding: 0em;
	margin: 0em;
	display: block;
	float: none;
	clear: both;
	text-align: left;
}
.opening-times h6 {
	text-align: center;
	padding-bottom: 0.5em;
	border-bottom: 1px #C0C0C0 solid;
	color: #B30000;
}
.opening-times ul {
	font-size: 1em;
	padding: 0em;
	margin: 0em;
}
.opening-times li {
	font-size: 0.75em;
	text-align: left;
	list-style-type: none;
	list-style-position: outside;
	border-bottom: 1px #E6E6E6 solid;
	padding-bottom: 0.5em;
}
/* == Current Day == */
.opening-times li.istoday, .opening-times li.istoday span {
	color: #006400;
	font-weight: bold;
}
.opening-times li.notopen {
	color: #808080;
}
.opening-times li.notopen.istoday, .opening-times li.notopen.istoday span {
	color: #E10000;
}
.opening-times li:last-of-type {
	margin-bottom: 0em;
	border-bottom: none;
}
.opening-times li span {
	text-align: right;
	font-size: 90%;
	line-height: inherit;
	float: right;
	font-weight: bold;
}
/* ==== Contact Box ============================== */
.bluebox {
	font-size: 1em;
	text-align: center;
	padding: 0em;
	margin: 0em 0em 1em 0em;
	border: 1px solid #1C266C;
	background-color: #1C266C;
}
.contactbox a, .contactbox a:link {color: #FFF;}
.contactbox h5 {
	padding: 16px;
	margin: 0em 0em 16px 0em;
	font-size: 1.1em;
	font-weight: bold;
	color: #1C266C;
	background-color: #FFF;
	border-bottom: 1px #1C266C solid;
	font-family: "robotobold", Arial, Helvetica, sans-serif;
}
.contactbox h6 {
	color: #FFF;
	font-weight: normal;
	margin: 16px 12px 16px 16px;
	text-align: left;
	font-size: 0.8em;
	line-height: 20px;
	font-family: "robotoregular", Arial, Helvetica, sans-serif;
}
/* == Heading Icons == */
.iconhead {
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 20px 20px;
	padding-left: 30px;
	line-height: 20px;
	font-family: "robotoregular", Arial, Helvetica, sans-serif;
}
.posthead {
	background-image: url('../images/iconheading-post.png');
}
.posthead.grey {
	background-image: url('../images/iconheading-post-grey.png');
}
.phonehead {
	background-image: url('../images/iconheading-phone.png');
}
.phonehead.grey {
	background-image: url('../images/iconheading-phone-grey.png');
}
.emailhead {
	background-image: url('../images/iconheading-email.png');
}
.emailhead.grey {
	background-image: url('../images/iconheading-email-grey.png');
}
.faxhead {
	background-image: url('../images/iconheading-fax.png');
}
.faxhead.grey {
	background-image: url('../images/iconheading-fax-grey.png');
}
.contacthead {
	background-image: url('../images/iconheading-contact.png');
	background-position: left center;
	line-height: inherit;
}
.openinghead {
	background-image: url('../images/iconheading-opening.png');
	background-position: left center;
	line-height: inherit;
}

/* ==== VidWrap (padding-bottom 56.25% = 16.9 [9 / 16]) =========
<param name="wmode" value="opaque">
<embed wmode="opaque"
<param name="wmode" value="transparent">
<embed wmode="transparent" ========================== */
.vidwrap {
	border-style: none;
	position: relative;
	padding: 2em 0em 56.25% 0em;
	margin: 0em;
	height: 0px;
	overflow: hidden;
	z-index: 0;
}
iframe, object, embed {border: 0 solid transparent!important;}
.vidwrap iframe, .vidwrap object, .vidwrap embed {position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;wmode:opaque;z-index: 0;border: 0px none transparent;}
body.contactpage .vidwrap {padding: 2em 0em 20.25% 0em;}

/* ==== Services Boxes ============================ */
.services {
	font-size: 1em;
}
.services h3 {
	margin-bottom: 1em;
	font-size: 1em;
	border-style: none;
	font-family: "robotoregular", Arial, Helvetica, sans-serif;
}
.services img {
	padding: 0em;
	font-size: 1em;
	margin-bottom: 1em;
}
.services p {
	font-size: 0.75em;
	text-align: left;
	color: #808080;
}

/* ==== ServicesBox Module ==== */
.servicesbox {
	font-size: 1em;
	line-height: 1.5em;
	text-align: left;
	border: 1px solid #C0C0C0;
	padding: 2em;
	margin: 1em 0em 2em 0em;
	display: block;
	color: #333;
	background-color: #FFF;
	clear: both;
}
.servicesbox:hover, .servicesbox:active {
	background-color: #F2FBFF;
	border-color: #1C266C;
}
/* == Float Clearing == */
.servicesbox:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.servicesbox .gridblock-inner {
	margin-bottom: 0em;
	text-align: right;
}
.servicesbox h3 {
	margin-bottom: 0.4em;
	font-size: 1.5em;
}
.servicesbox p {margin-bottom: 0em;}
.servicesbox .servicesbutton {
	margin: 0em;
	float: right;
}
.servicesbutton {
	font-size: 1.5em;
	text-align: center;
	padding: 0.5em;
	margin: 0.5em 0em 0.5em 0em;
	display: inline-block;
	max-width: 240px;
}
.servicesbutton {*display: inline;}

/* ========== 6 Modules ============================================= */
/* ==== GridBlocks ================================= */
/* ==== GridBlock-Wrap ======== */
.gridblocks-wrap 
{padding: 0em;margin: 0em -1em 0em -1em;text-align: center;vertical-align: top;font-size: 1em;display: block;float: none;clear: both;line-height: 1.5em;}
/* == Float Clearing == */
.gridblocks-wrap:after
{ content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
/* ==== GridBlocks ==== */
.gridblocks-wrap .gridblock,
.gridblocks-wrap .gridblock2,
.gridblocks-wrap .gridblock3,
.gridblocks-wrap .gridblock4,
.gridblocks-wrap .gridblock5,
.gridblocks-wrap .gridblock75,
.gridblocks-wrap .gridblock25,
.gridblocks-wrap .gridblock34,
.gridblocks-wrap .gridblock14,
.gridblocks-wrap .gridblock13,
.gridblocks-wrap .gridblock23,
.gridblocks-wrap .gridblock2third,
.gridblocks-wrap .gridblock1third
{font-size: 1em;line-height: 1.5em;text-align: center;vertical-align: top;padding: 0em;margin: 0em;display: block;width: 100%;height: auto;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
/* ==== Inner ==== */
.gridblock-inner {
	font-size: 1em;
	display: block;
	float: none;
	padding: 0em;
	margin: 0em 0.5em 1.5em 0.5em;
	position: relative;
}
/* ==== GridBlock 100% ======== */
.gridblocks-wrap .gridblock {width: 100%;padding: 0em 0.5em 0em 0.5em;float: none;}
/* ==== GridBlock 50% ======== */
.gridblocks-wrap .gridblock2 {width: 50%;padding: 0em 0.5em 0em 0.5em;float: left;}
/* ==== 50% Float CSS ==== */
.gridblocks-wrap .gridblock2:nth-child(odd) {float: left;clear:both;}
.gridblocks-wrap .gridblock2:nth-child(even) {float: right;clear:none;}
/* ==== GridBlock 33% ======== */
.gridblocks-wrap .gridblock3 {width: 33.33%;float: left;padding: 0em 0.5em 0em 0.5em;}
/* ==== GridBlock 25% ======== */
.gridblocks-wrap .gridblock4 {width: 25%;float: left;padding: 0em 0.5em 0em 0.5em;}
/* ==== GridBlock 20% ======== */
.gridblocks-wrap .gridblock5 {width: 20%;float: left;padding: 0em 0.5em 0em 0.5em;}
/* ==== GridBlock 75+25% ======== */
.gridblocks-wrap .gridblock75 {width: 75%;float: left;clear:both;padding: 0em 0.5em 0em 0.5em;}
.gridblocks-wrap .gridblock25 {width: 25%;float: right;clear:none;padding: 0em 0.5em 0em 0.5em;}
/* ==== GridBlock 3/4+1/4 ======== */
.gridblocks-wrap .gridblock34 {width: 75%;float: right;clear:none;padding: 0em 0.5em 0em 0.5em;}
.gridblocks-wrap .gridblock14 {width: 25%;float: left;clear:both;padding: 0em 0.5em 0em 0.5em;}
/* ==== GridBlock 1/3+2/3 ======== */
.gridblocks-wrap .gridblock13 {width: 33.33%;float: left;clear:both;padding: 0em 0.5em 0em 0.5em;}
.gridblocks-wrap .gridblock23 {width: 66.66%;float: right;clear:none;padding: 0em 0.5em 0em 0.5em;}
.gridblocks-wrap .gridblock2third {width: 66.66%;float: left;clear:both;padding: 0em 0.5em 0em 0.5em;}
.gridblocks-wrap .gridblock1third {width: 33.33%;float: right;clear:none;padding: 0em 0.5em 0em 0.5em;}

/* ========== 7 Form Styles ========================================== */
form {
	width: 100%;
	max-width: 400px;
	padding: 0em;
	margin: 0em 0em 2em 0em;
	font-size: 1em;
	font-weight: normal;
	text-align: left;
}
form ol {
	padding: 0em;
	margin: 0em 0em 0.5em 0em;
	font-size: 1em;
}
form fieldset {
	font-size: 1em;
	text-align: left;
	padding: 1em 0em 0em 0em;
	margin: 0em 0em 1em 0em;
	display: block;
}
label {
	font-size: 1em;
	cursor: pointer;
	display: block;
	font-weight: 500;
	margin-bottom: 0.1em;
}
label.req {color: #B30000;}
/* ==== Validation Images ==== */
input:required:invalid, input:focus:invalid, textarea:required:invalid, textarea:focus:invalid 
{background-image: url('../images/forminvalid.png');background-position: 99% center;background-repeat: no-repeat;-moz-box-shadow: none;background-color: #FFECEC;}
textarea:required:invalid, textarea:focus:invalid {background-position: 99% 0.5em;}
input:required:valid, textarea:required:valid 
{background-image: url('../images/formvalid.png');background-position: 99% center;background-repeat: no-repeat;background-color: #EAFFEA;}
textarea:required:valid {background-position: 99% 0.5em;}
/* ==== Validation Message Div ( <div id="contactform_errorloc" class="error_strings"> ) ==== */
.error_strings{padding: 0em;margin: 0em;font-family: inherit;font-size: 1em;color: #B30000;text-align: left;}
.error_strings ul {font-size: 1em;padding: 0em;margin: 0em 0em 0.5em 0em;list-style-type: none;border-style: none;font-family: inherit;}
.error_strings ul li {font-size: inherit;font-family: inherit;color: #B30000;list-style-type: none;list-style-position: outside;padding: 0em;margin: 0em;}

/* ==== Form Inputs ==== */
input[type=hidden], input[type=text].formCheck{font-size: 0px;border-style: none;padding: 0px;margin: 0px;width: 0px;height: 0px;visibility: hidden;overflow: hidden;display: none;max-width: 0;min-width: 0;line-height: 0px;}
input[type=text], input[type=password], input[type=date], input[type=datetime], input[type=datetime-local], input[type=month], input[type=week], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=url], textarea, select, input[type=file] {
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #CCCCCC;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	color: #7C7C7C;
	display: block;
	font-size: 0.9em;
	font-weight: normal;
	font-weight: normal;
	margin: 0em 0em 0.5em 0em;
	padding: 0.25em;
	text-align: left;
	vertical-align: middle;
	min-width: 100%;
	line-height: 1.25em;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-rendering: optimizelegibility;
}
input[type=file] {border-style: solid;border-width: 1px;}
input[type=text]:focus, input[type=password]:focus, input[type=date]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=month]:focus, input[type=week]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=time]:focus, input[type=url]:focus, textarea:focus, select:focus, input[type=file]:focus {
	box-shadow: 0 0 5px #999999;
	border-color: #999999;
	color: #000000;
}
input[type=text]:focus, input[type=password]:focus, input[type=date]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=month]:focus, input[type=week]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=time]:focus, input[type=url]:focus, textarea:focus, select:focus, input[type=file]:focus {
	background: #FAFAFA;
	border-color: #1C266C;
	box-shadow: 0 0 4px #283699;
	outline: none;
	color: #333;
}
input[type=text][disabled], input[type=password][disabled], input[type=date][disabled], input[type=datetime][disabled], input[type=datetime-local][disabled], input[type=month][disabled], input[type=week][disabled], input[type=email][disabled], input[type=number][disabled], input[type=search][disabled], input[type=tel][disabled], input[type=time][disabled], input[type=url][disabled], textarea[disabled], select[disabled] {
	background-color: #DDDDDD;
}
textarea {
	height: auto;
	min-height: 50px;
	line-height: 1.5em;
	padding: 0.5em;
	vertical-align: top;
	font-size: 0.9em;
	text-align: left;
	text-indent: 0px;
}
select {
	width: 100%;
	min-width: 100%;
}
button, .button, input[type=submit] {
	border-width: 1px;
	border-style: solid;
	padding: 0.5em;
	cursor: pointer;
	font-family: inherit;
	font-weight: bold;
	line-height: 1.1em;
	margin: 0em;
	position: relative;
	text-decoration: none;
	text-align: center;
	display: inline-block;
	font-size: 1.25em;
	float: none;
}
/* ==== IE7 ==== */
input[type=text], input[type=password], input[type=date], input[type=datetime], input[type=datetime-local], input[type=month], input[type=week], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=url], textarea, select, input[type=file] 
{*padding: 0.25em 1% 0.25em 1%;*max-width: 97.9%;*min-width: 97.9%;*box-sizing: content-box;*vertical-align: middle;}
input.req, textarea.req {background-color: #FFECEC;}
input[type=file] {*height: 2em;}
select {*height: 2em;*padding: 0px;*vertical-align: middle;}

/* ======== 8 Navigation / Site-Menu ===================================== */
/* ==== Reset ================================== */
nav, #nav, .nav, menu, #menu, .menu {padding: 0px;margin: 0px;border-style: none;font-size: 1em;position: relative;}
nav ul, #nav ul, .nav ul, menu ul, #menu ul, .menu ul, menu ul ul, #menu ul ul, .menu ul ul  {padding: 0px;margin: 0px;font-size: 1em;}  
nav li, #nav li, .nav li, menu li, #menu li, .menu li {padding: 0px;margin: 0px;list-style-type: none;list-style-image: none;font-size: 1em;}  
nav a:active, #nav a:active,.nav a:active, menu a:active, #menu a:active, .menu a:active {outline: none;}
/* ==== Navigation ============================== */
#nav {
	margin: 0em;
	height: 50px;
	text-align: left;
	padding: 0em;
	background-image: none;
	display: block;
	float: none;
	clear: both;
	z-index: 5;
	font-size: 1em;
	vertical-align: middle;
	line-height: 50px;
	background-color: #FFFFFF;
	border-top-style: solid;
	border-top-color: #E6E6E6;
	border-top-width: 1px;
}
/* ==== SiteMenu =============================== */
menu {
	font-size: 1em;
	padding: 0em;
	margin: 0em;
	display: block;
	float: none;
	clear: both;
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 5;
	text-align: left;
}
menu a, menu a:visited {
	font-size: 1em;
	margin: 0em;
	padding: 0em 2em 0em 1em;
	color: #333333;
	font-weight: normal;
	text-decoration: none;
	display: inline-block;
	height: 100%;
	border-right-style: solid;
	border-right-width: 1px;
	border-right-color: #E6E6E6;
}
menu a:last-of-type {
	border-right-style: none;
}
menu a:hover, menu a:active {
	background-color: #1C266C;
	color: #FFFFFF;
	text-decoration: none;
}
/* ==== SelectMenu ============================= */
.nav select 
{margin: 0em 0em 0em;padding: 0em;min-width: 100%;height: 40px;line-height: 40px;color: #1C266C;text-transform: none;font-weight: bold;font-size: 1.25em;display: block;text-align: left;clear: none;vertical-align: middle;cursor: pointer;border: 1px solid #C0C0C0;background-color: #FFF;outline: none;position: relative;z-index: 5;}
.nav select option 
{border-bottom: 1px #808080 solid;padding: 0.25em;font-weight: normal!important;font-size: 1em !important;text-transform: none;text-decoration: none;background: #FFFFFF !important;line-height: 1.25em;color: #333333;text-indent: 0.25em;outline: none;}
/* ==== Hide Select-Menu ==== */
.nav select {display: none;}

/* ======== 9 Media Queries (devices and browsers)  ========================= */
/* ========== Above 1200px ====================== */
 @media only screen and (min-width: 1199px) {
body  {font-size: 1.25em;}
.wrapper {width: 75%;}

/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Normal (1024>1199px) ================ */
 @media only screen and (min-width: 1024px) and (max-width: 1199px) {
body {font-size: 1.1em;}
.wrapper {width: 90%;}

/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Normal (960>1023px) ================== */
 @media only screen and (min-width: 960px) and (max-width: 1023px) {
body {font-size: 1em;}
.wrapper {width: 94%;}

/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Tablet + Portrait (768>959px) ============ */
 @media only screen and (min-width: 768px) and (max-width: 959px) {
body {font-size: 0.95em;}
.wrapper {width: 98%;}

/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== MenuSwap (767px) ================== */
 @media only screen and (max-width: 767px) {
body {font-size: 0.9em;}
.wrapper {width: 99%;}
.sitelogo {margin-right: 0.25em;}
#container, body.aboutus #container,  body.ourservices #container, body.strap #container {background-image: none;padding: 1em 0em 1em 0em;}
body.contactpage #container {padding: 1em 0.5em 1em 0.5em;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
h1.feature, h2.feature {display: none;visibility: hidden;overflow: hidden;}
#left, #right 
{width: auto;display: block;float: none;margin: 0em 0em 0.5em 0em;text-align: left;min-height: 50px;clear: both;padding: 0.5em;}
.bannercontact {display: none;visibility: hidden;overflow: hidden;padding: 0em;margin: 0em;}
.opening-times h6, .opening-times li, .contactbox h5, .contactbox h6 {font-size: 1em;}
.opening-times h6 {font-size: 1.25em;}
.contactbox h5 {font-size: 1.25em;padding: 12px;}
.contactbox h6 {font-size: 1em;}
#footer {padding: 1em 0em 1em 0em;}
p.copyright, p.sitemap {text-align: center;margin-bottom: 0.5em;display: block;float: none;clear: both;width: auto;}
p.sitemap {margin-bottom: 0em;}
body.contactpage .vidwrap {padding: 2em 0em 45.00% 0em;}
/* ==== Services Boxes ============================ */
.services h3 {margin-bottom: 0.75em;font-size: 1.5em;}
.services p {font-size: 0.9em;}

/* ==== GridBlocks ============================== */
/* == GridBlock-Wrap == */
.gridblocks-wrap 
{margin: 0em -0.5em 0em -0.5em;}
.gridblocks-wrap .gridblock,
.gridblocks-wrap .gridblock2,
.gridblocks-wrap .gridblock3,
.gridblocks-wrap .gridblock4,
.gridblocks-wrap .gridblock5,
.gridblocks-wrap .gridblock75,
.gridblocks-wrap .gridblock25,
.gridblocks-wrap .gridblock34,
.gridblocks-wrap .gridblock14,
.gridblocks-wrap .gridblock13,
.gridblocks-wrap .gridblock23,
.gridblocks-wrap .gridblock2third,
.gridblocks-wrap .gridblock1third
{display: block;padding: 0em;margin: 0em;width: 100%;float:none;clear:both;-moz-box-sizing: content-box;-webkit-box-sizing: content-box;box-sizing: content-box;}
/* ==== SiteMenu =============================== */
/* ==== NavReset ==== */
#nav {background-color: #FFF;padding: 0em 0.5em 0em 0.5em;margin: 0em;border-style: none;width: 100%;height: auto;color: #000000;background-image: none;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
/* ==== Show Select-Menu ==== */
.nav select {display: block;}
/* ==== Hide Menu ==== */
menu {display: none;}
/* ==== Show/Hide ==== */
.shown {visibility: hidden;display: none;}
.hidden {font-size: inherit;line-height: inherit;padding: inherit;margin: inherit;width: auto;height: auto;visibility: visible;display: block;overflow: auto;}
/* ==== Image Flexy ================================= */
img.flexyleft, img.flexyright 
{width: 75%;display: block;float: none;clear: both;margin: 0em auto 1.25em auto;}
/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Mobile + Landscape (480>767px) ======== */
 @media only screen and (min-width: 480px) and (max-width: 767px) {
body {font-size: 0.9em;}
.whitebox , .bluebox {width: 49%;float: left;clear: both;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.bluebox {float: right;clear: none;}
/* ==== Services Boxes ============================ */
.services h3 {margin-bottom: 0.5em;font-size: 2em;}
.services p {font-size: 1em;}

/* ==== GridBlocks ============================== */
.gridblocks-wrap .gridblock2,
.gridblocks-wrap .gridblock3,
.gridblocks-wrap .gridblock4,
.gridblocks-wrap .gridblock5
{width: 50%;float:left;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
/* ==== 50% Float CSS ==== */
.gridblocks-wrap .gridblock2:nth-child(odd),
.gridblocks-wrap .gridblock3:nth-child(odd),
.gridblocks-wrap .gridblock4:nth-child(odd),
.gridblocks-wrap .gridblock5:nth-child(odd)
{float: left;clear:both;padding-right:0.5em;}
.gridblocks-wrap .gridblock2:nth-child(even),
.gridblocks-wrap .gridblock3:nth-child(even),
.gridblocks-wrap .gridblock4:nth-child(even),
.gridblocks-wrap .gridblock5:nth-child(even)
{float: right;clear:none;padding-left:0.5em;}
/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Mobile + Portrait (241>479px) =========== */
 @media only screen and (min-width: 241px) and (max-width: 479px) {
body {font-size: 0.875em;}
.opening-times h6, .opening-times li, .contactbox h5, .contactbox h6 {font-size: 1.25em;}
.opening-times li, .contactbox h6 {font-size: 0.95em;}
/* ==== ServicesBox Module ==== */
.servicesbox .gridblock-inner {text-align: center;}
.servicesbox h3, .servicesbox p {text-align: center;}
.servicesbox p {margin-bottom: 1em;}
.servicesbox .servicesbutton {margin: 0em auto 0em auto;float: none;}

/* ==== Image Flexy ================================= */
img.flexyleft, img.flexyright 
{width: 80%;}
/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ========== Mobile (>240px) ==================== */
 @media only screen and (max-width: 240px) {
body {font-size: 0.85em;}
.opening-times h6, .opening-times li, .contactbox h5, .contactbox h6 {font-size: 0.85em;}
/* ==== ServicesBox Module ==== */
.servicesbox {padding: 1.5em;}
.servicesbox .gridblock-inner {text-align: center;}
.servicesbox h3, .servicesbox p {text-align: center;}
.servicesbox p {margin-bottom: 1em;}
.servicesbox .servicesbutton {margin: 0em auto 0em auto;float: none;}

/* ==== Image Flexy ================================= */
img.flexyleft, img.flexyright 
{width: 90%;}
/* ++++ MQ END ++++ */}/* ++++ MQ END ++++ */
/* ======== 10 FontFace ============================================== */
@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/Roboto-Regular-webfont.eot');
    src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotobold';
    src: url('../fonts/Roboto-Bold-webfont.eot');
    src: url('../fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* ========== Site StyleSheet END ===================================================================================== */