Elementor Pro Call To Action Widget | abrindo um popup

Neste vídeo eu ensino a criar um Elementor Pro Call To Action

Abaixo você pode copiar o código CSS usado no Tutorial “Elementor Pro Call To Action Widget | abrindo um popup“

/*****************************************************
SEÇÃO FORMULÁRIO DE BUSCA, LISTA DE ÍCONES E CALL T O ACTION (INFOBOX) *************************************************************/

/* SEARCH FORM */
.elementor-search-form i{
    width: 200px;
    height: 30px;
    background: url("https://bras.rodrigomilano.com.br/wp-content/uploads/2021/07/grey-search.svg") center left no-repeat;
}
/****************************************************************************/

/* LISTAS DESTAQUES */
/* regras que adicionam o sublinhado verde aos links da lista */

.items span{
    position: relative;/* faz ocupar somente o espaço do tamanho da palavra */
}
.items span:before{
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    background-color: #008542;
    bottom: -3px;
    left: 0;
    transition: all ease-in-out 100ms;
}

.items span:hover:before{
    height: 4px;
    bottom: -5px;
}
/******** CTA (INFOBOX)*/

/* REGRA QUE FAZ O BOTÃO FICAR COM O ÍCONE DE PLAY E POSICIONADO NO LUGAR CORRETO */

.infobox .elementor-cta__button-wrapper{
    /*border: 1px solid red;*/
    position: absolute;
    transform: translateY(-98px);
    width: 52px;
    background: url("https://bras.rodrigomilano.com.br/wp-content/uploads/2021/07/arrow.svg") left center no-repeat;
    background-size: contain;
}
@media screen and (max-width: 1024px){
    .infobox .elementor-cta__button-wrapper{
    transform: translateY(-59px);
    width: 30px;
}
}
@media screen and (max-width: 768px){
    .infobox .elementor-cta__button-wrapper{
    transform: translateY(-93px);
    width: 30px;
}
}

@media screen and (max-width:345px){
    .infobox .elementor-cta__button-wrapper{
    transform: translateY(-104px);
    width: 40px;
}
}
.infobox .elementor-cta__button-wrapper a{
    padding: 25px 0px;
    display: block;
}
/* REGRA QUE ADICIONA O ESPAÇO À ESQUERDA DO TÍTULO E SUBTÍTULO */
.infobox .elementor-cta__title{
    margin-left: 86px
}
.infobox .elementor-cta__description{
    text-indent: 86px;
}
@media screen and (max-width: 1024px){
    .infobox .elementor-cta__title{
    margin-left: 40px
}
.infobox .elementor-cta__description{
    text-indent: 40px;
}
}
@media screen and (max-width:345px){
    .infobox .elementor-cta__title{
    margin-left: 50px
}
.infobox .elementor-cta__description{
    text-indent: 50px;
}
}

Se você é Corretor de Imóveis e está fazendo o seu site ou precisa de uma Landing Page para Corretores de Imóveis, veja este modelo