@charset "utf-8";

/* CSS Document */
.customiseNHSButton {
    margin: 0 auto;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: limegreen;
    border: 1px solid #0A4B04;
    border-radius: 5px;
    box-shadow: 3px 3px 3px black;
    color: white;
    font-weight: 500;
    width: 250px;
    /* float: left; */
    font-size: 16px;
    cursor: pointer;
    /* margin-left: 20px; */
}

.home-section-left, .home-section-right {
	padding-left: 1%;
  padding-right: 1%;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 47%;
  float: left;
  background-color: #fff;
  overflow: auto;
  border: solid 1px #ccc;
}
.home-section-right {
  margin-right: 1%;
  float: right;
}
.home-section-centre {
  padding-left: 1.5%;
  padding-right: 1.5%;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 95.8%;
  float: left;
  background-color: #fff;
  overflow: auto;
  border: solid 1px #ccc;
	margin-bottom: 5px;
}
.rows {
width 100%;
  display: inline-block;
}
.home-section-left h2, .home-section-left h2 a, .home-section-right h2, .home-section-right h2 a {
  color: #2f466b;
  margin-top: 3px;
  margin-bottom: 10px;
  font-size: 21px;
  font-weight: 400;
  line-height: 30px;
}
.home-section-left img, .home-section-right img {
  width: 99%;
  height: auto;
  border: solid 1px #ccc;
  padding: 2px;
}
.home-section-text {
  width: auto;
  display: block;
}
.home-section-text p {
  font-size: 16px;
  line-height: 22px;
/*  padding-bottom: 15px;*/
}

	
	.callToday p {
		  text-align: center;
  font-size: 18px;
  color: black;
	}
.headingBox img {
  width: 100%;
  height: auto;
}

@media (max-width:555px) {

.home-section-left, .home-section-right {
  width: 96%;
  padding-left: 1.5%;
  padding-right: 1.5%;
}
.home-section-right {
  /*		margin-right:1%;*/

/*		float:right;*/
  margin-top: 10px;
}
}

}

@media (max-width:1000px) {
#header {
  background-position: -20px top;
}
}	

.home-section h3 a {
    color: #2f466b;
    margin-top: 3px;
    margin-bottom: 10px;
    font-size: 21px;
    font-weight: 400;
    line-height: 30px;
}

    .orangeButton a {
        color: white;
        text-decoration: underline;
        font-weight: bold;
        font-size: 22px;
        background-color: #06A814;
        border: 1px solid #32824A;
        width:550px;
/*        display: inline-block;*/
        padding:15px;   
    }
    
    .newHomeLinks a{
        color: green;
    }
    
.newWriting {

	width: 60%;

	margin-left: 10px;

	margin-right: 10px;

	display: block;

} 

body {

	font-family: 'Open Sans', sans-serif;

	color: #666;

	height: 100%;

	background-color: #e0e0e0;

}

	

#menu {

	position: relative;

	z-index: 4;

	padding-top: 20px;

/*	max-width: 1000px;*/

}

#menu-toggle {

	display: none;

}

#menu ul {

	list-style-type: none;

	margin: 0;

	padding: 0 1%

}

#menu #navigation {

	float: left;

	margin-right: 05px

}

#menu #help {

	position: absolute;

	right: 0;

}

#menu ul ul {

	position: absolute;

	left: 0;

	top: 100%;

	width: 275px;

	display: none;

	z-index: 5;

}

#menu li:hover ul {

	display: block;

}

#menu li {

	float: left;

	position: relative;

}

#menu #helplink {

	float: right

}

#menu li li {

	float: none;

}

#menu a, #helplink a {

	display: block;

	background-color: #282D3B;

	color: #FFFFFF;

	padding: 8px;

	text-decoration: none;

	border: 1px solid #FFFFFF;

	text-align: center;

	margin-left: -1px;

	margin-top: -1px;

}

#menu a:hover {

	background-color: #636466;

}

#helplink a {

	border-left: 1px solid #FFFFFF;

	background-color: #56BA48;

}

#menu li li a {

	background-color: #636466;

	border: none;

	border-top: 1px solid #636466;

	border-bottom: 1px solid #636466;

	margin-top: 0

}

#menu li li a:hover {

	background-color: #000000;

	border-color: #FFFFFF;

	width: auto;

}

#header-logo, #footer-logo {

	display: inline-block;

	width: 345px;

	float: left;

	padding-left: 10px;


}

#headerImages img {

	width: 49%;

	height: auto;

	padding: 15px 0 0 0;

}

#top-bar {
    /* background-image: url(clean-air-banner.png); */
    /* background-repeat: no-repeat; */
    background-position: calc(100% - 5px) center;
    border-bottom: 1px solid #FFFFFF;
    background-color: #ffffff;
    /* color: #FFFFFF; */
    text-align: center;
    min-height: auto;
    padding: 7px 7px 0px 7px;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

}

#top-bar p{

	font-size: 16px;

}

#top-bar h1 {

    color: #2f466b;
    margin-top: 3px;
    margin-bottom: 10px;
    font-size: 21px;
    font-weight: 400;
    line-height: 30px;

}

#header {

	margin-bottom: 0px;/* background-color: #282D3B; */

	/* height:44px; */

}

.breadcrumbs-wrap {

	max-width: 1000px;

	margin: 0 auto;

	padding-top: 10px;

	padding-bottom: 7px;

}

ol { padding-left: 1rem; }

.breadcrumb li {

    display: inline;

	font-size: 16px;

	font-family: Arial, Helvetica, sans-serif;

	

}

.breadcrumb li a{

	color:green;

	text-decoration: none;

}

.breadcrumb li+li:before {

    content:"» ";

	color:red;

}



/* STRUCTURE */

* {

	padding-top: 0;

	padding-right: 5;

	padding-left: 5;

	padding-bottom: 5;

	margin: 0;

}

.inner-wrap {

	max-width: 1000px;

	margin: 0 auto;

	min-width: 300px;

	padding-top: 20px;

	padding-bottom: 0px;

}



#shortcutRow {

	width: auto;

	padding-left: 15px;

	line-height: 18px;

	margin: auto;

}

#shortcutRow hr {

	width: 98%;

	margin-top: 10px;

	margin-bottom: 10px;

}

.shortcutColumn, .shortcutColumn2, .shortcutColumn3, .shortcutColumn4, .shortcutColumn5, .shortcutColumn6 {

	width: 150px;

	float: left;

}

.shortcutColumn a, .shortcutColumn2 a, .shortcutColumn3 a, .shortcutColumn4 a, .shortcutColumn5 a, .shortcutColumn6 a {

	display: block;

	line-height: 18px;

	text-align: left;

	text-decoration: none;

	color: #C6C6C6;

}

.shortcutColumn a:link, .shortcutColumn2 a:link , .shortcutColumn3 a:link , .shortcutColumn4 a:link , .shortcutColumn5 a:link , .shortcutColumn6 a:link  {

	color: #C6C6C6;

	text-align: left;

	margin-bottom: 5px;

	padding-left: 5px;

	height: 18px;

	font-size: 16px;

}

#shortcutTitle, #shortcutTitle2, #shortcutTitle3, #shortcutTitle4, #shortcutTitle5, #shortcutTitle6 {

	font-weight: 600;

	padding-left: 5px;

	color: white;

}

#header-logo h2, #footer-logo h2 {

	float: left;

	font-size: 24px;

	padding-left: 10px;

	line-height: 22px;

}

#header-logo h3, #footer-logo h3 {

	float: left;

	font-size: 16px;

	width: 245px;

	font-weight: 100;

	text-align: left;

	padding-left: 10px;

}

.social-logos-facebook-icon, .social-logos-twitter-icon, .social-logos-linkedin-icon, .social-logos-you-tube-icon {

	float: right;

	background: url(sprites.png) no-repeat;

}


.flag {

	float: left;

	background-position: 0 0;

	width: 42px;

	height: 42px;
    margin-top:-10px;

}

.social-logos-facebook-icon {

	background-position: -92px -4px;

	width: 35px;

	height: 35px;

}

.social-logos-twitter-icon {

	background-position: -138px -4px;

	width: 35px;

	height: 35px;

}

.social-logos-linkedin-icon {

	background-position: -182px -4px;

	width: 35px;

	height: 35px;

}

.social-logos-you-tube-icon {

	background-position: -224px -4px;

	width: 35px;

	height: 35px;

}

.nav-bar-background {

	background: #282D3B;

	height: 44px;

}

#footerContainer {

	background-color: #2f466b;

	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

	color: white;

	width: 100%;

	text-align: center;

	padding: 20px 0 0 0;

	border-top: 4px solid #09f;
min-width: 300px;
}

#myfooter {

	margin: 0 auto;

	margin-bottom: 15px;

	padding-top: 5px;

	padding-right: 1%;

	padding-left: 1%;

	padding-bottom: 15px;

	width: 96%;

	font-size: 14px;

	line-height: 22px;

}

#footer-text {

	padding-right: 10px;

	font-size: 13px;

	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

	float: right;

	text-align: right;

	width: 350px;

	padding-top: 7px;

}

#footer-text a {

	color: white;

}

#footer-text img {

	padding: 5px;

	padding-top: 8px;

}

#footer-logo img {

	width: auto;

	float: left;

}

#footer-logo {

	display: inline-block;

	width: 340px;

	float: left;

	padding-left: 10px;

}

#pagewrap {

	padding: 5px;

	width: 1000px;

	margin: 0px auto;

}

header {

	height: 100px;

	padding: 0 15px;

}

.content {

	width: 295px;

	float: left;

	padding: 5px 15px;

	background-color: white;

}



.leftContent {

	width: 46%;

	float: left;

	padding: 5px 15px;

	background-color: white;

}

.middle {

	width: 295px; /* Account for margins + border values */

	float: left;

	padding: 5px 15px;

	margin: 0px 5px 5px 5px;

	background-color: white;

}



.wide {

	max-width: 513px; /* Account for margins + border values */

	width:46%;

	float: left;

	padding: 5px 15px;

	margin: 0px 5px 5px 5px;

	background-color: white;

}



.sidebar {

	width: 295px;

	padding: 5px 15px;

	float: left;

	background-color: white;

}

.sidebar h2,.sidebar h2 a, .content h2,.content h2 a, .leftContent h2,.leftContent h2 a, .middle h2,.middle h2 a, .wide h2,.wide h2 a, .headingBox h1,.headingBox h1 a {

	color: #2f466b;

	margin-top: 3px;

	margin-bottom: 10px;

	font-size: 20px;

	font-weight: 400;

	line-height: 30px;

}

/*
img {

	display: block;

	margin: 0 auto;

	padding-bottom: 7px;

}
*/

footer {

	clear: both;

	padding: 0 15px;

}

.writing p {

	font-size: 16px;

	line-height: 22px;
        margin-bottom: 10px;

}

.writing h2 {

	margin-top: 0px;

}

.writing img{

	float: left;

	margin: 2px;

}

.sidebar, .content, .leftContent, .middle, .wide {

	background: white;

}

header, .content, .leftContent, .middle, .wide, .sidebar {

	margin-bottom: 5px;

}

/* #pagewrap, header,  */



.content, .leftContent, .middle, .wide, .sidebar, footer {

	border: solid 1px #ccc;

}

#header-text {

	padding-right: 10px;

	font-size: 13px;

	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

	float: right;

	text-align: right;

	width: 150px;

	padding-top: 3px;

}

#header-text img {

	padding: 5px;

	padding-top: 8px;

}

a {

	text-decoration: none;

	font-family: 'Open Sans', sans-serif;

}

/*
.imageSamples img{
	float: left!important;
    display: inline-block;
    border: 1px solid black;
    margin-right: 5px;
    margin-left: 5px;
    margin-bottom: 5px;
	width:230px!important;
}
*/

.imageSamples {
	float: left!important;
/*    display: inline-block;*/
/*    border: 1px solid black;*/
    margin-right: 5px;
    margin-left: 5px;
/*    margin-bottom: 10px;*/
	width:230px!important;
}

.imageSamples a{
/*
	float: left!important;
    display: inline-block;
    border: 1px solid black;
    margin-right: 5px;
    margin-left: 5px;
    margin-bottom: 10px;
	width:230px;	
*/
	margin-bottom: 10px;
	text-align: center;
	display:block;
}

.fileTypeIcons img{

	float:left;

	display:inline;

	padding:3px;

}

.fileTypeIcons p{

	float:left;

	padding-left:3px;

	padding-top:5px;

	font-size: 12px;

	color: #2f466b;

	width:100%

}







.actionBuyButton, .actionBuyButtonSide {

	border: 2px solid #EF5D1B;

	padding: 9px 25px 6px 25px;

	margin-top: 7px;

	margin-right: 7px;

	margin-left: 7px;

	margin-bottom: 7px;

	color: #FFFFFF;

	max-width: 100%;

	font-size: 15px;

	background-color: #E46446;

	text-align: center;

	width: auto;

	background-image: url(images/white-chevron.png);

	background-repeat: no-repeat;

	background-position: calc(100% - 5px) center;



	}



.actionButton, .actionButtonSide {

	border: 2px solid #4871a4;

	padding: 6px 25px 6px 25px;

	margin-top: 7px;

	margin-right: 7px;

	margin-left: 7px;

	margin-bottom: 7px;

	color: #4871a4;

	max-width: 100%;

	font-size: 15px;

	background-color: #DFEEFE;

	text-align: center;

	width: auto;

	background-image: url(images/blue-chevron.gif);

	background-repeat: no-repeat;

	background-position: calc(100% - 10px) center;

	}

.moreDetails, .moreDetailsSide {

	border: 2px solid #4871a4;

	padding: 6px 25px 6px 25px;

	margin-top: 7px;

	margin-right: 7px;

	margin-left: 7px;

	margin-bottom: 7px;

	color: #4871a4;

	max-width: 100%;

	font-size: 15px;

	background-color: #DFEEFE;

	text-align: center;

	width: auto;

}



.actionButton:hover, .actionButtonSide:hover, .moreDetails:hover, .moreDetailsSide:hover{

	background-color: #B6CEFD;

	border: 2px solid #4871a4;

	color: #4871a4;

	;

}



.actionBuyButton:hover, .actionBuyButtonSide:hover{

	background-color: #D39973;

	border: 2px solid #E46446;

	color: #ffffff;

	;

}



.actionButton a, .actionButtonSide a, .actionBuyButtonSide a, .actionBuyButton a.moreDetails a, .moreDetailsSide a {

	color: #4871a4;

}



.headingBox {

	color: #666;

	background-color: #FFF;

	margin-bottom: 10px;

	padding-top: 5px;

	padding-right: 1.5%;

	padding-left: 1.5%;

	padding-bottom: 10px;

	width: 96%;

	overflow: auto;

	border: solid 1px #ccc;

}

#samplesGridBox {

	color: #666;
    background-color: #FFF;
    margin-bottom: 10px;
    padding-top: 12px;
    /* padding-right: 1.5%; */
    padding-left: 12px;
    /* padding-bottom: 10px; */
    width: 98%;
    overflow: auto;
    border: solid 1px #ccc;

}

#samplesGridBox img{
	float: left!important;
    display: inline-block;
    border: 1px solid black;
    margin-right: 5px;
    margin-left: 5px;
/*    margin-bottom: 10px;*/
	width:230px!important;
}



.headingBox {

	text-decoration: none;

}

#topButtonBar {

	height: auto;

	margin-top: 10px;

}

.sublinkbutton a {

	border: 2px solid #EF5D1B;	

	color: #FFFFFF;

	background-color: #E46446;

	

	

	

	padding: 6px;

	float: left;

	margin-left: 10px;

	margin-bottom: 10px;

	

	text-align: center;

	

	/*border-color: #FFF;

	color: #328002;

	background-color: #f4f9ed; */

	

	font-size: 16px;

	line-height: 21px;

	text-decoration: none;

	/* [disabled]border-width: 2px;

*/

	width: 111px;

	box-shadow: 2px 2px 2px #888888;

	/*border: 1px solid #8cc63f; */

}

.sublinkbutton a:hover {

/*	background-color: #ddecc5;  */

	background-color: #D39973;

	border: 2px solid #E46446;

	color: #ffffff;

	

}



#newReleaseButton a {

	background-color: #FF0000;

	padding: 14px 10px 14px 10px;

	float: left;

	margin-left: 10px;

	margin-bottom: 10px;

	border-color: #FFF;

	text-align: center;

	color: #FFF;

	font-size: 14px;

	font-weight: 200;

	line-height: 16px;

	text-decoration: none;

	border-width: 2px;

	width: 93px;

	box-shadow: 3px 3px 3px #888888;

}

#newReleaseButton a:hover {

	background-color: #FC8602;

}

#clientLogosFooter h1, #clientLogosFooter h1 {

	color: #2f466b;

	font-size: 21px;

	line-height: 19px;

	font-family: Arial, Helvetica, sans-serif;

	font-weight: 200;

	text-decoration: none;

}

.headingBox p {

	font-size: 16px;

	line-height: 24px;

}

#callSupport {

	display: block;

	float: left;

	width: auto;

	font-size: 14px;

	padding-left: 15%;

	line-height: 20px;

}

#callSupport h2 {

	font-size: 24px;

}







.wide img {	

	height: auto;

	max-width: 497px;

	}



/************************************************************************************

MEDIA QUERIES

*************************************************************************************/

/* for 980px or less */

@media screen and (max-width: 920px) {





	

.actionButtonSide{

	width:45%;

	float:right;

	display:inline-block;

}



	

#header #menu-toggle {

	display: block;

	float: none;

	cursor: pointer;

	margin-top: 0;

	padding-bottom: 10px;

}


#pagewrap {

	width: 94%;

}

.content {

	width: 41%;

	padding: 1% 4%;

}



.leftContent {

	width: 41%;

	padding: 1% 4%;

}

	

.content img, .middle img, .sidebar img {

	width: 90%;

	height: auto;

	max-width: 270px;

}

.wide img, .leftContent img {

	width: 90%;

	height: auto;

	max-width: 500px;

	}
	
	
	

.middle {

	width: 41%;

	padding: 1% 4%;

	margin: 0px 0px 5px 5px;

	float: right;

}

.wide {

	width: 41%;

	padding: 1% 4%;

	margin: 0px 0px 5px 5px;

	float: right;

}	

.sidebar {

	clear: both;

	padding: 1% 4%;

	width: auto;

	float: none;

}

header, footer {

	padding: 1% 4%;

}

.writing {

	width: auto;

	margin-left: 10px;

	margin-right: 10px;

        

	display: block;

}
    

   

.writing h2 {

	margin-top: 0px;

}

.sidebar img {

	float: left;

	margin-left: 0px;

	margin-right: 2%;

}

.fileTypeIcons img{

	float:left;

	display:inline;

	padding:3px;

	width:29px;	

}

}



@media screen and (max-width: 888px) {

	.shortcutColumn, .shortcutColumn2, .shortcutColumn3, .shortcutColumn4, .shortcutColumn5, .shortcutColumn6 {

		width: 150px;

		margin-bottom: 15px;

	}

}



@media screen and (max-width: 767px) {

	

	.sidebar img{

		width:95%;

	}



.fileTypeIcons img{

	float:left;

	display:inline;

	padding:3px;

	width:29px;	

}

	

#header-logo, #header-text {

	float: none;

	margin: 0 auto;

}

#callSupport {

	float: none;

	margin: 0 auto;

	width: auto;

	display: block;

	font-size: 18px;

	padding-left: 0px;

	padding-bottom: 15px;

	line-height: 20px;

}

#callSupport h2 {

	font-size: 35px;

	padding-top: 10px;

}

#menu {

	padding-top: 0px;

}

}



/* for 700px or less */

@media screen and (max-width: 600px) {

#menu #navigation, #menu #help {

	float: none;

	margin-right: 0;

}

#menu ul {

	padding: 0;

/*	display: none;*/

}

.active-menu #menu ul {

	display: block;

}

#menu #help {

	position: static;

}

#menu li, #menu #helplink {

	float: none;

}

#menu ul ul {

	display: block;

	position: static;

	width: auto

}

#menu {

	padding-top: 0px;

}
.content {

	width: auto;

	float: none;

}

.leftContent {

	width: auto;

	float: none;

}	

.middle {

	width: auto;

	float: none;

	margin-left: 0px;

}

.wide {

	width: auto;

	float: none;

	margin-left: 0px;

}	

.sidebar {

	width: auto;

	float: none;

}

.sidebar img {

	float: left;

}

.writing {

	width: auto;

/*	display: inline-block;*/

}

.sidebar img {

	float: none;

	display: block;

	margin: 0 auto;

}

.wide img {

	width:90%;		

}	

	.fileTypeIcons img{

	float:left;

	display:inline;

	padding:3px;

}

}



/* for 480px or less */

@media screen and (max-width: 480px) {

header {

	height: auto;

}

h1 {

	font-size: 2em;

}

	.fileTypeIcons img{

	float:left;

	display:inline;

	padding:3px;

}

}


#pinExplain {
	float:right;
	padding-left:10px;
	margin-top:10px;
}

#useOur {
    width: auto;
    display: inline-block;
    float: left;
    font-size: 22px;
    margin-top: 17px;
    font-weight: 600;	
}


