@charset "UTF-8";
body,div,
h1,h2,p,
ol,ul,li {
  margin: 0;
  padding: 0;
  border: 0;
}

/*
	A propriedade padding pode ser utilizada usando um, dois, três ou todos os quatro valores. 
	Cada valor é um <comprimento> ou  uma <porcentagem>.

	* Quando um único é valor utilizado, ele se aplica a todos os quatro lados.
	* Se Dois valores forem utilizados o primeiro se aplica às bordas verticais (superior e inferior) 
		e o segundo se aplica às bordas horizontais (esquerda e direita).
	* Quando Três valores são utilizados o primeiro se aplica à borda superior, 
		o segundo será utilizado tanto para a borda esquerda quanto para a borda direita. 
		O terceiro será aplicado à borda inferior.
	* Com Quatro valores a ordem de aplicação é: superior, direita, inferior e esquerda 
		(de acordo com o movimento dos ponteiros do relógio)
	
*/
	
body {	
	background: #fff url(../imagens/main-background.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position: left;
	font: normal 12px Verdana, Arial, Helvetica, sans-serif;		
	text-align: justify;
	line-height: 20px;
	color: #000000;
	height:100%;		
}

html {
	height:100%;
	}

table {
	font: normal normal 14px Verdana, Arial, Helvetica, sans-serif;
	text-align: justify;
	line-height: 18px;
	color: #000000;	
}

p { padding-top: 10px; padding-bottom: 10px; line-height: 1.6;}	
a { color: #005EB0; text-decoration: none; }
a:hover { text-decoration: none; color : #000; }
h2 { text-decoration: none; padding-top: 0px; margin-bottom: 10px; 	}

.cartaz { 
	display: block; 
	width: 80%; 
	border: 3px solid #ccc; 
	padding: 10px 10px 10px 10px;  
	margin-left: auto; 
	margin-right: auto;
	margin-bottom: 20px;
	}

.social-midia {  }
.social-medias {}
#bot-redes-sociais {
	display: block; 
	float: left; 
	width: 165px; 	
	margin-top: 125px; 
	margin-left: 20px; 
	position: fixed;
}

.video-container {
	position: relative;
	margin-left: 10%;
	padding-bottom: 56.25%;
    padding-top: 30px; 
	height: 0;
	overflow: hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 90%;
	height: 90%;
	padding-bottom:50;
}

#wrap { 
	max-width: 1200px; 
	margin: 0 auto; 
	margin-top: 40px; 
	border-left: 0px solid #aaa; 
	border-right: 0px solid #aaa; 			 
	padding: 20px 0 10px 0;				
	line-height: 22px;			
	}
			
/* config dos menus laterais em php*/
#right { 
	float: left; 
	margin-left: 10px;
	margin-top: 20px; 
	width: 165px;			
	padding: 0px 0px 0px 20px;
	border-top: 0px solid #ccc;			
	}
		
#right h2 { color: #005EB0; padding: 0px 0px 0px 0px; font-size: 17px; letter-spacing: -1px; font-weight: 100;}
#right p { padding: 0px 0px 0px 0px; }

#apoio, #tradutor, #publicidade { float: left; width: 160px; padding: 0px 0px 0px 0px;  }
	#doacoes { padding: 0px 0px 0px 0px;}
	#tempo { position: relative; z-index: -9; padding: 0 auto; }

#left { 
	float: left; 
	width: 165px; 
	padding: 10px; 
	margin-top: 0px;
	font-size: 1.2em;
	border-left: 0px solid #ccc;
	}
		
#left h2 { color: #005EB0; padding: 15px 0 5px 10px; font-size: 17px; letter-spacing: -1px; font-weight: 100;}
#left ul { color: #000; padding: 10px 0 10px 30px; list-style-type: square; text-align:left;}
#left ul li { padding-bottom: 5px; }
#left ul li a { color: #000;  }
#left ul li a:hover { color: #000; font-weight:bold; }

/* fim dos menus laterais*/

/* Corpo do site no index*/
#center { 
	margin-top: 20px; 
	float: left; 
	width: 60%; 
	padding: 10px 20px 20px 20px; 
	border-left: 2px solid #ccc; 
	border-right: 2px solid #ccc;
	border-top: 0px solid #ccc;
	font-size: 1.4em;
	}

	#center ul { color: #000; padding: 10px 0 10px 30px; list-style-type: square; text-align:left;}
	#center ul li { text-align: justify; padding-bottom: 20px; line-height: 1.6;}
	#center ul li a { color: #06F; text-decoration: none;  }
	#center ul li a:hover { color: #777; font-weight:bold;}
	#center h2 { font-size: 1.8em; letter-spacing: -1px; font-weight: 100; padding : 10px 0 15px 0; }
	#center h3 { color: #005EB0; padding: 5px 5px 5px 5px;font-size: 17px; letter-spacing: -1px; font-weight: 100;}

#center_home { 	
	margin-top: 10px; 
	margin-left: 0px; 
	float: left; 
	width: 80%; 
	padding: 10px 20px 20px 20px; 
	border-right: 2px solid #ccc;
	border-left: 0px solid #ccc;
	font-size: 1.4em;
	}

#center_home h2 { 
	font-size: 1.8em; 
	letter-spacing: -1px; 
	font-weight: 100; 
	padding : 10px 0 15px 0; 
	}

#mensagem_enviada { 
	margin-top: 100px; 
	margin-left: 200px; 
	float: left; 
	width: 800px; 
	height: 400; 
	padding: 10px 20px 20px 20px; 
	border: 1px solid #ccc; 
	font: normal normal 20px Verdana, Arial, Helvetica, sans-serif; 
	text-align: justify; 
	line-height: 22px; 
	letter-spacing: 1px;
	}

/* rodapé da home*/
#footer { 
	border-top: 1px solid #000000; 
	text-align: center; 
	font-size: 1.1em; 
	color: #fff;
	width:100%; 
	bottom: 0; 
/*	position: fixed; */
	z-index: 100;		
	padding: 10px 0 10px 0;
	/*background: url("../imagens/back-menu.png") repeat-x top;*/
	background: #1C1C1C;
	}
	
#merchandising-bottom
	{
	width: 85%; 
	position: relative; 
	margin-left: auto; 
	margin-right: auto; 
	padding-top: 20px;
	display: none;
	}

/*------ translate google ------------- */
#tradutor { float: left; margin-top: 10px; padding: 0px; }
#tradutor2 { top: 150px; right: 0px; position: fixed; border: 0; opacity: .0; }

/* Google Maps */
#mapa-aberto{ margin-top: 20px; margin-bottom: 20px;}

#mapa-fechado{ display: none }
	
.google-maps {
	position: relative;
	padding-bottom: 50%; /* This is the aspect ratio */
	height: 0;
	overflow: hidden;
}

.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

/*---- redes sociais ---*/	
#SharingButtons { display: none;}	
	
#albergues { padding: 30px 30px 30px 30px; border: 1px solid #ccc; }
#albergues  img { float: left; width: 150px; padding: 10px 15px 0px 0px; }
#albergues ul {list-style: none; font-size: 0.8em; text-align: justify;}
#albergues ul  li{list-style: none; font-size: 1.2em; text-align: left; color:#005EB0; font-weight:bold;}

#listar{ background-color:#fff; display:none; position:absolute; top:20%; left:10%;  margin-top:0px; padding:30px 30px 30px 30px; width:75%; border:1px solid #696969; z-index: 50;}

/* Menu voltar ao topo */
#subirTopo {
	text-decoration: none;
	background: rgba(105,105,105,.9);
	bottom: 80px;
	right: 0px;
	color: #fff;
	text-align: center;
	cursor: pointer;
	padding: 15px;
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	position: fixed;
	border: 0;
	font-family: sans-serif;
	opacity: .8;		
}

#subirTopo:hover { opacity:1; }
/* Fim do Menu voltar ao topo */

#paineis {
	border-radius: 5px;
	border: 1px solid #000000;
	padding: 15px 0 0 0;
	width: 90%;
	height: 600px; 
	background-color: #F4F4F4;
	padding: 20px 10px 20px 10px;
	margin-bottom: 50px;
	margin-top: 50px;		
	margin-left: 50px;		
}

#paineis img { margin-left: 15px; width: 35px; }
#paineis h2 { background-color: #0080ff; margin-left: 15px; margin-right: 15px; }
#paineis a { color: #fff; text-decoration: none; }
#painel { float:left; width:50%; }
#news { float:left; margin: 20px; }
#social-midia { float:left; margin: 20px; }
#acomodacoes { float:left; padding: 0px 0px 0px 20px; width: 95%; }

#comentarios {
	display: block; 
	margin-left: auto; 
	margin-right: auto; 
	width: 70%; 
	border: 0px solid;
	padding: 20px 10px 30px 10px;		
}

#saudacao { 
	display:block; 
	float: left;  
	width: 100%; 
	margin-top: 0px; 	 
	border: 0px solid; 
	padding: 0px 10px 20px 10px;		
	}
	
#data { 
	float: left; 
	width: 100%; 
	margin-top: 0px; 
	display:block; 
	border: 0px solid; 
	padding: 10px auto;		
	}
	
#publicidade-pc { display: block; margin-top: 20px; }
#publicidade-tablet { display: none; margin-top: 20px; }
#publicidade-mobile { display: none; margin-top: 20px; }
#publicidade-pc ins{ display: block; }
#publicidade-tablet ins{ display: none; }
#publicidade-mobile ins{ display: none; }

#publicidade-horizontal {
	padding: 10px 0px 10px 0px;
	height: 130px;
	border: 0px solid #ccc;
	font-size: 0.8em;
	color: #005EB0;
	display: flex; 
	justify-content: center;
}
	
#publicidade-horizontal-468 {
	padding: 10px 0px 10px 0px;
	height: 100px;
	margin-top: 10px;
	margin-bottom: 30px;
	border: 0px solid #ccc;
	font-size: 0.8em;
	color: #005EB0;
	display: flex; 
	justify-content: center;
}

#publicidade-horizontal-top {
	padding: 10px 0px 10px 0px;
	display: flex; 
	justify-content: center;
}

#painel-youtube {
	height:500px;
	border-radius: 5px;
	border: 1px solid #000000;		
	width: 90%;		
	background-color: #F4F4F4;
	padding: 20px 10px 20px 10px;
	margin-bottom: 50px;
	margin-top: 50px;		
	margin-left: 50px;		
}

#painel-youtube h2 { margin-left: 15px; margin-right: 15px; background-color: #0080ff; }
#painel-youtube img { margin-left: 15px; width: 35px; }
#painel-youtube a { color: #fff; text-decoration: none; }

#painel-instagram {
	height:600px;
	border-radius: 5px;
	border: 1px solid #000000;		
	width: 90%;		
	background-color: #F4F4F4;
	padding: 20px 10px 20px 10px;
	margin-bottom: 50px;
	margin-top: 50px;		
	margin-left: 50px;
}

#painel-instagram h2 { margin-left: 15px; margin-right: 15px; background-color: #0080ff; }
#painel-instagram img { margin-left: 15px; width: 35px; }
#painel-instagram a { color: #fff; text-decoration: none; }

.container { display: none; }
	
/* ============================================ */

/*Media Queries*/

@media only screen and (max-width: 1200px) {
	
	/* #social-midia { display: none; } */
	body { background: #fff; font-size:70%; }
	.ghost  { display: none; }
	#social-midia { display: none; }
	#bot-redes-sociais {
		display: block; 
		float: left; 
		width: 120px; 	
		margin-top: 150px; 
		margin-left: 10px; 
		position: fixed;
	}
	.social-medias { display: none; }
	.social-midia { display: none; }
	.cartaz { display: block; width: 90%; padding: 0px 0px 0px 0px; margin-bottom: 0px;	}
	#menu-horizontal { display: none; }
	#menu2 { display: block; }
	#wrap { border: 0px; margin-left: 25px;}
	#tradutor2 { opacity: .8;	}
	#merchandising-bottom	{ display: block;	}
	
	#subirTopo:hover { 	opacity:0;	}
	#center_home {  width: 90%;	float: left; border: 0px; }
	#center_home h2 { font-size: 1.4em; letter-spacing: 1px; line-height: 1.8; padding : 10px 0 15px 0; }
	#center {  margin-top: 20px; width: 90%; border: 0px; float: left; border: 0px; }
	#center h2 { font-size: 1.4em; letter-spacing: 1px; line-height: 1.8; padding : 10px 0 15px 0; }
	#right { display: none;}
	#left { display: none;}
	#saudacao { padding: 0px 0px 0px 0px;	font-size:1em;	}
	#publicidade-pc { display: none; }
	#publicidade-tablet { display: none; }
	#publicidade-mobile { display: block; }
	#publicidade-pc ins{ display: none; }
	#publicidade-tablet ins{ display: none; }
	#publicidade-mobile ins{ display: block; }
	#albergues-temp { width: 95%;}

	#painel-youtube {
		height:400px;
		border-radius: 5px;
		border: 1px solid #000000;		
		width: 90%;		
		background-color: #F4F4F4;
		padding: 10px 5px 10px 5px;
		margin-bottom: 20px;
		margin-top: 20px;		
		margin-left: 20px;		
	}

	#painel-instagram {
		height:600px;
		border-radius: 5px;
		border: 1px solid #000000;		
		width: 90%;		
		background-color: #F4F4F4;
		padding: 10px 5px 10px 5px;
		margin-bottom: 20px;
		margin-top: 20px;		
		margin-left: 20px;
	}
		
	#paineis {
		border-radius: 5px;
		border: 1px solid #000000;
		padding: 15px 0 0 0;
		width: 90%;
		height: 600px; 
		background-color: #F4F4F4;
		padding: 10px 5px 10px 5px;
		margin-bottom: 20px;
		margin-top: 20px;		
		margin-left: 20px;		
	}
		
}

@media only screen and (max-width: 640px) {

	#social-midia { display: none; }
	#bot-redes-sociais { display: none; }
	.social-medias { display: none; }
	.social-midia { display: none; }
	#menu-horizontal { display: none; }
	#menu2 { display: block; }
	#footer { display: none; }
	#publicidade-horizontal-top { display: none; }
	#search-box-room-hostels { display: none; }
	#acomodacoes iframe { width: 400px; }
 
}

@media only screen and (max-width: 480px) {
	
	#acomodacoes iframe { width: 300px; }
 
}

/* o que se passa aqui? */

@media print {

	background: transparent !important;
	color:#000 !important;
	text-shadow:none !important;
	filter:none !important;
	-ms-filter:none !important;

	body {
		margin:0;
		padding:0;
		line-height: 1.4em;
	}

	@page {
		margin: 0.5cm;
	}

	#cssmenu { display:none; }
	#menu-horizontal { display:none; }
	backmenu { display:none; }

}