@charset "utf-8";
/* CSS Document */
*{
 font-family: 'Gabriela';	
}
a:link {
    color: #FFFFFF;
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #FFFFFF;
}
a:hover {
    text-decoration: none;
}
a:active {
    text-decoration: none;
}
body{
	height:1000px;
}

.foto{
	position: relative;
	left: 1vw;
	width: 12%;
	height: 15vw;
	top: 1vw;
}
#tut{
	position: relative;
	left: 0.2vw;
	width: 10%;
	font-size: 3vw;
	top: -3vw;
}
#foto{
	width: 100%;
	top: 110vw;
}
.histo{
	position: relative;
	left: 15vw;
	width: 12%;
	height: 15vw;
	top: -14vw;
}
#hist{
	width: 100%;
	top: 110vw;
}
#historia{
	position: relative;
	left: 0vw;
	width: 10%;
	font-size: 3vw;
	top: -3vw;
}
.icona{
	position: relative;
	width: 30%;
	left:35%;
	display: block;
	height: 10vw;
	top:-30vw;
}
.veu{
	position: relative;
	left: 90%;
	width: 10%;
	top: -38vw;
}
#veu{
	width: 100%;
}
#icona{
	position: absolute;
	width: 100%;
	left: 0%;
	top:0vw;
}
.eina{
	position:relative;
	display: block;
	background-color: rgba(189,0,0,1.00);
	color: beige;
	width:90%;
	left: 5%;
	height: 18vw;
	padding: 0.1vw;
	top: -35vw;
	text-align:center;
	font-size: 4vw;
	font-weight: 600;
}
#eina{
	font-family: 'Encode Sans Expanded', sans-serif;
}
.adreca{
	position:relative;
	width:90%;
	left: 5%;
	top: -21.5vw;
	text-align:center;
	color: brown;
	font-size: 3vw;
	font-weight: 600;
}
.titular{
	position:relative;
	width:80%;
	left: 10%;
	top: -48vw;
	text-align:center;
	font-size: 3vw;
	font-weight: 600;
}
.parrf{
	position:relative;
	width:80%;
	left: 10%;
	top: -34vw;
	text-align:left;
	font-size: 3vw;
}
.alta{
	display: block;
	background-color: brown;
	position:relative;
	width:80%;
	left: 10%;
	top: -32vw;
	text-align:center;
	font-size: 3vw;
	color: lemonchiffon;
	font-weight: 600;
	padding: 1vw;
}
.exemple{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -30vw;
	text-align:center;
	background-color: brown;
	font-size: 3vw;
	color: black;
	font-weight: 600;
	padding: 1vw;
}
.instruccions{
	position:relative;
	width:80%;
	left: 10%;
	top: -33vw;
	text-align:center;
	font-size: 3.5vw;
	font-weight: 600;
}
.pag1{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: 0vw;
}
#pag1{
	position:relative;
	width:100%;
	top: -35vw;
}
#pag2{
	position:relative;
	width:100%;
	top: -35vw;
}
.accedir{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -35vw;
}
#accedir{
	position:relative;
	width:100%;
}
#accedir2{
	position:relative;
	width:100%;
}
.editor{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: 2vw;
}
#editor{
	position:relative;
	width:100%;
	top: -35vw;
}
#clicant{
	position:relative;
	width:80%;
	left: 10%;
	text-align:left;
	font-size: 3vw;
	top: -34vw;
}
#edicio{
	position:relative;
	width:15%;
	left: -3%;		
}
#plat{
	position:relative;
	width:15%;
	left: -3%;		
}
#paper{
	position:relative;
	width:15%;
	left: -6%;		
}
#impresora{
	position:relative;
	width:15%;
	left: -6%;		
}
#lletres{
	position:relative;
	width:50%;
	left: -4%;		
}
#paperfons{
	position:relative;
	width:50%;
	left: -2%;		
}
#micro{
	position:relative;
	width:15%;
	left: -6%;		
}
#formu{
	position:relative;
	width:15%;
	left: -6%;		
}
#pantal{
	position:relative;
	width:15%;
	left: -6%;		
}
#qr{
	position:relative;
	width:15%;
	left: -6%;		
}
#publi{
	position:relative;
	width:15%;
	left: -6%;		
}
#logo{
	position:relative;
	width:15%;
	left: -6%;		
}
.resta{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -35vw;
	text-align:center;
	background-color: brown;
	font-size: 3vw;
	color: white;
	font-weight: 600;
	padding: 1vw;
	margin-bottom: 10vw;
}
.tarifes{
	position:relative;
	width:100%;
	top: -40vw;
}
#tarifes{
	position:relative;
	width:100%;
}

@media (min-width: 768px) and (max-width: 1200px){
.foto{
	position: relative;
	left: 1vw;
	width: 8%;
	height: 15vw;
	top: 0vw;
}
#tut{
	position: relative;
	left: 0.2vw;
	width: 10%;
	font-size: 2vw;
	top: -2vw;
}
#foto{
	width: 100%;
	top: 110vw;
}
.histo{
	position: relative;
	left: 12vw;
	width: 7.5%;
	height: 15vw;
	top: -14.5vw;
}
#hist{
	width: 100%;
	top: 110vw;
}
#historia{
	position: relative;
	left: 0vw;
	width: 10%;
	font-size: 2vw;
	top: -2vw;
}
.icona{
	width: 30%;
}
.veu{
	position: relative;
	left: 93%;
	width: 7%;
	top: -40vw;
}
#veu{
	width: 100%;
}
.icona img{
	position: absolute;
	width: 20%;
	left: 40%;
	top:1vw;
}
.titular{
	position:relative;
	width:80%;
	left: 10%;
	top: -47vw;
	text-align:center;
	font-size: 3vw;
	font-weight: 600;
}
.adreca{
	position:relative;
	width:90%;
	left: 5%;
	top: -22vw;
	text-align:center;
	color: brown;
	font-size: 3vw;
	font-weight: 600;
}

.parrf{
	position:relative;
	width:80%;
	left: 10%;
	text-align:left;
	font-size: 3vw;
	top: -34vw;
}
.alta{
	display: block;
	background-color: brown;
	position:relative;
	width:80%;
	left: 10%;
	top: -34vw;
	text-align:center;
	font-size: 3vw;
	color: lemonchiffon;
	font-weight: 600;
	padding: 1vw;
}
.exemple{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -32vw;
	text-align:center;
	background-color: brown;
	font-size: 3vw;
	color: black;
	font-weight: 600;
	padding: 1vw;
}
.instruccions{
	position:relative;
	width:80%;
	left: 10%;
}
#inst{
	position:relative;
	top: -0vw;
	text-align:center;
	font-size: 3.5vw;
	font-weight: 600;
}
.pag1{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: 0vw;
}
#pag2{
	position:relative;
	width:100%;
	top: -30vw;
}
.accedir{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -25vw;
}
#accedir{
	position:relative;
	width:100%;
}
#accedir2{
	position:relative;
	width:100%;
}
.editor{
	display: block;
	position:relative;
	width:80%;
	height: 96vw;
	left: 10%;
	top: 0vw;
    margin-bottom: 5vw;
}
#editor{
	position:relative;
	width:100%;
}
#clicant{
	position:relative;
	width:80%;
	left: 10%;
	text-align:left;
	font-size: 3vw;
	top: -20vw;
}
#edicio{
	position:relative;
	width:15%;
	left: -3%;		
}
#plat{
	position:relative;
	width:15%;
	left: -3%;		
}
#paper{
	position:relative;
	width:15%;
	left: -6%;		
}
#impresora{
	position:relative;
	width:15%;
	left: -6%;		
}
#micro{
	position:relative;
	width:15%;
	left: -6%;		
}
#formu{
	position:relative;
	width:15%;
	left: -6%;		
}
#pantal{
	position:relative;
	width:15%;
	left: -6%;		
}
#qr{
	position:relative;
	width:15%;
	left: -6%;		
}
#publi{
	position:relative;
	width:15%;
	left: -6%;		
}
#logo{
	position:relative;
	width:15%;
	left: -6%;		
}
.resta{
	display: block;
	position:relative;
	width:80%;
	left: 10%;top: 3vw;
	text-align:center;
	background-color: brown;
	font-size: 3vw;
	color: white;
	top: -55vw;
	font-weight: 600;
	padding: 1vw;
	margin-bottom: 10vw;
}
.tarifes{
	position:relative;
	width:100%;
	top: -60vw;
}
#tarifes{
	position:relative;
	width:100%;
}
}
@media (min-width: 1200px) {
	.foto{
	position: relative;
	left: 1vw;
	width: 5%;
	height: 15vw;
	top: 0vw;
}
#tut{
	position: relative;
	left: 0vw;
	width:6%;
	font-size: 1.3vw;
	top: -1.5vw;
}
#foto{
	width: 100%;
	top: 110vw;
}
.histo{
	position: relative;
	left: 8vw;
	width: 4.5%;
	height: 15vw;
	top: -14.8vw;
}
#hist{
	width: 100%;
	top: 110vw;
}
#historia{
	position: relative;
	left: -0.3vw;
	width: 10%;
	font-size: 1.3vw;
	top: -1.25vw;
}
.icona{
	width: 15%;
}
.veu{
	position: relative;
	left: 96%;
	width: 4%;
	top: -40vw;
}
#veu{
	width: 100%;
}
.icona img{
	position: absolute;
	width: 20%;
	left: 40%;
	top:1vw;
}
.eina{
	position:relative;
	display: block;
	background-color: rgba(189,0,0,1.00);
	color: beige;
	width:90%;
	left: 5%;
	height: 5vw;
	padding: 0vw;
	top: -38vw;
	text-align:center;
	font-size: 2vw;
	font-weight: 600;
}
#eina{
	font-family: 'Encode Sans Expanded', sans-serif;
}
.titular{
	position:relative;
	width:60%;
	left: 20%;
	top: -46vw;
	text-align:center;
	font-size: 2vw;
	font-weight: 600;
}
.adreca{
	position:relative;
	width:80%;
	left: 10%;
	top: -30vw;
	text-align:center;
	color: brown;
	font-size: 2vw;
	font-weight: 600;
}

.parrf{
	position:relative;
	width:80%;
	left: 10%;
	text-align:left;
	font-size: 1.7vw;
	top: -40vw;
}
.alta{
	display: block;
	background-color: brown;
	position:relative;
	width:80%;
	left: 10%;
	text-align:center;
	font-size: 2vw;
	color: lemonchiffon;
	font-weight: 600;
	top: -40vw;
	padding: 0vw;
}
.exemple{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	top: -41vw;
	text-align:center;
	background-color: brown;
	font-size: 2vw;
	color: black;
	font-weight: 600;
	padding: 0vw;
}
.instruccions{
	position:relative;
	width:80%;
	left: 10%;
	top: -43vw;
	text-align:center;
	font-size: 2.5vw;
	font-weight: 600;
}
#inst{
	position:relative;
	width:100%;
	top: -3vw;
}
.pag1{
	display: block;
	position:relative;
	width:50%;
	left: 25%;
	top: -12vw;
}
#pag1{
	position:relative;
	width:100%;
}
#pag2{
	position:relative;
	width:100%;
	top: -30vw;
}
.accedir{
	display: block;
	position:relative;
	width:50%;
	left: 25%;
	top: -39vw;
}
#accedir{
	position:relative;
	width:100%;
}
#accedir2{
	position:relative;
	width:100%;
}
.editor{
	display: block;
	position:relative;
	width:50%;
	height: 96vw;
	left: 25%;
	top: 0vw;
}
#editor{
	position:relative;
	width:100%;
}
#clicant{
	position:relative;
	width:80%;
	left: 10%;
	text-align:center;
	font-size: 2vw;
	top: -54vw;
}
#edicio{
	position:relative;
	width:15%;
	left: -3%;		
}
#plat{
	position:relative;
	width:15%;
	left: -3%;		
}
#paper{
	position:relative;
	width:15%;
	left: -6%;		
}
#impresora{
	position:relative;
	width:15%;
	left: -6%;		
}
#micro{
	position:relative;
	width:15%;
	left: -6%;		
}
#formu{
	position:relative;
	width:15%;
	left: -6%;		
}
#pantal{
	position:relative;
	width:15%;
	left: -6%;		
}
#qr{
	position:relative;
	width:15%;
	left: -6%;		
}
#publi{
	position:relative;
	width:15%;
	left: -6%;		
}
#logo{
	position:relative;
	width:15%;
	left: -6%;		
}
.resta{
	display: block;
	position:relative;
	width:80%;
	left: 10%;
	text-align:center;
	background-color: brown;
	font-size: 2vw;
	color: white;
	top: -50vw;
	font-weight: 600;
	padding: 1vw;
	margin-bottom: 10vw;
}
.tarifes{
	position:relative;
	width:50%;
	left: 25%;
	top: -100vw;
}
#tarifes{
	position:relative;
	width:100%;
}
}