/* Custom CSS Document */

input {
	padding-left: 8px;
}
td {
	padding:10px;
}
table tr:nth-child(odd) {
background-color: #fff;
}
input[type=button] {
background-color: #3680e6;
border: none;
color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
margin: 4px 2px;
cursor: pointer;
border-radius: 16px;
}

input[type=button]:hover {
background-color: #5993e4;
border: none;
color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
margin: 4px 2px;
cursor: pointer;
border-radius: 16px;
}
.icon-base {
height: 8px;
width: 10px;
}

#username-form {
	background: #EDEDED;
	padding: 30px 30px 10px 30px;
	border-style: solid;
	border-color: lightgrey;
	width: 40%;
	margin: 170px auto;
	border-radius: 3px;
}
#username-form #homepage {
	background-color: #EDEDED;
	border: none;
	color: #0089C7;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
	border-radius: 16px;
	border: none; 
	width: 100%; 
	font-weight: bold;
}
#username-form #homepage:hover {
	color: #002B61;
	outline: none;
}
#email-label{
	text-align: center;
	margin-bottom: 20px;
	color: #002B61;
}
#email-textbox{
	border-style: solid;
	border-color: #FDA54B;
	font-weight: bold;
	width: 100%;
	text-align: center;
	cursor: center;
	padding: 10px 10px 10px 10px;
}
#user-button{
	background-color: #0089C7;
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 10px 2px;
	cursor: pointer;
	border-radius: 16px;
	border: none; 
	line-height: 40px; 
	width: 100%; 
	padding-bottom: 5px; 
	padding-top: 10px;
	font-weight: bold;
}
#user-button:hover{
	background-color: #002B61;
	color: white;
	border-color: #0089C7;
}
@media only screen and (max-width: 1000px) {
	#username-form{
	width: 70%;
}
}
@media only screen and (max-width: 600px) {
	#username-form{
	width: 80%;
}
}
/* start new from DAN G. 08/23/22 */
.menu-links {
	padding-top: 10px;
}
/* end new from DAN G. 08/23/22 */
alert {
	padding: 20px;
	background-color: #4CAF50;
	color: white;
	opacity: 1;
	transition: opacity 0.6s;
	margin-bottom: 15px;
}
.closebtn {
	margin-left: 15px;
	color: white;
	font-weight: bold;
	float: right;
	font-size: 22px;
	line-height: 20px;
	cursor: pointer;
	transition: 0.3s;
}
.closebtn:hover {
	color: black;
}
h5 {
	padding-top: 10px;
	/* padding-bottom: 5px; */
}
.button {
	background-color: #4CAF50; /* Green */
	border: none;
	color: white;
	padding: 16px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	cursor: pointer;
}
.button1 {
	background-color: white; 
	color: black; 
	border: 2px solid #4CAF50;
}
.button1:hover {
	background-color: #4CAF50;
	color: white;
}
.button2 {
	background-color: white; 
	color: black; 
	border: 2px solid #008CBA;
}
.button2:hover {
	background-color: #008CBA;
	color: white;
}
.button3 {
	background-color: white; 
	color: black; 
	border: 2px solid #f44336;
}
.button3:hover {
	background-color: #f44336;
	color: white;
}
.button4 {
	background-color: white;
	color: black;
	border: 2px solid #e7e7e7;
}
.button4:hover {background-color: #e7e7e7;}
.button5 {
	background-color: white;
	color: black;
	border: 2px solid #555555;
}
.button5:hover {
	background-color: #555555;
	color: white;
}
input[type=submit]{
	background-color: #008CBA; /* Green */
	border: 2px solid darkblue;
	border-radius: 5px;
	color: white;
	padding: 8px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	cursor: pointer;
}
input[type=button] {
	background-color: #008CBA; /* Green */
	border: 2px solid darkblue;
	border-radius: 5px;
	color: white;
	padding: 8px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	cursor: pointer;
}
input[type=submit]:hover{
	background-color: #fff; 
	border: 2px solid darkblue;
	border-radius: 5px;
	color: #4CAF50;
	padding: 8px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	cursor: pointer;
} 
input[type=button]:hover{
	background-color: #fff; 
	border: 2px solid darkblue;
	border-radius: 5px;
	color: #4CAF50;
	padding: 8px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	cursor: pointer;
} 
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
	-webkit-appearance: none; 
	margin: 0; 
}
input[type=number] {
	-moz-appearance:textfield; /* Firefox */
}
	
input[type=text] {
	width: 250px;
	line-height: 30px;
	border: 1px solid green;
	border-radius: 3px;
	-moz-appearance:textfield; /* Firefox */
}
.circle {
	border-radius: 50%;
	width: 25px;
	height: 25px;
	background-color: #78c793;
	position: relative;
}
.bar {
	margin: 0 auto;
	position: absolute;
	background-color: #fff;
}
.horizontal {
	width: 70%;
	height: 20%;
	left: 15%;
	top: 40%;
}
.storebuttonactive {
	background-color: #dceae3;
	color: #6da585;
	width: 250px;
	border: 1px #dceae3;
	height: 50px;
	font-size: 20px;
	border-radius: 15px;
}
.storebutton {
	background-color: #fff;
	color: #000;
	width: 250px;
	border: 1px #000;
	height: 50px;
	font-size: 20px;
	border-radius: 15px;
}
.vertical {
	width: 20%;
	height: 70%;
	left: 40%;
	top: 15%;
}
@media (max-width: 399px) {
	.orderform {
	display: none;
}
	
	.mobilemessage {
	display:'';
}
}
@media (min-width: 400px){
	.mobilemessage {
	display:none;
}
}
	 #scroll {
	position:fixed;
	right:10px;
	bottom:10px;
	cursor:pointer;
	width:50px;
	height:50px;
	background-color:#3498db;
	text-indent:-9999px;
	display:none;
	-webkit-border-radius:60px;
	-moz-border-radius:60px;
	border-radius:60px
}
#scroll span {
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-8px;
	margin-top:-12px;
	height:0;
	width:0;
	border:8px solid transparent;
	border-bottom-color:#ffffff;
}
#scroll:hover {
	background-color:#e74c3c;
	opacity:1;filter:"alpha(opacity=100)";
	-ms-filter:"alpha(opacity=100)";
}

/* Dan G adding inline styles and header styles*/

@-webkit-keyframes alertPulse {
	0% {background-color: #ececec; opacity: 1;}
	50% {opacity: red; opacity: 0.75; }
	100% {opacity: #ececec; opacity: 1;}
	
}
.alertPulse-css {
	animation: alertPulse 2s ease-out;
	animation-iteration-count: infinite;
	opacity: 1;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 7px;
	padding-top: 7px;
	text-align: center;
	font-size: 12px;
	vertical-align:top;
	border-radius: 80px;
	background: #9A2727;
}
/*
	@media screen and (max-width: 990px) {
	#desktop-nav{
	display: none;
}
} */
.header__navbar {
	color: #222;
	text-transform: uppercase;
	font-size: 10px;
}
	
.header__navbar a:link {
	color: #222;
	text-transform: uppercase;
	font-size: 12px;
}
.header__navbar a:visited {
	color: #222;
	text-transform: uppercase;
	font-size: 12px;
}
.header-desktop4 {
	box-shadow: 0px 0px 0px 0px;
}
	
@font-face {
	font-family: 'MyWebFont';
	src: url('fonts/font-fce4bd27.woff2'); /* IE9 Compat Modes */
}
.pill {
	background-color: #3680e6;
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;
}
.pill:hover {
	background-color: #5993e4;
}
	
.pill-white {
	background-color: #fff;
	border: none;
	color: #222;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;
}
.pill-white:hover {
	background-color: #fff;
	color: blue;
}
.resmenu {
	color: #777;
	font-size: 12px;
	text-transform: uppercase;
}
.resmenu a:link{
	color: #777;
	font-size: 12px;
	text-transform: uppercase;
	
}
.resmenu a:visited{
	color: #777;
	font-size: 12px;
	text-transform: uppercase;
	
}input[type=text] {
	border: 1px solid #999;
	width: 100%;
	line-height: 40px;
}
input[type=password] {
	border: 1px solid #999;
	width: 100%;
	border-radius: 2px;
	line-height: 40px;
}
	
/* Form CSS */
.form-text {
	font-size: 12px;
	color: blue;
}
td {
	padding: 20px;
}
input[type=text] {
	border: 1px solid #999;
	width: 100%;
	line-height: 40px;
}
input[type=password] {
	border: 1px solid #999;
	width: 100%;
	border-radius: 2px;
	line-height: 40px;
}
	
input[type=submit] {
	
	background-color: #3680e6;
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;

}
	
input[type=submit]:hover {
	 background-color: #5993e4;
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;

}
	
	input[type=button] {
	
	background-color: #f7faf6;
	border: 1px;
	color: #222;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;

}
	input[type=button]:hover {
	
	background-color: #dfb273;
	border: none;
	color: black;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;

}
/* Adding the page for forgotpass.php */
.password_reset_form #reset_button {
	background-color: #0089C7;
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 10px 2px;
	cursor: pointer;
	border-radius: 16px;
	border: none; 
	line-height: 40px; 
	width: 100%; 
	padding-bottom: 5px; 
	padding-top: 10px;
	font-weight: bold;
}
.password_reset_form #homepage {
	background-color: #EDEDED;
	border: none;
	color: #0089C7;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
	border-radius: 16px;
	border: none; 
	width: 100%; 
	font-weight: bold;
}
.password_reset_form #reset_button:hover {
	background-color: #002B61;
	color: white;
	border-color: #0089C7;
}
.password_reset_form #homepage:hover {
	color: #002B61;
	outline: none;
}
#fpemail{
	border-style: solid;
	border-color: #FDA54B;
	font-weight: bold;
	width: 100%;
	text-align: center;
	cursor: center;
	padding: 10px 10px 10px 10px;
}
.password_reset_form{
	background: #EDEDED;
	padding: 30px 30px 10px 30px;
	border-style: solid;
	border-color: lightgrey;
	width: 40%;
	margin: 170px auto;
	border-radius: 3px;
}
.password_reset_form ::placeholder{
	text-align: center;
}
#email-label{
	text-align: center;
	margin-bottom: 20px;
	color: #002B61;
}
/* Mobile Formatting */
@media only screen and (max-width: 1000px) {
	.password_reset_form{
	width: 70%;
}
}
@media only screen and (max-width: 600px) {
	.password_reset_form{
	width: 80%;
}
}
label {
	display: block;	
	padding: 0px 5px 0px 10px;
	margin: 0 0 1px 0;
	cursor: pointer;
	background: #fff;
	border-radius: 3px;
	color: #000;
	transition: ease .5s;
	position: relative; /* ADDING THIS IS REQUIRED */
	 
	height:2em;
	width:100%;
}
/*
label::after {
	content: '+';
	font-size: 25px;
	font-weight: 500;
	position: absolute;
	right: 8px;
	top: 2px;
}
input:checked + label::after {
	content: '-';
	font-size: 25px;
	right: 8px;
	top: 2px;
}
*/
.content a {
	color: #777777;
} 
.content a:hover {
	color: #f57a20;
} 
.content {
	background: #fff;
	 padding:0px 10px 0px 10px;
	
	margin: 0 0 1px 0;
	 
}
input + label + .content {
	display: none;
}
input:checked + label + .content {
	display: block;
}

td.max-100px-col {
	width: 100px; 
	word-wrap: break-word;
}
td.max-150px-col {
	width: 150px; 
	word-wrap: break-word;
}
td.max-200px-col {
	width: 200px; 
	word-wrap: break-word;
}
/* 
