@charset "UTF-8";
/* CSS Document */

@media only screen and (min-width: 601px) and (max-width: 1160px) {



body {
font-size:16px;
	line-height:22px;
   background-size: 80% auto;		
}

h1{

font-size:26px;
text-align:left;
line-height:1.3;
}

.trueHead h1{
margin:4px 0 18px 15px;
}

h2{
line-height:1.3;
}

h3{

text-align:left;
line-height:1.3;
}

h4{
	
	text-align:left;
	line-height:1.3;
}

.JSSOR_outer{
	max-width:100%;

}    
    
.jssorh4{
    font-size:50px;
    }
    
h5{

font-size:22px;
line-height:1.2;

}

.jssorp{
    font-size:28px;
    line-height:1.2;
    }
    
DIV#inlineEditButton{
display:none;
visibility:hidden;	
}

	.responsiveHideLg{
	display:none;
	visibility:hidden;
float:none;
clear:both;
}

	
	.responsiveHide{
	display:none;
	visibility:hidden;
float:none;
clear:both;
}

.responsiveShow{
	display:block;
	visibility:visible;

}


	DIV#basketBox{
		

	}
	
	
	DIV#showResponsiveBasketLink{
		display:block;
		visibility:visible;
	   width:100%;
margin:0;
padding:11px 0 5px 0px;
height:29px;
border-bottom:solid;
border-bottom-width:3px;
border-bottom-color:#f4fbf3;
background-image:url(../images/wsimages/treedent-large.gif), url(../images/wsimages/treedent-large.gif), url(../images/wsimages/page-top-bg-tile.png);
background-repeat:no-repeat, no-repeat, repeat-x;
background-position:2% 7px, 98% 7px, center top;
text-align:center;
}


.recentlyPic{
	display:inline;
	float:left;
	margin:2px;
	padding:0px;
	width:19%;
	border:none;
}



.recentlyText{
	display:inline;
	float:left;
	width:60%;
	padding: 4px 0 0 2%;
	color:#222222;
	text-align:left;
	font-family:clarendon-regularregular, Arial, Helvetica, sans-serif; 
font-size: 12px;
line-height:14px;
}


.recentlyButton{
	margin:0px;
	  padding:23px 2px 0 0;
	 height:27px;
	  width:12%;
	  display:inline;
float:right; 
border-right:solid;
border-right-width:1px;
border-right-color:#888888;
}


	DIV#preHeader{

}

DIV#preHeadInner{
	margin:0;
width:100%;	
height:35px;
}

DIV#preHeadLeft{
	margin: 0 auto; 
	min-height:30px;
		padding: 2px 0 0 1%; 
font-size:16px;
float:left;
text-align:left;
	width:36%;
}

	DIV#preHeadRight{
		width:62%;
padding:6px 1% 0 0;
	display:inline;
		float:right;
		text-align:right;
}


DIV#header{
	
}

DIV#headContainer{
	width:100%
}

DIV#headRight{
padding:0px 2% 0px 0;


}

DIV#headRightLeft{
padding:5px 5px 10px 0;
}

#headRightTop, #headRightTop2{

}
    
.headRightDark{
    margin:70px 10% 0 10%;
    padding:10px 0 10px 0;
    width:80%;
    min-height:80px;
    font-size:3vw;
    line-height:1.3;
    font-weight:700;
    text-align:center;

} 
    

#headRightBottom{
margin:50px 5% 0 0;
    padding:15px 0 15px 0;
width:90%;    
font-size:3vw;
    line-height:1.3;

}

.headPortalButt{
	left:auto;
	right:2.5%;
position:absolute;
top:115px;
margin:0px 0 0 0px;
	
}

.headPortalButt:hover{
	margin:3px 0 0 0px;

	
	
}

DIV#logoOuter{
	margin: 0;
width:100%;	
    text-align:center;
}
DIV#logoOuter2{
	margin: 0 auto;
    margin-top:100px;
width:100%;	


}
    .logoBlock{
width:100%;
   padding:15px 0 0px 0;
}
    
.logoArea{

   

	
}
    
    
.logoAreaLarge{
display:block;
float:none;
margin: 0px 0% 0px 0%; 
text-align:center;
width:100%;
padding:0px 0 0 0%;
z-index:10;
	
}
    .logoAreaNormal{
     
		margin: 0px 0% 0px 2%; 
		text-align:left;
		width:15%;
		padding:0px 0 0 0%;
     
    }
    
    
DIV#logoArea2{
	display:none;
	visibility:hidden;
}

.headerLogoImage{
    margin: 20px 0 0 0px;
	max-height:320px;
}

.headerLogoText{
		float:left;
	color:#FFFFFF;
		font-size:2.8vw;
		width:95%;
		
		text-align:center;
}

.headerLogoTextNormal{
	width:76%;
		font-size:18px;
		padding:5px 2% 0 0%;
        margin:0px 0 0 0%;
	
}

.videoCoverLogo{
margin:65px auto;


}

.testCover{

    max-width:100%;
}
    
    
.logoNormal{
width:39%;
padding:3px 0px 40px 1%;

}

.frontVideo{
width:100%;
height:420px;	
}


.frontUpdateBlock{
position:relative;
    float:right;
    top:0px;
	margin: 20px 0 0 0;
	padding:0px 4% 12px 4%;
	width:42%;
    min-width:300px;
	font-size:16px;
	line-height:1.2;
	min-height:100px;
	right:auto;


}

.frontUpdateBlock h4{

	font-size:24px;
	
	
}

.projectBlock h5{
    font-size:18px;
}
    
.heroTextBlock{
	float:right;
margin: 130px 2% 0 3%;
	padding:22px 2% 22px 2%;
	width:36%;
	text-align:left;
}


.fubTxt{


}


DIV#headBottom{
min-height:230px;
padding:25px 0% 0 0;
font-size:17px;
line-height:21px;
}

DIV#headBottom1{

min-height:110px;
	
}

DIV#headBottom2{
min-height:110px;
}

DIV#headBottom3{
min-height:215px;
		
}
.twocols{
							-webkit-column-count: 1; 
							-moz-column-count: 1; 
							column-count: 1; 
							-webkit-column-gap: 25px; 
							-moz-column-gap: 25px; 
							column-gap: 25px;
    max-width:100%;
						}

	 .smallerText {
font-size:14px;
line-height:14px;
}

	
DIV#pageContentInner{
    	width:100%;
	 display: -webkit-flex;
      display: flex;
	  -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
	margin:0px;
	border:none;
    background-image:url(../images/wsimages/page-top-bg-tile.png), url(../images/wsimages/page-bottom-bg-tile.png), url();
background-repeat:repeat-x, repeat-x, repeat-x;
background-position:center top, center bottom, center bottom;
}

.pageContentThinLeft{
margin:0px 0 0px 0px;
display:block;
text-align:left;
float:none;
width:100%;

}
.pageContentThinRight{
	padding:0px;
	margin:0px 0 20px 16px;
display:block;
text-align:left;
float:none;
width:100%;

}


	.responsivePageBlock{
	margin:0px 4% 25px 0;
	width:46%;
}
	
    .thirdPageBlock{
	margin:0px 0% 0px 0;
	padding:0px 2% 0px 2%;
width:46%;
min-height:370px;
}

 
   .heroPicOuter{
min-height:500px; 

}
 
    
	.generalPageBox{

width:94%;

	}
	
.gridLeft, .gridRight, .gridFull, .gridCont{
height:250px;

}


	
	.mabHalfRight{
width:47%;	
height:auto;

}

.mainActionButton:link{
 
	font-size:28px;
	
}

  DIV#discoOuter{
	width:100%;

}  

	.mab1{
	display:block;
	float:none;
	width:76%;
	margin: 0 10% 0 10%;
	padding: 18px 2% 23px 2%;
	font-weight:400;
}
	
	DIV#frontSubMenu{
	width:300px;
	margin:22px 0 0px 0;
	padding:0px 0 16px 0;
	background-color:#515151;
	
}

	DIV#frontSubMenu li{
	
display:block;
float:none;
padding:12px 15px 0 15px;
	
}
	
	
	DIV#frontStyles{
		display: -webkit-flex;
      display: flex;
	  -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
	}
	
	
DIV#frontPressLeft{
	padding:20px 0 0 0px;
	clear:both;
	display:block;
	float:none;
	-webkit-order: 2;
order: 2;
	}

DIV#frontPressRight{
	padding:0px 0 0 0px;
	clear:both;
	display:block;
	float:none;
	-webkit-order: 1;
order: 1;
	}
	
	DIV#frontVideoRight{
	
	margin:20px 0 0 0;
	display:inline;
	float:left;
}	

DIV#frontLoginLeft{
padding:30px 2% 20px 2%;
margin:0px;
display:inline;
text-align:left;
float:left;	
	width:40%;
	font-size:19px;
	background-color:#f1f1f1;
	border-left:solid 1px #919191;
	border-bottom:solid 1px #919191;
	border-right:solid 1px #919191;
	background-image:url(../images/wsimages/fade-strip-dn-tile.png);
	background-repeat:repeat-x;
	background-position:top;
}

DIV#frontLoginRight{

padding: 0px 2% 0 2%;
margin:0px;
display:inline;
text-align:left;
float:right;	
	width:50%;
}


.frontProjBox{
	padding: 7px 12px 0 12px;
    margin:0 0 22px 0;
}


 .newsLeft{
padding:0 0 0px 0;
}


	.usefulButtonBlue{
	margin:0 1% 0 1%;
	width:92%;
	}
	
	.bigButtonBlue{
	margin:0px 2% 16px 0;
	width:60%;
	max-width:390px;
	height:auto;
	}
	
	.bigButtonBlueContainerLeft{

max-width:280px;

}

.bigButtonBlueContainerLeft{

width:45%;

}

.bigButtonBlueContainerRight{
	
width:55%;

}

.bigButtonBlueContainerRightBottom{
	margin:0 8% 0 1%;
	padding:3px 0 4px 4%;
	text-align:left;
}



	DIV#content{
		
		width:100%;
		padding:0;
		margin:0px;
		border:none;
	}
	
	DIV#pageArea{
width:100%; 

  }

.setContentWidth{
	width:96%;
	padding:0% 2% 0 2%;
}


.pageSection{
	

	
	
	
}
  DIV#pageLinksLeft{

padding:1px 0 8px 0;
  }
   DIV#pageLinksRight{
padding:20px 2% 8px 0;
  }    
    
    .pageLinkHTMLContent, .pageLinkBlock{
    font-size:2.5vw;
        line-height:1.2;
}    
    
.sectionPicFillLeft{
background-repeat:repeat-x, repeat, no-repeat, repeat;
background-position:center top, left top, left center, center center;
background-size: auto auto, 0% 0%, 50% auto, auto auto;
padding:50px 0 50px 0;
border-top:solid 4px #28354F;    
}

DIV#pageLeftColumn{
	padding:0px;
	margin:0px;
	width:100%;
	clear:both;
	border:none;
	-webkit-order: 2;
order: 2;
}

DIV#pageRightColumn{
	padding:0px;
	margin:0px;
	width:100%;
	clear:both;
	-webkit-order: 1;
order: 1;
}

.howWorksItem{
 width: 43.5%;
 margin:0px;
  padding:0 3% 20px 3%; 


  }

.addBorderRight{
	border-right:none;   
  }

.addBorderRight2{
	border-right:solid 1px #cccccc;   
  }
  
.howWorksTitle{
	
	font-size:30px;  
  }
  
  
  .howWorksText{
	padding:12px 15px 15px 15px;
	 
  }

.responsiveDrop{
	clear:both;
	float:none;
	display:block;
	width:100%;
}


DIV#mobilePanel{
	width:97%;
	padding:15px 1% 0 2%;
	min-width:300px;
	display:block;
	float:none;
	min-height: 200px;
	visibility:visible;
} 

.panelMustCentre{
	margin:0 auto;
	width:100%;
	
}

DIV#panelRightLeft{
	width:52%;
	padding:14px 2% 20px 3%;
	-webkit-order: 2;
order: 2;
}
  
DIV#panelRightRight{
	padding:0px 1% 20px 1%;
	width:41%;
	-webkit-order: 1;
order: 1;
}

DIV#galleryOuter{
	width:97%;
}

.galleryItem{
	padding:0px 0px 0px 0px;
	margin:0px 2% 2% 0px;
	width:23%;
	height:23%;
	display:inline;
float:left;
}


.galleryImage{
	
	width:24%;
	height:24%;
	
}

.galleryImage:hover{

	width:24%;

}


.hugeButton{
margin:0;
padding:20px 2% 24px 2%; 
	
	width:85%;
}

A.menuLink:link {color:#555555;  font-size: 28px; text-decoration: none; font-weight: 400;} 
A.menuLink:visited {color: #555555;  font-size: 28px; text-decoration: none; font-weight: 400;} 
A.menuLink:hover {color:#000000;  font-size: 28px; text-decoration: underline; font-weight: 400;} 
A.menuLink:active {color:#555555;  font-size: 28px; text-decoration: none; font-weight: 400;}

A.hugeButtonLink:link {color:#222222; font-family:walkway_semiboldregular, Arial, Helvetica, sans-serif; font-size: 19px; text-decoration: none; font-weight: 400; line-height:36px;} 
A.hugeButtonLink:visited {color: #222222; font-family:walkway_semiboldregular, Arial, Helvetica, sans-serif; font-size: 19px; text-decoration: none; font-weight: 400; line-height:36px;} 
A.hugeButtonLink:hover {color:#ffffff; font-family:walkway_semiboldregular, Arial, Helvetica, sans-serif; font-size: 19px; text-decoration: none; font-weight: 400; line-height:36px;} 
A.hugeButtonLink:active {color:#222222; font-family:walkway_semiboldregular, Arial, Helvetica, sans-serif; font-size: 19px; text-decoration: none; font-weight: 400; line-height:36px;}

A.bigWhiteLink:link {color:#ffffff;  font-size: 22px; text-decoration: none; font-weight: 700; } 
A.bigWhiteLink:visited {color: #ffffff;  font-size: 22px; text-decoration: none; font-weight: 700; } 
A.bigWhiteLink:hover {color:#fff500;  font-size: 22px; text-decoration: underline; font-weight: 700; } 
A.bigWhiteLink:active {color:#ffffff;  font-size: 22px; text-decoration: none; font-weight: 700; }


    DIV#frontTestimonialsOuter{
	
	font-size:2vw;
	min-height:160px;	
	
}
    
 .socialIcon2{
	  width:170px;
	  
  }    

 DIV#footer{
margin:0px 0 0px 0;
}

.footInner{

width:96%;
padding:0px 2% 0 2%;
height:auto;
text-align:right;
display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}
 
.footLeft {
	display: block;
	float: none;
    width: 96%;
	padding: 25px 1% 5px 1%;
	margin:0;
	-webkit-order: 3;
	order: 3;
	border: none;
    text-align:center;
    clear:both;
}
    
 .footLeft p{
    text-align:center;
}   
.footLeft h4{
   text-align:center;
}
.footButts{
margin:0 auto;
    padding:0 0 0 20px;
width:100%;
    max-width:180px;

}
.footListItem{

margin:0px;

}   

    .footListItem li{
padding:0px 0px 12px 0px;        
background-image:none;
	text-align:center;
}
    
    .footMid{
width: 96%;
	padding: 20px 1% 5px 1%;
	margin:0;
display:block;
clear:both;
float:none;
text-align:center;
height:auto;
line-height:17px;
-webkit-order: 1;
	order: 1;
}

    .footMid img{
 max-width:300px;   
    
}
    
.footMid2{
width:33%;
    float:left;
    text-align:center;
}


.footRight {
	display: block;
	float: none;
	width: 96%;
	min-height:100px;
	padding: 15px 1% 25px 1%;
	margin:15px 0px 0px 0;
	-webkit-order: 2;
	order: 2;
	text-align: center;
clear:both;
    border-top: solid 1px #cccccc;
    border-bottom: solid 1px #cccccc;
}

.footRight h4{
text-align:center;
}
    
 .footLeft2{
     margin:0px 0 0 0;
width:33%;
float:left;
}

.footRight2{
  margin:1px 0 0 0;
width:33%;
float:right;
}

DIV#menuAreaOuter{

}
 DIV#menuArea{

   }
    
    DIV#menuLogo{
 
   width:28%; 
    padding:10px 0 0 2%;
    }
    
DIV#mainMenuHere{
	margin: 0 0 0 0; 
padding:0px 0 0 0px;
width:100%;
height:55px;
}
DIV#mainMenuHere ul li{
	border-bottom:solid;
	border-bottom-width:1px;
	padding: 0 0 0 0px;
}
DIV#menuHere{
      position:absolute;
    top:0px;
    right:0px;
     margin:0px;
     display: block;
    float:none;
 z-index:1001;   
}

.menuRight{
display:none;
visibility:hidden;

}

A.menuLinkCurrent:link {text-shadow: none;} 
A.menuLinkCurrent:visited {text-shadow: none;} 
A.menuLinkCurrent:hover {text-shadow: none;} 
A.menuLinkCurrent:active {text-shadow: none;}


A.menuDropLinkCurrent:link,
 A.menuDropLinkCurrent:active,
 A.menuDropLinkCurrent:visited {text-shadow: none;} 
A.menuDropLinkCurrent:hover {} 



.sticky {
height:50px;
background-position:center top, 1% 9px;
background-size: auto, auto 30px;

}

DIV#nav {
position:absolute;
	padding: 0px;
	margin: 0px 0 0 60%;
	width: 40%;
	float: none;
    z-index:2000;
	
}
#nav ul {
	float: none;
	padding: 70px 0 0 0;
	max-height: 0;
	overflow: hidden;
	margin: 0px 0 0 0;
	width: 100%;
	-webkit-transition: all .45s ease;
	-moz-transition: all .45s ease;
	-ms-transition: all .45s ease;
	-o-transition: all .45s ease;
	transition: all .45s ease;
}
#nav ul li {
	float: none;
	position:relative;
	clear:both;
	margin: 0px 0 0 0;
	background-image: url(../images/wsimages/page-top-bg-tile.png);
	background-position: center top;
	background-repeat: repeat-x;
	text-align: center;
	font-size: 35px;
	background-color: rgba(235,235,235,0.92);
	width: 100%;
	padding: 0px 0 0px 0px;


}
#nav ul li ul {
				margin:0px 0 0 0;
				padding:0px 0 0px 0;
				width:100%;
				display: none;
				float: none;
					position: relative;
					left: 0;
					top: 0;
					text-align:center;
					background-image:none;	
					background-repeat:repeat;
					box-shadow: none;
					
					-webkit-border-radius: 0px 0px 0px 0px;
-moz-border-radius: 0px 0px 0px 0px;
border-radius: 0px 0px 0px 0px;	
 
					
					clear:both;										
				}
				
				#nav li:hover ul {
					display: block;
					
				}
				
#nav ul li ul li {
	float:none;
	position: relative;
	width:100%;
	top:0px;
	margin: 0px;
	padding: 0px;
	display:block;
	clear:both;
	background-image: none;
	line-height: 18px;
	height: auto;
	border: none;
}
#nav li:hover ul {
	display: none;
}

#nav li a {
	float: none;
	text-align: center;
	display: block;
	margin: 0px 0 0px 0px;
	padding: 10px 0 12px 0;
	font-size: 18px;
	color: #444444;
	background-image: none;
		border-left:solid 1px #444444;
}
#nav li a:hover {
	padding: 10px 0 12px 0;
	text-decoration:none;
	color: #ffffff;
	background-color:#220e0f;
	background-image: url(../images/wsimages/page-top-bg-tile.png);
	background-position: center top;
	background-repeat: repeat-x;
}

#nav li ul li a {
			 background-color:#dedede;
				background-image:url(../images/wsimages/drop-strip-tile.png);
	background-repeat:repeat-x;
	background-position:center top;
	position:relative;
					display:block;
					text-align:center;
					margin:0px 0 0px 0px;
					padding:5px 0 5px 0;
					font-size:16px;	
					color:#444444;					
				}
				
				#nav li ul li a:hover {
				color: #000000;
				}
						
.dropMenu {
	border-top: none 1px #DBDBDB;
	border-bottom: none 1px #DBDBDB;
	
}
#nav .navbar-handle {
	display: block;
}
#navbar-checkbox:checked + #nav ul {
	max-height: 700px;
	overflow: auto;
}
#navbar-checkbox:checked + #nav li {
	visibility: visible;
	display:block;
	clear:both;
}
#navbar-checkbox:checked + #nav .navbar-handle,  #navbar-checkbox:checked + #nav .navbar-handle:after,  #navbar-checkbox:checked + #nav .navbar-handle:before {
	border-color: #aaa;
	color: #ffffff;
}



}



/* Note: Design for a width of greater than 1280px */
@media only screen and (min-width: 1100px) {
	
	
	  
}