/* Website template by GISjoy */


/* --- body fonts -- */


/* PROBLEM width as % ????  */

body {
	box-sizing: border-box;
 	/* background: #254117;   #254117 dark forest green   #347C17  shamrock green  #347235  Medium Forest Green #7F462C */
	background: #2B1B17;     /*  dark brown, midnight  */
/*   	color: #FFE5B4;            ----------- moved to #header .text  p  h    remove to display map text  -----------    */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	/*  margin: 20px;  */
	margin: 5%;
	padding: 0;
	text-align: left;
	word-wrap: normal;
}

@font-face {
	Arial, Verdana, Helvetica, Trebuchet MS, sans-serif;
	font-weight: normal;
	font-style: normal;
}


body {
    font-size: 105%;
}

h1,h2, h3, h4, h5, h6 {
	font-family:'Open Sans', Helvetica, Verdana, Trebuchet MS, Arial, sans-serif;
	color: #FFEBCD;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}

h1, h2, h3, h4, h5, h6:first-line {
    font-variant: small-caps;
 }

h1 {
    font-size: 250%;
}

h1.b {
    font-size: 275%;
}

h2 {
    font-size: 200%;
}

h3 {
    font-size: 175%;
}

h4 {
    font-size: 150%;
}

h5 {
    font-size: 130%;
}

h6 {
    font-size: 115%;
}

p {
    font-size: 105%;
	 color: #FFE5B4;
    padding: 0px 0px 5px 0px;
    text-align: top;
}

p.b {
    font-size: 105%;
    font-weight: bold;
    padding: 0px 0px 5px 0px;
    text-align: top;
}

p.paraft {
    font-size: 100%;
    padding: 0px 0px 5px 0px;
    text-align: top;
}

p.para60 {
    font-size: 100%;
    padding: 60px 0px 5px 0px;
    text-align: top;
}



a:link {
   color: #4EE2EC;
   text-decoration: none;
}

a:visited {
	color: #1CB0BA;
	text-decoration: none;
  }

a:hover {
	color: #4CC417;
	text-decoration: none;
}



/* --- end body fonts -- */




/* --- header div --- */


#header {
}

#header div {
	margin: 0 auto;
	width: 100%;
}

#header div.logo {
	margin: 0;
	padding: 0 0 20px 0;
}

#header img.logo {
	float: left;
	height: 100px;
	margin-right: 5%;
	/* padding-right: 5%; */
	/* text-indent: -99999px; */
}


#header .text {
	/* max-width: 40%; */
	margin: 0;
	float: left;
	color: #FFE5B4;
}


.text-shadow {
  /*    font-size: 270%;  */
  letter-spacing: 1pt;
  text-shadow:
  /* 0 1px 0 #F7E7CE, */
               0 1px 0 #FFE5B4,
               0 2px 0 #FFCBA4,
               0 3px 0 #F2BB66,
               0 4px 0 #E2A76F,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}



/* --- nav - header menu bar -- */

/* Nav */


#nav{
    background: #2B1B17;
    list-style:none;
		font-variant: small-caps;
    font-weight:bold;
    padding: 0px;
    margin-bottom: 40px;
    /*  margin-bottom:75px; */
    float:left;    /* Clear floats */
    width:100%;
    position:relative;       /* Bring the nav above everything else--uncomment if needed.
    position:relative;      z-index:5;     */
}
#nav li{
    float:left;
    position:relative;
    width:25%;
}
#nav a{
    display:block;
    padding: 3px 25px 4px 7px;
    color:#FFEBCD;
    background: #7F462C;    /*  #4CC417;  #2B1B17;   */
    text-decoration:none;
}
#nav a:hover{
    color:#4CC417;
    background:#7F462C;
    text-decoration:none;
}

/*--- Nav dropdown ---*/

#nav ul{
    background:#7F462C;        /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    /*    background:rgba(255,255,255,0);        But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it...      -------- If using a different colour for the background, turning this on means that the background only shows up behing the text, not behind the space beyond the text, i.e. no box area.  -----------   */
    list-style:none;
    position:absolute;
    left:-9999px;    /*  Hide off-screen when not needed (this is more accessible than display:none;)  */
}
#nav ul li{
    /* padding-top:1px;  */ /* Introducing a padding between the li and the a give the illusion spaced items */
    float:none;    /*  gives uniform background box size to menu nav   */
    width:100%;
    display:block;
}
#nav ul a{
    /*  white-space:nowrap;       Stop text wrapping and creating multi-line dropdown items */
    display:block;
}
#nav li:hover ul{     /* Display the dropdown on hover */
    left:0;       /* Bring back on-screen when needed */
}
#nav li:hover a{     /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
    background:#7F462C;
    text-decoration:none;
    /*  text-decoration:underline;   */
}
#nav li:hover ul a{     /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    text-decoration:none;
}
#nav li:hover ul li a:hover{      /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background:#7F462C;
}


/*--- End Nav & dropdown ---*/


/* --- header -- */





/* --- body div --- */



#body {
	}

#body div {
   clear: both;
/*	overflow: hidden;       ----- remove to display maps or don't have maps in div id body  --------    */
	width: 100%;
	margin: 0 auto;
	padding: 0;
}


a {
	outline: none;
}



img.left {
	display:block;
	max-width:100%;
    float: left;
    margin: auto;        /*  needed for responsive web page   */
    height: auto;
    padding: 0px 15px 10px 0px;     /* top, right, bottom, left */
    vertical-align: text-top;
}

img.leftr {
	display:block;
	max-width:100%;
    float: left;
    margin: auto;        /*  needed for responsive web page   */
    height: auto;
    padding: 0px 15px 10px 0px;
    vertical-align: text-top;
	border-radius: 10px;
}

img.leftrsm {
	display:block;
	max-width:100%;
    float: left;
    margin: auto;        /*  needed for responsive web page   */
    height: auto;
    padding: 0px 15px 10px 0px;
    vertical-align: text-top;
	border-radius: 15px;
}

img.center {
    display: block;
    margin: auto;        /*  needed for responsive web page   */
    max-width: 100%;
    height: auto;
    padding-top: 1px;
    padding-bottom: 5px;
}

img.centerban{
    display: block;
    margin: auto;        /*  needed for responsive web page   */
    max-width: 100%;
    height: auto;
/*    padding-top: 1px;
    padding-bottom: 5px;   */
  	border-radius: 15px;
	/*	border-radius: 40px;	*/
    border: 1px solid #FFE5B4;
	padding: 4px;
}

div.center {
    margin: auto;     /*  needed for responsive web page   */
    width: 100%;
    padding-top: 1px;
    padding-bottom: 5px;
}

ul {
  	overflow-wrap: break-word; /* this does not work */
	  word-wrap: break-word;  /* this does not work */
}


ul.s {
    list-style-type: square;
    float: inherit;
  	color: #FFE5B4;
}

ul.s li{
     padding-bottom:5px;  /* Introducing a padding between the li and the a give the illusion spaced items */
     font-size: 105%;
}

ul.sfl {
    list-style-type: square;
    float: left;
  	color: #FFE5B4;
}

ul.sfl li{
     padding-bottom:5px;  /* Introducing a padding between the li and the a give the illusion spaced items */
     font-size: 105%;
/*    float:none;      gives uniform background box size to menu nav   */
}

ul.sp {
    list-style-type: square;
    padding-left:5px;
    float: inherit;
  	color: #FFE5B4;
}

ul.sp li{
     padding-bottom:5px;  /* Introducing a padding between the li and the a give the illusion spaced items */
     font-size: 105%;
/*    float:none;      gives uniform background box size to menu nav   */
		overflow-wrap: break-word; /* this does not work */
		word-wrap: break-word;  /* this does not work */
}

/* --- map wrapper images -- */


#map_col1{
     float:left;
	  width: 426px;
     padding: 0px 14px 10px 0px;
}

#map {
     position: relative;
     border: 1px solid #FFE5B4;
     padding: 2px;
}

#over_map1 {
     position: absolute; top: 10px; left: 230px; z-index: 99;
}




/* --- gallery style images -- */


div.img {
     display: block;
/*    padding: 2px;  */
/*    border: 1px solid #0000ff;   */
    height: auto;
    width: auto;
    max-width:100%;
    margin: auto;        /*  needed for responsive web page   */
    float: left;
    padding: 0px 15px 10px 0px;
    vertical-align: text-top;
}


div.img img {
    margin: 0px 15px 10px 0px;
/*    display: inline;    */
    border: 1px solid #FFE5B4;
    padding: 2px;
/*   margin: 5px;   */
}


div.img a:hover img {
     border: 1px solid #4CC417;
}

div.desc {
    text-align: left;
    font-weight: bold;
	color: #FFE5B4;
	/*  width: 120px;  */
    margin: 10px 5px 5px 0px;
	padding: 0;
}

sec.text{
    text-align: left;
  /*  font-weight: bold;  */
    margin: 10px 5px 5px 0px;
	padding: 0;
}




/* --- footer -- */


#footer {
	}

#footer div {
    clear: both;
	margin: 0 auto;
	min-height: 110px;
	overflow: hidden;
	width: 100%;
   font-size: 100%;
}



/* --- navf - footer menu bar -- */

/* Navf */


#navf{
    list-style:none;
    font-weight:bold;
    padding: 0px;
    margin-bottom:60px;
    float:left;    /* Clear floats */
    width:100%;
    position:relative;
    /* Bring the nav above everything else--uncomment if needed.
    position:relative;
    z-index:5;    */
}
#navf li{
    float:left;
   /*  margin-right:10px;  */
    position:relative;
    width:25%;
		/* overflow-wrap: break-word;
		word-wrap: break-word; */
}
#navf a{
    display:block;
    padding: 3px 25px 4px 7px;
    color:#FFEBCD;
    background:#2B1B17;
    text-decoration:none;
}
#navf a:hover{
    color:#4CC417;
    background:#7F462C;
    text-decoration:none;
}

/*--- Navf dropdown ---*/

#navf ul{
    background:#7F462C;        /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    /*    background:rgba(255,255,255,0);        But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it...  --------- If using a different colour for the background, turning this on means that the background only shows up behing the text, not behind the space beyond the text, i.e. no box area.  -----------   */
    list-style:none;
    position:absolute;
    left:-9999px;     /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#navf ul li{
    /* padding-top:1px;  */ /* Introducing a padding between the li and the a give the illusion spaced items */
     float:none;      /*  gives uniform background box size to menu nav   */
		 width:100%;
		 display:block;
}
#navf ul a{
   /*  white-space:nowrap;  Stop text wrapping and creating multi-line dropdown items */
    display:block;
}
#navf li:hover ul{     /* Display the dropdown on hover */
    left:0;       /* Bring back on-screen when needed */
}
#navf li:hover a{     /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
    background:#7F462C;
    text-decoration:none;
    /*  text-decoration:-underline;   */
}
#navf li:hover ul a{     /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    text-decoration:none;
}
#navf li:hover ul li a:hover{      /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background:#7F462C;
}


/*--- End Nav & dropdown ---*/




/* --- end footer -- */