/*MOBILE FIRST CSS*/

body, html {
margin: 0;
padding: 0;
text-align: left;
background: #FFF;
font-family: "futura-pt", Arial, sans-serif;
height: 100%;    
}

#supercontainer {
	width: 100%;
	max-width: 1160px;
	margin: 0 auto;
	
}


.bg {
  /* The image used */
  background-image: url("/images/closed.jpg");

  /* Full height */
  height: 100%; 

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

p {
	color: #63595c;
	font-size: 18px;
	font-weight: 300;	
}




li {
	color: #63595c;
	font-size: 18px;
	line-height: 22px;
	font-weight: 300;	
}

.lead p {
	font-size: 21px;
	font-weight: 200;
}

.lead h1 {
	font-weight: 300;
	font-size: 32px;
	color: #242424;
}

.message {
	clear: both;
	margin: 0 auto;
	text-align: center;
	font-size: 10px;
	color: #939393;
	padding: 20% 24px;
}

.message p {
	font-size: 18px;
	font-weight: 200;
}

h1, h2, h3, h4, h5 {font-weight: 400;}

h1 {font-size: 32px; color: #242424;}
h2 {font-size: 28px; color: #242424;}
h3 {font-size: 24px; color: #787c77;}
h4 {font-size: 20px; color: #787c77;}
h5 {font-size: 18px; font-style: italic; color: #787c77;}

.button {font-size: 20px; font-weight: 400;}
	
a {
	color: #632c3c;
	text-decoration:none;
}
a:visited {
	color: #632c3c;
}
a:hover {
	color: #999;
}

.centrelink p {
	text-align: center;
	padding: 18px 0 6px 0;
}


a:active {
	color: #999;
}

.address a {
	color: #6ec829;
	text-decoration:none;
	font-weight: 700;
}
.address a:visited {
	color: #6ec829;
}
.address a:hover {
	color: #999;
}

.address a:active {
	color: #999;
}

.masthead {
	margin: 0; 
	padding: 36px;
	float:left;
	height: 32px;
	width: 80%;
	background-color: #fff;
}

.krplogotext {
	display: inline-block;
	margin: 0;
	padding: 0;
	float: left;
	height: auto;
}

.colourtext {
	margin: 0 0 0 4px;
	padding: 0;
	font-family: "futura-pt", "Arial Black", sans-serif;
	font-weight: 800;
	font-size: 21px;
	line-height: 32px;
}

.colourtextsub {
	font-family: "futura-pt", "Arial Black", sans-serif;
	font-weight: 800;
	font-size: 21px;
	margin: -12px 0 0 0;
	padding: 0;
	color: #731c75;
	letter-spacing: 6px;
}

.textcolour1 {
	color: #509ABA;
}
.textcolour2 {
	color: #689965;
}
.textcolour3 {
	color: #DDA637;
}
.textcolour4 {
	color: #B269B2;
}
.textcolour5 {
	color: #CECA41;
}
.textcolour6 {
	color: #6D66AA;
	
}
.textcolour7 {
	color: #A3B2AD;
	
}
.textcolour8 {
	color: #C42A6F;
}
.textcolour9 {
	color: #46C157;
}
.textcolour10 {
	color: #0092FF;
}

.textcolour11 {
	color: #ffffff;
}
.textcolour12 {
	color: #000000;
}

.heroimage {
width: 100%;
margin: 0 auto;
padding:0;
}

.heroimage img {
	margin: 0;
    width: 100%;
	height: auto;
}




#topbar { display: none;
	width: 100%;
	height: 32px;
	top: 0;
	left: 0;
	background: #f7f7f7;
}

#topbar img {
	height: 32px;
	top: 0;
	left: 0;
	border-right: 1px solid #ffffff;
}

#toppageimage {
width: 100%;
overflow: hidden;
margin:0;
padding:0;
background: #6ec829;
background: none;
}

#toppageimage img {
	width: 100%;
	margin: 0 auto;
	height:auto;
	display: block;
	max-width: 940px;
}

.mapclass {
	width: 100%;
	margin: 0 auto;
	height:auto;
	display: block;
	max-width: 940px;
	pointer-events: none;
}

	

#container {
	position:relative;
	display:block;
	width: 100%;
	overflow: hidden;
	margin:0 auto;
	padding:0;
	text-align:center;
}

.content {
	display: block;
	width: 90%;
	margin:0 auto;
	padding:0;
	text-align: left;
	max-width: 860px;
}
	

.sectionbreak {
	margin: 32px 0;
	width: 100%;
	height: 20px;
	background: #f7f7f7;
	border-top: 1px solid #242424;
}
	

#floatinglogo {
	width: 100%;
	text-align:center;
	margin: 0 auto;
	z-index: 100;
	position:absolute;
	top: 36px;
	left: 0;
}

#floatinglogo img {
	width: 80%;
	padding: 0 0 4px 0;
	height: auto;
}

#floatinglogo p {
	color: #ffffff;
	font-size: 18px;
	font-weight: 400;
}

.topquote {
	margin: 0 auto;
	text-align: center;
	width: 90%;
	padding: 24px 0 36px 0;
	height: auto;
}

.topquote p {font-size: 19px;}

.topquote a {
	font-size: 14px;
	color: #393e3f;
	font-weight: 300;
	padding: 4px 6px;
}
.topquote a:visited {
		color: #393e3f;
}

.topquote a:hover {
		background: #f4f8f9;
		border-radius: 8px;
}
.topquote a:active {
		background: #f4f8f9;
		border-radius: 8px;
	}
	
.midquote {
	margin: 0 auto;
	text-align: center;
	width: 100%;
	padding: 0;
	display:block;
	position:relative;
	height: 240px;
}

.midquote p {
	margin: 0;
	font-size: 20px; 
	font-style:italic;
}
.midquotewide {
	display: none;
}
.awards {
	display: block;
	height: 200px;
	width: auto;
}

.whitelink a {
	display:inline-block;
	font-size: 14px;
	margin: 0 0 8px 0;
	color: #63595c;
	color: #ffffff;
	font-weight: 300;
	padding: 4px 6px;
}

.whitelink a:visited {
	color: #63595c;
	color: #ffffff;
	
}

.whitelink a:hover {
		background: #ffffff;
		background: #c5e8ba;
		border-radius: 8px;
	
}
.whtelink a:active {
		background: #ffffff;
		background: #c5e8ba;
		border-radius: 8px;
	}

.frontpagesection {
	margin: 0 auto;
	text-align:center;
	padding: 0;
	width: 100%;
	overflow: hidden;
}

.frontpagebottomsection {
	clear:both;
	margin: 0 auto;
	text-align:center;
	padding: 24px 0 8px 0;
	width: 100%;
	overflow: hidden;
}

.frontpagebottomsection img {
	display: block;
	margin: 0 auto;
	height: 60px;
	width: auto;
}

.footnote p {
	line-height: 13px;
	font-size: 13px;
	font-style: italic;
}

.green {background: #779937;}
.blue {background: #2f73a2;}
.purple {background: #8b6298;}
.yellow {background: #ccc53e;}
.grey2 {background: #ededed;}
.grey {background: #242424;}
.red {background: #000000;}

.teamlist {
	width: 100%;
	height: 60px;
	text-align: left;
	margin: 0 0 18px 0;
}

.teamlist img {
	display:block;
	height: 60px;
	float: left;
	padding: 0 12px 0 0;
}

.teamlist p {
	font-size: 14px;
	font-weight: 500;
}

.teamlist a {
	color: #63595c;
}
.teamlist a:visited {
	color: #63595c;
}
.teamlist a:hover {
	color: #6ec829;
}


	
.teamlist a:active {
	color: #63595c;
}	
	

	
	

.sectionpictureleft {
	margin: 0;
	width: 100%;
	height: auto;
	float:left;
}

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

.sectionpictureright {
	margin: 0;
	width: 100%;
	height: auto;
	float:right;
}

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

.sectioncopyright {
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	
}
.sectioncopyright p {
	margin: 0;
	font-size: 18px;
	line-height: 36px;
	color: #63595c;
	color: #ffffff;
}

.sectioncopyright a {
	margin: 0;
	font-size: 16px;
	line-height: 32px;
	font-weight: 300;
	color: #63595c;
	color: #ffffff;
}

.sectioncopyright a:visited {
	color: #ffffff;
}

.sectioncopyright a:hover {
	color: #ed8014;
}


.colourbar {
	background: #f7f7f7;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 12px;
}

.footer {
	display: inline-block;
	width: 100%;

	background: #4c4c4c;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}

.footercontent {
	display: inline-block;
	margin: 0 auto;
	padding: 32px 0;
	width: 100%;
	height:auto;
	
	color: #ffffff;
	max-width: 460px;
}

.footercontent p {
	color: #ffffff;
	font-size: 16px;
	margin: 0;
}

.footercontent a {
	color: #ffffff;
	text-decoration:none;
	font-size: 16px;
	font-weight: 300;
}
.footercontent a:visited {
	color: #ffffff;
}


.footercontent a:hover {
	color: #ed8014;
}
.footercontent a:active {
	color: #ed8014;
}

.footercolumn {
	width: 50%;
	float: left;
	padding: 12px 0 12px 0;
}

.footerbottom {
	clear:both;
	width: 90%;
	margin: 0 auto;
	text-align: center;
}

.footerbottom p {
	font-size: 11px;
}

.footerbottom img {
	width: 260px;
	height: auto;
	padding: 6px 0;
}

#endorsements {
	clear:both;
	width: 100%;
	display:block;
	margin: 0 auto;
}


.cycle-slideshow { width: 90%; height: 460px; margin: 20px auto;}	 
	 

#endorsements p {
	margin: 20px;
	text-align:justify;
	font-size: 14px;
	font-weight: 400;
	font-style: italic;
}

.bigquote {
	font-weight: 700;
	color: #b11f24;
}



/* DROP CONTENT CSS */
.moredrop {
	position: relative;
	text-align: left;
	width: 100%;
	height: auto;
	z-index: 1000;
}

.morethumb {
	margin: 0;
	padding: 0 8px 0 0;
	height: 36px;
	width: auto;
	float: left;
}
.morebutton {
	width: 20px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	margin-bottom: 12px;
	display: block;
	border-radius: 10px;
}
.morebutton:hover  {
	background: #ffffff;
	background: #bcb8b9;
}
.moredrop ul {
	font-weight: 300;
	font-size: 14px;
	list-style: none;
	}
.moredrop li {
	display: inline;
	line-height: 36px;
}
.moredrop li a {
	text-decoration: none;
	background: #ededed;
	color: #292b2b;
}
.moredrop ul li a:hover {
	background: #e8e5bf;
	background: #bcb8b9;
}
.moredrop ul li a:active {
	background: #e8e5bf;
	background: #bcb8b9;
}
a.more-link {
	display: block;
	text-decoration: none;
	line-height:28px;
	color: #393e3f;
	font-weight: 300;
}

nav[role=morelinks] {
	clear: both;
	-webkit-transition: all 0.3s ease-out;  
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.js nav[role=morelinks] {
	overflow: hidden;
	max-height: 0;
}		
nav[role=morelinks].active {
	max-height: 300em;
	background: #fff;
}
nav[role=morelinks] ul {
	margin: 0;
	padding: 0;
	border-top: 2px solid #ffffff;
}
nav[role=morelinks] li a {
	display: block;
	height: 36px;
	padding: 0;
	border-bottom: 2px solid #ffffff;
}

/* DROP NAVIGATION CSS FOR MOBILE NAV */
.mainnavbar {
	position: relative;
	text-align: center;
	width: 100%;
	height: auto;
	z-index: 1000;
	
}
.mainnavbar ul {
	font-weight: 300;
	list-style: none;
	}
.mainnavbar li {
	display: inline;
	line-height: 180px;
}
.mainnavbar li a {
	text-decoration: none;
	background: #ededed;
	color: #292b2b;
}
.mainnavbar ul li a:hover {
	background: #bcb8b9;
}
.mainnavbar ul li a:active {
	background: #bcb8b9;
}
a.menu-link {
	float: right;
	padding: 0;
	text-decoration: none;
	line-height: 32px;
	color: #393e3f;
	font-weight: 300;
}
.menu-link img {
	float: right;
	padding: 0;
	margin: 7px 4px;
	height: 18px;
	width: 18px;
}		
nav[role=navigation] {
	clear: both;
	-webkit-transition: all 0.3s ease-out;  
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.js nav[role=navigation] {
	overflow: hidden;
	max-height: 0;
}		
nav[role=navigation].active {
	max-height: 300em;
}
nav[role=navigation] ul {
	margin: 0;
	padding: 0;
	border-top: 2px solid #ffffff;
}
nav[role=navigation] li a {
	display: block;
	padding: 8px 0 8px 16px;
	border-bottom: 2px solid #ffffff;
}

body#front a#frontnav,
body#about a#aboutnav,
body#team a#teamnav,
body#news a#newsnav,
body#contact a#contactnav {
	display:none;
}


  /********************/
 /*SCREEN SIZE BREAKS*/
/********************/

  /**********/
 /*MN 375px*/
/**********/

@media screen and (min-width: 375px) {
#floatinglogo img { width: 70%; padding: 0 0 6px 0;}
#floatinglogo p { font-size: 22px;}		
.topquote p {font-size: 22px;}
#endorsements p { font-size: 16px;}
}

  /**********/
 /*MN 480px*/
/**********/

@media screen and (min-width: 480px) {
body {background: white;}	
#heroimage { margin: 0; width: 100%;}
#heroimage img { margin: 0; width: 100%; height: auto; }
#floatinglogo { top: 24px;}
#floatinglogo img { width: 60%; padding: 0 0 9px 0;}
#floatinglogo p { font-size: 24px;}		
.topquote {width: 90%;}
.topquote p {font-size: 26px;}
.topquote a {font-size: 16px;}
.cycle-slideshow { height: 400px;}
.whitelink a {font-size: 15px;}
.sectioncopyright p {font-size: 18px; line-height: 42px;}
.footercontent p { margin: 4px 6px 4px 24px;}
}


  /*************************/
 /*MN 740px 6plus sideways*/
/*************************/

@media screen and (min-width: 740px) {	
p {font-size: 20px; font-weight: 300;}

	
#floatinglogo { top: 64px;}
#floatinglogo img { width: 50%; padding: 0 0 9px 0;}
#floatinglogo p { font-size: 32px;}
.topquote {width: 85%;}
.topquote p {font-size: 26px;}
.whitelink a {font-size: 16px;}
.cycle-slideshow { height: 360px;}
#endorsements p { font-size: 17px;}
.footercontent p { margin: 4px 6px 4px 36px;}
.midquote p { margin: 80px 0 0 0; font-size: 26px;}
#topbar { display: block;}
.teamlist { height: 72px; margin: 0 0 18px 0;}
.teamlist img { height: 72px; padding: 0 18px 0 0;}
.teamlist p {font-size: 16px;}
.footnote p {line-height: 15px;font-size: 15px;}


/* DROP CONTENT CSS */
	
.morethumb { padding: 0 12px 0 0; height: 54px;}
.moredrop ul { font-size: 14px;}
.moredrop li {display: block-inline;line-height: 54px;}
nav[role=morelinks] li a {width: 50%; float: left; height: 54px;}


/* WIDER SCREEN NAVIGATION CSS */
	
a.menu-link {display: none; padding: 0; margin: 0;}
.js nav[role=navigation] {max-height: none;}
nav[role=navigation] ul {border: 0;}		
nav[role=navigation]  li {display: inline-block;}
nav[role=navigation] li a {
	border: 0;
	margin: 0;
	padding: 2px 12px;}

.mainnavbar {
	display: inline-block;
	float: right; 
	margin: 0 auto;
	padding: 0;
	text-align: right;
	width: auto;
	height: 32px;
	line-height: 32px;
	z-index: 1000;
	}  	
.mainnavbar ul {
	padding: 0;
	margin: 0;
	color: #393e3f;
	list-style: none;
	background: #ffffff;
	}
.mainnavbar li {
	display: inline;
	padding: 0;
	line-height: 18px;
	font-size: 13px;
	font-weight: 300;
	
	}
.mainnavbar li a {color: #000;text-decoration: none;margin: 0;background: none;}
.mainnavbar ul li a:hover {background: #f4f8f9;border-radius: 8px;}
.mainnavbar ul li a:active {background: #f4f8f9;border-radius: 8px;}
} 

  /**********/
 /*MN 800px*/
/**********/


@media screen and (min-width: 800px) {	
#floatinglogo { top: 98px;}
#floatinglogo img { width: 45%; padding: 0 0 9px 0;}
#floatinglogo p { font-size: 40px;}	
.topquote {width: 85%; padding: 24px 0 42px 0;}
.topquote p {font-size: 30px;}	
.mainnavbar { line-height: 32px;}
.sectionpictureleft {width: 50%;}
.sectionpictureright {width: 50%;}
.sectioncopyright p {margin: 100px 0 0 0;font-size: 21px; line-height: 42px;}
	.sectioncopyright a {font-size: 19px;}
.frontpagebottomsection { padding: 36px 0 16px 0;}
.morebutton {width: 28px; border-radius: 14px;}
.whitelink a {font-size: 16px; padding: 4px 8px;}
.midquote p { font-size: 26px;}
#endorsements p { font-size: 18px;}
.footercontent { max-width: 840px;}
.footercontent p { margin: 4px 6px 4px 36px;}
.footercolumn { width: 25%; padding: 24px 0 24px 0;}
.footerbottom { padding: 24px 0 0 0;display: inline-block;width: 50%;}
.teamlist { height: 80px; margin: 0 0 18px 0; float: left; width: 50%;}
.teamlist img { height: 80px; padding: 0 18px 0 0;}
.teamlist p {margin: 0;font-size: 17px;}
.midquote { display: none;}
.awards {padding-top:60px;}
.midquotewide {margin: 0 auto;text-align: center;width: 100%;padding: 0;height: 340px;display: block;
}
.awardstage {text-align: center;display: inline-block;margin: 0 auto;padding: 0 18px;}
.awards {height: 90px; padding-top:112px;}

}

  /**********/
 /*MN 940px*/
/**********/

@media screen and (min-width: 940px) {	 
#toppageimage { margin: 42px 0 0 0;}
.awards {height: 116px; padding-top:100px;}
.awardstage {padding: 0 16px;}
}

.topbar {
	color: red;
	display: inline-block;
	height: 100px;
	background-color: green;
	width: 600px;
}

  /***********/
 /*MN 1000px*/
/***********/

@media screen and (min-width: 1000px) {	
#floatinglogo { top: 120px;}
#floatinglogo img {width: 40%; padding: 0 0 12px 0;}
#floatinglogo p { font-size: 46px;}	
.topquote {width: 78%;}
.topquote p {font-size: 36px;}	
.sectionpictureleft {width: 50%;}
.sectionpictureright {width: 50%;}
.sectioncopyright p {margin: 120px 0 0 0;font-size: 22px; line-height: 60px;}
.whitelink a {font-size: 18px; padding: 4px 10px;}
.frontpagebottomsection { padding: 48px 0 24px 0;}
.midquote p { font-size: 28px;}
#endorsements {max-width: 960px;}
#endorsements p { font-size: 19px;}
/* DROP CONTENT CSS */
.morethumb { height: 60px;}
.moredrop ul { font-size: 14px;}
.moredrop li {display: block-inline;line-height: 60px;}
nav[role=morelinks] li a {width: 33.33333%; height: 60px;}
#topbar { height: 40px;}
#topbar img {height: 40px;}
.midquotewide {height: 400px;}
.awards {height: 128px; padding-top:126px;}
.awardstage {padding: 0 18px;}
} 

  /***********/
 /*MN 1160px*/
/***********/

@media screen and (min-width: 1160px) {	
#floatinglogo { top: 140px;}
#floatinglogo img {width: 40%; padding: 0 0 18px 0;}
#floatinglogo p { font-size: 54px;}	
.topquote {width: 75%; padding: 32px 0 64px 0;}
.topquote p {font-size: 42px;}	
	
.sectioncopyright p {margin: 120px 0 0 0;font-size: 24px; line-height: 66px;}

	/* DROP CONTENT CSS */
.morethumb { height: 72px;}
.moredrop ul { font-size: 16px;}
.moredrop li {display: block-inline;line-height: 72px;}
nav[role=morelinks] li a {width: 33.33333%; height: 72px;}
#topbar { height: 48px;}
#topbar img {height: 48px;}
.awards {height: 160px; padding-top:90px;}
.awardstage {padding: 0 18px;}
	
#supercontainer {
	width: 100%;
	max-width: 1160px;
	margin: 0 auto;
	padding: 12px 0 0 0;
}	
}