body, html{
	width: 100%;
	height: 100%;
}
 

@font-face {
    font-family: "sister";
    src: url(sister.ttf);
}

@font-face {
    font-family: "turn";
    src: url(turncoat.ttf);
}

@font-face {
    font-family: "incoregu";
    src: url(incoregu.ttf);
}
@font-face {
    font-family: "incobold";
    src: url(incobold.ttf);
}


body{
	background-image: url("images/fondomio.jpg");
	background-size: 100% 100%;
	background-repeat: vertical;
	/*overflow per a que no surti la barra*/
	/*overflow:hidden;*/
}

#pagina{
	margin: auto;
	width: 80%;
	height: 100%;
}

#pagina2{
	margin: auto;
	width: 80%;
	height: 130%;
}

#top{
	width: 80%;
	height: 100%;
	float:right;
	/*border: 3px solid blue;*/
}

#toptop{
	width: 80%;
	height: 12%;
	margin: auto;
	/*border: 3px solid blue;*/
}

/*especial per a que no es descuadri sobre mi*/

#topsobre{
	width: 80%;
	height: 9%;
	margin: auto;
	/*border: 3px solid red;*/
}

#logomeu{
	float: left;

}

#nommeu{
	float: left;

}

#linkedin{
	float:right;
	margin-top: 3%;
}

#linkedin1{
	float:right;
	padding-right: 10%;
}

#menusup{
	clear:all;
	background-color:#008282;
	height: 30px;
	width: 100%;
	font-family: "sister";
	letter-spacing: 0.1em;
/*	border: 3px solid black;*/
}

#menusobre{
	clear:all;
	background-color:#008282;
	height: 30px;
	width: 100%;
	font-family: "sister";
	letter-spacing: 0.1em;
/*	border: 3px solid black;*/
}



#contenido{
	clear:all;
	background-color: #e6f2ff;
	width: 100%;
	height: 75%;
	color:#03605D;
	font-family: "incoregu";
}


#contenido3{
	clear:all;
	background-color: #e6f2ff;
	width: 100%;
	height: 75%;
	color:#03605D;
	font-family: "incoregu";
	border: 2px solid #e6f2ff;
}

#contenido2{
	clear:all;
	background-color: #e6f2ff;
	width: 100%;
	height: 100%;
	color:#03605D;
	font-family: "incoregu";
}

#conten{
		
		font-size: 1.2em;
		text-align: justify;
		width:80%; 
		height:100%;
		margin:auto;
		padding-top: 10%;
		/*border:3px solid red;*/
}

#contenidocontacto{
	clear:all;
	background-color: #e6f2ff;
	width: 100%;
	height: 75%;
	color:#03605D;
	font-family: "incoregu";
}


#gemma{
	float: left;

}

.textoinicio{
	float: right;
	width: 70%;
	margin-top: 2%;
}

.hache1 {
	font-size: 1.5em; 
}

.hache2{
	font-family: "incobold";
}

div a{
	text-decoration:none;
}


ul{
	list-style:none;    /*no quiero viñetas*/
		/*border: 1px solid black;*/
}

.menu1{
	width: 90%;
	height: 100%;
	margin:auto;
	font-size: 1.2em;
	/*border: 3px solid black;*/
}


.menu1 li a{
/*a los hipervinculos que esten dentro de li y con la clase menu*/
	background-color:#008282;
	color: white;
	text-decoration:none;
	/*border: 1px solid black;*/
	display:block;

}

.menu1 > li{
	/*los li que dependen de la clase menu*/
	float:left;
	margin-left: 12%;
	margin-right: 5%;
	/*border: 1px solid red;*/
}

#inici{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}

#proy{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}

#sobre{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}

#cont2{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}




/*#cont{
	padding-top: 8%;
	padding-bottom: 9%;
	padding-left: 10%;
	padding-right: 10%;
	border: 1px solid red;
	width: 90%;
}*/

.menu1 li a:hover{
	background-color: #887CB9;
}

.activo{
	background-color: #887CB9!important;
}

.menu1 li ul{
	display:none;
	position:absolute;
	width: 140px;
}

.menu1 li:hover > ul{
	display: block;
}

#footer{
	width: 100%;
	height: 8%;
	font-size: 1.2em;
	color: #008282;
	font-family: "sister";
	/*border: 3px solid black;*/
}

.izquierda{
	float: left;
	margin-left: 10%;
	margin-top: 1%;
	/*border: 3px solid black;*/
}

#linkedin2{
	float: right;
	margin-top: 0.5%;
	margin-right: 5%;
	}

.sobre1{
	width: 100%;
	height: 33%;
	padding-top: 2%;
}

.sobre2{
	width: 100%;
	height: 33%;
}

.sobretextod{
	float: right;
	width: 60%;
	padding-top: 5%;
	padding-right: 7%;
		height: 80%;
	text-align: justify;
}

.sobretextoi{
	float: left;
	width: 60%;
	height: 80%;
	text-align: justify;
}

#conten2{
		font-size: 1.2em;
		text-align: justify;
		width:90%; 
		height:100%;
		margin:auto;
}

.izquierda{
	float:left;
}

.izquierda2{
	clear:all;
	float:left;
}

.derecha{
	float: right;
}

.bordenegro{
	border: 1px solid black;
}

.borderojo{
	border: 3px solid red;
}

.tamano{
	width: 30%;
	height: 100%;
}

div.polaroid {
    width: 290px;
    padding: 10px 10px 0px 10px;
    border: 1px solid #BFBFBF;
    background-color: white;
    box-shadow: 10px 10px 5px #aaaaaa;
}

div.rotate_right {
    -ms-transform: rotate(3deg); /* IE 9 */
    -webkit-transform: rotate(3deg); /* Safari */
    transform: rotate(3deg);
}

div.rotate_left {
    -ms-transform: rotate(-3deg); /* IE 9 */
    -webkit-transform: rotate(-3deg); /* Safari */
    transform: rotate(-3deg);
}

.caption{
	font-family: "turn";
}

.descarga{
	float: right;
	background:    #008282;
	background:    -webkit-linear-gradient(#008282, #0A9B94);
	background:    -o-linear-gradient(#008282, #0A9B94);
	background:    linear-gradient(#008282, #0A9B94);
	border-radius: 5px;
	padding:       8px 20px;
	color:         #ffffff;
	display:       inline-block;
	font:          normal 700 24px/1 "incoregu", sans-serif;
	text-align:    center;
	text-shadow:   1px 1px #000000;
}

.vert1{
	clear: all;
	float:left;
	width: 28%;
	height: 80%;
	margin-left: 3%;
	margin-top: 5%;
	/*border: 2px solid black;*/
}

.imagenmed{
	width: 300px;
	height: 300px;
	margin-left:50px;
}

.vert2{
	float:left;
	width: 28%;
	height: 80%;
	margin-left: 5%;
	margin-top: 5%;
}

.protexto{
	width: 80%;
	margin:auto;
}

.visitar{
	margin:auto;
	background:    #008282;
	background:    -webkit-linear-gradient(#008282, #0A9B94);
	background:    -o-linear-gradient(#008282, #0A9B94);
	background:    linear-gradient(#008282, #0A9B94);
	border-radius: 5px;
	padding:       8px 20px;
	color:         #ffffff;
	display:       inline-block;
	font:          normal 700 24px/1 "incoregu", sans-serif;
	text-align:    center;
	text-shadow:   1px 1px #000000;
	margin-top: 5%;
	margin-left: 25%;
	
}

.textoinicio:hover{
	color: #e6f2ff;
}

.visi{
	color:#03605D;
}

.formulariog{
	margin:auto;
	position:relative;
	top: 10%;
	width: 60%;
	height: 80%;
	border-radius: 25px;
	background-color: white;
	border: 2px solid grey;
}

#contform{
	width: 90%;
	height: 80%;
	
}

/*canvi de mida del menu per a que no deformi a la pag contacto*/

#inici3{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}

#proy3{
	padding-top: 3px;
	padding-bottom: 3px;
		padding-left: 10px;
	padding-right: 10px;
}

#sobre3{
	padding-top: 3px;
	padding-bottom: 3px;
		padding-left: 10px;
	padding-right: 10px;
	
}

#cont3{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 10px;
	padding-right: 10px;
}


.botocentrat{
	width: 15%;
	margin:auto!important;
}

.derechamed{
	float:right;
	margin-right: 75px;
	margin-top: 5px;
}

.izquierdamed2{
	clear:all;
	float:left;
	margin-left: 75px;
	margin-top: 5px;
}