.hf-selected{
	position:absolute;
	margin-left:142px;
	margin-top:144px;
	color:#fff; 
	z-index:2;
	font-size:12px;
	padding:3px;
	background: #3366cc; 
	opacity:0.8;
	display:none;   
}

.menu-container{
	width:320px;
	right:-280px;
	position:absolute; 
	z-index:20;  
}

.menu-info{
	right:50px;
	position:absolute; 
	z-index:20;
	margin-top:5px;
	background:rgba(0,0,0,0.55);
	font-size:0.8em;
	padding:7px;
	text-align:center;
	border:1px solid white;
	opacity: 0;
	display:none;  
} 

.menu-info img{
	vertical-align:middle;
}

.menu-bar{
	width:40px;    
	float:left;
    height:100%;
	z-index:20; 
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3366cc+0,000000+48 */
	background: #3366cc; /* Old browsers */
	background: -moz-linear-gradient(top,  #3366cc 0%, #000000 78%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #3366cc 0%,#000000 78%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #3366cc 0%,#000000 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3366cc', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
	opacity:0.75;
}   


.menu-content{
	width:260px;
	background:rgba(0,0,0,0.75); 
	float:left;
    height:100%; 
    padding:10px;
	overflow:auto;
	z-index:21;
}
  
.menu-icon{
	padding:8px;
	position:absolute;
	z-index:999;
	top:15px;
	cursor:pointer;
} 

.menu-icon img{ 
	width:30px;
	padding:0;
	position:absolute;
	z-index:999;
	cursor:pointer;
	display:none;
	
} 

.menu-fb img{
	width:25px;
	padding:3px;
	position:absolute;
	z-index:999;
	bottom:5px; 
    cursor:pointer;  
}


/* BOOKING  */
.booking{
	position:relative;
	color:#fff;
	width:100%;
	font-size:12px;
	cursor:pointer;
} 

.booking h3{
	background:rgba(0,0,0,0.25);
	text-align:left;
	font-weight:bold;
	padding:5px;
	margin-top:0px;
	font-size:20px;
	border:1px solid white;
} 

.booking h3 img{
 	vertical-align:middle; float:right; margin-right:10px; 
}


.booking input[type=text]{
	background:rgba(0,0,0,0.3);
	border:1px solid white;
	color:#fff;
	padding:3px;
	margin:0;
	width:147px;  
}

.booking select{
	background:rgba(0,0,0,0.3);
	border:1px solid white;
	color:#fff;
	padding:3px;
    margin:0px 0;
	width:100%;  
} 

.booking #submit{
	background:rgba(0,0,0,0.3);
	border:1px solid white;
	font-size:14px;
	text-align:right; 
	color:#fff;
	padding:3px;
    margin:0px 0;
	width:100%;
	cursor:pointer;
	margin-bottom:10px;
	margin-top:5px;  
}

.booking-info{
	height:0;
	overflow:hidden;
}

.ui-datepicker{
	background: #000000; 
	padding:20px;
}

.ui-datepicker a{
	color:white;
}

.ui-datepicker a:link, a:visited{
	color:white;
}

/* HOSTEL */
#hostel{
	width: 100%;
	margin-top: 10px;
} 


#hostel ul{
}       

.hostel-center{
	width: 80%;
	position: relative;
	margin:0 auto;
} 

.content-facilities-bg{
	display: inline-block;
	padding: 10px;
	background: rgba(0,0,0,0.20);
	font-size: 12px;
	font-weight: bold;
	margin: 0 5px;
	text-align: center;
}

#hostel li{
	display:inline-block;
	padding:0;
	background:rgba(0,0,0,0.20);
	font-size:12px;
	font-weight:bold;
	margin:5px;
	text-align:center;
}   

#hostel li:hover{
	background:rgba(255,255,255,1);
	color:#3366cc;
}

#hostel li a:hover{
	background:rgba(255,255,255,1);
	color:#3366cc;
}

#hostel li img{
	width:100px;  
} 

#hostel li a{
	color:#e1e1e1;
	text-decoration:none;
}        


#hostel li a:visited, a:link;{
	color:#fff;
}  




/* TABS */  
#tabs{
	width:100%;
} 

.tabli{
	width:100%;
}

#tabs ul{
	float:left;
    margin-left:-40px;
	margin-bottom:10px;       
}

#tabs li{
	display:inline-block;
	padding:0px;
	background:rgba(0,0,0,0.3);
	font-size:12px;
	font-weight:bold;
	margin:5px;
	float:left;
}

#tabs li img{
	width:25px;  
} 

#tabs a{
	color:#fff;
	text-decoration:none;
}

#tabs a:visited, a:link;{
	color:#fff;
}

.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	text-align: left;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	float: left;
	padding: .6em .5em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding:0;
	background: none;
}   


/* Accordian */  
#accordian {
	background: #004050;
	margin: -10px auto 0 auto;
}
/*heading styles*/
#accordian h3 {
	font-size: 12px;
	line-height: 34px;
	padding: 0 10px;
	cursor: pointer;
	/*fallback for browsers not supporting gradients*/
	background: rgba(0,0,0,0.65); 
}
/*heading hover effect*/
#accordian h3:hover {
	text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
}
/*iconfont styles*/
#accordian h3 span {
	font-size: 16px;
	margin-right: 10px;
}
/*list items*/
#accordian li {
	list-style-type: none;
	width:297px;
	font-weight: 300;
	margin:-1px 0 0 0;
}
/*links*/
#accordian ul ul li a {
	color: white;
	text-decoration: none;
	font-size: 11px;
	line-height: 27px;
	display: block;
	padding: 0 15px;
	/*transition for smooth hover animation*/
	transition: all 0.5s;
}
/*hover effect on links*/
#accordian ul ul li a:hover {
	background: rgba(28,93,212,0.75);
	border-left: 10px solid white;
}
/*Lets hide the non active LIs by default*/
#accordian ul ul {
	display: none;
}
#accordian li.active ul {
	display: block;
}  

.sister{
	width:100%;
	margin-top:15px;
	font-size:0.75em;
}

.sister img{
	width: 25%;
	margin: 10px auto;
}

/* MENU TRANSITION */
#nav-toggle { cursor: pointer;}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 25px;
  background: white;
  position: absolute;
  display: block;
  content: '';
}
#nav-toggle span:before {
  top: -8px; 
}
#nav-toggle span:after {
  bottom: -8px;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  transition: all 500ms ease-in-out;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
} 

#nav-toogle-mobile img{
	display:none;
} 


/* TRIPADVISOR */
#TA_selfserveprop186{
	padding:10px;
}           

#TA_certificateOfExcellence231{
	margin-left:40px;
} 


/* MAP CONTACTS */ 

.contacts{
	font-size:12px;
	margin-bottom:30px;
}       

.contacts h1{
	font-size:16px;
}


/* INSTAGRAM*/
	.current_tag{
		color:#5e5e5e;
		font-size:12px;
		padding-top:7px;
	    font-family: 'Open Sans', sans-serif;
	    font-weight:400;
		margin-right:10px;
	}

	
   
	.instagram_item{
		width:225px;
		padding:10px;
		margin-top:15px;
		margin-left:0px;
		min-height:250px;
		box-shadow:#000 0px 10px 10px;
		background:white;
		color:#000;
		font-family: 'Open Sans', sans-serif;
	}
	
	.captions{
		color:#5e5e5e;
		overflow:hidden;
		display:block;
		width:100%;
		padding:5px 0;
		float:left;
	}
	
	.captions a:visited, .captions a:link {
	   color:#5e5e5e;
	}
	
	.item_info{
		margin-top:5px;
		color:#5e5e5e;		
	}
	
	.user img{
		width:25px;
		vertical-align:middle;
	}
	
	.username{
		color:#333;
		font-size:10px;
		margin-top:5px;
	}
	
	.item_info .right{
		text-align:right;		
	}
     
   	.date{
		font-size:9px;
		display:block;
		margin:5px 0 10px 0;
		font-family: 'Open Sans', sans-serif;
	}
	
	.link img{
		vertical-align:middle;
		width:20px;
		margin-right:10px;
	}

	.images {
		width:600px;
		margin:20px auto;
		box-shadow:#CCC 0px 10px 20px;
		padding:20px;  
	}
	
	
	.profile{
		width:50px;
	    padding-right:10px;
		padding-top:5px;
		vertical-align:middle;
	}
	
	.images_user{
		padding-top:23px;
	    font-size:12px;  
	}
	
	.images_date{
	  padding-top:23px; 
	  font-size:12px;   
	}       
	   
	.content-container{
	   position:absolute;
	   z-index:20;
	   width:80%; 
	   height:57%;
	   overflow:auto;
	   top:25%;
	   left:142px;
	   background:rgba(0,0,0,0.45);
	   display:none;
	   font-size:0.8em;
	   line-height:1.5em;
	}
	
	.close-container h1{
		float:left;
	} 
	
	.close-content img{
		position:absolute;   
		width:30px;
		height:30px;
		right:10px;
		top: 12px;
	}  
	
	.content-wrap{
		width:90%;
	    margin:0 auto;  
	}
	
	.content-intro{
		width:100%;
	}     
	
	.content-intro-headers{
		width:100%;
		position:relative;
		text-align:center;
		line-height:2.5em;
		float:left;  
		margin:0 auto;
	} 
	
	.content-intro-headers h1, .content-intro-headers h2, .content-intro-headers h3, {
		text-align:left;
		line-height:1.5em; 
		font-size: 0.4em;
	} 
	
	.poshed{
		width:100%;
		margin:-20px auto; 
		position:relative;
	    float:left; 
	} 
	
	.des1{
	  font-size: 1em; 
	  text-align:center;
      font-family: 'Syncopate', sans-serif;	}
	
	.des2{
	  font-size: 0.65em;
	  text-align:center; 
	  font-family: 'Syncopate', sans-serif;
	}
	
	
	.hostel-logo{
		width:100%;
		margin:0 auto;
		position:relative;
	} 
	
	.hostellogo li{
		display:block-inline;
		padding:20px;
		width:100%; 
	  	float:left;
	}
	
	.hostel-logo li img{
		width:120px;
		vertical-align:middle;
		margin: 0 80px;
	}  
	
	.logo-con{
		width: 100px;
		vertical-align: middle;
		margin: 0 65px;
	}   

	.recenter{
		width:100%;
	    margin:25px auto;
		position:relative;
		display:block;
	}
	
	.recenter ul li{
		padding:0;
	}
	
	.content-notes{
		margin-top:20px;
		font-size:0.75em;
	}
	
	.menu-btns h3{
		background:rgba(255,255,255,1);
		text-align:left;
		font-weight:bold;
		padding:5px;
		margin-top:0px;
		font-size:20px; 
		color:black;
		border:1px solid black;
		cursor:pointer;
	}
	
	.prices-title{
		background:#3366cc;
		padding:2px;
	}             
	
	.prices-title a{
		text-decoration:none;
	}                        
	
	.prices-title a:hover, a:active{
		color:#333;
	}   
	
	.prices-title a:visited, a:link{
		color:white;
	}
 
	.bookmobile{
		display:none;
		background:#3366cc;
		padding:2px;
	}  
	
	.bookmobile a{
		text-decoration:none;
	}                        
	
	.bookmobile a:hover, a:active{
		color:#333;
	} 
	
	.content-button{
		margin-top:40px;  
	}
	
	.content-button a{
		border:2px solid #3366cc;
		padding:10px 30px;
		text-align:left;
		font-size:1.2em;
		text-decoration:none; 
	}     
	
	.content-button a:hover{
		color:#3366cc;
	}  
	
    .leftie{
		margin-left:-20px;
	}
	
	
	
	
	@media only screen  and (max-width:960px){
		.content-container{
		   z-index:2;
		   width:100%; 
		   height:70%;
		   top:20%;
		   left:30px;
		}   
		                              
		#hostel li img  {
			width:45px;
		}
		
		.hostel-logo li img{
			width:45px;
		} 
		
		.logo-con{
			width:45px;
			margin: 10px 10px;
		}

	} 
	
	@media only screen and (max-width:656px){ 
		#hostel ul{
			margin:0;
		}
		
		.content-container{
		   font-size:0.7em;
		   line-height:1.8em;
		}
		.hf-selected{
			margin-top:10px;
			margin-left:25%;  
		}
		
		.content-button{
			font-size:0.7em;
		} 
		
		.logo-con{
			width:45px;
			margin: 10px 30px;
		}    
		
		#hostel li{
			width:40%;
		}  
		
		.hostel-center {
		    width: 90%;
		    position: relative;
		    left: 0%;
		}
		
		.hostel-tabs li{
		}
		
		.prices-title{
			display:none;
		}
		
		.bookmobile{
			display:block;
		} 
		
		.content-prices{
			font-size:0.85em;
		}
		
		.recenter{
		    margin:0 auto 0 auto;
		}
		
		.logo-con{
			width:45px;
			margin: 10px 10px;
		}           
		
		
	}   
	
	@media only screen and (max-width:360px){ 
		.content-button{
			font-size:0.5em;
		}                
		
		
		.logo-con{
			width:45px;
			margin: 10px 10px;
		}      
		
		#hostel li{
			width:90%;
		}
		
	}