@import url(reutilizaveis/EstruturaAbrir.css);
@import url(reutilizaveis/TagnaoClicavel.css);
@import url(reutilizaveis/TextoPadrao.css);
@import url(reutilizaveis/ModaiseAcoes.css);
@import url(reutilizaveis/ModaiseAcoes.css);
@import url(reutilizaveis/Modal3Pontinhos.css);


/*Trazer partial enviar Usuário*/
@import url(reutilizaveis/BoxContorno.css);
@import url(reutilizaveis/HeaderCadastro.css);
@import url(reutilizaveis/Inputs.css);
@import url(reutilizaveis/ListaUsuarios.css);






.boxtipo_experiencia{
    display:flex;
    align-items:center;
    justify-content:space-between;
}


.perfil_experiencia {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 80%;
    margin: 1vw auto;
}

.estrelas {
    font-family: var(--font-family-koho);
    font-size: 0.8em;
    color: var(--cor_cinza_escura);
    font-weight: 600;
}

    .estrelas i {
        font-size: 1em;
        color: var(--cor_principal);
    }

.duracao_qtdpessoas {
    font-family: var(--font-family-koho);
    font-size: 0.8em;
    color: var(--cor_cinza_escura);
    font-weight: 900;
}

    .duracao_qtdpessoas i {
        font-size: 0.8em;
        color: var(--cor_cinza_clara);
        font-weight: 600;
    }

/* Descrição com vídeo */

.box_conteudo_secundario {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 2vw;
}

.banner_conteudo_secundario {
    font-family: var(--font-family-montserrat);
    font-size: 1em;
    color: var(--cor_cinza_escura);
    text-align: justify;
    margin: 1vw 0vw 1vw 0vw;
    padding:0 1.0vw;
}

    .banner_conteudo_secundario video {
        display: flex;
        float: left;
        width: 10vw;
        height: 10vw;
        object-fit: cover;
        margin: 0.5vw 0vw 0vw 0vw;
    }

/* Conhecendo o anfitrião */

.box_anfitriao {
    width: 100%;
    background-color: var(--cor_fundo_tela);
    height: 7vw;
    margin-top: 2vw;
}

.texto_anfitriao {
    display: inline-block;
    font-family: var(--font-family-montserrat);
    font-size: 1em;
    color: var(--cor_cinza_escura);
    text-align: left;
    padding-left: 2vw;
    font-weight: bold;
}

.box_perfil {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 1vw 0vw 1vw 1vw;
}

    .box_perfil img {
        width: 3vw;
        height: 3vw;
        border-radius: 1vw;
        margin-left: 1vw;
        box-shadow: 0 0 0.2vw var(--cor_cinza_escura);
    }

.box_nome {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    max-width: 23vw;
    margin-left: 0vw;
}

.box_nome_prazo {
    margin-left: 0.5vw;
}

.nome_perfil {
    width: 100%;
    text-align: center;
    font-family: var(--font-family-montserrat);
    color: var(--cor_cinza_escura);
    font-size: 0.9em;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ramo_experiencia {
    font-family: var(--font-family-koho);
    font-size: 0.7em;
    color: var(--cor_cinza_escura);
    border: none;
    margin: auto 0vw auto 0;
}

.mais_opcoes {
    background-color: transparent;
    border: none;
    font-size: 1.5em;
    cursor: pointer;
    margin: auto 0.5vw auto 0vw;
}

/* O que levar e o que está incluído */

.paragrafo_informativo {
    display: flex;
    font-family: var(--font-family-montserrat);
    font-size: 1.0em;
    color: var(--cor_cinza_escura);
    margin-top: 1vw;
    text-align: justify;
    width: 100%;
    padding:0 1vw;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ajuste texto delimitador */
.box_texto_delimitador {
    display: flex;
    align-items: center;
    margin-top: 2vw;
    margin-bottom: 0;
}

.titulo_delimitador {
    display: inline-block;
    font-family: var(--font-family-koho);
    font-size: 1.1em;
    color: var(--cor_cinza_escura);
    font-weight: 600;
    margin-left: 1.5vw;
}

.linha_delimitadora {
    flex-grow: 1;
    height: 1vw;
    border-top: 0.15vw solid var(--cor_principal);
    margin: 0.1vw 1.5vw 0 1.5vw;
}

/* ajuste delimitador para preço */

.box_texto_delimitador_preco {
    display: flex;
    align-items: center;
    margin-top: 2vw;
    margin-bottom: 0;
}

.titulo_delimitador_preco {
    display: inline-block;
    font-family: var(--font-family-koho);
    font-size: 1.1em;
    color: var(--cor_cinza_escura);
    font-weight: 600;
    margin-left: 1.0vw;
}

.box_preco {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5vw;
}

.linha_delimitadora_preco {
    flex-grow: 1;
    height: 1vw;
    width: 32vw;
    border-top: 0.15vw solid var(--cor_principal);
    margin: 0vw 1.5vw 0 1.5vw;
}

.texto_valor {
    display: inline-block;
    text-align: right;
    margin-right: 2vw;
    font-family: var(--font-family-koho);
    font-size: 1.2em;
    color: var(--cor_cinza_escura);
}

    .texto_valor span {
        font-size: 0.7em;
    }

/* Idiomas */

.seletor_bloco {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    width: 90%;
    margin: 5vh auto 0vw auto;
    gap: 1vw;
}

.tag_servico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: var(--cor_principal);
    border: 0.1vw solid var(--cor_principal);
    border-radius: 0.3vw;
    padding: 0.1vw 0.7vw;
    min-width: 8vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: var(--font-family-koho);
    font-size: 0.9em;
    font-weight: bold;
}

    .tag_servico i {
        margin-right: 0.5vw;
    }



/* ajuste para mapa */
#map {
    display: block;
    height: 20vw;
    width: 50vw;
    margin: 1vw 0vw 0vw 1.5vw;
}

.container_localizacao {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box_detalhes_localizacao {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    min-height: 15vw;
    width:35vw;
    background-color: var(--cor_fundo_tela);
    margin: 1vw 1vw 0vw 2vw;
}

.texto_localizacao {
    display: inline-block;
    font-family: var(--font-family-montserrat);
    font-size: 0.8em;
    color: var(--cor_cinza_escura);
    font-weight: 900;
    text-align: left;
    padding: 0 1vw;
}

    .texto_localizacao i {
        margin-right: 0.5vw;
    }

.primeira_linha {
    margin-top: 1vw;
}

.texto_localizacao_info {
    display: inline-block;
    font-family: var(--font-family-montserrat);
    font-size: 0.7em;
    color: var(--cor_cinza_escura);
    text-align: justify;
    padding: 0 1vw;
    margin-bottom: 1vw;
    margin-top: 0.5vw;
}

/* *****************Ajuste botões */
.box_btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 2vw 0vw 0vw 2vw;
}

.btn_padrao {
    background-color: var(--cor_branca);
    font-family: var(--font-family-koho);
    font-size: 0.9em;
    width: 10vw;
    height: 1.8vw;
    text-align: center;
    color: var(--cor_principal);
    border: none;
    border-radius: 0.3vw;
    margin-bottom: 1.5vw;
    margin-top: 1.5vw;
    cursor: pointer;
    border: 0.1vw solid var(--cor_principal);
    text-decoration:none;
}

.btn_avaliar {
    background-color: var(--cor_principal);
    font-family: var(--font-family-koho);
    font-size: 0.9em;
    width: 10vw;
    height: 1.8vw;
    text-align: center;
    color: var(--cor_branca);
    border: none;
    border-radius: 0.3vw;
    margin-bottom: 1.5vw;
    margin-top: 1.5vw;
    cursor: pointer;
    border: 0.1vw solid var(--cor_principal);
    text-decoration: none;
}

/* *****************Box de botões ver mais e ver menos */
.box_botao_unico {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    align-items: center;
    padding-right: 2vw;
}

.botao_vermais {
    font-family: var(--font-family-koho);
    font-size: .8em;
    font-weight: 500;
    color: var(--cor_branca);
    background-color: var(--cor_principal);
    border: none;
    padding: 0.2em .8em;
    border-radius: 0.8em;
    margin-top: 2vw;
    cursor: pointer;
}

/*ajustes defs botoes param salvar
*/
.box_salvar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;

}
.box_salvar_opcoes {
    display: flex;
    align-items: center;
    justify-content: center;
    width:30%;

}

.ajuste_cor_salvar {
    background-color: var(--cor_cinza_clara);
    color: var(--cor_branca);
    border:none;
}
.ajuste_cor_principal {
    background-color: var(--cor_principal);
    color: var(--cor_branca);
    border: none;
}

.box_flutuantes_headerprincipal {
    position: fixed;
    bottom: 2vw;
    right: 2vw;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    flex-direction: column;
    gap: 2vw;
    z-index:10000;
}

.botao-flutuante-assinatura {
    display: flex;
    background-color: var(--cor_principal);
    color: var(--cor_branca);
    border: 0.2vw solid var(--cor_principal);
    text-decoration: none;
    font-size: .9em;
    cursor: pointer;
    padding: .1vw .4vw;
    border-radius: 1vw;

}

    .botao-flutuante-assinatura i {
        font-size: .9em;
        margin-right: .5vw;
    }



.menu_tres_pontos {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.95);
    border-radius: 0.9vw;
    padding: 1vw;
    display: none;
    z-index: 1000;
    box-shadow: 0 0.2vw 0.6vw rgba(0, 0, 0, 0.1);
    min-width: 15vw;
}



/* ************************Responsividade******************** */
@media only screen and (max-width: 1024px) {
    .perfil_experiencia {
        width: 95%;
    }



    /* Descrição com vídeo */

    .banner_conteudo_secundario {
        margin-top: 1vw 1vw 1vw 1vw;
        width: 100%;
        line-height: 3.5vw;
    }

        .banner_conteudo_secundario video {
            width: 25vw;
            height: 25vw;
        }

    /* Conhecendo o anfitrião */

    .box_anfitriao {
        width: 100%;
        height: 13vw;
    }


    .box_perfil img {
        width: 5vw;
        height: 5vw;
        border-radius: 1.5vw;
    }

    .box_nome {
        max-width: 60vw;
    }


    /* O que levar e o que está incluído */

    .paragrafo_informativo {
        width: 100%;
        line-height: 3.5vw;
    }



    .linha_delimitadora {
        height: 1.5vw;
    }

    /* ajuste delimitador para preço */


    .linha_delimitadora_preco {
        width: 40vw;
        height: 1.9vw;
    }


    /* Idiomas */

    .seletor_bloco {
        gap: 1.5vw;
        margin-top: 2vw;
    }

    .tag_servico {
        border-radius: 0.5vw;
        padding: 0.1vw 0.5vw;
    }

        .tag_servico i {
            margin-right: 0.5vw;
        }


    .box_detalhes_localizacao {
        min-height: 20vw;
        width: 45vw;
    }


        .texto_localizacao i {
            margin-right: 0.8vw;
        }


    /* *****************Ajuste botões */

    .btn_padrao {
        width: 14vw;
        height: 3.0vw;
        border-radius: 0.5vw;
    }

    .btn_avaliar {
        width: 14vw;
        height: 3.0vw;
        border-radius: 0.5vw;
    }

    /* *****************Box de botões ver mais e ver menos */


    .box_flutuantes_headerprincipal {
        gap: 3vw;
    }
    .botao-flutuante-assinatura {
        padding: .5vw 0.8vw;
        border-radius: 5vw;
    }

        .botao-flutuante-assinatura i {
            margin-right: .5vw;
        }



}

@media only screen and (max-width: 768px) {
    .perfil_experiencia {
        width: 95%;
    }


    /* Descrição com vídeo */

    .banner_conteudo_secundario {
        margin-top: 1vw 1vw 1vw 1vw;
        width: 100%;
        line-height: 4.0vw;
        padding:0 2vw;
    }

        .banner_conteudo_secundario video {
            width: 20vw;
            height: 20vw;
        }

    /* Conhecendo o anfitrião */

    .box_anfitriao {
        width: 100%;
        height: 15vw;
    }


        .box_perfil img {
            width: 8vw;
            height: 8vw;
            border-radius: 2vw;

        }

    .box_nome {
        max-width: 60vw;
    }


    /* O que levar e o que está incluído */

    .paragrafo_informativo {
        width: 45vw;
        line-height: 4.0vw;
    }


    .linha_delimitadora {
        height: 1.9vw;
    }




    .linha_delimitadora_preco {
        width: 40vw;
        height: 3.9vw;
    }


    /* Idiomas */

    .seletor_bloco {
        gap: 2vw;
        margin-top: 2vw;
    }

    .tag_servico {
        border-radius: 0.8vw;
        padding: 0.1vw 0.8vw;
    }

        .tag_servico i {
            margin-right: 0.8vw;
        }


    .box_detalhes_localizacao {
        min-height: 25vw;
        width: 45vw;
    }


        .texto_localizacao i {
            margin-right: 1.0vw;
        }


    /* *****************Ajuste botões */

    .btn_padrao {
        width: 14vw;
        height: 4.0vw;
        border-radius: 0.8vw;
    }

    .btn_avaliar {
        width: 14vw;
        height: 4.0vw;
        border-radius: 0.8vw;
    }

    /* *****************Box de botões ver mais e ver menos */



    .box_flutuantes_headerprincipal {
        gap: 3vw;
    }

    .botao-flutuante-assinatura {
        padding: .5vw 0.8vw;
        border-radius: 5vw;
    }

        .botao-flutuante-assinatura i {
            margin-right: .5vw;
        }




}





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

    .perfil_experiencia {
        width: 90%;
    }


    /* Descrição com vídeo */

    .banner_conteudo_secundario {
        margin-top: 1vw 1vw 1vw 1vw;
        width: 100%;
        line-height: 8.0vw;
        padding:0 1vw;
    }

        .banner_conteudo_secundario video {
            width: 50vw;
            height: 50vw;
        }

    /* Conhecendo o anfitrião */

    .box_anfitriao {
        height: 30vw;
        margin-top: 2vw;
    }



        .box_perfil img {
            width: 15vw;
            height: 15vw;
            border-radius: 3vw;

        }

    .box_nome {
        max-width: 85vw;
    }

    .box_nome_prazo {
        margin-left: 1.0vw;
    }


    /* O que levar e o que está incluído */

    .paragrafo_informativo {
        margin-top: 1vw 1vw 1vw 1vw;
        width: 92vw;
        line-height: 8.0vw;
    }

    /* ajuste texto delimitador */


    .linha_delimitadora {
        height: 3vw;
    }



    .linha_delimitadora_preco {
        width: 80vw;
    }

 

    /* Idiomas */

    .seletor_bloco {
        gap: 3vw;
        margin-top:2vw;
    }

    .tag_servico {
        border-radius: 1.0vw;
        padding: 0.1vw 1.5vw;
    }

        .tag_servico i {
            margin-right: 1.0vw;
        }


    .box_detalhes_localizacao {
        min-height: 25vw;
        width: 92vw;
    }



        .texto_localizacao i {
            margin-right: 1.0vw;
        }


    /* *****************Ajuste botões */

    .btn_padrao {
        width: 25vw;
        height: 6.0vw;
        border-radius: 1.0vw;

    }

    .btn_avaliar {
        width: 25vw;
        height: 6.0vw;
        border-radius: 1.0vw;
    }

    /* *****************Box de botões ver mais e ver menos */



    .box_flutuantes_headerprincipal {
        gap: 5vw;
    }

    .botao-flutuante-assinatura {
        padding: .5vw 1.0vw;
        margin-bottom: 5vw;
        border-radius: 5vw;
    }

        .botao-flutuante-assinatura i {
            margin-right: .5vw;
        }


}