Blurb | Divi-Childthemes.com https://divi-childthemes.com Best Place To Find Creatuve Divi Layouts & Child Themes Tue, 01 Sep 2020 08:13:19 +0000 en-US hourly 1 https://wordpress.org/?v=6.9.4 https://divi-childthemes.com/wp-content/uploads/2019/11/cropped-dct-favicon-32x32.png Blurb | Divi-Childthemes.com https://divi-childthemes.com 32 32 Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi https://divi-childthemes.com/flip-card-effects-with-divi-person-blurb-testimonials-number-counter-pricing-module-in-divi/ Fri, 29 Mar 2019 11:30:59 +0000 http://divi-childthemes.com/?p=34382 The post Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi appeared first on Divi-Childthemes.com.

]]>

We are going to show you how to turn Divi Person , Blurb , Testimonials ,
Number Counter , Pricing Module into flip cards without using a plugin! With this method,

Person Module

Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi
Kristiana

Kristiana

Web Designer

Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi
Miranda joy

Miranda joy

Web Designer

Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi
Kriston martin

Kriston martin

Founder

Download Json
Using Json File
Using Video
Manully Implement

Blurb Module

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Your Title Goes Here

Your content goes here. Edit or remove this text inline or in the module Content settings.

Download Json
Using Json File
Using Video
Manully Implement

Testimonials Module

Name Goes Here

CEO

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Name Goes Here

CEO

Name Goes Here

CEO

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Name Goes Here

CEO

Name Goes Here

CEO

Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.

Name Goes Here

CEO

Download Json
Using Json File
Using Video
Manully Implement

Number Module

Yout Title Name

Yout Title Name

Yout Title Name

Yout Title Name

Yout Title Name

Yout Title Name

Download Json
Using Json File
Using Video
Manully Implement

Pricing Module

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Monthly Bandwidth
  • 10 Subdomains
  • 15 Domains

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Bandwidth
  • 10 Subdomains
  • 15 Domains

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Monthly Bandwidth
  • 10 Subdomains
  • 15 Domains

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Monthly Bandwidth
  • 10 Subdomains
  • 15 Domains

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Monthly Bandwidth
  • 10 Subdomains
  • 15 Domains

Table Title

$50
  • 50GB Disk Space
  • 50 Email Accounts
  • 50GB Monthly Bandwidth
  • 10 Subdomains
  • 15 Domains
Download Json
Using Json File
Using Video
Manully Implement

The post Flip Card Effects with Divi Person , Blurb , Testimonials , Number Counter , Pricing Module in Divi appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 6 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-6/ Tue, 08 May 2018 05:49:52 +0000 http://www.dctblog.divi-childthemes.com/?p=27415 Our Blurb Module Design for you to display Services faster and simpler and beautifully with minimal setting and sort code possible in different template styles .different ways to get creative with the Divi Blurb Module using additional CSS code.

The post Transform The Divi Blurb Module Into Creative Design Style 6 appeared first on Divi-Childthemes.com.

]]>
Demo Style 6
Transform The Divi Blurb Module Into Creative Design Style 6

Divi Child Themes

Our themes perform as beautifully as they look. Save time and effort on your WordPress project by getting started here.

Divi Custom Modules

We are a professional and creative website designer and developer. Our Company can handle all sort of IT Projects.

Divi Plugins

Professionally coded, lightweight and well-functioning. Our plugins will supercharge your development capabilities.
Css Code
Transform The Divi Blurb Module Into Creative Design Style 6 
.dct-blurb-style-6{
    text-align: center;
    margin-top: 20px;
    padding: 20px;
    background: #28A6DE;
    border: 1px solid #fff;
    box-shadow: 5px 5px #000;
  }
.dct-blurb-style-6 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 70px;
    border-radius: 50% 0 50% 50%;
    border: 5px solid #fff;
    font-size: 30px;
    color: #fff !important;
    margin-bottom: 30px;
     transition:all 0.3s ease 0s;
}
.dct-blurb-style-6:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    border-radius: 50% 50% 50% 0;
}
.dct-blurb-style-6 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon i{
    transform: rotate(45deg);
}
.dct-blurb-style-6 .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    margin: 0 0 10px 0;
    font-variant:small-caps;
}
.dct-blurb-style-6 .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    font: 13px;
    color: #fff;
    line-height: 25px;
  text-align: center;
    transition: all 300ms ease 0s;
  font-variant:small-caps;
}
  /*To Change Blur Module Defalut Color To pink Color */
.dct-blurb-style-6.pink  { background: #d5198d; }
/*To Change Blur Module Defalut Color To pink Color */
/*To Change Blur Module Defalut Color To green Color */
.dct-blurb-style-6.green  { background: #63bb54; }
/*To Change Blur Module Defalut Color To green Color */
/*To Change Blur Module Defalut Color To blue Color */
.dct-blurb-style-6.blue  { background: #1a9fab; }
/*To Change Blur Module Defalut Color To blue Color */
/*To Change Blur Module Defalut Color To orange Color */
.dct-blurb-style-6.orange  { background: #ea7900; }
/*To Change Blur Module Defalut Color To orange Color */
/*To Change Blur Module Defalut Color To purple Color */
.dct-blurb-style-6.purple  { background: #61009F; }
/*To Change Blur Module Defalut Color To purple Color */
/*To Change Blur Module Defalut Color To red Color */
.dct-blurb-style-6.red  { background: #BA1200; }
/*To Change Blur Module Defalut Color To red Color */
/*To Change Blur Module Defalut Color To olive  Color */
.dct-blurb-style-6.olive  { background: #808000; }
/*To Change Blur Module Defalut Color To olive  Color */ 
@media only screen and (max-width:990px){
    .dct-blurb-style-6{ margin-bottom: 30px; }
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 6

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id=”optin_3″]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 6 appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 5 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-5/ Fri, 04 May 2018 10:39:10 +0000 http://www.dctblog.divi-childthemes.com/?p=27405 Our Blurb Module Design for you to display Services faster and simpler and beautifully with minimal setting and sort code possible in different template styles .different ways to get creative with the Divi Blurb Module using additional CSS code.

The post Transform The Divi Blurb Module Into Creative Design Style 5 appeared first on Divi-Childthemes.com.

]]>
Demo Style 5
Transform The Divi Blurb Module Into Creative Design Style 5

Divi Child Themes

Our themes perform as beautifully as they look. Save time and effort on your WordPress project by getting started here.

Divi Custom Modules

We are a professional and creative website designer and developer. Our Company can handle all sort of IT Projects.

Divi Plugins

Professionally coded, lightweight and well-functioning. Our plugins will supercharge your development capabilities.
CSS Code
Transform The Divi Blurb Module Into Creative Design Style 5 
.dct-blurb-style-5{
   position: relative;
border: 2px solid #fff;
border-radius: 0px 30px;
box-shadow: 5px 5px #000;
background: #d5198d;
padding: 30px;
}
.dct-blurb-style-5:before{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform: scale3d(1.08, 1.08, 1.08);
    transition: all 0.33s ease 0s;
}
.dct-blurb-style-5:hover:before{
    opacity: 1;
    transform: scale3d(1, 1, 1);
}
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image {
  margin-bottom:60px;
  margin-top:20px;
  }
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    width: 65px;
    height: 65px;
    line-height: 60px;
    font-size: 30px;
    color: #fff !important;
    text-align: center;
    border: 2px solid #fff;
    position: inherit;
    top: 55px;
    left: 45%;
    transition: all 0.3s ease 0s;
    border-radius: 50%;
}
.dct-blurb-style-5:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{ transform: translateY(20px); }
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before,
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    content: "";
    height: 2px;
    background: #fff;
    position: absolute;
    top: -20px;
    left: 10px;
    right: 10px;
    transition: all 0.3s ease 0s;
}
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    top: auto;
    bottom: -20px;
    left: 10px;
    right: 10px;
}
.dct-blurb-style-5:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{
    top: -25px;
    transform: rotate(90deg);
}
.dct-blurb-style-5:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    transform: rotate(-90deg);
    bottom: -25px;
}
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 12px 0;
    position: relative;
  text-align:center;
  font-variant:small-caps;
}
.dct-blurb-style-5 .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    font-size: 13px;
    color: #fff;
    line-height: 27px;
    letter-spacing: 1px;
    margin: 0;
   text-align:center;
  font-variant:small-caps;
}
 
@media only screen and (max-width:990px){
    .dct-blurb-style-5{ margin-bottom: 30px; }
}
@media only screen and (max-width:767px){
    .dct-blurb-style-5:before{ transform: scale3d(1, 1, 1); }
    .dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{ top: 30px; }
}
@media only screen and (max-width:480px){
    .dct-blurb-style-5 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{ top: 40px; }
}
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 5

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id=”optin_3″]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 5 appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 4 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-4/ Tue, 01 May 2018 07:55:32 +0000 http://www.dctblog.divi-childthemes.com/?p=27378 The post Transform The Divi Blurb Module Into Creative Design Style 4 appeared first on Divi-Childthemes.com.

]]>
Demo Style 4
Transform The Divi Blurb Module Into Creative Design Style 4

Divi Child Themes

Our themes perform as beautifully as they look. Save time and effort on your WordPress project by getting started here.

Divi Custom Modules

We are a professional and creative website designer and developer. Our Company can handle all sort of IT Projects.

Divi Plugins

Professionally coded, lightweight and well-functioning. Our plugins will supercharge your development capabilities.
Css Code
Transform The Divi Blurb Module Into Creative Design Style 4 
.dct-blurb-style-4{ text-align: center; }
.dct-blurb-style-4 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    display: inline-block;
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    background: #1a9fab;
    font-size: 40px;
    color: #fff !important;
    margin-bottom: 40px;
    position: relative;
}
.dct-blurb-style-4 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{
    content: "";
    border: 3px solid #fff;
    border-radius: 50%;
    position: absolute;
    top: 10px;
    left: 10px;
    bottom: 10px;
    right: 10px;
    opacity: 1;
    transition: all 0.3s ease 0s;
}
.dct-blurb-style-4:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
}
.dct-blurb-style-4 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    content: "";
    border-top: 25px solid #1a9fab;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    position: absolute;
    bottom: -22px;
    left: 40%;
}
.dct-blurb-style-4 .et_pb_blurb_content  .et_pb_blurb_container {
    padding: 20px 25px;
    background: #1a9fab;
    border-radius: 15px;
    color: #fff;
    position: relative;
}
.dct-blurb-style-4 .et_pb_blurb_content .et_pb_blurb_container  .et_pb_blurb_description:before{
    content: "";
    border: 3px solid #fff;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    transition: all 0.3s ease 0s;
}

.dct-blurb-style-4 .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{
    display: block;
    font-size: 20px;
    font-weight: 700;
     margin: 0 0 12px 0;
    position: relative;
  text-align:center;
  color:#fff;
font-variant: small-caps;
}
.dct-blurb-style-4 .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    font-size: 15px;
    line-height: 27px;
    letter-spacing: 1px;
  text-align:center;
font-variant: small-caps;
}
 

@media only screen and (max-width:990px){
    .dct-blurb-style-4{ margin-bottom: 30px; }
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 4

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id=”optin_3″]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 4 appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 3 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-3/ Mon, 30 Apr 2018 05:36:58 +0000 http://www.dctblog.divi-childthemes.com/?p=27369 Our Blurb Module Design for you to display Services faster and simpler and beautifully with minimal setting and sort code possible in different template styles .different ways to get creative with the Divi Blurb Module using additional CSS code.

The post Transform The Divi Blurb Module Into Creative Design Style 3 appeared first on Divi-Childthemes.com.

]]>
Demo Style 3
Transform The Divi Blurb Module Into Creative Design Style 3

Divi Child Themes

Our themes perform as beautifully as they look. Save time and effort on your WordPress project by getting started here.

Divi Custom Modules

We are a professional and creative website designer and developer. Our Company can handle all sort of IT Projects.

Divi Plugins

Professionally coded, lightweight and well-functioning. Our plugins will supercharge your development capabilities.
Css Code
Transform The Divi Blurb Module Into Creative Design Style 3 
.dct-blurb-style-3 {
  border: 2px solid #f03089;
padding: 10px;
border-radius: 30px;
box-shadow: 5px 5px #f03089;
 }
.dct-blurb-style-3 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    display: inline-block;
    width: 150px;
    height: 150px;
    line-height: 150px;
    border-radius: 50%;
    background: #f03089;
    font-size: 40px;
    color: #fff !important;
    margin-bottom: 50px;
    position: relative;
}
.dct-blurb-style-3 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{
    content: "";
    position: absolute;
    top: 20px;
    left: 20px;
    bottom: 20px;
    right: 20px;
    border: 5px solid #fff;
    border-right-color: transparent;
    border-radius: 50%;
    transition: all 0.3s ease 0s;
}
.dct-blurb-style-3:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{ transform: rotate(180deg); }
.dct-blurb-style-3 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    content: "";
    width: 2px;
    height: 30px;
    background: #f03089;
    margin: 0 auto;
    position: absolute;
    bottom: -30px;
    left: 0;
    right: 0;
}
.dct-blurb-style-3 .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{
    font-size: 20px;
    font-weight: 600;
    color: #072458;
    letter-spacing: 1px;
    margin: 0;
  text-align:center;
   font-variant:small-caps;
}
.dct-blurb-style-3 .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    font-size: 15px;
    color: #6f6f6f;
    line-height: 27px;
    letter-spacing: 1px;
    margin: 10px 0 0 0;
  text-align:center;
   font-variant:small-caps;
}

@media only screen and (max-width:990px){
    .dct-blurb-style-3{ margin-bottom: 30px; }
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 3

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id=”optin_3″]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 3 appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 2 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-2/ Thu, 26 Apr 2018 02:31:43 +0000 http://www.dctblog.divi-childthemes.com/?p=27361 Our Blurb Module Design for you to display Services faster and simpler and beautifully with minimal setting and sort code possible in different template styles .different ways to get creative with the Divi Blurb Module using additional CSS code.

The post Transform The Divi Blurb Module Into Creative Design Style 2 appeared first on Divi-Childthemes.com.

]]>
Demo Style 2
Transform The Divi Blurb Module Into Creative Design Style 2

Try our Plugins

Helping you make changes to your website with no knowledge of code.

Browse Our Child Themes

Kick start your next web design project with our beautiful child themes!

Our Tutorials

Our Skill will help you achieve both the aesthetic and functional goals.
Css Code
Transform The Divi Blurb Module Into Creative Design Style 2 
.dct-blurb-style-2{
    padding: 50px 35px;
    background: #fff;
    border: 1px solid #eee;
    border-bottom-color: #428ef8;
    text-align: center;
    position: relative;
    transition: all 0.5s ease 0s;
}
.dct-blurb-style-2:hover{ border: 1px solid #428ef8; }
.dct-blurb-style-2:before,
.dct-blurb-style-2:after{
    content: "";
    width: 70%;
    height: 5px;
    background: #428ef8;
    opacity: 0;
    position: absolute;
    top: -3px;
    left: 35%;
    transform: translateX(-50%);
    transition: all 0.5s ease 0s;
}
.dct-blurb-style-2:hover:before,
.dct-blurb-style-2:hover:after{
    opacity: 1;
    left: 50%;
}
.dct-blurb-style-2:after{
    top: auto;
    bottom: -3px;
}
.dct-blurb-style-2 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
    width: 65px;
    height: 65px;
    line-height: 65px;
    border-radius: 50%;
    background: #428ef8;
    margin: 0 auto 20px;
    font-size: 26px;
color: #fff !important;
}
.dct-blurb-style-2 .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{
    font-size: 20px;
    font-weight: bold;
    color: #252525;
    margin: 0 0 10px 0;
    transition: all 0.5s ease 0s;
  text-align:center;
  font-variant:small-caps;
}
.dct-blurb-style-2:hover .et_pb_blurb_content .et_pb_blurb_container .et_pb_module_header{ opacity: 0; }
.dct-blurb-style-2 .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    font-size: 14px;
    color: #7a7a7a;
    line-height: 25px;
    margin: 0;
    transition: all 0.5s ease 0s;
  text-align:center;
  font-variant:small-caps;
}
.dct-blurb-style-2:hover .et_pb_blurb_content .et_pb_blurb_container .et_pb_blurb_description{
    margin-top: -20px;
    padding-bottom: 20px;
}
@media only screen and (max-width:990px){
    .dct-blurb-style-2{ margin-bottom: 30px; }
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 2

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id=”optin_3″]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 2 appeared first on Divi-Childthemes.com.

]]> Transform The Divi Blurb Module Into Creative Design Style 1 https://divi-childthemes.com/transform-the-divi-blurb-module-into-creative-design-style-1/ Wed, 25 Apr 2018 13:33:46 +0000 http://www.dctblog.divi-childthemes.com/?p=27262 Our Blurb Module Design for you to display Services faster and simpler and beautifully with minimal setting and sort code possible in different template styles .different ways to get creative with the Divi Blurb Module using additional CSS code.

The post Transform The Divi Blurb Module Into Creative Design Style 1 appeared first on Divi-Childthemes.com.

]]>
Demo Style 1
Transform The Divi Blurb Module Into Creative Design Style 1

Try our Plugins

Helping you make changes to your website with no knowledge of code.

Browse Our Child Themes

Kick start your next web design project with our beautiful child themes!

Our Tutorials

Our Skill will help you achieve both the aesthetic and functional goals.
Css Code
Transform The Divi Blurb Module Into Creative Design Style 1 
.dct-blurb-style-1{ border:2px solid #0fb513;
  padding:10px;
  border-radius:0px 30px;
  box-shadow: 0 0 1px 5px #0fb513;
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{
   display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin-bottom: 80px;
    position: relative;
    color: #fff !important;
    background: #0fb513;
    padding: 25px 20px;
    font-size: 30px;
    box-shadow: -3px 3px 3px rgba(0,0,0,0.5);
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:before{
    content: "";
    background: #0fb513;
    border-radius: 50%;
    position: inherit;
    top: -10px;
    left: -10px;
    bottom: -10px;
    right: -10px;
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{
    content: "";
    width: 4px;
    height: 0;
    background: #0fb513;
    margin: 0 auto;
    position: absolute;
    bottom: -55px;
    left: 0;
    right: 0;
    transition: all 0.3s ease 0s;
}
.dct-blurb-style-1:hover .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon:after{ height: 45px; }
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon i{
    display: inline-block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    line-height: 80px;
    background: #fff;
    box-shadow: -5px 5px 5px rgba(0,0,0,0.5);
    font-size: 35px;
    color: #0fb513;
    position: absolute;
    top: 0;
    left: 0;
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_module_header{
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #000;
    margin: 0px 0 10px 0;
    position: relative;
  text-align:center;
  font-variant:small-caps;
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_module_header:before{
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    padding: 5px;
    margin: -20px auto 0px;
    border: 5px solid #0fb513;
    box-shadow: -3px 3px 3px rgba(0,0,0,0.5);
    position: absolute;
    top: -30px;
    left: 0;
    right: 0;
}
.dct-blurb-style-1 .et_pb_blurb_content .et_pb_blurb_description{
    font-size: 15px;
    color: #6f6f6f;
    letter-spacing: 1px;
    line-height: 27px;
    margin: 0;
  text-align:center;
  font-variant:small-caps;
}

Subscribe To Download

Transform The Divi Blurb Module Into Creative Design Style 1

Once you scbscribe then download link will be available.it dose not take long to get left behind! Stay up to date with the latest news from us.Each week we share useful content, development news, WordPress tips, Divi tutorials and more.

[et_bloom_locked optin_id="optin_3"]

More DemoDownload

[/et_bloom_locked]

The post Transform The Divi Blurb Module Into Creative Design Style 1 appeared first on Divi-Childthemes.com.

]]>