/* nav bar */
.navbar-default {
  background-color: #339933;
  border-color: #99cc99;
}
.navbar-default .navbar-brand {
  color: #ecf0f1;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #ffffff;
}
.navbar-default .navbar-text {
  color: #ecf0f1;
}
.navbar-default .navbar-nav > li > a {
  color: #ecf0f1;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > .dropdown-menu {
  background-color: #339933;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a {
  color: #ecf0f1;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus {
  color: #ffffff;
  background-color: #99cc99;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li.divider {
  background-color: #99cc99;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
  color: #ffffff;
  background-color: #99cc99;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #99cc99;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #ffffff;
  background-color: #99cc99;
}
.navbar-default .navbar-toggle {
  border-color: #99cc99;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #99cc99;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ecf0f1;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #ecf0f1;
}
.navbar-default .navbar-link {
  color: #ecf0f1;
}
.navbar-default .navbar-link:hover {
  color: #ffffff;
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ecf0f1;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #99cc99;
  }
}

.panel-default > .panel-hardiestpalms {
	background: #d6e9c6; 
	color: #006699;
	font-size: 11pt;
	font-weight: bold;
}

body
{
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 10pt;
	background: white;
	color: black;
}

.photo
{
	position: relative;
	float: left;
	font-size: 0.75em;
	width: 108px;
	text-align: center;
	height: 190px;
	margin: 1px 1px 1px 1px;
	padding: 2px 0px 0px 0px;
	background-color: #eeeeee;
	border: thin #000000 solid;
	border-color: silver;
	border-radius: 5px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    transition: all 0.3s ease-in-out;
}

.photo::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: 0px;
  right: 0px; 
  width: 100%;
  height: 100%;
  background: #f5f5f5;
  opacity: 0;
  border-radius: 5px;
  box-shadow: 0px 0px 25px rgba(0,0,0,0.3);
  transition: opacity 0.3s ease;
}

.photo p
{
	text-align: center;
	/* font-style: italic; */
	font-size: smaller;
	text-indent: 0;
}

/* Scale up the box */
.photo:hover {
  transform: scale(1.0, 1.0);
}

/* Fade in the pseudo-element with the bigger shadow */
.photo:hover::after {
  opacity: 1;
}

/* div.Title
{
	position: relative;
	clear: left;
	font-family: arial, Helvetica, Verdana, sans-serif;
	font-size: 14pt;
	font-weight: bold;
	color: #004040;
	border-bottom: 4px #000000 double;
	margin-bottom: 10px
}

div.Order
{
	position: relative;
	clear: left;
	font-family: arial, Helvetica, Verdana, sans-serif;
	font-size: 12pt;
	font-weight: bold;
	color: #004040;
	padding-top: 10px;
}

div.Family
{
	position: relative;
	clear: left;
	font-family: arial, Helvetica, Verdana, sans-serif;
	font-size: 10pt;
	font-weight: bold;
	color: #404040;
	padding-top: 10px;
}

.order
{
	text-align: center;
	font-size: 14px;
	font-weight: bold;
}
.family
{
	text-align: center;
	font-size: 10px;
	font-weight: bold;
} */
.species
{
	text-align: center;
	font-style: italic;
	font-size: 10px;
	font-weight: bold;
}



/* div.Date
{
	position: relative;
	top: 0px;
	clear: left;
	font-family: arial, Helvetica, Verdana, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #004040;
	padding-top: 10px;
} */