/**MODALES DE LOGEO, REGISTRO Y PASS RECOVERY**/
.auth {
  background-color: rgba(0,0,0,0.7);
}

.auth.login,
.auth.registration,
.auth.pass-recovery {
  position: initial;
}

.auth-container {
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
}

.auth .auth-container .btn-wrapper {
  position: absolute;
  right: -1px;
  top: -41px;
  width: 2rem;
  height: 2rem;
  border-radius: 0 8px 0 0;
  border: 1px solid transparent;
}

@media (min-width: 768px) {
  .auth .auth-container .btn-wrapper {
    right: -39px;
    top: -39px;
  }
}

.auth .auth-container .btn-close {
  position: relative;
  bottom: 0.5rem;
  transform: rotate(45deg);
  font-size: 2rem;
  color: #888888;
  font-weight: 400;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.auth .auth-container .btn-close:hover {
  color: #1A1A1A;
}

.auth-container .logo .img-fluid {
  width: 250px;
}

 .auth-container .wrapper {
  background-color: #ffffff;
  /*border: 1px solid #e1e1e1;*/
  border-radius: 2px;
  padding-bottom: 30px;
  padding-top: 40px;
}

@media (min-width: 768px) {
   .auth-container .wrapper {
    padding: 30px;
  }
}

 .auth-container .wrapper h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  color: #444444;
}

@media (min-width: 768px) {
   .auth-container .wrapper h1 {
    font-size: 26px;
  }
}

 .auth-container .wrapper p {
  font-weight: 300;
  color: #888888;
  font-size: 16px;
}

.auth-container .wrapper p.paragraph {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 10px;
}

 .auth-container .wrapper p.withLines {
  position: relative;
}

 .auth-container .wrapper p.withLines:before,
 .auth-container .wrapper p.withLines:after {
  position: absolute;
  content: '';
  height: 1px;
  background-color: #cecece;
  top: 50%;
  width: 8%;
}

body.login .auth-container .wrapper p.withLines:before,
body.login .auth-container .wrapper p.withLines:after {
  width: calc(50% - 15px - 132px);
}

body.registration .auth-container .wrapper p.withLines:before,
body.registration .auth-container .wrapper p.withLines:after {
  width: calc(50% - 15px - 94.5px);
}

body.pass-recovery .auth-container .wrapper p.withLines:before,
body.pass-recovery .auth-container .wrapper p.withLines:after {
  width: calc(50% - 15px - 185.5px);
}

@media (min-width: 768px) {
  body.login .auth-container .wrapper p.withLines:before,
  body.login .auth-container .wrapper p.withLines:after {
    width: 19%;
  }

  body.registration .auth-container .wrapper p.withLines:before,
  body.registration .auth-container .wrapper p.withLines:after {
    width: 27%;
  }

  body.pass-recovery .auth-container .wrapper p.withLines:before,
  body.pass-recovery .auth-container .wrapper p.withLines:after {
    width: 8%;
  }
}

 .auth-container .wrapper p.withLines:before {
  left: 0;
}

 .auth-container .wrapper p.withLines:after {
  right: 0;
}

@media (min-width: 768px) {
   .auth-container .wrapper p {
    font-size: 18px;
  }
}

 .auth-container .wrapper .social .btn {
  color: #fff;
  font-weight: bold;
  font-size: 14px;
}

@media (min-width: 768px) {
   .auth-container .wrapper .social .btn {
    font-size: 18px;
  }
}

 .auth-container .wrapper .social .btn i {
  float: left;
  margin-top: 3px;
}

 .auth-container .wrapper .social .btn.btn-google {
  background-color: #db402c;
}

 .auth-container .wrapper .social .btn.btn-google:focus,
 .auth-container .wrapper .social .btn.btn-google:active {
  -webkit-box-shadow: 0 0 0 0.2rem rgba(219, 64, 44, 0.5);
  -moz-box-shadow: 0 0 0 0.2rem rgba(219, 64, 44, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(219, 64, 44, 0.5);
}

 .auth-container .wrapper .social .btn.btn-facebook {
  background-color: #3b5998;
}

 .auth-container .wrapper .social .btn.btn-facebook:focus,
 .auth-container .wrapper .social .btn.btn-facebook:active {
  -webkit-box-shadow: 0 0 0 0.2rem rgba(59, 89, 152, 0.5);
  -moz-box-shadow: 0 0 0 0.2rem rgba(59, 89, 152, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(59, 89, 152, 0.5);
}

 .auth-container .wrapper .social .btn.btn-twitter {
  background-color: #55acee;
}

.popover {
  border-radius: .25rem;
  max-width: 100%;
  min-width: 80%;
  left: 50%;
  padding: 3px 8px;
  position: absolute;
  text-align: center;
  transform: translate(-50%,-100%);
}

.popover.success {
  background-color: rgba(204,255,204,0.85);
  border: 1px solid rgba(0,102,51,0.85);
}
.popover.warning {
  background-color: rgba(255,204,204,0.85);
  border: 1px solid rgba(153,0,0,0.85);
}

.popover.info {
  background-color: rgba(205,213,230,0.85);
  border: 1px solid rgba(14,35,82,0.85);
}

.popover-content {
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  color: #000000;
}

.popover .arrow {
  visibility: hidden;
}

@media (min-width: 768px) {
   .auth-container .wrapper .username {
    padding-top: 10px;
  }
}

 .auth-container .wrapper .username .form-group .form-control {
  border-color: #bdcfe2;
}

 .auth-container .wrapper .username .form-group .form-control.warning {
  background-color: rgb(255,204,204);
  border-color: rgb(153,0,0);
}

 .auth-container .wrapper .username .form-group .form-control.warning:focus {
  box-shadow: 0 0 0 0.2rem rgba(153,0,0,.25);
}

 .auth-container .wrapper .username .form-group .form-control.success {
  background-color: rgb(204,255,204);
  border-color: rgb(0,102,51);
}

 .auth-container .wrapper .username .form-group .form-control.success:focus {
  box-shadow: 0 0 0 0.2rem rgba(0,102,51,.25);
}

 .auth-container .wrapper .username .form-group + p {
  color: #555555;
}

 .auth-container .wrapper .username .form-group #pass-recovery,
 .auth-container .wrapper .username .form-group #registration-link,
 .auth-container .wrapper .username .form-group #login-link {
  color: #555555;
}

@media (min-width: 768px) {
   .auth-container .wrapper .username .form-group + p {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

   .auth-container .wrapper .username .form-group #pass-recovery,
   .auth-container .wrapper .username .form-group #registration-link {
    padding-top: 10px;
    padding-bottom: 10px;
  }

   .auth-container .wrapper .username .form-group #login-link {
    padding-top: 30px;
    padding-bottom: 10px;
  }

   .auth-container .wrapper .username .form-group #pass-recovery {
    margin-bottom: 0px;
  }

 .auth-container .wrapper .username p a {
  color: #3b5998;
  text-decoration: underline;
}

 .auth-container .wrapper .username p.terms {
  font-size: 15px;
  font-weight: 300;
  color: #a4a4a4;
}

 .auth-container .wrapper .username p.terms a {
  color: inherit;
}

 .auth-container .wrapper .username .btn-login {
  color: #fff;
  background-color: #e96141;
  border: none;
  font-weight: 500;
  cursor: pointer;
}

 .auth-container .wrapper .username .btn-login:focus,
 .auth-container .wrapper .username .btn-login:active {
  border-color: #e96141;
  -webkit-box-shadow: 0 0 0 0.2rem rgba(233, 97, 65, 0.5);
  -moz-box-shadow: 0 0 0 0.2rem rgba(233, 97, 65, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(233, 97, 65, 0.5);
}

@media (min-width: 768px) {
   .auth-container .wrapper .username .btn-login {
    font-size: 18px;
    padding-top: 9px;
    padding-bottom: 9px;
  }
}

 .auth-container .wrapper .usuario p {
  font-size: 18px;
  margin: 0;
}

 .auth-container .wrapper .usuario p span {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  color: #444444;
  font-weight: normal;
}

 .auth-container .finish h1 {
  font-family: 'Montserrat', sans-serif;
  color: #444444;
  font-weight: 500;
  font-size: 28px;
  margin-top: 40px;
  margin-bottom: 20px;
}

 .auth-container .finish p {
  font-size: 18px;
  font-weight: 300;
  color: #888888;
}

 .auth-container .finish p span {
  font-weight: 500;
  display: block;
  margin-top: 30px;
  margin-bottom: 20px;
}

 .auth-container .finish .btn {
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  background-color: #3d878c;
  border: none;
  padding-top: 9px;
  padding-bottom: 9px;
}

/**MODALES DE ERROR, EXITO Y NEUTRALES EN LOS DISTINTOS PROCESOS**/

.pop-up {
  background-color: rgba(0,0,0,0.7);
}

.pop-up .pop-up-container {
  width: 90%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pop-up-container .wrapper {
  background-color: #ffffff;
  border-radius: 0.25rem;
}

.pop-up-container.error .wrapper  {
  border: 0.25rem solid #E86141;
}

.pop-up-container.suggestion .wrapper  {
  border: 0.25rem solid #1981A4;
}

.pop-up-container.success .wrapper  {
  border: 0.25rem solid #57D0A5;
}

.pop-up-container.error .wrapper ,
.pop-up-container.suggestion .wrapper,
.pop-up-container.success .wrapper {
  padding: 2rem 1rem 2rem 1rem;
}

@media (min-width: 768px) {
   .pop-up-container .wrapper .error,
   .pop-up-container .wrapper .suggestion,
   .pop-up-container .wrapper .success {
    padding: 1.5rem 1.5rem 3rem 1.5rem;
  }
}

.pop-up-container.error .btn-wrapper .icon-close{
  background: #E86141;
}

.pop-up-container.suggestion .btn-wrapper .icon-close {
  background: #1981A4;
}

.pop-up-container.success .btn-wrapper .icon-close {
  background: #57D0A5;
}

.pop-up-container.error .btn-wrapper .icon-close:hover {
  background: #733120;
}

.pop-up-container.suggestion .btn-wrapper .icon-close:hover {
  background: #0C4051;
}

.pop-up-container.success .btn-wrapper .icon-close:hover {
  background: #2B6752;
}

.pop-up-container.error .btn-wrapper .icon-close,
.pop-up-container.suggestion .btn-wrapper .icon-close,
.pop-up-container.success .btn-wrapper .icon-close {
  color: #fff;
  padding: 3px;
}
/*
.pop-up-container .btn-wrapper {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 1.75rem;
  height: 1.75rem;
}
.pop-up-container .btn-close {
  position: relative;
  bottom: 0.55rem;
  left: 0.25rem;
   transform: rotate(45deg);
  font-size: 35px;
  color: #FFFFFF;
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (min-width: 768px) {
   .pop-up-container .btn-close {
    bottom: 0.85rem;
    left: 0.25rem;
  }
}
*/

 .pop-up-container .wrapper .error .row,
 .pop-up-container .wrapper .suggestion .row,
 .pop-up-container .wrapper .success .row {
  padding: 0 1rem;
}

 .pop-up-container .img-container {
  margin-top: auto;
  margin-bottom: auto;
}

 .pop-up-container .img-responsive {
  display: block;
  width: 40vw;
  max-width: 130px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 768px) {
   .pop-up-container .img-responsive {
    width: 100%;
  }
}

.pop-up-container .error-text,
.pop-up-container .suggestion-text,
.pop-up-container .success-text {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  text-align: center;
  margin: 1rem auto 0.5rem auto;
}

.pop-up-container .error-text {
  color: #E86342;
}

 .pop-up-container .suggestion-text {
  color: #1981A4;
}

 .pop-up-container .success-text {
  color: #57D0A5;
}

@media (min-width: 768px) {
   .pop-up-container .error-text,
   .pop-up-container .suggestion-text,
   .pop-up-container .success-text {
    font-size: 1.5rem;
    margin-top: 1.5rem;
  }
}

 .pop-up-container .solution-text {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  color: #ABABAB;
  text-align: center;
  margin: auto;
  font-weight: 500;
}

@media (min-width: 768px) {
   .pop-up-container .solution-text {
    font-size: 1rem;
  }
}

 .pop-up-container .btn-solution,
 .pop-up-container .contact-form,
 .pop-up-container .btn-send-msg {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  border-radius: 0.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  margin-left: auto;
  margin-right: auto;
}

 .pop-up-container .btn-solution,
 .pop-up-container .btn-send-msg {
  font-weight: 600;
  margin-top: 1.5rem;
  margin-bottom: 0;
  width: 250px;
}

 .pop-up-container .contact-form {
  text-align: left;
  font-weight: 400;
  border: solid 1px #ABABAB;
  padding-left: 1rem;
}

 .pop-up-container .contact-form:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(171, 171, 171,0.3);
  -webkit-box-shadow: 0 0 0 0.2rem rgba(171, 171, 171,0.3);
  -moz-box-shadow: 0 0 0 0.2rem rgba(171, 171, 171,0.3);
}

.error .pop-up-container .btn-solution {
  color: #E86342;
  border: solid 2px #E86141;
}

.error .pop-up-container .btn-solution:focus,
.error .pop-up-container .btn-solution:active {
  box-shadow: 0 0 0 0.2rem rgba(232, 97, 65, 0.3);
  -webkit-box-shadow: 0 0 0 0.2rem rgba(232, 97, 65, 0.3);
  -moz-box-shadow: 0 0 0 0.2rem rgba(232, 97, 65, 0.3);
}

.suggestion .pop-up-container .btn-solution {
  color: #1981A4;
  border: solid 2px #1981A4;
}

@media (min-width: 768px) {
   .pop-up-container .btn-solution {
    font-size: 1rem;
    margin: 2.5rem auto 0 auto;
  }
}

.suggestion .pop-up-container .btn-solution:focus,
.suggestion .pop-up-container .btn-solution:active {
  box-shadow: 0 0 0 0.2rem rgba(25, 129, 164, 0.3);
  -webkit-box-shadow: 0 0 0 0.2rem rgba(25, 129, 164, 0.3);
  -moz-box-shadow: 0 0 0 0.2rem rgba(25, 129, 164, 0.3);
}

.success .pop-up-container .btn-solution {
  color: #57D0A5;
  border: solid 2px #57D0A5;
}

.success .pop-up-container .btn-solution:focus,
.success .pop-up-container .btn-solution:active {
  box-shadow: 0 0 0 0.2rem rgba(87, 208, 165, 0.3);
  -webkit-box-shadow: 0 0 0 0.2rem rgba(87, 208, 165, 0.3);
  -moz-box-shadow: 0 0 0 0.2rem rgba(87, 208, 165, 0.3);
}

.suggestion .pop-up-container .btn-send-msg {
  color: #FFFFFF;
  background-color: #1981A4;
  border: solid 1px #1981A4;
}

.suggestion .pop-up-container .btn-send-msg:hover {
  background: #0C4051;
}

/**MODAL PARA VISUALIZAR LAS FOTOS DE PANTALLAS**/

.screen-pics {
  background-color: rgba(0,0,0,0.7);
}

.screen-pics .pop-up-container {
  width: 100%;
  padding-top: 66.667%;
  background-color: #000000;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media (min-width: 576px) {
  .screen-pics .pop-up-container {
    width: 60%;
    padding-top: 40%;
  }
}

@media (min-width: 768px) {
  .screen-pics .pop-up-container {
    width: 50%;
    padding-top: 33.333%;
  }
}

@media (min-width: 1200px) {
  .screen-pics .pop-up-container {
    width: 750px;
    padding-top: 500px;
  }
}

.screen-pics img.screen-picture {
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.screen-pics a {
  text-decoration: none;
}

.screen-pics .pop-up-container .icon-next,
.screen-pics .pop-up-container .icon-back,
.screen-pics .pop-up-container .icon-close {
  color: rgba(255,255,255,0.7);
}

.screen-pics .pop-up-container .icon-next:before,
.screen-pics .pop-up-container .icon-back:before,
.screen-pics .pop-up-container .icon-close:before {
  margin: 0;
}

.screen-pics .pop-up-container .icon-next,
.screen-pics .pop-up-container .icon-back {
  font-size: 1rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .icon-next,
  .screen-pics .pop-up-container .icon-back {
    font-size: 2rem;
  }
}

.screen-pics .pop-up-container .icon-back {
  left: 0.25rem;
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .icon-back {
    left: 0.5rem;
  }
}

.screen-pics .pop-up-container .icon-next {
  right: 0.25rem;
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .icon-next {
    right: 0.5rem;
  }
}

.screen-pics .pop-up-container .icon-close {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  font-size: 0.5rem;
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .icon-close {
    top: 0.9rem;
    right: 0.9rem;
    font-size: 1rem;
  }
}

.screen-pics .pop-up-container .icon-next:hover,
.screen-pics .pop-up-container .icon-back:hover,
.screen-pics .pop-up-container .icon-close:hover {
  color: rgba(255,255,255,1);
}

.screen-pics .pop-up-container .pics-dots-wrapper {
  position: absolute;
  bottom: 0.325rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .pics-dots-wrapper {
    bottom: 0.65rem;
  }
}

.screen-pics .pop-up-container .pics-dots {
  display: inline-block;
  height: 0.3rem;
  width: 0.3rem;
  background: #E6E6E6;
  border-radius: 0.15rem;
  margin: 0;
}

.screen-pics .pop-up-container .pics-dots.active {
  background: #EA6141;
}

@media (min-width: 992px) {
  .screen-pics .pop-up-container .pics-dots {
    height: 0.6rem;
    width: 0.6rem;
    border-radius: 0.3rem;
    margin: 0 2px;
  }
}

.modal-close {
  font-size: 10pt;
  left: calc(25% - 15px);
  position: absolute;
  top: 10px;
  width: 100%;
}
.modal-close button{
  cursor: pointer;
}

@media (min-width: 576px){
  .modal-close {
    top: 18px;
    left: 115px;
  }
}
@media (min-width: 768px){
  .modal-close {
    left: 140px;
  }
}

@media (min-width: 768px) {
  .modal-window {
    max-width: 600px;
  }
}

.pop-up-container .btn-accept, .pop-up-container .btn-cancel {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  border-radius: 0.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  margin-top: 1.5rem;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  width: 200px;
}

.pop-up-container .btn-accept {
  background: #E86342;
}

.pop-up-container .btn-cancel {
    background: #A1A1A1;
}

.pop-up-container.error .btn-accept, .pop-up-container .btn-cancel {
    color: #FFFFFF;
}

@media (min-width: 768px) {
  .pop-up-container .btn-accept, .pop-up-container .btn-cancel {
    font-size: 1rem;
    margin: 2.5rem auto 0 auto;
  }
}

/* <Modales de error, de exito, informativos y de sugerencia> */

.modal.error .modal-content {
  border: 0.25rem solid #E86141;
}

.modal .close {
  font-size: 30px;
  font-weight: 500;
  text-shadow: none;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  right: 0;
  outline: none;
  opacity: 1;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 10;
}

.modal.error .close {
  color: #FFFFFF;
  background: #E86141;
}

.modal.error .close:hover {
  background: #733120;
}

.modal .btn-close {
  font-family: 'Roboto', sans-serif;
  left: -webkit-calc(50% + 1px);
  left: calc(50% + 1px);
  line-height: 1;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
}

.modal .img-info {
  height: 130px;
} 

.modal .message-title {
  font-size: 1.5rem;
  font-weight: 600;
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}

.modal.error .message-title {
  color: #E86141;
}

.modal .message-solution {
  color: #ABABAB;
  font-size: 1rem;
}

.modal .message-solution p {
  margin-top: 1rem;
}

.modal .message-solution ul {
  list-style: none;
  padding: 0;
}

.modal .message-solution small {
  display: block;
  color: #777777;
}

.modal .buttons-row {
  margin-top: 1.5rem;
}

.modal .btn-cancel, .modal .btn-confirm {
  width: 40%;
}

.modal .btn-cancel {
  color: #FFFFFF;
  background-color: #888888;
  border-color: #888888;
}

.modal.error .btn-confirm {
  color: #FFFFFF;
  background-color: #E86141;
  border-color: #E86141;
}

/* </Modales de error, de exito, informativos y de sugerencia> 