Thank you for using Divi Cloud

ADD THE FOLLOWING CODE TO COMPLETE IT  ↓

Give me the css

@media all and (max-width: 980px) {

body .et_pb_column .woocommerce ul.products li.product:nth-child(n) {

margin-top: 23% !important;

}

}

@media all and (min-width: 980px) {

.et_pb_column .woocommerce ul.products li.product {

margin-top: 10% !important;

}

}

.et_pb_shop_0 .et_shop_image img {

border-radius: 8px !important;

}

.et_pb_shop_0 li.product:hover .price {

bottom: -33px !important;

}

.mont-font {

font-family: “Montserrat Alternates”, sans-serif;

}

.et_pb_bg_layout_dark .et_pb_slide_description {

text-shadow: none !important;

}

h1,

h2,

h3,

h4,

h5,

h6 {

font-family: ‘Great Vibes’, cursive !important;

}

h2.woocommerce-loop-product__title {

font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif !important;

}

.main-slider .et_pb_slide_content p {

font-family: ‘Montserrat Alternates’, sans-serif;

font-weight: 500;

}

.main-slider .et_pb_slides .et_pb_slider_container_inner {

padding: 10% 25px;

}

.main-slider .et_pb_slide_description {

background-color: rgba(255, 255, 255, 0.9);

border-radius: 50%;

box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);

height: 500px;

width: 500px;

}

.main-slider .et-pb-arrow-prev,

.et-pb-arrow-next {

background-color: #fff;

border-radius: 50%;

font-size: 30px;

padding: 10px;

color: #ff887b !important;

transition: all 0.5s ease-in;

}

.main-slider .et-pb-arrow-prev:hover,

.et-pb-arrow-next:hover {

background-color: #ff887b;

color: #fff !important;

border-radius: 50%;

font-size: 30px;

padding: 10px;

}

.main-slider .et-pb-controllers a {

background-color: rgba(255, 136, 123, 0.3) !important;

border: 7px solid #fff !important;

border-radius: 50px !important;

height: 20px !important;

width: 20px !important;

box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);

}

@media screen and (min-width: 980px) {

.main-slider .et_pb_bg_layout_dark .et_pb_slide_description {

padding-top: 25%;

}

.main-slider .et_pb_slides .et_pb_slider_container_inner {

padding: 10% 0 10% 50%;

}

}

@media screen and (min-width: 768px) and (max-width: 980px) {

.main-slider .et_pb_slide_description {

height: 400px;

width: 400px;

}

}

@media screen and (min-width: 980px) and (max-width: 1250px) {

.main-slider .et_pb_bg_layout_dark .et_pb_slide_description {

padding-top: 35%;

}

.main-slider .et_pb_slides .et_pb_slider_container_inner {

padding: 10% 0 10% 40%;

}

}

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

.main-slider .et_pb_slide_description {

height: 300px;

width: 300px;

}

.box-index {

color: #ebebeb;

display: inline-block;

font-family: montserrat alternates;

font-size: 60px;

font-weight: 400;

height: 170px;

left: 0;

line-height: 170px;

position: absolute;

top: -20px;

z-index: 100 !important;

}

}

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

.main-slider .et_pb_bg_layout_dark .et_pb_slide_description {

padding-top: 25%;

}

}

.vibes-font {

font-family: “Great Vibes”, cursive;

}

.box-index {

color: #ebebeb;

display: inline-block;

font-family: montserrat alternates;

font-size: 260px;

font-weight: 400;

height: 170px;

left: 0;

line-height: 170px;

position: absolute;

top: -20px;

z-index: 100 !important;

}

.readmore::before {

background: #fff none repeat scroll 0 0;

border-radius: 50%;

content: “”;

font-family: fontawesome;

font-weight: 400;

height: 20px;

left: 0;

line-height: 20px;

position: absolute;

text-align: center;

top: 5px;

width: 20px;

}

.readmore {

color: #fff;

display: inline-block;

font-weight: 700;

padding-left: 30px;

position: relative;

margin-top: 15px;

}

.readmore::before,

.readmore:hover {

color: #ff887b;

}

h1.open-sans {

font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif !important;

}

.small-jar {

width: 150px;

}

.item-massage-service {

border-bottom: 1px solid #ccc;

padding: 50px 0;

}

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

.main-slider .et_pb_slide_description {

height: 300px;

width: 300px;

}

.box-index {

color: #ebebeb;

display: inline-block;

font-family: montserrat alternates;

font-size: 150px !important;

font-weight: 400;

height: 170px;

left: -40px;

line-height: 170px;

position: absolute;

top: -60px;

z-index: 100 !important;

}

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

.small-jar {

width: 100% !important;

}

.item-massage-service {

padding: 50px !important;

}

}

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

.main-slider .et_pb_slide_description {

height: 250px;

width: 250px;

}

}

DELETE THIS SECTION AFTER THAT’S DONE ↓

How to add it

Cosmetic

Beauty Spa

New

Collection

Exquisite bright skin

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed vulputate massa. Fusce ante magna

>

Exquisite bright skin

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed vulputate massa. Fusce ante magna

>

02

Cosmetic Package

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula eget lorem sed eleifend. Vivamus congue sodales dolor, non accumsan massa congue nec.

Swedish Massage

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula eget lorem sed eleifend.
Read more

Deep Tissue Massage

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula eget lorem sed eleifend.
Read more

Hot Stone Massage

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula eget lorem sed eleifend.
Read more

03

Clients Say

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vehicula eget lorem sed eleifend. Vivamus congue sodales dolor, non accumsan massa congue nec.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut cursus mi. Cras scelerisque lectus risus, vel scelerisque mi sagittis non. Fusce euismod est magna, vitae ultrices felis scelerisque id.

Shannon Nicholas

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut cursus mi. Cras scelerisque lectus risus, vel scelerisque mi sagittis non. Fusce euismod est magna, vitae ultrices felis scelerisque id.

Jenny Genola

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut cursus mi. Cras scelerisque lectus risus, vel scelerisque mi sagittis non. Fusce euismod est magna, vitae ultrices felis scelerisque id.

Camerol Diah

Sign Up for our Newsletter

Be the first to hear about new products and exclusive discounts.

Share This