/*
	SCREEN.CSS
	NOTES:		This style sheets sets the base styles for all resolutions before declaring size based style sheets.
	UPDATED:	2012/10/17
	UPDATED BY:	David Dowdall
	
	CREDITS:	
	
	GUIDE:		To work out font size in EM, it is the pixels you want divided by 16 (e.g. 20px would be 20 / 16 = 1.25em )
				To work out element width in %, the formula is: Element Width / Contain Element Width X 100 (e.g. (300 / 960) X 100 = 31.25%)
*/

body {
	border-top:10px solid #f79433;
}

a {color:#f79433;text-decoration:none;}

/*	Container is being used to specify a maximum width for the design.
	This is optional and could be made fully fluid. */
.container {
	max-width:1200px;min-width:320px;
	margin:0 auto;
}

/*	This section contains the bases for all custom styles and element placements.
	The default styles below are not required and can be edited or removed. */
header {
	position:relative;
	height:9.375em; /* height:150px */
	
	/*	The demo image was provided for free by user FurmanAnna on iStockPhoto.com
		File #21026176 (This notice can be removed on replacement)
	background-image:url('../images/demo-feature-320.jpg');
	background-size: 100% auto;
	background-origin: content-box;
	background-repeat:no-repeat; */
}
header .logo {
	max-width:80%;
	margin-left:-40%;
	position:absolute;
	top:10%;left:50%;	
}

header span.cta {
	display:none;
}
header span.strapline {
	display:none;
}
header span.number {
	display:block;
	position:absolute;
	top:161px;right:10px;
	
	color:#f79433;
	font-weight:400;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.25em; /* fallback */ font-size: 1.25rem; /* 20px */
}

nav {
	width:100%;height:55px;
	margin-bottom:10px;
	background-image:url('../images/bg-nav.png');
	background-position:center center;
	background-size:100% 100%;
}
nav ul {margin:0;padding:0 10px;}
nav ul.switch {display:block;}
nav ul.menu {
	display:none;
	position:absolute;
	top:0;left:0;
	min-width:320px;max-width:33%;
	padding:15px 0;
	background:#fafafa;
	z-index:50;	
}
nav ul.business {display:none;}
nav ul li {float:left;margin-right:25px;}
nav ul.menu li {float:none;margin-left:25px;}
nav ul li a {
	color:#f79433;
	line-height:55px;
	text-decoration:none;
	text-transform:uppercase;
	font-size: 0.875em; /* fallback */ font-size: 0.875rem; /* 14px */
}
nav ul li a:hover {
	color:#1f1f1f;
}
nav ul li a.menu {
	display:block;
	width:150px;
	margin:0;padding:0 0 0 39px;
	background-image:url('../images/icn-menu.png');
	background-position:center left;
	background-repeat:no-repeat;
}
nav ul li a.home {
	display:block;
	width:24px;
	margin:0;padding:0 0;
	background-image:url('../images/icn-home.png');
	background-position:center center;
	background-repeat:no-repeat;
}
nav ul ul {
	display:none;
}
nav ul ul {
	z-index:50;
	padding:5px 0;
	background-image:url('../images/bg-trans-80.png');
}
nav ul.menu ul li, nav ul ul li {
	margin-left:5px;
	margin-right:5px;
	margin-top:5px;
	margin-bottom:5px;
}
nav ul ul li a {
	display:block;
	padding:5px 10px;
	-webkit-border-radius:5px;
	border-radius:5px;
	color:#fff;
	font-size:14px;
	line-height:35px;
	background-color:#CD8C00;
}

.rslider div.top-form {
	position:absolute;
	top:20px;right:50%;
	width:290px;height:225px;
	margin-right:-160px;padding:0 15px;

	background-image:url('../images/bg-top-form-trans.png');
	background-position:top center;
	background-repeat:repeat-x;	
	
	border:0;
	-webkit-border-radius:5px;
	border-radius:5px;
}
.rslider div.top-form span.title {
	display:block;
	color:#fff;
	font-weight:700;
	line-height:48px;
	text-align:center;
	text-transform:uppercase;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1.0625em; /* fallback */ font-size: 1.0625rem; /* 17px */
}
.rslider div.top-form span.line {
	display:block;
	text-align:center;
	font-family: 'Open Sans', sans-serif;
}
.rslider div.top-form span.line01 {
	margin-top:10px;
	color:#f79433;
	line-height:30px;
	font-size: 1em; /* fallback */ font-size: 1rem; /* 16px */
}
.rslider div.top-form span.line02 {
	height:25px;overflow:hidden;
	color:#fff;
	font-weight:700;
	line-height:25px;
	font-size: 1em; /* fallback */ font-size: 1rem; /* 16px */
}
.rslider div.top-form span.line03 {
	color:#fff;
	font-weight:700;
	line-height:25px;
	font-size: 1.5em; /* fallback */ font-size: 1.5rem; /* 24px */
}
.rslider div.top-form span.line04 {
	margin-top:5px;
	color:#f79433;
	line-height:14px;
	font-size: 0.75em; /* fallback */ font-size: 0.75rem; /* 12px */
}

.rslider div.top-form div.callback {
	margin-top:-3px;
}
.rslider div.top-form div.callback input.input {
	outline:none;
	width:90px;
	padding:5px 10px;
	background-color:#5d5d5d;
	color:#ccc;
	font-size: 0.75em; /* fallback */ font-size: 0.75rem; /* 12px */
	border:0;
	-webkit-border-radius:5px;
	border-radius:5px;
}
.rslider div.top-form div.callback input.submit {
	width:60px;
	margin:15px auto;padding:2px 10px;
	
	border:1px solid #f79535;
	-webkit-border-radius:2px;
	border-radius:2px;
	
	color:#fff;
	font-weight:700;
	text-align:center;
	text-transform:uppercase;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 0.875em; /* fallback */ font-size: 0.875rem; /* 14px */
	
	background: #fab775;
	background: -moz-linear-gradient(top, #fab775 0%, #f79535 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fab775), color-stop(100%,#f79535));
	background: -webkit-linear-gradient(top, #fab775 0%,#f79535 100%);
	background: -o-linear-gradient(top, #fab775 0%,#f79535 100%);
	background: -ms-linear-gradient(top, #fab775 0%,#f79535 100%);
	background: linear-gradient(to bottom, #fab775 0%,#f79535 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fab775', endColorstr='#f79535',GradientType=0 );
}

.rslider div.banner {
	display:none;
}

article {
	padding:0 1.370%;
	font-size: 0.875em; /* fallback */ font-size: 0.875rem; /* 14px */
}

section.side-form {
	display:none;
}

footer {
	margin:40px 0 0 0;padding:30px 1.370% 30px 1.370%;
	background-color:#f79433;
	
	color:#fff;
	font-size: 0.75em; /* fallback */ font-size: 0.75rem; /* 12px */
}
footer a {color:#fff;}
footer span.icons {
	font-size:3em;
}

/* ----- SHARED STYLES ----- */

.rounded { -webkit-border-radius:0.63em; border-radius:0.63em; }

/* ----- FORM STYLES ----- */

input, select, textarea {padding:0.31em;}

/* ----- RESPONSLIDER ----- */

.rslider {
	position:relative;
	height:16.5625em; /* height:375px */
	margin-bottom:30px;
	border-bottom:5px solid #000;
}

.responslider {
	position:absolute;
	top:0;left:0;
	width:100%;height:100%;
	
	background-size:cover;
	background-origin: content-box;
	background-repeat:no-repeat;
	background-position:top center;
}
.responslider1 {
	background-image:url('../images/main/01.jpg');
}
.responslider2 {
	background-image:url('../images/main/02.jpg');
}
.responslider3 {
	background-image:url('../images/main/03.jpg');
}
.responslider4 {
	background-image:url('../images/main/04.jpg');
}
.responslider5 {
	background-image:url('../images/main/05.jpg');
}
.responslider6 {
	background-image:url('../images/main/06.jpg');
}
.responsliderPrev {
	position:absolute;
	left:20px;top:30%;
	cursor:pointer;
	font-size:4em;
	color:#fff;
	
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */
}
.responsliderNext {
	position:absolute;
	right:20px;top:30%;
	cursor:pointer;
	font-size:4em;
	color:#fff;
	
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */
}
.responsliderPrev:hover, .responsliderNext:hover {
	opacity:0.8;
	filter:alpha(opacity=80); /* For IE8 and earlier */
}

div.blog div.sidebar {display:none;}

div.blog div.blog-excerpt {padding:10px 10px 20px;margin-bottom:20px;border-bottom:1px solid #555;}

div.blog div.blog-excerpt div.excerpt-thumb {float:left;margin:20px 25px 10px 0;}

/* ----- TYPOGRAPHY ----- */

	/* The first rule should never need to be adjusted */
	html {
		-webkit-text-size-adjust: 100%; /* 2 */
		-ms-text-size-adjust: 100%; /* 2 */
		text-rendering: optimizeLegibility; /* using kerning and ligatures http://www.aestheticallyloyal.com/public/optimize-legibility/ */
	}

	html, button, input, select, textarea {
		/* This is setting the default font styling for the whole document (100% = 16px) */
		font:100%/1.625 'Open Sans', sans-serif; /* font-size: 16px, line-height: 26px */
	}
		 
	h1, h2, h3, h4, h5, h6 {
		/* em fallback */ margin-top: 1em; margin-bottom : 0.5em;
		margin-top: 1rem; margin-bottom :0.5rem;
		font-family: 'Open Sans Condensed', sans-serif; text-transform: uppercase; font-weight: normal;
		/* http://blogs.msdn.com/b/ie/archive/2012/01/09/css-corner-using-the-whole-font.aspx */
		-moz-font-feature-settings    : "liga=1, dlig=1";
		-ms-font-feature-settings     : "liga", "dlig";
		-webkit-font-feature-settings : "liga", "dlig";
		-o-font-feature-settings      : "liga", "dlig";
		font-feature-settings         : "liga", "dlig"; }
	
	h1 {
		/* em fallback */ font-size: 2em;
		font-size: 2rem; line-height: 1.375; }
	h2 {
		/* em fallback */ font-size: 1.75em;
		font-size: 1.75rem; line-height: 1.5714285714; }
	h3, h4, h5, h6 {
		/* em fallback */ font-size: 1.375em;
		font-size: 1.375rem; line-height : 1; }
	p, ul, blockquote { 
		/* em fallback */ margin-bottom: 1.375em;
		margin-bottom: 1.375rem; }
		
		
/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix {
  zoom: 1;
}