* {
	margin:0;
	padding:0;
}

body {
	margin:8px;
	text-align:center;
	font-family:Arial;
	background: url(imagenes/fondo1.gif) 50%;
}

.presentacion
{
    background:Black;
}

th 
{
    text-align:right;
    vertical-align:top;
    padding:0 5px;
}

#molde {
	text-align:left;
	width:760px;
	background-color:#FDFDFD;
	border:1px solid rgb(217,217,217);
	padding:10px;
	position:relative;
}

#cabecera {
	border:1px solid red;
    background:rgb(255,130,20) url(imagenes/fondomenu.gif) repeat-y;
    height:277px;
    height:293px;
    margin-bottom:4px;
    position:relative;
}

#imagen
{
    float:left;
    text-align:center;
    margin-left:8px;
    width:210px;
}

#logo
{
    background:transparent url(imagenes/logo.gif) no-repeat;
    height:39px;
    width:211px;
    position:relative;
    top:-1px;
    border-top:1px solid rgb(200,180,180);
}
#logo2
{
    background-color:rgb(255,228,192);
    height:134px;
    width:180px;
    margin:6px 0;
    padding:10px 10px 0 10px;
    position:relative;
}

#logo2 h5
{
    color:rgb(77,56,14);
    text-transform:uppercase;
    text-align:right;
    font-size:11px;
    border-bottom:2px solid rgb(77,56,14);
    margin-bottom:10px;
    width:70px;
}

#seleccion
{
    text-align:left;
    background:transparent url(imagenes/menu.gif) no-repeat;
    width:211px;
    height:96px;
    position:relative;
    bottom:-1px;
    border-bottom:1px solid rgb(180,80,80);    
}

#seleccion a
{
    color:rgb(77,56,14);
    text-decoration:none;
    font-size:13px;
    font-weight:bold;
    display:block;
    width:150px;
    text-transform:capitalize;
    border-bottom:2px dotted white;
    margin:6px 0 0 20px;
    padding-left:20px;
}
#seleccion a:hover 
{
    color:#ffffff;
    border-color:#FF6600
}
.ico1 
{
    background: url(imagenes/icocasa.gif) no-repeat 0 50%;
}
.ico1:hover
{
    background: url(imagenes/icocasahover.gif) no-repeat 0 50%;
}
.ico2
{
    background: url(imagenes/icotexto.gif) no-repeat 0 50%;
}
.ico2:hover
{
    background: url(imagenes/icotextohover.gif) no-repeat 0 50%;
}
.ico3
{
    background: url(imagenes/icosobre.gif) no-repeat 0 50%;
}
.ico3:hover
{
    background: url(imagenes/icosobrehover.gif) no-repeat 0 50%;
}
.ico4
{
    background: url(imagenes/icobajar.gif) no-repeat 0 50%;
}
.ico4:hover
{
    background: url(imagenes/icobajarhover.gif) no-repeat 0 50%;
}

#logodisman
{
    height:110px;
    width:78px;
    float:right;
    margin-left:10px;
    border:1px solid #B2936B;
    padding:0 5px 4px 5px;
}

#logodisman h4 
{
    text-transform:uppercase;
    font-weight:bold;
    font-size:20px;
    line-height:20px
}

.menu
{
    height:100px;
    margin:15px 0 0 0;
}

.medio
{
    vertical-align:middle;
    font-size:14px;
    margin-left:50px;
}

.boton
{
    width:104px;
    height:44px;
    float:left;
    margin:4px;
    text-transform:capitalize;
    color:rgb(128,96,26);
    font-size:14px;
    font-weight:bold;
    display:block;
    text-decoration:none;
    padding:10px 0 0 60px;
}
.boton:hover
{
    color:rgb(255,128,0);
}

.icono1
{
    background:transparent url(imagenes/camiseta_a.gif) no-repeat;
}
.icono1:hover
{
    background:transparent url(imagenes/camiseta_b.gif) no-repeat;
}
.icono1click 
{
    background:transparent url(imagenes/camiseta_c.gif) no-repeat;
}
.icono2
{
    background:transparent url(imagenes/mano_a.gif) no-repeat;
}
.icono2:hover
{
    background:transparent url(imagenes/mano_b.gif) no-repeat;
}
.icono2click 
{
    background:transparent url(imagenes/mano_c.gif) no-repeat;
}
.icono3
{
    background:transparent url(imagenes/bota_a.gif) no-repeat;
}
.icono3:hover
{
    background:transparent url(imagenes/bota_b.gif) no-repeat;
}
.icono3click 
{
    background:transparent url(imagenes/bota_c.gif) no-repeat;
}
.icono4
{
    background:transparent url(imagenes/cinturon_a.gif) no-repeat;
}
.icono4:hover
{
    background:transparent url(imagenes/cinturon_b.gif) no-repeat;
}
.icono4click 
{
    background:transparent url(imagenes/cinturon_c.gif) no-repeat;
}
.icono5
{
    background:transparent url(imagenes/rodillera_a.gif) no-repeat;
}
.icono5:hover
{
    background:transparent url(imagenes/rodillera_b.gif) no-repeat;
}
.icono5click 
{
    background:transparent url(imagenes/rodillera_c.gif) no-repeat;
}
.icono6
{
    background:transparent url(imagenes/casco_a.gif) no-repeat;
}
.icono6:hover
{
    background:transparent url(imagenes/casco_b.gif) no-repeat;
}
.icono6click 
{
    background:transparent url(imagenes/casco_c.gif) no-repeat;
}
.icono7
{
    background:transparent url(imagenes/ruedas_a.gif) no-repeat;
}
.icono7:hover
{
    background:transparent url(imagenes/ruedas_b.gif) no-repeat;
}
.icono7click 
{
    background:transparent url(imagenes/ruedas_c.gif) no-repeat;
}
.icono8
{
    background:transparent url(imagenes/mascarilla_a.gif) no-repeat;
}
.icono8:hover
{
    background:transparent url(imagenes/mascarilla_b.gif) no-repeat;
}
.icono8click 
{
    background:transparent url(imagenes/mascarilla_c.gif) no-repeat;
}
.icono9
{
    background:transparent url(imagenes/auriculares_a.gif) no-repeat;
}
.icono9:hover
{
    background:transparent url(imagenes/auriculares_b.gif) no-repeat;
}
.icono9click 
{
    background:transparent url(imagenes/auriculares_c.gif) no-repeat;
}
.icono10
{
    background:transparent url(imagenes/ojo_a.gif) no-repeat;
}
.icono10:hover
{
    background:transparent url(imagenes/ojo_b.gif) no-repeat;
}
.icono10click 
{
    background:transparent url(imagenes/ojo_c.gif) no-repeat;
}
.icono11
{
    background:transparent url(imagenes/conos_a.gif) no-repeat;
}
.icono11:hover
{
    background:transparent url(imagenes/conos_b.gif) no-repeat;
}
.icono11click 
{
    background:transparent url(imagenes/conos_c.gif) no-repeat;
}
.icono12
{
    background:transparent url(imagenes/i_a.gif) no-repeat;
}
.icono12:hover
{
    background:transparent url(imagenes/i_b.gif) no-repeat;
}
.icono12click 
{
    background:transparent url(imagenes/i_c.gif) no-repeat;
}

#cuerpo 
{
	/*height:200px;*/
}

#pie 
{
    background-color:rgb(185,177,173);
    border:1px solid rgb(161,158,147);
    color:White;
    font-size:small;
    margin:5px 0;
    line-height:30px;
    padding:7px 0 3px 7px;
    position:relative;
}

#pie a
{
    padding:3px 0 0 20px;
    color:White;
    margin-left:10px;
    border-top:2px solid rgb(185,177,173)
}
#pie a:hover
{
    color:red;
    border-top:2px solid red
}
#pie select
{
    background-color:rgb(185,177,173);
    color:White;
    margin-left:10px;
    position:absolute;
    right:25px
}

.cabecera
{
    color:White;
    text-transform:capitalize;
    height:19px;
}

#secciones
{
    width:100%;
    width:763px;
    height:100%;
    border-collapse:collapse;
    margin-right:-15px;
}

.seccion1, .seccion2, .seccion3, .empresa1, .empresa2
{  
    border-left:1px solid rgb(235,235,235);
    vertical-align:top;
    font-size:12px;
}
.seccion1
{
    width:192px;
}

.linkcontacto
{
    font-weight:bold;
    color:#B0763C;
}
.linkcontacto:hover
{
    color:orange;
}

#secciones h4
{
    color:White;
    padding-left:20px;
    margin-bottom:4px;
    text-transform:capitalize;
}

#secciones .seccion1
{
    border-left:1px solid rgb(235,235,235);
}

div.datos 
{
    margin:0 4px 0 2px;
}

.seccion1 h4, .empresa1 h4
{
    background:transparent url(imagenes/fondocab1.gif);
}
.seccion1 .izq, .empresa1 .izq
{
    background:transparent url(imagenes/fondocab1izq.gif) no-repeat;
}
.seccion1 .der, .empresa1 .der
{
    background:transparent url(imagenes/fondocab1der.gif) no-repeat 100% 0;
}

.seccion2 h4, .empresa2 h4
{
    background:transparent url(imagenes/fondocab2.gif);
}
.seccion2 .izq , .empresa2 .izq
{
    background:transparent url(imagenes/fondocab2izq.gif) no-repeat;
}
.seccion2 .der, .empresa2 .der
{
    background:transparent url(imagenes/fondocab2der.gif) no-repeat 100% 0;
}

.seccion3 h4
{
    background:transparent url(imagenes/fondocab3.gif);
}
.seccion3 .izq 
{
    background:transparent url(imagenes/fondocab3izq.gif) no-repeat;
}
.seccion3 .der 
{
    background:transparent url(imagenes/fondocab3der.gif) no-repeat 100% 0;
}

.izq 
{
    position:relative;
    left:-1px;
    padding:0 2px;
}

.der 
{
    padding-right:2px;
}

.seccion2 .datos, .empresa2 .datos
{
    background-color:rgb(245,245,245);
    border:1px solid rgb(242,242,242);
}

.productoresu
{
    float:left;
    border:1px outset rgb(242,242,242);
    padding:5px;
    width:175px;
    height:140px;
    cursor:pointer;
    background-color:rgb(242,242,242);
    text-decoration:none;
    color:Black;
    word-wrap: break-word;
    overflow:hidden;
    text-align:center;
    position:relative;
}
.productoresu:hover 
{
    border:1px solid #FF6600;
    background-color:#F2EDDA;
    color:#FF6600
}
.productoresu:hover h5
{
    /*background-color:#806600;*/
    color:orange;
    unicode-bidi:bidi-override
}
.productoresu h5
{
    color:rgb(87,47,6);
    display:block
}
.productoresu h6
{
    position:absolute;
    bottom:0;
    left:5px;
}

.productoresu img
{
    margin-right:8px;
    border:3px solid rgb(230,218,204);
    /*height:85px;*/
}

.clear /*esto es para poner al final de los floats para que se rrellene el div contenedor*/
{
    clear:both;
}


div.pico1, div.pico2, div.pico3, div.pico4 
{
    width:8px;
    position:absolute;
}

div.pico1
{
    background:url(imagenes/pico1.gif) no-repeat;
    top:-1px;
    left:-1px;
}
div.pico2
{
    background:url(imagenes/pico2.gif) no-repeat;
    top:-1px;
    right:-1px;
}
div.pico3
{
    background:url(imagenes/pico3.gif) no-repeat;
    bottom:-12px;
    right:-1px;
}
div.pico4
{
    background:url(imagenes/pico4.gif) no-repeat;
    bottom:-12px;
    left:-1px;
}

#logo2 div.pico1
{
    background:url(imagenes/pico21.gif) no-repeat;
    top:0;
    left:0;
}
#logo2 div.pico2
{
    background:url(imagenes/pico22.gif) no-repeat;
    top:0px;
    right:0px;
}
#logo2 div.pico3
{
    background:url(imagenes/pico23.gif) no-repeat;
    bottom:-10px;
    right:0;
}
#logo2 div.pico4
{
    background:url(imagenes/pico24.gif) no-repeat;
    bottom:-10px;
    left:0;
}


/*los estilo de la secciones de empresas*/
.empresa1, .empresa2
{
    font-size:12px;
}
.empresa1 .datos, .empresa2 .datos
{
    padding:6px;
}
.empresa1 img, .empresa2 img 
{
    border:2px inset Orange;
    float:left;
    width:150px;
    margin:0 10px 20px 0;
}
.empresa1 p, .empresa2 p 
{
    margin: 0 0 10px 0;
}

.empresa1 
{
    width:60%;
}
.empresa2
{
    width:40%;
}

.direccion
{
    margin-bottom:10px;
    width:100%;
    color:rgb(70,35,0);
}
.direccion caption 
{
    color:#FFF7F2;
    font-weight:bold;
    background-color:#805940;
    text-align:left;
    padding-left:27%;
    text-transform:capitalize
}

.direccion img 
{
    border:0;
}

.contacto 
{
    padding:10px 20px;
    text-align:center;
    color:#33271A
}
.contacto input , textarea
{
    border:1px solid #B28759;
    color:#33271A
}

.contacto table
{
    text-align:left;
    width:100%;
}
.contacto textarea 
{
    width:100%;
    height:100px;
}
.bienvenida
{
    width:365px;
    height:234px;
    padding:10px;
    background-color:#FFFCF2;
    color:#33241A;
}

.bienvenida img 
{
    border:1px solid gray;
    float:left;
    width:150px;
    margin:5px 5px 5px 0
}
/*aspecto de la ficha de producto*/
#verproducto
{
    background-color:White;
    border:1px solid gray;
    text-align:left;
    padding:5px;
    /*medida a ojo, si no se pone da problemas de representacion, 
      sobre todo si hay h5 que no aparecen y elementos con float*/
}

.producto
{
    height:1%;
}

#verproducto .producto h4 
{
    background-color:#FFE680;
    padding:5px;
    border:2px solid #FF9500;
    color:#663B00;
    margin-bottom:5px;
    clear:both;
    display:block;
}
#verproducto .producto .fotos 
{
    text-align:center;
    border:3px double #FFCC00;
    float:left;
    /*position:relative;*/
    width:39%;
}

#verproducto .producto .fotos img
{
    padding:5px;
}
.m3
{
    position:absolute;
    left:15px;
}
#verproducto .producto ul 
{
    margin:5px 5px 5px 20px;
}

.producto .descripcion 
{
    border:1px solid #FFCA80;
    float:right;
    width:59%;
    margin-bottom:5px;
    overflow:hidden;
}
.producto .descripcion p 
{
    padding:5px;
}

.producto .descripcion h4
{
    margin-top:8px;
}

.producto .descripcion thead th
{
    text-align:left;
}

#datosder 
{
    border:1px solid blue;
}

.iconos
{
    border:1px solid #CCA166;
    width:59%;
    float:right;
}
#verproducto table
{
    border:1px solid gray;
    background-color:#E6D2B8;
}

#verproducto caption 
{
    background-color:#805940;
    color:White;
    font-weight:bold;
    border:2px solid black;
    line-height:25px
}

#verproducto table tbody td 
{
    padding:3px;
    background-color:White;
    vertical-align:top;
    border:1px solid #994E1F;    
    font-size:12px;
    color:#4C2C00;
}

#verproducto .verde, #verproducto .amarillo, #verproducto .azul, #verproducto .rosa 
{
    height:50px;
    width:25%;
}

#verproducto .verde, #verproducto .verde *
{
    background-color:#81C3A4;
}
#verproducto .amarillo, #verproducto .amarillo *
{
    background-color:#FEBF32;
}
#verproducto .azul, #verproducto .azul *
{
    background-color:#40C8F4;
}
#verproducto .rosa, #verproducto .rosa *
{
    background-color:#F6ADCD;
}

#verproducto table th
{
    vertical-align:middle;
    text-align:center;
}
.documento 
{
    padding:10px;
    font-size:12px;
    border:1px solid #CCB799;
}

.documento p 
{
    margin-bottom:15px;
}

/*esto es el estilo de los iconos de la parte de descargas de catalogos*/
.catalogos a
{
    text-align:center;
    font-size:11px;
    border:1px solid orange;
    background-color:#FFCC00;
    width:100px;
    text-transform:uppercase;
    font-weight:bold;
    color:Red;
    display:inline-block;
    margin:5px 15px;
}

.catalogos a:hover
{
    background-color:#FFF5CC;
    border:1px solid red;
}

.catalogos img 
{    
    margin:0;
    width:100px;
}
/**/
#float 
{
    clear:both
}

/*el estilo de la tabla de modificar usuario*/

.modificar 
{
    border:1px solid #FF9500;
    margin:0 10px;
    background-color:#FFF5CC;
}

.fotocontacto 
{
    border:3px double gray;
    height:180px;
    margin:25px 0 0 20px;
}