/* CSS Document */
/* Design - Mark Abrams 1/2019 */
/* Imports */ 
/* @import url('https://fonts.googleapis.com/c  #menu {
ss?family=Raleway');*/ 
/* @import url('https://fonts.googleapis.com/css?family=Lato:400i,700i');*/ 

/* WEB FONTS */
@font-face{font-family:'OpenSans'; font-weight:400;font-style:normal; font-display: swap; src: local('OpenSans'),url(../fonts/OpenSans-Regular.woff2) format('woff2');}

/* Standardize tags */  
 
html {font-size: 16px;	margin: 0; 	padding: 0;}
h1, h2, h3, h4, h5, h6 {font-size : 100%;color: rgba(0,0,0,1); }
ol,ul   { list-style: none; }	
address, caption, cite, code, dfn, em, strong, th, var {font-weight: normal;}
table {border-width: 0px;}
fieldset, img {border: none;}
caption,th { text-align : left; }
q:before, q:after { content: ''; }
header, section, article, aside, nav, footer{display: block;}
img {
	width: auto; 
	max-width: 100%;
	max-height: 100%;
	height: auto;
}
img.feature {max-width: 40%;height: auto;}
/* Animation Frames */
@keyframes fadein{from{opacity:0;}
to{opacity:1;}
}
/* @-moz-keyframes fadein{from{opacity:0;}
to{opacity:1;}
}
@-webkit-keyframes fadein{from{opacity:0;}
to{opacity:1;}
}
@-ms-keyframes fadein{from{opacity:0;}
to{opacity:1;}
}
@-o-keyframes fadein{from{opacity:0;}
to{opacity:1;}
}

/* PAGE LAYOUT */ 
body {
	font-family: 'OpenSans', sans-serif;
	font-size: 100%;
	line-height: 1.6em;
	margin: 0px;
	padding: 0px;
	background-color: rgba(255,255,255,1);
	color: rgba(0,0,0,1);
	animation: fadein 1s;
	background-repeat: repeat;
	position: relative;
	margin: 0;
	padding-bottom: 1rem;
	min-height: 100%;
	height: 100%;
	}
 
	
header { /* Sticky Header */
	position: absolute;
	width: 100%;
	max-width: 100%;
	z-index: 10;
	top: 0px;
 }
 
nav, section, .sectionnarrative, #frame, article, footer, #creditsframe  {
	max-width: 1024px;
	margin-right: auto;
	margin-left: auto;
	display: block;
	}
 
#masthead {
	margin-right: auto;
	margin-left: auto;
	background-image: url(../images/layout/banner-intranet.jpg);
	height: 250px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 0px; /* maps to fixed height of nav 85 */
	max-width: 1680px;
	max-width: 1024px;	/*animation : 150s linear 1s normal none infinite zoominout; */
	/* [disabled]background-color: rgba(241,246,247,1); */
	border-top-width: 3px;
	border-right-width: 3px;
	border-bottom-width: 3px;
	border-left-width: 3px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: ridge;
	border-left-style: none;
	border-top-color: #E6DFC4;
	border-right-color: #E6DFC4;
	border-bottom-color: #E6DFC4;
	border-left-color: #E6DFC4;
	position: relative;
	}  
#masthead span {
	display: block;
	margin-right: auto;
	margin-left: auto;
	color: #FFF;
	text-align: center;
	font-weight: bold;
	text-shadow: 1px 1px 0px #000;
	letter-spacing: 0.1em;
}
	@keyframes zoominout{
	  0%{
		   transform:scale(1)
		}
	  20%{
		   transform:scale(1.1)
		}
	  40%{
		   transform:scale(1.2)
		}
	  60%{
		   transform:scale(1.3)
		}
	 80%{
		   transform:scale(1.4)
		}
	  100%{
		   transform:scale(1.5)
		}
	}
	
section, footer {

	color: rgb(102,102,102);
	background-color: rgb(250, 233, 216);
 	border-top-width: 3px;
	border-right-width: 3px;
	border-bottom-width: 3px;
	border-left-width: 3px;
	border-top-style: ridge;
	border-right-style: ridge;
	border-bottom-style: ridge;
	border-left-style: ridge;
	border-top-color: #E6DFC4;
	border-right-color: #E6DFC4;
	border-bottom-color: #E6DFC4;
	border-left-color: #E6DFC4;
   	} 
	footer {
	/* [disabled]font-size: 0.9em; */
 	}
section::after,  #office::after {
	content: " ";
	display: block;
	clear: both;
	margin-top: 1em;
}
.sectionblock  {
	padding-right: 20px;
	padding-left: 20px;
	max-width: 1680px;
	clear: both;
	margin-right: auto;
	margin-left: auto;

}
	
.sectionnarrative, article, aside, #office, #creditsframe {
	padding-right: 2em;
	padding-left: 2em;	
	padding-top: .5em;
	padding-bottom: .5em;
 }
aside {	padding-right: 0em;}
article, aside, #office {
	background-color: rgb(255, 248, 242);
}
footer {
	text-align: center;
	padding: 0px;
	line-height: .5em;
    	}
   a#gmap img   {
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
  } 
 
#trailer {
	text-align: center;
	padding-top: 50px;
}

#footnote {
	background-color: rgba(0,0,0,1);
	text-align: center;
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	}
	#footnote span {display:none;}
	#footnote a {
	color: rgba(204,204,204,1);
	margin-bottom: 1em;
}
.anchor-offset {
	display: block;
	position: relative;
	top: -180px;
	visibility: hidden;
}

/* Objects   */
 
article a, aside a, .sectionnarrative a, #office a {
	color: rgba(128,0,0,1);
	text-decoration: none;
	transition: all 1s ease;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: rgba(128,0,0,.5);
  } 
article a:hover, aside a:hover, .sectionnarrative a:hover, #office a:hover{
	color: rgba(17,108,166,1);
 } 
    
#footnote a{
	color: rgba(255,255,255,1);
	text-decoration: none;
	transition: all 1s ease;
 } 
#footnote a:hover{
	color: rgba(106,187,240,1);
  } 


#openingHours span {
	width: 90%;
	display: inline-block;
	float: left;
	margin-bottom: .5em;
 }
#openingHours span span{
	/* [disabled]color: rgba(51,51,153,1) !important; */
	display: inline-block;
	float: right;
	/* [disabled]margin-bottom: 1em; */
	width: 40%;
	font-weight: bold;
 }
a.button, a.button:visited  {
	background-color: rgba(0,0,0,1);
	color: rgba(255,255,255,1);
	border-radius: 50px;
	padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 1em;
	padding-left: 2em;
	text-decoration: none;
	transition: background-color 1s ease;
	font-size: 0.75em;
	/* [disabled]min-width: 150px; */
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}  
a.button:hover {
	background-color: rgba(153,0,153,1);
	color: rgba(255,255,255,1) !important;
} 

 
 
/*  ICONS */
svg.social{
	height: 30px;
	width: 30px;
	fill: rgba(64,64,64,1);
  }	
svg.service {
	height: 100px;
	width: 124px;
	fill: rgba(71,57,35,1);
  }	
svg.service .shade{	
 opacity:0.2;}

a.icon  {
	outline: none;
	border: none !important;
	text-decoration: none;
	color: rgba(71,57,35,1);
	display: inline-block;
	text-align: center;
	margin: 50px;
	width: 180px;
	font-weight: 700;
 	}
#office .icon {
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom: 0px;
	margin-left: 0px;
	height: auto;
	width: auto;
	padding: 0px;
}

/* a.icon:hover {
	color: rgba(255,255,255,1);
	} */	
a.icon:hover > svg .fill {
  fill: rgba(153,0,153,1);   
	} 
a.icon:hover > svg.social .fill {
  fill: rgba(153,0,153,1); 
	} 

a.icon, a svg .fill  { 
  transition: 200ms;
  transition-timing-function: ease-in-out;
}
 
  
 /* PAGE MARKUP */
article a:hover, .sectionnarrative a:hover, #office a:hover{
	color: rgba(17,108,166,1);
 } 
 h1, h2 {
	font-family: "Times New Roman", Times, serif;
}
 h1 {
	font-size: 1.8em;
	padding-top: 1em;
	color: rgba(128,0,0,1);
	margin-left: 1em;
	margin-bottom: 1em;
 }
 
 h2 {
	font-size: 1.1em;
	margin-top: 1em;
	color: rgba(17,108,166,1);
	color:#0145B2;
	margin-bottom: .5em;
}
 h3 {
	font-size: 1.1em;
	margin-top: 1em;
	color: rgba(0,0,0,1);
	margin-bottom: 0.3em;
	/* [disabled]background-color: rgba(128,0,0,1); */
	font-weight: bold;
	font-style: italic;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}


h4 {
	font-size: 1em;
	margin-top: 1em;
	color: rgba(51,51,51,1);
}
p {
	margin-top: 0.5em;
	margin-bottom: .5em;
}
.small {
	font-size: .8em;
}

article ul {
	background-color: rgba(255,255,255,0.5);
	padding-top: 1em;
	padding-right: .5em;
	padding-bottom: 1em;
	padding-left: 0.5em;
	border-radius: 20px;
	box-shadow: 0px 0px 0px 0.2px rgba(128,0,0,0.2);
 }
 
article ul li {
	padding-left: 2em;
	background-image: url(../images/layout/listbullet.gif);
	background-repeat: no-repeat;
	background-position: 0 0.3em;
	list-style-type: none;
	margin-bottom: 0.7em;
	list-style-position: outside;
	margin-left: 1em;
}
 
article .comittee li  {
	padding-left: 0em !important;;
	background-image: none;
	background-repeat: no-repeat;
	background-position: 0 0.3em;
	list-style-type: disc;
	margin-bottom: 0.7em;
	list-style-position: outside;
  }
.uli {
	background-image: none;
	list-style-type: disc;
	font-size: .9em;
	padding: 0px;
}
article ul li ul {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}


.shadow{ 
 	box-shadow: 0px 0px 1px 1px rgba(0,0,0,.25);
}

.text-shadow {text-shadow: 0px 0px 5px rgba(0,0,0,1)}
  
 
.clearfix {
  clear: both;
}  

.left {
	text-align: left;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}

.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
.block {
	display: block;
	width: 100%;
}
.imgLeft, .imgCenter, .imgRight {
	box-shadow: 0px 0px 5px rgba(0, 0, 0, .0);
	border-radius: 10px;
   	}

.imgLeft {
	float: left;
	margin-right: 2em;
	margin-bottom: 2em;
}
.imgCenter {
	margin-bottom: 1em;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	display: block;
}
.imgRight {
	float: right;
	margin-left: 2em;
	margin-bottom: 2em;
}
.padLeft {
	padding-left: 1em;}
.padRight {
	padding-right: 1em;
}
strong, .bold  {
	font-weight: bold;
 }
.larger {
	font-size: larger;
}

 blockquote{font-size:.9em;margin-top:1em;width:90%}blockquote span{font-style:italic}blockquote:after,blockquote:before{content:" ";background-image:url(../images/layout/quote.png);height:1.5em;width:1.8em;display:inline-block;background-repeat:no-repeat;float:left}blockquote:after{float:none;vertical-align:text-bottom;height:1.5em;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)} 
  
  
.caption {
	font-size: 0.9em;
	font-style: italic;
	color: rgba(102,102,102,1);
	font-family: Georgia, "Times New Roman", Times, "serif;";
	display: inline-block;
	clear: both;
	white-space: normal;
	position: relative;
	bottom: 0px;
	margin-top: -2em;
	padding-right: 2em;
	padding-left: 2em;
}  
#reviews{
	height: 520px;
	width: 100%;
	padding: 0;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	background-color: transparent;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
 
#videoThumbs a {
	padding: 2em;
	display: inline-block;
}


.archivesTable {
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	border: thin solid #666666;
}
.archivesTable td {
	padding-top: 5px;
	padding-left: 10px;
	width: 20%;
	border: thin dotted #999999;
}

/* MOBILE CLEAR - Clears thumb image floats  */ 
/* Media query - Tablet Landscape -> Desktop   */
@media (max-width: 400px) {
  .mobileclear {
	clear: both;
	float: left;
	margin-left: auto;
	display: block;
	margin-right: auto;
  }
} 
/* MOBILE ICON */
#mobile-icon {
	background-color: #800000;
	width: 40px;
	height: 35px;
	left: 20px;
	top: 55px;
	position: absolute;
	transform: rotate(0deg);
	transition: .5s ease-in-out;
	cursor: pointer;
	float: left;
	display: inline;
	font-size: 0.8em;
	border: 7px solid #800000;
	text-align: center;
 }

#mobile-icon span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	border-radius: 9px;
	opacity: 1;
	left: 0px;
	transform: rotate(0deg);
	transition: .25s ease-in-out;
	background-color: rgba(236,240,219,1);
}
#mobile-icon.open  { /* toggle mobile menu icon color  on open*/
	color: #FFFFFF;
}
#mobile-icon.open span {
	background-color: #FFF;
}
 
#mobile-icon span:nth-child(1) {
  top: 0px;
  top: 8px;
 }

#mobile-icon span:nth-child(2),#mobile-icon span:nth-child(3) {
    top: 17px;
}

#mobile-icon span:nth-child(4) {
  top: 26px;
}

#mobile-icon.open span:nth-child(1) {
	top: 18px;
	width: 0%;
	left: 50%;
}
#mobile-icon.open span:nth-child(2) {
  transform: rotate(45deg);
}

#mobile-icon.open span:nth-child(3) {
  transform: rotate(-45deg);
}

#mobile-icon.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}
	
 
/* MENU LAYOUT */	
#menu {
	display: none;
}  
#menu.open {
	display: block;
	clear: both;
	height: 100%;
	padding-bottom: 100%;	/* force full menu - VH limits scroll on dynamic menu over 100vh */
	padding-top: 150px;
	padding-left: 35px;
 }

#logo  {
	position: absolute;
	left: 94px;
	top: 35px;
	z-index: 5;
	/* [disabled]display: none; */
  }
#logo img {
	height: 98px;
	width: 164px;
	box-shadow: none;
	/* [disabled]display: none; */
 }

 li.mobile  {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: rgba(153,0,153,1);

 }

#menu .mobile a {
	color: rgba(153,0,153,1);
}
 
 
nav {
	display: block;
	min-height: 85px;
	position: relative;
 }
 
nav.selected {/* toggle mobile menu nav transparent sidebar &background color on mobile open*/
	background-image: url(../images/layout/navopen.png);
	background-repeat: repeat-y;
	background-color: transparent;
	} 

nav ul {
	list-style-type: none;
	margin-left: 75px;
	padding-left: 20px;

 }
nav ul li a  {
	text-decoration: none;
	display: table-cell;
	color: rgba(0,0,0,1);
	transition : all 500ms ease-out;
	height: 50px;
	vertical-align: middle;
	text-transform: uppercase;
}
nav ul li a:hover {
	color: rgba(0,0,0,1);
	border-style: none;
}
nav ul li ul li a  {
	text-transform: capitalize;
	border-bottom-style: none;
	white-space: nowrap;
	padding: 10px;
	}
nav ul ul {
	padding-left: 0px;
	opacity: 0;
	/* [disabled]visibility: hidden; */
	overflow: hidden;
	margin-left: 0px;
	height: 0;
	transition : height 500ms ease-out;
	/* [disabled]width: 100%; */
}

nav ul ul li a:hover {
	/* [disabled]color: rgba(17,108,166,1); */
}

nav li:hover > ul  {
	opacity: 1; 
	visibility: visible;
	height:100%;
	transition: all 1.25s ease;
}
nav li > ul  { /* Keep sub menus open for mobile nav */
	opacity: 1; 
	visibility: visible;
	height:100%;
	transition: all 1.25s ease;
}

#footnote {
	position : fixed;
	bottom: 0px;
	color: rgb(255,255,255);
	font-size: 0.6em;
}
#footnote span{
	line-height: 1.5em !important;
	font-size: smaller;
}
@media (min-width: 1024px) { /* Media query - Tablet Landscape -> Desktop */
	
body {
	margin-top: 10px;
	background-image: url(../images/layout/background.jpg);
 }
header {
	position: absolute;
} 
#logo  {
	position: absolute;
	left: 20px;
	top: 30px;
	z-index: 5;
	width: 164px;
 }

  #mobile-icon {
  display: none;
  }
  section, footer {
	/* [disabled]max-width: 1018px; */ /*1024 - 6px boarder */
}
  article, aside, #office {
	border-radius: 25px;
	box-shadow: .5px .5px 1px 1px rgba(128, 0, 0, 0.3);
}
  article {
	width: 645px;
	float: left;
	margin-left: 1em;
	margin-bottom: 1em;
}
.full {
	width: 90% !important;
 	padding-right: 1.5em;
	margin-right: 1.5em;
  }
 
  aside {
	width: 235px;
	float: right;
	margin-left: 0px;
	margin-right: 1em;
	padding-left: 1em;
	margin-bottom: 0em;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 1em;
}
 
#office {
	font-size: 0.8em;
	width: 235px;
	float: right;
	margin: 1em;
	padding: 0px;
	padding-left: 1em;
} 

/*   a#gmap {
	float: left;
	height: 280px;
 	margin-right: 1em;
 	margin-left: 1.5em;
}
 footer {
	margin-top: 1em;
	position: absolute;
	bottom: 25px;
	display: none; 
}*/
  
  #menu {
	display: inline-block;
	float: left;
	font-size: 0.91em;
	background-color: rgba(128,0,0,1);
	margin-top: 60px;
	/* [disabled]position: absolute; */
	padding-top: 0px;
	padding-bottom: 0px;
	width: 100%;
	margin-left: 3px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding-right: 0em;
	padding-left: 0em;
	/* [disabled]text-indent: 20px; */
	width: calc(100% - 6px);
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #666;
	border-right-color: #666;
	border-bottom-color: #666;
	border-left-color: #666;
  }  

  nav ul {
	padding-left: 0px;
	margin-right: 0px;
	margin-left: 0px;
  }
  nav ul li:first-child {
   margin-left: 15em;  
} 
  nav ul li {
	float: left;
	margin-right: 33px;
  }
    nav ul li:last-child, .nopad {	
	margin-right: 0px;
}

  nav ul li ul { /* controls drop menu speed */
	visibility: hidden;
	overflow: hidden;
	height: 0px;
	position: absolute;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);  
	border-bottom-right-radius:1em;
	border-bottom-left-radius:1em;
 	transition: all 1.25s ease-in 0s;
  }
  
  nav ul li a  {
	color: rgba(233,233,233,1);
	height: 35px; /* -10 to comp nav height border */
	background-repeat: repeat-x;
	background-position: left 90px;
	background-image: url(../images/layout/menuhov.png);
  }
  

  nav ul li a:hover {
	color: rgba(233,233,233,1);
	background-repeat: repeat-x;
	background-position: left bottom;
   }
  nav ul ul li {
	margin-left: 5px !important;
	padding-left: 15px;
	background-position: 0px center;
	background-repeat: no-repeat;
	background-image: url(../images/layout/dropdownhov.png);
	transition: all .5s ease-in 0s;
   }
   nav ul ul li:hover {  
   	background-position: 10px center;
    }
  nav ul ul li a {
	  color: rgba(0,51,255,1); 
  }
  nav ul ul li a,  nav ul ul li a:hover {
	border-bottom-style: none;
	background-image: none;
   }
   
nav ul ul li a:hover {
	border-bottom-style: none;
	background-repeat: no-repeat;
   }   
  nav ul ul{
 	background-color: rgba(128,0,0,1);
   }
    
  nav ul ul li a {
	height: 10px; /* adjust   */
	padding: 0px;
	color: #FFF;
   }
  nav ul ul li   {
	display: block;
	float: none;
  }
  nav li:hover > ul  {
	opacity: 1;
	visibility: visible;
	transition: all 1.25s ease;
	height: 180px !important;
   }
   nav li:hover > ul#mHomes  {
	height: 135px !important;
	}

  nav li:hover > ul#mAbout {   
	height: 135px !important;
 		}
  nav li:hover > ul#mMaps {   
	height: 135px !important;
 		}
		
		
		
.subarticle .submenu {
	background-color: rgba(227,237,239,.5);
	float: left;
	width: 45%;
	margin-right: 2em;
	margin-top: .5em;
}
.subarticle .submenu  li  {
	float: none;
}
.subarticle h2 {
	text-align: right;
}
	
.submenu h4 {
	margin: 0px;
	padding: 0px;
}	
	
}
 
