/* =============================================================================
  	Required styling
   ========================================================================== */


img { max-width:100%;}

 /* =============================================================================
  	Responsive Google Map
   ========================================================================== */
.google-maps {
	position: relative;
	padding-bottom: 25%;
	height: 0;
	overflow: hidden;
}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 300px !important;
}

/* =============================================================================
  	Responsive Grid
   ========================================================================== */

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12, .span1_of_3, span2_of_3, .span3_of_3 {
    float:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}

.col {
  margin-left: 2.5%;
  padding-left: 0 !important;
  padding-right: 0 !important;
}


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

.span1{
  width: 6.04166666667%;

}
.span2{
  width: 14.5833333333%;

}
.span3{
  width: 23.125%;

}
.span4{
  width: 31.6666666667%;

}
.span5{
  width: 40.2083333333%;

}
.span6{
  width: 48.75%;

}
.span7{
  width: 57.2916666667%;

}
.span8{
  width: 65.8333333333%;

}
.span9{
  width: 74.375%;

}
.span10{
  width: 82.9166666667%;

}
.span11{
  width: 91.4583333333%;

}
.span12{
  width: 100%;
  margin-left: 0;
}
.col_of_3{
  margin-left: 3%;
}

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

.span1_of_3{
  width: 31.3333333333%;

}
.span2_of_3{
  width: 65.6666666667%;

}
.span3_of_3{
  width: 100%;
  margin-left: 0;
}

/* ===========================================================================================
   Place Grid @media below
   =========================================================================================== */

@media screen and (min-width: 768px) {
	.hidden-desk{display: none;}
	header h1 { float: left;}
	.announcement .btn-theme{font-size: 18px;}
	.border-left{ padding-left: 1.25% !important;margin-left: 1.24%;}
	
	.cricket .border-left{border-left:1px solid #495b14;}
	.supporting .border-left,
	.pathways .border-left{border-left:1px solid #ea0029;}

}

@media screen and (min-width: 768px) and (max-width: 995px){
	.wrapper, footer {
		max-width:768px; overflow: hidden;
	}
	.announcement .btn-theme{font-size: 14px;}
	.bounding { max-width:768px; }
	.bounding img { max-width:125%; overflow: hidden; position: static;}
	nav ul.sf-menu li > a { display: block; padding: 0 0.854em 0; line-height: 3.5em;  }
		body.pathways nav ul.sf-menu > li > a,
		body.cricket nav ul.sf-menu > li > a{padding:0 0.750999em !important;}
/* 	nav ul.sf-menu li:last-child > a { display: block; padding: 0 2.433em 0; line-height: 3.5em;  } */
	div.content .announcement h2 { font-size: 24px; }
	div.content .announcement .btn-blue { max-width: 100%; padding-top: 0px; padding-bottom: 0px; line-height: 1em; font-size: 14px; margin-top: 10px;}

}



@media screen and (max-width: 767px){
	div.content .announcement{background-repeat: no-repeat;}
	header h1 { float: left;width: 130px !important;}
	.announcement .btn-theme{font-size: 14px !important;margin-top: 30px;}
	.hidden-mob{display: none;}
	.footer .contact ul.details{margin-top: 30px;float: none !important;text-align: center;}
	.wrapper, footer {
	max-width:480px; overflow: hidden;
	}
	
	div.content .announcement{padding: 3% 4%;}

	.bounding { width: 480px; }
	.bounding img { max-width:125%; overflow: hidden; position: static;}
	.span12, .span11, .span10, .span9, .span8, .span7, .span6, .span5, .span4, .span3, .span1_of_3 { width:100%; }

	.col, .col_of_3 {margin-left:0;}
	/*.overlay { display: none;}*/
	.sf-menu li a { padding: 0;}
	
	.footer .span4{width: 65.6666666667% !important;}
	.footer .span8{width: 33.8333333333% !important;}
	
	
	div.content .announcement .btn-blue { max-width: 100%; padding-top: 0px; padding-bottom: 0px; line-height: 1em; font-size: 14px; margin-top: 10px;}
	.info_box_1, .info_box_2, .info_box_3 { margin-bottom: 10px }
	.boxes ul li h3 { font-size: 16px; padding: 3%;}
/* 	.static img {max-width: 175%; } */
	.google-maps {
		position: relative;
		padding-bottom: 75%;
		height: 0;
		overflow: hidden;
	}
	.inner .ourteams ul li .left {
		float: left; width: 100%;
	}
	.inner .ourteams ul li .right { display: none; }

	.inner form input[type=text], .inner form input[type=email], .inner form textarea {
		border: 1px solid #DDDDDD;
		padding: 3%;
		width:94%;
		margin-bottom: 2%;
		font-size: 14px;
	}
}

@media screen and (max-width: 480px){
		.announcement .btn-theme{font-size: 16px;}
	header h1 {text-align: center; width: 100% !important;}
	header h1 img{width: 100px !important}
	header{background-color: #eb0029;background-image: none !important;}
	header .contact .highlight,
	header .contact a,
	header .contact .address{text-align: center}
	.wrapper, footer {
		max-width:320px; overflow: hidden;
	}
	header { margin: 0;}
	header .contact { float: left; text-align: left; }
	div.content .announcement h2 { font-size: 18px; }
	div.content .announcement .btn-blue { max-width: 100%; padding-top: 0px; padding-bottom: 0px; line-height: 1em; font-size: 14px; margin-top: 10px;}

	.boxes ul li h3 { font-size: 16px; padding: 3%;}

	.bounding { width: 320px; }
	.bounding img { max-width:150%; overflow: hidden; position: static;}
	.footer .contact, .footer .address {
		text-align: left;
	}
	.footer .contact ul.details, .footer .contact ul.social-32 { float: left; }

}

/* ===========================================================================================
   Clear spacing
   =========================================================================================== */

/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}

.cf:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
    *zoom:1;
}