*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Inter", sans-serif;
}
body{
font-size: 15.5px!important;
overflow-x: hidden;
}
body a{
text-decoration: none;
}
:root{
--primary:#0492c2;
--secondary:#efcc00;
--lightgray:lightgray;
--gray:gray;
--black:black;
--white:white;
--red:red;
--blue:blue;
}
/*navbar part start*/
.whatsapp{
height:90px;
width:90px;
position: absolute;
z-index: 200;
right:1.5%;
bottom:8%;
position: fixed;
}
.goto{
position: absolute;
content:"";
height:35px;
width:35px;
border: 2px solid var(--primary);
border-radius: 50%;
background-color: var(--white);
bottom:4%;
right:3%;
position: fixed;
z-index: 200;
}
.first{
background-color: var(--primary);
padding-top: 2px;
padding-bottom: 2px;
}
.first a{
color:var(--white);
}
.textRight{
display: flex;
justify-content: end;
align-items: center;
}
.time{
color:var(--white)!important;
}
.iso{
color:var(--white);
padding-left: 5px;
}
.call{
height:28px;
width:28px;
border:2px solid var(--white);
text-align: center;
border-radius: 50%;
padding-top: 4.5px;
margin-right: 5px;
color:var(--white);
}
.second{
padding-top: 4px;
padding-bottom: 4px;
background-color: var(--black);
color:var(--white);
}
.logo-heading{
font-size: 40px;
font-weight: bold;
margin-top: 1.3%;
}
.secondIcon{
display: flex;
justify-content: end;
align-items: center;
}
.logo{
height:78px;
}
nav{
height:50px;
background-color: var(--primary);
}
.navbar-brand{
font-weight: 600;
}
.nav-link{
font-size: 13.5px!important;
font-weight: 500!important;
color:var(--white)!important;
}
.nav-item{
padding-right: 45px;
}
.nav-item:last-child{
padding-right: 0px;
}
.dropdown-menu{
border-radius: 0%!important;
padding-top: 0%!important;
padding-bottom: 0%!important;
}
.dropdown-item{
font-size: 15px;
padding-top: 8px!important;
padding-bottom: 8px!important;
}
.donateTop{
margin-top: .7%;
font-size: 13.5px!important;
}
.donate{
padding:9px 27px;
border:2px solid var(--primary);
color:var(--black);
border-radius: 50px;
}
.nav-link{
position: relative;
}
.n-link:before{
position: absolute;
content: "";
height:2px;
width: 0%;
left:0;
bottom:0px;
background-color: var(--primary);
transition: all .7s;
}
.n-link:hover:before{
width:100%;
}
/*index part start*/
.home{
background:linear-gradient(to bottom,rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:660px;
position: relative;
}
.home1{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z1.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:660px;
position: relative;
}
.home2{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z16.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:660px;
position: relative;
}
.aboutFontSize{
font-size: 18px;
}
.aboutCenter{
display: flex;
justify-content: center;
align-items: center;
}
.reach{
background-color: var(--white);
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
text-align: center;
padding:35px 0px;
border-radius: 10px;
}
.reachOne{
position: absolute;
z-index: 1;
margin-top: -5%!important;
}
.let{
margin-top: 8%;
}
.reach h3{
color:var(--primary);
font-weight: 600;
}
.reachTwo{
background-color: var(--primary);
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
text-align: center;
padding:35px 0px;
border-radius: 10px;
color:var(--white);
}
.reachTwo h3{
color:var(--white);
font-weight: 600;
}
.gap{
margin-top: 4%;
}
.aboutImage{
border-radius: 10px;
}
.readMore{
border:2px solid var(--primary);
padding:8px 24px;
border-radius: 50px;
transition: all 1s;
color:var(--black)!important;
}
.readMore:hover{
box-shadow: inset 4.5em 0 0 var(--primary),
            inset -4.5em 0 0 var(--primary);
}
.buttonTop{
margin-top: 4%!important;
}
.readMoreOne{
border:2px solid var(--white);
padding:8px 24px;
border-radius: 50px;
transition: all 1s;
color:var(--white)!important;
}
.readMoreOne:hover{
box-shadow: inset 4.5em 0 0 var(--primary),
            inset -4.5em 0 0 var(--primary);
}
.workBox{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
text-align: center;
padding: 35px 20px;
padding-bottom: 50px;
transform: skew(5deg);
transition: all .5s;
}
.workBox h5{
margin-top: 4%;
margin-bottom: 4%;
}
.workIcon{
font-size: 35px;
}
.workBox p{
margin-bottom: 10%;
}
.workBox:hover{
transform: skew(0deg);
background-color: var(--primary);
}
.touch{
background-color: #1e90ff;
padding:50px;
padding-left: 30px!important;
padding-right: 30px!important;
border-radius: 10px;
color:var(--white);
}
.touchOne{
display: flex;
justify-content: center;
align-items: center;
}
.testimonial{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.testimonialImage{
height:130px;
width:130px;
border-radius: 50%;
background-color: var(--primary);
border:6px solid var(--white);
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.cInner{
padding:30px 20px!important;
padding-top: 50px!important;
}
.rightIcon{
color:var(--primary)!important;
background-color: var(--primary)!important;
margin: 50px!important;
}
.fa-star{
color:var(--primary);
}
.want{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/1.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
color:var(--white);
height:300px;
display: flex;
justify-content: center;
align-items: center;
}
.want p{
margin-top: 2%;
margin-bottom: 4%;
}
.videos{
height:350px;
width:600px;
}

/*footer part start*/
footer{
background-color: #1e90ff;
color:var(--white);
padding-top: 35px;
padding-bottom: 35px;
}
.footerOne{
border-bottom: 3px solid var(--white);
padding-bottom: 10px;
margin-bottom: 7%;
}
footer a{
color:var(--white);
}
.footerTwo{
margin-top: 3%;
}
.readMoreTwo{
border:2px solid var(--white);
padding:8px 24px;
traKnsition: all 1s;
color:var(--white)!important;
}
.footerThree{
background-color: var(--gray)!important;
padding:10px 0px;
color:var(--white);
}
.footerFour{
text-align: right;
}
.footerJustify{
text-align: justify;
}


/*about us page start*/
.common{
background:linear-gradient(rgba(0, 0, 0, 0.8),rgba(0, 0, 0, 0.8)),url('images/5.jpg');
background-repeat: no-repeat;
background-size: cover;
color:var(--white);
height:150px;
display: flex;
justify-content: center;
align-items: center;
}
.common a{
color:var(--white);
}
.boardBox img{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
height:170px;
width:170px;
border-radius: 50%;
margin-bottom: 5%;
}
.row-gap{
row-gap: 25px!important;
}
/*contact us part start*/
.contact{
background-color: var(--secondary);
padding: 50px;
padding-left:20px!important;
padding-right:20px!important;
}
.contact_form{
padding-bottom: 25px!important;
background: transparent!important;
margin-top: 3%;
border-top: none!important;
border-left: none!important;
border-right: none!important;
border-radius: 0%!important;
border-bottom: 2px solid var(--black)!important;
}
.submit_button{
background-color: var(--primary);
border: none;
outline: none;
padding: 7px 24px;
cursor: pointer;
margin-top: 5%;
color:var(--white);
}

/*member part start*/
.memberForm{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
padding:25px;
padding-bottom: 45px;
}

/*donate part start*/
.cause{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
padding:30px;
padding-bottom: 15px;
}

/*admin page start*/
.admin{
height:40px;
background-color: var(--primary);
padding-top: 6px;
color:var(--white);
}
.adminOne{
height:730px;
background-color: var(--black);
}
.adminTwo{
margin-top: 5%;
text-align: center;
}
.adminTwo a{
color:var(--white);
}
.fa-circle-minus{
color:var(--red);
}
.login{
margin-top: 15%;
}
.form-control:focus{
border:none!important;
box-shadow: none!important;
border: none!important;
border-bottom: 2px solid var(--black)!important;
}

/*responsive part start*/
@media (max-width:1024px){
.nav-item{
padding-right: 45px;
}
.nav-item:last-child{
padding-right: 0px;
}
.let{
margin-top: 13%;
}
.logo-heading{
font-size: 35px;
margin-left: 2%;
margin-top: 2%;
}
.adminOne{
height:640px;
}
.f{
display: flex;
justify-content: center;
align-items: center;
}
.videos{
height:250px;
width:400px;
}
}

@media (max-width: 768px){
.first{
font-size: 13px;
}
.logo-heading{
font-size: 20px;
margin-top: 5.5%;
margin-left: -3%;
}
.call{
padding-top: 6px;
}
nav{
height:58px;
}
.resNav{
margin-top: -0.1%;
}
.nav-link{
color:var(--black)!important;
}
.logo{
height:70px;
}
.navbar-toggler{
border-radius: 0%!important;
background-color: var(--white)!important;
}
.offcanvas-body{
display: flex;
justify-content: center;
align-items: center;
}
.navbar-nav{
display: flex;
justify-content: center;
align-items: center;
}
.nav-item{
padding-right: 0px;
}
.home{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:500px;
}
.home1{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z1.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:500px;
}
.home2{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z16.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:500px;
}
.videos{
height:200px;
width:350px;
}
.reachOne{
margin-top: -8%!important;
}
.let{
margin-top: 15%;
}
.resAbout{
text-align: center;
}
.aboutImage{
margin-top: 5%;
}
.resWork{
margin-top: 5%!important;
}
.resFooter{
margin-top: 5%!important;
}
}

@media (max-width: 425px){
.whatsapp{
height:80px;
width:80px;
right:-1%;;
}
.first{
text-align: center;
padding-top: 5px;
padding-bottom: 2px;
}
.second{
text-align: center;
padding-top: 8px;
padding-bottom: 8px;
}
.textRight{
margin-top: 2%;
justify-content: center;
}
.logo-heading{
font-size: 17px;
margin-left: 0%;
margin-top: 5%;
margin-bottom: 4%;
}
.secondIcon{
display: flex;
justify-content: center;
align-items: center;
}
.call{
padding-top: 6px;
}
.resNav{
margin-top: -0%;
}
.logo{
height:70px;
}
.home{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:300px;
}
.home1{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z1.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:300px;
}
.home2{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z16.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:300px;
}
.ures{
margin-top: 5%!important;
}
.videos{
height:200px;
width:400px;
}
.reachOne{
margin-top: -0%!important;
}
.resReach{
margin-top: 4%!important;
}
.let{
margin-top: 115%!important;
}
.resWorkOne{
margin-top: 5%!important;
}
.touch{
text-align: center;
}
.resFooterOne{
margin-top: 7%!important;
}
.footerThree{
text-align: center;
}
.footerFour{
margin-top: 3%!important;
text-align: center;
}
.videos{
width:100%!important;
height:230px!important;
}
.resboardbox{
margin-top: 5%!important;
}
.resboardBox{
margin-top: 5%!important;
}
.resmemberform{
margin-top: 30%!important;
}
.admin{
text-align: center;
}
.adminOne{
height:330px;
}
.adminBottom{
margin-bottom: 5%;
}
}

@media (max-width: 375px){
.resNav{
margin-top: -0%;
}
.logo-heading{
font-size: 16px;
}
.home{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:260px;
}
.home1{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z1.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:260px;
}
.home2{
background:linear-gradient(rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.1)),url('images/z16.jfif');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height:260px;
}
.videos{
width:100%!important;
height:200px!important;
}
.let{
margin-top: 125%!important;
}
.offscreenMenu{
width:100%;
}
}