@import url('https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed|Roboto+Slab:300,400&display=swap');

/* CSS Document */

* {
    box-sizing: border-box;
}

html {
    font-family: Roboto, sans-serif;
    scroll-behavior: smooth;
}

body {
    background-color: white;
}

h1,
h2,
h3,
h4,
h5 {
    font-family: 'Roboto Slab', serif;
    font-weight: 300;
}

h2 {
    font-size: 2.2rem;
}

section {
    margin: 5rem 0;
}

.hide {
    display: none;
}
.close {
    position:absolute;
    top:1rem;
    right:1rem;
    float: right;
    cursor: pointer;
}
.close:hover {
    cursor: pointer;
}

/*@media (max-width: 991.98px) {
    .hide {
        display: block !important;
    }
}*/


/*JUMBO HOME*/

.jumbotron {
    margin-top: -64px;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
    padding: 5rem 1rem 1.5rem;
}

.jumbotron img {
    border-radius: 0 !important;
}

.jumbotron h1 {
    color: white;
}


/* NAVBAR */

nav .active,
nav .disabled {
    /*font-weight: bold;*/
    border-bottom: 1px solid;
}

#navlogoimg {
    margin-top: 4px;
    width: 70px;
}

.navbar {
    z-index: 2020;
    transition: ease-in-out 0.2s;
}

.navbar-toggler {
    position: relative;
    float: right;
    border-color: rgba(255, 255, 255, 0) !important;
    border-radius: 0 !important;
}

#bg-nav {
    position: absolute;
    background: rgba(164, 50, 35, .0);
    width: 100%;
    height: 0vh;
    z-index: 2001;
    transition: ease-in-out 0.2s;
    scroll-padding-top: 3rem;
}

#myNavbar .active {
    color: white !important;
    transition: 0.3s;
}

.nav-link {
    padding: 0.5rem 0.3rem !important;
}

@media (max-width: 767.98px) {
    .navbar li {
        font-size: 2.1rem;
        width: 100%;
        height: 100%;
        text-align: center;
        font-family: 'Roboto Slab', serif;
        font-weight: 300;
        border-bottom: rgba(0, 0, 0, .1) solid 1px;
    }
    .navbar li:last-child {
        border-bottom: none;
    }
}

#slogan {
    font-family: 'Roboto condensed';
    font-size: 1rem;
    margin-left: .6rem;
    position: relative;
    top: 4px;
}


/*CAROUSEL*/

#purpose {
    margin: 0 !important;
    background-image: linear-gradient(135deg, #afdfda, #539c8a);
}

.carousel {
    /*background-image: linear-gradient(135deg, #90d2cb, #539c8a);*/
    min-height: 520px;
    padding: 2rem;
    text-align: center;
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
}

.carousel .material-icons {
    vertical-align: bottom;
    font-size: 2rem;
}



/* DOWNLOAD ZONE*/


#download {
    padding: 3rem 0 5rem;
    background-image: repeating-linear-gradient( 135deg, transparent, transparent 20px, white 20px, white 40px);
    margin: 0;
}


/* REFERENCIAS */

#referencias{
    margin: 0;
}

#referencias .container {
    border-top: 1px solid lightgrey;
    padding-bottom: 4rem;
    /*border-bottom: 1px solid lightgrey;*/
}


/* MAPA */

#mapa_amplitudes {
    border-right: 10px solid #568BC0;
}

#mapa_amplitudes h4,
#mapa_amplitudes h5 {
    color: #568BC0;
}

#mapa_escales {
    border-right: 10px solid #F4136B;
}

#mapa_escales h4,
#mapa_escales h5 {
    color: #F4136B;
}

#mapa_distribution {
    border-right: 10px solid #80C41C;
}

#mapa_distribution h4,
#mapa_distribution h5 {
    color: #80C41C;
}

#mapa_sizes {
    border-right: 10px solid #FD1A16;
}

#mapa_sizes h4,
#mapa_sizes h5 {
    color: #FD1A16;
}

#mapa_numero {
    border-right: 10px solid grey;
}

#mapa_numero h4,
#mapa_numero h5 {
    color: grey;
}

#mapa_relacoes {
    border-right: 10px solid #ffe610;
}

#mapa_relacoes h4,
#mapa_relacoes h5 {
    color: var(--grey);
}

#mapa_relacoes h4 {
    background-color: #ffef63;
    display: inline-block;
}


/* CONCEITOS */

#conceitos .row:not(:first-child) {
    margin-top: -6rem;
    padding-top: 8rem;
}

#conceitos h4 {
    margin-top: -8rem;
    padding-top: 8rem;
}

#conceitos .row p:first-child {
    font-weight: bold;
}


/* SOBRE NOS */

#timeline {
    margin-top: -8rem;
    padding-top: 8rem;
}

#team {
    margin-top: -8rem;
    padding-top: 8rem;
}

#collaborators {
    margin-top: -8rem;
    padding-top: 8rem;
}


/* CARD */

.card {
    border: none !important;
    border-radius: none !important;
}

.card-img-overlay {
    border-radius: 0 !important;
}

.card:hover {
    transition: ease-in-out 0.3s;
}

.credits_pict {
    position: absolute;
    margin-left: 1rem;
}

.illustrated .credits_pict {
    position: absolute;
    margin-top: -2rem;
}

.credits_pict::before {
    content: "Imagem ";
}


@media (min-width: 576px) {
    .card-deck,
    .card-columns,
    .card-group {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}

@media (min-width: 768px) {
    .card-deck,
    .card-columns,
    .card-group {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .card-deck,
    .card-columns,
    .card-group {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media (min-width: 1200px) {
    .card-deck,
    .card-columns,
    .card-group {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}


/*BORDERS*/

.border-2 {
    border-width: 2px !important;
}

.border-3 {
    border-width: 3px !important;
}

.border-4 {
    border-width: 4px !important;
}


/* MODALS */

.close {
    opacity:1;
}

.modal, .modal-dialog, .modal-content {
    background-color:transparent;
    border: none !important;
}

.modalfull {
    width: 90%;
    height: 90%;
    margin: 0 auto;
  }

.modal-body {
    background-color: #ffff;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, .5);
}

.modal-header {
    background-color:transparent;
    color: var(--light);
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 1);
}

.modal-header .material-icons {
    vertical-align: middle;
    color: var(--light);
    font-size: 2.1rem !important;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, .5);
}


/*RECURSOS*/

.card-footer small {
    display: block;
    font-size: .6rem;
}

h5 small {
    font-family: Roboto, sans-serif;
    font-size: .8rem;
}

#details div .material-icons:first-child {
    font-size: 3rem;
    margin-bottom: 0;
}

#details ul,
#material ul {
    list-style-type: square;
    padding-inline-start: 20px;
}

.zoom {
    vertical-align: middle !important;
    font-weight: normal !important;
}

#details a .material-icons {
    font-size: 2rem !important;
}

#details span {
    display: block;
    padding-bottom: 0.4rem;
    border-bottom: 1px dotted black;
}

#details h5 {
    padding-top: 0.5rem;
    /*border-bottom: 1px solid black;*/
}

#material div .material-icons:first-child {
    display: inline;
}

#material .material-icons:hover {
    text-decoration: none !important;
}

#activities {
    margin: 0;
    padding: 6rem 0 4rem;
}

#illustrated {
    margin: 0;
    padding: 6rem 0 4rem;
}

#specifics {
    margin: 0;
    padding: 6rem 0 4rem;
}

.activities {
    background-color: #fdddc9;
    /*background-image: linear-gradient(180deg,#fdddc9,#ffab77);*/
}

.illustrated {
    background-color:  #c2e2de;
    /*background-image: linear-gradient(180deg,#c2e2de,#9cd6cf);*/
}

.specifics {    
    background-color:#edeae3;
}

#legenda {
    top: 64px;
    z-index: 100;
    background-color: var(--white);
    padding: 0 1.6rem;
    position: -webkit-sticky;
    position: sticky;
}

#legenda div {
    padding: 2px;
}

#legendaToggle a:hover {
    text-decoration: none;
}


/* COOKIES */

.cookiealert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 !important;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    border-radius: 0;
    transform: translateY(100%);
    transition: all 500ms ease-out;
    color: #ecf0f1;
    background: #212327;
}

.cookiealert.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
    transition-delay: 1000ms;
}

.cookiealert a {
    text-decoration: underline
}

.cookiealert .acceptcookies {
    margin-left: 10px;
    vertical-align: baseline;
}


/*FOOTER*/

footer {
    /*background: url("../images/leaves.png") repeat center center;
    background: linear-gradient(-45deg, #f0622f, #ed8147);*/
    background-color: #f0622f;
    padding: 2rem 0;
}

footer nav a {
    color: white;
    font-size: 1rem;
}

footer .nav-link:first-child {
    padding-bottom: 0rem !important;
}

footer .nav-link:not(:first-child) {
    padding: 0rem 0.3rem !important;
}

footer .main {
    border-bottom: 1px solid white !important;
    font-size: 1.2rem;
    display: block !important;
    margin-top: 1rem;
}

footer .main:hover {
    border-bottom: 1px solid #9E3021 !important;
}

footer .main:first-child {
    padding-bottom: .5rem !important;
}

.entry-footer {
    background-color: transparent !important;
}

#mc_embed_signup {
    width: 100%;
}


/* LANGUAGE */

#language .material-icons {
    font-size: 2rem;
}

#language .dropdown-menu a:hover {
    background-color: var(--secondary);
    color: white;
}


/*BLOCKQUOTE*/

.blockquote-footer {
    background-color: transparent !important;
    padding: 0;
}


/*ICONS*/

.material-icons.md-18 {
    font-size: 18px;
}

.material-icons.md-24 {
    font-size: 24px;
}

.material-icons.md-36 {
    font-size: 36px;
}

.material-icons.md-48 {
    font-size: 48px;
}

.material-icons {
    vertical-align: bottom;
}

.timeline-badge .material-icons {
    vertical-align: text-bottom;
    font-size: 2rem;
}

.active a {
    font-weight: bold;
}

ul.share-buttons {
    list-style: none;
    padding: 0;
    text-align: center;
}

ul.share-buttons li {
    display: inline;
}

.text-shadow {
    text-shadow: 1px 2px 4px black;
}


/* HEADER BACKGROUNDS */

.feira {
    background: url("../images/img_vegetais_da_feira.jpg") no-repeat center center;
    background-size: cover;
    background-attachment: fixed;
}

.honey {
    background: url("../images/img_bee.jpg") no-repeat bottom right;
    background-size: cover;
}

.forest {
    background: url("../images/img_forest.jpg") no-repeat center bottom;
    background-size: cover;
}

.boy_plant {
    background: url("../images/img_boy_and_plant.jpg") no-repeat center center;
    background-size: cover;
    background-attachment: fixed;
}

.girl_flower {
    background: url("../images/img_girl_flower_sm.jpg") no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
}

@media (min-width: 768px) {
    .girl_flower {
        background: url("../images/img_girl_flower.jpg") no-repeat center center;
        background-size: cover;
        background-attachment: fixed;
    }
}


/* GRADIENTS */

.bio {
    background:#0099cc;
    background-image: url(../images/bio_biodiversity_head.png), linear-gradient(45deg, #0099cc, #26a247);
    background-repeat: no-repeat;
    background-position: bottom left;
}

.resources {
    background: #f0622f;
    background-image: url(../images/bio_resources_head.png), linear-gradient(45deg, #f0622f, #a43223);
    background-repeat: no-repeat;
    background-position: bottom left;
}
.resourcespecifics {
    background-image: linear-gradient(-135deg, #da5644, #a43223);
}

.net {
    background: #eb8fbe;
    background-image: url(../images/bio_net_head.png), linear-gradient(45deg, #eb8fbe, #4b1f2e);
    background-repeat: no-repeat;
    background-position: bottom left;
    /*background-size: contain;*/
}

.team {
    /*background-image: linear-gradient(45deg, #eec251, #7a6e28);*/
    background: #afdfda;
    background-image: url(../images/bio_team_head.png), linear-gradient(135deg, #afdfda, #539c8a);
    background-repeat: no-repeat;
    background-position: bottom left;
}

.blog_bg {
    background: #82776c;
    background-image: url(../images/bio_blog_head.png), linear-gradient(135deg, #82776c, #3f2f2d);
    background-repeat: no-repeat;
    background-position: bottom left;
}


/* FOCUS */

a:focus {
    background-color: none;
}


/* BACK TO TOP */

#backtop {
    width: 3rem;
    height: 3rem;
    display: none;
    position: fixed;
    bottom: 2.2rem;
    right: 1rem;
    z-index: 1000;
    border: 2px solid #a43223;
    outline: none;
    color: #a43223;
    /*background-color: rgba(255, 255, 255, .5);*/
    cursor: pointer;
    padding: 0;
}

#backtop:hover,
#backtop:focus {
    background-color: #a43223;
    border-color: #a43223;
    color: white;
    outline: none;
}


/* SPECIFIC CLASSES */

.guarani {
    background: url("../images/bg_guarani.png") repeat bottom center;
}


/*.hideshow {
    transition: ease 0.3s;
}*/


/*REDE*/

#about h2:not(:first-child) {
    font-family: 'Roboto condensed';
    margin-top: 1.2rem;
    font-weight: bolder;
}

#about .gold {
    background-color: #eec251;
}

#social a {
    color: black;
    text-decoration: none !important;
}

#social a:hover {
    color: black;
    text-decoration: underline !important;
}


/* FORMS */

.btn {
    border-radius: 1.3rem;
    padding: 0.4rem 1.2rem;
}

label {
    color: grey;
}

#email_newsletter {
    width:140px !important;
}
#btn_newsletter {
    display: block;
}

/* SOCIAL SHARING */
.addtoany_content {
    margin: 3rem auto !important;
}

.addtoany_header  {
    border-bottom: 1px solid gray !important;
    padding-bottom: 6px;
}


/* VALIDATION */

.errorBorder {
    border-color: red;
}

.errorMessage {
    color: red;
    font-size: 0.8em;
}

.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@media (min-width: 768px) {
    .bd-placeholder-img-lg {
        font-size: 3.5rem;
    }
}


/* MAILCHIMP */

#mc_embed_signup {
    clear: both;
}