#banner {
background: url(//rottasconstrutora.com.br/rottas/assets/RottasGrafismoPequeno.svg) center center no-repeat;
background-size: contain;
background-color: var(--orange1);
padding: 3rem 0 4rem;
}
#banner .b-container {
width: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
#banner .breadcrumb {
text-align: center;
margin-bottom: 1rem;
}
#banner .breadcrumb,
#banner .breadcrumb a {
color: #fff;
}
#banner .breadcrumb a:hover {
color: var(--yellow);
}
#faq {
padding: 2rem 0 3rem;
background: #fff;
}
#faq .b-container {
max-width: 740px;
}
#faq .search-box {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 800px;
margin: 0 auto;
}
#faq .divisor {
width: 100%;
height: 1px;
background: rgba(0, 0, 0, 0.1);
margin: 2rem 0;
}
@media (max-width: 650px) {
#faq .search-box {
flex-wrap: wrap;
}
#faq .search-box .search-form {
margin-top: 1rem;
width: 100%;
}
}
#faq .faq {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#faq .faq .title4 {
margin-bottom: 2rem;
}
#faq .faq .questions {
width: 100%;
}
#faq .faq .questions .grid {
padding: 1.5rem;
border-radius: 12px;
box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.1);
}
#faq .faq .questions .grid .question {
padding: 2rem 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#faq .faq .questions .grid .question label {
display: flex;
justify-content: space-between;
font-family: Aller;
font-size: 14px;
color: var(--black);
}
#faq .faq .questions .grid .question label i {
display: inline-flex;
align-items: center;
justify-content: center;
color: #fff;
width: 18px;
height: 18px;
border-radius: 255px;
background: var(--orange1);
margin-left: 0.5rem;
}
#faq .faq .questions .grid .question label b {
font-weight: 700;
color: var(--orange1);
}
#faq .faq .questions .grid .question label p {
width: 90%;
}
#faq .faq .questions .grid .question .colapse-content {
padding: 1rem;
color: var(--black);
}
#faq .faq .questions .grid .question .colapse-content p{
margin-bottom: 1rem;
}
#faq .faq .questions .grid .question .colapse-content p:last-child{
margin-bottom: 0;
}
@media (max-width: 850px) {
#faq .faq .questions {
margin-bottom: 3rem;
}
#faq .faq .questions .grid li{
padding: 1.5rem 0;
}
}
#formulario-faq .flex-grid {
display: flex;
align-items: flex-end;
flex-wrap: wrap;
justify-content: space-between;
}
#formulario-faq .flex-grid .left {
width: 54%;
}
#formulario-faq .flex-grid .right {
width: 42%;
}
#formulario-faq .flex-grid .left {
display: flex;
align-items: center;
flex-wrap: wrap;
}
#formulario-faq {
padding-top: 3rem;
}
#formulario-faq .b-container {
padding: 0 0.8rem;
}
#formulario-faq .flex-grid .left .image {
display: flex;
align-items: flex-end;
width: 55%;
}
#formulario-faq .flex-grid .left img {
width: 100%;
}
#formulario-faq .flex-grid .left .title {
box-sizing: border-box;
padding-left: 1rem;
width: 45%;
}
#formulario-faq .flex-grid .left .title .title2 {
font-weight: 700;
}
#formulario-faq .flex-grid .left .title .paragraph {
margin-top: 1rem;
}
#formulario-faq .flex-grid .right .rottas-form {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 2rem 0;
width: 100%;
}
#formulario-faq .flex-grid .right .rottas-form .label {
margin-bottom: 1rem;
}
@media (max-width: 1000px) {
#formulario-faq .flex-grid {
align-items: center;
justify-content: space-around;
}
#formulario-faq .flex-grid .left {
width: 35%;
}
#formulario-faq .flex-grid .right {
width: 50%;
}
#formulario-faq .flex-grid .left .image {
display: none;
}
#formulario-faq .flex-grid .left .title {
width: 100%;
}
}
@media (max-width: 800px) {
#formulario-faq .flex-grid .right .rottas-form .btn {
margin-top: 2rem;
width: 100%;
}
}
@media (max-width: 680px) {
#formulario-faq .flex-grid .right {
width: 55%;
}
}
@media (max-width: 650px) {
#formulario-faq .flex-grid .left {
width: 100%;
}
#formulario-faq .flex-grid .right {
width: 100%;
}
#formulario-faq .flex-grid .left .title {
text-align: center;
padding-left: 0;
padding-bottom: 2rem;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#formulario-faq .flex-grid .left .title p {
font-size: 18px;
}
}