body { background-color: #EFF2F4; }

/* navigation */
a.myhanchor {
	color: white !important;
}
a.myhanchor:hover {
	color: black;
	text-decoration: underline;
}
li.myhli {
	margin-top: -3px;
	margin-bottom: -5px;
	color: white !important;
}
.no-padding {
	padding: 0 !important;
}
.no-padding img {
	display: block;
}

/* left navbar */
.nav-pills > li > a {
	padding-top: 0px;
	padding-bottom: 0px;
}

/* make hover dark gray */
.myhli .myhanchor:hover {
  color: #000;
}
.myhli .myhanchor:hover .glyphicon,
.myhli .myhanchor:hover .nav-text {
  color: #000;
}
/* /navigation */

.mynav {
	font-size: 1.0em;
	margin-top: -4px;
	margin-bottom: -4px;
}

/* make images stand out */
.my-img-hilite {
	border: 1px solid #ccc; /* Adjust the color and size of the border as needed */
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3); /* This adds a shadow */
}

/* some effects for countdown */
/* begin pulse */
@keyframes pulse {
	0% { transform: scale(1); }
	50% { transform: scale(1.1); }
	100% { transform: scale(1); }
}

.pulsating {
	animation: pulse 2s infinite;
}
/* /pulse */

/* begin spotlight */
.spotlight-effect { /* not used */
	position: relative;
	z-index: 2;
	box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.7);
}
/* /spotlight */

/* background colors */
.bg-green {
	background-color: #e8f5e9;
}
.bg-orange {
	background-color: #ffe5d4;
}
.bg-red {
	background-color: #f8d7da;
}
.bg-yellow {
	background-color: lightyellow;
}

/* begin rotating dashed border */
.rotating-border {
	position: relative;
	width: 100px;
	height: 100px;
	border: 5px solid transparent;
}
.rotating-border::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid gray;
	border-style: dotted dashed;
	border-radius: 50%;
	animation: rotateBorder 2s linear infinite;
}
@keyframes rotateBorder {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
/* end rotating dashed border */
/* end effects for countdown */

.iconButton {
	background-color: white;
	border: 1px #ccc solid;
	padding: 5px 10px 5px 10px;
}
.glyphButton {
	font-size: 16pt;
	cursor: pointer;
}
.emailFromBuyer {
	border: 0px #ccc solid;
	border-radius: 8px;
	background-color: lightblue;
}
.emailFromSeller {
	border: 0px #ccc solid;
	border-radius: 8px;
	background-color: lightyellow;
}

/* glyphs for message table */
.messageGlyph {
	font-size: 12pt;
}
.boldrow {
	font-weight: bold
}

/* Add Snipe dialog */
.input-group-addon {
	font-size: 1.2em;
	font-weight: bold;
	padding: 8px;
}
.bgwhite {
	background-color: white;
}
.bgselected {
	background-color: darkgreen;
	color: white;
}

/* Switch button at https://bootsnipp.com/snippets/xzXG */
.btn-default.btn-on.active{background-color: #5BB75B;color: white;}
.btn-default.btn-off.active{background-color: #DA4F49;color: white;}

.btn-default.btn-on-1.active{background-color: #006FFC;color: white;}
.btn-default.btn-off-1.active{background-color: #DA4F49;color: white;}

.btn-default.btn-on-2.active{background-color: #00D590;color: white;}
.btn-default.btn-off-2.active{background-color: #A7A7A7;color: white;}

.btn-default.btn-on-3.active{color: #5BB75B;font-weight:bolder;}
.btn-default.btn-off-3.active{color: #DA4F49;font-weight:bolder;}

.btn-default.btn-on-4.active{background-color: #006FFC;color: #5BB75B;}
.btn-default.btn-off-4.active{background-color: #DA4F49;color: #DA4F49;}
/* /preferences */


/* blue button that clicks down and to the right */
.my-blue-button {
	border-radius: 10px; /* Rounded corners */
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); /* Subtle shadow */
	transition: transform 0.2s; /* Smooth transition for click effect */
}
.my-blue-button:active {
	transform: translate(3px, 3px); /* Move down and to the right on click */
}
.add-snipe-button {
	background-color: transparent;
	border: 0;
	transition: transform 0.2s; /* Smooth transition for click effect */
}
.add-snipe-button:active {
	transform: translate(3px, 3px); /* Move down and to the right on click */
}