/*Todos os templates */

span.d-lg-none {
    color: #536e53;
    border: 1px solid #81ac818e;
    border-radius: 5px;
    /* padding: 0px 10px 0px 10px; */
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    background-color: #A6DDA6;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    text-align:center;
}
  
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #302e2e;
    display: block;
    transition: 0.3s;
  
}
  
.sidenav a:hover{
    color: #000000;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}
  
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}
  
/* .container, div.galeria .row { 
    Esconde conteúdos que ultrapassam as dimensões do bloco 
    overflow: hidden !important; 
} */

li.list-group-item a {
    text-decoration: none;
}

div.accordion-body {
    padding: 0;
}

div.accordion-body .list-group-item {
    border: none;
}

button.accordion-button:not(.collapsed) {
    background-color: #d5f7d5;
    color: black;
}

button.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem rgb(81 142 85 / 25%);
}

.div_create {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

button.nav-button {
    border: none;
}

a.user-link {
    color: #0000009f;
    text-decoration: none;
}

button.btn.btn-light, button.btn.btn-secondary, a.btn.btn-secondary {
    background-color:#A6DDA6;
    border-color: #84AE84;
    color: black;
}

div#profile_button, div#create_button {
    position: absolute;
    right: 0;
}

/* .btn.btn-outline-dark {
    background-color: white;
} */

.btn.btn-outline-dark:hover {
    background-color: #84AE84;
}

div.jumbotron {
    background-color: white;
    border: solid #84AE84 1px;
}

.alert.alert-secondary {
    background-color: rgba(248, 248, 248, 0.897);
}

/* Estilo do template base e da página inicial */

/* Header */

/* Barra de navegação */
#logo{
    width: 140px;
}

#logo_sidenav {
    text-align: center;
    width: 130px;
}

/* Retirando espaços em volta do logo */
nav.navbar {
    margin-bottom: 3%;
    padding-top: 0;
    padding-bottom: 0;
    position: fixed;
    width: 100vw;
    top: 0;
    z-index: 5;
    padding-right: 2%;
    padding-left: 2%;
}

body {
 padding-top: 13vh;
}

a.navbar-brand {
    padding-top: 0;
    padding-bottom: 0;
}

@media (max-width: 576px) {
    a.navbar-brand {
        margin: 0;
    }

    .card-img-top {
        object-fit: contain;
    }
}

/* Página inicial Core */


/* Carrossel */

.container .carousel-item img  {
    /* width: 1100px ; */
    height: 200px ;
    object-fit: cover;
}

@media (min-width: 576px) {
    .container .carousel-item img  {
        height: 320px ;
    }
}

@media (min-width: 768px) {
    .container .carousel-item img  {
        height: 380px ;
    }
}

@media (min-width: 992px) {
    .container .carousel-item img  {
        height: 430px ;
    }
}

.col-lg-4 {
    text-align: left;
}

.rounded-circle {
    object-fit: cover;
}

.image-title, .image-description {
    /*text-shadow: 10px -10px 100px black;*/
    /*padding:20px;*/
    color: white; 
    /*text-shadow: 1px 1px 30px black, 0 0 35px black, 0 0 15px black;*/
    /*text-shadow: 1px 1px 20px black, 0 0 30px black, 0 0 30px black;*/
    /*text-shadow: 1px 1px 5px black*/
    text-shadow: 0 0 30px black, 0 -10px 15px black, 
                0 10px 30px black, -20px 0 20px black, 
                20px 0 15px black; 
}

/* Footer */

#footer_logo {
    width: 250px;
}

footer{
    background-color: #84c390 !important;
    margin-bottom: 0;
}

footer .container {
    padding: 1%;
} 

footer a {
    color: black;
    text-decoration: underline;
}

footer ul {
    list-style: square;
}

/* Alinha a imagem do logo do footer no centro da div */
#getdiv, div#card-saiba-mais {
    display: flex;
    align-items: center;
}

#facebook-icon, #youtube-icon, #email-link {
    font-size: 35px;
}

footer .link-redes, footer .link-redes:hover {
    text-decoration: none;
    padding-right: 4px;
}

#youtube-icon:hover {
    color: #B22222;
}

#botoes-redes{
    text-align: center;
    margin-top: 10px;
}

#icon-preto:hover {
    text-decoration: none;
    filter: opacity(0%)
}

footer .link-integra {
    position: relative;
    top: -8px;
    text-decoration: none;
}

#link-icon-preto {
    left: -34px;
}

footer div.container {
    overflow: hidden;
}

/* .contato {
    margin-left: 3%;
} */

/*#link-integra {
    margin-top: 3%;
}*/

/* App Herbarium */

/* Tabela */

td, th {
    text-align: center !important;
}

/* Index Herbarium */

.card-img-top {
    height: 260px !important;
    object-fit: cover;
    /* margin-top: 6%; */
}

div.card.col-12 {
    padding: 0;
}

.card-col {
    margin-bottom: 3% !important;
}

.card-col .card:hover {
    box-shadow: 5px 10px 40px #88888893;
}

img.img{
    margin-left: 20px;
}

button#dropdownMenuButton {
    background-color: #84ae84;
    border-color: #84AE84;
}

main a {
    color: black;
}

li.list-group-item {
    border-color: #84AE84;
}

li.list-group-item.active, button#button-addon2  {
    background-color: #A6DDA6;
    border-color: #84AE84;
    font-weight: bold;
}

button#button-addon2 {
    background-color: #A6DDA6;
    border-color: #84AE84;
    color: black;
    font-weight: normal;
}

/* Pode melhorar: para alinhar lista de famílias e cards */
div.col-9 div.row {
    margin-top: 3.6%;
}

/* Página de detalhes de uma planta  */

#importance, #description {
    text-align: justify;

    padding-bottom: 5%;
}

main a:hover, #email-labfito:hover {
    color: #374637;
}
/* Galeria de imagens */

.galeria div {
    padding: 0;
    width: auto;    
}

img {
    object-fit: cover;
}

/* Seleciona imagem em destaque */
.galeria .imagem_em_destaque {
    /* Para alinhar horizontalmente na div */
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 0;

    /* Aplica cantos arredondados */
    border-radius: 7px;

}
/* 
div#card-saiba-mais {
    display: block;
    margin-left: auto;
    margin-right: auto;
} */

.zoomWindow {
    border-radius: 7px;
}

/* Seleciona a primeira miniatura de quatro em quatro */
.galeria .miniaturas img:nth-child(4n+1) {
    margin-left: 0;
}

/* Seleciona imagem em miniatura */
.galeria .miniaturas img {
    width: 150px;
    margin-left: 5px;
    margin-bottom: 5px;
    border-radius: 7px;
    padding: 0;

    /* Diminui opacidade das imagens */
    filter: opacity(50%);
}

/* Aplica estilo para imagens em miniatura quando o cursor passa por cima */
.galeria .imagem_miniatura:hover {
    /* Torna a imagem com 80% da cor original (sobreescrevendo estilo) */
    filter: opacity(80%);

    /* Torna cursor de forma "pointer" */
    cursor: pointer;
}

/* Seleciona a imagem selecionada dentre a lista de imagens em miniatura */
.galeria .miniaturas .imagem_selecionada {
    /* Torna a imagem com a 100% cor original (sobreescrevendo estilo) */
    filter: opacity(100%);
    /* Aplica um estilo de borda no elemento */
    border: 2px solid #12dc89;
}



/* Pode melhorar, foi o único jeito que funcionou */
div.galeria div.row {
    margin-top: 0 !important; 
    margin-right: 0 !important; 
    margin-left: 4% !important; 
    margin-bottom: 1% !important;
}

nav#nav-pagination, #message-error {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: -3%;
}

h6#message-error {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    text-align: center;
}

a.page-link, a.page-link:hover {
    color: black;
}

.page-item.active a.page-link {
    color: black;
    background-color: #A6DDA6;
    border-color: #84AE84;
}

#colaboradores-footer, #siteIF-footer{
    text-decoration: none !important;

}

#colaboradores-footer:hover,  #siteIF-footer:hover{
    color: #374637;
}

#footer{
    position: fixed;   /* posição absoluta */
    bottom: 0;
    width: 100%;
    max-height: 11%;
    margin-top: 5%;
    padding-bottom: 1%;
    z-index: 5;
    border-style: solid;
    border-width: thin;
    border-top-color: #2c6b3a;
}

/* Estilos de botões */


/* Texto justificado */
.text-justify {
  text-align: justify;
}