﻿/*
Theme Name: Associação dos Albergues da Juventude do Rio de Janeiro - ALBERJ
Description: Website do Hi Hostel Rio de Janeiro
Author: Bruna Morato
Author uri: http://www.brunamorato.com
*/

@import url("reset.css");

@media screen {

html {
	background: #f5f5e3 url('../img/bg_aviso.gif') top no-repeat;
	height: auto;
	width: 100%;
	font-family: "Trebuchet MS", Arial, Helvetica;
	}

strong {font-weight: bold;}
em {font-style:italic;}

body {width: 716px; background: transparent url('../img/bg_body.gif') top repeat-y !important; margin: auto;}

#wrapper {background-color: #015480; width: 700px; margin: auto;}

#topo {padding: 10px 0 10px 15px;}
#topo #logo_hi, #topo #banner {float: left}
#topo #banner {padding: 10px 0 0 50px;}

#fotos {width: 700px; height: 169px;}

#menu {padding: 10px 0 15px 21px;}
#menu ul li{
	display: inline;
	font-size: 11pt;
	font-style: italic;
	font-weight: bold;
	color: #fff;
	padding-left: 22px;
	;
}
#menu ul li a {color: #fff; /*text-decoration:none*/}
#menu ul li a:hover {color: #eb8a1b;}

/* Bloco das bordas arredondadas */
#blocks {width: 545px;	height: auto; float:left; margin: 15px 0 10px 15px;_margin: 15px 0 10px 8px;}
/* ***************************** */

#middle {display:block;	text-align:left; padding: 10px 10px 0 10px; font-size: 10pt; color: #011e2d;}
#middle a {text-decoration: underline; color: #015480;}
#middle a:hover {color: #fff;}
#middle h1 {
	vertical-align: top;
	background: url('../img/bullet.gif') top left no-repeat;
	padding: 0 0 10px 35px;
	color: #fff;
	font-size: 13pt;
	font-weight: bold;
	font-style: italic;
	letter-spacing: -0.5pt;
}

#middle h2 {
	color: #015480;
	font-size: 11pt;
	font-weight: bold;
	padding: 10px 0 5px 15px;}

#middle h3 {
	font-size: 10pt;
	font-weight: bold;
	padding: 10px 0 5px 15px;}	
	

#middle div {width: 255px; float: left; line-height: 13pt;}
#middle div#middle_bl_01 {padding-right: 15px;}
#middle div#middle_bl_02 a img#livro, #middle div#middle_bl_02_albergue a img#livro {border: 2px solid #015480;}
#middle div#middle_bl_02 a:hover img#livro, #middle div#middle_bl_02_albergue a:hover img#livro {border: 2px dashed #015480;}
#middle div#middle_bl_02_albergue {float: right; margin-top: 15px;}

#middle div#middle_bl_01_v {float: none; padding: 0 15px 15px 0; width: auto;}
#middle div#middle_bl_01_v h1 {margin-top: 15px;}
#middle div#middle_bl_01_v h1.first {margin-top: 0px;}
#middle div#middle_bl_01_v ul {padding: 10px;}
#middle div#middle_bl_01_v ul li{padding-bottom: 7px;}
#middle div.para p{margin-bottom: 6px;}
#middle div.para h1.bottom {margin-bottom: 15px;}

#middle div ul#carteira {
	padding-left: 30px;
	list-style: square;	
	}

#middle .carteirinha_div {padding-left: 15px;}
#middle .carteirinha_div p {margin-bottom: 15px;}

#middle table {
	width: 330px;
	border-bottom: 1px solid #015480;
	border-left: 1px solid #015480;
	border-right: 1px solid #015480;
	margin: 0 auto 15px auto;
}

#middle table.valor {width: 470px;}

#middle table caption {
	border-top: 1px solid #015480;
	border-left: 1px solid #015480;
	border-right: 1px solid #015480;
	margin: 0 auto;
	padding: 5px;
	text-align: center;
	font-weight: bold;
	background-color: #e7b47a;
}

#middle table thead th{text-align: center;vertical-align: bottom;}
#middle table .sp_01 {background-color: #cae4f2; padding: 0 5px;}
#middle table .sp_02 {background-color: #247ba9; color: #fff; padding: 0 5px;}

#middle table tr td {background-color: #f5f5e3;}
#middle table.faq tr td {text-align: center;}
#middle table.valor tr td {text-align: left; border-bottom: 1px solid #015480; padding: 1px 5px;}
#middle table.faq thead, #middle table.valor thead  {background-color: #cae4f2;}
#middle table tr td.sp {text-align: center;}
#middle table .sp_right {text-align: center;}

#middle .para table.info {border: none; width: auto;}
#middle .para table.info tr td {background-color:#eb8a1b; text-align: center; font-size: 10px; padding-left: 5px; width: 40px;}

/* Bordas Arredondadas - Bloco Laranja */
#b1, #b2, #b3, #b4, #b1b, #b2b, #b3b, #b4b {display:block; overflow:hidden; font-size:1px}
#b1, #b2, #b3, #b1b, #b2b, #b3b {height:1px;}
#b1, #b1b {margin:0 5px;}
#b2, #b2b {margin:0 3px;}
#b3, #b3b {margin:0 2px;}
#b4, #b4b {height:2px; margin:0 1px;}

#b1, #b2, #b3, #b4, #b1b, #b2b, #b3b, #b4b, #middle {background-color:#eb8a1b;}
/* ****************** */

/* Bloco das bordas arredondadas */
#blocks_02 {width: 115px; height: auto; float: left; margin: 15px 0 10px 10px;}
/* ***************************** */

#dica {display:block; text-align:left; padding: 10px 0 10px 10px; font-size: 8pt; color: #015480;}
#dica h1 {font-weight: bold; padding-bottom: 20px; text-align: center; font-size: 12px; margin-left: -10px;}
#dica a {text-decoration:none; font-style:normal; color: #015480;}
#dica a:hover {color: #077dbb;}
#dica img {border: 1px solid #eb8a1b; margin: 0 0 10px 13px;}
#dica img#presidente {border: 1px solid #eb8a1b; margin: -5px 0 10px -3px;}
#dica img#carteirinha {border: none; margin: -5px 0 10px -2px;}
#dica p {line-height: 9pt; margin-right: 5px;}

/* Bordas Arredondadas - Bloco Creme */
#d1, #d2, #d3, #d4, #d1b, #d2b, #d3b, #d4b {display:block; overflow:hidden; font-size:1px}
#d1, #d2, #d3, #d1b, #d2b, #d3b {height:1px;}
#d1, #d1b {margin:0 5px;}
#d2, #d2b {margin:0 3px;}
#d3, #d3b {margin:0 2px;}
#d4, #d4b {height:2px; margin:0 1px;}

#d1, #d2, #d3, #d4, #d1b, #d2b, #d3b, #d4b, #dica {background-color:#f5f5e3;}
/* ****************** */

/* Bordas Arredondadas - Bloco Aviso */
#blocks_aviso {width: 670px; height: auto; float:left; margin: 15px 0 10px 15px;_margin: 15px 0 10px 8px;}

#w1, #w2, #w3, #w4, #w1b, #w2b, #w3b, #w4b {display:block; overflow:hidden; font-size:1px}
#w1, #w2, #w3, #w1b, #w2b, #w3b {height:1px;}
#w1, #w1b {margin:0 5px;}
#w2, #w2b {margin:0 3px;}
#w3, #w3b {margin:0 2px;}
#w4, #w4b {height:2px; margin:0 1px;}

#w1, #w2, #w3, #w4, #w1b, #w2b, #w3b, #w4b, #aviso {background-color:#fff;}
#aviso {color: #015480; font-size: 18px; font-family: 'Trebuchet MS', Verdana, Arial; padding: 5px 10px 0 10px;}
#aviso p {line-height: 22px; text-align: center;}
#aviso p span#sp_sp {color: #C00; text-transform:uppercase; text-decoration: underline;}
/* ****************** */

/* Bloco das bordas arredondadas */
#blocks_form {width: 545px;	height: auto; float:left; margin: 15px 5px 10px 15px;_margin: 15px -6px 10px 8px;}
/* ***************************** */

#middle_form {display:block; text-align:left; padding: 10px; font-size: 10pt; color: #011e2d;}
#middle_form h1 {text-align: center; margin-bottom: 7px;}
#middle_form img {width: 86px; height:90px; float:left;}
#middle_form #form_p {float: left !important;}
#middle_form form p {margin: 10px 0;}
#middle_form form.form_pedido label {width: 140px !important;}
#middle_form form label, #middle_bl_01_v label {float: left; width: 70px !important;}
#middle_form form input, #middle_bl_01_v form input {border: 1px solid #015080;}
#middle_form form ul li, #middle_bl_01_v form ul li {margin-bottom: 5px;}
#middle_form form fieldset {margin-bottom: 7px;}

/* Bordas Arredondadas - Bloco Branco */
#f1, #f2, #f3, #f4, #f1b, #f2b, #f3b, #f4b {display:block; overflow:hidden; font-size:1px}
#f1, #f2, #f3, #f1b, #f2b, #f3b {height:1px;}
#f1, #f1b {margin:0 5px;}
#f2, #f2b {margin:0 3px;}
#f3, #f3b {margin:0 2px;}
#f4, #f4b {height:2px; margin:0 1px;}

#f1, #f2, #f3, #f4, #f1b, #f2b, #f3b, #f4b, #middle_form {background-color:#fff;}
/* ****************** */


#middle address {
	text-align: left;
	font-family: "Trebuchet MS", Arial, Helvetica;
	font-style: normal;
	font-size: 10pt;
	padding: 10px 0 10px 15px;
}

#links {padding: 10px 0 15px 0; font-size: 12pt; color: #fff; float: left;}
#links ul li {
	display: inline;
	padding-left: 9px;
}

#dibujo {
	width: 113px;
	float: left;
	/*margin-left: 162px;*/
	margin-left: 580px;
	position: relative;
	margin-top: -270px; 
	/* margin-bottom: -55px; _margin-bottom: -60px; */
}

#dibujo_02 {
	width: 113px;
	float: left;
	margin-left: 580px;
	margin-top: -210px;
}

#li_sp_link_dupla img {margin: 30px 0 0 55px;}

#dibujo_03 /* Para exemplo de mais um link > Albergue Barra do Pirai */{
	width: 113px;
	float: left;
	/*margin-left: 162px;*/
	margin-left: 580px;
	position: relative;
	margin-top: -270px; 
	/* margin-bottom: -55px; _margin-bottom: -60px; */
}
	
#footer {
	background: url('../img/footer.gif') bottom no-repeat;
	height: 55px;
	color: #fff;
}

#footer address {
	text-align: center;
	font-family: "Trebuchet MS", Arial, Helvetica;
	font-style: normal;
	font-size: 8pt;
	line-height: 9pt;
	padding: 29px 0 0 25px; _padding: 31px 0 0 95px;
	/*float: left;*/
}

#footer a {text-decoration:none; color: #015480;}
#footer a:hover {color: #fff;}

#footer p{
	float: right;
	font-size: 8pt;
	margin: 30px 10px 0 0;
	text-align: center;
}

h1 a.promo_a_sp {color: #fff !important; line-height: 22px;}
h1 a:hover.promo_a_sp {color: #015480 !important;}

#p_dados {font-size: 15px; line-height: 19px;}

}

@media print{
* { background-color: #fff; background-image: none !important; color: #000 !important; text-decoration: none;}

#middle_form {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 11px;}
#middle_form h1 {text-align: center; margin-bottom: 7px;}
#middle_form img {width: 86px; height:90px; float:left;}
#middle_form #form_p {float: left !important;font-size: 13px;}
#middle_form p strong {font-weight: bold;}
#middle_form form label {float: left; width: 120px !important;}
form input {border: 1px solid #015080;}
form ul li {margin-bottom: 5px;}
form fieldset {margin-bottom: 7px;}
#wrapper {margin: 0 5%;}

#topo, #logo_hi, #banner, #menu, #fotos, #content_dica, #links, #dibujo, #dibujo_02, #footer, #blocks_aviso 
{
	display:none !important;
}

} 
