html
{
	height: 100%;
}

*
{ margin: 0;
  padding: 0;}

body
{
	font: normal .99em 'trebuchet ms', arial, sans-serif;
	color: #777;
	background-color: #FAFAFA;
}

p
{
	padding: 5px 5px 15px 5px;
	text-align:justify;
	line-height: 1.2em;
}

.alinearizq
{
	text-align:left;
}

strong{
	color: #015588;
}

img
{ border: 0;}

h1, h2, h3, h4, h5, h6 
{ font: normal 175% 'century gothic', arial, sans-serif;
  color: #43423F;
  margin: 0 0 15px 0;
  padding: 5px 0 5px 0;}

h4, h5, h6
{
	margin: 0;
	padding: 2px 0 5px 0;
	font: normal 120% arial, sans-serif;
	color: #015588;
}

h5, h6
{ font: italic 95% arial, sans-serif;
  padding: 0 0 15px 0;
  color: #000;}
  
h7
{ font: 90% 'century gothic',arial, sans-serif;
  text-transform:none;
  color: #015588;}


a, a:hover
{ outline: none;
  text-decoration: none;
  color: #1293EE;}

a:hover
{ text-decoration: none;}

#main, #logo, #menubar, #site_content, #site_footer, #footer
{ margin-left: auto; 
  margin-right: auto;}

#header
{
  background: #626262 url(../style/footer.png) repeat;
  width: 100%;
  overflow: hidden;
  margin: 0 auto 0 auto;
  padding: 0px 0px 0px 0px;
}

#header2
{
  background: #D6D6D6 url(../style/menu.png) repeat;
  width: 100%;
  overflow: hidden;
  margin: 0 auto 0 auto;
  padding: 0px 0px 0px 0px;
}

#logo
{
	width: 825px;
	position: relative;
	height:90px;	
  	padding: 15px 0px 0px 0px;
}

#logo h1
{	
  	padding-top: 28px;
}

#menu
{ width: 100%;
  height: 39px;
  padding: 0;
  background: #D6D6D6 url(../style/menu.png) repeat-x;} 

#menubar
{ width: 877px;
  height: 39px;
  padding: 0;} 

#site_content
{ width: 837px;
  overflow: hidden;
  margin: 0 auto 0 auto;
  padding: 20px 24px 20px 37px;} 
  
#site_footer
{ width: 837px;
  overflow: hidden;
  padding: 20px 24px 20px 37px;
  margin: 0 auto 0 auto;} 
 
#site_footer2
{ width: 837px;
  overflow: hidden;
  margin: 0 auto 0 auto;} 

#site_footer h4, h5
{
	margin: 0;
	padding: 10px 0 5px 0;
	font: bold 90% arial, sans-serif;	
	text-transform: uppercase;
	color: #000;
}

#site_footer h6
{
	font: italic 95% arial, sans-serif;
	padding: 4px 0 2px 10px;
	color: #000;	
}

#site_footer a
{
	color: #000;	
}


.sidebar
{ float: right;
  width: 200px;
  padding: 0 0px 0px 15px;}
  
.col
{ float: left;
  width: 46%;
  padding: 0 15px 0px 15px;}
  
#marcas
{ text-align: left;
  width: 837px;
  height: 180px;
  padding: 0;}  
  
.marca
{ float: left;
  width: 28%;
  height: 150px;
  padding: 0 15px 30px 15px;}

.marca2
{ float: left;
  width: 20%;
  height: 150px;
  padding: 0 15px 30px 50px;}

#content
{ text-align: left;
  width: 595px;
  padding: 0;}
  
#content ul
{ margin: 2px 0 22px 0px;}

#content ul li
{ list-style-type: none;
  background: url(../style/bullet.png) no-repeat;
  margin: 0 0 6px 0; 
  padding: 0 0 4px 25px;
  text-align:justify;
  line-height: 1.5em;}

#footer
{
	font: normal 100% 'lucida sans unicode', arial, sans-serif;
	padding: 10px 0 5px 0;
	text-align: center;
	width:100%;
	background: #626262 url(../style/footer.png) repeat-x;
	color: #FFF;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}
  
.footer1
{ float: left;
  width: 20%;}

.footer2
{ float: left;
  padding: 10px 0 5px 0;
  width: 70%;}
	
#footer a
{ color: #FFF;
  text-decoration: none;}

#footer a:hover
{ color: #FFF;
  text-decoration: underline;}

.search
{ color: #5D5D5D; 
  border: 1px solid #BBB; 
  width: 134px; 
  padding: 4px; 
  font: 100% arial, sans-serif;}

.form_settings
{ margin: 15px 0 0 0;}

.form_settings p
{ padding: 0 0 4px 0;}

.form_settings span
{ float: left; 
  width: 200px; 
  text-align: left;}
  
.form_settings input, .form_settings textarea
{
	padding: 5px;
	width: 299px;
	font: 100% arial;
	border: 1px solid #B8B89C;
	background: #FFF;
	color: #47433F;
}

.form_settings .buscar
{
	padding: 5px;
	width: 200px;
	font: 100% arial;
	border: 1px solid #B8B89C;
	background: #FFF;
	color: #47433F;
}

#nif
{
	padding: 5px;
	width: 100px;
	height: 10px;
	font: 100% arial;
	border: 1px solid #B8B89C;
	background: #FFF;
	color: #47433F;
}

input[type="radio"] {
    background-color: #FFF;
    cursor: pointer;	
	border: 0px;
    height: 10px;
    margin-left: 15px;
    width: 15px;
}

input[type="checkbox"] {
    background-color: #FFF;
    cursor: pointer;	
	border: 0px;
    height: 10px;
    margin-left: 0px;
    width: 15px;
}
  
.form_settings .submit
{
	font: 100% arial;
	border: 1px solid;
	width: 99px;
	margin: 0 0 0 212px;
	height: 33px;
	padding: 2px 0 3px 0;
	cursor: pointer;
	color: #FFF;
	background-color: #616161;
}

.form_settings .submitbuscar
{
	font: 100% arial;
	border: 1px solid;
	width: 99px;
	margin: 0 0 0 30px;
	height: 33px;
	padding: 2px 0 3px 0;
	cursor: pointer;
	background: #015588;
	color: #FFF;
}

.form_settings textarea, .form_settings select
{ font: 100% arial; 
  width: 299px;}

.form_settings select
{ width: 310px;}

.form_settings .checkbox
{ margin: 4px 0; 
  padding: 0; 
  width: 14px;
  border: 0;
  background: none;}

.separator
{ width: 100%;
  height: 0;
  border-top: 1px solid #D9D5CF;
  border-bottom: 1px solid #FFF;
  margin: 0 0 20px 0;}
  
table
{ margin: 10px 0 30px 0;}

table tr th, table tr td
{
	color: #FFF;
	padding: 7px 4px;
	text-align: left;
	background-color: #D2D2D2;
}
  
table tr td
{
	color: #47433F;
	border-top: 1px solid #FFF;
	background-color: #696969;
}

.nav{
	/*estilo de nuestra lista*/
    background: #D6D6D6 url(../style/menu.png) repeat-x;
	list-style:none;
	width:auto;
	position:relative;
	display:block;
	height:39px;
 }
.nav li{
	/*estilo a cada uno de los elementos(li) de nuestro menu*/
 	float:static;
	/* propiedad importante para que nuestro menu tome la forma horizontal*/
 	display:block;
	position:static;
 }

.nav li a{
	/*estilo de los enlaces */
    color:#4B4B4B;
	text-decoration:none;
	font-family:Helvetica, Arial, sans-serif;
	font-size:14px;
	line-height:1.3em;
	padding:13px 14px 8px 14px;
	display:block;
 }
 
.nav li a:hover {
	display:block;
	color:#EEEEEE;
	text-decoration:none;	
    background: #626262;
}

.nav > li {
 float:left;
 color:#069;
}

.nav li ul {
 display:none;
 position:absolute;
 color:#069;
 min-width:240px;
}

.nav li:hover > ul {
	display:block;
	background-color:#D6D6D6;
	color:#FFF;
	text-decoration:none;
}

.polaroid-images a {
background: white; 
display: inline; 
float:left; 
margin: 0 15px 30px; 
padding: 10px 10px 25px; 
text-align: center; 
text-decoration: none; 
-webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, .3); 
-moz-box-shadow: 0 4px 6px rgba(0,0,0,.3); 
box-shadow: 0 4px 6px rgba(0,0,0,.3); 
-webkit-transition: all .15s linear; 
-moz-transition: all .15s linear;  
transition: all .15s linear;  
z-index:0; 
} 

.polaroid-images img { 
display: block; 
width: inherit; 
} 


  

#responsive-menu li{ 

display: inline; 

text-transform: uppercase; /* Transformamos el texto a mayúsculas */ 

text-align: center; /* Texto centrado */ 

} 

  
#responsive-menu li a:hover{ 

background: #151a1e; /* Color de fondo de cada elemento al pasar el cursor */ 

} 

  

#nav-responsive{ 

display: none; /* Ocultamos el enlace */ 

background: #000000; /* Imagen que desplegará el menú al hacer click */ 

text-decoration: none; /* Sin subrayado */ 

float: left; /* Flotado a la derecha */ 

text-transform: uppercase; /* Transformamos el texto a mayúsculas */ 

text-align: center; /* Texto centrado */ 
    
color:#FFF;

font-family:Arial, sans-serif;
	
font-size:18px;
	
line-height:1.3em;

width: 100%; /* Ancho */ 

height: 30px; /* Alto */ 

padding: 10px 0px 10px 0px;

position: relative; 

right: 0; /* Derecha */ 

top: 0; /* Arriba */ 

opacity: .9; /* Opacidad */  

} 

/* Agregaremos la clase .nav-active al enlace #nav-responsive, cuando el menu esté desplegado */ 

#nav-responsive.nav-active{ 

opacity: .9; /* Opacidad */ 

} 







  

/* A partir de aquí, vista móvil */ 

@media only screen and (max-width: 780px) {

body{ background: #FFFFFF;}

#header{width: 100%;}

#logo{ width: 100%;}

#logo h1
{	
  	display:none;
}

#menubar{ width: 100%;}

#site_content
{ width: 95%;
  overflow: hidden;
  margin: 0 0 0 0;
  padding: 15px 0px 0px 10px;
  background: #FFF;} 
  
#site_footer
{ width: 95%;
  overflow: hidden;
  margin: 0 0 0 0;
  padding: 15px 0px 0px 10px;} 
  

#site_footer2
{ width: 95%;
  overflow: hidden;
  margin: 0 0 0 0;} 
  
#content
{ width: 98%;
  padding: 0px 5px 0px 5px;}
  
#marcas
{ text-align: left;
  width: 98%;
  height: 180px;
  padding: 0;}  
  
.marca
{ float: left;
  width: 40%;  
  height: 150px;  
  padding: 0 15px 30px 10px;}

.marca2
{ float: left;
  width: 150px;  
  height: 150px;  
  padding: 0 15px 30px 10px;}
  
.sidebar
{ width: 100%;
  float: left;
  padding: 0 15px 0px 10px;}
  
.col
{ float: left;
  width: 98%;
  padding: 0 15px 0px 10px;}
  
.imgcontacto{ 
display: none; 
} 

#footer
{ width: 100%;
  height: auto;}
  
.footer2
{  padding: 5px 0 5px 0;}
  
.nav{
	/*estilo de nuestra lista*/
	width:100%;
	height:80px;
 }
}

@media only screen and (max-width: 480px) { 
   
#logo{ margin-left:-35px;}
  
.footer2{  padding: 0 0 5px 0;}

.nav{
	/*estilo de nuestra lista*/
	width:100%;
	height:118px;
 }

/* Mostramos el enlace que desplegará el menú (#nav-responsive) */ 

#nav-responsive{ 

display: block; 

} 

  

#responsive-menu{ 

width: 100%; /* Ancho (vista móvil) */ 

float: none; /* Dejamos de flotar el menú ya que el ancho es 100% */ 

padding-top: 0px; /*Relleno por arriba a partir del cual se mostrarán los elementos <li> */ 

} 

  

#responsive-menu ul{ 

box-shadow: 0 1px 2px rgba(0,0,0,.5); /* Sombra al menú */ 

width: 100%;

max-height: 0; 

overflow: hidden; 

} 

/* Añadimos estilo a cada elemento <li> (Vista móvil) */ 

#responsive-menu li{ 

border-bottom: 1px solid #282b30; /* Borde inferior tamaño-tipo-color */ 

float: none; 

display: block; 

} 

#responsive-menu li:last-child{ 

border-bottom: 0; /* Quitamos el borde al útlimo elemento <li> del menú (Vista móvil) */ 

} 

  

/* Estilos para los enlaces (Vista móvil) */ 

#responsive-menu li a{ 

padding: 15px 0; 

height: auto; 

line-height: normal; 

} 

  

#responsive-menu li a:hover{ 

background:#2a2d33; /* Color de fondo para cada enlace al pasar el cursor */ 

} 

  

#responsive-menu ul.open-responsive-menu{ 

max-height: 400px; /* Máximo alto para el menú desplegado */ 

transition: max-height .5s; /* Efecto en el despliegue del menú */ 

} 

}