@charset "utf-8";
/* Fonts */
@font-face {
    font-family: 'montserrat';
    src: url('/_fonts/montserrat-bold-wf.eot');
    src: url('/_fonts/montserrat-bold-wf.eot?#iefix') format('embedded-opentype'),
         url('/_fonts/montserrat-bold-wf.woff') format('woff'),
         url('/_fonts/montserrat-bold-wf.ttf') format('truetype'),
         url('/_fonts/montserrat-bold-wf.svg#montserratbold') format('svg');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('/_fonts/montserrat-regular-wf.eot');
    src: url('/_fonts/montserrat-regular-wf.eot?#iefix') format('embedded-opentype'),
         url('/_fonts/montserrat-regular-wf.woff') format('woff'),
         url('/_fonts/montserrat-regular-wf.ttf') format('truetype'),
         url('/_fonts/montserrat-regular-wf.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
/* Base styles: */
html,button,input,select,textarea {color:#000;}
::-moz-selection {background: #555;text-shadow: none;}
::selection {    background: #555; text-shadow: none;}
hr {display:block;height:2px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}
img {vertical-align: middle;}
fieldset {border:0;margin:0;padding:0;}
textarea {resize:vertical;}
/* -------------------------------------------------------- */


/* ==========================================================================
   Allport custom styles
   
   Start off assuming small mobile device -> change styles according to available device screen sizes	*/

/* Below is the starting point equivalent to:
					@media only screen and (min-width: 0px) and (min-device-width: 0px) {
*/

 
/* `Basic HTML ---------------------------------------------------*/
pre,code {font-family:'DejaVu Sans Mono',Menlo,Consolas,monospace;}
body {font-family:Helvetica, Arial,  sans-serif;
	  background-color: #000;  color: #000;
	  font-size: 1.5em;  line-height: 150%;}
/* Container widths and margins */
	body>header, body>nav, .pageContainer, #headerNav,#headerImageCont {padding:0px;margin:0px auto;width:100%;}
	/* `Headings ------------------------------------------*/
		h1,h2,h3,h4,h5,h6 {font-family:montserrat, Arial, Helvetica, sans-serif; font-weight:bold;color:#000000;}
		h1{font-size:170%;margin:0 0 0.67em 0}
		h2{font-size:150%;margin:0 0 0.83em 0}
		h3{font-size:130%;margin:0 0 1em 0}
		h4{font-size:120%;margin:0 0 1.33em 0}
		h5{font-size:110%;margin:0 0 1.67em 0}
		h6{font-size:100%;margin:0 0 2.33em 0}
	/* Paragraph text, table text, lists, etc ------------- */
		p,td,th,ul,ol,li,fieldset,dl,div {font-size:100%;}
	/* `Spacing --------------------------------------------*/
		ol { list-style: decimal;}
		ul { list-style: disc;}
		li { margin-left: 30px; font-family:montserrat, Arial, Helvetica, sans-serif;}
		/* p,dl,hr,ol,ul,pre,table,address,fieldset,figure {margin-bottom:14px;}*/

		/* --- Site's links should remain in this order */
		a:link {	color:#00F;	text-decoration: underline; }
		a:visited { color:#606;    text-decoration: underline; }
		a:hover, a:active, a:focus { text-decoration: none;}	
	
/*---- Header Container and elements  ------------*/
#headerCont {background-color:#000;color:#fff;}
#headerTopStrip {position:relative;padding-top:12px;height:73px;}
#headerContacts1, #headerContacts2 {	position: absolute;				 padding: 7px;
										top: 35px;	 /*height: 30px;*/ 	width:180px;
										font-size: 12px;				  	border-top:1px #fff solid; }
#headerContacts1 {display:none; 	left:65px;		  border-left:1px #fff solid; }
#headerContacts2 {display:none;	right: 65px;		border-right:1px #fff solid;	  text-align: right; }
#headerContactsLogo {text-align:center;letter-spacing:3px}
#headerContactsLogo span.lVl {background:#000 url(/_img/1px-w.png) center repeat-y;padding:10px 0px;width:20px;display:inline-block;}
#headerContactsLogo a:link, #headerContactsLogo a:visited, #headerContactsLogo a:hover {color:#fff;	text-decoration:none;}
#headerImageCont{position:relative; }
#headerImage {  max-width:100%;	width:100%;	height:286px;	z-index: 1;
				-webkit-touch-callout:none;	-webkit-user-select:none;
				-khtml-user-select:none;   		-moz-user-select:none;
				-ms-user-select:none;			user-select:none;		}
#headerImageCaption {position: absolute; 		top: 24px;	left: 24px;
					 z-index: 2;				padding:5px 0px;  /*height: 30px;*/	width: 200px;
					 border:1px #000 solid;	 color:#000;	text-align:center;	font-weight:bold;
					 font-size:120%;			letter-spacing:2px     }
/* -------- Main nav bar -------- */
#headerNav  {display:none;       height:44px;  
					text-align: center;
					padding:0px;margin-bottom:-1px;/*iPad fix*/
					background:#ffffff url(/_img/nav-bg.png) center bottom no-repeat;
					background-size:95%;    }
ul#headnav {	        list-style: none;		        display:inline-block;
				        padding: 0px 0px 0px 0px;	    margin: 6px 0px 0px 0px;
						background-color:#fff;   }
ul#headnav>li>a {	   display: inline-block;		   text-decoration:none;
					    height: 19px;					padding: 5px;
						font-size: 14px;				 letter-spacing: 0.1em;
						font-weight:bold;   }
ul#headnav>li>a.hnNorm:link, ul#headnav>li>a.hnNorm:visited  { color:#000;}
ul#headnav>li>a.hnNorm:hover, ul#headnav>li>a.hnCurrent:link,ul#headnav>li>a.hnCurrent:visited{color:#fff;background-color:#000;}
ul#headnav>li>a.noHand {cursor: default;}
ul#headnav>li {         float:left;     position:relative;	margin:0px 2px; 	height:29px;}
ul#headnav>li.separator { width:1px; background:#fff url(/_img/nav-sep.png) center center no-repeat;margin:0px;} 
ul#headnav>li>ul.sub  { display: none;					list-style: none;
                		position: absolute;			   top: 15px; 	left: 0px;
                		margin-left: 0px; 				 padding:0px;
                        background-color:#000;			font-size:13px;    }
ul#headnav>li>ul.sub>li{ margin:0px; text-align:left; display: block;  		}
ul#headnav>li>ul.sub>li>a { height: 24px;				border-top:1px #333333 solid;
							padding: 6px 7px 0px 7px;	margin:2px 0px; 
							min-width:160px;			 display:block; 	  }
ul#headnav>li>ul.sub>li>a.hnNorm, ul#headnav>li>ul.sub>li>a.hnNorm:visited{font-weight: normal !important;text-decoration:none;color:#fff;}
ul#headnav>li>ul.sub>li>a.hnNorm:hover, ul#headnav>li>ul.sub>li>a.hnCurrent:link {color:#000;background-color:#ccc; }
li>ul {	top: auto;	left: auto;}
ul#headnav>li:hover ul, ul#headnav>li.over ul {display: block;}
/* ----- Mobile / small screen nav bar ----- */
#mobileNav {display:block;width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;
						background-color:#666;padding:12px;
						font-size:200%;position:relative;}
#mobileNav a,#mobileNav a:visited {background-color:#333;color:#fff;text-align:center;text-decoration:none;display:block;
									width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;
									padding:30px 6px;}
#mobileNav>a { letter-spacing:0.5em; }									
#mobileNavLinks {display:none;}
#mobileNavLinks>a,#mobileNavLinks>a:visited{background-color:#000;border-bottom:2px #999 solid;} 	
		
/* --- footer --- */
	#footer {font-size:110%; margin:0px auto; padding:30px 0px;width:100%;}
	#footer, #footer #footerMain, #footer #footerLeft, #footer #footerRight,#footer #footerLinks
		{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;}			
	#footerMain {border:2px #fff solid; border-top:none;text-align:center;margin:30px auto 20px auto;width:100%;}
	#footer a:link, #footer a:visited{ color:#FFF;text-decoration:none;}
	#footer a:hover {text-decoration:underline;color:#0F0;}
	#footerLinks, #footerLeft, #footerRight{color:#fff;margin:-16px auto 30px auto;}
	#footerDesignBy {text-align:center;padding:18px;}
	#footerDesignBy>a:link,#footerDesignBy>a:visited{color:#969696;text-decoration:none;}
	#footerDesignBy>a:link:hover{text-decoration:underline}
/* end footer */		
		
/* ---- page Container --- */
.pageContainer {font-size:120%;}		
/* ---- page content wrapper ---- */
.pageContent {  padding:30px 1.25% 18px 1.25%; background-color:#fff; overflow:hidden;}
.pageContent p,ul { font-size:100%;}
.pageContent ul>li {margin-bottom:6px;}

/* ---- Columns and content -------------*/
 #leftCol, 
 #rightCol { display:none; width:47.5%; margin:0 1.25%; float:left;}
 #contentCol { float:left; width:97.5%; margin:0 1.25%;}
 #endCol {clear:both;height:0;font-size:1px;line-height:0px;}

 #leftCol>div,#rightCol>div,#contentCol>div {border:1px #000 solid;padding:0px 9px 9px 9px;margin-bottom:40px;}
 #leftCol>div,#rightCol>div {text-align:center;}
 #leftCol img,#rightCol img {max-width:98%;display:block;margin-left:auto;margin-right:auto;}
 #leftCol>div>h3,
 #rightCol>div>h3,
 #contentCol>div .boxHeading {padding:0px 6px;background-color:#fff;margin:-14px 0px 16px 0px;
 			  display:inline-block;vertical-align:top;}
 #leftCol p, #rightCol p {font-size:90%;text-align:left;line-height:120%;margin-top:1px;}
 #contentCol img {border:2px #000 solid; max-width:98%;}
 #contentCol p {margin-top:1px;}
 #contentCol h2,#contentCol h3 {margin:10px 0px 2px 0px;}
 #contentCol .underlineH {border-bottom:1px #000 solid;}
/*--------------------------------------------------------------*/		


/* Contact Form */
#mainContactForm {min-width:270px;}
#mainContactForm fieldset{margin:0px;padding:0px;}
#mainContactForm label {display:block;margin:3px 0px 2px 0px;}
#mainContactForm input {}
#mainContactForm input[type="checkbox"] {cursor:pointer;}
#mainContactForm input[type="text"] {width:250px;  padding:4px; }
#mainContactForm textarea  {width:250px;height:50px; padding:4px;}
#mainContactForm a.smBut {/*background-image: url(/_img/or-but-sm.png);background-repeat:no-repeat;*/
background-color:#000; width:82px; height:33px;color:#000;font-size:10px;font-weight:bold;text-decoration:none;text-align:center;line-height:10px;display:inline-block;padding-top:11px;margin-left:12px;}
#mainContactForm a.smBut:hover {/*background-image:url(/_img/or-but-sm_mo.png);*/background-color:#ccc;}		
		
/* #######################################################################################
 }   End of base mobile / small screen device rules 
   ####################################################################################### */

@media only screen and (orientation:portrait) { /*increase font size for portrait views when small*/
	.pageContainer {font-size:150%;}
}
/*  screens large enough to display 2 columns */ 
@media (orientation:landscape) and (min-device-height:768px) and (min-width:768px),(orientation:portrait) and (min-device-width:768px) and (min-width:768px), (min-device-width: 768px) {
	body {font-size:1.1em;}
	#headerNav {display:block;} #mobileNav {display:none;}
	.pageContainer {font-size:100%;}
	#contentCol {width:72.5%;float:right;}
	#contentCol hr {display:block;height:1px;border:0;border-top:1px solid #000;margin:1.2em 0 1.8em 0;padding:0;}
	#contentCol img {border-width:1px;}
	#leftCol,#rightCol {display:block; width:22.5%; margin:0 1.25%; }
	#rightCol {float:left;}
	#footer {font-size:90%;}
	#footerMain {border:1px #fff solid; border-top:none;text-align:center;margin:5px auto 20px auto;}
	#footerLinks {float:left;width:38%;margin-bottom:12px;}
	#footerLeft {float:left;padding-left:20px;text-align:left;width:31%;margin-bottom:12px;}
	#footerRight{float:right;padding-right:30px;text-align:right;width:31%;margin-bottom:12px;}
	#footerDesignBy {font-size:80%;}
	
}

/* screens large enough to display all three columns and site at full 960px width */
/*     (min-width:960px) and*/
@media (orientation:landscape) and (min-device-height:960px) and (min-width:960px),  (min-device-width:960px)  {
	body>header, body>nav, .pageContainer, #headerNav,#headerImageCont {width: 960px;}
	body {font-size:0.85em;}
	#headerNav {display:block;} #mobileNav {display:none;}
	#headerContacts1, #headerContacts2 {display:block;}
	.pageContainer {font-size:96%;}
	#contentCol {width:47.25%;float:left;}
	#rightCol {clear:none;float:right;}
	#leftCol>div>h3,#rightCol>div>h3,#contentCol>div .boxHeading {margin-top:-11px;}
	#footer {width: 960px;}
	#footerLeft{width:40%;}#footerLinks{width:20%;}#footerRight{width:40%;}
}

/* ------- WARNING RE THE ABOVE STYLES ------------------- */
/* Beacause Internet Explorer versions below version 9 dont support @media queries
   Internet Explorer version 8 and below will load the site as it is meant for a 
   Mobile phone / small device
   For this reason a conditional statement in the head loads another stylesheet
   named ie-responsive-design-fix.css with overwrites the mobile styles with browser ones.
   THEREFORE -> If you edit the above from the second @media query and below
   YOU MUST -> update the ie-responsive-design-fix.css file with matching values 
*/ 








/* -- Helper classes -- */
/* Hide from both screenreaders and browsers*/
.hd {display: none !important; visibility: hidden;}
/* Hide only visually, but have it available for screenreaders */
.vhd {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
/* Extends above to allow the element to be focusable when navigated to via the keyboard */
.vhd.focusable:active,.vhd.focusable:focus {clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto;}
/* Hide visually and from screenreaders, but maintain layout */
.invisible {visibility:hidden;}
.transHover:hover, .trans {filter: alpha(opacity=70);  opacity: 0.7; }
.hand {cursor:pointer;}
.inL {display:inline;}
.inLB {display:inline-block;}
.indent20 {margin:0px 20px;}
.noM {margin:0px;}.noTM { margin-top:0px;}.noBM {margin-bottom:0px;}.noLM {margin-left:0px;}.noRM {margin-right:0px;}
.aC {text-align:center;}   .aR {text-align:right;}   .aJ {text-align:justify;}
.centreH{margin-left:auto;margin-right:auto;}
.shd,.shd10 {-moz-box-shadow:10px 10px 25px #888;-webkit-box-shadow:10px 10px 25px #888;box-shadow: 10px 10px 25px #888;}
.shd5 {-moz-box-shadow:5px 5px 15px #888;-webkit-box-shadow:5px 5px 15px #888;box-shadow:5px 5px 15px #888;}
.txshd5 {-moz-text-shadow:5px 5px 15px #888;-webkit-text-shadow:5px 5px 15px #888;text-shadow:5px 5px 15px #888;}
.rc5 {  -moz-border-radius: 5px; /* Firefox */
        -webkit-border-radius: 5px; /* Safari, Chrome */
        border-radius: 5px; /* CSS3 */
}
.white {color:#ffffff;}
/* -------------- News articles ----------- */
.newsArticleDate {color:#999;font-size:90%;float:right;margin:0px 0px 0px 8px;}
/* -------------  I M A G E S  ----------------------- */
.stretch {width:100%;display:inline-block;font-size:0;line-height:0}
.imageCollection {text-align:justify;-ms-text-justify:distribute-all-lines;text-justify:distribute-all-lines;}
.imageCollection img {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;
					  vertical-align:top; display:inline-block; *display: inline;
    				  zoom: 1;}
.imageCollection img.imgThumbs5Row {min-width:14%; max-width:16.8%; }
/*.imageCollection img.imgThumbs5Row:nth-child(1) {margin-left:0;}
.imageCollection img.imgThumbs5Row:nth-child(5) {margin-right:0;}*/

.imageCollectionLabels {text-align:justify;-ms-text-justify:distribute-all-lines;text-justify:distribute-all-lines;}
.imageCollectionLabels div {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;
					  vertical-align:top; display:inline-block; *display: inline;
    				  zoom: 1;}
.imageCollectionLabels div.imgThumbs3Row {min-width:22%; max-width:28%; }					  
.imageCollectionLabels p {text-align:center;}
.imageCollectionLabels img {max-width:100%;}

	
.imageLeft {float:left; margin:5px 10px 1px 0px;}
.imageRight {float:right; margin:5px 0px 1px 10px;}


/* -------------- F L O A T S ------------------------ */
.fltLeft{float:left;}.fltRight{float:right;}
.clearfloat{clear:both;height:0;font-size:1px;line-height:0px;}
.clearfloat { *zoom: 1;}
.clearL {clear:left;}
.clearR {clear:right;}
/* non selectable - for layout items */
.noSelect {-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;
			-moz-user-select:none;-ms-user-select:none;user-select: none;}

/*  Ask Q and A styles ----- */
.q-a {font-weight:bold;font-size:120%;margin-right:9px;}

.nojavascript {border:4px #000 solid;-moz-border-radius: 10px; /* Firefox */
        -webkit-border-radius: 10px; /* Safari, Chrome */
        border-radius: 10px; /* CSS3 */
padding:40px;		
}
.nojavascript p {font-size:18px;}

/* Print styles */
@media print {
    * { background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;  text-shadow: none !important;    }
    a,a:visited {text-decoration: underline;}
    a[href]:after {content: " (" attr(href) ")";}
    abbr[title]:after {content: " (" attr(title) ")";}
    a[href^="javascript:"]:after, a[href^="#"]:after {content:"";}
    pre,blockquote{border:1px solid #999;page-break-inside: avoid;}
    thead {display:table-header-group;}
    tr,img {page-break-inside: avoid;}
    img {max-width: 100% !important;}
    @page {margin: 0.5cm;}
    p,h2,h3 {orphans:3;widows:3;}
    h2,h3 {page-break-after:avoid;}
}
