html, body 
{
    background: none repeat scroll 0 0;
    margin:0;
    padding:0;  
    
    min-height: 100%;
    /*height: 100% !important; M.Carmen 16/07/2014*/
}

.block-with-text {
  overflow: hidden;
  position: relative;
  line-height: 1.2em;
  max-height: 3.6em;
  text-align: justify;
  margin-right: -1em;
  padding-right: 1em;
}
.block-with-text:before {
  content: '...';
  position: absolute;
  right: 0;
  bottom: 0;
}
.block-with-text:after {
  content: '';
  position: absolute;
  right: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}



input[type="button"]:hover:not([disabled]),
input[type="submit"]:hover:not([disabled]),
input[type="reset"]:hover:not([disabled]),
input[type="button"]:active:not([disabled]),
input[type="submit"]:active:not([disabled]),
input[type="reset"]:active:not([disabled])
{
    filter: brightness(90%);
}

input[type="button"]:disabled,
input[type="submit"]:disabled,
input[type="reset"]:disabled,
.btn.disabled,
.btn[disabled]
{
    cursor: default;
    opacity: 0.7; /* iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655 */
}




input[type="button"], input[type="submit"], input[type="reset"], button, .button, a.button, a.button:hover
{

    border: 0px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

input::-moz-focus-inner /*Remove button padding in FF*/
{ 
    border: 0px;
    padding: 0px;
}

/**/
.input-inc-dec
{
    vertical-align: middle;
}
.input-inc-dec input
{
    vertical-align: middle;
}

.input-inc-dec-txtcontainer
{
    display: inline;
}
input[type="button"].input-inc-dec-btn, input[type="submit"].input-inc-dec-btn, .input-inc-dec-btn, .input-mas, .input-menos
{
    font-weight:bold; 
    font-size:1em; 
    padding:3px; 
    background:#FBFBFB; 
    border: 1px solid #CCC; 
    width: 20px;
    min-width: 17px;
    max-width: 20px; 
    height:28px; 
    cursor:pointer
}
input[type="text"].input-inc-dec-txt, .input-inc-dec-txt
{
    display: inline;
    width: 50px;
    min-width: 40px;    
    max-width: 50px;
    height:20px; 
    font-size:1em; 
    padding:3px; 
    border: 1px solid #CCC; 
    text-align:center; 
    display:inline
}
.input-valor
{
}



button.comparacion-boton
{
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
}



table, .tabla
{
    display: table;
    border-collapse:collapse;
}

tr, .tabla-fila
{
    display: table-row;
}

td, .tabla-celda
{
    display: table-cell;
}
.tabla-celda
{
    vertical-align: middle;
}

table, td, th, .tabla-celda
{
    border:1px solid Black;
    padding:3px;
}

a img { border: 0px }


.parrafo
{
    white-space: pre-wrap;
}

#body-cabecera
{
    height:150px;
    margin:auto;
    /*background-size: @repetirBanner 150px;*/
    /*overflow:hidden;*/
}

#content
{
    /*
    M.Carmen 21/07/2014
    min-height: 100%;
    height: 100% !important;
    height: 100%;
    margin: 0 auto -4em;
    */
    margin: 0 auto 0 auto;
}

#body
{
    min-height: 100%;
    height: 100% !important;
    height: 100%;
    margin: 0 auto -4em;
}

#contenido  
{
    float:left; 
    text-align:center; 
    width:100%;
    height: inherit;
}

#body-contenido
{
    clear:both;
    margin:auto;
    display:block; 
    text-align:left;
    background:#FFF;    
    height: inherit;
}



/*==================================================
 * PIE
 * ===============================================*/
#body-pie 
{ 
    clear:both; 
    text-align:center; 
    height:6em; 
    margin:auto; 
    overflow:hidden; 
    position:relative; 
}
#body-pie a 
{ 
    margin:2px; 
    text-decoration:none; 
    cursor:pointer 
}
#body-pie a:hover { text-decoration:underline; }
.body-pie-div div { width:33.3%; float:left; text-align:center }
.body-pie-div ul { list-style:none; font-size:11px;text-align:left; display:inline-block }




/*==================================================
 * COLUMNA LATERAL
 * ===============================================*/
.colum-2 
{
    width:20%; 
    overflow:hidden; 
    
    /*
    M.Carmen 21/07/2014
    float:left;
    */
    display: inline-block;
    vertical-align: top;
}

.colum-2 .item
{
    /*float: none !important;*/
}



/*==================================================
 * ERROR
 * ===============================================*/
#body-error { min-height: 100%; height: 100% !important; height: 100%; margin: 0 auto -4em; width: 100%; min-height: 600px; position:relative; }
.img-error { position:absolute; right:15px; bottom:25%; z-index:100; width:10% }
.logo-error { margin:25px auto; max-height:80% }
.cabecera-error { float:left; width:100%; text-align:center; height:35%; overflow:hidden; }
.cuerpo-error { float:left; width:100%; text-align:center; height:25%; position:relative; }
.cuerpo-error-div { width:100%; float:left; vertical-align:middle; position:absolute; top:10% }
.cuerpo-error-div h1 { margin:25px 0px 0px 0px; width:100%;  }
.cuerpo-error-div h2 { margin:25px auto; width:100%;  }
.pie-error { float:left; width:100%; position:relative; height:40%; }
.pie-error-div { width:33%; float:left; margin-top:50px;  }
.pie-error-caja-iconos { width:75%; margin:75px auto; text-align:center; overflow:auto }
.pie-error-span { position:absolute; width:100%; left:0; float:left; font-size:0.8em; bottom:10px; text-align:center }









/*==================================================
 * efecto
 * ===============================================*/
.sombreado
{
    -webkit-box-shadow: 0px 3px 2px -2px black;
       -moz-box-shadow: 0px 3px 2px -2px black;
            box-shadow: 0px 3px 2px -2px black;
}

.caja-sombreada
{
    -webkit-box-shadow: 0px 0px 15px black;
       -moz-box-shadow: 0px 0px 15px black;
            box-shadow: 0px 0px 15px black;
}

/*==================================================
 * Effect 1
 * ===============================================*/
.effect1
{
	-webkit-box-shadow: 0 8px 5px -5px #777;
	   -moz-box-shadow: 0 8px 5px -5px #777;
	        box-shadow: 0 8px 5px -5px #777;
}
 
 
/*==================================================
 * Effect 2
 * ===============================================*/
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.effect2:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

/*==================================================
 * Effect 6
 * ===============================================*/
.effect6
{
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect6:before, .effect6:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}

.truncate 
{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.titulo-h2
{
    float:left; 
    margin-bottom:0px;
}

.texto-error { color: red; font-size:0.8em; }



/*------------------------------------------------------------------------------------------------------------------------------------------------------------
     -CABECERA
*-----------------------------------------------*/
.cabecera-logo
{
    height:150px;
    margin:auto;
    /*overflow:hidden;*/
    /*padding-bottom:5px;*/
    position:relative;
}

#logotipo { width:auto; max-width:30%; height: auto; max-height:150px; float:left; }
#cabecera-texto { float:right; margin-right:5px; max-width:65%; max-height:100%; text-align:right }
.separdor-items  
{
    color:#CCC; 
    margin-right:14px;
    
    /*M.Carmen 21/07/2014*/
    /*float:right; */
    margin-left:7px;
    margin-right:14px;
    display: inline;
}


#banner 
{
    width:auto;
    height: auto;
    float:right;
}





/*CONTINUAR POR AQUI */
.btnCarritoDetalle input[type=submit] 
{
    /*padding:5px 15px; background:#ccc; border:0 none;
    cursor:pointer;
    -webkit-border-radius: 5px;
    border-radius: 5px;*/
    float:right;
    margin-top:10px;
    /*font-size: 0.8em;*/
    width:98px;
}

/*Necesario ponerlo aqui porque en la compra avanzada la regla anterior '.btnCarritoDetalle...' tiene mas prioridad que esta y se descuadran los botones*/
input[type="button"].input-inc-dec-btn, input[type="submit"].input-inc-dec-btn, .input-inc-dec-btn, .input-mas, .input-menos
{
    float: inherit;
    margin-top: inherit;
    width: 20px;
}





/**
 * Formulario para añadir al carrito 
 **/

.btnCarritoDetalle{

}
.btnCarritoDetalle .seccion-cantidadfv label{
    width: 26%;
}
.btnCarritoDetalle .seccion-cantidadfv .subseccion-cantidad{
    width: 32%;
    display: block;
    float: right;
    text-align: right;
}

.btnCarritoDetalle .seccion-cantidadfv .subseccion-fv{
    max-width: 50%; 
    margin-right: 10px;
    float: right; 
    display: inline; 
}

.btnCarritoDetalle .seccion-cantidadfv .subseccion-cantidad+.subseccion-fv{
    width: 38%;
}




form .add-carrito-form-modal{
    display: none;
}

.add-carrito-form-modal .seccion-cantidadfv{

}

.add-carrito-form-modal .seccion-cantidadfv .subseccion-fv{
    margin-right: 0;
    max-width: initial;
    width: 100%;
    float: right; 
    display: inline; 
}

.add-carrito-form-modal .seccion-cantidadfv label+input+.subseccion-fv{
    width: 60%;
}
.add-carrito-form-modal .seccion-cantidadfv .subseccion-cantidad+.subseccion-fv{
    max-width: 50%; 
    margin-right: 10px;
}


.btnCarritoDetalle .seccion-cantidadfv .subseccion-fv select,
.add-carrito-form-modal .seccion-cantidadfv .subseccion-fv select{
    margin-right: 0;
    margin-left: 0;
}
.add-carrito-form-modal .seccion-cantidadfv .subseccion-cantidad{
    display: none;
}





/** ---------------------------------------------------------------------------------------
    ---------------------------------------------------------------------------------------
    TEXTOS LEGALES
    ---------------------------------------------------------------------------------------
    ---------------------------------------------------------------------------------------*/

    .texto-legal {
        margin: 50px 0;
        padding: 0 48px;
        font-family: Helvetica,sans-serif;
        font-size: 0.8em;
        line-height: 1.5em;
        text-align: justify;
    }

    .texto-legal h1 {
        text-align:center
    }

    .texto-legal h2 {
        margin-top: 48px;
        text-transform: uppercase;
    }

    .texto-legal h3 {
        margin-top: 30px;
    }

    .texto-legal p {
        text-indent: 20px;
    }

    .texto-legal ul {
    }

    .texto-legal ul li {
    }

    .texto-legal dt{
        font-weight: bold;
        text-indent: 20px;
    }
    .texto-legal dd {
        text-indent: 20px;
    }
    .texto-legal dd + dt {
        margin-top: 2em;
    }

    .span_id_nombre_web {
        font-weight: bold;
        text-transform: uppercase;
    }