/*NAVBAR*/
:root {
  --primary-color: #7B4990;
  --secondary-color: #9792c7;
  --secondary-color-with-opacity: #bab4e21f;
  --background-color: #F5F5FD;
  --background-color-hover: #e5e5ec;
  --text: #9792c7;
  --white: #fff;
  --black: #000;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: var(--white);
  color: var(--primary-color);
  display: flex;
  flex-direction: row;
  flex: 1;
}

.form {
  width: 450px;
  margin: auto; 
  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.35);  
  border-radius: 10px;
  transition: 0.5s ease-in-out;
  background-color: #a9abae;
}
.submit {
  display: block;
  height: 35px;
  width: 100%;
  margin-top: 20px;
  background: #EC9247;
  color: white;
  border-radius: 5px;
  outline: 0;
  border: none;
  transition: 0.15s ease-in-out;
  cursor: pointer;
  box-shadow: 0px 0px 0px #000 !important;
}
.submit:hover {
  background: #ee8026;
}
@media (max-widtH: 500px) {
  .form {
    width: 300px;
    
  }
}
.form input, .form select {
  padding: 10px 5px;
  border-radius: 5px;
  outline: 0;
  border: none;
  box-shadow: 0px 0px 2px #000;
}

.form-wrap  {
 /* background-color: var(--primary-color);*/
  background-color: transparent;
  background-image: linear-gradient(180deg, #373435 0%, #a9abae 100%);
  border-radius: 10px;
}

.form img {
  margin-bottom: 25px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 250px;
}

.form-wrap .tabs {
  overflow: hidden; 
  background-color: #a9abae;
}

.form-wrap .tabs h3 {
  float: left;
  width: 50%; 
  margin: 0;
}

.form-wrap .tabs h3 a {
  padding: 0.5em 0;
  text-align: center;
  font-weight: 400;
  background-color: #a9abae;
  display: block;
  color: var(--primary-color);
  text-decoration: none;
}

.form-wrap .tabs h3 a.active {
  background-color: transparent;
  background-image: linear-gradient(360deg, #373435 0%, #a9abae 100%);
  color:white;
}

.form-wrap .tabs-content {
  padding: 1.5em; 
}

.form-wrap .tabs-content div[id$="tab-content"] {
  display: none; 
}

.form-wrap .tabs-content .active {
  display: block !important; 
}

.form .campos {
  margin: 10px 0;
  display: flex;
}
.form .campos label {
  display: block;
  margin: auto;
  width: 65px;
  margin-bottom: 10px;
  margin-right: 10px;
  text-align: left;
  color: white;
}
.form .campos input {
  width: 100%;
}

.forgot-tab {
  display: none;
}

.esqueci-senha {
  background-color:transparent !important;
  cursor: pointer;
  outline: 0;
  border: none;
  color: white;
  text-decoration: underline;
}