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

* {
  box-sizing:border-box;
}


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

body 		{margin:0;
			padding:0;
			width:100%;
			background-color:#FFFFFF}

	
#inner 			{box-sizing:inherit;
				width:100%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
				min-width: 285px} 
							

/****NAVBAR - Horizontal Links********/	
	
.topnav {display: block;
	position:fixed;
	z-index: 10;
	background-color:hsla(0,0%,100%,0.65);
    width:100%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	min-width: 285px;
	height:55px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	top: 0}
	
	
	
/* Style the links inside the navigation bar */
.topnav a {display:none;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  float: left;
  color: #4F4F4F;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 16px;
}

/* Change the color of links on hover */
 .topnav a:hover {z-index: 950;
  
  color: #FFFFFF;
 }

/* Add a color to the active/current link */
.topnav a.active {
  background-color: #E0D6BD;
  color: #4F4F4F;
}

/* Right-aligned section inside the top navigation */
.topnav-right {
  float: right;
}	


	

/*Navbar Part2 (SideSlideNav)*************************************/	

	
.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #109045;/*<<<<<Color of the sidenav background*/
  overflow-x: hidden;
  transition: .4s;
  padding-top: 15px; /*This adjusts the padding for the list of links*/
}

	
	
.sidenav a {margin-top:20px;
  padding: 2px 25% 12px 20%; /*<<<<<adjustsplacement of links but also X */
  text-decoration: none;
  font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
  font-size: 20px;
  color: #FFFFFF; /*<<<<<Color of the sidenav Links on UP*/
  display: block;
  transition: 0.3s;
}

	
	
.sidenav a:hover {
  color: #3BD7DB; /*<<<<<Color of the sidenav Links on HOVER*/
}
	
	
.sidenav .closebtn {
  color:#FFFFFF; /*<<<<<Color of the X button UP*/
  position: absolute;
  float:right;
  top: -30px;  /*This moves the position of the X closebutton */
  right: -20%; /*This moves the position of the X closebutton */
  font-size: 42px; /*This adjusts size of the X button */   
}
	
	
#hamburger{display:block;
		z-index: 900;		
		float:right;
		color:#109045; /*<<<<<Color of the MENU Hamburger icon*/
		margin:15px 4%; /*This adjusts the hamburger icon from the TOP and RIGHT*/
		} 
	
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 18px;}
  .sidenav a {font-size: 15px;}
		}
	
	

/****************************Section1*************************************************/


.section1 	{margin: auto;
  			 width: 85%;
 			 border: 0px solid #73AD21;  /***use border for testing***currently set to 0px*/
 			 padding: 0px; /***use paddig for testing***currently set to 0px*/
			 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			 text-align: center;			
			}
	
h1      {color: #109145;}
h4          {color: #B89D0F}
			
#links  {color: #19A300}
	
#logo      {display: block;
			width:300px; height:auto; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			position: absolute;
			top: 80px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			left: 50%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			transform: translate(-50%,-50%);}	
				
#message 	{text-align:center;
			line-height: 30px;			;
			height:auto;			 
			margin-top:150px;
			font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			font-size: 19px; /********Adjustment Point*****************/
			}
	
#Bottles				{display:block; 
						 width:360px; /*********Adjustment Point**********/
			     		 height:100%; /*********Adjustment Point**********/
						 margin: auto;
						 margin-top: 10px; /*********Adjustment Point**********/
						}

.Copyright			{text-align: center;
					 font-size: 18px; /*********Adjustment Point**********/
					 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
				 	 color:#A2A2A2;
					 padding-left: 5px;
					 padding-right: 5px;
					 margin-top: auto;
			   		}		
	
	
	


} /********THE END BRACKET - DO NOT DELETE ******/


/*********************************************Tablet_Portrait Size*******************************************************************************/
@media ( min-width : 481px ) and (max-width : 768px ){


body 		{margin:0;
			padding:0;
			width:100%;
			background-color:#FFFFFF}
	
	
#inner 			{margin:auto;
				width:98%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/}
	
	
/*NAVBAR*/	
.topnav {display: block;
	position:fixed;
	z-index: 10;
	background-color:hsla(0,0%,100%,0.65);
    width:100%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	min-width: 285px;
	height:60px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	top: 0}
	
	


/* Style the links inside the navigation bar */
.topnav a {display:none;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  float: left;
  color: #4F4F4F;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 16px;
}

/* Change the color of links on hover */
 .topnav a:hover {z-index: 950;
  
  color: #FFFFFF;
 }

/* Add a color to the active/current link */
.topnav a.active {
  background-color: #E0D6BD;
  color: #4F4F4F;
}

/* Right-aligned section inside the top navigation */
.topnav-right {
  float: right;
}	



/*Navbar Part2 (SideSlideNav)*************************************/	

	
.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #109045;/*<<<<<Color of the sidenav background*/
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 15px; /*This adjusts the padding for the list of links*/
}

	
	
.sidenav a {margin-top:20px;
  padding: 0px 25% 12px 30%;
  text-decoration: none;
  font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
  font-size: 21px;
  color: #FFFFFF; /*<<<<<Color of the sidenav Links on UP*/
  display: block;
  transition: 0.3s;
}

	
	
.sidenav a:hover {
  color: #02B6B0; /*<<<<<Color of the sidenav Links on HOVER*/
}
	
	
.sidenav .closebtn {
  color:#FFFFFF; /*<<<<<Color of the X button UP*/
  position: absolute;
  float:right;
  top: -25px;
  right: -15%; /*This moves the position of the X closebutton */
  font-size: 45px; /*This adjusts size of the X button */ 
  
}
	
	
#hamburger{display:block;
		z-index: 900;
		float:right;
		color:#109045; /*<<<<<Color of the MENU Hamburger icon*/
		margin:15px 4%; /*This adjusts the hamburger icon from the TOP and RIGHT*/
		} 
	
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 15px;}
		}
		
	
	
	
	
	
	
	


/****************************Section1*************************************************/


.section1 	{margin: auto;
  			 width: 85%;
 			 border: 0px solid #73AD21;  /***use border for testing***currently set to 0px*/
 			 padding: 0px; /***use paddig for testing***currently set to 0px*/
			 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			 text-align: center;			
			}
	
h1      {color: #109145;}
h4          {color: #B89D0F}
			
#links  {color: #19A300}
	
#logo      {display: block;
			width:350px; height:auto; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			position: absolute;
			top: 65px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			left: 190px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			transform: translate(-50%,-50%);}	
				
#message 	{text-align:center;	
			width: 100%;
			height:auto;			 
			margin-top:200px;
			font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			font-size: 19px; /********Adjustment Point*****************/
			}
	
#Bottles				{display:block; 
						 width:450px; /*********Adjustment Point**********/
			     		 height:100%; /*********Adjustment Point**********/
						 margin: auto;
						 margin-top: 10px; /*********Adjustment Point**********/
						}

.Copyright			{text-align: center;
					 font-size: 18px; /*********Adjustment Point**********/
					 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
				 	 color:#A2A2A2;
					 padding-left: 5px;
					 padding-right: 5px;
					 margin-top: auto;
			   		}		
	
	
	


} /********THE END BRACKET - DO NOT DELETE ******/


/************************************************Tablet_Landscape Size*************************************************************************/
@media (min-width : 769px ) and ( max-width : 1249px ){


body 		{margin:0;
			padding:0;
			width:100%;
			background-color:#FFFFFF}
	


#inner 			{margin:auto;
				width:94%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/}

	
/*NAVBAR******/	
.topnav {display: block;
	position:fixed;
	z-index: 10;
	background-color:hsla(0,0%,100%,1.00);
    width:100%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	min-width: 285px;
	height:90px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	top: 0}
	
	

/* Style the links inside the navigation bar */
.topnav a {display:none;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  float: left;
  color: #4F4F4F;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 16px;
}

/* Change the color of links on hover */
 .topnav a:hover {z-index: 950;
  
  color: #FFFFFF;
 }

/* Add a color to the active/current link */
.topnav a.active {
  background-color: #E0D6BD;
  color: #4F4F4F;
}

/* Right-aligned section inside the top navigation */
.topnav-right {
  float: right;
}	



/*Navbar Part2 (SideSlideNav)*************************************/	

	
.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #109045;/*<<<<<Color of the sidenav background*/
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 15px; /*This adjusts the padding for the list of links*/
}

	
	
.sidenav a {margin-top:20px;
  padding: 0px 25% 12px 30%;
  text-decoration: none;
  font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
  font-size: 25px;
  color: #FFFFFF; /*<<<<<Color of the sidenav Links on UP*/
  display: block;
  transition: 0.3s;
}

	
	
.sidenav a:hover {
  color: #02B6B0; /*<<<<<Color of the sidenav Links on HOVER*/
}
	
	
.sidenav .closebtn {
  color:#FFFFFF; /*<<<<<Color of the X button UP*/
  position: absolute;
  float:right;
  top: -25px;
  right: -15%; /*This moves the position of the X closebutton */
  font-size: 45px; /*This adjusts size of the X button */ 
  
}
	
	
#hamburger{display:block;
		z-index: 900;
		float:right;
		color:#109045; /*<<<<<Color of the MENU Hamburger icon*/
		margin:16px 7%; /*This adjusts the hamburger icon from the TOP and RIGHT*/
		} 
	
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 80px;}
		}
		
	
	
	
	
	
	
	
	
	
	
	
	
	
/****************************Section1*************************************************/


.section1 	{margin: auto;
  			 width: 95%;
 			 border: 0px solid #73AD21;  /***use border for testing***currently set to 0px*/
 			 padding: 0px; /***use paddig for testing***currently set to 0px*/
			 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			 text-align: center;			
			}
	
h1      {color: #109145;}
h4          {color: #B89D0F}
			
#links  {color: #19A300}
	
#logo      {display: block;
			width:380px; height:auto; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			position: absolute;
			top: 65px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			left: 180px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			transform: translate(-50%,-50%);}	
				
#message 	{text-align:center;	
			width: 100%;
			height:auto;			 
			margin-top:200px;
			font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			font-size: 20px; /********Adjustment Point*****************/
			}
	
#Bottles				{display:block; 
						 width:730px; /*********Adjustment Point**********/
			     		 height:100%; /*********Adjustment Point**********/
						 margin: auto;
						 margin-top: 10px; /*********Adjustment Point**********/
						}

.Copyright			{text-align: center;
					 font-size: 18px; /*********Adjustment Point**********/
					 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
				 	 color:#A2A2A2;
					 padding-left: 5px;
					 padding-right: 5px;
					 margin-top: auto;
			   		}		
	
	
	


} /********THE END BRACKET - DO NOT DELETE ******/


/************************************************Desktop Size*************************************************************************/
@media  ( min-width : 1250px ){


body 		{margin:0;
			padding:0;
			width:100%;
			background-color:#FFFFFF;
			}
	
#inner 			{margin:auto;
				width:90%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/
				max-width:1300px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/}
	
	
	
/********NAVBAR*****/	
.topnav {position:fixed;
	z-index: 10;
	margin: auto;
	background-color:rgba(255,255,255,1.00);
    width:90%; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	max-width: 1300px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/
	height:130px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
	top: 0}
	


/* Style the links inside the navigation bar */
.topnav a {display:block;
	font-family:"Berlin Sans Fb", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  float: left;
  color: #109046;
  text-align: center;
	height:130px;
  padding: 53px 16px;
  text-decoration: none;
  font-size: 17px;
}

/* Change the color of links on hover */
 .topnav a:hover {z-index: 950;
  background-color: #000000;
  color: #B89D0F;
 }

/* Add a color to the active/current link */
.topnav a.active {
  background-color: hsla(0,0%,100%,0.65);
  color: #B08016;
}

/* Right-aligned section inside the top navigation */
.topnav-right {
  float: right;
}	

	

/*Navbar Part2 (SideSlideNav)*************************************/	

	
.sidenav {display: none;
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #002A4C;/*<<<<<Color of the sidenav background*/
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 15px; /*This adjusts the padding for the list of links*/
}

	
	
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
  font-size: 22px;
  color: #FFFFFF; /*<<<<<Color of the sidenav Links on UP*/
  display: block;
  transition: 0.3s;
}

	
	
.sidenav a:hover {
  color: #02B6B0; /*<<<<<Color of the sidenav Links on HOVER*/
}
	
	
.sidenav .closebtn {
  color:#FFFFFF; /*<<<<<Color of the X button UP*/
  position: absolute;
  float:right;
  top: -5px;
  right: 3%; /*This moves the position of the X closebutton */
  font-size: 42px; /*This adjusts size of the X button */ 
  
}
	
	
#hamburger{display:none;
		z-index: 900;
		float:right;
		color:#002A4C; /*<<<<<Color of the MENU Hamburger icon*/
		margin:-5px 3%; /*This adjusts the hamburger icon from the TOP and RIGHT*/
		} 
	
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 80px;}
		}

	

/****************************Section1*************************************************/


.section1 	{margin: auto;
  			 width: 95%;
 			 border: 0px solid #73AD21;  /***use border for testing***currently set to 0px*/
 			 padding: 0px; /***use paddig for testing***currently set to 0px*/
			 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			 text-align: center;			
			}
	
h1      {color: #109145;}
h4          {color: #B89D0F}
			
#links  {color: #19A300}
	
#logo      {display: block;
			width:400px; height:auto; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			position: absolute;
			top: 65px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			left: 140px; /*<<<<<<ADJUSTMENT POINT<<<<<<<<*/	
			transform: translate(-50%,-50%);}	
				
#message 	{text-align:center;	
			width: 100%;
			height:auto;			 
			margin-top:200px;
			font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
			font-size: 21px; /********Adjustment Point*****************/
			}
	
#Bottles				{display:block; 
						 width:1155px; /*********Adjustment Point**********/
			     		 height:100%; /*********Adjustment Point**********/
						 margin: auto;
						 margin-top: 10px; /*********Adjustment Point**********/
						}

.Copyright			{text-align: center;
					 font-size: 18px; /*********Adjustment Point**********/
					 font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
				 	 color:#A2A2A2;
					 padding-left: 5px;
					 padding-right: 5px;
					 margin-top: auto;
			   		}		
	
	
	


} /********THE END BRACKET - DO NOT DELETE ******/