
/*font-family: "Lato", sans-serif;


/*
Site Colours

light-blue {background-color:#2D93D5;}
dark-blue {background-color:#174D71;}
light-grey {background-color:#E6E6E6;}

*/


body { 
margin: 0px;
color:#3f3f3f;
	background-color: #ffffff;
	font-family: "Lato", sans-serif;
	padding: 0px;

}



.logo { 
max-width: 300px; 
margin-top: -170px; 
z-index: 1000; 
position: absolute;
}

.logo_mobile { display: none; }


header
{background-color: #ffffff;
color:#fb4e55;
width: 100%;
margin: auto auto;
}

.col{
	word-wrap: break-word;
}

#banner {

	
	
	
	width: 100%;
	max-height: 395px;
	margin-bottom:0px;
	
}



.wrapper, #content{ 

width: 80%;
margin: auto auto;
padding-left: 10%;
padding-right: 10%;
}


.right { text-align: right; }

.spacer { clear: both; height: 5px; width: 100%;
}

.center {text-align: center;
margin-right: auto;
margin-left: auto;}



#content {
	
	background-color: #fffffff;
	padding-top:0px;
	
}




h1 {
	
	font-size: 2em;
	font-weight: 700;
	color: #2D93D5;

}

h2 {
	
	font-size: 1.5em; /* 24px */
	font-weight: 700;
	color: #2D93D5;
margin-bottom: 10px;

}



h3 {
	font-size: 1.3em; /* 24px */
	font-weight: 700;
	color: #2D93D5;
margin-top: 0px;
margin-bottom: 5px;
}


p, li {
	
	font-size: 1.2em; 
	font-weight: 400;
	color: #174D71;
	line-height: 1.5em; /* 36px */
	margin-top: 0px;
}




a {
	color: #174D71; /* Dark blue */
		font-size:1.125em; /* 21px */
		font-weight:700;
		text-decoration:none;
}

a:hover { color: #81BEE6;}


.button-blue {
	padding: 2% 2%;
	display: inline-block;
	background-color:  #2D93D5; 
	color: #fff;
	
	font-family: "Lato", sans-serif;
	font-weight: bold;
	margin-top:20px;
}






.button-blue:hover {
	background-color: #fff; 
	color: #2D93D5;
}


.img-respond { width:100%; height:auto; display:block;}

hr
{color: #174D71;}


.bluebg
{
	background-color:  #174D71;
	color: #ffffff;
}
.bluebg p, .bluebg li, .bluebg h2, .bluebg h3, .bluebg a  {color: #ffffff; padding: 10px 20px;}

.greybg
{
	background-color: #E6E6E6;
	color: #174D71;
}
.greybg p, .greybg li, .greybg h2, .greybg h3  {color: #174D71; padding: 20px 20px;}
.greybg h3  {padding-bottom: 0;}
footer { 

color: #ffffff;
width: 100%;
} 

.footer_content { 
background: #174D71; 	
color:#ffffff;

	}
 footer h1, footer p {
	
	 line-height: 110%;
	
 }
 

 
 footer p{
	 font-size:1em;
	 font-weight:400;
	 color: #ffffff;
	  font-family: "Lato", sans-serif;
	 
 }
footer a:visited, footer a:link

{ 
color:#ffffff;
text-decoration: none;
font-weight: 400;
font-family: "Lato", sans-serif;
	font-size:1em;
	
}
	
.bottom-bar p {font-size:0.85em;  font-family: "Lato", sans-serif; text-transform: none;}

.logo { 

max-width: 449px;
max-height: 181px;

}

table {
	width:100%;
}

th, thead {
	background-color: #2d93d5;
	color: #fff;
	font-weight: 400;
	letter-spacing: 1px;
	padding: 10px;
	text-align: center
}

tr:nth-child(even) {
	background-color: #f2f2f2;
}

tr:nth-child(odd) {
	background-color: #fff;
}

td {
	text-align: center;
}

td p, td p a {
	margin:0;
	padding:0;
}

td p a {
	padding:8px 0;
}

td p:first-child  {
	border-bottom: solid 2px #fff;
}



.clear {
	clear:both;
}


/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.nomargin {
	
	margin: 0% 0 0% 1.6%;
}


.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF TWELVE  */
.span_12_of_12 {
	width: 100%;
}

.span_11_of_12 {
  	width: 91.53%;
}
.span_10_of_12 {
  	width: 83.06%;
}

.span_9_of_12 {
  	width: 74.6%;
}

.span_8_of_12 {
  	width: 66.13%;
}

.span_7_of_12 {
  	width: 57.66%;
}

.span_6_of_12 {
  	width: 49.2%;
}

.span_5_of_12 {
  	width: 40.73%;
}

.span_4_of_12 {
  	width: 32.26%;
}

.span_3_of_12 {
  	width: 23.8%;
}

.span_3_of_12_left {
  	width: 23.8%;
}



.span_2_of_12 {
  	width: 15.33%;
}

.span_1_of_12 {
  	width: 6.866%;
}

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF FIVE  */
.span_5_of_5 {
	width: 100%;
}
.span_4_of_5 {
	width: 79.68%;
}
.span_3_of_5 {
	width: 59.36%;
}
.span_2_of_5 {
	width: 39.04%;
}
.span_1_of_5 {
	width: 18.72%;
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 650px) {
	.col {  margin: 1% 0 1% 0%; }
	.span_1_of_5, .span_2_of_5, .span_3_of_5, .span_4_of_5, .span_5_of_5 { width: 100%; }
}


#content img { 
width: 100% !important;
height: auto !important;
}

.footer-logos .col img { 
width: 100% !important;
height: auto !important;
}


.gallery { 
width: calc(25% - 10px); 
float: left; 
margin: 5px;
}

.developers a { color: #000; text-decoration: none; }


.gallery_container { width: 100%; margin: auto auto; }


div.shop {
  width: 100%
  
  

}
div.shop img {
  height: 100%;
  width: 100%;

  object-fit: cover; /* Do not scale the image */
  object-position: center; 
  
}


div.shop:before{
  content:'';
  padding-top:100%;/* vertical value as  100% equals width */
  float:left;
}

#form form { width: 100%; }

#form form input {
	width: 100%;
	border: 1px solid #cccccc;
	min-height: 30px;
	text-align:  left;
}

#form form textarea { width: 100%; min-height: 100px;}

#form form input[type="submit"] { text-align: center; font-weight: bold; background-color: #174D71; color: #ffffff; }

#form form input[type="checkbox"] { text-align: left; font-weight: bold; width: 20px; }

form.contact input, form.contact textarea{width:100%;margin-top:10px;height:30px;line-height:30px;font-size:1em;border:0px;background:#ffffff;}
form.contact textarea{height:120px;}
form.contact{text-align:left;font-size:1em;}
form.contact submit {background-color: #174D71; color: #ffffff;}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 650px) {
	
.col {  margin: 0% 0 0% 0%; }
    
    .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12, .span_3_of_12_left {
	width: 100%; 
	margin-bottom: 20px;
	}
	
	#banner { display: none; }
	
	.right { text-align: left; }
	
	.leftcol { display: none; }
	
	.gallery { 
width: calc(100% - 10px); 
float: none; 
margin: 5px;
}

	
}



@media (max-width:900px) and (min-width:600px) {
	h3 {font-size: 1.1em;}
	
	
	.span_3_of_12 {width: 47%;}
	.span_3_of_12:nth-child(2n+1) {
		clear: both;
	margin-left: 0;

}
}


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

.logo, #banner { 
display: none;
}


.logo_mobile { display: block; width: 300px; margin: auto auto; }

}