Files
templates/web/healthcare/nurgo/css/style.css
2024-05-21 05:06:32 +02:00

979 lines
17 KiB
CSS

/*--------------------------------------------------------------------- File Name: style.css ---------------------------------------------------------------------*/
/*--------------------------------------------------------------------- import Fonts ---------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
/*****---------------------------------------- 1) font-family: 'Rajdhani', sans-serif;
2) font-family: 'Poppins', sans-serif;
----------------------------------------*****/
/*--------------------------------------------------------------------- import Files ---------------------------------------------------------------------*/
@import url(animate.min.css);
@import url(normalize.css);
@import url(icomoon.css);
@import url(css/font-awesome.min.css);
@import url(meanmenu.css);
@import url(owl.carousel.min.css);
@import url(swiper.min.css);
@import url(slick.css);
@import url(jquery.fancybox.min.css);
@import url(jquery-ui.css);
@import url(nice-select.css);
/*--------------------------------------------------------------------- skeleton ---------------------------------------------------------------------*/
* {
box-sizing: border-box !important;
transition: ease all 0.5s;
}
html {
scroll-behavior: smooth;
}
body {
color: #666666;
font-size: 14px;
font-family: Poppins;
line-height: 1.80857;
font-weight: normal;
overflow-x: hidden;
}
a {
color: #1f1f1f;
text-decoration: none !important;
outline: none !important;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
h1,
h2,
h3,
h4,
h5,
h6 {
letter-spacing: 0;
font-weight: normal;
position: relative;
padding: 0 0 10px 0;
font-weight: normal;
line-height: normal;
color: #111111;
margin: 0
}
h1 {
font-size: 24px
}
h2 {
font-size: 22px
}
h3 {
font-size: 18px
}
h4 {
font-size: 16px
}
h5 {
font-size: 14px
}
h6 {
font-size: 13px
}
*,
*::after,
*::before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
color: #212121;
text-decoration: none!important;
opacity: 1
}
button:focus {
outline: none;
}
ul,
li,
ol {
margin: 0px;
padding: 0px;
list-style: none;
}
p {
margin: 20px;
font-weight: 300;
font-size: 15px;
line-height: 24px;
}
a {
color: #222222;
text-decoration: none;
outline: none !important;
}
a,
.btn {
text-decoration: none !important;
outline: none !important;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
img {
max-width: 100%;
height: auto;
}
:focus {
outline: 0;
}
.paddind_bottom_0 {
padding-bottom: 0 !important;
}
.btn-custom {
margin-top: 20px;
background-color: transparent !important;
border: 2px solid #ddd;
padding: 12px 40px;
font-size: 16px;
}
.lead {
font-size: 18px;
line-height: 30px;
color: #767676;
margin: 0;
padding: 0;
}
.form-control:focus {
border-color: #ffffff !important;
box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .25);
}
.navbar-form input {
border: none !important;
}
.badge {
font-weight: 500;
}
blockquote {
margin: 20px 0 20px;
padding: 30px;
}
button {
border: 0;
margin: 0;
padding: 0;
cursor: pointer;
}
.full {
float: left;
width: 100%;
}
.layout_padding {
padding-top: 90px;
padding-bottom: 0px;
}
.header_section {
width: 100%;
float: left;
background-image: url(../images/banner-bg.png);
height: auto;
background-size: 100%;
padding: 10px 0px 25px 0px;
background-repeat: no-repeat;
}
.logo {
width: 42%;
float: left;
}
.bg-light {
background-color: transparent !important;
}
.navbar-expand-lg .navbar-nav .nav-link {
padding-right: 20px;
padding-left: 20px;
color: #272a2a;
font-size: 18px;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
color: #15e4d0;
}
.navbar {
padding: .5rem 70px;
}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
color: #15e4d0;
}
.banner_section {
width: 100%;
float: left;
padding-bottom: 105px;
}
.images_1 {
width: 80%;
float: right;
padding-top: 50px;
}
.banner_taital {
width: 100%;
float: left;
font-size: 60px;
color: #15e4d0;
font-weight: bold;
line-height: 60px;
padding-top: 120px;
}
.banner_text {
width: 100%;
float: left;
font-size: 16px;
margin: 0px;
color: #252525;
}
.btn_main {
width: 100%;
float: left;
margin-top: 30px;
}
.more_bt {
width: 170px;
float: left;
}
.more_bt a {
width: 100%;
float: left;
font-size: 18px;
color: #f6f8f8;
background-color: #4bc5b8;
text-align: center;
padding: 10px 0px;
}
.contact_bt {
width: 170px;
float: left;
margin-left: 15px;
}
.contact_bt a {
width: 100%;
float: left;
font-size: 18px;
color: #f6f8f8;
background-color: #252525;
text-align: center;
padding: 10px 0px;
}
.contact_bt a:hover {
color: #f6f8f8;
background-color: #4bc5b8;
}
#main_slider .carousel-control-prev:hover,
#main_slider .carousel-control-next:hover,
#main_slider .carousel-control-prev:focus,
#main_slider .carousel-control-next:focus {
border: 4px solid #4bc5b8;
color: #4bc5b8;
}
#main_slider a.carousel-control-next {
position: absolute;
left: 200px;
top: 85%;
}
#main_slider a.carousel-control-prev {
position: absolute;
left: 120px;
top: 85%;
border: 4px solid #4bc5b8;
color: #4bc5b8;
}
#main_slider .carousel-control-prev,
#main_slider .carousel-control-next {
width: 65px;
height: 65px;
border: 4px solid #000;
opacity: 1;
font-size: 30px;
color: #000;
border-radius: 100%;
}
.health_section {
width: 98%;
float: left;
padding-bottom: 60px;
}
.health_taital {
width: 100%;
float: left;
font-size: 40px;
color: #252525;
font-weight: bold;
}
.health_text {
width: 100%;
float: left;
font-size: 16px;
color: #252525;
margin: 0px;
}
.health_section_2 {
width: 100%;
float: left;
}
.image_main {
width: 100%;
position: relative;
}
.image_main:after {
content: '';
position: absolute;
background-color: #cfedf0;
height: 450px;
width: 300px;
left: 0px;
right: initial;
z-index: -1;
margin: 0 auto;
top: -40px;
}
.main {
width: 100%;
margin: 40px 0px 0px 40px;
box-shadow: 0px 0px 14px 2px #f3f3f3;
position: relative;
}
.main::after {
content: '';
position: absolute;
background-color: rgba(27, 236, 222, 0.5);
margin: 0 auto;
left: 0px;
right: 0px;
top: 0px;
width: 100%;
height: 100%;
display: none;
}
.main:hover::after {
background-color: rgba(27, 236, 222, 0.5);
display: block;
}
.image {
opacity: 1;
display: block;
width: 100%;
height: auto;
transition: .5s ease;
backface-visibility: hidden;
}
.middle {
transition: .5s ease;
opacity: 0;
position: absolute;
top: 50%;
left: 57%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
}
.image_main:hover .image {
background-color: rgba(27, 236, 222, 0.5);
}
.image_main:hover .middle {
opacity: 1;
}
.text {
background-color: #252525;
color: white;
font-size: 16px;
padding: 32px 32px;
border-radius: 100px;
}
.image_main_1 {
width: 100%;
position: relative;
}
.image_main_1:hover .image {
background-color: rgba(27, 236, 222, 0.5);
}
.image_main_1:hover .middle {
opacity: 1;
}
.getquote_bt_1 {
width: 180px;
float: left;
margin-top: 100px;
}
.getquote_bt_1 a {
width: 100%;
float: left;
font-size: 18px;
color: #ffffff;
background-color: #1becde;
padding: 7px 0px;
text-align: center;
}
.getquote_bt_1 a:hover {
background-color: #252525;
}
.knowledge_section {
width: 100%;
float: left;
background-image: url(../images/knowledge-bg.png);
background-size: 100%;
height: auto;
background-repeat: no-repeat;
padding-top: 180px;
padding-bottom: 240px;
}
.knowledge_main {
width: 100%;
float: left;
}
.left_main {
width: 70%;
float: left;
}
.right_main {
width: 30%;
float: left;
}
.knowledge_taital {
width: 100%;
float: left;
font-size: 40px;
color: #ffffff;
font-weight: bold;
}
.knowledge_text {
width: 100%;
float: left;
font-size: 16px;
color: #ffffff;
margin: 0px;
}
.play_icon {
width: 130px;
float: left;
position: relative;
z-index: 5;
}
.play_icon::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
transform: translate(-50%, -50%);
background-color: #ffffff;
border-radius: 100%;
z-index: -1;
animation: fadeEffect 1.3s infinite ease;
box-shadow: 0px 0px 10px 0px;
}
@keyframes fadeEffect {
0% {
transform: translate(-50%, -50%) scale(1);
opacity: 1
}
100% {
transform: translate(-50%, -50%) scale(1.2);
opacity: 0;
}
}
.news_section {
width: 100%;
float: left;
padding-bottom: 90px;
}
.news_section_2 {
width: 100%;
float: left;
}
.box_main {
width: 100%;
float: left;
background-color: #252525;
height: auto;
border-radius: 15px;
padding: 40px;
}
.box_main:hover {
background-color: #1becde;
}
.box_main.active {
background-color: #1becde;
}
.icon_1 {
width: 100%;
float: left;
text-align: center;
padding-bottom: 20px;
line-height: 95px;
}
.daily_text {
width: 40%;
margin: 0 auto;
text-align: center;
font-weight: bold;
font-size: 24px;
display: block;
color: #fff;
line-height: 30px;
}
.daily_text_1 {
width: 40%;
margin: 0 auto;
text-align: center;
font-weight: bold;
font-size: 24px;
display: block;
color: #fff;
line-height: 30px;
padding-bottom: 40px;
}
.getquote_bt {
width: 180px;
margin: 0 auto;
text-align: center;
}
.getquote_bt a {
width: 100%;
float: left;
font-size: 18px;
color: #ffffff;
background-color: #1becde;
padding: 7px 0px;
text-align: center;
margin-top: 50px;
}
.getquote_bt a:hover {
background-color: #252525;
}
.contact_section {
width: 100%;
float: left;
background-image: url(../images/contact-bg.png);
background-size: 100%;
background-repeat: no-repeat;
padding-bottom: 150px;
}
.contact_taital {
width: 100%;
float: left;
font-size: 50px;
color: #030202;
font-weight: bold;
}
.icon_main {
width: 100%;
display: flex;
padding-top: 50px;
}
.icon_7 {
width: 20%;
float: left;
}
.diabetes_text {
width: 70%;
float: left;
font-size: 30px;
color: #040101;
font-weight: 500;
}
.contact_box {
width: 100%;
float: left;
background-color: #f1fafb;
height: auto;
padding: 30px;
}
.book_text {
width: 100%;
float: left;
font-size: 30px;
color: #252525;
text-align: center;
font-weight: 500;
}
.Email_text {
width: 100%;
float: left;
font-size: 18px;
color: #bebebe;
background-color: #ffffff;
padding: 5px 15px;
border: 0px;
margin-top: 30px;
}
.massage-bt {
width: 100%;
float: left;
color: #bebebe;
height: 110px;
font-size: 18px;
padding: 36px 20px 10px 20px;
background-color: #ffffff;
border: 0px;
margin-top: 30px;
}
.send_bt {
width: 140px;
margin: 0 auto;
text-align: center;
}
.send_bt a {
width: 100%;
float: left;
font-size: 18px;
color: #ffffff;
background-color: #1becde;
padding: 7px 0px;
text-align: center;
margin-top: 50px;
text-transform: uppercase;
}
.send_bt a:hover {
background-color: #252525;
}
.client_section {
width: 100%;
float: left;
padding-bottom: 90px;
}
.client_taital {
width: 100%;
float: left;
font-size: 40px;
text-align: center;
color: #111010;
font-weight: bold;
}
.client_text {
width: 100%;
float: left;
font-size: 16px;
color: #444443;
text-align: center;
margin: 0px;
}
.client_section_2 {
width: 100%;
float: left;
padding-top: 60px;
}
.client_left {
width: 40%;
float: left;
}
.client_right {
width: 60%;
float: left;
padding-top: 100px;
}
.client_img {
width: 80%;
margin: 0 auto;
text-align: center;
display: block;
}
.distracted_text {
width: 100%;
float: left;
font-size: 40px;
color: #080808;
font-weight: bold;
text-transform: uppercase;
}
.lorem_text {
width: 100%;
float: left;
font-size: 16px;
color: #444443;
margin: 0px;
}
.quote_icon {
width: 100%;
float: left;
padding-top: 20px;
}
#my_slider .carousel-control-prev:hover,
#my_slider .carousel-control-next:hover,
#my_slider .carousel-control-prev:focus,
#my_slider .carousel-control-next:focus {
background-color: #19e9d9;
color: #ffffff;
}
#my_slider a.carousel-control-next {
position: absolute;
left: 490px;
top: 70%;
background-color: #19e9d9;
color: #ffffff;
}
#my_slider a.carousel-control-prev {
position: absolute;
left: 490px;
top: 84%;
background-color: #252525;
}
#my_slider .carousel-control-prev,
#my_slider .carousel-control-next {
width: 65px;
height: 65px;
background-color: #252525;
opacity: 1;
font-size: 30px;
color: #ffffff;
}
.footer_section {
width: 100%;
float: left;
background-color: #252525;
height: auto;
padding-bottom: 50px;
box-shadow: 0px 24px 19px -1px #222223;
position: relative;
}
.footer_logo {
width: 80%;
float: left;
padding: 0px 0px 30px 0px;
}
.adderss_text {
width: 100%;
float: left;
font-size: 24px;
color: #ffffff;
padding-bottom: 30px;
}
.map_icon {
width: 100%;
float: left;
font-size: 16px;
color: #d6d6d6;
padding-bottom: 10px;
}
.paddlin_left_0 {
padding-left: 15px;
}
.hiphop_text_1 {
width: 90%;
color: #d6d6d6;
font-size: 16px;
margin-left: 0px;
}
.Useful_text {
width: 50%;
color: #d6d6d6;
font-size: 16px;
margin-left: 0px;
}
.Enter_text {
width: 100%;
float: left;
font-size: 18px;
color: #ffffff;
background-color: transparent;
padding: 7px 10px;
margin-top: 10px;
border: 1px solid #cfcfd0;
}
input.Enter_text::placeholder {
color: #fff;
}
.subscribe_bt {
width: 170px;
float: left;
margin-top: 20px;
}
.subscribe_bt a {
width: 100%;
float: left;
font-size: 18px;
color: #ffffff;
background-color: #19e9d9;
text-align: center;
padding: 7px 0px;
text-transform: uppercase;
}
.social_icon {
width: 100%;
float: left;
}
.social_icon ul {
margin: 0px;
padding: 0px;
}
.social_icon li {
float: left;
padding-right: 10px;
padding-top: 20px;
}
.copyright_section {
width: 100%;
float: left;
background-color: #252525;
height: auto;
}
.copyright_text {
width: 100%;
float: left;
font-size: 16px;
margin-left: 0px;
color: #fff;
text-align: center;
}
.copyright_text a {
color: #ffffff;
}
.copyright_text a:hover {
color: #19e9d9;
}
.margin_90 {
margin: 90px 0px;
}