@font-face {
 font-family: Qlassik;
 src: url('fonts/Qlassik_TB.eot');
 src: local('Qlassik'),
		url('fonts/Qlassik_TB.otf') format('opentype'),
		url('fonts/Qlassik_TB.ttf') format('truetype');
}
@font-face { 
	font-family: Yanone;
	src: url('fonts/YanoneKaffeesatz-Regular.eot');
	src: local('Yanone'),
		url('fonts/YanoneKaffeesatz-Regular.otf') format('opentype'),
		url('fonts/YanoneKaffeesatz-Regular.ttf') format('truetype');
}

body { font:normal 12px Verdana, Arial, Helvetica, sans-serif; background:black url('../../img/deg-sky.png') repeat-x; height:100%;margin:0; color:#000; }
acronym { border-bottom: 1px dashed white; cursor:help; }
p { margin:5px 0px }
li { margin-left:20px }
.clear { clear: both }
.pujar { text-align:right; padding:10px }
.bold { font-weight:bold }

#skyline { width:800px; height:300px; background: transparent url('../../img/tarragonaskyline.png') no-repeat; margin: 0px auto 0px auto; }
.inf { width:800px; height:420px; margin: auto; color:white }

.boxes { float:left; width:250px; height:100px; text-align:right; font-family: Qlassik, Arial, Tahoma, sans-serif; font-size:120%; padding-right:10px; border-right: 1px solid #383838; border-bottom: 1px solid #383838; }
.boxes a { color:#3079b4; text-decoration:none; width:100%; font-family: Yanone; font-size:350%; display:block; }
.boxes p { text-align:right }
.boxes a:hover { color:#eba000 }
.boxes:hover { background: transparent url('../../img/deg-blanc.png') repeat-x; }

#container .featured { float:left;width:235px; font-family: Qlassik, Arial, Tahoma, sans-serif; font-size:150%; margin-top:20px; text-align:center }
#container .rollo { float:left;width:490px; font-family: Qlassik, Arial, Tahoma, sans-serif; font-size:120%; margin-top:20px; text-align:left }
#container .social { float:left;width:300px; height:255px; font-family: Qlassik, Arial, Tahoma, sans-serif; font-size:120%; margin-top:20px; text-align:right; background: url('../../img/fonstwitter.png') no-repeat bottom right; }

#container #twitter_update_list { text-align:left; color:white; margin-left:55px; margin-top:90px; width:150px; font-size:90%; }
#container #twitter_update_list li { list-style:none; margin:0px; padding:0px; }


#contacte { width:800px; margin:auto;background:white; color:black; }

#formularicontacte { margin:10px; padding:5px; float:left; background:url('../../img/formulari.png') top right no-repeat; }
#formularicontacte h1 { font-family:Yanone, Arial, Tahoma, sans-serif;font-size:300%; } 
#formularicontacte form { margin-top:15px }
#formularicontacte label { float: left; text-align: right; margin-right: 0.5em; display: block }
#formularicontacte input[type="text"] { width:120px; border:1px solid #eba000; padding-left:3px } 
#formularicontacte input[type="text"]:hover, #formularicontacte textarea:hover { background: #eba000; color:white; }
#formularicontacte textarea { width:300px; height:260px; padding-left:3px; border:1px solid #eba000; } 
#formularicontacte input[type="submit"] { font-weight:bold } 
#formularicontacte li { padding:5px 0px; }
#formularicontacte span { font-style: italic; font-size:80%; }

#jomateix { float:right; width:390px; margin:0px 10px; padding-top:20px; background:url('../../img/socjo.png') bottom right no-repeat; font-size:90%; }
#jomateix a, #footer a,  #twitter_update_list a { text-decoration:none;  color:#eba000; }
#jomateix a:hover, #footer a:hover,  #twitter_update_list a:hover { text-decoration:underline; }
#jomateix .lafoto { float:right; margin:5px; }

#portfolio { width:800px;  margin: auto;background:black; color:white }
#portfolio h1, #footer h1 { font-family:Yanone, Arial, Tahoma, sans-serif;font-size:300% }

.enviat { color: #007700; }
.portimage { float:left; margin:10px 0px; padding:4px; border:10px solid #1F374B;  background:black; }
.portimage:hover { border:10px solid #3079b4; }
.porttext { float:left; margin:10px 0px 0px 10px; width:300px; }
.porttext a { font-family:Qlassik, Arial, Tahoma, sans-serif; font-size:250%; color:#eba000; text-decoration:none; }
.porttext a:hover { text-decoration: underline }

#footer { width:800px; margin:auto; color:white; }
