﻿"/* ERP */
.navbar-nav>li>a 
{
color: white;
}

.navbar-nav>li>a:hover
{
color: rgba(0,92,169, 1);
}

.btn-success 
{
background: #02BD7A;
}

body 
{
background: #ECF2F4;
}

.thumbnail
{
border-radius: 15px;
box-shadow: 0 0 30px rgba(0,0,0,0.1);
}

.thumbnail:hover
{
border: 5px solid #ddd;
border-color: rgba(0,92,169, 1);
transition: .7s;
}

input, select, button, p, h1, h2, h3, h4, h5, textarea, label {
font-family: "Roboto", sans-serif;
}

body {
background: #ECF2F4;
overflow-x: hidden;
}

.noscroll {
overflow: hidden;
}

.label, .label--error, .label--warning, .label--success {
color: #436D8F;
font-weight: 600;
font-size: 14px;
margin-bottom: 8px;
}
.label--success {
color: #02BD7A;
}
.label--warning {
color: #EEBD3E;
}
.label--error {
color: #C44139;
}

.input, .select--error, .select--warning, .select--success, .textarea--error, .textarea--warning, .textarea--success, .input--error, .input--warning, .input--success {
border-radius: 8px;
width: 100%;
font-size: 12px;
font-weight: 400;
line-height: 14px;
padding: 16px 12px;
border: 1px solid #99AABA;
}
.input::-moz-placeholder, .select--error::-moz-placeholder, .select--warning::-moz-placeholder, .select--success::-moz-placeholder, .textarea--error::-moz-placeholder, .textarea--warning::-moz-placeholder, .textarea--success::-moz-placeholder, .input--error::-moz-placeholder, .input--warning::-moz-placeholder, .input--success::-moz-placeholder {
color: #99AABA;
}
.input:-ms-input-placeholder, .select--error:-ms-input-placeholder, .select--warning:-ms-input-placeholder, .select--success:-ms-input-placeholder, .textarea--error:-ms-input-placeholder, .textarea--warning:-ms-input-placeholder, .textarea--success:-ms-input-placeholder, .input--error:-ms-input-placeholder, .input--warning:-ms-input-placeholder, .input--success:-ms-input-placeholder {
color: #99AABA;
}
.input::placeholder, .select--error::placeholder, .select--warning::placeholder, .select--success::placeholder, .textarea--error::placeholder, .textarea--warning::placeholder, .textarea--success::placeholder, .input--error::placeholder, .input--warning::placeholder, .input--success::placeholder {
color: #99AABA;
}
.input:focus-visible, .select--error:focus-visible, .select--warning:focus-visible, .select--success:focus-visible, .textarea--error:focus-visible, .textarea--warning:focus-visible, .textarea--success:focus-visible, .input--error:focus-visible, .input--warning:focus-visible, .input--success:focus-visible {
border: 1px solid #005CA9;
outline: #005CA9;
}
.input:disabled, .select--error:disabled, .select--warning:disabled, .select--success:disabled, .textarea--error:disabled, .textarea--warning:disabled, .textarea--success:disabled, .input--error:disabled, .input--warning:disabled, .input--success:disabled {
background: #E9EFF2;
border: 1px solid #E9EFF2;
}
.input--success {
border: 1px solid #00A167;
}
.input--warning {
border: 1px solid #D19F1F;
}
.input--error {
border: 1px solid #C44139;
}

.textarea {
border-radius: 8px;
width: 100%;
font-size: 12px;
font-weight: 400;
line-height: 14px;
padding: 16px 12px;
border: 1px solid #99AABA;
}
.textarea::-moz-placeholder {
color: #99AABA;
}
.textarea:-ms-input-placeholder {
color: #99AABA;
}
.textarea::placeholder {
color: #99AABA;
}
.textarea:focus-visible {
border: 1px solid #005CA9;
outline: #005CA9;
}
.textarea--success {
border: 1px solid #00A167;
}
.textarea--warning {
border: 1px solid #D19F1F;
}
.textarea--error {
border: 1px solid #C44139;
}
.select {
border-radius: 8px;
font-size: 12px;
font-weight: 400;
line-height: 14px;
padding: 16px 12px;
border: 1px solid #99AABA;
width: 20%;
margin: auto;
}
.select::-moz-placeholder {
color: #99AABA;
}
.select:-ms-input-placeholder {
color: #99AABA;
}
.select::placeholder {
color: #99AABA;
}
.select:focus-visible {
border: 1px solid #005CA9;
outline: #005CA9;
}
.select--success {
border: 1px solid #00A167;
}
.select--warning {
border: 1px solid #D19F1F;
}
.select--error {
border: 1px solid #C44139;
}

.group-input {
position: relative;
}
.group-input__icon {
position: absolute;
top: 10px;
right: 16px;
}

.button, .button--link, .button--secundary, .button--danger, .button--warning, .button--info, .button--success {
border-radius: 6px;
font-size: 12px;
font-weight: 700;
line-height: 14px;
padding: 14px 40px;
border: none;
background: #005CA9;
color: white;
}
.button:disabled, .button--link:disabled, .button--secundary:disabled, .button--danger:disabled, .button--warning:disabled, .button--info:disabled, .button--success:disabled {
opacity: 0.75;
cursor: not-allowed;
}
.button:hover:enabled, .button--link:hover:enabled, .button--secundary:hover:enabled, .button--danger:hover:enabled, .button--warning:hover:enabled, .button--info:hover:enabled, .button--success:hover:enabled {
background: #00325d;
}
.button--success {
background: #02BD7A;
color: white;
}
.button--success:hover:enabled {
background: #017149;
}
.button--info {
background: #E9EFF2;
color: #005CA9;
}
.button--info:hover:enabled {
background: #b9ccd6;
}
.button--warning {
background: #EEBD3E;
color: white;
}
.button--warning:hover:enabled {
background: #cd9912;
}
.button--danger {
background: #DD5951;
color: white;
}
.button--danger:hover:enabled {
background: #bd2e25;
}
.button--secundary {
background: white;
color: #3C9FB0;
border: 1px solid #3C9FB0;
}
.button--secundary:hover:enabled {
background: #d9d9d9;
}
.button--link {
text-align: left;
padding: 0px;
background: none;
text-decoration: underline;
color: #005CA9;
font-size: 14px;
font-weight: 500;
}
.button--link:hover:enabled {
color: #00325C;
background: none;
}

.header {
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08);
}

.topbar {
background: #00325C;
display: flex;
justify-content: center;
}
.topbar__wrapper {
max-width: 1312px;
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 16px;
}
.topbar__logo {
background: white;
padding: 10px 18px 18px 18px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
border-radius: 0px 0px 8px 8px;
margin-bottom: 8px;
}
.topbar__logo img {
width: 167px;
}
.topbar__menu {
display: flex;
align-items: center;
}
@media (max-width: 992px) {
.topbar__menu {
display: none;
}
}
.topbar__menu--mobile {
display: none;
align-items: center;
cursor: pointer;
}
@media (max-width: 992px) {
.topbar__menu--mobile {
display: flex;
}
}
.topbar__readyLists {
color: white;
font-size: 12px;
cursor: pointer;
margin-right: 12px;
}
.topbar__readyLists input:checked {
background-color: #02BD7A;
}
.topbar__readyLists label {
cursor: pointer;
}
.topbar p {
margin-bottom: 0;
color: white;
font-size: 12px;
}
.topbar__input {
position: relative;
display: flex;
margin: 0 20px;
align-items: center;
}
.topbar__input input {
background: white;
border-radius: 12px;
width: 230px;
font-size: 12px;
font-weight: 400;
line-height: 14px;
padding: 15px 12px;
border: 1px solid #99AABA;
padding-right: 40px;
}
.topbar__input input:focus-visible {
border: 1px solid #005CA9;
outline: #005CA9;
}
.topbar__input__icon {
right: inherit;
position: absolute;
top: 15px;
margin-left: -34px;
border: 0;
background: none;
}
.topbar__separator {
border-left: 1px solid #99AABA;
height: 37px;
width: 1px;
}
.topbar__user {
width: 253px;
display: flex;
justify-content: space-between;
align-items: center;
margin-left: 20px;
font-size: 12px;
}
.topbar__user span {
font-weight: 800;
}
.topbar__user div {
font-family: "Roboto", sans-serif;
font-weight: 800;
color: #EB7A73;
font-size: 12px;
cursor: pointer;
}
.topbar__user div svg {
margin-left: 3px;
}
@media (max-width: 1200px) {
.topbar__user {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
}
.topbar__user p {
display: none;
}
}

.navbar {
background: #FCFCFC;
display: flex;
justify-content: center;
padding: 0;
}
@media (max-width: 992px) {
.navbar {
display: none;
}
}
.navbar__wrapper {
max-width: 1312px;
width: 100%;
display: flex;
justify-content: space-between;
}
.navbar__menuList {
display: flex;
align-items: center;
justify-content: center;
background-color: #E9EFF2;
width: 202px;
height: 46px;
color: #50667A;
font-size: 12px;
font-weight: 400;
cursor: pointer;
}
.navbar__menuList svg {
margin-right: 6px;
}
.navbar__menuList:hover {
background: #c9d8df;
}
.navbar__menu {
display: flex;
align-items: center;
height: 46px;
}
.navbar__menuItem {
margin: 0 16px;
color: #50667A;
font-size: 12px;
font-weight: 400;
}
.navbar__menuItem:hover {
color: #2c3c4b;
cursor: pointer;
}

.sidebar {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-color: #00325C;
padding: 0 16px;
overflow: hidden;
}
.sidebar__header {
display: flex;
justify-content: space-between;
align-items: center;
}
.sidebar__logo {
background: white;
padding: 10px 18px 18px 18px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
border-radius: 0px 0px 8px 8px;
margin-bottom: 8px;
}
.sidebar__logo img {
width: 167px;
}
.sidebar__close {
cursor: pointer;
}
.sidebar__menu {
margin-top: 24px;
}
.sidebar__link {
font-size: 16px;
margin: 8px 0;
color: #F2F7FA;
}
.sidebar__link:hover {
color: #cde0ec;
cursor: pointer;
}
.sidebar.active {
display: flex;
flex-direction: column;
}
.sidebar__link {
color: white;
}

.footer {
position: relative;
background: #0E2537;
margin-top: 80px;
display: flex;
justify-content: center;
min-height: 566px;
border-bottom: 40px solid #00325C;
}
.footer__wrapper {
position: relative;
max-width: 1312px;
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 16px;
}
@media (max-width: 768px) {
.footer__wrapper {
flex-direction: column;
}
}
.footer__contacts {
background: white;
position: relative;
min-width: 537px;
height: 500px;
margin-top: -66px;
border-radius: 8px;
box-shadow: 0px 6px 65px rgba(0, 0, 0, 0.15);
border-bottom: 7px solid #4C96D4;
padding: 47px 54px;
}
@media (max-width: 992px) {
.footer__contacts {
min-width: 500px;
}
}
@media (max-width: 768px) {
.footer__contacts {
min-width: 300px;
}
}
@media (max-width: 576px) {
.footer__contacts {
padding: 47px 40px;
}
}
.footer__header {
display: flex;
align-items: center;
border-bottom: 1px solid #C5CFD9;
padding-bottom: 26px;
}
.footer__header h3 {
font-size: 18px;
font-weight: 300;
margin-left: 4px;
margin-bottom: 0px;
}
.footer__header h3 span {
font-weight: 800;
}
.footer__header .icon-contact {
position: absolute;
top: 36px;
right: 49px;
}
.footer__infos {
margin-top: 26px;
display: flex;
flex-direction: column;
}
.footer__infos h5 {
font-size: 14px;
font-weight: 600;
color: #50667A;
margin-bottom: 8px;
}
.footer__infos span {
font-size: 14px;
font-weight: 400;
color: #50667A;
}
.footer__boxInfo {
display: flex;
align-items: center;
margin: 5px 0px;
}
.footer__boxInfo p {
font-weight: 500;
font-size: 12px;
margin-bottom: 0px;
margin-left: 7px;
color: #50667A;
}
.footer__boxInfo p span {
font-weight: 600;
}
.footer__navgation {
height: 380px;
margin-top: 60px;
display: flex;
flex-direction: column;
}
@media (max-width: 992px) {
.footer__navgation {
display: none;
}
}
.footer__navgation span {
margin-bottom: 24px;
color: #C5CFD9;
font-weight: 700;
font-size: 14px;
}
.footer__navgation p {
margin-bottom: 15px;
color: #C5CFD9;
font-weight: 400;
font-size: 12px;
}
.footer__navgation p:hover {
font-weight: 700;
cursor: pointer;
}
.footer__navgation strong {
margin-top: 4px;
font-weight: 900;
font-size: 12px;
color: #2DD795;
text-transform: uppercase;
cursor: pointer;
}
.footer__logos {
height: 380px;
margin-top: 60px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
@media (max-width: 768px) {
.footer__logos {
height: auto;
margin-bottom: 90px;
justify-content: flex-start;
}
.footer__logos .logos {
display: flex;
flex-direction: row;
justify-content: center;
margin-bottom: 30px;
}
.footer__logos .logos div {
margin: 0 5px;
}
}
.footer__cotaOnlineLogo {
display: flex;
align-items: center;
justify-content: center;
background: white;
height: 70px;
width: 202px;
border-radius: 8px;
margin-bottom: 8px;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.footer__cotaOnlineLogo {
width: 130px;
height: 45px;
}
.footer__cotaOnlineLogo img {
width: 130px;
}
}
.footer__gpCabling {
height: 70px;
width: 202px;
}
@media (max-width: 576px) {
.footer__gpCabling {
width: 130px;
}
.footer__gpCabling img {
width: 130px;
}
}
.footer__social {
display: flex;
justify-content: center;
align-items: center;
}
.footer__social .whatsapp {
display: none;
}
@media (max-width: 768px) {
.footer__social .whatsapp {
cursor: pointer;
display: flex;
}
}
.footer__boxSocial {
height: 40px;
width: 40px;
border-radius: 5px;
background-color: #3C9FB0;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
margin: 0 5px;
}
.footer__boxSocial:hover {
background-color: #02BD7A;
}
.footer__whatsapp {
position: absolute;
bottom: 0px;
left: 16px;
cursor: pointer;
}
@media (max-width: 768px) {
.footer__whatsapp {
display: none;
}
}

.banner {
background-image: url("../../../assets/banner-bg.png");
background-repeat: no-repeat;
background-position: right;
max-width: 1317px;
width: 100%;
height: 290px;
border-radius: 8px;
margin-top: 165px;
display: flex;
justify-content: space-between;
margin-bottom: 100px;
}
@media (max-width: 768px) {
.banner {
justify-content: center;
}
}
@media (max-width: 576px) {
.banner {
margin-top: 100px;
height: auto;
background-size: cover;
}
}
.banner__infos {
padding: 48px 64px;
max-width: 100%;
}
@media (max-width: 768px) {
.banner__infos {
padding: 48px 20px;
}
}
.banner__header {
display: flex;
color: white;
font-size: 20px;
font-weight: 400;
}
.banner__title {
color: white;
font-size: 20px;
font-weight: 400;
}
.banner__title span {
font-weight: 800;
}
.banner__icon {
width: 8px;
height: 20px;
background: #02BD7A;
border-radius: 6px 0 6px 0;
margin-right: 4px;
}
.banner__services {
width: 441px;
display: flex;
max-width: 100%;
}
.banner__services .collumn {
max-width: 100%;
}
.banner__services .collumn:last-child {
margin-left: 40px;
}
@media (max-width: 576px) {
.banner__services {
flex-direction: column;
}
.banner__services .collumn:last-child {
margin-left: 0;
}
}
.banner__boxInfo {
display: flex;
align-items: center;
margin: 8px 0;
max-width: 100%;
}
.banner__boxInfo p {
margin-bottom: 0px;
margin-left: 8px;
color: #E9EFF2;
font-size: 12px;
}
.banner__buttons {
display: flex;
justify-content: space-between;
margin-top: 40px;
}
.banner__buttons button {
width: 205px;
border: none;
border-radius: 4px;
padding: 14px 0px;
font-weight: 700;
font-size: 10px;
}
.banner__buttons button:first-child {
background-color: #02BD7A;
color: white;
}
.banner__buttons button:first-child:hover {
background: #018b59;
}
.banner__buttons button:last-child {
background: none;
color: #02BD7A;
border: 1px solid #02BD7A;
}
.banner__buttons button:last-child:hover {
background-color: #02BD7A;
color: white;
}
@media (max-width: 576px) {
.banner__buttons {
flex-direction: column;
margin-top: 10px;
}
.banner__buttons button {
width: 100%;
margin: 5px 0;
}
}
.banner img {
margin-top: -93px;
}
@media (max-width: 992px) {
.banner img {
display: none;
}
}

main {
display: flex;
align-items: center;
flex-direction: column;
padding: 0 16px;
}

/* cadastre-se/login */

.singup {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
max-width: 1312px;
width: 100%;
margin-bottom: 100px;
margin-top: 5%;
}
.singup__title {
max-width: 360px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.singup__title div {
display: flex;
align-items: center;
justify-content: center;
background: #005CA9;
border-radius: 17px 0 17px 0;
height: 39px;
width: 274px;
color: white;
font-size: 21px;
font-weight: 400;
margin-bottom: 20px;
}
.singup__title div span {
font-weight: 700;
margin-left: 4px;
}
.singup__title p {
text-align: center;
color: #50667A;
font-size: 14px;
font-weight: 400;
}
.singup__box {
display: flex;
background: #F7FBFC;
width: 100%;
border-radius: 8px;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
margin-top: 50px;
overflow: hidden;
}
.singup__image {
width: 450px;
background-size: cover;
background-image: url("../img/signup.jpeg");
background-position: center center;
}
.register__image {
width: 450px;
background-size: cover;
background-image: url("../img/pexels-burst.png");
background-position: center center;
}
.singup__benefits {
height: 100%;
width: 100%;
}
.singup__content {
display: flex;
flex-direction: column;
width: calc(100% - 419px);
padding: 60px 70px 50px 70px;
}
.singup__form {
display: grid;
grid-template-columns: auto auto;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
row-gap: 28px;
-moz-column-gap: 28px;
column-gap: 28px;
}
.singup__form--name {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--email {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--password {
grid-column-start: 1;
grid-column-end: 2;
}
.singup__form--passwordConfirm {
grid-column-start: 2;
grid-column-end: 3;
}
.singup__form--info {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--info p {
display: flex;
align-items: center;
color: #50667A;
font-size: 12px;
margin-bottom: 8px;
}
.singup__form--info p svg {
margin-right: 10px;
}
.singup__form--info p span {
font-weight: 700;
}
.singup__form--button {
grid-column-start: 1;
grid-column-end: 3;
display: flex;
justify-content: center;
}
.singup__form--button button {
width: 100%;
border: none;
border-radius: 4px;
padding: 14px 0px;
font-weight: 700;
font-size: 10px;
background-color: #02BD7A;
color: white;
}
.singup__form--button button:hover {
background: #018b59;
}
.singup__separete {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
margin-top: 40px;
}
.singup__separete div {
width: calc(50% - 80px);
height: 1px;
background: #C5CFD9;
}
.singup__separete p {
color: #7E91A3;
width: 120px;
text-align: center;
margin-bottom: 0;
font-size: 10px;
}
.singup__login {
margin-top: 40px;
color: #50667A;
font-size: 12px;
font-weight: 400;
text-align: center;
}
.singup__login span {
cursor: pointer;
font-weight: 700;
}
@media (max-width: 992px) {
.singup__image {
display: none;
}
.singup__content {
width: 100%;
}
.singup__separete {
margin-top: 20px;
}
.singup__login {
margin-top: 20px;
}
}
@media (max-width: 768px) {
.singup__content {
padding: 60px 40px 50px 40px;
}
.singup__form {
grid-template-columns: auto;
grid-template-rows: auto auto auto auto auto auto auto auto auto;
}
.singup__form--name {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--email {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--password {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--passwordConfirm {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--info {
grid-column-start: 1;
grid-column-end: 3;
}
.singup__form--button {
grid-column-start: 1;
grid-column-end: 3;
}
}

.benefits {
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
padding: 35px;
}
.benefits__title {
display: flex;
color: white;
font-size: 30px;
font-weight: 400;
border-bottom: 1px solid #F8F8F9;
padding-bottom: 10px;
margin-bottom: 20px;
}
.benefits__title span {
font-weight: 800;
}
.benefits__icon {
width: 11px;
height: 32px;
background: #02BD7A;
border-radius: 6px 0 6px 0;
margin-right: 8px;
}
.benefits__boxInfo {
display: flex;
align-items: center;
margin: 8px 0;
max-width: 100%;
}
.benefits__boxInfo p {
margin-bottom: 0px;
margin-left: 8px;
color: #E9EFF2;
font-size: 12px;
}

/* cadastre-se/login */

/* home */
.hero {
width: 100%;
max-width: 1312px;
width: 100%;
padding: 0 16px;
}
.hero__title {
font-size: 40px;
font-weight: 800;
color: #304558;
max-width: 590px;
}
.hero__title span {
color: #166CB5;
}
.hero p {
margin-top: 10px;
font-size: 21px;
font-weight: 400;
color: #304558;
}
.hero__cards {
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: auto auto;
row-gap: 25px;
-moz-column-gap: 16px;
column-gap: 16px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
margin-top: 100px;
}
.hero__img {
width: 100%;
height: 120px;
display: flex;
justify-content: center;
align-items: center;
}
.hero__card {
box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
background: white;
border-radius: 4px;
border-top: 4px solid #4C96D4;
width: 170px;
height: 170px;
transition: 0.5s;
}
.hero__card p {
font-size: 12px;
font-weight: 900;
color: #50667A;
text-align: center;
}
.hero__card:hover {
transform: translateY(-20px);
cursor: pointer;
border-top: 4px solid #005CA9;
}
.hero__card:hover p {
color: #014279;
}
@media (max-width: 1200px) {
.hero__titleBox {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
.hero__cards {
width: 100%;
justify-content: center;
}
}
@media (max-width: 600px) {
.hero__cards {
width: 100%;
justify-content: center;
grid-template-columns: auto auto;
}
.hero__image {
display: none;
}
}
@media (max-width: 470px) {
.hero__cards {
width: 100%;
justify-content: center;
grid-template-columns: auto;
}
}
/*home*/

/*importar lista*/
.contact {
display: flex;
flex-direction: column;
align-items: center;
}
.contact__title {
max-width: 360px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.contact__title div {
display: flex;
align-items: center;
justify-content: center;
background: #005CA9;
border-radius: 17px 0 17px 0;
height: 39px;
width: 274px;
color: white;
font-size: 21px;
font-weight: 400;
margin-bottom: 20px;
}
.contact__title div span {
font-weight: 700;
margin-left: 4px;
}
.contact__title p {
text-align: center;
color: #50667A;
font-size: 14px;
font-weight: 400;
}
.contact__box {
display: flex;
background: #F7FBFC;
border-radius: 8px;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
}
.contact__image {
width: 600px;
background-size: cover;
background-image: url("../img/planilha1.jpg");
}
.contact__image__import {
width: 415px;
background-size: cover;
background-image: url("../img/ia_calculando.png");
}
.contact__form {
display: grid;
grid-template-columns: auto auto;
grid-template-rows: auto auto auto auto;
height: -moz-fit-content;
row-gap: 10px;
column-gap: 28px;
margin: auto;
}
.contact__form__import {
width: calc(100% - 419px);
padding: 60px 70px 50px 70px;
display: flex;
/* grid-template-columns: auto auto; */
/* grid-template-rows: auto auto auto auto; */
height: fit-content;
row-gap: 10px;
-moz-column-gap: 28px;
column-gap: 28px;
flex-direction: column;
}
.contact__form--message {
width: 350px;
}
.contact__form--message textarea {
height: 117px;
}
.contact__form--newsletter {
grid-column-start: 1;
grid-column-end: 3;
}
.contact__form--newsletter label {
color: #436D8F;
font-size: 14px;
font-weight: 500;
}
.contact__form--button--submit {
grid-column-start: 1;
grid-column-end: 3;
display: flex;
justify-content: space-evenly;
}
.contact__form--button--submit button {
width: 220px;
border: none;
border-radius: 4px;
padding: 14px 0px;
font-weight: 700;
font-size: 10px;
background-color: #02BD7A;
color: white;
}
.contact__form--button--submit button:hover {
background: #018b59;
}
@media (max-width: 1200px) {
.contact__image {
width: 250px;
}
.contact__form {
width: calc(100% - 250px);
}
}
@media (max-width: 992px) {
.contact__image {
display: none;
}
.contact__form {
width: 100%;
}
}
@media (max-width: 768px) {
.contact__form {
grid-template-columns: auto;
grid-template-rows: auto auto auto auto auto auto auto auto auto;
padding: 60px 40px 50px 40px;
}
.contact__form--message {
grid-column-start: 1;
grid-column-end: 1;
}
.contact__form--newsletter {
grid-column-start: 1;
grid-column-end: 1;
}
.contact__form--button--submit {
grid-column-start: 1;
grid-column-end: 1;
}
}
/*importar lista*/

/* lista pendentes/listasprontas */
.products {
width: 80%;
}
.products__title {
display: flex;
color: #304558;
font-size: 30px;
font-weight: 800;
padding-bottom: 10px;
border-bottom: 1px solid #C5CFD9;
}
.products__title span {
font-weight: 900;
}
.products__icon {
width: 11px;
height: 32px;
background: #02BD7A;
border-radius: 6px 0 6px 0;
margin-right: 4px;
}
.products__box {
margin: 50px 0;
}
.products__item {
width: 100%;
height: 340px;
background-image: url("../img/product-bg.png");
background-repeat: none;
background-size: cover;
padding: 0.5px 10px;
border-radius: 8px;
transition: 0.2s;
cursor: pointer;
margin: 10px 0;
display: grid;
}
.products__item h4 {
color: white;
font-weight: 800;
font-size: 14px;
margin-bottom: 0;
}
.products__item p {
color: white;
}
.products__item span {
margin-top: 20px;
color: white;
font-weight: 800;
font-size: 12px;
}
.products__item:hover {
background-image: url("../img/product-bg-hover.png");
transform: translateY(-10px);
}

/* lista pendentes/listasprontas */

/* codificar listas */
.register__title {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.register__title div {
display: flex;
align-items: center;
justify-content: center;
background: #005CA9;
border-radius: 17px 0 17px 0;
height: 39px;
width: 274px;
color: white;
font-size: 21px;
font-weight: 400;
margin-bottom: 20px;
}
.register__title div span {
font-weight: 700;
margin-left: 4px;
}
.register__title p {
text-align: center;
color: #50667A;
font-size: 14px;
font-weight: 400;
}
.codificar__box {
background: #F7FBFC;
border-radius: 8px;
box-shadow: 0px 4px 12px rgb(0 0 0 / 10%);
margin-top: 50px;
}
/* codificar listas */

/* Reinicie sua senha */

.recoverPassword {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
padding: 0 16px;
margin-top: 5%;
}
.recoverPassword__title {
max-width: 360px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.recoverPassword__title div {
display: flex;
align-items: center;
justify-content: center;
background: #F2F5FA;
border-radius: 17px 0 17px 0;
height: 39px;
width: 274px;
color: #014279;
font-size: 21px;
font-weight: 400;
margin-bottom: 20px;
}
.recoverPassword__title div span {
font-weight: 700;
margin-left: 4px;
}
.recoverPassword__title p {
text-align: center;
color: #50667A;
font-size: 14px;
font-weight: 400;
}
.recoverPassword__box {
margin: 50px 0;
max-width: 490px;
width: 100%;
border-radius: 8px;
background: white;
padding: 55px;
}
.recoverPassword__box h5, .recoverPassword__box div {
margin-bottom: 40px;
}
.recoverPassword__box h5 {
font-size: 14px;
color: #50667A;
}
.recoverPassword__box button {
width: 100%;
}
.recoverPassword__box p {
width: 100%;
text-align: center;
margin-top: 30px;
padding-top: 30px;
border-top: 1px solid #C5CFD9;
font-size: 14px;
color: #50667A;
}
.recoverPassword__box p span {
font-weight: 800;
color: #3C9FB0;
cursor: pointer;
}

/* Reinicie sua senha */

/* Consulta descricao */

.height{
height: 100vh;
}
.search{
position: relative;
box-shadow: 0 0 40px rgba(51, 51, 51, .1);
}
.search input{
height: 60px;
text-indent: 25px;
border: 2px solid #d6d4d4;
}
.search input:focus{
box-shadow: none;
border: 2px solid blue;
}
.search .fa-search{
position: absolute;
top: 20px;
left: 16px;
}
.search button{
position: absolute;
top: 5px;
right: 5px;
height: 50px;
width: 110px;
background: blue;
}

.minhatabela td {
min-width: 150px;
}

/* pura cosmetica */
.minhatabela {
height: 100%;
border-collapse: collapse;
}

/* Consulta descricao */

/* spinner loading */
.spinner-3 {
width: 50px;
margin: auto;
aspect-ratio: 1;
display: grid;
border-radius: 50%;
background:
linear-gradient(0deg ,rgb(0 0 0/50%) 30%,#0000 0 70%,rgb(0 0 0/100%) 0) 50%/8% 100%,
linear-gradient(90deg,rgb(0 0 0/25%) 30%,#0000 0 70%,rgb(0 0 0/75% ) 0) 50%/100% 8%;
background-repeat: no-repeat;
animation: s3 1s infinite steps(12);
}
.spinner-3::before,
.spinner-3::after {
content: "";
grid-area: 1/1;
border-radius: 50%;
background: inherit;
opacity: 0.915;
transform: rotate(30deg);
}
.spinner-3::after {
opacity: 0.83;
transform: rotate(60deg);
}
@keyframes s3 {
100% {transform: rotate(1turn)}
}
.products__filter {
display: flex;
margin: 50px;
flex-direction: row-reverse;
align-items: center;
}
/* Esconde o efeito inicialmente */
.hidden {
display: none;
}
/* Spinner para efeito de carregamento */
.spinner {
border: 4px solid rgba(0, 0, 0, 0.1);
border-left-color: #1d99bb;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
margin-top: 10px;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');


.title-especialista
{
color: #16384c;
font-family: 'Poppins', sans-serif;
font-weight: 600 !important;
}

.container-especialista
{
position: relative;
display: flex;
justify-content: space-evenly;
align-items: center;
flex-wrap: wrap;
padding: 30px;
font-family: 'Poppins', sans-serif;
}

.container-especialista .card
{
position: relative;
max-width: 300px;
height: 500px;
margin: 30px 10px;
padding: 20px 15px;
display: flex;
flex-direction: column;
background: #fff;
box-shadow: 0 5px 202px rgba(0,0,0,0.2);
transition: .3s ease-in-out;
/* justify-content: center; */
align-items: center;

border-top-left-radius: 8px;
font-family: 'Poppins', sans-serif;
}

.container-especialista .card .imgBx
{
position: relative;
width: 100%;
text-align: center;
height: 150px;
}

.container-especialista .card .imgBx img
{
width: 50%;
height: 100%;
max-width: 100%;
border-radius: 4px;
}

.container-especialista .card .content
{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.container-especialista .card .content h2
{
color: #16384c;
font-family: 'Poppins', sans-serif;
font-weight: 550;
font-size: 26px;
}

.container-especialista .card .content small
{
width: 100%;
font-size: 12px;
color: #16384c;
font-weight: 500;
font-family: 'Poppins', sans-serif;
text-align: center;
}

.container-especialista .card .content p
{
margin-top: 1.5rem;
text-align: justify;

font-family: 'Poppins', sans-serif;
}

.container-especialista .card .content p + small
{
position: absolute;
bottom: 10px;
}

.about-title
{
color: rgb(6, 49, 70);
font-weight: 500;
font-family: Arial, Helvetica, sans-serif;

font-size: 3.6rem;
}

fieldset
{
border: 0 !important;
margin-top: 2rem;
}

fieldset legend
{
border: 0 !important;
padding: 1rem;
}

fieldset + fieldset legend
{
font-size: 3.1rem;
}

fieldset ul
{
padding: 0 2rem;
}

fieldset ul li
{
list-style: none;
text-indent: 2rem;

font-weight: 500;
font-family: Arial, Helvetica, sans-serif;
font-size: 1.8rem;

text-align: justify;
}

fieldset ul li strong
{
font-weight: 600;
color: rgb(6, 49, 70);
}

fieldset ul li + li
{
margin-top: 2rem;
}
