/* LARGE SCREEN STYLES */
/* This sets standard display and full top of screen menu */

@media only screen and (min-width: 1050px)  {

body {
	background-color: #ffffff;
	font-family: Open Sans, Arial, sans-serif, Helvetica, Verdana;
	margin: 0px;
	padding: 0px;
	}
	  
	  
a:link {
	color: #000066;
	text-decoration: none;
}
a:visited {
	color: #000066;
	text-decoration: none;
}
a:active {
	color: #000066;
	text-decoration: none;
}
a:hover {
	color: #000099;
	text-decoration: underline;
}


a.white:link {
	color: #ffffff;
	text-decoration: none;
}
a.white:visited {
	color: #ffffff;
	text-decoration: none;
}
a.white:active {
	color: #ffffff;
	text-decoration: none;
}
a.white:hover {
	color: #ffffff;
	text-decoration: none;
}

a.top:link {
	color: #000066;
	text-decoration: none;	
}
a.top:visited {
	color: #000066;
	text-decoration: none;	
}
a.top:active {
	color: #000066;
	text-decoration: none;	
}
a.top:hover {
	color: #000066;
	text-decoration: none;	
}

a.lb:link {
	color: #b0c4de;
	text-decoration: none;
}
a.lb:visited {
	color: #b0c4de;
	text-decoration: none;
}
a.lb:active {
	color: #b0c4de;
	text-decoration: none;
}
a.lb:hover {
	color: #b0c4de;
	text-decoration: underline;
}


.topBar {
height: 100px;
width: 100%;
background-color: #ffffff;
border-bottom: 1px solid #b0c4de;
position: fixed;
z-index: 2;
top: 0px;
}


.logo {
	position: absolute;
	left: 4%;
	top: 10px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	z-index: 5;
}



.topRight {
position: absolute;
top: 0px;
right: 0px;
height: 100px;
width: 100px;
border-left: 1px solid #4682b4;
margin-left: 5px;
padding: 0px;
}


.topRight2 {
position: absolute;
top: 0px;
right: 100px;
height: 100px;
width: 100px;
border-left: 1px solid #4682b4;
margin-left: 5px;
padding: 0px;
font-size: 13pt;
text-align: center;
}

.tr2Text {

position: absolute;
width: 100%;
top: 43px;
font-family: Calibri, Arial, Helvetica, sans-serif;
font-size: 13pt;
text-align: center;


}


.trIcon {

width: 90px;
height: 90px;
margin: 5px;
font-size: 12pt;
}


.topnav {
	position: absolute;
    background-color: #ffffff;
    overflow: hidden;
	z-index: 4;
	right: 100px;
	top: 20px;
	font-family: Calibri, Arial, Helvetica, sans-serif;
	
}



/* Style the links inside the navigation bar */
.topnav li {
    float: left;
    display: block;
    
    text-align: center;
    padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 10px;
	padding-right: 10px;
	
    text-decoration: none;
    font-size: 13pt;
}

/* Change the color of links on hover */



.menuListItem:hover {
    border-bottom: 2px solid #b0c4de;	
}

.menuListItemCurrent {
    border-bottom: 2px solid #4682b4;
}


/*
.icon:hover {
    border-bottom: 0px solid #b0c4de;
} */

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;
	font-size: 48pt;
	padding: 0px;
	
} 


/*  END OF STYLES FOR NAVIGATION AND TOP OF PAGE MENU  */
/**/
/**/
/**/

/* MAIN PAGE SECTIONS AND LAYOUT STYLES: */


/* Main top image for home page */
.mainImg {
	width: 100%; 
	overflow-x: hidden;
	overflow-y: hidden;
	margin-top: 100px;
	height: 713px; 	   
}
	 

/* This fixes the image size for the screen width of monitors */	 
.mainImg_picture {
width: 1425px;
/* transition: 2s; */

animation: fadeInAnimation ease 6s; 
            animation-iteration-count: 1; 
            animation-fill-mode: forwards; 
}

 @keyframes fadeInAnimation { 
            0% { 
                 opacity: 0; 
			/*	width: 2000px; */
				 
            } 
            100% { 
              opacity: 1;
			/*	  width: 1425px;  */
            } 
        } 


.miPlaceHolder {

	background-color: #4682b4;
	font-size:0px;
	padding:0px;
	
}	 


/* Main top image for site pages */
.mainImg2 {
	position: relative;
	width: 100%; 
	padding: 0px;
	margin-bottom: 20px;
	margin-top: 100px;
	left: 0;
	font-size: 0px;
}


/* Caption title text on the main home page image */	 
.homeTitle {
z-index: 1;
width: 625px;
font-family: Open Sans, Arial;
font-size: 42px;
position: absolute;
left: 50px;
top: 325px;
color: #ffffff;
font-weight: bold;
}	 


.htLink {
	border: 2px solid #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 30px;
	padding-right: 30px;
	margin: 10px;
	position: absolute;
	left: 45px;
	top: 525px;
	font-size: 24px;
	font-family: Arial, Open Sans;
}

.homeSearch {
	border: 2px solid #ffffff;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 28px;
	padding-right: 28px;
	margin: 10px;
	position: absolute;
	right: 45px;
	top: 120px;
	font-family: Arial, Open Sans;
}


/* This posiitons the h1 title over the base of the main image on monitors and tablet screen sizes */
.imgTitleBar{ 

	background-image: url(graphics/ts_blue.png);
	padding-top: 25px;
	padding-bottom: 25px;
	margin: 0px;	
	position: absolute;
	width: 100%;
	bottom: 0px;
}

h1 {
		
margin: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: center;
	width: 100%;
	font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
	font-size: 28px;
	font-style: italic;
	font-weight: bold;
	color: #ffffff;	
}


/* Plain container Div for full-width content blocks  */	  
.maincontent{
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;	
	padding-top: 40px;
	padding-bottom: 40px;
	margin-left: 5%;
	margin-right: 5%;
}

.maincontent2{
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;	
	padding-top: 0px;
	padding-bottom: 0px;
	margin-left: 5%;
	margin-right: 5%;
	text-align: justify;
}


/* Applies a shaded background to the main content div */
.wrapShade{
	background-color: #f0f8ff;	
}


/* Splits the maincontent section into two blocks which are arranged horizontally on monitors and tablets / vertically on mobile and small screens  */
.Column2_1{
	margin-left: 0%;
	margin-right: 0%;
	width: 45%;
	position: relative;
	float: left;
}

.Column2_2{
	margin-left: 0%;
	margin-right: 0%;
	width: 55%;
	position: relative;
	float: left;
}


/* Large underlined title for pages and sections  */
.homeHeader{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 36pt;
	color: #4682b4;
	padding-top: 30px;
	padding-bottom: 40px;
	margin-left: 0%;
	margin-right: 10%;
	border-bottom: 2px solid #b0c4de;	
}


/* Medium underlined title for pages and sections  */
.subHeader{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 24pt;
	color: #4682b4;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-left: 0%;
	margin-right: 2.5%;
	margin-bottom: 10px;
	border-bottom: 2px solid #b0c4de;	
}

.subHeader_NR{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 24pt;
	font-weight: bold;
	color: #4682b4;
	padding-top: 10px;
	padding-bottom: 5px;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 20px;	
}


/* Medium underlined title for pages and sections full page width (even padding either side)  */
.subHeader_wide{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 24pt;
	color: #4682b4;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 10px;
	border-bottom: 2px solid #b0c4de;	
}

.subHeader_wide_NR{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 24pt;
	font-weight: bold;
	color: #4682b4;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 20px;	
}


h2{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 18pt;
	color: #4682b4;
	padding-top: 0px;
	margin-top: 10px;	
}


h3{
	font-family: Open Sans, Arial;
	text-align: left;
	font-size: 14pt;
	color: #000000;
	padding-top: 10px;	
	margin-left: 40px;	
}


/* Plain text box no border or background */
.homeBox0{
	font-family: Open Sans, Arial;
	font-size: 12pt;
	color: #000000;
	padding: 0px;
	margin-bottom: 0px;
	margin-left: 5%;
	margin-right: 5%;
	text-align: justify;
}

.homeBox0_lg{
	font-family: Open Sans, Arial;
	font-size: 13pt;
	color: #000000;
	padding: 0px;
	margin-bottom: 0px;
	margin-left: 5%;
	margin-right: 5%;
	text-align: justify;
}


/* Steel blue background highlighted feature text block */
.homeBox1{
	font-family: Open Sans, Arial;
	background-color: #4682b4;
	color: #ffffff;
	padding: 0px;
	margin-right: 0%;
}


/* Mouse over ligher shade for highlighted feature text block */
 /*
 .homeBox1:hover {
	font-family: Open Sans, Arial;
	background-color: #b0c4de;
	color: #ffffff;
	padding: 0px;
	margin-right: 0%;
	transition: 0.3s;
} 
*/

/* Light blue background highlighted paragraph text block */
.homeBox1_light{
	font-family: Open Sans, Arial;
	background-color: #f0f8ff;
	color: #000000;
	padding-bottom: 20px;
	margin-right: 0%;
}


/* Image box to align against text box */
.homebox1Image{
	margin-left: 0%;
	font-size: 0px; /* removes gap below image to align against coloured text box below */
}


/* Sets the content image proportional to full width of container div */ 
.img1{
	width: 100%;
}


/* large / title text for highlighted text blocks */
.homeBox1_Text{
	padding-top: 20px;
	padding-bottom: 10px;
	padding-right: 20px;
	padding-left: 40px;
	font-size: 24pt;
}


/* Paragraph text for highlighted text blocks */
.homeBox1_Text_small{
	padding-top: 10px;
	padding-bottom: 20px;
	padding-right: 40px;
	padding-left: 40px;
	font-size: 14pt;
	text-align: justify;
}


/* Title text for light highlighted text blocks  */
.homeBox1_light_Title {
	color: #000000;
	font-size: 18pt;
	padding-top: 20px;
	padding-bottom: 10px;
	padding-right: 40px;
	padding-left: 40px;
}


/* Title text for light highlighted text blocks (without spacing above)  */ 
.homeBox1_light_Title_2 {
	color: #000000;
	font-size: 18pt;
	padding-top: 0px;
	padding-bottom: 10px;
	padding-right: 40px;
	padding-left: 40px;
}


/* Paragraph text for light highlighted blocks */
.homeBox1_light_Text {
	color: #000000;
	font-size: 12pt;
	padding-right: 40px;
	padding-left: 40px;
	margin-bottom: 20px;
	margin-top: 20px;
}


/* Link arrow for bottom of highlight text boxes */
.arrow {
	text-align: right;
	padding-bottom: 20px;
	padding-right: 40px;
}


/* Arrow icon for the in-page menu block links */
.menuArrow {
	width: 25px;
	height: 25px;
	position: relative;
	float: left;
	padding-left: 5px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
}


/* Container box for the in-page menu block links */
.titleBox {
	position: relative;
	float: left;	
	width: 350px;	
	margin-left: 0%;
	margin-right: 0px;
	margin-top: 10px;	
	padding: 0px;
	background-color: #ffffff;
	border: 1px solid #b0c4de;	
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;	
}

.titleBox2 {
	position: relative;
	float: left;	
	margin-left: 0%;
	margin-right: 0px;
	margin-top: 10px;	
	padding: 10px;
	border: 1px solid #4682b4;	
		
}


/* Text for the in-page menu block links */
.titleBoxText {
	padding: 0px;
	margin-top: 5px;
	font-size: 14pt;
	position: relative;
	float: left;
}

.titleBox2Text {
	font-size: 14pt;
}


/* Highlighted text box for emphasised points/statements */
.boxSquare_Group {
	position: relative;
	float: left;
	width: 230px;
	height: 260px;
	margin-left: 0px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 20px solid #b0c4de;
	border-top: 1px solid #b0c4de;
	border-left: 1px solid #b0c4de;
	border-right: 1px solid #b0c4de;	
}


/* Mouseover style of highlighted text box for emphasised points/statements (PC monitors only) */
.boxSquare_Group:hover {
	position: relative;
	float: left;
	width: 230px;
	height: 260px;
	margin-left: 0px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 20px solid #f0f8ff;
	border-top: 1px solid #f0f8ff;
	border-left: 1px solid #f0f8ff;
	border-right: 1px solid #f0f8ff;
	transition: 0.3s;	
}


/* Large highlighted text box for emphasised points/statements and blocks of text content */
.boxSquare_Group_Large {
	position: relative;
	float: left;
	width: 360px;
	height: 540px;
	margin-left: 0px;
	margin-right: 20px;
	margin-bottom: 15px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 20px solid #b0c4de;	
	border-top: 1px solid #b0c4de;
	border-left: 1px solid #b0c4de;
	border-right: 1px solid #b0c4de;	
	font-size: 0;	
}


/* Mouseover style of large highlighted text box for emphasised points/statements and blocks of text content (PC monitors only) */
.boxSquare_Group_Large:hover {
	position: relative;
	float: left;
	width: 360px;
	height: 540px;
	margin-left: 0px;
	margin-right: 20px;
	margin-bottom: 15px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 20px solid #f0f8ff;	
	border-top: 1px solid #f0f8ff;
	border-left: 1px solid #f0f8ff;
	border-right: 1px solid #f0f8ff;
	transition: 0.3s;	
}


/* Large highlighted text box for emphasised points/statements and blocks of text content - with image at top (extra height) */
.boxSquare_Group_Large_Image {
	position: relative;
	float: left;
	width: 360px;
	height: 700px;
	margin-left: 0px;
	margin-right: 20px;
	margin-bottom: 15px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 30px solid #b0c4de;	
	border-top: 1px solid #b0c4de;
	border-left: 1px solid #b0c4de;
	border-right: 1px solid #b0c4de;
	transition: 0.3s;		
}


/* Mouseover Style of large highlighted text box for emphasised points/statements and blocks of text content - with image at top (extra height) (PC monitors only) */
.boxSquare_Group_Large_Image:hover {
	position: relative;
	float: left;
	width: 360px;
	height: 700px;
	margin-left: 0px;
	margin-right: 20px;
	margin-bottom: 15px;
	margin-top: 5px;
	background-color: #ffffff;
	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	border: 1px solid;
	border-bottom: 30px solid #f0f8ff;	
	border-top: 1px solid #f0f8ff;
	border-left: 1px solid #f0f8ff;
	border-right: 1px solid #f0f8ff;
	transition: 0.3s;		
}

/* Heading text for highlighted text box for emphasised points/statements and blocks of text content */
.boxTitle{
	padding-top: 15px;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 18pt;
	color: #4682b4;
	font-family: Open Sans, Arial, Sans Serif;
}


/* Sub heading text for highlighted text box for emphasised points/statements and blocks of text content */
.boxSubTitle{
	padding-top: 5px;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 13pt;
	color: #4682b4;
	font-family: Open Sans, Arial, Sans Serif;
}


/* Paragraph text for highlighted text box for emphasised points/statements and blocks of text content */
.boxText1{
	padding-top: 15px;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 12pt;
	font-family: Arial, Open Sans, Sans Serif;
}


/* Content or divider image at full width of content div */
.img3 {
	margin-top: 10px;
	margin-bottom: 0px;
	width: 100%;
}


/* Social media icons added to page content (on contact page) */
.SocialIcons_Inline{
	padding-top: 30px;
	padding-bottom: 30px;
	text-align: left;
	width: 100%;
	background-color: #ffffff;
	margin-bottom: 0px;
	margin-top: 0px;
}

/* Spacing and opacity of social media icons */
.sIcon {
 	/* border-radius: 50%; */
	/*  -webkit-transition: -webkit-transform .8s ease-in-out; */
	/*   transition:         transform .8s ease-in-out; */
	opacity: 0.7;
	padding-left: 10px;
	padding-right: 10px;
}


/* Mouse over style of social media icond (PC screen only) */
.sIcon:hover {
	/* -webkit-transform: rotate(360deg); */
	/*     transform: rotate(360deg); */
	opacity: 1;
	padding-left: 10px;
	padding-right: 10px;
	transition: 0.3s;
}


/* Styles for content box image with superimposed text  */
.imageBox_Square{
	padding: 0px;
	margin-right: 40px;
	margin-bottom: 40px;
	height: 360px;
	width: 360px;
	background-color: #4682b4;
	font-size: 0px;
	position: relative;
	float: left;
	overflow: hidden;
	border-bottom-right-radius: 40px;
	
}

/*
.imageBox_Image{	
	height: 100%;
	z-index: 0;
	transition: 1s;
}
*/

#iBox1{}

#ibImage1{
	height: 100%;
	z-index: 0;
	opacity: 1;
	transition: 0.5s;
	height: 100%;
	margin-left: -150px;
	
}

#iBox1:hover #ibImage1{
	height: 100%;
	z-index: 0;
	opacity: 0.2;
	transition: 0.5s;
	height: 105%;
	margin-left: -150px;
}




/* .imageBox_Image:hover{	
	height: 100%;
	z-index: 0;
	opacity: 0.2;
	transition: 0.3s;
	height: 100%;
	transition: 1s;
	margin-left: -150px;
}

*/

 
.imageBox_Text_Icon{
	padding: 0px;
	margin: 0px;
	color: #ffffff;
	font-weight: bold;
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 1;
}


#ibIcon {
	transform: rotate(0deg);
	transition: 0.5s;
}


#iBox1:hover #ibIcon{
	transform: rotate(0deg);
	transition: 0.5s;

}


#hbContent{

}

#hbImage{
	
	opacity: 0.8;
	transition: 0.5s;
	
	
}

#hbContent:hover #hbImage{
	
	opacity: 1;
	transition: 0.5s
	
}


/*  Text overlay config styles for content image boxes  */

.imageBox_Text_Large_Base{
	padding: 0px;
	margin-left: 20px;
	margin-right: 30px;
	width: 340px;
	color: #ffffff;
	font-size: 28px;
	font-weight: bold;
	font-family: Open Sans, Arial;
	position: absolute;
	bottom: 65px;
	z-index: 1;
}


.imageBox_Text_Small_Base{
	padding: 0px;
	margin-left: 20px;
	margin-right: 30px;
	color: #ffffff;
	font-size: 16px;
	font-weight: normal;
	position: absolute;
	bottom: 20px;
	z-index: 1;
}



/*  Styles for content in the common page footer:  ------------------------------------------------- */
/**/
/**/


/* Social media icons at bottom of all pages above the bottom of page site menu */
.SocialIcons{
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
	width: 100%;
	background-color: #ffffff;
	margin-bottom: 50px;
	margin-top: 75px;
}


/* Style of full site menu block at the bottom of all pages */
.baseMenu{	
	position: relative;
	margin-top: 0px;	
	width: 95%; 
	height: auto;
	padding-left: 5%;
	padding-top: 0px;
	padding-bottom: 20px;
	font-size: 11pt;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	background-color: #ffffff;
	border-top: 1px solid #b0c4de
}


.mc3Text_first{
	position: relative;
	float: left;
	text-decoration: none;
	margin-left: 3%;
}


.mc3Text_first li {
	list-style: none;
	padding-bottom: 5px;
	padding-top: 5px;
}


.mc3Text{
	position: relative;
	float: left;
	text-decoration: none;
	margin-left: 3%;
	border-left: 1px solid #b0c4de;
}


.mc3Text li {
	list-style: none;
	padding-bottom: 5px;
	padding-top: 5px;
}


.base{
	font-family: Calibri, Arial, Helvetica, sans-serif;
	color: #000000;
	background-color: #ffffff;
	position: relative;
	margin-top: 0px;
	margin-bottom: 50px;
	width: 100%; 
	padding-bottom: 0px;
	padding-top: 0px;
	left: 0px;
	border-top: 1px solid #f0f8ff; 	
}

.bText {
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 12pt;
	text-align: center;	
}


/* Icons for sharing the page on social media */
.SocialShare {
	width: 60%;
	padding: 5px;
	margin: 0px;
	bottom: 0px;
	left: 20%;
	background-image: url(graphics/translucent_grey.png);
	z-index: 1;
	position: fixed;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
}


/**/
/**/
/*  End of styles for content in the common page footer  */



/* Hides the links for menus shown only on mobiles  */
.mobileMenu {
visibility: hidden;
}


/* Hides the spam filter email field in the contact form */
.cEmail {
	display: none;
}

/* / LARGE SCREEN STYLES */

}
/*-------------------------------------------------------------------------------------------------------*/



/* This ensures the main home page picture fills the screen width on very large screens */
 @media only screen and (min-width: 1425px)  {

.mainImg_picture {
width: 100%;
} 

/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXx*/
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXx*/
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXx*/