/* CSS Document 
   Página Web Café Tío Pepe / Cafetal Ltda.
   Por Raúl Ramírez Peralta / Diseñador gráfico
   Julio - Agosto 2009
*/

* {
padding:0;
margin:0;
}

html{
height: 100%;
}

img{
border-width: 0;
}

body{
background-color:#3b0a09;
border:0px;
margin:0px;
padding:0px;
height:100%;
font-family: Arial, Helvetica, sans-serif;
}

a{
outline-style: none;
}

h1{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:20px;
color:#3b0a09;
text-align:left;
padding-left:15px;
padding-top:3px;
}

/* 
pagina index 
---------------------------- */

#barra{
width:100%;
height:4px;
background-color:#faba00;
}

/* hack ie6 */
* html #barra{
width:auto;
height:4px;
overflow:hidden;
background-color:#faba00;
}

#contenedorgeneral{
width:800px;
height:auto;
overflow:hidden;
text-align:center;
margin-left:auto;
margin-right:auto;
}

*html #contenedorgeneral{
width:800px;
height:auto;
overflow:hidden;
margin-left:auto;
margin-right:auto;
}

#headperfil{
width:794px;
height:127px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin-left:auto;
margin-right:auto;
border:2px solid #faba00;
border-top:none;
}

#cuerpoheaduno{
background-image:url(../images/fondohead.png);
background-repeat:no-repeat;
width:794px;
height:95px;
border-bottom:2px solid #faba00;
background-color:#3b0a09;
}

#logocafetal{
width:166px;
height:64px;
padding-top:20px;
padding-left:20px;
text-align:left;
}

* html #logocafetal{
width:766px;
height:64px;
padding-top:20px;
padding-left:20px;
}

*:first-child+html #logocafetal{
width:766px;
height:64px;
padding-left:20px;
}

#botoneraprincipal{
background-image:url(../images/fondobotonera.png);
background-repeat:no-repeat;
background-color:#7a6a5a;
width:794px;
height:30px;
}

* html #botoneraprincipal{
background-image:url(../images/fondobotonerados.png);
background-repeat:no-repeat;
background-color:#7a6a5a;
width:794px;
height:30px;
clear:both;
}

#botoneraglobal{
width:600px;
height:30px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#FFFFFF;
list-style:none;
margin:0;
text-align:left;
}

#botoncontacto{
float:right;
width:134px;
height:30px;
margin-right:100px;
}

* html #botoncontacto{
float:right;
width:134px;
height:20px;
margin-right:100px;
}

#botonmusica{
width:110px;
height:20px;
margin-top:5px;
margin-right:10px;
padding-top:3px;
float:right;
}

#cuerpoimagen{
width:794px;
height:250px;
margin-left:auto;
margin-right:auto;
margin-bottom:5px;
background-color:#3b0a09;
}

#barrapuntaredonda{
background-image:url(../images/puntaredonda.png);
background-repeat:no-repeat;
width:800px;
height:8px;
margin-left:auto;
margin-right:auto;
}

* html #barrapuntaredonda{
background-image:url(../images/puntaredondatres.png);
background-repeat:no-repeat;
width:800px;
height:3px;
margin-left:auto;
margin-right:auto;
padding:0px;
clear:both;
}

#cuerpoinfo{
width:800px;
height:350px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
clear:both;
}

#cuerpoinfoindex{
width:800px;
height:400px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
clear:both;
}


/* 
contenido index
---------------------------- */

#barratitulocuerpo{
background-color:#faba00;
width:800px;
height:30px;
overflow:hidden;
}

#titulobienvenidos{
width:500px;
height:30px;
float:left;
}

#titulorecomendamos{
width:300px;
height:30px;
float:right;
}

#infobienvenido{
width:410px;
height:360px;
float:left;
overflow:hidden;
}

#infotextobienvenido a{
width:400px;
height:360px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:15px;
margin-top:20px;
}

#linkcatalogo{
width:350px;
height:320px;
float:right;
margin-top:25px;
padding-right:10px;
}

#ramas{
width:250px;
height:120px;
margin-top:15px;
margin-left:50px;
}

/* 
contenido footer
---------------------------- */

#footer{
clear:both;
background-image:url(../images/fondofooter.png);
background-repeat:repeat-x;
width:800px;
height:200px;
background-color:#faba00;
margin-left:auto;
margin-right:auto;
border-left:3px solid #faba00;
border-right:3px solid #faba00;
}

#botonerasecundaria{
width:800px;
height:20px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#dcd6c6;
list-style:none;
margin-left:auto;
margin-right:auto;
overflow:hidden;
padding-top:10px;
border-bottom:1px solid #3b0a09;
}

#botonerasecundaria ul li{
list-style-type:none;
display:inline;
}

#botonerasecundaria ul{
padding:0;
margin:0;
}

#botonerasecundaria a{
width:800px;
height:20px;
text-decoration:none;
color:#3b0a09;
padding-left:30px;
padding-right:15px;
margin-left:5px;
}

#botonerasecundaria a:hover{
width:800px;
height:20px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#ffffff;
list-style:none;
}

#infopie{
width:800px;
height:150px;
overflow:hidden;
}


#infopieuno{
height:130px;
width:300px;
float:left;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-align:left;
color:#3b0a09;
padding-top:25px;
padding-left:20px;
}

#infopieuno a{
text-decoration:none;
color:#3b0a09;
}

#infopiedos{
height:130px;
width:400px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-align:right;
color:#3b0a09;
padding-top:25px;
padding-right:30px;
float:right;
}

#infopiedos a{
text-decoration:none;
color:#3b0a09;
}

/* 
contenido footer
---------------------------- */

/* 
Contacto
---------------------------- */

#cuerpoinfocontacto{
width:800px;
height:530px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border:3px solid #faba00;
border-top:none;
border-bottom:none;
}

#divcontactouno{
width:400px;
height:450px;
float:left;
margin-top:30px;
margin-left:35px;
border:1px dashed #EFEFEF;
}

#espacioformulario{
height:25px;
width:370px;
margin-left:20px;
}

#espacioformulario{
width:250px;
height:250x;
overflow:hidden;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin-top:5px;
}

#espacioformulariouno{
width:70px;
height:25px;
float:left;
overflow:hidden;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
padding-top:3px;
text-align:right;
margin-left:15px;
}

#espacioformulariodos{
width:160px;
height:25px;
float:left;
}

#espaciotextoenviar{
width:270px;
height:100px;
margin-top:5px;
float:right;
margin-right:20px;
}

#botonesmail{
width:400px;
height:25x;
overflow:hidden;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding-top:10px;
}

#divbotonenviar{
width:80px;
height:25px;
float:right;
margin-right:20px;
padding-right:30px;
}

#divborrar{
width:80px;
height:25px;
float:right;
margin-right:30px;
padding-right:30px;
}

#divcontactodos{
width:350px;
height:470px;
float:right;
margin-top:25px;
margin-right:35px;
}

#placabronce{
background-image:url(../images/placabronce.png);
background-repeat:no-repeat;
width:350px;
height:200px;
margin-top:15px;
}

#infocontacto{
width:270px;
height:100px;
font-family:Arial, Helvetica, sans-serif;
font-size:17px;
color:#000000;
margin-left:auto;
margin-right:auto;
padding-top:25px;
}

#infocontacto a{
font-family:Arial, Helvetica, sans-serif;
font-size:17px;
color:#000000;
text-decoration:none;
}

#fotobuzon{
width:350px;
height:250px;
}

.botonborrar{
background-color:#a3844f;
float:left;
width:80px;
height: 19px;
text-decoration:none;
border:1px solid #442520;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:bold;
padding-bottom:2px;
}

.botonenviar{
background-color:#a3844f;
float:left;
width:80px;
height: 19px;
text-decoration:none;
border:1px solid #442520;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:bold;
padding-bottom:2px;
}

/* 
Cafetal
---------------------------- */
#cuerpocafetal{
width:794px;
height:150px;
margin-left:auto;
margin-right:auto;
background-color:#3b0a09;
margin-bottom:5px;
}

#cuerpoinfonosotros{
width:800px;
height:430px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
}


#titulovisitaclientes{
width:200px;
height:30px;
float:right;
padding-top:7px;
}

#titulovisitaclientes a{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

#textonuestraempresa{
width:480px;
height:330px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:25px;
margin-top:30px;
}

* html #textonuestraempresa{
width:480px;
height:330px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:10px;
margin-top:30px;
}

#textonuestraempresauno{
width:510px;
height:330px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:25px;
margin-top:65px;
}

* html #textonuestraempresauno{
width:510px;
height:330px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-top:65px;
}

#nuestraempresalink{
width:500px;
height:30px;
border-top:1px solid #3b0a09;
margin-top:15px;
padding-top:5px;
}

#nuestraempresalink a{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

#fotofachada{
width:260px;
height:300px;
float:right;
overflow:hidden;
margin-top:30px;
margin-right:10px;
}

* html #fotofachada{
width:260px;
height:300px;
float:right;
overflow:hidden;
margin-top:30px;
margin-right:10px;
}

/* 
Fin cafetal
---------------------------- */

/* 
Nuestros clientes
---------------------------- */

#cuerpoinfoclientes{
width:800px;
height:510px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
}

#textonuestrosclientes{
width:750px;
height:180px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
overflow:hidden;
padding-left:25px;
padding-right:25px;
padding-top:25px;
}

#logotiposclientes{
width:700px;
height:230px;
margin-left:60px;
}

#nuestrosclienteslink{
width:750px;
height:30px;
margin-top:5px;
margin-left:25px;
padding-top:5px;
border-top:1px solid #3b0a09;
text-align:left;
}

#nuestrosclienteslink a{
width:750px;
height:30px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
clear:both;
}

#logouno{
width:200px;
height:100px;
float:left;
margin-left:15px;
}

#logodos{
width:200px;
height:100px;
float:left;
margin-top:15px;
margin-left:15px;
}

/* 
Fin Nuestros clientes
---------------------------- */

/* 
Cafe Tio Pepe
---------------------------- */

#cuerpoinfocafe{
width:800px;
height:400px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
clear:both;
overflow:hidden;
}

#cafetiopepe{
width:425px;
height:350px;
float:left;
overflow:hidden;
}

#infotextocafetiopepe{
width:400px;
height:300px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
margin-left:15px;
margin-top:25px;
}

#fotocafetiopepe{
height:220px;
width:350px;
float:right;
margin-right:20px;
padding-top:60px;
margin-top:20px;
}


/* 
Fin Nuestro cafe
---------------------------- */

/* 
Cafe tio pepe
---------------------------- */
#cuerpoimagentiopepe{
width:794px;
height:150px;
margin-left:auto;
margin-right:auto;
background-color:#3b0a09;
margin-bottom:5px;
}

* html #cuerpoimagentiopepe{
width:794px;
height:145px;
margin-left:auto;
margin-right:auto;
background-color:#3b0a09;
}

/* 
Variedades
---------------------------- */

/* 
Cafe tio pepe
---------------------------- */

#cuerpovariedad{
width:794px;
height:150px;
margin-left:auto;
margin-right:auto;
background-color:#3b0a09;
border:3px solid #3b0a09;
}

#titulovariedad{
width:500px;
height:30px;
float:left;
}

* html #titulovariedad{
width:450px;
height:30px;
float:left;
}

#tituloatrassiguiente{
width:280px;
height:30px;
float:left;
padding-top:5px;
text-align:right;
}

* html #tituloatrassiguiente{
width:280px;
height:30px;
float:left;
}

#atrasvariedad{
width:60px;
height:20px;
float:left;
margin-left:130px;
padding-top:5px;
}

* html #atrasvariedad{
width:60px;
height:20px;
float:left;
margin-left:65px;
margin-top:4px;
}

#atrasvariedad a{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

#siguientevariedad{
width:80px;
height:20px;
float:right;
padding-top:5px;
}

* html #siguientevariedad{
width:85px;
height:20px;
float:right;
}

#siguientevariedad a{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

#cuerpoinfovariedad{
width:800px;
height:415px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
border-top:none;
border-bottom:none;
}

#fotoenvase{
width:300px;
height:350px;
float:right;
overflow:hidden;
margin-top:15px;
margin-right:30px;
}

* html #fotoenvase{
width:300px;
height:350px;
float:right;
overflow:hidden;
margin-top:15px;
margin-right:30px;
}

#textoenvasevariedad{
width:420px;
height:300px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:25px;
margin-top:45px;
}

* html #textoenvasevariedad{
width:350px;
height:300px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
float:left;
margin-left:10px;
margin-top:45px;
}

#textoresena{
width:420px;
height:60px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

* html #textoresena{
width:400px;
height:60px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}


#cuadrovariedad{
width:420px;
height:30px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

* html #cuadrovariedad{
width:400px;
height:30px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}

#cuadrooro{
width:420px;
height:200px;
padding-left:50px;
}

* html #cuadrooro{
width:360px;
height:200px;
}

#iracatalogolink{
width:400px;
height:30px;
border-top:1px solid #3b0a09;
margin-top:15px;
padding-top:5px;
}

#iracatalogolink a{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#3b0a09;
text-decoration:none;
text-align:left;
}
/* 
Fin Variedades
---------------------------- */


/* 
Catalogo
---------------------------- */
#columnauno{
width:450px;
height:160px;
margin-left:auto;
margin-right:auto;
margin-top:20px;
overflow:hidden;
}

#fotooro{
width:140px;
height:130px;
float:left;
}

#titulofotooro{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#fotoplata{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotoplata{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#fotoitaliano{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotoitaliano{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#columnados{
width:610px;
height:160px;
margin-left:auto;
margin-right:auto;
overflow:hidden;
margin-top:10px;
}

#fotofiume{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotofiume{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#fotoexotico{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotoexotico{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#fotodescafeinado{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotodescafeinado{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#fotocumbres{
width:140px;
height:130px;
float:left;
margin-left:10px;
}

#titulofotocumbres{
width:140px;
height:15px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666666;
text-align:center;
}

#ladouno{
width:35px;
height:360px;
float:left;
}

#ladodos{
width:35px;
height:360px;
float:right;
}

#galeria{
width:720px;
height:auto;
float:left;
}


/* 
Fin Catalogo
---------------------------- */