@charset "UTF-8";
/* CSS Document */

body
{
	margin:0px; padding:0px; border:0px; background:url(../images/fondo.jpg) repeat;
	text-align:center; vertical-align:top;
	font-family: 'Raleway', sans-serif; font-weight:300px;}

.header
{
	padding:2%;
	text-align:center;
	vertical-align:middle;
	background-color:#FFF;}

.language
{position:absolute; top:0px; right:0px; box-shadow:0px 0px 5px #CCC; background-color:#FFF; color:#888; letter-spacing:1px; padding:10px; width:120px; font-size:14px;}

.titulo
{
	font-size:32px;
	font-family: 'Raleway', sans-serif; font-weight:500px;
	margin-bottom:20px;
	border-bottom:5px solid #dc781f;
	color:#333;
	padding-bottom:10px;}

.mapa
{
	vertical-align:top;
	text-align:center;
	padding:1% 4%;}

.productos
{
	font-family: 'Bree Serif', serif;
	font-size:35px;
	color:#6A6A6A;
	text-decoration:none;
	}

a
{
	color:#6A6A6A;
	text-decoration:none;
	}

a:hover
{
	color:#D97800;
	text-decoration:none;
	}
	
@media all and (min-width:350px) and (max-width:600px) {
.productos
{
	font-family: 'Bree Serif', serif;
	font-size:80px;
	color:#6A6A6A;
	text-decoration:none;
	}
}

@media screen and (max-width:800px) {
.header
{
	padding:10% 2%;
	text-align:center;
	vertical-align:middle;
	background-color:#FFF;}

.mapa
{
	vertical-align:top;
	text-align:center;
	padding:4% 0%;}

.productos
{
	font-family: 'Bree Serif', serif;
	font-size:32px;
	color:#6A6A6A;
	text-decoration:none;
	}

.productos a
{
	font-family: 'Bree Serif', serif;
	color:#6A6A6A;
	text-decoration:none;
	}

.productos a:hover
{
	font-family: 'Bree Serif', serif;
	color:#D97800;
	text-decoration:none;
	}

.language
{position:absolute; top:0px; right:0px; box-shadow:0px 0px 5px #CCC; background-color:rgba(255,255,255,0.5); color:#888; letter-spacing:0px; padding:10px; width:90px; font-size:12px;}
}