/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

/* Creación de las variables de los colores de la plantilla*/

:root {
  /*Color principal de la plantilla. Se usa para la barra de navegación de arriba,
    los botones principales y algunos detalles decorativos*/
  --main-color: #CB0013;
  /*Se define el color de la sombra del botón cuando este es pulsado o activado.
    Se crea concatenando una variable de color + '40' que es el nivel de transparencia en hex*/
  --shadow-main-color: var(--main-color) + '40';
  /*Color complementario se usa junto al principal para los degradados, bordes de los botones*/
  --complement-color: #901421;
  /*Color alternativo para el botón de info */
  --alternative-color: #454545;
  --alternative-action-color: #000;
  --shadow-alternative-color: var(--alternative-color) + '40';
  
  --text-color: #333;

  /*Colores para los botones success o de añadir.*/
  --success-color: #009900;
  --complement-success-color: #007600;

  /*Colores para los botones con acciones de borrar o que implican cambios importantes*/
  --danger-color: #C2002F;
  --shadow-danger-color: var(--danger-color) + '40';
  --complement-danger-color: #B30025;

  /*Color de los botones de acciones como editar.*/
  --action-color: #888;
  --action-dark-color: #666;
  --shadow-action-color: var(--action-color) + '40';
}


body {
  padding-bottom: 0; /* no bottom padding, footer should be bottom aligned */
  padding-top: 60px;/* now is redefine in JS to fit any title length */
  flex-direction: column; /* article, then footer */
  display: flex; /* flex, to extend the content to full size */
  min-height: 100vh; /* full height, to bottom-align footer */
  color: var(--text-color) !important;
 }

body > article {
 flex: 1; /* the main article should use as much space as possible */
}

/* Page width */
@media (min-width: 1300px) {
  .container {
    /* width: 1250px; */
    width: 85%;
  }
}

/* Contenedor de los botones de impresion PDF, QueXML PDF */
.print-survey{
  text-align: center;
  margin: 15px;
}


/* Contenedor de los botones de impresion PDF, QueXML PDF */
.print-survey{
  text-align: center;
  margin: 15px;
}

/* nav-bar */
.navbar.navbar-default.navbar-fixed-top { /* Change the background of the bar */
  background-color: #eee;
  /* border-top: 5px solid #570D37; */
  border-bottom: 7px solid var(--main-color);
}
.ls-link-action { /* Change link background <a href="#"> */
  background-color: transparent;
}
.navbar-default .navbar-nav>li>a { /* Change the font color of the link<a href="#"> */
  color: var(--text-color) !important;
  background-image: linear-gradient(var(--text-color), var(--text-color));/*linear-gradient(#d44200, #fff);*/
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 2px;
  transition: background-size .3s;
  text-decoration: none;
  background-color: transparent !important;
}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus { /* Change the color of the link when you are on top and have the focus */
  background-size: 100% 2px;
  color:#ffff;
  font-weight: 200;
}
.navbar-nav .open .dropdown-menu > li > a,
.navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
}
.dropdown-menu > li > a { /* Change the color of the dropdown link */
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.428571429;
  white-space: nowrap;
  color: var(--text-color);
  background-color: #ffffff;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus { /* Change the background of the dropdown link */
  text-decoration: none;
  color: var(--text-color);
  background-color: #eee;/*var(--complement-color);*/
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color:#b6b7b7;
  text-decoration: none;
  outline: 0;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus { /* Change the background color of the default bar */
  background-color: #eee;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus { /*Change the color of the link when you are on top and have the focus*/
  background-color: transparent;
}
.navbar-default .navbar-nav > .disabled > a,
.navbar-default .navbar-nav > .disabled > a:hover,
.navbar-default .navbar-nav > .disabled > a:focus { /*Cambiar el fondo de la barra / deshabilitado> */
  color: #a9afa9;
  background-color: transparent;
}
/* Dropdown */
@media (max-width: 1134px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: var(--text-color);
    background-color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: var(--text-color);
    background-color: #eee;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #888;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #a9afa9;
    background-color: transparent;
  }
}
@media (max-width: 1134px) {
    .navbar-nav .open .dropdown-menu {
      position: static;
      float: none;
      width: auto;
      overflow: hidden;
      margin-top: 0;
      background-color: white;
      border: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
}
@media (max-width: 1134px) {
  .hidden-xs {
    color: white;
    display: none !important;
  }
}
/* Big logo */
@media (min-width: 1200px){
    .logo-container>img {
        max-height: 90px;
        padding: 15px;
        width: auto;
    }
    .navbar-brand>img {
        display: flex;
    }
}
/* Small logo and Title*/
@media screen and (min-width: 1134px) {
  .logo-uxxi{
    display: none;
  }
  .separator{
    margin-top: 25px;
    font-size: 28px;
    color: var(--main-color);
  }
  .title-uxxi{
    margin-top: 25px;
    font-size: 28px;
    color: var(--text-color);
  }
}
@media screen and (max-width: 1135px) {
  .separator{
    margin-top: 12px;
    font-size: 22px;
    color: var(--main-color);
  }
  .title-uxxi{
    margin-top: 12px;
    font-size: 22px;
    display: flex;
    align-items: baseline;
    color: var(--text-color);
  }
}
@media screen and (max-width: 480px) {
  .separator{
    margin-top: 17px;
    font-size: 17px;
    color: var(--main-color);
  }
  .title-uxxi{
    margin-top: 17px;
    font-size: 17px;
  }
}
/* Logo footer */
@media screen and (max-width: 1135px) {
  .logo-uxxi{
    content:url('../files/small_logo.png');
    /* width: 100px; */
    height: 45px;
    margin:10px;
  }
}
/* Specific for survey listing */
@media (min-width: 761px) {
  .surveys-list .btn-group {
    width: 50%;
  }
  .language_change_container{
      height: auto;
  }
}

/* Progress bar */
.progress-bar {
  float: left;
  width: 0%;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  background-color: #d44200;
  text-align: center;
  -webkit-transition: width 0.6s ease;
  transition: width 0.6s ease;
}
/* links */
a {
  color: var(--alternative-color);
  text-decoration: none;
  background-color: transparent;
}
a:hover, a:focus {
  color: var(--alternative-color);
  text-decoration: none;
  background-color: transparent;
}

.text-info {
  color: var(--text-color);
}

.text-primary {
  color: var(--text-color);
}

/* ------------------------------------- */
/*                Buttons                */
/* ------------------------------------- */

/*  Button primary - Next - Save - Send  */
.btn-primary {
  color: #fff;
  background-color: var(--main-color);
  border-color: var(--complement-color);
}
.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: var(--complement-color);
  border-color: var(--complement-color);
}
.btn-primary:hover {
  color: #fff;
  background-color: var(--complement-color);
  border-color: var(--complement-color);
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: var(--complement-color);
  background-image: none;
  border-color: var(--complement-color);
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #fff;
  background-color: var(--complement-color);
  border-color: var(--complement-color);
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: var(--main-color);
  border-color: #a9afa9;
}

/* Button info */
.btn-info {
  color: #fff;
  background-color: var(--alternative-color);
  border-color: var(--alternative-color);
}
.btn-info:focus,
.btn-info.focus {
  color: #fff;
  background-color: var(--alternative-action-color);
  border-color: var(--alternative-color);
}
.btn-info:hover {
  color: #fff;
  background-color: var(--alternative-action-color);
  border-color: var(--alternative-color);
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #fff;
  background-color: var(--alternative-action-color);
  background-image: none;
  border-color: var(--alternative-color);
}
.btn-info:active:hover,
.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:hover,
.btn-info:active:focus,
.btn-info.active:focus,
.open > .dropdown-toggle.btn-info:focus,
.btn-info:active.focus,
.btn-info.active.focus,
.open > .dropdown-toggle.btn-info.focus {
  color: #fff;
  background-color: var(--alternative-action-color);
  border-color: var(--alternative-color);
}
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus {
  background-color: var(--alternative-action-color);
  border-color: var(--alternative-color);
}

/* Button back */
.btn-default {
  color: #fff;
  background-color: var(--main-color);
  border-color: var(--main-color);
}
.btn-default:focus,
.btn-default.focus {
  color: #fff;
  background-color: var(--action-dark-color);
  border-color: var(--action-dark-color);
}
.btn-default:hover {
  color: #fff;
  background-color: var(--action-dark-color);
  border-color: var(--action-dark-color);
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #fff;
  background-color: #286090;
  background-image: none;
  border-color: #122b40;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #fff;
  background-color: var(--action-dark-color);
  border-color: var(--action-dark-color);
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  background-color: #fff;
  border-color: #a9afa9;
}
/* Specific group title */
.group-title {
  color: black;
  font-weight: 100;
}

/* Specific group description */
.well {
  min-height: 20px;
  padding: 19px;
  margin-right: 2px;
  margin-bottom: 20px;
  margin-left: 2px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
}
.well blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, 0.15);
}
.well-lg {
  padding: 24px;
  border-radius: 6px;
}
.well-sm {
  padding: 9px;
  border-radius: 3px;
}

.ls-questionhelp {
 color: #286090;
}

/* Specific question part -  Radio button */
.radio-item label::after {
  background-color: #286090;
}

/* Specific question part  - Check out */
label::after {
  background-color: white;
}
.checkbox-item label::after {
  color:green ;
}

/* Date time picker */
.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover {
  background-color: #122b40;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
}
.bootstrap-datetimepicker-widget table td.today:before {
  content: '';
  display: inline-block;
  border: solid transparent;
  border-width: 0 0 7px 7px;
  border-bottom-color: #122b40;
  border-top-color: rgba(0,0,0,0.2);
  position: absolute;
  bottom: 4px;
  right: 4px;
}

/* ------------------------------------- */
/*                 Footer                */
/* ------------------------------------- */

#surveyFooter {
  width: 100%;
  text-align: center;
  padding-top: 10px;
  margin-top: 5px;
  padding-bottom: 10px;
  background-color: #1a1a1a;
  height: auto;
  position: relative;
  border-top: 7px solid var(--main-color);
  color: #fff;
}
#surveyFooter p {
    margin: revert;
}
/* Ajustar el footer */
@media (min-width: 1135px){
  .col-sm-12 {
    width: 100%;
  }
}

/* Social Media | footer */
.footer-uxxi {
  display: inline-block;
  position: relative;
}
.logo-footer-uxxi {
  float: left;
  display: inline;
  position: relative;
}
.logo-footer-uxxi .logo-footer {
  height: 60px;
}
.socicons-footer-uxxi {
  float: left;
  display: inline;
  position: relative;
}
.socicons-list {
  list-style: none;
  float:left;
  display: flex;
  margin-top: 0px; /* Asginar la altura del top */
}
.socicons-list li {
  display: inline-block;
  margin-left: 10px; /* Asginar la separacion del top */
}
.socicons-list li a {
  text-decoration: none;
  padding: 5px;
  font-size: 30px;
  border-radius: 50%;
  color: #fff;
  background-color: #ffffff;
  transition: all ease-in-out 150ms;
}
.socicons-list li a:hover {
  text-shadow: 0 5px 10px #212121;
}
.socicons-list li:nth-child(1) a { /* twitter color */
  color: #4da7de;
}
.socicons-list li:nth-child(2) a { /* linkedin color */
  color: #0e76a8;
}
@media screen and (max-width: 600px) {
  .logo-footer-uxxi {
    float: inherit;
  }
}

.footer-info-universidad{
  float:left;
  display: flex;
  position:relative;
  margin-top: 10px;  /* Asginar la altura del top */
  margin-left: 45px;
  color:#ffffff;
  text-align: left;
  margin-left: 35px;
}

.title-info{
  float:left;
  display: flex;
  text-align: left;
  margin-left:5px;
  color:#000000;
  font-weight: bold;
}

.simple-info{
  float:left;
  display: flex;
  text-align: left;
  margin-left:5px;
  color:#000000;
  font-weight: normal;
  white-space: pre-line;
}

/*****************************************************************
 ADVANCED SETTINGS | Overwriting boostrap
 --------------------------------------------------------------- */

*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.collapse {
  display: none;
}
.collapse.in {
  display: block;
}
.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}
.nav > li {
  position: relative;
  display: block;
}
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
}
.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
}
.nav > li > a > img {
  max-width: none;
}
.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 20px;
}
.nav-tabs > li {
  float: left;
  margin-bottom: -1px;
}
.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.428571429;
  border-radius: 4px 4px 0 0;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  border-bottom-color: transparent;
  cursor: default;
}
.navbar-nav > li > .dropdown-menu {
  margin-top: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.navbar-btn {
  margin-top: 8px;
  margin-bottom: 8px;
}
.navbar-btn.btn-sm {
  margin-top: 10px;
  margin-bottom: 10px;
}
.navbar-btn.btn-xs {
  margin-top: 14px;
  margin-bottom: 14px;
}
.navbar-text {
  margin-top: 15px;
  margin-bottom: 15px;
}

/* 768 a 1135 */
@media (min-width: 1135px) {
  .navbar-left {
    float: left !important;
  }
  .navbar-right {
    float: right !important;
  }
}
@media (min-width: 1135px) {
  .navbar-nav {
    float: left;
    margin: 0;
  }
  .navbar-nav > li {
    float: left;
  }
  .navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .navbar-nav.navbar-right:last-child {
    margin-right: -15px;
  }
}
@media (min-width: 1135px) {
  .navbar-right .dropdown-menu {
    left: auto;
    right: 0;

  }
  .navbar-right .dropdown-menu-left {
    left: 0;
    right: auto;
  }
}
@media (min-width: 1135px) {
  .navbar {
    border-radius: 4px;
  }
}
@media (min-width: 1135px) {
  .navbar-header {
    float: left;
  }
}
@media (max-width: 768px) {
  .navbar-header, .simpleWrapper {
      background: #e7e7e7;
  }
}
.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030;
}
.navbar-fixed-bottom {
  bottom: 0;
  margin-bottom: 0;
  border-width: 1px 0 0;
}

@media (min-width: 1135px) {
  .navbar-collapse {
    width: auto;
    border-top: 0;
    box-shadow: none;
  }
  .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    padding-bottom: 0;
    overflow: visible !important;
  }
  .navbar-collapse.in {
    overflow-y: visible;
  }
  .navbar-fixed-top .navbar-collapse,
  .navbar-static-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }
}
@media (min-width: 1135px) {
  .container > .navbar-header,
  .container-fluid > .navbar-header,
  .container > .navbar-collapse,
  .container-fluid > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
@media (min-width: 1135px) {
  .navbar-static-top {
    border-radius: 0;
  }
}
@media (min-width: 1135px) {
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    border-radius: 0;
  }
}
.navbar-fixed-top {
  top: 0;
  border-width: 0 0 1px;
}
@media (min-width: 1135px) {
  .navbar > .container .navbar-brand,
  .navbar > .container-fluid .navbar-brand {
    margin-left: -15px;
  }
}

/* Contenedor de los botones de impresion PDF, QueXML PDF */
.print-survey{
  text-align: center;
  margin: 15px;
}

/* El border del boton */
.navbar-default .navbar-toggle {
  background-color: #fff;
  border-color: var(--main-color);
}
/* Todas y por defecto, cambia el fondo al hacer click y focus */
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
  background-color: #ddd;
  color: white;
}
/* Los Span */
.navbar-default .navbar-toggle .icon-bar {
  background-color: var(--alternative-color);
}
.navbar-default .navbar-toggle:focus .icon-bar {
  background-color: var(--alternative-color);
}

.navbar-toggle {
  position: relative;
  float: right;
  margin-right: 15px;
  padding: 9px 10px;
  margin-top: 8px;
  margin-bottom: 8px;
  background-color: transparent;
  background-image: none;

  border-radius: 4px;
}
.navbar-toggle:focus {
  outline: none;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}
@media (min-width: 1135px) {
  .navbar-toggle {
    display: none;
  }
}
.navbar-nav {
  margin: 7.5px -15px;
}
.navbar-nav > li > a {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 20px;
}
/* Form | Select */
@media (min-width: 768px) {
  .form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .form-control {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
  }
  .form-inline .input-group > .form-control {
    width: 100%;
  }
  .form-inline .control-label {
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .radio,
  .form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    vertical-align: middle;
  }
  .form-inline .radio input[type="radio"],
  .form-inline .checkbox input[type="checkbox"] {
    float: none;
    margin-left: 0;
  }
  .form-inline .has-feedback .form-control-feedback {
    top: 0;
  }
}

.panel-primary {
    border-color: #333;
}
.panel-heading {
    background-color: #333 !important;
    border-color: #333 !important;
}
