783-289-395

Kreatywni@www.pl

External XVG USE XLINK

 

In Page.php -> <?php include_once(get_stylesheet_directory() . '/assets/svg/kpl_svg_defs.svg'); ?>
HTML

<div class="et_pb_module dipl_image_mask dipl_image_mask_0">
<div class="et_pb_module_inner">
<div class="dipl_image_mask_container">
<div class="dipl_image_mask_inner"></div>
</div>
</div>
</div>

CSS

.dipl_image_mask .dipl_image_mask_container {
        position: relative;
        display: -ms-flexbox;
        display: flex;
}

.dipl_image_mask_0 .dipl_image_mask_container .dipl_image_mask_inner {
        width: 100%;
        transform: scale(1) rotate(
0deg
);
        -webkit-mask-position-x: 0%;
        -moz-mask-position-x: 0%;
        -o-mask-position-x: 0%;
        mask-position-x: 0%;
        -webkit-mask-position-y: 0%;
        -moz-mask-position-y: 0%;
        -o-mask-position-y: 0%;
        mask-position-y: 0%;
        -webkit-mask-image: url(https://diviplus.io/wp-content/plugins/divi-plus/includes/assets/image_mask/fluid/fluid_6.svg);
        -moz-mask-image: url(https://diviplus.io/wp-content/plugins/divi-plus/includes/assets/image_mask/fluid/fluid_6.svg);
        -o-mask-image: url(https://diviplus.io/wp-content/plugins/divi-plus/includes/assets/image_mask/fluid/fluid_6.svg);
        mask-image: url(https://diviplus.io/wp-content/plugins/divi-plus/includes/assets/image_mask/fluid/fluid_6.svg);
        height: 500px;
}

.dipl_image_mask .dipl_image_mask_container .dipl_image_mask_inner {
        display: block;
        float: left;
        width: 100%;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        line-height: 1;
}
.dipl_image_mask_0 .dipl_image_mask_inner {
        background-position: center right;
        background-image: url(https://diviplus.io/wp-content/uploads/2021/01/insurace-best-company.jpg)!important;
}
.dipl_image_mask_inner {
        background-size: cover;
}
.dipl_image_mask_inner {
        background-size: cover;
        background-position: 50%;
        background-repeat: no-repeat;
}

<style>
.dipl_image_mask .dipl_image_mask_container {
position: relative;
display: -ms-flexbox;
display: flex;
}
.dipl_image_mask_0 .dipl_image_mask_container .dipl_image_mask_inner {
width: 100%;
transform: scale(1) rotate(
0deg
);
-webkit-mask-position-x: 0%;
-moz-mask-position-x: 0%;
-o-mask-position-x: 0%;
mask-position-x: 0%;
-webkit-mask-position-y: 0%;
-moz-mask-position-y: 0%;
-o-mask-position-y: 0%;
mask-position-y: 0%;
-webkit-mask-image: url(https://kreatywni.info/kreatywni/wp-content/uploads/2021/06/fluid_2.svg);
-moz-mask-image: url(https://kreatywni.info/kreatywni/wp-content/uploads/2021/06/fluid_2.svg);
-o-mask-image: url(https://kreatywni.info/kreatywni/wp-content/uploads/2021/06/fluid_2.svg);
mask-image: url(https://kreatywni.info/kreatywni/wp-content/uploads/2021/06/fluid_2.svg);
}
.dipl_image_mask .dipl_image_mask_container .dipl_image_mask_inner {
display: block;
float: left;
width: 100%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
.dipl_image_mask_inner {
background-size: cover;
background-position: 50%;
background-repeat: no-repeat;
}
</style>

<div class="et_pb_module dipl_image_mask dipl_image_mask_0">
<div class="et_pb_module_inner">
<div class="dipl_image_mask_container"><div class="dipl_image_mask_inner"><img src="https://kreatywni.info/kreatywni/wp-content/uploads/2021/05/Process-3.jpg"></div></div>
</div>
</div>