@font-face {
		   font-family: bernoru-medium;
		   src: url(/fonts/bernoru-blackmedium-webfont.woff2);
		}
 html, body {
			    height: 100%;
			    overflow-y: scroll !important;
				-webkit-overflow-scrolling: touch;
					}
						html {
						overflow-y: hidden;
						 background: #fdfdf2;
						}
						body {
			    overflow-y: scroll;
			    overflow-x: hidden;
			     background: #fdfdf2;
			     color: #6d6b6b;
						}
	.no-js .top-bar {
		  display: none;
		}
		@media screen and (min-width: 40em) {
		  .no-js .top-bar {
		    display: block;
		  }
		  .no-js .title-bar {
		    display: none;
		  }
		  }
		html, body {background: linear-gradient(to bottom right, #ff4c05 0%, #ffe600 70%) 100% no-repeat; }
		.everywhere {background-color: none;
  background-image: url(https://future.haos.org.uk/i/i24/bg-brand-element-01a.png);
  background-size: contain;  
  background-position: right top;
  background-repeat: repeat-y;}

  		.uppersocial {z-index: 100; position:absolute; margin-top: 2em; margin-right: 2em; border: 1px; color: white;}
		.uppersocial a:link {color: #ffffff;}
		.uppersocial	a:visited {color: #ffffff;}
		.uppersocial	a:hover {color:#ffffff; cursor: pointer; }
		.uppersocial	a:active {color: #ffffff; text-decoration: none;}
		.funderwindow {background: linear-gradient(to bottom right, #ff4c05 0%, #ffe600 70%) 100% no-repeat;}
		
		.orbit-caption h1 {color: #ffae00; padding-left: .3em; padding-right: .3em;  padding-bottom: 0; margin-bottom: 0; font-family: 'bernoru-medium', sans-serif; font-size: 3.4rem; text-align: left; text-shadow: 1px 1px 1px #000000; line-height: normal;}
		.orbit-caption h2 {color: #fcfbf9; padding-left: .4em; padding-right: .3em;}
		.superlogo {max-width: 200px;}

		
		
		.event-img {max-height: 300px;}
		.orbit-slide {height: 80vh;}
/*
		.home-slide-one {background: url('/i/home-img_8735-22.jpg') no-repeat top center; background-size: cover; }		
		.home-slide-two {background: url('/i/home-three-22.jpg') no-repeat top center; background-size: cover; }
		.home-slide-three {background: url('/i/home-cpd-001a.jpg') no-repeat top center; background-size: cover; }	
		.home-slide-four {background: url('/i/home-activity-001.jpg') no-repeat top center; background-size: cover; }
*/
		
		.poppins-regular {font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal;}
		.orbit-caption h2 {font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal;}
		p {font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal;}
		
			.trustee-tile {background: rgba(524, 230, 0, 0.75); border: 1px solid #766cab; padding: .2em; margin-bottom: 1em; color: #ffae00;}
			.trustee-tile {background: linear-gradient(to top left, beige, lightgreen) 100% no-repeat;}
			.trustee-tile h3 {font-family: 'Poppins', sans-serif; color: #595752; font-size: 1.5rem; font-variant: normal; font-weight: bold;}
			.trustee-tile p {font-family: 'Poppins', sans-serif; color: #ffae00; font-size: .8rem; text-align: justify; padding: .2em;}
			.trustee-tile .caption {font-family: 'Poppins', sans-serif; color: #4e4e4c; font-size: .8rem; font-style: italic;}
		
			.backblueblend {margin-top: 12vh; margin-bottom:2em; padding: 2em; background: -webkit-linear-gradient(rgba(181,167,247,0.3) 5%, rgba(126,117,183,0.8) 90%); font-family: 'Kanit', serif; font-size: 1.6rem; }
			.backblueblend h2 {font-family: 'News Cycle', sans-serif; font-size: 2rem; text-transform: uppercase; color: #0D984A;}
			.backblueblend h3 {font-family: 'Kanit', sans-serif; font-size: 1.6rem; color: #343332;}
			.backblueblend p {font-family: 'Poppins', sans-serif; font-size: 1.2rem; color: #343332;}
			
			/*buttons, borders */
			.brad {border-radius: 10px;}
			.bradsm {border-radius: 5px;}
			.btnbrad {border-radius: 5px;}
			.bordered {border: 1px solid black;} /* for testing */
			.bigbrad {box-shadow: 1px 1px 2px 1px #5a5a5a; border-radius: 5px;}
			.boxshad {box-shadow: 1px 1px 0px 1px #5b5959;}

			.splash {min-height: 80vh;  position: relative;}
		
			.newsectblend {/*background:  -webkit-linear-gradient(rgba(170,248,170,0.3) 32.81%, rgba(126,117,183,0.8) 90%); */ background: linear-gradient(to right, beige, lightgreen);}
			.newsect {margin-top: 12vh; margin-bottom:2em; padding: 2em;}
			
			.newsect h2 {font-family: 'bernoru-medium', sans-serif; font-size: 2.5rem; color: #0D984A; border: 8px solid #0D984A; border-radius: 50px; padding-left: 2rem; padding-right: 2rem; padding-top: .2rem; padding-bottom: .4rem; margin-left: 5rem; margin-right: 10rem; margin-bottom: 0; background:rgba(247, 247, 247, 0.81);	 display: inline-block;}
			
			.newsect h3 {font-family: 'Poppins', sans-serif; font-size: 1.6rem; color: #343332;}
			.newsect h4 {font-family: 'Poppins', sans-serif; font-size: 1.1rem; color: #595756; font-weight: 700}
			.newsect-wrapper {border: 8px solid #0D984A; border-radius: 50px; padding-left: 4rem; padding-right: 5rem; padding-top: 2rem; padding-bottom: 2rem;  margin-top: -6px;}
			.newsect p {font-family: 'Poppins', sans-serif; font-size: 1.2rem; color: #343332;}
			
			.supporters {padding: 0; margin-left: 0; margin-right: 0; }
			
			.bigsymbol {font-size: 4em; color: #ffae00; text-shadow: 1px 1px 1px #000000;}
			
			.actionbartile-home {background: linear-gradient(to bottom, beige, lightgreen); padding: .5em; margin-bottom: 1em; color: #000000;}
			.actionbartile-home h2 {font-family: 'Poppins', sans-serif; }
			.actionbartile-home .ikon {color: #323131; text-shadow: 1px 1px 1px #000000;}
			.actionbartile-home p {font-family: 'Poppins', sans-serif; font-size: 1.2rem; color: #343332;}
			
			.trustee-tile {background: rgba(524, 230, 0, 0.75); border: 1px solid #766cab; padding: .2em; margin-bottom: 1em; color: #ffae00;}
			.trustee-tile {background: linear-gradient(to top left, beige, lightgreen) 100% no-repeat;}
			.trustee-tile h3 {font-family: 'Poppins', sans-serif; color: #595752; font-size: 1.5rem; font-variant: normal; font-weight: bold;}
			.trustee-tile p {font-family: 'Poppins', sans-serif; color: #6d6b65; font-size: 1rem; text-align: left; padding: .2em;}
			.trustee-tile .caption {font-family: 'Poppins', sans-serif; color: #4e4e4c; font-size: .8rem; font-style: italic;}
			
			
			.copyright {background: none; color:	#242323;}
			
			.top-menu ul li a:link {color: #0D984A; font-size: 1.1rem; background: #ffffff; border-radius: 50px; padding: .1em; padding-left: .6em; padding-right: .6em; margin-left: .6em; border: 3px solid #0D984A; }
			.top-menu ul li a:visited {color: #0D984A;}
			.top-menu ul li a:hover {color: #63eb9e; cursor: pointer;}
			.top-menu ul li a:active {color: #0D984A; text-decoration: none;}
			.top-menu ul li ul {background: none;);  font-size: .5rem; border: none;}
			a:link {color: #0D984A;}
			a:visited {color: #0D984A;}
			a:hover {color:#63eb9e; cursor: pointer; }
			a:active {color: #0D984A; text-decoration: none;}
			.haos-values {font-size: 1.1rem; font-family: 'Poppins', cursive; list-style-position: inside; list-style-type: circle; line-height: normal;}
			.haos-values li {margin-bottom: 2vh;}
			
			.schoolsgrid {font-size: 1.1rem}
			.school-logo {padding: 2em;}
			.school-logo-main {padding: 1.5em;}
			.school-detail h3 {font-size: 1.1rem;}
			.school-detail h2 {font-family: 1rem; font-family: 'Poppins', sans-serif; }
			.pupil-comments {font-size: 1.2rem; text-align: left; padding: 1em; margin: 2em; background: -webkit-linear-gradient(rgba(181, 167, 247, 0.3) 5%, rgba(126, 117, 183, 0.8) 90%); }
			
			.school-logo {display: block;	max-height: 200px; margin: 0 auto; text-align: center;}
			.school-logo-main {display: block;	max-height: 300px; margin: 0 auto; text-align: center;}
			
			
			/* News Masonry */
		.masonry-css {
  -webkit-column-count: 1;
          column-count: 1;
  -webkit-column-gap: 1rem;
          column-gap: 1rem;
}

@media screen and (min-width: 25em) {
  .masonry-css {
    -webkit-column-count: 1;
            column-count: 1;
  }
}

@media screen and (min-width: 37.5em) {
  .masonry-css {
    -webkit-column-count: 3;
            column-count: 3;
  }
}

@media screen and (min-width: 50em) {
  .masonry-css {
    -webkit-column-count: 4;
            column-count: 4;
  }
}

@media screen and (min-width: 68.75em) {
  .masonry-css {
    -webkit-column-count: 5;
            column-count: 5;
  }
}

.masonry-css-item {
  -webkit-column-break-inside: avoid;
          break-inside: avoid;
  margin-bottom: 1rem;
}
	/*  My custom masonry fonts */
	.masonry-css-item {background: linear-gradient(to top left, beige, lightgreen) 100% no-repeat; box-shadow: 1px 1px 2px 1px #5a5a5a}
	.masonry-css-item h2 {font-family: 'Poppins', sans-serif; font-size: 1.5rem; text-transform: uppercase; color: #22211f; }
	.masonry-css-item h3 {font-family: 'Poppins', sans-serif; font-size: 1.5rem; color: #22211f; font-variant: small-caps; font-weight: bold;padding-left: .2em; padding-right: .2em;}
	.masonry-css-item p {font-family: 'Poppins', sans-serif; font-size: 1.2rem; color: #22211f; padding-left: .2em; padding-right: .2em;}
	.masonry-css-item .btnback	 {background: #ffc004; color: #313030; font-size: 1rem;}	
	.masonry-css-item {
		   -webkit-transition: all 1s ease;
		   -moz-transition: all 1s ease;
		   -o-transition: all 1s ease;
		   -ms-transition: all 1s ease;
		   transition: all 1s ease;
		}
		
		.masonry-css-item:hover {
		   -webkit-filter: brightness(70%);
		   filter: brightness(70%);
		}

	/* forms */
	label {font-family: 'Poppins', sans-serif; text-align: left;}
	input[type=text], input[type=password] {
	  width: 100%;
	  padding: 12px 20px;
	  margin: 0px auto;
	  box-sizing: border-box;
	  border-radius: 4px;
}
	.pushback {display: none !important;}		
			
			
			
			@media screen and (max-width: 39.9375em) {
				.superlogo {max-width: 150px;}
				orbit-slide {max-height: 80vh;}
					.textpane {position: absolute; bottom: 0; left: 0; padding-left: .3em; padding-right: .3em;  padding-bottom: .3em; margin-bottom: 0; width: 100%; background: rgba(0, 0, 0, 0.32);}
					.orbit-caption h1 {color: #ffae00; padding-left: .3em; padding-right: .3em;  padding-bottom: 0; margin-bottom: 0; font-family: 'bernoru-medium', sans-serif; font-size: 1.7rem; text-align: left; text-shadow: 1px 1px 1px #000000; line-height: normal;}
					.orbit-caption h2 {color: #ffae00; padding-left: .3em; padding-bottom: .5em; margin-bottom: 0; text-align: left; margin-left: .5em; font-family: 'Poppins', sans-serif; font-size: 1.1rem; text-shadow: 1px 1px 1px #000000; line-height: normal;}
					.uppersocial {font-size: .8em}
					.newsectblend {background: linear-gradient(to right, beige, lightgreen);}
					.newsectblendrev {background: linear-gradient(to right, lightgreen, beige);}
			.newsect {margin-top: 5vh; margin-bottom:2em; padding: .1em; }
			
			.newsect h2 {font-family: 'bernoru-medium', sans-serif; font-size: 1.3rem; color: #0D984A; border: 3px solid #0D984A; border-radius: 50px; padding-left: .8rem; padding-right: .8rem; padding-top: .2rem; padding-bottom: .3rem; margin-left: 1rem; margin-right: 2rem; margin-bottom: 0; background:rgba(250, 250, 250, 0.5);	 display: inline-block;}
			
			.newsect h3 {font-family: 'Poppins', sans-serif; font-size: 1.3rem; color: #343332;}
			.newsect-wrapper {border: 3px solid #0D984A; border-radius: 20px; padding-left: 1rem; padding-right: 1rem; padding-top: 1rem; padding-bottom: 1rem;  margin-top: -3px;}
			.newsect p {font-family: 'Poppins', sans-serif; font-size: .9rem; color: #343332;}
			.bigsymbol {font-size: 2em; color: #ffae00; text-shadow: 1px 1px 1px #000000;}
		
			
			
			

					
					
					

/* non-nav styles*/
				.splash h1 {padding-left: .3em; padding-right: .3em;  padding-bottom: 0; margin-bottom: 0; font-size: 2rem; text-align: left;}
				.backblueblend {margin-top: 12vh; margin-bottom:2em; padding: .2em 0; background: -webkit-linear-gradient(rgba(181, 167, 247, 0.3) 5%, rgba(126, 117, 183, 0.8) 90%); font-family: 'Kanit', serif; font-size: 1rem; }
				.backblueblend h2 {font-family: 'Kanit', sans-serif; font-size: 2rem;}
				.logoback {margin-top: 12vh; margin-bottom: 2em; padding: .2em; padding-bottom: 2em; background: url('/i/test/bg-logo-grey-10.png') top center, -webkit-linear-gradient(rgba(255, 252, 240, 0.8) 0%, rgba(250, 250, 250, 1) 90%);  background-repeat: repeat-x repeat-y;}
				.logoback h2 {font-family: 'Oswald', sans-serif; text-transform: uppercase; color: #22211f; font-size: 1.5rem;}
				ul.haos-values {font-size: .9em; font-family: 'Poppins', cursive; list-style-position: inside; list-style-type: circle; line-height: normal;} 
				/* ul.haos-values li {font-size: 1.2rem; margin-bottom: 3vh;} */
				.breakbox {padding-top: 2em; padding-bottom: 2em;}
				
				.schoolsgrid {font-size: 1.1rem}
			.school-detail h3 {font-size: 1.1rem;}
			.school-detail h2 {font-family: 1rem; font-family: 'Poppins', sans-serif; }
			.pupil-comments {font-size: 1.2rem; text-align: left; padding: 1em; margin: 2em; background: -webkit-linear-gradient(rgba(181, 167, 247, 0.3) 5%, rgba(126, 117, 183, 0.8) 90%); }
			
			.school-logo {display: block;	max-height: 200px; margin: 0 auto; text-align: center; padding: .5em}
			.slideschoolname {font-size: .8em;}

				
				}