* 	{
	margin: 0;
	padding: 0;
	}

html, body 	{
		width:100%;
		min-height: 100vh;
		font:   sans-serif;
		box-sizing: border-box;
		}
body {
     	display: flex;
	flex-direction: column;
	background-color: #392D21;
background-image: -webkit-gradient( linear, left bottom, right bottom, color-stop(0.00, #392D21), color-stop(0.04, #544A3D), color-stop(0.96, #544A3D), color-stop(1, #392D21) );
                background-image: linear-gradient( #392D21 0%, #544A3D 2%, #544A3D 98%, #392D21 100%);
                background-image: -o-linear-gradient(left , #392D21 0%, #544A3D 2%, #544A3D 98%, #392D21 100%);
background-image: -moz-linear-gradient(left , #392D21 0%, #544A3D 2%, #544A3D 98%, #392D21 100%);
background-image: -webkit-linear-gradient(left , #392D21 0%, #544A3D 2%, #544A3D 98%, #392D21 100%);
background-image: -ms-linear-gradient(left , #392D21 0%, #544A3D 2%, #544A3D 98%, #392D21 100%);

background-image: -webkit-gradient(
        linear,
        left bottom,
        right bottom,
        color-stop(0.00, #392D21),
        color-stop(0.02, #544A3D),
        color-stop(0.98, #544A3D),
        color-stop(1, #392D21)
);

	//background-color: #FF3300;
	font: small sans-serif;
	line-height: 1.6em;
	}


header, footer	{
		height: fit-content;
		height: -moz-fit-content;
		}

header	{
	// text-align: center;
        //line-height: initial;
	// padding: 5px 10px; /*min(2vw, 10px);*/
        /*background-image: url('../images/banner.png');
	background-repeat: no-repeat;
	background-size: 100%;
        min-height: 15vh;*/
        position: relative;
 	font-weight: bold;
	}

header img {
		width: 100%;
		max-height: 261px;
	   }

.date	{
	display: none;
	font-size: min(.7rem, 2.6vw);
        position: absolute;
        top: 5px;
	left: 20px;
	}

span.biz_name	{
		//margin-top: 5px;
		}

span.biz_motto	{
		//margin-top: 5px;
		}

div.biz_header 	{
                line-height: .99;
   		display: grid;
		position: absolute;
                top: 10%;
                left: 20px;
		
		}

span.biz_name        {
                font-size: min(2.9rem, 5.3vw);
  		font-weight: bold;
                width: fit-content;
                width: -moz-fit-content;
                color: white;
                position: relative;
                //left: 40px;
                //top: 60px;
                }
span.biz_motto       {
                color: black;
                font-size: min(3.3vw, .9rem);
                width: fit-content;
                width: -moz-fit-content;
                font-family: serif;
                //font-size: 10pt;
                position: relative;
                //left: 50px;
                //top: 60px;
                margin-top: 0px;
                }

address	{
        font-size: min(3.1vw, .89rem);
	line-height: normal;
	position: absolute;
	bottom: 19px;
        left: 20px;
	}

address a	{
		color: yellow;
		text-decoration: none;
		}
address a:visited {
		  color: yellow;
		  }

.hamburger      {
                position: absolute;
                top: 5px;
                right: 10px;
                cursor: pointer;
                z-index:2;
                }
.hamburger div {
                width: 35px;
                height: 5px;
                background-color: black;
                margin: 6px 0px;
                transition: .4s;
                }
.change .bar1, .change .bar2, .change .bar3     {
        background-color: wheat;
        }

.change .bar1   {
                -webkit-transform: rotate(-45deg) translate(9px, 6px);
                transform: rotate(-45deg) translate(-9px, 6px);
                }
.change .bar2   {
                opacity: 0;
                }
.change .bar3   {
                transform: rotate(45deg) translate(-8px, -8px);

                }
nav	{
	height: 100%;
	width:0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
	background-color: rgb(0,0,0); /* Black fallback color */
  	background-color: rgba(0,0,0, 0.8); /* Black w/opacity */
	overflow-x: hidden; /* Disable horizontal scroll */
  	transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	}

nav.change	{
	width: 100%;
	}

nav a	{
	text-decoration: none;
	color: yellow;
	}

nav a:visited   {
                text-decoration: none;
                color: yellow;
                }

.menu	{
	position: relative;
  	top: 15%; /* 25% from the top */
  	width: 100%; /* 100% width */
  	text-align: center; /* Centered text/links */
  	margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
	}

.menu li	{
		padding: 18px;
  		text-decoration: none;
  		font-size: 36px;
  		color: #818181;
  		display: block; /* Display block instead of inline */
  		transition: 0.3s; /* Transition effects on hover (color) */
		}
.menu a:hover, .menu a:focus	{
				color: #f1f1f1;
				}


	
/*nav 	{
	text-align: center;
	line-height: normal;
	}

nav #hamburger	{
		display: none;
		}
nav label	{
		font-size: 3em;
                color: orange;
		}
nav ul 	{
	transform: scale(1,0);
	transform-origin: top;
	transition: transform .5s ease;
 	list-style-type: none;
	border: gray;
	position: absolute;
	width: fit-content;
	width: -moz-fit-content;
	margin-left: auto;
	margin-right: auto;
	left: 0;
 	right: 0;
	z-index: 5;
	opacity: .9;
    	}


nav ul li	{
		border-bottom: 1px solid black;
		padding: 10px;
		}
		
nav ul li a	{
		text-decoration:none;
		color: white;
		}


 nav input:checked + .menu 		{
					transform: scale(1,1);
					transform-origin: top;
					transition: transform 0.5s ease;
					border: 2px outset gray;
					font-size: 2em;
					width: fit-content;
					width: -moz-fit-content;
					background-color: #453d3d;
					margin: 0px auto 5px auto;
					}

nav a	{
	transition: color 1s, font-size 1s;
	}

nav a:link      {
                color: yellow;
                text-decoration: none;
                }

nav a:visited   {
                text-decoration: none;
                color: yellow;
                }

nav a:hover     {
                color: red;
		font-size: 1.1em;
                }


nav #currentpage a      {
                        color: orange;
                        font-weight: bold;
                        font-size: 1.5em;
                        }
*/
.enter	{
	padding: 2px 10px;
	transition: 	color 1s,
			background-color 1s;
	}

.enter:hover	{
		color: brown;
		background-color: yellow;
		}

.stress 	{
    		color: red;
		}
.validate       {
                color: red;
                font-weight: bold;
                margin: 0px;
                padding: 0px;
                }

.small_thankyou {
                color: orange;
                font-weight: bold;
                border: inset white;
		border-radius: 15px;
                padding: 15px;
                text-align: justify;
		width: 350px;
                }

legend.main_legend      {
                        font-size: 2em;
                        }

fieldset        {
                padding: 10px;
                margin: 10px 0px 10px 0px;
                }

legend.concerns {
                font-size: 1.2em;
                }


#main-content	{
	//display:grid;
	//justify-content: center;
	position: relative;
	//margin-top: auto;
	//margin-bottom: auto;
	color: white;
	}

#main-content-non       {
			line-height: 1.15;
                        color: white;
                        margin-bottom: 10px;
			padding: 10px 20px;
                        }

#main-content-non a             {
                                text-decoration: none;
                                color: yellow;
				transition: 	color 1s;
                                }

#main-content-non a:visited     {
                                text-decoration: none;
                                color: yellow;
                                }

#main-content-non a:hover       {
				color: orange;
                                }

#main-content-non p {
    font-size: 1.3rem;
    margin: 15px 0px;
    padding-right: 5px;
}

#main-content-non img {
    float: left;
    margin-right: 5px;
    border-radius: 10px;
}

.justify p {
    text-align: justify;
}

table.hours     {
                font-size: 1.7em;
		width: fit-content;
		margin: 20px auto 20px auto;
                }

table.hours th  {
                padding-bottom: 5px;
                }

table.hours td  {
                padding-right: 10px;
                }

div.location-and-hours-grid	{
				display: grid;
				grid-template-columns: auto;
				}

.essential 	{
              
		}

#form	{
	display: none;
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
	font-size: 1.3em;
	}

/* This makes the second to the last input disappear */
#form form tr:nth-last-child(2)	{
				transform: scale(0,1);
                		position: absolute;
				}
iframe	{
	border-radius: 10px;
	float: left;
	margin: 0 10px 10px 0;
	}

#form form	{
		}
#form iframe 	{
		}
#follow	{
/*	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;*/
	text-align: right;
	margin-right: 10px;
	}
#center-form	{
		width: auto;
		margin: auto;
		color: white;
		}

form#info fieldset	{
			border-radius: 10px;
			}

form#info textarea	{
			width: 100%;
			border-radius: 10px;
			}

form#info input	{
		margin: 5px;
		border-radius: 5px;
		}


footer	{
 	display: flex;
	justify-content: center;  /* This affects the p itself */
	text-align: center; /* This is for the img */
	margin-top: 10px;
	font-size: .8em;
        clear: both;
        color: grey;
  	margin-top: auto;
	}

footer p {}

footer img.css		{
    			border: 0;
    			width: 58px;
    			height: 17px	
			}

h2.location_and_hours	{
	margin: 40px 0px;
	}
.google-map	{
		width: 100%
		}

#covid	{
	background: red;
	padding:10px;
	border-radius: 10px;
	line-height: 1.2;
	}
 
.yellow	{
	background-color: yellow;
	color: black;
	}

.captcha	{
		border-radius: 15px;
		}

.blog_entry_list	{
			//line-height: 1.5;
			//margin: 10px 0 0 20px;
			//font-size: 1.1rem;
			}
.blog_style	{
		// line-height: initial;
		}

.blog_style h1, .blog_style h2, .blog_style h3, .blog_style h4, .blog_style ul, .blog_style ol, .blog_style li, 
.blog_style table, .blog_style th, .blog_style td, .blog_style p {
	margin: revert;
	padding: revert;
        font-size: 1.1rem;
}

.blog_style img {
		max-width: 100%;
		}

.blog_style h2, h3, h4 	{
			font-size: 1.6rem;
			}


@media screen and (min-width: 719px) {
   header p.date 	{
			display: initial;
    			/*float: right;
			padding: 2px 5px 0px 0px;
    			font-size: .85em;
			color: black; */
    			}

   div.biz_header	{
   			line-height: .9;
	                display: grid;
        	        position: absolute;
                	top: 25%;
                	left: 20px;
 			}

   span.biz_name	{

                	font-size: min(2rem,3.9vw);
 	/*	font-size: 3vw;
    		width: fit-content;
		width: -moz-fit-content;
		color: white;
    		position: relative;
   		left: 40px;
    		top: 60px; */
		}
   span.biz_motto	{
                font-size: min(2.9vw, .8rem);
	/*	color: black;
		font-size: 2vw;
		width: fit-content;
		width: -moz-fit-content;
    		font-family: serif;
    		font-size: 10pt;
    		position: relative;
    		left: 50px;
    		top: 60px;
		margin-top: 0px; */
    		}
    header address 	{
                        bottom: 30px;
        		font-size: min(2.2vw, .8rem);
			/*color: black;
   			position: relative;
  		 	top: 115px;
    			left: 45px;
    			font-size: 1.1em;
			width: fit-content;
			width: -moz-fit-content;*/
			}	
    header a	{
		//color: black;
		}


    nav	{
	/*position: relative;
	display:flex;
	justify-content: center; */
	}
    nav .hamburger	{
			//display:none;
			}

    nav ul 	{
		/*position: static;
		transform: scale(1,1);
        	list-style-type: none; 
		display: flex;
		justify-content: center;
		border:none;
	 	font-size: 1.49em;	*/
		}
    nav ul li	{
		/*border: none;
		align-self: center; */
		}

   
   #form	{
		display:block;
		color: orange;
		}

   div#form.non		{
			float: right;
			width: fit-content;
    			margin: 30px 30px 10px 15px;
		}

   #main-content	{
			grid-template-columns:auto auto;
			align-items: center;
			justify-content: space-evenly;
			grid-column-gap: 10px;
			}

   #main-content-non	{
			}

   #center-form	{
		max-width: 60%;
		}

   div.location-and-hours-grid  {
                         	grid-template-columns: 1fr 2fr;
 				grid-column-gap: 20px;
                        	}
	
   .location-and-hours-contents	{
				display: flex;
				flex-direction: column;
				justify-content: space-around;
				}

   .google-map	{
		width: 400px;
		height: 350px;
		}

   table.hours {
		}

}