/*
 * plantamor.css
 * -----------
 */
 
body {
  zoom: 90%;
}

a{
  	text-decoration:none;
}

a:hover {
    color: red;
text-decoration:underline;	
}

a:active {
    color: orange;
}
 
.top-ribbon{ 
padding-left:15px;padding-right:20px;background:#1fa67a;
}
.top-logo{ 
position:relative;display:inline-block;color:white;font-size:2em;padding-left:1%;padding-top:10px;font-weight:bold; 
} 
.log-modal{  
max-width:400px;margin-top:100px;padding:10px;border-radius:4px;background:whitesmoke;
} 

.con-modal{  
max-width:500px;margin-top:100px;padding:10px;border-radius:4px;background:whitesmoke;
} 

@media only screen and (max-width: 600px) {
      .md-only {
	  display:none;
	  }
 } 
@media only screen and (min-width: 600px) {
      .xs-only {
	  display:none;
	  }
}  
.top-menu{
   position:relative;display:inline-block;float:right;color:white;font-size:17px;padding-top:24px; 
} 
.top-menu-item{
display:inline;cursor:pointer;margin-right:8px;
}

.top-menu-login{
display:inline;cursor:pointer;margin-right:8px;font-size:14px;
}
a.top-menu-item{
color:white; !important;
}

a.top-menu-login{
color:white; !important;
}

.search-box{
height:40px;width:100%;padding-left:6px;border-radius:2px;
}

.login-as{
position:relative;display:inline-block;float:right;top:-10px;color:red;
}
a.top-menu-item a:hover{
color:red;
}
.pl-page-title{
width:100%;clear:both;text-align:center;display:block;padding:10px;font-size:24px;font-weight:bold;color:#1fa67a;
}
.pl-select-container{
width:100%; margin:auto;background:#fff;padding:4px;border-top:1px solid #1fa67a;
} 
.pl-select{
margin:3px;height:30px;font-size:15px;width:98%;background:ivory;
}

.pl-select-result{
width:100%;min-height:50px;margin:auto;margin-bottom:20px;border-bottom:1px solid #1fa67a;font-size:20px;color:#1fa67a;
}

.pl-select-title{
position:relative;top:22px;
}


.pl-display-number{
position:relative;top:28px;float:right;font-size:15px;
}

.abcd_block {
width:50px;height:50px;padding:1px 6px;background:#1fa67a;color:#ffffff;font-weight:bold
}

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

.image-grid {
  width: 100%;
  max-width: 1310px;
  margin:auto;
  overflow: hidden;
  padding: 10px 5px 0;
  }

.image__cell {
  float: left;
  position: relative;
  width:auto;
  max-width: 20%;
  height: auto;
  border:3px solid #fff;
  }

.image--basic {
	padding-top:1%;
	text-align:center;
	height:auto;
	width: auto;

}

.basic__img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 140px;
	padding:2px;
	}

.image__cell.is-collapsed .arrow--up {
  display: block;
  height: 10px;
  width: 100%;
  background:#fff;
}

.image--large {
  max-width: 90%;
  height: auto;
  max-height: 100%;
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
 
 }

.image__cell.is-collapsed .image--basic {
  cursor: pointer;
}

.image__cell.is-expanded .image--expand {
  max-height: 800px;
  margin-bottom: 10px;
  
}

.image--expand {
  position: relative;
  left: -15px;
  right: -15px;
  padding: 0 5px;
  box-sizing: content-box;
  overflow: hidden;
  background: #222;
  max-height: 0;
  transition: max-height .5s ease-in-out,
              margin-bottom .1s .1s;
  width: 530%;
  text-align:center;
	z-index:60;
}

.image__cell:nth-of-type(5n+2) .image--expand {
  margin-left: -103%;
}

.image__cell:nth-of-type(5n+3) .image--expand {
  margin-left: -206%;
}

.image__cell:nth-of-type(5n+4) .image--expand {
  margin-left: -309%;
}

.image__cell:nth-of-type(5n+5) .image--expand {
  margin-left: -412%;
}

.image__cell:nth-of-type(5n+6) {
  clear: left;
}

.image__cell.is-expanded .arrow--up {
  display: block;
  border-bottom: 8px solid #222;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  height: 0;
  width: 0;
  margin: 2px auto 0;
  
}

.expand__close {
  position: absolute;
  top: 5px;
  right: 3%;
  color: #454545;
  font-size: 2.5em;
  line-height: 40px;
  text-decoration: none;
  font-weight: normal;
  z-index:2000;
}
.expand__close:before {
  color: whitesmoke;
  font-style: normal;
}

.expand__close:hover {
  color: #fff;
  text-decoration: none
}
.species_name {
  position:relative;
  width:90%;
  margin:auto;
  padding:4px;
  font-size:20px;
  color: #fff;
  text-align: center;
 
}
.species_name a:link { 
color: #fff;
}

.species_name a:hover { 
color: #dd4b39;
text-decoration:underline;
}

.species_name a { 
color: #fff;
}

.species_name a:hover { 
color: #dd4b39;
text-decoration:underline;
}	

.family { 
position:relative;
display:inline-block;
text-align:center;
padding-right:8px;
}

.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
    background-color: #BDBDBD;
    height: 200px;
    width: 200px;
    text-align: center;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    height: 100%;
    text-align: center;
}
.custom-span{
	font-family: Arial; 
	font-weight: bold;
	font-size: 100px; 
	color: #FE57A1;
	}
	
#uploadFile{border: none;
margin-left: 10px; 
width: 200px;
}

.custom-para{
	font-family: arial;
	font-weight: bold;
	font-size: 24px; 
	color:#585858;
	}

.example-modal .modal {
   position: relative;
   top: auto;
   bottom: auto;
   right: auto;
   left: auto;
   display: block;
   z-index: 1;
}
.example-modal .modal {
 background: transparent!important;
}
.gale{
	position:relative;
	display:inline-block;
	margin:2px;
	max-width:150px;
	max-height:110px;
	}
.del{
	position:absolute;
	top:0;
	left:0;
	cursor:pointer;
	padding:0 6px;
	}

#img{
	width:17px;
	border:none;
	height:17px;
	margin-left:-20px;
	margin-bottom:91px;
	}

.abcd{
	text-align:center;
	}
.abcd img{
	height:100px;
	width:100px;
	padding:5px;
	border:1px solid #e8debd;
	}
	
 .fa { font-family: 'FontAwesome' !important; }