@charset "UTF-8";
/* CSS Document */


/*fonts and colors
color blue #  a7dad9  167, 218, 217, 1.0
green #0d4e97  67, 84, 43,
light green 8dc63f
font-family: 'Raleway', sans-serif;
font-family: 'Alfa Slab One', cursive;*/

@font-face {
font-family: 'alfa_slab_oneregular';
src: url('alfaslabone-regular-webfont.woff2') format('woff2'),
url('alfaslabone-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;

}



* {margin: 0; padding: 0; color: #333;}

html { scroll-behavior: smooth;
}


body {
width: 700vw;
height: 100vh;
background-color: #333;
font-size: 14px;
}

.visit {
	position: fixed;
	top:10%;
	right: 3%;
	width: 10vw;
	height: auto;
	 opacity: 0.8;
	 
		}


.visit:hover {
	position: fixed;
top:10%;
	right: 3%;
	width: 10vw;
	height: auto;
	opacity: 1.0;
		}

.visitm {display: none;}

/*.visit {
	position: fixed;
	top:10em;
	right:4em;
	width: 18em;
	height: auto;
	 opacity: 0.7;
		}


.visit:hover {
	position: fixed;
	top:10em;
	right:4em;
	width: 18em;
	height: auto;
	opacity: 1.0;
		}

	.visitm {float: left;
	margin: 2em 25%;
	width: 50%;
	height: auto;
	 opacity: 0.7;
		display: none;
		}*/
	 

p  {font-size: 1.25vh;
line-height: 2.5vh;
font-family: 'Raleway', sans-serif;
font-weight: 300;
color: #333;
margin-bottom: .5vh;
letter-spacing: -.2px;
}

#about p {margin-top: -.5vh; }
figure p {color: #666; font-size: 1.5vh; margin: 0 2vh 2vh 2vh;}
li p {line-height: 1.5em; margin: 0 0 .125em 0; }

.caption {font-size: 1.5vh;
line-height: 2vh;
font-family: 'Raleway', sans-serif;
font-weight: 500;
color: #333;
margin-bottom: 0;
letter-spacing: -.2px;
}


ul {margin-left: 1em;}



h1 {
font-size: 6vh;
line-height: 1em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 1px;
font-weight: 400;
color: #333;
margin: 4vh 0 5px 0;
text-align: center;
}
/*#about h1 {font-size: 3vh;  margin-top: 3vh;}*/	
h2 {
font-size: 1.8em;
text-align: center;
line-height: 1.3em;
font-family: 'alfa_slab_oneregular';
letter-spacing: .5px;
font-weight: 100;
color: #333;
margin: 1em 0 .3em 0;
}

 

h3 {
font-size: 2em;
line-height: .75em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 1px;
font-weight: 400;
color: #333;
	text-align: center;
}

#welcome h3 {
font-size: 1.5em;
line-height: 1.25em;
font-family: 'alfa_slab_oneregular';
letter-spacing: .25px;
font-weight: 400;
color: #333;
	text-align: center;
}


h4 {
font-size: 1.4em;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
letter-spacing: .5px;

color: #333;
margin: 0 0 0 0;
display: block;
text-align: center;
font-weight:600;
}

#about h4 {margin-top: 1.5vh; }


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

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

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

a:active {
text-decoration: none;
color: #a7dad9 ;  }



/* ----------------------nav ----------------*/

	nav p {display: inline; font-size: 1.25em; margin-right: 1em;}

nav li {display: inline;}

header {position: fixed;
top: 0;
left: 0;
width: 100%;
height: 2.5vw; 
background-color: #333;

}
nav { 
width: 52%;
padding: .5vw 0 0 0;	
margin: 0 auto;

}


.menu {display: none;}




/*.nav-containers {
display: flex;
width: auto;
align-items: center;
justify-content: center;

}

.nav-containers > div {
float: center;
margin: 2px;
padding: 2px;
font-size: 1.25em;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
font-weight: 300;
}

.icon {display: block; width: 5vw; height: 8vh;}
nav img { width: 30px; 
height: auto;  
margin: 1em;
opacity: 0.4;
-webkit-transition: width .5s, opacity .5s;  
transition: width .5s, opacity .5s;
}

nav img:hover { margin: 1em; width: 35px; height: auto; opacity: 1.0; 
}
*/
#welcome {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
margin-top: 0;
}

#welcome2 {
float: left;
width: 96vw;
height: auto;
padding: 0vw 2vw 2vw 2vw;
margin-top: 0;
	background-color: aqua;
}

#products {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}


#culverts {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}
 
#turffarm {
float: left;
width: 96vw;
height: 96vh;
padding: 2vw;
}


 

#contact {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}


.gray {
position: relative;
top: 0;
left: 0;
float: left;
/*background: url("images/stockwithlogo2.jpg") ;	*/ 
	background-color: aliceblue;
height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;background-position: top;
}

.blue {
position: relative;
top: 0;
left: 0;
float: left;
background: url("images/water_gray.jpg") ;
height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;background-position: right;
}


.green {
position: relative;
top: 0;
left: 0;
float: left;
background: url(images/hoses.jpg) ;
height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}


.orange {
position: relative;
top: 0;
left: 0;
float: left;
background: url(images/grassflip.jpg);
height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}



.yellow {
position: relative;
top: 0;
left: 30;
float: left;
background: url("images/culvertsB.jpg") ;
height: 110vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}

 

.red {
position: relative;
top: 0;
left: 0;
float: left;
background: url(images/grassflip.jpg) ;
height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}

.red form {margin-top: 4vh;}

.purple {
position: relative;
top: 0;
left: 0;
float: left;
width: 100%;
height: auto;

}



section
{position: absolute;
width: 72vw;
height: 80vh; 
top: 15vh;
left: 9.5vw;
margin: 0;
padding: 0 0 2em 5em; 
border: #666;
border-width: 1px 1px 0px 1px;
border-style: dotted;
background-image: linear-gradient( rgba(255,255,255, 1.0) , rgba(255,255,255,0.8));	 
}

#welcome section {top: 5vh; margin-top: 0vh;height: 65vh; border: none;  
background-image: linear-gradient( rgba(255,255,255, 0.0) , rgba(255,255,255,0.2));  }

#welcome .col30
{float: left;
width: 33%;
height: auto;
margin: 1% 0% 2% 0;

}


#benefitsofsod section {background-image: url(images/sodrolls.png);  
position: relative;
background-size: cover;
background-repeat: no-repeat;
height: 90vh;}

/*#contact   section {background-image: url(images/sodlift.png); position: relative;
background-size: cover;
background-repeat: no-repeat;
height: 90vh;*/}

#order section {  background-image: linear-gradient( rgba(255,255,255, 0.6) , rgba(255,255,255,0)); }



#turffarm section {
position: absolute;
width: 96%;
height: 50%; 
top: 0;
left: 0;
margin: 0;
padding: 0 2em 0 3em; 
border: #666;
border-width: 0;
border-style: none;
background-image: none;	 
}

.col30 {float: left;
width: 28%;
height: auto;
margin: 1% 5% 2% 0;

}
.col50 {float: left;
width: 35%;
height: auto;
margin: 2em 0 2% 2%;	
	background-color: rgba(255,255,255,0.8);
	padding: 5%;
} 

/*#welcome .col60 {margin-left: 0; text-align: center; width: 90%;}*/


.col100 {float: left;
width: 97%;
height: auto;
margin: 1% 0 1% 0;	
/*border-left: 1px dotted #666;
padding-left: 3%;*/
}


.bar {float: left;
width: 1px;
height: 80%;
background-color: #333;}

.arrow {float: left;
margin: 30vh 0 2vh 2vh;
width: 3vw;
height: 3vh;
z-index: 200;}

.object
{position: absolute;
width: 58%;
height: auto; 
top: 24vh;
left: 20vw;
padding: 2em; 
-webkit-transition: left 2s; /* Safari */
transition: left 4s;
}

.yellow:hover .object {left: 45vw;}



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

footer {position: fixed;
left: 0;
bottom:0;
width: 100vw;
height: 3vw;
padding: 1.5vw 0 0 0;	
background-color: #333;
}


.cen {display: block; margin: 0 10% 0 10%; width:80%;   background-color:rgba(221,159,160,0.5)}

.footerlogo {
float: left;
margin: -2em .5em 0 0; 
width: 15vw; 
height: auto;}

.phone { float: left; width: auto; height: auto; margin-right: 1em; margin-top: .5em; }
.legal { float: left; width: auto; height: auto; margin-right: 1em; margin-top: 1em; }

.fb  
{float: right; width: auto; height: 20%; margin-right: .25em;opacity: 0.5;  }
.in
{float: right; width: auto; height: 20%; margin-right: 0;opacity: 0.5;   }

.in:hover
{ opacity: 1.0;}
.fb:hover
{ opacity: 1.0;}	

 

footer h3 {
font-size: 1.25vw;
line-height: .75em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 1px;
font-weight: 100;
display: inline;
color: #fff;
	 
} 

footer p {
font-size: 1.5em;
color: #999;
display: inline;
	margin-top: 2em;
}

p2 {
font-size: 1em;
line-height: .5em;
font-family: 'Raleway', sans-serif;
font-weight: 300;
color: #999;
	margin-top: 30px;
}


 

input[type=button], input[type=submit], input[type=reset]  {

background: #ddd;
color: #666;
border-style: none;
border-color: #0066A2;
height: 24px;
width: 120px;
border-radius: 8px;
font-family: 'Raleway', sans-serif;
text-shadow:none;
}

input[type=submit]:hover {

background: #999;

}

input[type=text] {
width: 100%;
padding: 2px 5px;
margin: 3px 0 12px 0;
box-sizing: border-box;
border: none;
-webkit-transition: 0.5s;
transition: 0.5s;
outline: none;
background-color:#ddd;
}

input2[type=text] {
width: 100%;
padding: 2px 5px;
margin: 3px 0 12px 0;
box-sizing: border-box;
border: none;
-webkit-transition: 0.5s;
transition: 0.5s;
outline: none;
background-color: #ddd;
}

input[type=text]:focus {
background-color:rgba(167, 218, 237,0.2);
}

input2[type=text]:focus {
background-color:rgba(167, 218, 237,0.2);
}


input[type=text]:hover {
background-color:rgba(167, 218, 217,0.7);
}

input2[type=text]:hover {
background-color:rgba(167, 218, 217,0.7);
}

.half {
float: left;
width: 50%; 

font-family: 'Raleway', sans-serif;

}

textarea  {
width: 100%;
padding: 5px 5px;
margin: 3px 0 8px 0;
box-sizing: border-box;
border: none;
-webkit-transition: 0.5s;
transition: 0.5s;
outline: none;
background-color: #ddd;
}
textarea:focus {
background-color:rgba(167, 218, 217,0.7);
} 


.line {display: block;
width: 100%;
height: 1px;
background-color: #999;
margin: -5px 0 12px 0;
}

.linewhite {display: block;
width: 100%;
height: .5px;
background-color: #fff;
margin: -5px 0 12px 0;
}



/*-------------------------accordion----------------*/

.accordion {
background-color: rgba(167, 218, 217, 0.2);
color: #666;
cursor: pointer;
padding: 1vw;
width: 90%;
border: none;
text-align: left;
outline: none;
font-size: 1.5vh;
transition: 0.4s;
border-radius: 15px;
}

.active, .accordion:hover {
background-color: rgba(167, 218, 217, 0.4); 
}

.panel {
padding: 0 18px;
background-color: rgba(255, 255, 255, 0.7);
overflow: hidden;
max-height: 0;

transition: max-height 0.4s ease-out;
}

.panel p {margin: 18px 0;}

.accordion:after {
content: '\02795'; /* Unicode character for "plus" sign (+) */
font-size: 13px;
color: #777;
float: right;
margin-left: 5px;
}

.active:after {
content: "\2796"; /* Unicode character for "minus" sign (-) */
}







/* --------------------------laptop styles-----------------------------*/
@media only screen and (min-width: 801px) and (max-width:2400px) {


p {font-size: 1.1vw; line-height: 1.75vw;}

body {
width: 100vw;
height: auto;
background-color: #333;
font-size: 11px;}

.accordion {
font-size: 1.1vw;
width: 80%;
}



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

/*footer {position: fixed;
left: 0;
bottom:0vh;
width: 100vw;
height: 2vw;
padding: .5vw 5vw 0 5vw;	
background-color: #333;

}




.fb  
{float: left; width: auto; height: 30%; margin-right: 1vw;opacity: 0.5;  }
.in
{float: left; width: auto; height: 30%; margin-right: 1vw;opacity: 0.5;   }

.in:hover
{ opacity: 1.0;}
.fb:hover
{ opacity: 1.0;}	*/

}

/* --------------------------tablet styles-----------------------------*/
@media only screen and (min-width: 481px) and (max-width:800px) {



body {
width: 100vw;
height: 100vh;
background-color: #333;
font-size: 11px;}


nav {height: 7vh;} 

/*---------------------nav------------------*/


nav { 
width: 60%;
padding: 1% 0 0 0;	
margin: 0 20% 0 20%;
}	


section
{position: absolute;
width: 86%;
height: 100%; 
top: 10vh;
left: 5vw;
margin: 0;
padding: 2em 0 2em 2em; 
border: #666;
border-width: 1px 1px 0px 1px;
border-style: dotted;
background-image: linear-gradient( rgba(255,255,255, 1.0) , rgba(255,255,255,0.8));	 
}
#services   section {width: 86%; height: 100%; }
#contact   section {width: 86%; height: 100%; }
#benefitsofsod section {width: 86%; height: 100%; }
#about section {background-image: none; width: 86%; height: 100%; }
#order  section {width: 86%; height: 100%; }


 
footer p2 {display: none;}



.footersocial
{width: auto; height: 50%; margin-left: 5px;opacity: 0.5;}

.footersocial:hover
{ opacity: 1.0;}

footer h3 {font-size: 1.5em;}

p {font-size: 1.5vw; line-height: 2.25vw;}


#welcome {
float: left;
width: 96vw;
height: auto;
padding: 0vw 2vw 2vw 2vw;
}
	
	 
	
	#products {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}
	
	
		#culverts {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}

 

#turffarm {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}

 

#contact {
float: left;
width: 96vw;
height: auto;
padding: 2vw;
}

}





/*------------------mobile ------------------------*/



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


html {
scroll-behavior: auto;
}

body {
width: 100%;
height: auto;
background-color: #333;
font-size: 16px;
}

p {font-size: 1em;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
font-weight: 300;
}

li p{line-height: 1.5em; margin: 0 0 .5em 0;}

ul {margin-left: 1em;}



h1 {
font-size: 2.5em;
line-height: 1em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 1px;
font-weight: 400;
color: #333;
text-align: left;
}


h2 {
font-size: 1.4em;
text-align: left;
line-height: 1.25em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 0;
font-weight: 100;
color: #333;
margin: .75em 0  0 0;
}

h3 {
font-size: .95em;
line-height: .75em;
font-family: 'alfa_slab_oneregular';
letter-spacing: 1px;
font-weight: 400;
display: inline;
color: #333 ;
}
h4 {
font-size: 1em;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
letter-spacing: 0;
font-weight: 400;
color: #333;
margin: 0 0  0 0;
text-align: left;	

}



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

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

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

a:active {
text-decoration: none;
color: #000;  }


/*---------------------nav------------------*/


header {position: fixed;
top: 0;
left: 0;
width: 100%;
height: 0; 
background-color: rbba(255,255,255, 0); 

}



.menu {display: none;}


nav {
width: 92vw;
height: 100vh;
margin:   4vw;
padding: 15vh 0 5vh 0;	
display: none;
background-color: #333;
}



nav li {display: block; text-align: center; line-height: 3.5em;}

#show:target {display:inline;}
#hide {display:block;}
#show:target {display:block;}
#hide:target {display:none;}

#menu-toggle {
top:20px;
left: 45%;
position:fixed;
z-index: 2000;
}

.menu {
display: block;  

}

	
 


/*#welcome .col60 {margin-left: 0; text-align: left; width: 90%;}*/
#welcome h4 {	
font-size: 1.8vh;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
letter-spacing: .5px;
color: #333;
margin: 0 0 0 0;
display: block;
text-align: left;
font-weight:600;
}

#welcome h1 {color: #333; font-size: 2em; font-weight: 200;margin-left: 0; }



#welcome {
float: left;
width: 92%;
height: auto;
padding: 0% 4% 4% 4%;
margin-top: 0;
}
 


#welcome2 h1 {color: #333; font-size: 2em; font-weight: 200;margin-left: 0; }



#welcome2 {
float: left;
width: 92%;
height: auto;
padding: 0% 4% 4% 4%;
margin-top: 0;
}	
	#products h1 {color: #fff; font-size: 2em; font-weight: 200;margin-left: 0; }
	
	#products h4 {color: #fff;   }
	
	#products {
float: left;
width: 92%;
height: auto;
padding: 4%;
margin-top: 0;
}
	
	
		#culverts h1 {color: #fff; font-size: 2em; font-weight: 200;margin-left: 0; }
	
	#culverts h4 {color: #fff;   }
	
	#culverts {
float: left;
width: 92%;
height: auto;
padding: 4%;
margin-top: 0;
}
 
#contact {
float: left;
width: 92%;
height: 120%;
padding: 4% 4% 20% 4%;

}

#turffarm {
float: left;
width: 92%;
height: auto;
padding: 4%;
	 

} 
	#turffarm section {
position: absolute;
width: 100%;
height: 50%; 
top: 0;
left: 0;
margin: 0;
padding: 0 0 0 0; 
border: #666;
border-width: 0;
border-style: none;
background-image: none;	
	 
}

.gray {
float: left;
top: 0;
left: 0;
/*background: url(images/homem.jpg) ;*/
	background-color: aliceblue;
height: auto;
width: 100%;
background-size: cover;
background-repeat: no-repeat;background-position: top;
}

.blue {
float: left;
top: 0;
left: 0;
background: url("images/waterm.jpg") ;
height: auto;
width: 100%;
position: relative;
background-size: cover;
background-position: right;
background-repeat: no-repeat; 
}

.green {
float: left;
position: relative;
top: 0;
left: 0;
background: url("images/hosesm.jpg") ;
height: auto;
min-height: 100vh;
width: 100%;
background-size: cover;
background-repeat: no-repeat; 
}

.orange {
float: left;
position: relative;
top: 0;
left: 0;
background: url() ;
height: auto;
width: 100%;
background-color:  #a7dad9 ; 
}





.yellow {
float: left;
position: relative;
top: 0;
left: 0;
background: url(images/culvertsBM.jpg) ;
height: auto;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}

.purple {
position: relative;
top: 4em;
left: 0;
float: left;
width: 100%;
height: 100vh;
	background: none ;
background-size: cover;
background-repeat: no-repeat;
 

} 
 
.red {
position: relative;
top: 0;
left: 0;
float: left;
background: url(images/backm.jpg) ;
height: auto;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
}
	
section
{position: static;
float: left;
width: 92%;
height: auto; 
top: 0;
left: 0;
margin: 0;
padding: 4%; 
border: #666;
border-width: 0;
border-style:hidden;
background-image: linear-gradient( rgba(255,255,255, 0) , rgba(255,255,255,0));	
padding-top: 8vh; 

}
#contact section {background-image: none;
}

#benefitsofsod section {background-image: none;
height: auto;}


#welcome section {margin-top: 17vh;   }	
#welcome2 section {margin-top: 0vh;   }	
	
	.col50 {float: left;
width: 88%;
height: auto;
margin: 2em 0 1% 1%;	
	background-color: rgba(255,255,255,0.8);
	padding: 5%;
} 
	
	
.col30 {float: left;
width: 92%;
height: auto;
margin: 0 ;
border-left: 0;
padding: 5%;
	background-color: rgba(255,255,255, 0.9)
}

.col60 {float: left;
width: 92%;
height: auto;
margin: 0 ;
padding: 4% 0 4% 4%;
}


footer {position: fixed;
left: 0;
bottom:0;
width: 99vw;
height: 100px;
padding: 0 0 0 1vw;	
background-image:none;
background-color: #333;
	 
}

/*footer div {display: block;  margin: 0px auto; align-content: center; width: 95%;}*/

	.cen {display: block; margin: 0 0 0 1vw; width: 95vw;    }



	
footer p {
font-size: .75em;
color: #999;
text-align: left;
	 

}

footer h3 {font-size: .8em; margin-left: 1em;}


.footerlogo {
display: inline;
margin: 1em 0 0 1em; 
width: 55vw; 
height: auto;
	 }





.fb  
{float: right; width: auto; height: 70%; margin: -3.75em 2em 1em 0;opacity: 0.5; 
	 }
.in
{float: right; width: auto; height: 70%; margin: -3.75em 0 1em 2em;opacity: 0.5; 
	 }

.in:hover
{ opacity: 1.0;}
.fb:hover
{ opacity: 1.0;}	



p2 {
display: none;
}

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

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

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

a:active {
text-decoration: none;
color: #a7dad9;  }



input[type=text] {
width: 100%;
padding: 2px 5px;
margin: -8px 0 8px 0;
box-sizing: border-box;
border: none;
-webkit-transition: 0.5s;
transition: 0.5s;
outline: none;
background-color:#ddd;
}





input[type=text]:focus {
background-color:rgba(167, 218, 217,0.5);
}

input2[type=text]:focus {
background-color:rgba(167, 218, 217,0.5);
}


input[type=text]:hover {
background-color:rgba(167, 218, 217,0.3);
}

input2[type=text]:hover {
background-color:rgba(167, 218, 217,0.3);
}
textarea  {
width: 100%;
padding: 5px 5px;
margin: 2px 0 8px 0;
box-sizing: border-box;
border: none;
-webkit-transition: 0.5s;
transition: 0.5s;
outline: none;
background-color: #ddd;
}
textarea:focus {
background-color:rgba(241,241,241,0.8);
} 


.line {display: block;
width: 100%;
height: 1px;
background-color: #999;
margin: -5px 0 12px 0;
}

.linewhite {display: block;
width: 100%;
height: .5px;
background-color: #fff;
margin: -5px 0 12px 0;
}



/*-------------------------accordion----------------*/

.accordion {
background-color: rgba(167, 218, 217, 0.2);
color: #666;
cursor: pointer;
padding: 2vw;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 1em;
transition: 0.4s;
border-radius: 10px;
}

.active, .accordion:hover {
background-color: rgba(167, 218, 217, 0.4); 
}

.panel {
padding: 0 18px;
background-color: rgba(255, 255, 255, 0.90);
overflow: hidden;
max-height: 0;

transition: max-height 0.4s ease-out;
}

.panel p {margin: 18px 0;}

.accordion:after {
content: '\02795'; /* Unicode character for "plus" sign (+) */
font-size: 13px;
color: #777;
float: right;
margin-left: 5px;
}

.active:after {
content: "\2796"; /* Unicode character for "minus" sign (-) */
}

	
	.visit {display: none;
	position: fixed;
	top:2em;
	right:2em;
	width: 8em;
	height: auto;
	 opacity: 0.7;
		}


.visit:hover {display: none;
	position: fixed;
	top:2em;
	right:2em;
	width: 8em;
	height: auto;
	opacity: 1.0;
		}

	.visitm {float: left;
	margin: 2em 25%;
	width: 50%;
	height: auto;
	 opacity: 0.7;
		display: block;
		}
	 
	
	

}