/*
Theme Name: Karona - Multipurpose Health and Medical HTML Template
Author: Codezion Softwares
Author URL: https://themeforest.net/user/codezionsoftwares
Version: 1.1
%%%%%%% Table of CSS %%%%%%%
1.General code
1.1 Typography
1.2 Space margins and padding
1.3 forms
1.4 Buttons
1.5 Section-Colors-&-Backgrounds
1.6 Modal & popups
2.Homepages
2.1 Navigation
2.2 Banner
2.3 About Corona
2.4 Symptoms
2.5 Specialist
2.6 Percautions
2.7 FAQs
2.8 Blog
2.9 Hand Wash Steps
2.8 Footer
2.10 Copyright
3.About Us
4.Prevention
5.Statics
6.Appointment
7.Help
8.FAQs
9.Coming Soon
10.404
11.Blog
12.Contact
*/
@media screen and (max-width: 576px){
.font-text{
font-size: 20px;
}
.fre-icon{
padding: 18px;
}
.swipers.slider-page {
overflow: hidden;
}
.card {
background-color: #10217D1A;
border-radius: 10px;
padding: 7px;
}
.img-col:before {
position: absolute;
content: '';
top: -38%;
right: 22%;
height: 520px;
width: 576px;
background-position: center;
background-repeat: no-repeat;
object-fit: cover;
background-image: url(../img/Vector.png);
}
.button-padding {
margin-top: 10px !important;
}
.btn-login{
padding: 10px;
font-size: 16px;
}
.paddd_bottm {
margin-top: -10px !important;
z-index: 4;
position: relative;
}
.colm {
color: #000000;
font-weight: bold;
font-family: inter;
border-radius: 20px;
padding:10px 20px !important;
margin-left: 0% !important;
margin-top: 0vh !important;
background-color: #FFFFFFB2;
}
.card-sm{
padding: 0px !important;
}
.c1{
display: flex;
justify-content: space-between;
gap: 60px;
color: aliceblue;
background-color: #175CD3;
margin-top: 20px;
padding: 30px 30px;
border-radius: 0px !important;
align-items: center;
margin-bottom: 10px;
}
.section-padding{
padding-top: 0px !important;
}
/* Login section start */
.btn-group-lg>.btn, .btn-lg{
font-size: 10px ;
}
/* Login section end */
.heart-img img{
width: 150px;
margin-right: 10px !important;
}
.card-bg{
background-color: rgba(22, 194, 213, 0.10);
}
.Lets-box{
width: 100% !important ;
}
}
@media screen and (max-width:400px){
.font-text{
font-size: 16px;
}
}
@media screen and (max-width: 768px){
.blue-butn{
margin-top: 10px;
}
.swipers {
width: 100%;
margin: 40px auto;
}
.w-80{
width: 100%;
}
.swipers.slider-page {
overflow: hidden;
}
.swiper-slide {
display: block !important;
}
.round-box {
position: relative !important;
top: 25px !important;
left: 0% !important;
}
.round-box {
width: 80px;
height: 80px;
overflow: visible;
background-color: #007bff;
border-radius: 50%;
margin-bottom: 0;
}
.img-col{
position: relative;
}
.input-w{
width: 75% !important;
}
.han-col {
background-color: #16C2D51A;
padding-top: 80px !important;
padding-bottom: 80px;
}
.colm {
color: #000000;
font-weight: bold;
font-family: inter;
border-radius: 20px;
padding: 8px 20px;
margin-left: 35%;
margin-right: 0px;
background-color: #FFFFFFB2;
}
.foter-w{
width: 75% !important;
}
.img-col:before {
background-image: none !important;
}
/* login start */
.login-w {
width: 100% !important;
}
/* login end */
.input-wh{
width: 100% !important;
}
.girl-img{
width: 22% !important;
}
.card-girl{
margin-top: -50px !important;
z-index: 9999;
border: none;
}
.heart-img img{
width: 150px;
}
.search-wrapper {
width: 100% !important;
background: transparent;
box-shadow: 0 4px 20px -2px #e9e9e9;
}
}
@media screen and (max-width:992px) {
.img-col:before {
position: absolute;
content: '';
top: -15%;
right: 5%;
height: 520px;
width: 576px;
background-position: center;
background-repeat: no-repeat;
object-fit: cover;
background-image: url(../img/Vector.png);
}
.colm {
color: #000000;
font-weight: bold;
font-family: inter;
border-radius: 20px;
padding: 8px 20px;
margin-left: 35%;
margin-right: 0px !important;
background-color: #FFFFFFB2;
}
.fre-text{
display:block !important;
}
.c1{
display: flex;
justify-content: space-between;
gap: 60px;
color: aliceblue;
background-color: #175CD3;
margin-top: 20px;
padding: 30px 30px;
border-radius: 0px !important;
align-items: center;
margin-bottom: 10px;
margin-top: 10px;
}
.c2{
display: flex;
justify-content: space-between;
gap: 60px;
color: aliceblue;
padding: 30px 30px;
margin-bottom: 10px;
align-items: center;
background-color: #2E90FA;
} .c3{
display: flex;
justify-content: space-between;
gap: 60px;
color: aliceblue;
border-radius: 0px !important;
padding: 30px 30px;
align-items: center;
background-color: #53B1FD;
}
.loren-h{
line-height: 1px;
}
/* login start */
.login-w {
width: 100%;
}
/* login end */
/* blog start */
.blog-text{
font-size: 20px;
}
.bolg-p{
font-size: 16px;
}
/* blog end */
.heart-img img{
width: 150px;
}
}
@media (max-width: 1199.98px){
swiper-container {
margin-left: 20px;
width: 80%;
height: 320px;
}
.img-col{
padding: 50px 0px;
height: 100%;
width: 100%;
background-position: center;
background-repeat: no-repeat;
object-fit: cover;
}
.c1{
display: flex;
justify-content: space-between;
gap: 0px !important;
color: aliceblue;
background-color: #175CD3;
padding: 30px 30px;
align-items: center;
}
.c2{
display: flex;
justify-content: space-between;
gap: 0px !important;
color: aliceblue;
padding: 30px 30px;
align-items: center;
background-color: #2E90FA;
}
.c-3-4{
display: flex;
justify-content: space-between;
gap: 0px !important;
color: aliceblue;
padding: 30px 30px !important;
border-radius: 0px 12px 12px 0px;
align-items: center;
background-color: #53B1FD;
}
.c3{
display: flex;
justify-content: space-between;
gap: 0px !important;
color: aliceblue;
padding: 30px 30px;
align-items: center;
background-color: #53B1FD;
}
.colm {
color: #000000;
font-weight: bold;
font-family: inter;
border-radius: 20px;
padding: 8px 20px;
margin-left: 0% !important;
background-color: #FFFFFFB2;
}
.img-col:before {
position: absolute;
content: '';
top: -15%;
right: 12%;
height: 520px;
width: 576px;
background-position: center;
background-repeat: no-repeat;
object-fit: cover;
background-image: url(../img/Vector.png);
}
.mt-55{
margin-top: 5rem;
}
/* REG start */
.img-boxs{
margin-bottom: 25% ;
}
/* REG end */
/* payment start */
.payment-w{
width: 90% !important;
}
/* payment end */
.Lets-box{
width: 50% ;
}
}