"ഫലകം:Header4/styles.css" എന്ന താളിന്റെ പതിപ്പുകൾ തമ്മിലുള്ള വ്യത്യാസം
No edit summary |
No edit summary റ്റാഗ്: Reverted |
||
| വരി 1: | വരി 1: | ||
#mp-topbanner { | #mp-topbanner { | ||
width: | width: 100%; | ||
background: linear-gradient(135deg, # | background: linear-gradient(135deg, #fefefe, #eaf2ff); | ||
border-radius: 12px; | border-radius: 12px; | ||
box-shadow: 0 4px 12px rgba(0,0,0,0.1); | |||
padding: 15px; | |||
margin: 10px auto; | |||
box-sizing: border-box; | |||
} | |||
.banner-container { | |||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: center; | |||
flex-wrap: wrap; /* Makes it responsive */ | |||
gap: 20px; | |||
} | } | ||
.banner-image { | |||
flex: 1 1 40%; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
} | } | ||
.banner-text { | |||
flex: 1 1 55%; | |||
display: flex; | |||
flex-direction: column; | |||
gap: 10px; | |||
} | } | ||
.banner-title { | |||
font-size: 2em; | |||
font-weight: bold; | |||
color: #004EC3; | |||
text-align: left; | |||
} | } | ||
.banner-desc { | |||
font-size: 1.2em; | |||
font-size: 1. | line-height: 1.6; | ||
text-align: left; | |||
} | } | ||
.banner-stats { | |||
font-size: 1em; | |||
font-size: | line-height: 1.6; | ||
text-align: left; | |||
} | } | ||
/* Responsive | /* Responsive for mobile */ | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.banner-container { | |||
flex-direction: column; | |||
text-align: center; | |||
} | } | ||
.banner-title, | |||
.banner-desc, | |||
.banner-stats { | |||
text-align: center; | |||
} | } | ||
.banner-image { | |||
flex: 1 1 100%; | |||
} | } | ||
.banner-text { | |||
flex: 1 1 100%; | |||
} | } | ||
} | } | ||
10:09, 30 സെപ്റ്റംബർ 2025-നു നിലവിലുണ്ടായിരുന്ന രൂപം
#mp-topbanner {
width: 100%;
background: linear-gradient(135deg, #fefefe, #eaf2ff);
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
padding: 15px;
margin: 10px auto;
box-sizing: border-box;
}
.banner-container {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap; /* Makes it responsive */
gap: 20px;
}
.banner-image {
flex: 1 1 40%;
display: flex;
justify-content: center;
align-items: center;
}
.banner-text {
flex: 1 1 55%;
display: flex;
flex-direction: column;
gap: 10px;
}
.banner-title {
font-size: 2em;
font-weight: bold;
color: #004EC3;
text-align: left;
}
.banner-desc {
font-size: 1.2em;
line-height: 1.6;
text-align: left;
}
.banner-stats {
font-size: 1em;
line-height: 1.6;
text-align: left;
}
/* Responsive for mobile */
@media (max-width: 768px) {
.banner-container {
flex-direction: column;
text-align: center;
}
.banner-title,
.banner-desc,
.banner-stats {
text-align: center;
}
.banner-image {
flex: 1 1 100%;
}
.banner-text {
flex: 1 1 100%;
}
}