/* barcelona sound hosel made by mandrill studio from Barcelona*/
html { height: 100%; }
* { /* global settings for every element on the site */margin: 0; padding: 0;}
body {margin: 0; padding:0; font-family: Helvetica, geneva, Arial,sans-serif; font-size: 13px; color: #323339; position: relative; background-color: #F9CCAB;background-image: url(images/fondo.jpg); background-position: top center; background-repeat: repeat-x;}
ul { position: relative;}
img {border:0;}
.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;}
.logo {float:left; margin-bottom: 20px;}
.arrow {float: left; margin: 50px 40px 0 20px;}
.animation {float: right;}
.text {font-size: 17px; font-weight: lighter;}
.flag {float: left; margin-right: 15px;}

/*top part slogan and sign-in for homepage */
#top {width: 800px;height:143px; position: relative; padding: 0; margin: 0 auto;}
#contop {width: 800px;height:auto; position: relative;margin: 1px auto; text-align: center;}
#contop ul { font-size: 18px; text-align: center; list-style:none; }
#contop li {display: inline; margin: 0 10px;}
#contop a {font-weight: lighter; color:#1E0B00; text-decoration: none;}
#contop a:hover {color:#5C2300; text-decoration: none;}
#contop a:active {text-decoration: none; color:#623812;}

/*behostels signature */ 
#clip {width:118px;height:53px; position: relative; padding: 0; margin-top: 15px; float: left;}


/*top part slogan and sign-in for CONTENT PAGES */
#tv_banner {width: 900px; height:338px; padding: 0 22px 0 22px; position: relative; margin: 2px auto 0 auto; }
#tv_banner #flags {width:200px;height:11px; position: relative; padding: 0; margin: 5px 10px 0 0; float: right; text-align: right;}
#tv_banner #flags img{margin-left: 10px;}
#tv_banner #youtube {width:403px;height:248px; position: relative; padding: 0; margin: 38px 0 0 57px; float: left;}
.home { background-image: url(images/bkg_banner.jpg); background-position: top; background-repeat: no-repeat; }
.gossip { background-image: url(images/bkg_banner02.jpg); background-position: top; background-repeat: no-repeat; }
.location { background-image: url(images/bkg_banner03.jpg); background-position: top; background-repeat: no-repeat; }
.rooms { background-image: url(images/bkg_banner04.jpg); background-position: top; background-repeat: no-repeat; }
.groups { background-image: url(images/bkg_banner05.jpg); background-position: top; background-repeat: no-repeat; }
.photos { background-image: url(images/bkg_banner06.jpg); background-position: top; background-repeat: no-repeat; }

#contentop {width: 950px;height:246px;	position: relative;	padding: 0 16px; margin: 0 auto; background-image: url(images/bkg_netman02.jpg); background-position: right; background-repeat: no-repeat;}
#contentop ul.menu {width:450px; float: right; font-size:14px; text-align: right; list-style:none; margin-top: 17px; letter-spacing: 1px;}
#contentop ul.menu li {display: inline; margin: 0 10px;}
#contentop ul.menu li.last {display: inline; margin: 0 0 0 10px;}
#contentop ul.menu a {font-weight: lighter; color:#ffffff;}
#contentop ul.menu a:hover {color:#ffffff; padding-bottom: 5px; border-bottom: 5px solid #F26921;}
#contentop h2 {color:#B1CDE3; font-size: 28px; font-weight: lighter; text-align:left; width: 600px;}

/* container for the content page */
#container {width: 944px; height:auto; margin: 0 auto; position: relative; padding-bottom: 10px; font-size: 13px; background-color:#F8FCFF;  background-image: url(images/bkg_container.gif); background-position: top center; background-repeat: repeat-y;}
#bodycontent {width: 950px; height:auto;position: relative;margin: 0 auto;padding: 7px 0 7px 0; text-align: left;}
#left {width: 221px; position:relative; height: auto; padding-left: 22px; float: left; background-image: url(images/bkg_left.gif); background-position: top center; background-repeat: repeat-y;}
#left h2{font-size: 18px; color: #96541D; text-align:left; border-bottom: 1px dotted #624013; padding: 0 0 6px 8px; margin-bottom: 8px;}
#left h3{font-size: 18px; color: #184E85; text-align:left; margin: 20px 0 12px 0;}
#left a { text-decoration: none; color: #FF9002;}
#left a:hover { text-decoration: none; color: #96541D;}
#left strong {color:#FF9002; font-weight: bold;}
#left b {color:#FF9002; font-weight: bold;}

/* left comments */ 
#left #comments {height: auto;width:auto;padding: 0 10px;position:relative; color: #D0B55C; border-bottom: 1px dotted #624013; margin-bottom: 10px;}
#left #comments p{line-height:16px; font-size: 11px; padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px dotted #624013; color:#C2824C;}
#left #comments p.button {border: none; font-size: 10px;}
#left #comments h3{font-size: 12px; color: #965318; text-align:left; margin: 0; width: 120px; font-weight: normal;}
#left #comments .date {float: right; font-size: 11px;color: #965318;}
#left .here {color: #D0B65D;}

/* right comments */ 
#right #comments {width: 500px; height: auto; padding-bottom: 5px; margin: 0 0 5px 112px;}
#right #comments p{line-height:16px; font-size: 11px; padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px dotted #624013; color: #3B1D09;}
#right #comments .date { font-size: 12px;color: #965318;}

/* ADDRESS */ 
#left #address { height: auto;width:auto;padding: 0;position:relative; color: #965318; font-size: 11px; margin-bottom: 5px;}
#left #address ul { display: block; line-height:16px; text-align:left; width: auto; list-style: none; margin: 0 0 10px 10px;}
#left #address li { padding-bottom: 2px; }

#right{width: 668px; height: auto;position:relative; padding: 0 1px 5px 0;  float: right; /*background-image: url(images/bkg_right.gif); background-position: top center; background-repeat: repeat-y;  border-top: 1px solid #000000;*/}
#right select { color: #F26922; margin-top: 5px}
#right .active { margin: 6px 0 14px 0;}
#right .minifot {float: left; border-right: 1px solid #623913; margin-right: 25px;}

/* standares right */
#right #stand { width: 500px; height: auto; padding-bottom: 5px; margin: 0 0 5px 112px;}

#right h1 {font-size: 34px; font-weight:lighter; color: #FADD5F; text-align:left; padding-top: 12px; width: 530px;}
#right h1.special {font-size: 34px; font-weight:lighter; color: #FADD5F; text-align:left; padding-top: 12px; width: 600px;}
#right h2 {font-size: 14px; font-weight:lighter; color: #3B1D09; text-align:left; margin: 16px 0 5px 0; width: 500px;}
#right h3 {font-size: 19px; font-weight:lighter; color: #3B1D09; text-align:left; margin-top: 5px;}
#right h4 {font-size: 16px; color: #FADD5F; text-align:left; font-weight: lighter;}

#right p { color: #3B1D09; margin: 5px 0 10px 0; line-height: 20px;}
#right #stand img { border: 2px solid #623812;}
#right #stand .wifi {margin: 0 0 -2px 0; border: none;}
#right #stand .map {border: none;}

/*background index*/
#right #one {width: 668px; height: 82px; padding: 0; margin-bottom: 0; background-image: url(images/bkg001.gif); background-position: top right; background-repeat: repeat-y;}
#right #two {width: 668px; height: 82px; padding: 0; margin: 15px 0; background-image: url(images/bkg002.gif); background-position: top right; background-repeat: repeat-y;}
#right #three {width: 668px; height: 82px; padding: 0; margin-bottom: 15px; background-image: url(images/bkg003.gif); background-position: top right; background-repeat: repeat-y;}
#right #four {width: 668px; height: 82px; padding: 0; margin-bottom: 15px; background-image: url(images/bkg004.gif); background-position: top right; background-repeat: repeat-y;}
#right #five {width: 668px; height: 82px; padding: 0; margin-bottom: 15px; background-image: url(images/bkg005.gif); background-position: top right; background-repeat: repeat-y;}
#right #six{width: 668px; height: 82px; padding: 0; margin-bottom: 15px; background-image: url(images/bkg006.gif); background-position: top right; background-repeat: repeat-y;}
#right h2.welcome {font-size: 28px; font-weight:lighter; color: #FADD5F; text-align:left; padding-top: 9px; width: 510px; margin-left: 112px;}
.title {color:#CC6B00;}
#right strong{color: #3B1D09;}
#right b{color: #3B1D09;}

#right a { text-decoration: none; color: #3B1D09;}
#right a:hover { text-decoration: none; color: #CC6B00;}
#right ul { display: block;line-height:24px;text-align: left;color: #3B1D09; list-style: none; margin: 10px 0 10px 0;}
#right li { padding-bottom: 5px; margin: 5px 0 5px 0; border-bottom: 1px dotted #3B1D09; }
#right #uno { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 15px; background-image: url(images/bkg001.gif); background-position: top right; background-repeat: repeat-y;}
#right #dos { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 25px; background-image: url(images/bkg001.gif); background-position: top right; background-repeat: repeat-y;}
#right #tres { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 25px; background-image: url(images/bkg003.gif); background-position: top right; background-repeat: repeat-y;}
#right #cuatro { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 25px; background-image: url(images/bkg001.gif); background-position: top right; background-repeat: repeat-y;}
#right #cinco { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 25px; background-image: url(images/bkg005.gif); background-position: top right; background-repeat: repeat-y;}
#right #seis { width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 25px; background-image: url(images/bkg006.gif); background-position: top right; background-repeat: repeat-y;}
#right a.right { text-decoration: none; color: #CC6B00;}
#right a.right:hover { text-decoration: none; color: #3B1D09;}

/* Blog and News */
#right .blog {width: 500px; height: auto; padding-bottom: 5px; margin: 0 0 5px 112px; border-bottom: 1px dotted #624013;}
#right .blog img { border: 2px solid #623812;}

/* -------sign in*/
#sign { width: 200px; height: 101px; position: relative; margin: 10px 0; padding: 0; float: right; text-align: left;}
#sign fieldset { width: 185px; margin: 8px 0 0 0; padding: 5px; font-size: 10px; color:#cecece;  border: 0;}
#sign fieldset h2 {width: 135px; color: #244362; font-weight:lighter; font-size: 14px; margin-bottom: 8px; text-align: right;}
#sign legend { padding: 6px; font-size: 12px; color: #ffffff; background-color: #030303;} 
#sign input { margin: 3px 6px 3px 0; color: #ffffff; background-color: #ffffff; border: 1px solid #B5B5B6; float: left; width: 70px;} 
label{ float: left; width: 65px; font-size: 12px; color: #767474; margin: 5px 0 5px 0;}
br{ clear: left; }
.login {font-weight: lighter; color:#184E85;}
#sign a {float: left;}

/*fotogallery*/
#right #gallery {width: 668px; height: auto; padding-bottom: 10px; margin-bottom: 15px; position:relative; float: right;}
div.thumb {margin: 5px 5px 10px 5px;height: auto;float: left;text-align: center; color:#3B1D09; background-color:#D0B65D;}	
.thumb img{display:inline;margin: 3px;}
.phototitle {text-align: center;margin: 3px; letter-spacing: 1px; font-size: 10px;}

/* tag cloud */
#cloud { width: 190px; line-height: 1.5em; text-align: left; margin-right: 10px; color: #A4C1DA; float: right;}
#cloud a { color: #A4C1DA;}
#cloud a:hover { color: #F26922;}
#cloud li { display: inline; padding: 0 1px;}
#cloud a.tag1 { font-size: 14px; font-weight: 100; }
#cloud a.tag2 { font-size: 18px; font-weight: normal; }
#cloud a.tag3 { font-size: 26px; font-weight: 300; }
#cloud a.tag4 { font-size: 32px; font-weight: 400; }
#cloud a.tag5 { font-size: 1.2em; font-weight: 500; }
#cloud a.tag6 { font-size: 1.4em; font-weight: 600; }
#cloud a.tag7 { font-size: 1.6em; font-weight: 700; }
#cloud a.tag8 { font-size: 1.8em; font-weight: 800; }
#cloud a.tag9 { font-size: 2.2em; color: #FF6600; font-weight: 900; }
#cloud a.tag10 { font-size: 9px; font-weight: 900; }

/* FOOTER logos + links */
#footer {width: 100%; height: 230px;margin: 1px auto 0 auto; position: relative;color: #763A13; font-size: 13px; background-color: #ffffff;background-image: url(images/fbkg.gif); background-position: top; background-repeat: repeat-x;}
#footer #foot {width: 890px; height: 180px;margin: 0 auto; text-align: right;padding: 23px 10px 0 0; position: relative; background-image: url(images/foot.gif); background-position: top; background-repeat: no-repeat;}
#foot #right_foot ul {text-align: right; width: 300px; list-style:none;}
#foot #right_foot li { display: inline; padding: 0 0 0 20px;}
#foot #right_foot li.first { display: inline; padding: 0 0 0 0;}
#foot #right_foot a { color: #3B1D09; text-decoration: none;}
#foot #right_foot a:hover {color: #ffffff; text-decoration: none;}
#foot #right_foot p{text-align:right; margin: 35px 0 20px 0; width: 300px; font-size:10px; color:#9B8B83;}
#right_foot {float: right; width: 300px; height: auto; text-align: right; padding-right: 20px;}
#right_foot_logos {float: right; text-align: right; padding-right: 20px; width: 800px;}
#footer strong {color:#EE7628; font-weight: bold;}
#footer b {color:#EE7628; font-weight: bold;}
#right_foot_credits { float: right; text-align: right; padding-right: 20px; margin: 25px 0 20px 0; width: 600px; font-size:9px;}
#right_foot_credits a{ color:#BEBBBB; text-decoration: none;}
#right_foot_credits a:hover{ color:#EE7628; text-decoration: none;}

/* hostels links menu drop down */ 
#foot #right_foot li ul{ display:none; height:auto;	padding:0px; margin: 1px 0 0 0px; border: 1px solid #623913;	position:absolute; width:auto;	z-index:200;/*top:1em; /*left:0;*/	}
#foot #right_foot li:hover ul{ display: block; background-color:#FEBF01;}
#foot #right_foot li li { display: block; background-color: #FEBF01; float: none; margin: 0px; padding: 0px; width: 100px;}
#foot #right_foot li:hover li a { background: none; color: #3B1D09; }
#foot #right_foot li ul a { display: block; height: auto; font-size: 11px; margin: 0px; padding: 5px 5px 5px 10px; text-align:left; color: #3B1D09;}
#foot #right_foot li ul a:hover, .menu li ul li:hover a { color:#ffffff; background-color: #623913; text-decoration:none; }
/*#foot #right_foot p { clear:left; }	*/

/* Booking search engine */
.hide{display:none;}
#tv_banner #calendar span, #searchbox .title-en span, #searchbox .title-es span{position:absolute; left:-9999px;}
#tv_banner #searchbox {position:relative; width:216px; height: 216px; margin:0; padding: 16px 0 0 12px;line-height:1.3em; font-size:12px; float:left;}
#tv_banner #searchbox select{background-color:#fff; color:#036;}
#tv_banner #searchbox .content{margin:0; padding:0;}
#tv_banner #searchbox h2 { margin:0; color:#1E0B04; font-size: 18px; margin: 0 0 8px 0;width:160px;}
#tv_banner #searchbox label{font-weight:bold; color:#EE7628; font-size:12px; width:auto;}
#searchbox .leftt{width:45px; height:25px; text-align:left; float: left;}
#searchbox .left{width:60px; height:45px; text-align:left; float: left;}
#tv_banner #searchbox select{margin:0; padding:1px;}
#tv_banner #searchbox select{border:1px solid #EE7628;}
#tv_banner #searchbox #hostel{width:198px; margin-bottom:12px;}
#tv_banner #searchbox #arrival, #searchbox #nights{margin-bottom:10px;}
#tv_banner #calendar{float:right; margin:1px 0 0 0; display:block; width:21px; height:21px; background:url(images/icon-calendar.gif) no-repeat; position:relative;}
#tv_banner #left .inside{position:relative; margin:-30px 0 10px 38px;}
.dorm {float: right; margin-top: 2px;}

#tv_banner #searchbox #time{ margin:0 0 10px 0; width:200px; height:16px;position:relative;}
#tv_banner #searchbox #first{ margin:0 0; width:200px; height:25px;position:relative;}
#tv_banner #searchbox #second{ margin:0 0; width:200px; height:45px;position:relative;}

#tv_banner #check-availibility{margin-top:8px; position:relative; z-index:1; text-align:center; width: 126px; height: 13px; padding: 6px; font-weight:bold; background:url(images/reservation.gif) no-repeat center;}

#tv_banner .link-button{text-align:center;}
#tv_banner .link-button a{color:#ffffff; text-decoration:none;text-align:center;}
#tv_banner .link-button a:hover{color:#1E0B04; text-decoration:none;text-align:center;}

/* formulario GROUPS*/
#regroup {height: auto;	width: auto;position:relative;margin: 0 auto 20px auto;padding: 5px 20px 6px 20px;text-align: center;color: #a87507;border: 2px solid #623812; background-color: #FADD5F;}
#regroup h2 { font-size: 18px;color:#3B1D09; text-align: center; width: 350px; margin: 10px auto 0 auto;}
#regroup p{	margin: 5px auto;}
#regroup p.big{font-size: 10px;color:#693e05;}
#regroup p.small{font-size: 10px;margin:0 0 10px 130px;}
#regroup p.med{font-size: 10px;margin:0 0 15px 0;}
#regroup fieldset { margin: 0 0 10px 0; text-align: left; padding: 1em .5em .5em 20px; border: 1px dotted #ffffa0; font-size: 10px;} 
#regroup legend { padding: 10px;font-weight: bold; background-color: #FADD5F; font-size: 11px;} 
#regroup input { border: 1px solid #e9a000;background-color: #ffffa0;margin: 3px 0 3px 0; color: #3B1D09;} 
#regroup input.btn { border: none; margin-right: 10px;}
label{float: left;width: 130px;font-size: 12px; margin: 3px 0 3px 0; color: #3B1D09;}
label.number{position: relative;width: 120px;}
textarea{border: 1px solid #e9a000;background-color: #ffffa0;}
br{ clear: left; }

/* Barcelona Cheap Hostel Sitemap ------------------------------------------*/
#sitemap {width:600px; position:relative; margin: 0 auto 15px auto; font-size: 11px;}
#sitemap a {color: #f6a916; text-decoration: underline;}
#sitemap a:hover {color: #b77800;}
.con {color: #3B1D09;}
dl {margin: 0 auto;}
.boxmap {padding: 10px; margin: 0 auto;width: 558px;text-align: left;}
dt  {padding-bottom: 6px; font-size: 12px;color: #201004;}
dd  {padding-bottom: 5px; text-decoration: none;}
dd {background-image:  url(images/line.gif);background-repeat: no-repeat; padding-left: 23px;}
dd.bottom { background-image:  url(images/linee.gif); background-repeat: no-repeat; padding-left: 23px;}
#sitemap .title{font-size: 14px;line-height:18px;color: #a09f8c;padding: 5px 5px 5px 10px;background: #e3e2d5;border-bottom: 1px dotted #717118;}

/*links hostel section*/
#loghostel {height: auto;width:600px;position:relative;margin: 0 auto 15px auto;}
#loghostel h2 {color: #F6A415; font-size: 13px; border-bottom: 1px solid #F6A415; margin: 10px 0 5px 0;}
#loghostel h3 {color: #F6A415; font-size: 14px; border-bottom: 1px solid #F6A415; margin-bottom: 5px;}
#loghostel ul {width: 600px; height: 21px; padding:0; margin: 5px 0 5px 0; font-size: 11px; color: #93650d; text-align: left;}
#loghostel li {padding: 0 2em 0 0; display: inline;}
div.hostel { margin: 3px;border: 1px solid #BC7538;height: auto;float: left;text-align: center;font-size:11px;} 
.hostel img { display: inline;margin: 5px;border: 1px solid #BC7538;}
.hostel a:hover img {border: 1px solid #472D15;}
.hostelcattitle {text-align: center; font-weight: bold;}
.hosteltitle {text-align: center;font-weight: normal;width: 120px;margin: 0 3px 3px 3px;}
#loghostel a {color: #f6a916; text-decoration: none;}
#loghostel a:hover {color: #b77800;}