:root {
  --primary: #325ac5;
  --secondary: #6588e9;
  --font-black: #1D1D1B; 
  --purple: #6859A3;
  --blue: #03506B;
  --red: #CD7277;
  --light-green: #325ac5;
  --gray: #F1F1F1;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Ubuntu', sans-serif;
  color: white;
}

a {
  text-decoration: none;
  color: inherit;
}

.login-container {
  display: flex;
  height: 100vh;
}

.left-panel {
  flex: 65%;
  background-color: var(--gray);
  padding: 150px;
  display: flex;
  /* flex-direction: column; */
  justify-content: center;
  align-items: center;
}

.right-panel {
  flex: 35%;
  background-color: #ffffff;
  display: flex;
  margin-bottom: 75px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.logo-sistema {
  top: 5%;
  left: 5%;
  z-index: 10;
  position: absolute;
}

.logo-cliente {
  margin-bottom: 20px;
}


.carousel-container {
  width: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.carousel-indicators li {
  background-color: var(--primary);
  border-color:var(--primary);
  height: 5px;
}

.carousel-indicators .active {
  background-color: var(--primary);
}


.carousel-inner {
  padding: 50px;
  /* border: 2px solid black; */
}

.carousel-inner img {
  padding: 50px;
  margin: 50px;
  /* border: 2px solid purple; */
 
}

.carousel-caption {
  margin-top: 50px;
  margin-bottom: 10px;
  /* border: 2px solid yellow; */
}

.carousel-caption p {
  margin-top: 50px;
  color: var(--primary);
  font-weight: bold;
  font-size: 1rem;
  /* border: 2px solid violet;*/ 
}

.carousel-caption span {
  margin-top: 50px;
 
  color: var(--secondary);
  font-size: 0.8rem;
  font-weight: bold;
  /* border: 2px solid crimson; */
}

.validate-form {
  width: 50%;

}

/*
  primary: #033249 - 002e48
  secondary: #23677C - 00677e
*/
.btn-primary-seven {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #ffffff;
}

.btn-primary-seven:hover {
  background-color: var(--secondary);
  border-color: var(--secondary);
  color: #ffffff;
}

/* Media Queries */
@media (max-width: 576px) {

  /* Extra Small (XS) */
  .login-container {
    display: flex;
  }

  .left-panel {
    display: none;
  }
  .right-panel {
    flex: 100%;
  }

  .right-panel {
    margin-top: 20px;
  }

}


@media (min-width: 577px) and (max-width: 1024px) {

  .login-container {
    display: flex;
  }

  .left-panel {
    display: none;
  }
  .right-panel {
    flex: 100%;
  }

  .right-panel {
    margin-top: 20px;
  }
}


@media (min-width: 1025px) and (max-width: 1660px) {

  .login-container {
    display: flex;
    height: 100vh;
  }

  .left-panel {
    flex: 65%;
    background-color: #F1F1F1;
    padding: 0px;
    margin: 0px;
    display: flex;
    /* border: 1px solid red; */
  }

  .right-panel {
    flex: 35%;
    background-color: #ffffff;
    display: flex;
    margin-bottom: 75px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .carousel-container {
    width: 100%;
    padding: 0px;
    margin: 25px;
    /* border: 1px solid blue; */
  }
}

@media (min-width: 1661px) {
  .login-container {
    display: flex;
    height: 100vh;
  }

  .left-panel {
    flex: 65%;
    background-color: #F1F1F1;
    margin: 0px;
    display: flex;
    /* border: 1px solid red; */
  }

  .right-panel {
    flex: 35%;
    background-color: #ffffff;
    display: flex;
    margin-bottom: 75px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .carousel-container {
    width: 100%;
    padding: 0px;
    margin: 0px;
    /* border: 1px solid blue; */
  }

  .carousel-inner {
    padding: 0px;
    /* border: 2px solid black; */
  }
}

input.parsley-success,
select.parsley-success,
textarea.parsley-success {
  color: #247e26b6;
  background-color: #dbf1d2;
  border: 2px solid #247e26b6;
 
}

input.parsley-error,
select.parsley-error,
textarea.parsley-error {
  color: #7c1f1e;
  background-color: #F2DEDE;
  border: 2px solid #b10808b6;
  transition: 0.2s;
}

.parsley-errors-list {
  margin: 2px 0 3px;
  padding: 0;
  list-style-type: none;
  font-size: 0.9em;
  line-height: 0.9em;
  opacity: 0;
  color: #B94A48;

  transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
}

.parsley-errors-list.filled {
  opacity: 1;
}