diff --git a/components/HomeOne/HeroSlider.js b/components/HomeOne/HeroSlider.js index 6f6ef43..f39580f 100755 --- a/components/HomeOne/HeroSlider.js +++ b/components/HomeOne/HeroSlider.js @@ -31,14 +31,14 @@ const HeroSlider = () => { className="home-slider owl-carousel owl-theme" {...options} > -
+
-
+ {/*
Shape -
+
*/}

Exceptional Health Care for Pregnant Mothers & Newborn

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.

@@ -58,15 +58,15 @@ const HeroSlider = () => {
-
+
-
+ {/*
Shape -
-
+
*/} +

Caring Health is Important Than All

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.

@@ -85,15 +85,15 @@ const HeroSlider = () => {
-
+
-
+ {/*
Shape -
-
+
*/} +

We Offer Highly Treatments

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida.

diff --git a/components/HomeThree/OurExpertise.js b/components/HomeThree/OurExpertise.js index d14e989..b6156ed 100755 --- a/components/HomeThree/OurExpertise.js +++ b/components/HomeThree/OurExpertise.js @@ -3,42 +3,46 @@ import React from 'react'; const OurExpertise = () => { return (
-
-
+
+
+ Speciality +

Our Expertise

+
+
-
+ {/*
Speciality

Our Expertise

-
+
*/}
-

Home Care
Consult

+

Home Care
Consult

Lorem ipsum dolor sit amet, is consectetur adipiscing

-

Lactation Consultancy

+

Lactation
Consultancy

Lorem ipsum dolor sit amet, is consectetur adipiscing

-

Follow Up care & Support

+

Follow Up care
& Support

Lorem ipsum dolor sit amet, is consectetur adipiscing

-

Telehealth
Conference

+

Telehealth
Conference

Lorem ipsum dolor sit amet, is consectetur adipiscing

@@ -47,7 +51,7 @@ const OurExpertise = () => {
-
+
Speciality @@ -66,4 +70,4 @@ const OurExpertise = () => { ) } -export default OurExpertise; \ No newline at end of file +export default OurExpertise; diff --git a/public/css/responsive.css b/public/css/responsive.css index bacf186..3923776 100755 --- a/public/css/responsive.css +++ b/public/css/responsive.css @@ -41,7 +41,7 @@ .slider-item { height: 400px; } - .slider-item .slider-shape img { + /* .slider-item .slider-shape img { position: relative; top: 0; right: 0; @@ -49,10 +49,9 @@ margin-left: auto; margin-right: auto; margin-bottom: 20px; - height: 400px; - object-fit: cover; - } - .slider-item .slider-shape-two img { + height: 600px; + } */ + /* .slider-item .slider-shape-two img { position: relative; top: 0; right: 0; @@ -60,10 +59,9 @@ margin-left: auto; margin-right: auto; margin-bottom: 20px; - height: 400px; - object-fit: cover; - } - .slider-item .slider-shape-three img { + height: 600px; + } */ + /* .slider-item .slider-shape-three img { position: relative; top: 0; right: 0; @@ -71,10 +69,9 @@ margin-left: auto; margin-right: auto; margin-bottom: 20px; - height: 400px; - object-fit: cover; - } - .slider-item:before { + height: 600px; + } */ + /* .slider-item:before { position: absolute; content: ''; width: 100%; @@ -83,27 +80,41 @@ top: 0; background-color: #0046c0; opacity: .80; - } + } */ .slider-item .slider-text { margin-top: 0px; text-align: center; } .slider-item .slider-text h1 { font-size: 26px; - margin-bottom: 18px; + /* margin-bottom: 18px; */ max-width: 100%; } .slider-item .slider-text p { margin-bottom: 30px; max-width: 100%; } - /* text for the two imgs */ - .slider-infos{ - top: 30%; - right: 0; - transform: translateY(-50%); - } + /* text for the two images */ +.slider-info{ + position: absolute; + top: 50%; + right: 0; + transform: translateY(-50%); +} + .slider-info-one{ + position: absolute; + top: 50%; + left: 0; + transform: translateY(-50%); +} + + .slider-info-two{ + position: absolute; + top: 10%; + left: 0; + transform: translateY(-50%); +} .common-btn a { font-size: 13px; padding: 13px 14px 12px; @@ -117,7 +128,7 @@ display: none !important; } .home-slider.owl-theme .owl-dots { - bottom: 20px; + /* bottom: 20px; */ } .home-slider.owl-theme .owl-dots .owl-dot span { width: 20px; @@ -1523,42 +1534,42 @@ margin-left: auto; margin-right: auto; } - .slider-item .slider-shape img { + /* .slider-item .slider-shape img { position: relative; top: 0; right: 0; left: 0; margin-left: auto; margin-right: auto; - /* max-width: 550px; */ + max-width: 550px; margin-bottom: 30px; - } - .slider-item .slider-shape-two img { + } */ + /* .slider-item .slider-shape-two img { position: relative; top: 0; right: 0; left: 0; margin-left: auto; margin-right: auto; - /* max-width: 550px; */ + max-width: 550px; margin-bottom: 30px; - } - .slider-item .slider-shape-three img { + } */ + /* .slider-item .slider-shape-three img { position: relative; top: 0; right: 0; left: 0; margin-left: auto; margin-right: auto; - /* max-width: 550px; */ + max-width: 550px; margin-bottom: 30px; - } + } */ .slider-item .slider-text { margin-top: 0; } .slider-item .slider-text h1 { font-size: 30px; - margin-bottom: 30px; + margin-bottom: 0; margin-left: auto; margin-right: auto; } @@ -2791,20 +2802,20 @@ @media only screen and (min-width: 992px) and (max-width: 1199px) { /*-- Home Slider --*/ - .slider-item .slider-shape img { + /* .slider-item .slider-shape img { top: 115px; right: 0; - /* max-width: 520px; */ - } - .slider-item .slider-shape-two img { + max-width: 520px; + } */ + /* .slider-item .slider-shape-two img { top: 135px; - /* max-width: 520px; */ + max-width: 520px; right: 0; - } - .slider-item .slider-shape-three img { + } */ + /* .slider-item .slider-shape-three img { top: 150px; - /* max-width: 500px; */ - } + max-width: 500px; + } */ .common-btn a { padding: 16px 22px; } @@ -2851,7 +2862,7 @@ /*-- End Welcome --*/ /*-- Speciality --*/ .speciality-left { - padding-left: 30px; + padding-left: 30px; padding-right: 65px; } /*-- End Speciality --*/ diff --git a/public/css/style.css b/public/css/style.css index 10259cc..05b39c0 100755 --- a/public/css/style.css +++ b/public/css/style.css @@ -421,9 +421,9 @@ button:focus { /*-- End Navbar --*/ /*-- Home Slider --*/ -.slider-item-img { +/* .slider-item-img { background-image: url("/images/home-one/home-slider-bckgrd.png"); -} +} */ .slider-item { background-size: cover; @@ -432,14 +432,27 @@ button:focus { height: 700px; position: relative; } + +.slider-item-img-1 { + background-image: url("/images/home-one/home-slider-1.png"); +} -.slider-item .slider-shape img { +.slider-item-img-2 { + background-image: url("/images/home-one/home-slider-2.png"); +} + +.slider-item-img-3 { + background-image: url("/images/home-one/home-slider-3.png"); + background-size: 100% 100%; +} + +/* .slider-item .slider-shape img { width: 100%; height: 700px; object-fit: cover; -} +} */ -.slider-item .slider-shape-two img { +/* .slider-item .slider-shape-two img { width: 100%; height: 700px; object-fit: cover; @@ -447,11 +460,10 @@ button:focus { .slider-item .slider-shape-three img { width: 100%; - height: 700px; - object-fit: cover; -} + height: 100%; +} */ -.slider-item::before { +/* .slider-item::before { position: absolute; content: ''; width: 100%; @@ -460,7 +472,7 @@ button:focus { top: 0; background-color: #0046c0; opacity: .80; -} +} */ .slider-item .slider-text { position: relative; @@ -469,15 +481,22 @@ button:focus { .slider-info{ position: absolute; top: 50%; - right: 0; + right: 100px; transform: translateY(-50%); } -.slider-infos{ +.slider-info-one{ position: absolute; - bottom: 25%; - left: 30px; - transform: translateX(10%); + top: 50%; + left: 100px; + transform: translateY(-50%); +} + +.slider-info-two{ + position: absolute; + top: 50%; + left: 100px; + transform: translateY(-10%); } .slider-item .slider-text h1 { @@ -1969,12 +1988,12 @@ footer { .speciality-right { background-image: url("/images/about5.jpg"); background-size:cover; - background-position: center center; + background-position: 30% center; background-repeat: no-repeat; border-radius: 10px 0 0 10px; position: relative; width: 100%; - height: 100%; + height: 95%; } .speciality-right img { @@ -1984,7 +2003,7 @@ footer { .speciality-right .speciality-emergency { position: absolute; bottom: 20px; - left: -70px; + left: -50px; background-color: #0046c0; padding: 30px 295px 25px 40px; border-radius: 10px; @@ -2032,8 +2051,8 @@ footer { } .speciality-left { - padding-left: 55px; - padding-right: 120px; + /* padding-left: 55px; */ + padding-right: 55px; } /*-- End Speciality --*/