/*
Template Name: Charity
File: Layout CSS
Author: TemplatesOnWeb
Author URI: https://www.templateonweb.com/
Licence: <a href="https://www.templateonweb.com/license">Website Template Licence</a>
*/

/*********************center****************/

.carousel-caption{
background-color: rgba(0,0,0,.4);
bottom:0;
left:0;
color:#fff;
width:100%;
height:100%;
padding: 180px 140px 0px 140px;
text-align:left;
 }
.center_home img{
min-height:700px; 
 }

/*********************center_end****************/

/*********************diff****************/
.diff_2i{
transition: 0.3s;
border-bottom:2px solid transparent;
}
.diff_2i:hover{
border-bottom:2px solid #d53f34;
}
/*********************diff_end****************/

/*********************feat****************/
.feat_1l4{
top:0;
padding-top:50%; 
 }
.feat_1l2 img{
border:8px solid #f8f9fa; 
 }
.feat_1l2{
left:-15%;
 }
#feat{
padding-bottom:130px; 
 }
/*********************feat_end****************/


/*********************intro****************/
#intro {
background-image: url(../img/14.jpg);
background-position: center;
}
.intro_1r span a{
font-size:140px; 
 }
.intro_1r{
padding-top:30%; 
 }
/*********************intro_end****************/

/*********************goal****************/
.goal_2ril span{
width:60px;
height:60px;
line-height:60px;
transform: skewY(-15deg); 
 }
.goal_2ril{
border-right:1px solid #e1dfdf; 
 }
.goal_m2{
top:13%;
left:-12%; 
 }
/*********************goal_end****************/

/*********************connect****************/
.connect_1i2{
padding-top:20%; 
 }
.connect_1i:hover .connect_1i2{
background-color: rgba(213,63,52,.8);
transition: 0.3s;
 }
/*********************connect_end****************/


/*********************join****************/
.join_1r{
padding:80px!important; 
 }
/*********************join_end****************/


@media screen and (max-width : 767px){
.carousel-caption{
padding: 20px 15px 0px 15px;
text-align:center;
 }
.carousel-caption p{
text-align:left;
font-size:14px!important;
 }
.carousel-caption br{
display:none;
 }
.carousel-caption .font_70{
font-size:36px!important;
 }
.center_home img{
min-height:400px; 
 }
.carousel-caption .button{
padding-left:10px;
padding-right:10px;
font-size:12px;
 }
.carousel-caption .button_1{
padding-left:10px;
padding-right:10px;
font-size:12px;
 }

.feat_1l img{
width:100%; 
 }
.feat_1l4{
display:none; 
 }
.feat_1l2{
display:none; 
 }
.feat_1l3{
display:none; 
 }
.feat_1l1{
position:static!important;
 }
.feat_1r{
margin-top:15px;
text-align:center; 
 }
.feat_1r p{
text-align:left; 
 }
.feat_1r .button{
padding-left:10px;
padding-right:10px;
font-size:12px;
 }
.feat_1r .button_1{
padding-left:10px;
padding-right:10px;
font-size:12px;
 }
#feat {
padding-bottom:40px;
}
.intro_1lil{
margin-top:8px; 
margin-bottom:8px;
 }
.intro_1r {
padding-top: 15px;
}
.goal_m2{
position:static!important; 
 }
.goal_2r{
padding:15px!important; 
 }
.goal_2 .p-0{
padding-left:12px!important; 
padding-right:12px!important;
 }
.goal_2ril{
margin-top:8px;
margin-bottom:8px; 
 }
.join_1r {
padding: 15px 15px 65px 15px!important;
}
.join_1ri{
padding:15px!important; 
 }
.testim_1ir{
margin-top:15px;
text-align:center; 
 }
.testim_1ir p{
text-align:left; 
 }
.sub_1l h6{
text-align:center; 
 }
.sub_1r{
text-align:center!important;
margin-top:15px!important; 
 }
 }


@media (min-width:576px) and (max-width:767px) {
.carousel-caption{
padding: 40px 15px 0px 15px;
 }
.carousel-caption p{
font-size:16px!important;
 }
 }
 
@media (min-width:768px) and (max-width:991px) {
.carousel-caption br{
display:none;
 }
.carousel-caption .font_70{
font-size:50px!important;
 }
.feat_1l1  img{
width:100%; 
 }
.feat_1l2 {
left:0;
}
.carousel-caption{
padding: 180px 100px 0px 100px;
 }
.feat_1r .button{
padding-left:15px;
padding-right:15px;
 }
.feat_1r .button_1{
padding-left:15px;
padding-right:15px;
 }
#feat {
padding-bottom:40px;
}
.intro_1lil  .font_50{
font-size:36px!important; 
 }
.goal_1l img{
min-height:550px; 
 }
.goal_2r  h4{
font-size:18px; 
 }
.goal_2r  p{
font-size:15px; 
 }
.goal_2r  h5{
font-size:13px!important; 
 }
.connect_1i1 img{
min-height:230px; 
 }
.connect_1i2  h3{
font-size:18px; 
 }
.join_1l img{
min-height:800px;
 }
.join_1r {
padding: 20px!important;
}
 }

@media (min-width:992px) and (max-width:1200px) {
.feat_1l1  img{
width:100%; 
 }
.feat_1l2 {
left:0;
}
.goal_1l img{
min-height:550px; 
 }
.join_1l img{
min-height:800px;
 }
.join_1r {
padding: 40px!important;
}
 }
@media (min-width:1201px) and (max-width:1310px) {
.feat_1l2{
left:-5%;
 }
 }

 CSS.g-6,
 .gx-6 {
   --bs-gutter-x: 4.5rem;
 }
 .g-6,
 .gy-6 {
   --bs-gutter-y: 4.5rem;
 }
 @media (min-width: 576px) {
   .g-sm-6,
   .gx-sm-6 {
     --bs-gutter-x: 4.5rem;
   }
   .g-sm-6,
   .gy-sm-6 {
     --bs-gutter-y: 4.5rem;
   }
 }
 @media (min-width: 768px) {
   .g-md-6,
   .gx-md-6 {
     --bs-gutter-x: 4.5rem;
   }
   .g-md-6,
   .gy-md-6 {
     --bs-gutter-y: 4.5rem;
   }
 }
 @media (min-width: 992px) {
   .g-lg-6,
   .gx-lg-6 {
     --bs-gutter-x: 4.5rem;
   }
   .g-lg-6,
   .gy-lg-6 {
     --bs-gutter-y: 4.5rem;
   }
 }
 @media (min-width: 1200px) {
   .g-xl-6,
   .gx-xl-6 {
     --bs-gutter-x: 4.5rem;
   }
   .g-xl-6,
   .gy-xl-6 {
     --bs-gutter-y: 4.5rem;
   }
 }
 @media (min-width: 1400px) {
   .g-xxl-6,
   .gx-xxl-6 {
     --bs-gutter-x: 4.5rem;
   }
   .g-xxl-6,
   .gy-xxl-6 {
     --bs-gutter-y: 4.5rem;
   }
 }
 .mb-6 {
   margin-bottom: 4.5rem !important;
 }
 .py-6 {
   padding-top: 4.5rem !important;
   padding-bottom: 4.5rem !important;
 }
 @media (min-width: 576px) {
   .mb-sm-6 {
     margin-bottom: 4.5rem !important;
   }
   .py-sm-6 {
     padding-top: 4.5rem !important;
     padding-bottom: 4.5rem !important;
   }
 }
 @media (min-width: 768px) {
   .mb-md-6 {
     margin-bottom: 4.5rem !important;
   }
   .py-md-6 {
     padding-top: 4.5rem !important;
     padding-bottom: 4.5rem !important;
   }
 }
 @media (min-width: 992px) {
   .mb-lg-6 {
     margin-bottom: 4.5rem !important;
   }
   .py-lg-6 {
     padding-top: 4.5rem !important;
     padding-bottom: 4.5rem !important;
   }
 }
 @media (min-width: 1200px) {
   .mb-xl-6 {
     margin-bottom: 4.5rem !important;
   }
   .py-xl-6 {
     padding-top: 4.5rem !important;
     padding-bottom: 4.5rem !important;
   }
 }
 @media (min-width: 1400px) {
   .mb-xxl-6 {
     margin-bottom: 4.5rem !important;
   }
   .py-xxl-6 {
     padding-top: 4.5rem !important;
     padding-bottom: 4.5rem !important;
   }
 }

 .floating {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #fff;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
   }
   
   .fab-icon {
    margin-top: 16px;
   }