html

{padding: 0; margin: 0;}

body{background: #bbb url(tri.jpg) repeat; 
font-family: 'PT Sans', sans-serif;
position: relative; font-weight:normal; -webkit-text-size-adjust: none; margin: 0 10%;
box-shadow: 0px 0px 60px rgba(23, 23, 23, 0.4);
}


@media only screen and (min-width: 2200px) 
{	body {margin:0 20%; }}

@media only screen and (max-width: 1600px) 
{body {margin:0 10%; }}


@media only screen and (max-width: 1220px) 
{body {margin:0 ; }}


body *
{	text-shadow: none;}


h1, h2, h3, h4, h5, h6{	line-height: 1.4em;	}


p{font-size: 1.08em; margin: 0; padding:0px 5% 0px 5%; font-weight: normal; color: #515b26;  line-height: 1.6em; }

h1{	font-size: 3em; padding:23px 5% 0 5%; color:#515B26; font-weight: 100; margin:0; }

h2{font-size: 1.6em; color: #515B26; padding: 12px 5% 0 5%; font-weight: 400; line-height:1.6em; margin:0; }

h3{	font-size: 1.4em;  padding: 0px 5% 0 5%; font-weight: normal; color: #8ca80f; 
font-variant:normal; font-weight: 300; line-height: 1.6em;}

h4{	font-size: .85em;  padding: 0px 0px 10px 5%; color: #555; font-weight: 100;}

h5{	font-size: .8em;  padding: 0px 0px 0px 5%; color: #666; font-weight: 400; line-height: 1.6em; }

h6{padding: 2px 5% 12px 6%; ; font-size: 1em; font-weight: 100; margin: 1px 0; color:#3E8F8F; }


a, a:link, a:active, a:visited, a:hover {text-decoration: none; outline:none; padding: 1px; border-bottom: 3px solid; color: #8CA80F;}

a {outline: none;}
a:hover{color: #fff; border-bottom: 0px;text-decoration: none; outline:none;   padding: 1px; background:#8CA80F; opacity: .8;}
a:active { color: #1A4545;}

nav a:link, nav a:visited {color: #fff; border:0;}


.grey {color: #bbb;}
.lge {font-size: 1.8em;}
.sml {font-size: 0.23em; color: #c00; }

.min {    padding: 0 0 6px 23px;}
.green {color: #ccf;}
.career {width: 90%; margin:2% 5%; height: auto; background: #C4CECE ; padding: 23px 0; border: 6px solid #C5E0E0;}

.opps {width: 100%; height: auto; float: left; background: #ccc;}
.opps2 {width: 100%; height: auto; float: left; }

.hm {width: 100%; height: auto; float: left; background: transparent;}

.op {width: 50%; height: auto;  float:left; }
.social {width: 40%; height: auto;  float:left; margin: 0 0 0 10%}


.flower {margin:0 0 0 81%;}
.socmed { padding: 0px 0 0 23px; }
.test {margin: 0 5% 0 7%; background: url(quote.png) no-repeat; text-align:justify; letter-spacing: .05em;}
.pink {color: #F0B6CF;  }

.pre img {margin: 23px 32px 8px 6%;}
.faqs {background: url(flower-sml.png) no-repeat 4% 0%; padding: 0 12% 60px 10%;}
.less {font-size: .75em;}
.heart {color: #F0B6CF;}

.covid {background: orangered; color: white; padding: 10px 20px; 
margin: 5%; ; 
font-size: 1.25em;}
.covid a {color: yellow;}
.covid a:hover {background: white; color: black;}


 #intro ul li, #second ul li
{ list-style-type:disc;
  margin: 0px 32px 0 12px; 
  padding: 0px 32px 0px 6px; 
}

#table {margin: 0 0 0 10%;}


#nav2 {width: 100%; margin: 0px; background:  #8ca80f; height:25px; padding:6px 0 23px 0px;  z-index:15; margin: 45px 0 0 0; float: left; position:absolute; text-align: right; }
#nav2 img {margin: 2px 8px 0 0; border: solid 2px white}
#nav2 h3 {padding: 2px 0px 2px 23px; margin: 0; font-size: 1em;} 
#nav2 a:link, #nav2 a:visited {color: #fff; border: 0; }
#nav2 a:hover { color: #F0B6CF; background: transparent; padding: 1px ; opacity:.7;}


.content {padding: 1px 0 0 0; background: #fff; outline: none; width: 100%; margin: 0; height: auto;}


.headertop {background: #8ca80f url(leaves.png) repeat; width: 100%; top: 0; height: auto; padding: 0; position: absolute; z-index: 10; margin: 96px 0 0 0; }
.headertop h1 { font-family: 'Muli', sans-serif; font-size: 4em; color: white; padding:0 0 0 3%; margin: 0; font-weight: 100;}
.headertop h3 {padding: 0px 0 0 3.3%; color:#fff; font-size:1.6em; margin:0;}
.headertop a {color: #fff; border:0; }
.headertop a:hover {color: #ff0;}
.headertop p {padding:0;}

#galleries {width: 100%; height: auto; background: transparent ; padding: 0; margin: 0;}
#galleries img {max-width:100%; height: auto;}



#box {height: auto; width: 100%; border: 0px; float: left; margin: 0 1%; background: transparent; }

#box h3 {font-size: 1.28em;  padding: 6px 5px 6px 5px; font-weight: normal; color: #8ca80f; border-bottom: 2px solid #fff; margin: 0;}

#box img {max-width: 100%; height: auto; 
border-top: 20px solid #fff; border-left: 4px solid #fff; border-right: 0px solid #fff; border-bottom: 0 solid #fff;
 padding:0;}

#cf1 {  position:relative;  height:auto;  width:96%;  margin:0% auto; background: transparent;}

#cf1 img {  position:absolute;  left:0;  
-webkit-transition: opacity 1.8s ease-in-out;  -moz-transition: opacity 1.8s ease-in-out;  -o-transition: opacity 1.8s ease-in-out;  transition: opacity 1.8s ease-in-out; border: 2px solid #fff;}

#cf1 img.top:hover {  opacity:1;}


#hide {display:none;}					

.top {opacity:  0;}


/*------------ #display -----------------*/

#projects {width: 100%; height: auto; background: transparent; padding: 12px 0; margin: 0;}


/*------------ #intro -----------------*/
#intro {background:  #eee;  height: auto;   margin:230px 0 0 0px ; width: 100%; padding:0;}

#intro img{ width:100%; height: auto;padding: 0;}

#intro-rt h4 {font-size: .9em; padding: 0 0 0 12px; color: #515B26;}
#intro-lt {width: 65%; height: auto;  float:left;}

#intro-rt {width: 35%; height: auto;  float:left;  margin:0;}




/*------------ #first -----------------*/

#first {background:#fff; height: auto; margin: 0px; width: 100%; float: left; }

#first img { border: 0px; width:100%; height: auto; margin:0;padding: 0 32px 12px 0;}

#galleries img {width: 100%;}

/*------------------ #second --------------*/
#second {background: transparent; height: auto; padding: 0; width: 100%;}

#second img{ max-width:100%; height: auto; padding: 0 0 12px 32px;}

#pic {width: 100%; height: auto; }

#pic img {max-width: 100%; height: auto;} 

/*------------------ #third --------------*/
#third {background: #aaa; height: auto; padding: 0; width: 100%;}

#third p {color: #fff;} /*this is against a dark bg and good */

#third a {color: #B5DFDF;}

#third img {  width:100%; padding: 0; margin:0;}

#third ul li

{ list-style-type:disc;
  margin: 0px 0px 0px 81px; 
  padding: 6px 24px 6px 6px; 
  color: #eee;
}


/*------------ #footer -----------------*/


.footer

{	background: #515b26 ; position: inherit;
	font-weight: normal;
	width: 90%; text-align: center;
	height:auto;
	padding:20px 5%; margin: 0; }

.footer.fixed
{position: inherit; bottom: 0;left: 0; }

.footer a {color: #9FC115; border: 0; padding:0;}
.footer a:hover {color: #FF0; background: transparent;opacity: 1; padding: 0;}
.footer h2 {padding: 16px 0 0 0; margin: 0; color: #fff;}
.footer h4 {padding:26px 0 8px 0; font-size: .63em; margin: 0; color: #fff; opacity:.9; letter-spacing: .1em;}


/* code for gallery on project page*/

    .galleria{ width: 100%; height: 600px; background: #fff /*#B5DFDF*/; padding: 0; margin:0; }



/* code for menu-----------------*/
 .toggle, [id^=drop] {

 display: none;

}



nav {
  margin:0;
  padding: 0; 
  width: 80%; 
  height: 48px;
  background: #515B26; 
  padding: 0; 
  position: fixed; 
  z-index: 20;
}


@media only screen and (min-width: 2200px) 
{ nav {width: 60%;}
}




@media only screen and (max-width: 1220px) 

{nav {width: 100%;}

}



nav img {padding: 10px 0px 0 4px;}





nav:after {
  content: "";
  display: table;
  clear: both;
}


nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
}


nav ul li {
  margin: 0px; padding: 0 12px 0 23px;
  display: inline-block;
  float: left;
  background-color: #515B26  ; z-index: 20;
}


nav a {
  display: block;
  padding: 0;
  color: #555;
  font-size: 14px;
  line-height: 45px;
  text-decoration: none;
}


nav ul li ul li:hover { background: #8CA80F;}

nav a:hover { color: #ff0; opacity:1; }

nav ul ul {
  display: none;
  position: absolute;
  top: 45px;
}



nav ul li:hover > ul { display: inherit; }


nav ul ul li {
  width: 130px;
  float: none;
  display: list-item;
  position: relative;
}


nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 130px;

}

li > a:after { content: ' +'; }

li > a:only-child:after { content: ''; }

