Customização Mybookings - HTML e CSS Meta tags

Seguir
image

O mybookings oferece várias opções de personalização para quem está familiarizado ou não com HTML / CSS.

Você pode facilmente combinar com o estilo do seu website ou criar seu estilo exclusivo personalizando:

  • cabeçalho e rodapé
  • imagem de fundo
  • esquema de cores,
  • fontes,
  • adicionar texto e hiperlinks,
  • ocultar informações

Observe que a Cloudbeds não oferece suporte para design de sites, mas oferecemos alguns códigos para você 'copiar e colar'  além de serem muito fáceis de usar. Nossa equipe de suporte terá o prazer de ajudá-lo a usar os códigos fornecidos neste tutorial. Entre em contato conosco pelo e-mail sac@cloudbeds.com caso precise de ajuda para personalizar seu motor de reservas usando as soluções de personalização fornecidas abaixo.

Por onde começar

1. Na sua página do myfrontdesk, clique no ícone de Configurações > Customização do Mybookings

2. Insira os códigos de customização em seus respectivos lugares (Customização de Meta tags, Customização do cabeçalho da sua página de reservas, etc)

Os códigos CSS devem sempre ficar entre <style> e </style> como mostra o exemplo abaixo:

<style>

.show_promo_code a {color:#999;}

</style>

Exemplos de Customização

Note: Os exemplos fornecidos abaixo são para sua referência e eles podem precisar de modificações adicionais para que funcionem corretamente.

Mudança do Texto (fonte, cor, tamanho)
Modificar todas as Fontes
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{
font-family:'Open Sans', "Arial", sans-serif !important;
}

/* Calendar Icon - Don't Change or Remove */
i.fa
{
font: normal normal normal 14px/1 FontAwesome !important;
}

/* Hotel Name Font */

.page-header-inner .hotel_name {
color: #fff;
font-family: 'Verdana',sans-serif;
}
Importante!

Se após adicionar o código para modificar todas as fontes você não conseguir visualizar mais as setas do calendário (como mostra a imagem abaixo) - remova onde está escrito <span> no código e salve as alterações.

Modificar a fonte e cor do nome da propriedade
/* Hotel Name Font */

.page-header-inner .hotel_name {
color: #fff;
font-family: 'Verdana',sans-serif;
}
Modificar o botão 'BUSCAR'

'color' - modifica a cor da fonte da palavra 'Buscar'

'background' - modifica a cor do botão

/* Change Search Button */
.btn.btn-warning.btn-block {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
color: #b7f9fd;
background: #da1176!important;
border-color: #2d7e7b;
} 
Modificar a fonte dos botões 'RESERVAR AGORA' e 'SELECIONAR ACOMODAÇÃO'

'color' - modifica a cor da fonte da palavra 'RESERVAR AGORA' e 'SELECIONAR ACOMODAÇÃO'

'background' - modifica a cor do botão

.green.btn,
.green.btn:hover, .green.btn:focus, .green.btn:active, .green.btn.active {
background:#da1176!important;

font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
color: #b7f9fd;
}
Modificar tamanho/estilo do texto que aparece quando não há disponibilidade

Adicione o código abaixo na seção 'Customize o rodapé de sua página de reservas' e repita o mesmo procedimento para todos os idiomas.

.message_container 
{font-size: 16px;
color: #ff5722; 
font-weight: normal; /*font weight - normal, bold, light, etc...*/  
font-style: normal; /*font style - normal, italic*/}
Modificar a fonte das informações da propriedade
/*Header*/
.caption {
font-family: "Georgia";
}

/*Info inside section*/
.map_info {
font-family: "Courier New";
}
Modificar fonte do calendário (ao escolher data de check in e check out)
/*change font (Calendar title)*/


/*change font (Calendar days/dates)*/
#ui-datepicker-div {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;}
Modificar a fonte e cor do preço da acomodação escolhida
.selected_rooms_price {
font-family: 'Roboto',sans-serif;
font-style: italic;
    font-size: 30px;
    color: #da26b2;
    margin-top: 5px;
    text-align: center;
}   
Modificar Cores/fundos, botões
Adicionar imagem no plano de fundo

Para adicionar uma imagem de fundo na página principal do motor de reservas, use o código abaixo:

Por favor, note que você precisa ter a URL da imagem de fundo, que deve terminar com .jpg.

Caso você tenha uma imagem no seu computador, será necessário enviá-la para qualquer site de hospedagem de imagens ou para o Google Drive e, em seguida, obter a URL da imagem. Veja alungs exemplos:  https://www.codecademy.com/articles/host-images-on-dropbox

-adicionar plano de fundo + manter a linha do cabeçalho
.add_white {background: transparent;}
.container1{background-color: transparent;}

/* Change URL here */
.container2 {background: url("http://addbackgroundurlhere.com/file.jpg"); background-position: center center; background-attachment: fixed; background-repeat: no-repeat; background-size: cover; background-color:#ffffff; }
.chooser, .property center {opacity: 1}
-adicionar plano de fundo+ remover a linha do cabeçalho

Para mostrar a imagem de fundo na página inteira, use este código:

/* Background to the full page */ 
.page-boxed {
background: url("http://addbackgroundurlhere.com/file.jpg") !important;
background-position: center center;
background-attachment: fixed !important;
background-repeat: no-repeat;
background-size: cover !important;
background-color:#ffffff; 
}
.chooser, .property center {opacity: 1}

/* Add  Transparency */
.page-footer, .page-header.navbar {background: transparent; } /* Transparent Header & Footer */ 
.container1, .container2 {background-color: transparent;} /* Transparent Main Background */
Modificar a cor do plano de fundo da página do mybookings
.container1, .container2 {
    background-color: #fda2b4;
}
Modificar a cor do cabeçalho
.page-header.navbar {
    background-color: #6bbeb6;
}
Modificar o botão 'BUSCAR'

'color' - modifica a cor da fonte do botão 'Buscar';

'background' - modifica a cor do botão

/* Change Search Button */

.btn.btn-warning.btn-block {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
color: #b7f9fd;
background: #da1176!important;
border-color: #2d7e7b;
} 
Modificar a cor dos botões RESERVAR AGORA e SELECIONAR ACOMODAÇÕES

Se você deseja alterar o estilo de botão "RESERVAR AGORA" e permitir que os hóspedes reservem tipos de quarto individuais (há um botão ao lado do tipo de acomodações "SELECIONAR ACOMODAÇÃO") - o código abaixo mudará ambos os botões

Color - modifica a cor da fonte

Background - modifica a cor do botão

.green.btn, .green.btn:hover, .green.btn:focus, .green.btn:active, .green.btn.active, .green.btn.disabled, .green.btn.disabled:hover {
    color: #fff;
    background: #ac59b1;}
Modificar a cor do botão 'Acomodações'
.rooms_select .btn, .rooms_select.open .btn, .rooms_select .btn:hover, .rooms_select .btn:focus, .rooms_select .btn:active {
background-color: #0479af;
}
Modificar a cor da seta dos passos 'Escolha uma Acomodação' e 'Confirmação'
/*Change active section color*/
.page-breadcrumb li.active>span {
    background: #f13e64;
}

/*Change inactive section color*/
.page-breadcrumb li.active>span:after {
    border-left: 30px solid #f13e64;
}

/*Change small arrow in the middle color on CHOOSE A ROOM step*/
.page-breadcrumb li>span {
       background: #fbe3e3;
}

/*Change small arrow in the middle color on CHECKOUT step*/
.page-breadcrumb li>span:after {
       border-left: 30px solid #fbe3e3;
Modificar as cores dos botões das datas (ao selecionar a data de check in e check out)

background - modifica a cor do botão

color - modifica a cor da fonte

/*Changes highlighted dates - checkin and checkout*/
.ui-datepicker .ui-state-checkin, .ui-datepicker .ui-state-checkin .ui-state-default, .ui-datepicker .ui-state-checkout, 
.ui-datepicker .ui-state-checkout .ui-state-default {
background: #f48224;  
color: #ecfd02;
}

/*Changes dates style between checkin and checkout*/
.ui-state-default {
background: #f2f7cc;
color: #4b694c;
}
Ocultar / Remover elementos
Remover as colunas de crianças e adultos do motor de reservas
/* Remove Children Column */
.choose_room .room_types .custom-children, .choose_room .room_types .custom-adults,
/* Remove Adult Column  */
.choose_room .roomtype .custom-adults, .choose_room .roomtype .custom-children
{ visibility: hidden !important; }
Remover a opção de crianças
/* Remove Children Column */

.room_types .children, .kids_block, .roomtype .col_kids, .total_child, .nb_kids, .book_child {
visibility: hidden !important;
}
.choose_room .room_types .custom-children {
visibility: hidden !important;
}
.tarife.kids_tarife {
display: none !important;
}
Remover a coluna "A partir de"
/* Remove "Price From" column */

.only_left
{display:none;}
.starting_at{visibility:hidden;}
.mobile .starting_at{display: none;}
Remover o calendário de disponibilidade
/* Remove Availability Calendar */

.show_avail_calendar {
visibility: hidden !important;
}
.availability_calendar_container {
display: none !important;
}
Remover o endereço da propriedade e informações de contatos
/* Remove Address */ 
.map_info {display:none;} 
Remover as informações de 'Tarifa Básica' e 'Visualizar preço de hóspede adicional'
#wizard-container > div.choose_room > div.available_rooms > div.col-md-9.padding-left-0.col-sm-12.col-xs-12 > div.room_types > div > div.detailed > div.room_more > div > div {visibility: hidden !important;}
Remover o preço rasurado da tarifa base (apenas para pacotes)
.rate_basic_not_derived.red.strike, .rate_min_not_derived.red.strike {
display: none;
}
Remover mapa
/* Remove Map */ 
#map_canvas {display:none;}  
Remover políticas de check in e check out
.checkin-checkout-terms-block{
display: none;
}
Remover Políticas de Cancelamento
.checkin-checkout-terms-block, .property_info h5 {
display: none;
}
Remover políticas de depósito antecipado
.cancellation_policy {
display: none;
}
Ocultar determinados detalhes para contatos (endereço, telefone, email)

Acesse a página do mybookings e role para baixo até a seção Descrição; os campos com detalhes de contato são basicamente uma lista numérica

No exemplo abaixo, 'Endereço' é o campo número 1, 'Cidade' é o campo número 2 e assim por diante

Para ocultar um determinado campo, adicione o seguinte código, especificando o número do campo que você deseja ocultar após a parte 'p: nth-child' entre parênteses.

No exemplo abaixo o campo 4 (Nome do contato) está oculto:

<style>
body > div.container2 > div > div.container.main-content > div.page-container.property_info > div > div > div.portlet-body > div.map_info > p:nth-child(4) {display:none; }
</style>
Ocultar a caixa que seleciona o número de crianças para acomodações específicas

00000 no código abaixo é o númeri (ID) da acomodação no myfrontdesk, você pode encontrá-lo usando o dev console no navegador ou entre em contato com nossa equipe de suporte para ajudar a encontrá-lo.

[data-room-type-id="00000"] .roomtype.vertical-align.visible-md-block.visible-lg-block .children.custom-children{
visibility: hidden !important;
}
Remover a informação de cobrança de hóspede adicional da seção "Sua Reserva"

Insira o código na seção 'Código Javascript apenas página de confirmação'

Essa opção é recomendada para propriedade que possuem apenas dormitórios e não possuem quartos privados.

.reserve_total .row.total_adults, .reserve_total .row.total_child {
 display: none;
}
Ocultar a linha de 'Pessoas Inclusas' na descrição da acomodação
.room_types .stay tr:nth-child(2) {
  display: none;
}
Remover a opção 'Aplicam-se Restrições'
<style>
.legend_booking>div>div:nth-child(4) {
display: none;
}
</style>
Substituir o texto padrão por um texto customizado

Nessa seção, você encontrará códigos que substituem o texto padrão do mybookings por um texto personalizado. Você não precisa necessariamente colocar o texto fornecido nos modelos do código - você pode inserir qualquer outro texto.

Por favor, note que o texto digitado será exibido:

- para todos os idiomas do mybookings (aqueles que estão disponíveis) - se o código for inserido na seção 'Meta Tags Personalizadas'

- para o idioma selecionado - se o código for inserido nas seções "Cabeçalho / rodapé de sua página de reservas'

Substituir o texto "Disponibilidade"  (acima do botão de busca) por "Visualizar Calendário de Disponibilidade"

Adicione este código na seção "Customize o rodapé de sua página de reservas" e repita o mesmo procedimento para todos os idiomas:

<script type="text/javascript">
document.querySelector('.show_avail_calendar a').innerHTML = 'View Availability Calendar';
</script>
Modificar o texto do botão "Selecionar Acomodação"
button.btn.green.btn-block.select-accommodation-btn {
  font-size: 0;
}
button.btn.green.btn-block.select-accommodation-btn:before {
  font-size: 12px;
  content: "text";
}
Modificar o texto do botão 'RESERVAR AGORA'

Adicione este código na seção "Customize o rodapé de sua página de reservas" e repita o mesmo procedimento para todos os idiomas:

<script type="text/javascript">
document.querySelector('.green.btn.disabled').innerHTML = 'Insert Text Here';
</script>
Substituir "Adultos" por "Hóspedes"
  • Adicione o código na seção  'Meta Tags Personalizadas';
  • A frase / palavra que substituirá a original - aparecerá em todos os idiomas
.custom-adults.text-center {
  font-size: 0!important;
}
.custom-adults.text-center:after {
  content: "Guests";
  font-size: 12px;
}
Substituir 'Adultos' e 'Crianças' por 'Adultos e Crianças Maiores de 5 Anos / Menores que 5 anos

Algumas propriedades vendem acomodações para crianças a partir de uma idade específica pelo preço de um adulto. Neste caso, o hóspede deve reservar a quantidade correta de adultos, incluindo as crianças. O código abaixo ajudará a alterar o nome da coluna "Adultos" para "Adultos e crianças maiores de cinco anos". Você pode alterar o texto ou idade para qualquer número.

Texto em Inglês

Adicione esse código na seção 'Meta Tags Personalizadas'

<style>
.custom-adults.text-center:after{
  content: " and children + 5 years old";
}
.custom-children.text-center:after{
  content: " - 5 years";
}
.col-sm-3.col-xs-3.custom-adults p:after{
 content: "  and children + 5 years old";
}
.col-sm-3.col-xs-3.kids_block.custom-children p:after{
 content: "  - 5 years";
}
</style>

Adicione esse código na seção  Meta Tags Personalizadas (apenas página de confirmação)

<style>
.book_child:after{
  content: " - 5 years old";
}
.book_child.kids_column:after {
    content: "";
}
</style>
Texto em Português

Adicione esse código na seção 'Meta Tags Personalizadas'

<style>
.custom-adults.text-center:after{
  content: " e crianças + 5 anos";
}
.custom-children.text-center:after{
  content: " - 5 anos";
}
.col-sm-3.col-xs-3.custom-adults p:after{
 content: "  e crianças + 5 anos";
}
.col-sm-3.col-xs-3.kids_block.custom-children p:after{
 content: "  - 5 anos";
}
</style>

Adicione esse código na seção ' Meta Tags Personalizadas (apenas página de confirmação)'

<style>
.book_child:after{
  content: " - 5 anos";
}
.book_child.kids_column:after {
    content: "";
}
</style>
Substituir "VOCÊ TEM UM CÓDIGO PROMOCIONAL?" por outro texto

Adicione o texto na seção de Meta Tags Personalizadas (ficará disponível para todos os idiomas)

.show_promo_code {font-size: 0;} 
.show_promo_code a:after {content:"HAVE A DISCOUNT CODE?";   
font-size: 13px; 
color: red;
}
Substituir o texto "Passe o mouse sobre o preço..." por outro texto

Adicione o texto na seção de Meta Tags Personalizadas (ficará disponível para todos os idiomas)

.alert.alert-warning.booking_helper {font-size: 0;}
.alert.alert-warning.booking_helper:after {font-size: 14px;  content: 'YOUR TEXT HERE';}
Substituir "Acomodações' por "Apartmentos" (ou qualquer outra palavra)

Adicione o texto na seção de Meta Tags Personalizadas

A palavra/frase que substituirá a original - ficará disponível em todos os idiomas.

Para o Cabeçalho
.custom-select-rooms.text-center {
visibility:hidden;
}
.custom-select-rooms.text-center:after{
content: "Apartments";
visibility:visible;
margin-left: -35px;
}
Dentro da Página (acima do numero de acomodações)
.type_of_room {
visibility:hidden;
}
.type_of_room:after{
content: "Apartments";
visibility:visible;
margin-left: -35px;
}
Substituir "Tipo de Quarto" por "Tipo de Acomodação" (ou qualquer outra palavra)

A frase/palavra que substituirá o original - ficará disponível em todos os idiomas

.col-md-12.room_image {
visibility:hidden;
}
.col-md-12.room_image:after{
content: "Apartment type";
visibility:visible;
margin-left: -35px;
}
Redimensione fotos / elementos
Aumente o tamanho das fotos dos add-ons (itens adicionais)
<style>
@media screen and (min-width: 992px) {
.about .col-md-4 {
  min-width: auto;
  width: 40%;
}
.about .col-md-8 {
  width: 60%;
}
.about .img {
  width: 100%;
  height: auto;
  padding-top: 50%;
}
.room_services .img div {
  top: 0;
  position: absolute;
}
}
</style>
Aumente o tamanho das fotos das acomodações

Adicione esse código na seção 'Customize o cabeçalho de sua página de reservas' e faça o mesmo processo para todos os idiomas.

.available_rooms .roomtype .first_container {padding-left: 0;}
.available_rooms .room_image {  top: 0;  padding: 0;}
.available_rooms .col-md-9 div.image_container {  width: 100%;  height: auto;  margin: 0;  padding-bottom: 70%;  position: relative;}
.image_container div, .image_container a{  position: absolute;}
.room_image img.bigger {  margin: 0;  position: absolute;  right: 0;  bottom: 0;}
Aumente a largura do botão "Adultos'

Você pode controlar a largura alterando o número de pixels do elemento [.choose_room .roomtype .adults.custom-adults button.btn { max-width: 80px; ]

.choose_room .room_types .custom-children {
 display: none;
}
.choose_room .roomtype .adults.custom-adults {
 width: 20%;
}
.available_rooms .roomtype .adults .adults_select {
 width: 100% !important;
}
.choose_room .roomtype .adults.custom-adults button.btn {
 max-width: 80px;
}

Código Alternativo (with borders):

.room {
     padding-bottom: 25px;
   padding-top: 25px;
}

.image_container>a {
     height: 150%;
   width: 150%;
   margin-top: -40px;
}

.padding-right-0 {
   padding-left: 40px;
}

.room_image img.bigger {
   margin: 82px 0 0 122px;
}
Seletor de Datas e Calendário de Disponibilidade
Alterar fundo e borda calendário de disponibilidade
.ui-widget-header, .ui-datepicker-title, .one_month .ui-datepicker-header, .half_year .ui-datepicker-header, .half_year_popup .ui-datepicker-header, .one_month .ui-datepicker-header{ 
color: #fff;
background: #cfeef8;
border: 1px solid #e0a240;}
Alterar cor do seletor de data (check in/check out)

background - altera a cor do plano de fundo

color - altera a cor da fonte

/*Changes highlighted dates - checkin and checkout*/
.ui-datepicker .ui-state-checkin, .ui-datepicker .ui-state-checkin .ui-state-default, .ui-datepicker .ui-state-checkout, 
.ui-datepicker .ui-state-checkout .ui-state-default {
background: #f48224;  
color: #ecfd02;
}

/*Changes dates style between checkin and checkout*/
.ui-state-default {
background: #f2f7cc;
color: #4b694c;
}
Alterar a cor do triângulo que mostra restrições no calendário

Utilizamos a cor preta no exemplo - modifique o código #000000 para a cor que desejar

.pink {position: relative; }

.pink:after {content: ""; position: absolute; border: 4px solid #000000; top: 0; right: 0; border-left: 4px solid transparent; border-bottom: 4px solid transparent;}
Mostrar calendário de disponibilidade assim que o usuário acessar a página do mybookings

Adicione esse código na seção 'Customize o cabeçalho de sua página de reservas

<script type="text/javascript"> 
window.addEventListener("load", function(event) {document.querySelector('.show_avail_calendar a').click(); }, false); </script>
Comparador de Tarifas
Modifique a cor do botão do Comparador de Tarifas para que ele fique igual ao botão de Buscar
<style>
.rate-check-title, .rate-check-arrow {
background-color: #ff5722 !important;
}
</style>

Por favor, verifique os exemplos abaixo:

Please, check the examples on the screenshot below:

1 - antes de adicionar o código

2 - após adicionar o código. A cor do botão do comparador de tarifas é a mesma do botão 'buscar'

Adicione sua própria seta no botão do Comparador de Tarifas
<style>
.rate-check-arrow.arrow-left {
background-image: url(path to your image left) !important;
}
.rate-check-arrow.arrow-left {
background-image: url(path to your image right) !important;
}
</style>
Ocultar o Comparador de Tarifas
<style>
.rate-check {display:none !important;}
</style>
Ocultar 'Reserve Direto' no widget do mybookings
.acessa_float_left.acessa_float_description {
display: none;
}
Alterar o nome do Comparador de Tarifas
.rate-check-arrow-text {font-size: 0;  padding-right: 0;}
.rate-check-arrow-text::after {content: "Comparador de Preços";  font-size: 11px;  line-height: 1.25;}
Alterar "Tarifa Direta"
.rate-check-prices .room-details .room-channel-details:first-child .room-channel-name {
  font-size: 0;
}
.rate-check-prices .room-details .room-channel-details:first-child .room-channel-name:before {
  content:"Desired text here";
  font-size: 14px;
}
Ocultar os Canais no Comparador de Tarifas

Quando uma palavra precisa ficar oculta

#channel-Airbnb {display: none;} 

Quando duas palavras precisam ficam ocultas

#channel-Hotel\ Bonanza {display: none;} 

Quando a Booking.com precisa ficar oculta

#channel-Booking\2e com {display: none;}

Quando o Airbnb (API) precisa ficar oculto

#channel-Airbnb\20 \28 API\29{display: none;}
Substituir o texto 'Saiba Mais" / 'Learn more' por outro texto no Comparador de Tarifas
button.rate-check-button.rate-check-learn-more {font-size: 0;}

/*change text content below*/
button.rate-check-button.rate-check-learn-more::after {content: "Adicione o Texto Aqui";  font-size: 15px;}
Alterar o texto no Comparadorde Tarifas ao clicar em 'Saiba Mais' / 'Learn More'
<script>//wrap logo inside a hyperlinkdocument.addEventListener('DOMContentLoaded', function(event) {  document.querySelector(".rate-check-why .rate-check-content").innerText = "Text go here";}, false);</script>
Substituir o texto 'Os preços acima podem ou não incluir taxas" por um texto customizado
.prices-without-taxes {font-size: 0;}
.prices-without-taxes:after {font-size: 14px;  content: 'INSERIR O TEXTO AQUI';}
Facebook
Widget
Alteração do visual do widget flutuante

Você pode copiar e colar esse código na página do seu website! Não adicione isso na "Customização do Mybookings"

This code should be copied and pasted to your website page! Do not add it to 'Mybookings Customization' section:

/*change text*/
.acessa_float_left.acessa_float_description {font-size:0;}
.acessa_float_left.acessa_float_description:after {content: "text here";  font-size:14px;}

/*Background color and text color*/
.CloudBedsWidget .float_bg2 {background-color:#7dc3ac;  color:#000;}
iframe
iframe com altura total (para ajustar 100% do conteúdo):

Adicone esse código no seu website

<iframe src="https://hotels.cloudbeds.com/reservation/HvaCsE?widget=1" width="100%" scrolling="no" class="iframe-class" frameborder="0" id="yourFrame"></iframe>

 

Esse código deve ser dicionado na parte inferior da página do seu website

<script type="text/javascript" src="https://hotels.cloudbeds.com/widget/iFrameResizer"</script>
Esse artigo foi útil? Envie uma solicitação

Comentários

Desenvolvido por Zendesk