/*****************
    Breve explicación
    -----------------

    Hay muchas clases que no tienen la explicación o
    el nombre de la etiqueta porque es un ajuste intrascendente,
    porque la etiqueta en sí no necesita un nombre o
    porque están copiadas del 'theme.css'.
    
    Esto lo hacemos, ya que en el 'theme.css', explica que ese archivo puede cambiar en un futuro,
    pero el 'custom.css', en cambio, no puede sobreescribirse por una actualización.
*/

/**** La barra de progreso y los sliders */
    body{
        padding-top: 0 !important;
    }

    .progress.active .progress-bar,
    .progress-bar.active {
      -webkit-moz-animation: progress-bar-stripes 1s linear infinite;
      -o-animation: progress-bar-stripes 1s linear infinite;
      animation: progress-bar-stripes 1s linear infinite;
    }
    
    .top-container .top-content:empty{display:none}
    .group-description:empty{display:none}
    .group-title:empty{display:none}
    .top-container .progress {
        height: 30px;
        width: 88%;
        margin-bottom: 0;
        /*margin-right: 10%;*/
        margin-left: 6%;
    }
    .top-container .progress {
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) inset; /* flatly remove box-shadow : readd one */
    }
    .progress .progress-bar {
        line-height: 34px;
    }
    
    .fruity .progress-bar {
        color: #faffd7;
        font-size: 20px;
        background-color: #394be7;
        box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
    }
    
    #topContainer {
        position: absolute;
        /*top: 55px; now define in JS to fit any title length */
        width: 100%;
        padding: 1em;
        border-bottom: none;
    }
    .progress-container {
      border: 1px solid #0083C3;
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
      padding: 14px 20px;
    }
    .progress {
        height: 25px;
        margin-bottom: 0px;
        background: #ffffff;
        border: 0;
        box-shadow: none;
    }
    
    /* .progress */
    
    .slider.slider-horizontal{
        
        width:98%;
    }
    
    .question-code{
        font-size:0px;
        width:0%;
    }
    
    .group-title{
        font-size: 0px;
        width: 0%;
    }
    
    .slider-list .slider-item .control-label {
        margin-top: 1em;
    }
    
    .slider-list .slider-container {
        margin-top: 1em;
    }
    
    .slider-item {
        min-height: 30px;
    }
    
    .slider.slider-horizontal {
        margin-bottom: 0;
    }
    .slider-handle.custom::before {
        color: #9c3b85;
        font-size: 28px !important;
    }
    .withslider .form-group {
        margin-bottom: 5px;
    }
    .slider-list .pull-left {
        position: absolute;
        left: -15px;
        top: 10%;
    }
    .slider-list div.pull-right {
        position: absolute;
        top: -5px;
        right: -17px;
    }
    tooltip-inner {
        background: transparent;
        color: #fff;
        padding-bottom: 0;
    }

/*---------------------------------------*/

/**** Los cambios genéricos implementados a la versión 3.X */

    /* container fluid */
    .top-container {
        border: 1px solid #0F6C7D;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        padding: 14px 20px;
        width: 18.66666667%;
        float: right;
        position: relative;
        min-height: 1px;
        height: 30%;
        margin-right: -1.15%;
    }
    
    .container.header {
      padding: 0;
    }
    
    #langchanger-label {
        padding-top: 11px;
    }
    
    /* lo que engloba el título */
    
    .group-outer-container {
        display: block;
    }
    
    .space-col {
        padding-top: 0.8%;
        margin-bottom: -0.06em;
        margin-top: 1.29em;
    }
    
    /*EL título */
    
    .fruity .well {
    font-size: 22.8px;
    background: #0F6C7D;
    color: #FFFFFF;
    border: 1px solid #0F6C7D;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    padding: 7px 20px;
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: 0;
    text-align: left;
    width: 84.1%;
    padding-top: 10px;
}
    
    .question-container{
        margin-top: 2% !important;
        border-radius: 10px;
        /* IE10 Consumer Preview */
        background-image: -ms-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
        /* Mozilla Firefox */
        background-image: -moz-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
        /* Opera */
        background-image: -o-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
        /* Webkit (Safari/Chrome 10) */
        background-image: -webkit-gradient(radial, right bottom, 0, right bottom, 1012, color-stop(0, #CECECE), color-stop(0.5, #FFFFFF));
        /* Webkit (Chrome 11+) */
        background-image: -webkit-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
        /* W3C Markup, IE10 Release Preview */
        background-image: radial-gradient(circle farthest-corner at right bottom, #CECECE 0%, #FFFFFF 50%);
    }
    
    .fruity .btn-primary {
        color: #ffffff;
        background-color: #0F6C7D;
        border-color: #0F6C7D;
        text-transform: uppercase;
    }
    
    /* esta etiqueta es para bajar de posición el título y la barra de progreso */
    #limesurvey{
        margin-top: -8%;
    }
    
    /** alinear a la izquierda, para no meterlo a mano */
        .ls-answers tbody .answertext {
            text-align: left;
        }
        table.ls-answers tr {
            text-align: left;
        }
    /*-*/
    
    /* cambiamos el tipo de letra, pero también hay que añadir un link rel en el layout_global.twig */
    
    .font-noto{
        font-family: "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 18px;
        line-height: 1.42857143;
        color: #2c3e50;
    }
    
    /** el hover de los botones de idioma */
    
        .fruity .btn-primary:hover, .fruity .btn-primary:focus, .fruity .btn-primary.active:focus, .fruity .open .dropdown-toggle.btn-primary {
            color: #ffffff;
            background-color: #1a242f;
        }
        
        .fruity .btn-primary:active, .fruity .btn-primary.active, .fruity .open .dropdown-toggle.btn-primary {
        
            color: #ffffff;
            background-image: none;
            background-color: #798d8f;
        }
        
        .fruity a:visited {
            color: #0F6C7D;
            background-color: #798d8f;
            border-color: #AC3B85;
            text-transform: uppercase;
        }
    /*-*/
    
    /** cambiamos el botón 'anterior' */
    
        .btn-default{
            border-color: transparent;
        }
        
        .fruity .btn-default {
            background-color: #808080;
            border-color: transparent;
            color: #ffffff;
            text-transform: uppercase;
            float:left;
        }
        
        .fruity .btn-default:hover, .fruity .btn-default:focus, .fruity .open .dropdown-toggle.btn-default {
            color: #fff;
            background-color: #2b2b2b;
            border-color: #2b2b2b;
        }
    /*-*/
    
    /* El botón siguiente */
    
    .fruity .btn-primary:hover, .fruity .btn-primary:focus, .fruity .open .dropdown-toggle.btn-primary {
         color: #fff;
        background-color: #2b2b2b;
        border-color: #2b2b2b;
    }
    
    /** El botón opciones */
    
        .fruity .btn-info {
            color: #808080;
            background-color: #D7D6D7;
            border-color: #D7D6D7;
            text-transform: uppercase;
        }
        
        .fruity .btn-info:hover, .fruity .btn-info:focus, .fruity .btn-info:active, .fruity .btn-info.active, .fruity .open .dropdown-toggle.btn-info {
        
            color: #fff;
           background-color: #808080;
            border-color: #808080;
        
        }
    /*-*/
    
    /** los componentes del botón opciones */
    
        .cd_es{
            font-size: 13px;
        }
        
        .salir_es{
            font-size: 13px;
        }
    /*-*/
    
    /** Los botones de atrás y adelante */
    
        .atras-es{
            margin-left: 60%;
        }
        
        .atras-eu{
            margin-left: 56%;   
        }
        
        .atras-en{
            margin-left: 66%;   
             
        }
        
        .adelante-es{
            
        }
        
        .adelante-eu{
            
        }
        
        .adelante-en{
            
        }
    /*-*/
    
    /** personalizamos el navbar para que obtenga el aspecto del 2.X */
    
        .navbar-default .navbar-brand {
        	text-align: center;
        }
        
        .navbar-action-link {
        	margin-right: 5.2%;
        }
        
        .fruity .navbar {
        	background-color: transparent;
        	box-shadow: 0 3px 3px rgba(255, 255, 255, 0.1);
        	border-radius: 0 !important;
        	display: flex;
        }
    /*-*/
    
    /** modificamos las tablas para que tengan el aspecto del 2.X */
    
        .fruity .table-bordered {
        	border: 0px solid #dadada;
        	border-style: hidden;
        }
        
        table{
            border:0px solid black;
            border-collapse: collapse;
        }
        
        .table-bordered th, .table-bordered td {
          border-bottom: 1px solid #ddd;
          border: 0px solid #dadada;
        }
        .table-bordered{
            border: 0px solid #dadada;
        }
        
        table col[class*="col-"] {
            position: static;
            display: table-column;
            float: none;
            border-style: hidden;
        }
    /*-*/
    
    /* El Logo */
    
    .logo {
        margin-top: 2%;

    }
    div.navbar-brand:nth-child(2) {
        width: 100%;
    }
    div.navbar-brand:nth-child(1) {
        width: 100%;
    }
    .navbar-brand > img {
        display: block;
    }
    
    /* botón 'Descargar Informe' de la página de resultados */
    
    .completed-wrapper a {
        
        color: #ffffff;
        background-color: #0F6C7D;
        border-color: #0F6C7D;
        text-transform: uppercase;
        padding: 8px 27px;
        border-radius: 5px;
        text-decoration: none;
        float: right;
        margin-bottom: 1%;
        margin-right: -1.45%;
    }
    
    /* alinear el título de la página de resultados */
    
    .completed-wrapper{
        margin-top:8%;
    }
    
    /** ajustar los labels de: básico, intermedio, avanzado... */
    
        .table > thead > tr > th{
            padding: 0px;
        }
        
        /* dándole forma a los sliders respecto a las de la version 2.X */
        
        .fruity .slider-selection {
            background-image: none;
        }
        
        .fruity .tooltip-inner {
            color: #fff;
            background-color: transparent;
            padding: 0;
        }
        
        .slider .tooltip-inner {
            cursor: pointer;
            margin-top: 32.8px;
        }
        
        .fruity .tooltip.top .tooltip-arrow {
            border-top-color: #ae268a;
            display: none;
        }
        
        .fruity .slider-handle {
            background: black;
        }
        
        .slider.slider-horizontal {
            /*width: 245px;*/
            height: 0px;
        
        }
        
        .slider .tooltip-inner {
        
            cursor: pointer;
            margin-top: 22.8px;
        
        }
        
        .slider-handle {
            position: absolute;
            top: -10px;
            width: 20px;
            height: 20px;
            background-color: #337ab7;
            background-image: -webkit-linear-gradient(top,#337ab7 0,#2e6da4 100%);
            background-image: -o-linear-gradient(top,#337ab7 0,#2e6da4 100%);
            background-image: linear-gradient(to bottom,#337ab7 0,#2e6da4 100%);
            background-repeat: repeat-x;
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7',endColorstr='#ff2e6da4',GradientType=0);
            filter: none;
            -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);
            border: 0 solid transparent;
        }
        
        .col-sm-8 {
            width: 30%;
            float: right;
            margin-right: 1%;
        }
        
        .col-sm-4 {
            width: 33%;
        }
        
        .form-horizontal .control-label {
            padding-top: 0px;
            margin-bottom: 0;
            text-align: left;
            width:69%;
        }
        
        .fruity .question-item {
            padding-top: 0em;
        }
    /*-*/
        
    /* cambiamos el color de los enlaces */
    
    .fruity a {
       color: white;
    }
    
    /* cambiamos el color de los textos: "0 lo desconozco" */
    
    .fruity .text-info {
        color: #808080;
        font-size: 0.7em;
        margin-bottom: -2%;
        text-align:right;
    }
        
    /** ordenar la página 'DatosBásicos' */
        
        .ls-answers{
            padding-top: 15px;
            padding-bottom: 15px;
            margin-bottom: 0;
            width: 100%;
        }
        .form-control{
            width:50%;
        }
        
        /* los títulos en la página 'DatosBásicos' */
        
        .datosbasicos{
            color: #0F6C7D;
            font-size: 25px;
            font-weight: 400;
        }
    /*-*/
    
    /* el asterisco de obligatorio */
    
    .fruity .text-danger{
        color: #e74c3c;
        display: none;
    }
    
    /* el label '0' de los sliders' */
    .pull-left {
        margin-left: 1.4%;
        margin-top: -0.45%;
    }
    
    /* el logo */
    
    .logo-container > img {
        max-height: 75px;
        padding: 0;
        width: auto;
        float: left;
    }
    
    /** los títulos de las preguntas */
    
        .tituloPreg {
        
            font-weight: 400;
            font-size: 25px;
            color: #fff;
        }
        
        .tituloNum {
            font-size: 25px;
        }
    
    /*-*/
    
    /* El tema del icono de la pregunta */
    
    .ls-questionhelp::before {
    
        position: absolute;
        font-family: FontAwesome;
        font-size: inherit;
        line-height: inherit;
        height: 100%;
        display: none;
    
    }
    
    /* la ventana de los sliders, ajustándolos */
    
    .form-horizontal .form-group {
    
        margin-right: -15px;
        margin-left: -15px;
        line-height:1.2;
    }
    
    /* el fondo de las preguntas */
    
    .ls-even{
        background: transparent;
    }
    
    /* el espacio entre los textos */ 
    
    p {
        margin: 0 0 10px;
    }
    
    /* Descripción */
    
    .descripcion{
        font-size: 21px; 
        color: #7f7f7f;
        /*text-transform: lowercase;*/
    }
    
    /** imagenes de la encuesta */
    
        .barnetegi{
            width: 234px;
            float: left;
            height: 144px;
            margin-right: 15px;
        }
        .gunea{
            width: 234px;
            float: left;
            height: 144px;
            margin-right: 15px;
        }
        .txartela{
            float: left; 
            margin-right: 15px;
        }
        .enpresadig{
            width: 234px;
            float: left;
            height: 144px;
            margin-right: 20px;
        }
        .bait{
            margin-left:15%;
        }
    /*-*/

/*-----------------------------------*/

/**** CÓDIGO DE VERSIONES ANTERIORES */

    #surveynametitle {
        font-size: 4em;
    }
    
    #surveydescription, #surveynametitle, #welcome-container h1 {
        color: #2c3e50;
        text-align: center;
    }
    
    #surveydescription, .group-name {
        color: #2c3e50;
    }
    
    #main-row, #welcome-container {
        background-color: transparent;
    }
    
    .answertext {
        font-weight: normal;
    }
    
    .slider-handle {
      background: #AC3B85;   
    }
    #optionModal .modal-body {
      text-align: center;
    }
    .modal-body li {
        list-style: none;
        text-align: center;
        margin: 5px 2px;
        display: inline-block
    }
    .tokenmessage {
        padding: 30px;
    }
    
    #waitMessage p {
        margin: 10px 0;
    }
    
    .containerra{
      position: relative;
      height: 20em;
      width: 20em;
     
      margin-right: auto;
      margin-left: auto;
    }
    .scale{
      height: 10em;
      width: 10em;
      background-size: cover;
      position: absolute;
      overflow: hidden;
      opacity: 0.5;
      
    }
    #one {
      background-color: #3a84c4 ;
      -moz-border-radius: 10em 0 0 0;
      border-radius: 10em 0 0 0;
      left: 0;
      top: 0;
    }
    #two{
       background-color: #f6d51f;
      -moz-border-radius: 0 10em 0 0;
      border-radius: 0 10em 0 0;
      right: 0;
      top: 0;
    }
    #three{
      background-color: #5fa55a;
      -moz-border-radius: 0 0 10em 0;
      border-radius: 0 0 10em 0;
      bottom: 0;
      right: 0;
    }
    #four{
      background-color: #fa5457;
      -moz-border-radius: 0 0 0 10em;
      border-radius: 0 0 0 10em;
      bottom: 0;
      left: 0;
    }
    .scale:hover{
      transform: scale(1.1);
      z-index: 100;
      opacity: 1;
     
    }
    
    .testua{
    
        margin-top: 4.5em;
        margin-right: 2em;
        font-size: 1em;
        font-weight: bold;
        color: white;
        text-align: right;
    }
    
    .testua2{
    
        margin-top: 4.5em;
        margin-left: 2em;
        font-size: 1em;
        font-weight: bold;
        color: white;
    }
    
    .ize{
        background-color: darkgray;
        color: white;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 5em;
        padding-top: 2em;
        padding-bottom: 2em;
        text-align: center;
    }
    
    .ezk{
        margin-top: 0.5em;
      
    }
    
    .behe{
      margin-top: 6em;
      font-weight: bold;
      display: none;
    }
    
    .azkena{
      padding-top: 2em;
      text-align: center;
      background-color: lightblue;
      border: 1px solid black;
      padding-bottom: 2em;
    }
    
    .SE{
      font-weight: bold;
      transform: scale(1.1);
      z-index: 100;
      opacity: 1;
      display: block;
    }
    
    .SD{
      font-weight: bold;
      transform: scale(1.1);
      z-index: 100;
      opacity: 1;
      display: block;
    }
    
    .IE{
      font-weight: bold;
      transform: scale(1.1);
      z-index: 100;
      opacity: 1;
      display: block;
    }
    
    .ID{
      font-weight: bold;
      transform: scale(1.1);
      z-index: 100;
      opacity: 1;
      display: block;
    }
    
    @media only screen and (min-width: 991px) {
       .kolau{
            width:55.3333%!important;
        }
    
        .ezk{
            margin-left: 5em;
            margin-bottom: 4em;
        }
    }
    
    @media only screen and (min-width: 1200px) {
       .kolau{
            width:58.3333%!important;
        }
        
        .ezk{
            margin-left: 5em;
        }
    
    }
    
    @media only screen and (min-width: 615px) {
       .behe{
            margin-left: 5em;
            margin-right: 5em;
       }
    }
    
    @media only screen and (max-width: 515px) {
       .containerra{
            font-size: 0.7em;
       }
    }
    
    @media only screen and (max-width: 991px) {
          .ezk{
            margin-bottom: 4em;
            text-align: center;
        }
    }

/*------------------------------*/

/**** Botones del nav_bar */

    /* Los links del cambio de idioma */
    .fruity .nav .open > a {
        color: #fff;
        background-color: transparent;
    }
    
    /* este es la id/clase que coge todos los botones/links*/
    #langlist {
        float: right;
        padding-top: 15px;
        padding-bottom: 15px;
        display: flex;
        margin-right: 6.5%;
    }
    
    /** Aquí transformamos los links para que tengan aspecto de botón */
    
        #langlist a {
            margin: 0 2px;
            border-radius: 5px;
            border: none;
            border-color: currentcolor;
            height: 26px;
            width: 35px;
            font-size: 18px;
            padding: 4px 7.5px;
        }
        
        #langlist a:hover {
            color: #ffffff;
            background-color: #1a242f;
            border:none;
        }
        
        .fruity .navbar a.animate {
        
            text-decoration: none;
            border: none;
            background-color: #0F6C7D;
        
        }
        
        /* esta clase da un color grisaceo al botón que se ha activado la última vez */
        .fruity .navbar .colorchange {
            text-decoration: none;
            border: none;
            background-color: #808080;
        }
        
        .fruity .navbar a.animate::after {
        
            text-align: right;
            content: '';
            display: block;
            width: 0;
            height: 2px;
            background-color: transparent;
        }
        
        /** Los botones que no están activados */
            .btn-primary a {
                color: #ffffff;
                background-color: #1a242f;
                border-color: #161f29;
            }
            
            .btn-primary {
                color: rgb(255, 255, 255);
                background-color: rgb(123, 42, 95);
                text-transform: uppercase;
            }
        /*-*/
        
        .fruity .navbar .animate::after {
            text-align: right;
            content: '';
            display: inline;
            width: 0;
            height: 2px;
            background-color: #328637;
        }
    /*-*/
    
    input, button, select, textarea {
        font-family: inherit;
        font-size: 18px;
        line-height: inherit;
    }
    
    button, html input[type="button"], input[type="reset"], input[type="submit"] {
        -webkit-appearance: button;
        cursor: pointer;
    }
    
    button {
        overflow: visible;
    }

/*----------------------------------*/
    
/**** Página de resultados */

    /* Question Design */
    
    .group-description-container,
    .completion-description-container {
      margin: 20px 0;
      padding: 0;
    }
    .group-description-container .group-container {
      background: #0083C3;
      color: #FFFFFF;
      border: 1px solid #0083C3;
      border-top-left-radius: 10px;
      border-bottom-left-radius: 10px;
      padding: 10px 20px;
        font-size: 1.3em;
        font-weight: bold;
        text-transform: uppercase;
    }
    .completion-description-container .title-container {
        background: #0F6C7D;
      color: #FFFFFF;
      border: 1px solid #0F6C7D;
      border-radius: 10px;
      padding: 10px 20px;
        font-size: 1.3em;
        font-weight: bold;
        text-transform: uppercase;
    }
    div.completion-description-container div.title-container {  
      border-radius: 10px;
    }
    
    body div.row.survey-welcome {
        border: 1px solid #d7d6d7;
        border-radius: 10px;
    }
    
    /** esto es para darle el fondo degradado */
        body div.row .completion-container{
            margin-bottom: 1em;
            padding: 15px;
            border: 1px solid #d7d6d7;
            border-radius: 10px;
            /* IE10 Consumer Preview */ 
            background-image: -ms-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
            /* Mozilla Firefox */ 
            background-image: -moz-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* Opera */ 
          background-image: -o-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* Webkit (Safari/Chrome 10) */ 
          background-image: -webkit-gradient(radial, right bottom, 0, right bottom, 1012, color-stop(0, #CECECE), color-stop(0.5, #FFFFFF));
          /* Webkit (Chrome 11+) */ 
          background-image: -webkit-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* W3C Markup, IE10 Release Preview */ 
          background-image: radial-gradient(circle farthest-corner at right bottom, #CECECE 0%, #FFFFFF 50%);
        }
        
        body div.row .question-container,
        body div.row.survey-welcome {
            margin-bottom: 1em;
            border: 0px solid #d7d6d7;
            border-radius: 10px;
          /* IE10 Consumer Preview */
            background-image: -ms-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
            /* Mozilla Firefox */
          background-image: -moz-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* Opera */
          background-image: -o-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* Webkit (Safari/Chrome 10) */
          background-image: -webkit-gradient(radial, right bottom, 0, right bottom, 1012, color-stop(0, #CECECE), color-stop(0.5, #FFFFFF));
          /* Webkit (Chrome 11+) */
          background-image: -webkit-radial-gradient(right bottom, circle farthest-corner, #CECECE 0%, #FFFFFF 50%);
          /* W3C Markup, IE10 Release Preview */
          background-image: radial-gradient(circle farthest-corner at right bottom, #CECECE 0%, #FFFFFF 50%);
        }
    /*-*/
    
    body div.row.survey-welcome {
        margin-top: 1em;
    }
    
    .answer-container, .question-help-container
    {
        border-style: solid;
    }
    
    .answer-container
    {
        /*border-width: 0px 1px 0px 1px;*/
        border: none;
        border-style:hidden;
        padding-top: 0em;
        background-color: transparent;
        padding-bottom: 20px;
    }
    
    .question-help-container
    {
        border: none;
        padding: 0em 2em;
    }
    
    .final-page-container .col-left {
        padding-right: 10px;
    }
    .final-page-container .col-right {
        padding-left: 10px;
    }
    
    .purple {
        color: #AC3B85;
        margin: 5.5px 0 5.5px;
    }
    .green {
        color: #A5C11F;
        margin: 10px 0 0;
    }
    .greenblue {
        color: #0F6C7D;
        margin: 10px 0 0;
    }
    .grey {
        margin: -5px 0 11px;
        font-size: 0.9em;
        color: #808080;
    }
    #download-button {
        text-align: right;
        padding-bottom: 20px;
    }
    #download-button a {
      color: #ffffff;
      background-color: #6ba4b8;
      border-color: #6ba4b8;
    
      padding: 8px 27px;
      border-radius: 5px;
      text-decoration: none;
    }
    #download-button a:hover {
      background-color: #1a242f;
      border-color: #161f29;
    }

/*-----------------------*/

/**** Small helper classes, that are not shipped with bootstrap but fit in well*/
    
    .ls-label-question{
        padding-left: 5px;
        font-size: 18px;
        line-height: 1.2;
    }
    .ls-label-question a{
        color: #0F6C7D;
    }
    .ls-custom-padding{
        padding: 1px;
    }
    .ls-custom-padding.two{
        padding: 2px;
    }
    .ls-custom-padding.three{
        padding: 3px;
    }
    .ls-custom-padding.four{
        padding: 4px;
    }
    .ls-custom-padding.five{
        padding: 5px;
    }
    .ls-custom-padding.fifteen{
        padding: 15px;
    }
    .ls-custom-padding.eighteen{
        padding: 18px;
    }
    
    .ls-custom-margin{
        margin: 1px;
    }
    .ls-custom-margin.two{
        margin: 2px;
    }
    .ls-custom-margin.three{
        margin: 3px;
    }
    .ls-custom-margin.four{
        margin: 4px;
    }
    .ls-custom-margin.five{
        margin: 5px;
    }
    .ls-custom-margin.fifteen{
        margin: 15px;
    }
    .ls-custom-margin.eighteen{
        margin: 18px;
    }
    .ls-return{
        color: #328637;
    }

/*-----------------------------*/

/**** Header **/

    .question-title-container {
        /*color: #859e0b;*/
        color:#f17200;
        font-size: 1.2em;
        padding: 1em 1em 1em 0em;
        
    }
    .boilerplate .question-title-container {
        color: #000000;
        
    }
    
    .questionvalidcontainer {
        position: relative;
        font-size:0.8em;
        padding-bottom: 1em;
    }
    
    .questionvalidcontainer .text-danger{
        font-weight: bold;
    }
    
    .questionvalidcontainer .text-info{
        color: green;
        font-weight: bold;
    }

/*-----------------------*/

/**** Generic adjustments */

    /**
     * Navigator
     */
    
     #navigator-container {
         margin-top: -1em;
         padding-top: 0em;
         padding-bottom: 1em;
     }
     #navigator-container>div {
         padding: 0;
     }
     #navigator-container button#moveprevbtn {
         margin-right: 2px;
     }
    
     #main-col {
         margin-top: 0em;
     }
    
     .col-centered{
         float: none;
         margin: 0 auto;
     }
     
     .label-danger {
        white-space: normal;
    }
    
    #loadallbtn{
        white-space: normal;
    }
    
    .label-col {
        min-width: 10%;
        position: relative;
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .responsive-content
    {
        display: block;
        position: relative;
        float: left;
        width: 100%;
    }
    
    /* Don't wrap "No answer" for 10-point array */
    .table-in-qanda-2 thead th {
        white-space: nowrap;
    }
    
    
    /**
    * slider
    **/
    .numeric-multi ul.slider.computed {
      width: 22em;
    }
    
    .numeric-multi ul.computed li label,.numeric-multi ul.slider.computed li label
      {
      padding-right: 0%;
    }
    
    .numeric-multi .multinum-slider {
      width: auto;
      float: left;
      margin-top: 1.5em;
      margin-bottom: 0.2em;
    }
    
    /** UI Slider **/
    .numeric-multi .slider-label {
      display: table-cell;
      width: auto !important;
      padding: 0 1em 0.2em 0;
      margin-top: 1.3em;
      vertical-align: middle;
    }
    
    .numeric-multi .ui-slider-handle {
        top: -0.35em;
    }
    
    .ui-slider-1 {
      width: 200px;
      height: 9px;
      margin-bottom: 20px;
    }
    
    .ui-slider-2 {
      width: 200px;
      height: 23px;
      position: relative;
      background-image: url(../../images/slider-bg-2.png);
      background-repeat: no-repeat;
      background-position: center center;
    }
    
    .slider_callout {
      height: 20px;
      width: 100px;
      overflow: hidden;
      position: absolute;
      top: -20px;
      margin-left: -3px;
      color: #284a6e;
      font-size: 90%;
      font-weight: bold;
      text-align: left;
    }
    
    .slider_showmin {
      float: left;
      width: 50px;
      margin: 15px 0 0 -0.3em;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 0.7em;
      font-weight: normal;
      text-align: left;
    }
    
    .slider_showmax {
      float: right;
      width: 50px;
      margin: 15px -0.3em 0 0;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 0.7em;
      font-weight: normal;
      text-align: right;
    }
    
    .slider_lefttext {
      display: table-cell;
      padding-top: 1.5em;
      padding-right: 11px;
      padding-bottom: 3px;
      vertical-align: top;
      text-align: right;
      font-size: 0.9em;
    }
    
    .slider_righttext {
      display: table-cell;
      padding-top: 1.5em;
      padding-left: 11px;
      padding-bottom: 3px;
      vertical-align: top;
      font-size: 0.9em;
    }
    
    .withslider {
        margin-bottom: 0px;
    }
    
    #indexcontainer {
        display : none;
    }
    
    .radio-list li{
        display: block;
        clear: both;
    }
    
    .question-item .other-label{
        margin: 0px;
        padding: 0px;
    }

/*-----------------------------------*/


/**** Cambia los labels Seguridad... y ajusta las tablas. */

    /**
     * On big screen only, iPad and up
     */
     
    @media only screen and (min-width: 768px) {
    
        .table-dual-scale .separator {
            width: 6%;
        }
    
        table > tbody > tr > .ddsuffix {
            padding-left: 1em;
            vertical-align: middle;
        }
    }
    
    /**
     * No more tables
     * OBS: Media specific CSS must be last in this file.
     * iPad has width 768px (according to Chrome dev tool)
     * Google Nexus 10 has width 800px.
     * (Both in portrait mode.)
     * We don't have to collapse tables on pads.
     */
     
    @media only screen and (max-width: 801px) {
    
        /*
            No more table transformation applies when screen is under 801px (for a few exotic tablet screens, see #11016),
            whereas visible-xs-block respect bootstrap standards (767px)
            If too many bugs of this kind appears in the future, we should just refuse to support weird exotic tablet screens.
            We should repsect standards, we should not try to fit to non standards devices.
        */
        
        .visible-xs-block{
            display: block;
        }
        .visible-xs-inline-block{
            display: inline-block;
        }
    
        /* Remove margin */
        .row {
            margin: 0;
            padding: 0;
        }
    
        /* Add some margin for multiple short text */
        .form-group.row {
            margin-bottom: 15px;
        }
    
        /* Force table to not be like tables anymore */
        .no-more-tables table,
        .no-more-tables thead,
        .no-more-tables tbody,
        .no-more-tables th,
        .no-more-tables td {
            display: block;
        }
    
        .no-more-tables tbody th,
        .no-more-tables tbody td,
        .no-more-tables tbody tr {
            width: 100%;
        }
    
        .no-more-tables tr {
            display: inline-block;
        }
    
        .no-more-tables tbody {
            padding: 0 1em 0 1em;
        }
    
        /* Hide table headers (but not display: none;, for accessibility) */
        .no-more-tables thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }
    
        .no-more-tables tr,
        .array-by-columns-div .radio-list {
            border: 1px solid #ccc;
            padding: 1em;
        }
    
        /* Line header ; color is h4 color */
        .no-more-tables tr th,
        .array-by-columns-div .answertext {
            font-size: 1.1em;
            text-align: center;
            color: #317eac;
        }
    
        .no-more-tables tr th {
            text-align: left;
        }
    
        .array-by-columns-div .answertext {
            padding: 8px;
            padding-left: 0;
            text-align: left;
            font-weight: bold;
        }
    
        .array-by-columns-div .radio-item {
            padding-bottom: 8px;
        }
    
        .no-more-tables .checkbox  {
            position: relative;
            top: 6px;
        }
    
        .no-more-tables td {
            /* Behave  like a "row" */
            min-height: 2em;
            border: none;
            position: relative;
            /*padding-left: 95%;*/
            padding-bottom: 1em;
            white-space: normal;
            text-align:left ;
        }
    
        .array-multi-flexi  .no-more-tables td, .no-more-tables-array-dual-dropdown-layout  td, .no-more-tables-array-multi-text td{
            padding-left:1.5em;
        }
    
        .no-more-tables td:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 6px;
            left: 6px;
            width: 45%;
            padding-right: 10px;
            white-space: nowrap;
            text-align:left;
            font-weight: bold;
        }
        /* text overflows, ellipsis and hyphens */
        .navbar-brand {
            white-space:nowrap;
            text-overflow: ellipsis;
            text-overflow: "…";
        }
    }

/*--------------------------------*/

/**** Ajustes visuales que vienen por defecto */

    /* On iPad etc only */
    @media only screen and (max-width: 800px) and (min-width: 768px) {
        .five-point-choice .noanswer-item {
            padding: 0;
        }
    
    
    }
    
    @media only screen and (max-width: 1000px) and (min-width: 800px) {
        .table-10-point-array .answer-item.text-center
        {
            padding-left: 10px;
        }
    
        .table-10-point-array  > thead > tr > th
        {
            text-align: left;
            padding-right: 0px;
        }
    }
    
    
    /**
     * Display adjust, question type by question type
     */
    
    .radio input[type="radio"]:disabled + label
    {
        opacity: 0.25;
    }
    
    
    /* center the label text in no more table mode */
    .label-text{
        margin-top: -24px;
        margin-left: 20px;
    }
    
    /* ...except for dual-scale and array-by-column */
    .table-dual-scale .label-text, .array-by-columns-div .label-text {
        margin-top: 0px;
        margin-left: 0px;
    }
    
    .label-clickable:hover
    {
        cursor: pointer;
    }
    
    .table > tbody > tr > th
    {
        vertical-align: middle;
    }
    
    table.numbers-only th, table.numbers-only input {
        text-align: right;
    }
    
    .othertext-label-checkox-container {
        padding-top: 5px;
        margin-right: 5px;
    }
    
    .multiple-choice-with-comment.table, .table-multi-num.table{
        table-layout: auto;
        width: initial;
    }
     .multiple-choice-with-comment.table > tbody > tr > td {
         padding-left: 18px;
         vertical-align: middle;
     }
    
     /* alignment for small screens*/
     .multiple-choice-with-comment.table > tbody > tr > .comment-container {
         padding-left: 14px;
     }
    .checkbox input[type="checkbox"] {
        margin-left: 0px;
    }
    
    .short-free-text .prefix, .short-free-text .suffix,.geoloc-item .search-icon, .geoloc-item .checkbox  {
        padding-top: 10px;
    }
    
    .geoname_search {
        margin-bottom: 10px;
    }

/*------------------------------------*/

/**** Retoques que vienen por defecto */
    /*
    Label the data
    */
    /*.no-more-tables td:before { content: attr(data-title); }*/

    .no-more-tables-10-point td {
    }

    /* Don't wrap "No answer" on two lines */
    .no-more-tables-10-point label {
        white-space: nowrap;
    }

    .no-more-tables-10-point td:before, .no-more-tables-5-point td:before {
        /* Now like a table header */
        position: relative;
        left: 2px;
        /* Top/left values mimic padding */
    }

    /* When tables are collapsed, remove margin top so the labels look centered */
    input[type="radio"],
    .radio input[type="radio"],
    .radio-inline input[type="radio"] {
      margin-top: 4px;
    }

    .five-point-choice .col-xs-12 {
        padding-bottom: 8px;  /* For 5-point-choice; TODO: Should look like 5-point-array? */
    }

    /* Hide the first column in array-by-column */
    .array-by-columns-table tr > *:nth-child(1) {
        display: none;
    }

    /* Need some more space on phone */
    .array-multi-flexi .answertext {
        padding-bottom: 0.5em;
    }

    .array-multi-flexi .answer-item label {
        padding-bottom: 0.5em;
    }

    /* On phone, left and right slider text is above and below slider */
    .slider-left-span {
        text-align: left;
    }

    /* As above, collapse prefix/suffix to above/below input */
    .prefix-text-right {
        text-align: left;
    }

    .question.subquestion-list.questions-list tr th.answertext {
        text-align: left;
    }

    /* Used for date-picker icon within input */
    .form-control-feedback {
        right: 0.5em;
    }

    /* Increase-same-decrease array */
    .row-inc-same-dec .radio-item,
    .thead-inc-same-dec th {
        text-align: left;
    }

    .table-multi-num.no-more-tables tr {
        border: none;
    }

    /* Used for <td></td> in multiple-numeric */
    .hide-on-small-screen {
        display: none;
    }

    #langchanger-label {
        padding-top: 11px;
    }

    .col-xs-12.question-container {
        padding-right: 0;
        padding-left: 0;
    }

/* --------------------------------- */

/**** Text overflows, ellipsis and hyphens */

    .navbar-brand {
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    #outerframeContainer {
        min-height: 100%;
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto;
    }
    
    .xdebug-var-dump {
        z-index: 10000;
        position: relative;
        top: 10px;
    }
    
    .list-unstyled.radio-list {
        padding-left: 15px;
    }
    
    .yes-no .btn-group label {
      white-space:normal;
    }
    
    
    .multipleco-other-topic {
        max-width: 150px;
    }
    
    .privacy-header{
        font-weight: bold;
        font-style: italic;
    }
    
    /* Check javascript */
    #checkjavascript {
        margin-top: 100px;
        z-index: 999;
        right: 100px;
        position: fixed;
        width: 300px;
    }
    
    /*label font weight*/
    label {
        font-weight: normal;
    }
    
    #surveys-list-container
    {
        margin-top: 50px;
    }
    
    /** Divider for Bootstrap **/
    
        .horizontal-divider.top{
          border-top: 3px solid #323232;
        }
        .horizontal-divider.bottom{
          border-bottom: 3px solid #323232;
        }
        
        .vertical-divider.left {
          border-left: 3px solid #323232;
        }
        .vertical-divider.right {
          border-right: 3px solid #323232;
        }
        @media (max-width: 800px){
            .vertical-divider.left {
            border: none;
            }
            .vertical-divider.right {
            border: none;
            }
        }
    /*-*/

/*----------------------*/

/**** For em-type */

    /* Esta etiqueta strong era necesaria en la versión 2.X, pero ya no es necesaria */
    
     /*.strong
     {
         font-weight: bold;
         display: inline-block;
         padding: 0.2em;
     }*/
    
     .hide-tip
     {
         display: none;
     }
    
    /**
     * Surveys list
     */
    .surveys-list {
        margin-top: 1em;
        list-style: none;
    }
    .surveys-list li {
        padding: 0.5em;
    }
    .surveys-list li a {
        margin-left: 0.5em;
    }
    
    #surveys-list-jumbotron {
        text-align: center;
    }
    
    #outerframeContainer {
        height: 100%;
        /*margin-top: 1.5%;*/
    }
    
    #surveyListFooter {
        width: 100%;
        text-align: center;
        margin-bottom: 0;
        padding-bottom: 0;
        margin-top: 10px;
    }
    
    #surveyListFooter div{
    
    }
    
    html, body {
        height: 100%;
    }
    
    /**
     * Gender buttons
    */ 
    
    /* Not selected */
    .gender-button button{
        box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.16), 2px 2px 2px 0 rgba(0, 0, 0, 0.12);
        margin-left: 1em;
    }
    
    /* selected */
    .gender-button .btn:focus {
        box-shadow: none;
    }
    
    .gender-button .btn:focus .gender-text{
        text-decoration: underline;
    }
    
    /* General */
    .gender-button .btn span {
        display: block;
    }
    
    html body .navbar.navbar-default.navbar-fixed-top {
        z-index: 2000;
    }
    
    .gender-button .gender-icon {
        font-size: 2em;
    }
    
    .navbar-brand {
        height: auto;
    }

/*----------------------------- */

/**** Adaptación a dispositivos móviles */

    /* mostrar el logo en dispositivos móviles */
    
    .logo-container.hidden-xs {
        display: block !important;
    }
    
    /* Cambios genéricos a todos los dispositivos móviles */
    
    @media only screen and (max-width: 500px) {
        
        /**** poniendo los sliders debajo de la pregunta */
        
                .form-horizontal .control-label {
                width: 100%;
            }
            
            .col-sm-8 {
                width: 100%;
            }
            
            .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
                padding-right: 6px;
                padding-left: 6px;
            }
            
            .slider.slider-horizontal {
                width: 80%;
                margin-left: 9%;
            }
            
            .pull-left {
                margin-left: 2.4%;
                margin-top: -0.45%;
            }
            
            .slider.slider-horizontal {
                width: 80%;
            }
            
            .slider-list div.pull-right {
                margin-right: 8%;
            }
            
            .slider-list .pull-left {
                position: absolute;
                left: 0;
                top: 0;
            }
        /*-------------------------------------*/
        
        /* quitamos la descripción en los móviles */
        .descripcion{
            /*display: none;*/
        }
        /* reducimos el tamaño de los números de las preguntad */
        .tituloNum {
            font-size: 22px;
        }
        .enpresadig{
            width: 234px;
            float: left;
            height: 144px;
            margin-right: 85px;
        }
    }

    
    /* LOS CAMBIOS A TODOS LOS DISPOSITIVOS, MENOS LOS DE ORDENADOR */ 
    @media only screen and (max-width: 1024px){
        
        .ls-heading{
            display: none !important;
        }
        
        .dir-ltr .radio-item .ls-label-xs-visibility, .dir-ltr .checkbox-item .ls-label-xs-visibility {
            left: auto;
            margin-left: 0;
        }
        
        .radio-item .ls-label-xs-visibility, .checkbox-item .ls-label-xs-visibility {
            display: inline-block;
            position: relative;
            overflow: hidden;
            width: auto;
            height: auto;
            line-height: 21px;
            text-indent: 21px;
        }
        
        table.ls-answers tr {
            border: none;
        }
        .fruity .table-bordered > tbody > tr > th {
            border: none;
            width: 100%;
        }
        .fruity .table-bordered > tbody > tr > td {
            border: none;
        }
        table.ls-answers, table.ls-answers tbody, table.ls-answers th, table.ls-answers td, table.ls-answers tr {
            display: inline-block;
        }
        table.ls-answers .ls-label-xs-visibility {
            display: inline-block;
            position: relative;
        }
        .dir-ltr table.ls-answers .ls-label-xs-visibility {
            left: -35px;
        }
        .dir-ltr .ls-answers td.radio-item{
            padding-left: 80px;
            padding-right: 4px;
        }
        label {
            margin-bottom: 15px;
        }
        /** quitando hover */
            .ls-answers > tbody > tr.ls-even:hover {
                background-color: transparent;
            }
            .fruity .table-hover > tbody > tr:hover > th {
                background-color: transparent;
            }
            .fruity .table-hover > tbody > tr:hover > td {
                background-color: transparent;
            }
        /*-*/
        
        /* bajamos el interlinado de los radio-buttons */
        li.radio-item, li.checkbox-item, li.radio-text-item, li.checkbox-text-item {
            margin-bottom: 0em;
        }
        
        /* aplicamos los atributos del encabezado de 'Si - No' a las demás preguntas */
        .radio-item label, .checkbox-item label {
            font-size: 1.1em;
            color: #317eac;
        }
        
        /* los separamos para que quede bien estructurado */
        .radio-item {
            padding-left: 40px;
        }
        
        /* subimos el interlineado en los sliders */
        .form-horizontal .form-group {
            margin-right: 0px;
            margin-left: 0px;
            line-height: 1.2;
        }
        
        /* damos el color negro y el tamaño de fuente a los radio-buttons, 'Si' y 'No' */
        table.ls-answers .radio-item .ls-label-xs-visibility, table.ls-answers .checkbox-item .ls-label-xs-visibility {
            color: black;
            font-size: 15px;
        }
        
        table.ls-answers tr {
            margin-bottom: -1em;
        }
        
        /* reducimos la anchura de los números de las preguntas */
        .tituloPreg, .tituloNum {
            font-weight: 400;
        }
        
    }

/*------------------------------------ */

/**** Footer */

    #surveyListFooter {
        width: 100%;
        text-align: center;
        margin-bottom: 0;
        padding-bottom: 0;
        margin-top: 10px;
    }
    
    .file-upload-modal-footer {
        margin-top: 0;
    }
    
    #footer {
      background: #808080;
      -webkit-border-top-left-radius: 10px;
      -webkit-border-top-right-radius: 10px;
      -moz-border-radius-topleft: 10px;
      -moz-border-radius-topright: 10px;
      border-top-left-radius: 10px;
      border-top-right-radius: 10px;
      padding: 20px 0 0;
      margin-bottom: 0%;
    }
    
    #footer p{
      color: #ffffff;
      margin: 0;
      margin-top: -0.5%;
      margin-bottom: 1%;
    }
    #footer p a{
      color: #ffffff;
    }
/*---------------------------*/

/**** Añadidos puntuales */

    /* quitar alerta 'Encuesta no activa' */
    
    .fruity .alert-warning {
        display:none;
    }
    
    /* Escondemos los resultados */
    
    .numeric{
        display:none;
    }
    
    /* Escondemos las ecuaciones */
    
    .equation{
        display:none;
    }
    
    .tituloPerfil{
        display: block;
    }
    
    .grafico-final {
        margin: 10px 0 0;
    }
    
    /* Tabla SecciónPersonas3 */
    
        .fondoSeccionPersonas3{
        	background:rgba(13,108,126);
        }
    	.contenedorImagenes{
        	text-align: center;
        	width: 100%;
        	padding-bottom: 5%;
        	padding-top: 5%;
        }
        .imagenesGrandesProceso{
        	height: 200px;
        	width: 100%;
        }
        .imagenesGrandesProcesoDiv{
        	background-repeat: no-repeat;
        	background-size: 100% auto;
        	height: 200px;
        	width: 100%;
        }
        .sinPaddingLateral{
        	padding-right: 0px !important;
        	padding-left: 0px !important; 
        }
        .conPaddingLateral{
        	padding-right: 20px !important;
        	padding-left: 20px !important; 
        	padding-top: 10px !important;
        
        }
        .conPaddingLateral h1{
        	font-family: 'Oswald', sans-serif !important;
        }
        .conPaddingLateral ul{
        	padding-left: 15px;
        }
        .lineaDivisora {
            margin: 0px 5px 40px !important;
        
        }
        .imagenesGrandesProceso{
        	height: 200px;
        	width: 100%;
        }
        .ColorBlanco{
        	color: #fff !important;
        }
        .flex-row{
            display: flex;
            flex-wrap: wrap;
        }
        .margin-sin-derecha{
            margin-right: 0px !important;
        }
        .margin-sin-izquierda{
            margin-left: 0px !important;
        }
        .col{
            -ms-flex-preferred-size: 0;
            flex-basis: 0;
            -ms-flex-positive: 1;
            flex-grow: 1;
            min-width: 0;
            max-width: 100%;
        }
        h1.ColorBlanco, div.row > h1{
            font-size: 2.5rem;
        }
        div.row > h1{
            font-family: 'Oswald', sans-serif !important;
            line-height: 1.2;
            margin: 0 !important;
        }
        p.ColorBlanco > a{
            color: #fff;
        }
    /*------*/
/*-----------------------------------*/

/*********** CAMBIOS LUIS **********/
.slider-track{
    background-image: linear-gradient(to left, #284908, #284908 10%, #76da14 100%, #76da14 10%) !important;
}

.question-title-container {
        background-color: #0F6C7D;
        color: #fff;
        border-start-start-radius: 25px 25px;
        border-start-end-radius: 25px 25px;
        padding: 0.5em;
        margin-bottom: 0.5em;
    }
    .question-container {
        background-color: transparent;
        border: 1px solid;
        box-shadow: none;
        border-bottom-left-radius: 25px 25px;
        border-bottom-right-radius: 25px 25px;
        border-top-left-radius: 28px 28px;
        border-top-right-radius: 28px 28px;
    }
    .slider-horizontal .slider-max-block {
      position: absolute;
      top: -3px;
      right: -7px;
    }
    .slider-horizontal .slider-min-block {
      position: absolute;
      left: -10px;
      top: -3px;
    }


/******************
    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
*/