:root {
  --background: #ffffff;
  --foreground: #1D1D1B;
  --primary: #D0006F;
  --light: #FCF2F8;
}

html, body{
  font-size: 18px;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  color: var(--foreground);
}

.map{
  position: relative;
}

#fazbem-header{
  position: fixed;
}

#fazbem-header #fb-menu #inscreva-se {
  right: 0;
}

ul, li{
  margin: 0;
  padding: 0;
}

h2{
  color: var(--primary);
  font-weight: 700;
}

h3{
  font-size: 1.25rem;
}

.color-primary{
  color: var(--primary);
}

.bg-primary{
  background: var(--primary) !important;
}

.bg-light{
  background: var(--light) !important;
}

.bg-primary h2{
  color: var(--background);
}

a {
  color: var(--primary);
  text-decoration: none;
}

section{
  padding: 3rem 0;
}

.btn{
  border-radius: 500px;
  padding: 0.75rem 2rem;
  font-weight: bold;
}

.btn-light{
  color: var(--primary);
}

.btn-primary{
  background: var(--primary);
  color: var(--background);
  border: none;
}

img{
  max-width: 100%;
  height: auto;
}

#hero{
  margin-top: 180px;
}

#what{
  background: url(../img/04.jpg) no-repeat top left / 45%;
}

.card{
  border: none;
}

.card-header{
  background: var(--primary);
  color: var(--background);
  text-align: center;
  padding: 1.25rem;
}

.card-header h3{
  margin: 0
}

#genes{
  background: #fdf2f8 url(../img/09.jpg) no-repeat top right / contain;
}

#groups .card{
  border: 1px solid var(--background);
  overflow: hidden
}

#groups .card-body{
  background: var(--primary);
  color: var(--background);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#groups .card-header{
  background: var(--background);
  height: 190px;
  display: flex;
  align-items: center;
}

#references{
  font-size: 0.875rem;
}


@media only screen and (max-width: 600px) {

#fazbem-header{
  position: relative;
}

#hero{
  margin-top: 10px;
}
 
#what {
  background: url(../img/04-m.jpg) no-repeat top right / 65%;
  padding-top: 300px;
}

#genes {
  background: #fdf2f8 url(../img/09-m.jpg) no-repeat top right / 100%;
  padding-top: 175px;
}
  
}