/* Barcelona Mar Hostel ------------------------------------------------*/
html { height: 100%; }
* { /* global settings for every element on the site */ margin: 0;padding: 0;}
body {margin: 0;padding:0;font-family: Arial, verdana, helvetica;font-size: 12px;background-color: #ffffff;}
ul {list-style: none; position: relative;}
img{ border:0;}
h1 { font-size: 24px; color: #99CC00; padding: 10px 0 5px 0; border-bottom: 1px solid #DDDDDD;}
h2 { font-size: 16px; color: #7D7B69; padding: 5px 0 5px 0; }
strong {color: #0065B8;}
b {color: #0065B8;}
.hide{display:none;}
.left{float:left; width:150px; height:100px; display:block; text-align:center;}
.left img{line-height:20px;}
.googlemap .img1{position:absolute; display:none; width:178px; height:64px;}
.googlemap:hover .en, .googlemap:hover .es, .googlemap:hover .de, .googlemap:hover .fr, .googlemap:hover .it
{display:block; background:url(http://www.behostels.com/images08/find-us-en-hover.gif); margin:50px 0 0 205px;}
.clear{clear:both;height:0px;}
.clearfix:after { display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
*+html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac ------------------------------------------*/
* html #wrapper {height: auto;}
#hwrapper {position:relative;display: block;padding: 0;height: 85px;width:100%;background: #ffffff url(images/gris-fondo.gif) repeat-x bottom;text-align: center;}
/*background: #ffffff url(newimages/gris-fondo.gif) repeat-x bottom;\*/
#header {width: 840px;height:85px; margin:0 auto; position: relative; text-align:center;background-image:url(images/barcelona-hostel-top.gif);background-position:top center;background-repeat: no-repeat;}
#header p{padding: 4px 120px 0 0;font-weight: bold;font-size: 12px;color: #ffff99;text-align: right;}
#header p a {color: #426B1D;font-weight: bold;text-decoration: underline;}
#header p a:hover {color: #ffffff;}
#header #navi {margin: 0 0 0 155px;padding-top:21px;text-align: center;}
#navi li {margin:10px;float:left;}
#navi li a {display: block;padding:0;text-decoration:none;color: #0099ff;text-align: center;font-weight: bold;font-size: 16px;}
#navi li a:hover {color:#99CC00;font-size: 16px;}

/* languages -----------------------------------------*/
#languages{width: 100%;height: 30px; text-align:center;margin: 0 auto;position: relative; padding-bottom: 10px;}
#languages ul {height: 28px; padding: 5px 0 0 0; margin: 0 auto; font-size: 14px; text-align: center;}
#languages li {padding: 0 1em 0 1em; display: inline;}
#languages a {color: #0099ff; text-decoration: none;}
#languages a:hover {color: #00417d; text-decoration: underline;}

/* Big Photo top */
#project {height:314px; width:811px; position:relative; margin:0 auto; background:url(images/mar-bg.jpg) no-repeat!important;}
#winter span, #calendar span, #searchbox .title-en span, #searchbox .title-de span, #searchbox .title-fr span, #searchbox .title-it span, #searchbox .title-es span{position:absolute; left:-9999px;}

.location { background: url(images/photos/hostelmap.jpg) top left no-repeat;}
.prices { background: url(images/photos/hosteldorm.jpg) top left no-repeat;}
.groups { background: url(images/photos/hostelgroups.jpg) top left no-repeat;}
.groupthanks { background: url(images/photos/hostelthanks.jpg) top left no-repeat;}
.sitemap { background: url(images/photos/hostelsitemap.jpg) top left no-repeat;}
.links { background: url(images/photos/hostelinks.jpg) top left no-repeat;}
.calendary{ background: url(images/photos/barcelonacal.jpg) top left no-repeat;}
.activities { background: url(images/photos/hostelactivities.jpg) top left no-repeat;}
.photogallery { background: url(images/photos/hostelgallery.jpg) top left no-repeat;}

#project ul {display: block; text-align: right; line-height: 24px;font-size: 18px; margin: 26px 40px 0 0; float:right; color:#463620;}
.offer a {text-decoration: underline; color: #a5451a;}
.offer a:hover {text-decoration: underline; color: #f6a916;}
.price{ font-size: 48px; font-weight: bold; line-height: 40px;}
.bed{ font-size: 42px; font-weight: bold; line-height: 40px;}
.room{ font-size: 28px;line-height:20px; padding-bottom: 5px;}
.break{ font-size: 16px;line-height:20px;}
.person{ font-size: 14px;line-height:20px;}

/*contenedor de contenido NUEVO 2008*/
#gallery {height: auto;width:750px;position:relative;margin: 10px auto 15px auto; text-align:center;}
#wrapper {height: auto;width:800px;position:relative;margin: 0 auto;padding: 0 0 10px 0; text-align: left;}
#wrapper p {margin: 10px 0 10px 0; color:#7D7B69; line-height:20px; text-align:left;}
#left {width: 199px; height: auto;position: relative; margin-right: 15px; text-align:left; float: left; background-color: #F7F7F7; padding: 0 8px 0 8px;}
/* left comments */ 
#left #comments {height: auto; width:auto; padding: 0;position:relative; color: #D0B55C; margin: 10px 0 0 0; padding-right: 10px;border-bottom: 1px solid #dddddd;}
#left #comments p{line-height:16px; font-size: 11px; padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px dotted #80D8FF; color:#6C7C89;}
#left #comments p.button {border: none; font-size: 10px;}
#left #comments h3{font-size: 12px; color: #004A9F; text-align:left; margin: 0; width: auto; font-weight: normal;}
#left #comments .date {float: right; font-size: 11px;color: #004A9F;}
#left .here {color: #003361;}
#left a { text-decoration: none; color: #009EE0;}
#left a:hover { text-decoration: none; color: #006DBA;}
#left h2 { font-size: 16px; color: #009EE0; padding: 5px 0 10px 0; margin: 5px 0 0 0; border-bottom: 1px solid #dddddd;}

#left ul{ margin: 5px 0 10px 0; line-height:23px; color: #898989; border-bottom: 1px solid #dddddd;}
#left li{line-height:23px;}
#left div.box {height: auto;width:auto;position:relative; margin: 10px 0 10px 0; padding:5px 0 5px 0; border-top: 1px solid #dddddd;border-bottom: 1px solid #dddddd;}
#left div.box  h3 {color:#ffffff; font-size: 14px; margin-bottom: 7px;padding: 5px; background-color: #009ee0;}
#left div.box p{margin: 7px; line-height:18px; padding-bottom: 7px; border-bottom: 1px dotted #dad2b3;}

#left div.movie {height: auto;width:209px;position:relative; margin: 10px 0 10px 0; padding:3px; text-align: center;}

#right {height: auto;width:560px;position:relative; float: right; }
#right ul{ margin: 10px; line-height:21px; color: #504330;}
#right li{border-bottom: 1px dotted #dad2b3; padding-left: 30px; padding-bottom: 5px;}
#right h2 {font-size: 14px; font-weight:lighter; color: #6ABDD2; text-align:left; margin: 16px 0 5px 0; width: 500px;}
#right h3 {font-size: 19px; font-weight:lighter; color: #27A6CE; text-align:left; margin-top: 5px;}
	
select { background-color: #ffffff; color: #0099ff; margin: 5px 0 5px 0;}
input.blue{background-color: #0099ff; font-size: 11px; color: white; margin: -2px 0 5px 0;}

/* Blog and News */
#right .blog {width: auto; height: auto; padding-bottom: 5px; margin: 5px 0 5px 0; border-bottom: 1px dotted #9CBED3;}
#right .blog img { border: 2px solid #9CBED3; margin-top: 10px;}

/* Hostel Comments   */ 
#right #comments {width: auto; height: auto; padding-bottom: 5px; margin: 0 0 5px 0;}
#right #comments p{ border-bottom: 1px dotted #80D8FF;padding-bottom: 10px; }
#right #comments .date { font-size: 12px;color: #965318;}

/*fotogallery*/
div.thumb {margin: 5px 5px 5px 5px;border: 1px solid #E6E6E6;height: auto;float: left;text-align: center;}	
.thumb img{display:inline;margin: 3px;}
.phototitle {text-align: center;margin: 3px; letter-spacing: 1px; font-size: 10px;}

/* Contenido bed ----------------------------------------------*/
#wrapperb {height: 850px;	width:798px;position:relative;padding: 0 0 10px 0;margin: 0;text-align: left;background: #f4f2e5;border-left: 1px solid #dad2b3;border-right: 1px solid #dad2b3;}
#wrapperb ul {list-style: none;margin-top: 10px;margin-left: 340px;padding-left: 1em;text-indent: -1em;font-size: 12px;color:#7D7B69; line-height:20px;text-align:left;}
#wrapperb h3 { font-family: Arial, Verdana, helvetica;font-size: 18px;color: #D99B1C;padding: 15px 0 10px 20px;margin-left: 30px;margin-right: 30px;border-bottom: 1px solid #dad2b3;}
#wrapperb h2 { font-family: Arial, Verdana, helvetica;font-size: 16px;color: #D99B1C;padding: 10px 0 0 20px;margin-left: auto;margin-right: 30px;border-bottom: 1px solid #dad2b3;}
#wrapper p.tres {margin-left: 400px;font-size: 10px;color:#444; line-height:16px;text-align:right;}
#tabla{height: 300px;	width:800px;padding: 0;margin: 5px 10px 0 0;text-align: center;color:#7D7B69;}
#tabla h2 { font-size: 16px;color: #0099ff;padding: 0;text-align: center;border-bottom: 1px solid #dad2b3;}
#base {border-left: 1px solid #dad2b3;margin: 5px 0 0 0;width: 90px;padding: 0;float:left;font-size: 9px;color:#7D7B69;text-align:center;}
#base ul {list-style: none;margin-top: 3px;margin-left: 0;padding-left: 1em;padding-bottom: 5px;text-indent: -1em;line-height:28px;text-align:center;border-bottom: 1px solid #dad2b3;}
#basetit{margin: 5px 0 0 0;width: 180px;padding: 0;float:left;font-size: 9px;color:#7D7B69;text-align:center;}
#basetit ul {list-style: none;margin-top: 3px;margin-left: 0;padding-left: 1em;padding-bottom: 5px;text-indent: -1em;text-align:center;line-height:28px;border-bottom: 1px solid #dad2b3;}
ul.tabla {list-style: none;margin-top: 200px;margin-left: 0;line-height: 16px;color: #0068AE;font-size: 12px;}
/*request for groups 2008-------*/
#request {height: auto;	width: auto;position:relative;margin: 5px auto 5px auto;padding: 5px 20px 20px 20px;text-align:center;color: #0068AE;font-size: 12px;border: 1px solid #DBDBDB;}
#request h2 { font-size: 16px;color: #0099ff;padding: 5px 0 5px 0;margin-left: 30px;}
#request p.big{font-size: 10px;color:#0099ff; text-align:center;}
#request p{margin: 5px 0 0 30px;font-size: 12px;color:#7D7B69;text-align:left;}
#request fieldset { margin: 0 0 10px 0; padding: 1em .5em .5em 30px; border: 1px dashed #0099ff; text-align:left;font-size: 10px;color:#7D7B69;} 
#request legend { padding: 10px;font-weight: bold;font-size: 12px; color: #0099ff;background-color: #ffffff;} 
#request input { border: 1px solid #0099ff;background-color: #F8F8F8;margin: 3px 0 3px 0;} 
label{float: left;width: 120px;font-size: 12px; color: #0068AE;margin: 3px 0 3px 0;}
label.number{position: relative;width: 120px;}
textarea{width: 250px;height: 90px;border: 1px solid #0099ff;background-color: #F8F8F8;}
#request p.med{font-size: 10px;margin:0 0 15px 0;}
br{ clear: left; }
/* 3 columns ------------------------------------------------ */
p.country  {float: right;font-size: 12px;color: #0099ff;}
p.country  a {font-size: 12px;color: #0099ff;text-decoration: underline;}
p.country  a:hover {font-size: 12px;color: #99CC00;text-decoration: underline;}
#board{	height: auto;width:800px;margin: 5px 0 5px 0;text-align: center;font-size: 11px;color:#7D7B69;border-bottom: 1px solid #dad2b3;}
#board a {text-decoration:none;color: #0099ff;}
#board a:hover {color:#99CC00;}
h4 {text-align: center;	font-size: 18px;color: #0099ff;padding: 10px 0 10px 20px;border-bottom: 1px solid #0068AE;}
#board1 {width: 250px;	height: auto;padding: 5px 0 5px 0;float:left;text-align:center;}
#board2 {width: 350px;height: auto;	padding: 5px 0 5px 0;float:left;text-align:left;overflow: auto;}
#board3 {width: 200px;height: auto;padding: 5px 0 5px 0;float: left;}
.hostel {border: 0;}
/* menu footer -----------------------------------------*/
#navidown {width: 100%;height: 30px; text-align:center;margin: 0 auto;position: relative;}
#navidown ul {height: 28px; padding: 5px 0 0 0; margin: 0 auto; font-size: 16px; text-align: center;}
#navidown li {padding: 0 1em 0 1em; display: inline;}
#navidown a {color: #0099ff; text-decoration: none;}
#navidown a:hover {color: #00417d; text-decoration: underline;}
/* pie de pagina + credito -----------------------------*/
#footer {width: 810px;height: 124px;position: relative;	padding: 5px 40px 0 0;margin: 0 auto;color: #0099ff;background: #ffffff url(../newimages/barcelona-hostel-fun.gif) no-repeat bottom center;}
#footer a {color: #0099ff;text-decoration: none;font-size: 11px;font-weight: bold;padding: 5px 7px 0px 7px;	}
#footer a:hover {color: #99CC00;font-weight: bold;text-decoration: none;font-size: 11px;}
#izqfoot{width:370px;height:auto;margin: 0 0 0 0;float:left;padding:0;}
#footer ul {list-style: none;margin: 15px 0 0 30px;padding: 0;text-indent: 0;text-align:left;font-size: 11px;line-height: 15px;	}
/* logos + links ----------------------------------------*/
#partners {	width: 100%;height: 90px;margin-top: 0;	position: relative;	text-align:center;padding: 10px 0 10px 0;border-top: 1px solid #DBDBDB;background: #ffffff url(../newimages/gris-top-foot.gif) repeat-x top;}
#partners p{color: #999999;	font-size: 11px;text-align:center;}
#sponsor {width: 100%;height: 60px;position: relative;text-align:center;background: #ffffff;padding-bottom: 0;color: #eae5ce;font-size: 10px;}
#extras {width: 100%;height: 15px;margin-top: 10px;	position: relative;	text-align:center;background: #ffffff;padding-bottom: 0;color: #999999;font-size: 11px;}
#extras a {color: #999999;}
#extras a:hover {color: #99CC00;}
/* end + certificados -------------------------------------*/
#end {width: 100%;height: 100px; margin-top: 15px;position: relative;text-align:center;font-size: 11px;word-spacing: 2px;color: #000000;padding: 5px 0 0 0;background: #f4f7f8 url(images/grisgris.gif) repeat-x top;}
#end a {color: #0099ff;}
#end a:hover {color: #99CC00;}
#end p {width: 800px; margin: 10px auto; line-height:14px; color: #526f7e;}
/* Misc -------------------------------------------------------- */
.logoleft {float: left;margin: 0px;}
.logoright {float: right;border: 0;}
.imgleft {float: left;margin: 8px 0 0 5px;}
.work {float: right;margin: 15px 0 0 0;border: 0;}
.bestg {float: left;margin: 15px 0 9px;border: 0;}
.imgBorder {border-color: #D4C9A4;border-width: 1px;border-style: solid;background-color: #FFF;padding: 5px;}
.tablax{float: left;margin: 5px 0 0 150px;border: 0;}
.wifi {margin: 0 0 -2px 0;}

/*---- activities --- */
hr {border: 0;color: #9E9E9E;background-color: #9E9E9E;height: 1px;width: 100%;text-align: center;margin: 10px 0 5px 0;}

/* prices for Barcelona Mar hostel */
#prices { float: right; width:560px; height:auto; margin:15px auto 20px auto; padding: 1px 1px 10px 1px; background-color:#f4fcff; border: 1px solid #ebeced;text-align:center;}
#prices .title{font-size: 16px;text-align:center;line-height:18px;color: #009ee0;padding: 5px;}
#prices .info{line-height:12px;color: #174b80;text-align:center;}
#prices .extra{line-height:18px;color: #f55e35;text-align:center}								
table {width:100%;border-collapse:collapse;margin-bottom: 10px;}
caption {color: #115eac;letter-spacing:.1em;margin:5px 0 5px 0;padding: 5px 0 5px 0;caption-side:top;text-align:center;}	
tr.odd td{ background:#c7f1ff;}
tr.odd .column1	{ background:#c7f1ff;}	
.column1{ background:#dff1f5;}
td {color:#174b80;border-bottom:1px solid #c6dce3;border-left:1px solid #c6dce3;padding:3px;text-align:center;}				
th {color: #009ee0; background:#3693d2;text-align:left;border-bottom: 1px solid #c6dce3;padding-left: 5px;}							
thead th {background:#008bce;text-align:center;color:#ffffff;}
#prices hr{border:dotted 1px #c6dce3; height: 1px; margin-left:10%;margin-right:10%;}
#prices p{text-align:center}

.hide{display:none;}


#winter{background:url(images/free-banner.gif) no-repeat;}
#winter, .es #winter{display:block; position:absolute; width:390px; height:83px; margin:220px 0 0 412px;}
.es #winter{background:url(images/free-banner.gif) no-repeat;}


#searchbox {position:absolute; width:230px; margin:11px 0px 0px 15px; font-family:verdana, arial, helvetica, sans-serif; line-height:1.3em; font-size:105%;}
#searchbox select{background-color:#fff; font-size: auto; color:#036;}
#searchbox .top{background:url(images/bg-top-search.gif) no-repeat; height:37px;}
#searchbox .center{background:url(images/bg-search.gif) repeat-y;}
#searchbox .content{margin:0 15px; padding-top:23px;}
#searchbox .bottom{background:url(images/bg-bottom-search.gif) no-repeat; height:37px;}
#searchbox .title-en, #searchbox .title-es, #searchbox .title-it, #searchbox .title-fr, #searchbox .title-de{position:absolute; width:200px; height:40px; margin:17px 0 0 15px;}
#searchbox .title-en{background:url(images/reservation-en.gif) no-repeat;}
#searchbox .title-es{background:url(images/reservation-es.gif) no-repeat;}
#searchbox .title-it{background:url(images/reservation-en.gif) no-repeat;}
#searchbox .title-de{background:url(images/reservation-en.gif) no-repeat;}
#searchbox .title-fr{background:url(images/reservation-en.gif) no-repeat;}
#searchbox label{font-weight:bold; color:#049; font-size:95%; width:auto; float:none;}
#searchbox .left{width:auto; height:auto; text-align:left;}
#searchbox select{margin-right:5px; font-size:95%; padding:1px;}
#searchbox select{border:1px solid #06a8da;}
#searchbox #hostel{width:198px; margin-bottom:12px;}
#searchbox #arrival, #searchbox #nights{margin-bottom:12px;}
#calendar{float:right; margin-top:3px; display:block; width:27px; height:23px; background:url(images/icon-calendar.gif) no-repeat; position:relative;}

#check-availibility{margin-top:12px; position:relative; z-index:1; text-align:center;}
#check-availibility a{position:relative;}

.link-button{text-align:center;}
.link-button a{background:url(images/button-right.gif) no-repeat right; color:#246f9d; text-decoration:none; padding:7px 10px 6px 0; font-weight:bold;}
.link-button a span{position:relative; left:auto; background:url(images/button-left.gif) no-repeat; padding:7px 0 6px 10px; margin-left:-2px;}
.link-button a:hover,.link-button a:focus{background:url(images/button-right-hover.gif) no-repeat right; color:#000;}
.link-button a:hover span, .link-button a:focus span{background:url(images/button-left-hover.gif) no-repeat;}
.link-button a:active{background:url(images/button-right-click.gif) no-repeat right; color:#fff;}
.link-button a:active span{background:url(images/button-left-click.gif) no-repeat;}