* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Inter", sans-serif !important;
}
body {
scroll-behavior: smooth;
}
body a {
text-decoration: none;
}
body li {
list-style: none;
}
:root {
--primary: #f9f300;
--secondary: #db1d49;
--red: red;
--blue: blue;
--white: white;
--lightgray: lightgray;
--black: #222;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background-color: var(--white);
}
::-webkit-scrollbar-thumb {
background-color: var(--secondary);
}
.container {
max-width: 1200px !important;
}
.gap {
margin-top: 3%;
}
.common {
background-color: var(--black) !important;
height: 100px;
color: var(--white);
padding-top: 37px;
}
.common a {
color: var(--white);
}
.textRight {
text-align: right;
}
/* navbar page start  */
.goto {
display: none;
border: none;
outline: none;
height: 35px;
width: 35px;
background-color: var(--primary);
border-radius: 50%;
position: absolute;
bottom: 3%;
right: 3%;
z-index: 100;
font-size: 30px;
position: fixed;
}
.whatsapp {
height: 80px;
position: absolute;
bottom: 7%;
right: 1.5%;
z-index: 101;
position: fixed;
}
.first{
background-color: #000;
padding-top: 2px;
padding-bottom: 2px;
}
.first a{
color:var(--white);
}
nav {
height: 94px;
}
.nav-item {
padding-right: 40px;
}
.nav-item:last-child {
padding-right: 0px;
}
.nav-link {
font-size: 14px !important;
font-weight: 500 !important;
}
.logo {
height: 85px;
width: 85px;
object-fit:contain;
}
/*index page */
.header{
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
url("images/l1.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 650px;
}
.heading {
font-weight: 800;
}
.aBorder{
border: 1px solid var(--black);
padding:20px 30px 10px 30px!important;
}
.aImage{
height:260px;
width:100%;
object-fit: cover;
padding-left: 25px;
}
.bBorder{
border: 1px solid var(--black);
padding:15px 20px 0px 20px!important;
margin-top: 1%!important;
color:var(--blue);
font-weight: 600;
font-size: 15px;
letter-spacing: 0.3px;
}
.cBorder{
border: 2px solid var(--red);
padding:15px 20px 0px 20px!important;
margin-top: 1%!important;
border-radius: 15px;
color:var(--red);
font-weight: 600;
font-size: 15px;
}
.sImage{
height:390px;
width:100%;
object-fit: contain;
margin-bottom: 2%;
}
.acImg{
height:260px;
width:100%;
object-fit: cover;
}
.bcImg{
height:170px;
width:100%;
object-fit: cover;
}
.dText{
font-size: 14px;
font-weight: 700;
margin-top: 4%;
margin-bottom: 5%;
}
.donateBox p{
font-size: 14px;
}
.contact {
display: flex;
justify-content: center;
align-items: center;
}
.contactOne {
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
padding-top: 15px;
padding-bottom: 10px;
margin-top: 5% !important;
}
.contactIcon {
font-size: 25px;
height: 50px;
width: 50px;
background-color: var(--lightgray);
text-align: center;
padding-top: 12.5px;
}
.contactBox {
padding-block: 30px;
padding-right: 25px !important;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.contactTwo {
padding-left: 30px !important;
}
.map {
height: 100%;
width: 100%;
}
.columnCount{
column-count: 4;
}
.rowGap{
row-gap: 25px;
}
.team{
height:260px;
width: 230px;
object-fit: cover;
margin-bottom: 5%;
}
/*footer page start*/
footer {
background: repeating-conic-gradient(#000 0deg 90deg, #222 90deg 180deg);
background-size: 20px 20px;
box-shadow: inset -4rem -4rem 8rem #000, inset -4rem -4rem 8rem #000;
color: var(--white);
padding-top: 30px;
padding-bottom: 5px;
}
footer a {
color: var(--white);
}
footer h5 {
margin-bottom: 10% !important;
}
.footerOne {
margin-top: 6%;
}
.footerTwo {
padding-right: 30px !important;
}
.footerTwo p {
margin-top: 2%;
margin-bottom: 5%;
}
.donateBox {
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
padding-inline: 20px;
padding-block: 20px;
}
/* responsive part start  */
@media (max-width: 1024px) {
.container {
max-width: 950px !important;
}
}
@media (max-width: 768px) {
.whatsapp {
right: 0.5%;
bottom: 7%;
}
.container {
max-width: 700px !important;
}
.firstOne{
display: inline;
}
.resNav {
margin-top: -0.8%;
}
.nav-item {
padding-bottom: 8px;
padding-right: 0px;
}
.nav-item:last-child {
padding-bottom: 0px;
}
.navbar-toggler {
border-radius: 0% !important;
}
.navbar-toggler:focus {
box-shadow: none !important;
outline: none !important;
}
.offcanvas-body {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.header{
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
url("images/l1.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 530px;
}
.aImage{
padding-left: 5px;
}
.sImage{
height:310px;
margin-bottom: 0%;
}
.team{
height:240px;
width: 210px;
}
.acImg{
height:200px;
}
.columnCount{
column-count: 3;
}
}
@media (max-width: 425px) {
.goto {
right: 5%;
}
.container {
max-width: 390px !important;
}
.first{
text-align: center;
padding-top: 3px;
padding-bottom: 3px;
}
.restextRight{
text-align: center;
}
.resNav {
margin-top: -1.3%;
}
.logo{
height:80px;
}
.header{
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
url("images/l1.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 250px;
}
.bBorder{
margin-top: 3%!important;
margin-bottom: 3%;
}
.gap{
margin-top: 6%;
}
.resABorder{
margin-bottom: 3%;
}
.sImage{
height:150px;
width:100%;
margin-bottom: 5%;
}
.team{
height:230px;
width: 210px;
}
.resTeam{
margin-top: 5%!important;
}
.resTop{
margin-top: 3%!important;
}
.acImg{
height:100%;
}
.bcImg{
height:100%;
}
footer {
background: repeating-conic-gradient(#222 0deg 90deg, #111 90deg 180deg);
background-size: 20px 20px;
}
.resFooterOne {
margin-top: 5% !important;
}
.common{
text-align: center;
height:130px;
}
.columnCount{
column-count: 1;
}
.map{
height:300px;
margin-bottom: 5%;
}
.resContact{
text-align: center;
margin-top: 5%!important;
}
.contactTwo {
padding-left: 10px !important;
}
}
@media (max-width: 375px) {
.container {
max-width: 360px !important;
}
.resNav {
margin-top: -1.6%;
}
.header{
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
url("images/l1.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 230px;
}
.map{
height:250px;
}
}