:root {
	
	--main : #cdd160;
	--blue : #000067;
	--light_blue: #09549b;
	--orange : #d46746;
	--light_green : #f0f1c3;
	--dark : #716d6d;
	--white : #fff;
	--font_DM : "DM Serif Display", serif;
}

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');

.bg_green { background: var(--main);}
.bg_light_green { background: var(--light_green);}
.bg_pattern_1 { background: url(../images/bg_1.jpg) repeat;}
.border_bottom { border-bottom: solid 2px #cfd364;}
.bg_nav_bar,
.sticky-wrapper.is-sticky .site-navbar { background: url(../images/menu_bg.jpg) repeat-x, var(--main);}
.img-fluid { width:100%;}

.mobile { display:none;}

/******FONT FAMILY*****/
.font_DM { font-family: var(--font_DM)}


/****COLOR*****/
.color_orange { color: var(--orange);}

/******HEADING STYLE*****/
.heading { 
  font-family: var(--font_DM);
  font-size:40px;
  width   : 100%;
  height  : 60px;   
  position: relative;
  z-index : 1;
  color: var(--blue);
  margin-bottom:30px;
}
.heading:before {
  content : "";
  position: absolute;
  left    : 0;
  bottom  : 0;
  height  : 1px;
  width   : 30%;  /* or 100px */
  border-bottom:3px solid var(--main);
}

.inner_heading { color:var(--orange);}

/*****BUTTON STYLE****/
.button_readmore {
  display: inline-block;
  border-radius: 4px;
  background-color: var(--orange);
  border: none;
  color: #fff !important;
  text-align: center;
  font-size: 18px;
  padding: 10px;
  transition: all 0.5s;
  width:200px;
  cursor: pointer;
  margin: 5px 0;
}

.button_readmore span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button_readmore span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button_readmore:hover span {
  padding-right: 25px;
}

.button_readmore:hover span:after {
  opacity: 1;
  right: 0;
}

.button_orange {
	color: #fff;
	background: var(--orange);
}

/**********VISSION MISSION BOX******/
.mission .serviceBox{
    color: var(--orange);
    /*padding-left: 110px;*/
	padding:20px;
    position: relative;
    border-bottom: 2px solid var(--color1);
    position: relative;
   
}
.mission .serviceBox h3 {
	color: var(--orange);
}
.mission .serviceBox .service-icon{
    color: var(--blue);
    background-color: #fff;
	box-shadow: 5px 5px #ececec;
	text-align: center;
	font-size: 50px;
    line-height: 100px;
    width: 100px;
    height: 100px;
    margin: 0 auto 25px;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    /*font-size: 40px;
    
    line-height: 90px;
    height: 90px;
    width: 90px;
    
    position: absolute;
    left: 0;
    top: 0;*/
}
.mission .serviceBox .title{
	font-family: var(--font_DM);
	font-size: 24px;
    font-weight: 400;
    text-transform: uppercase;
    margin: 0 0 5px;
	text-align: center;
}
.mission .serviceBox .description,
.mission .serviceBox ul {
    color: #3d3c3c;
    /*font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 22px;
    margin: 0;*/
}
.mission .serviceBox ul 	{padding-left: 16px;}
.mission .serviceBox ul li {line-height:22px;margin-bottom: 5px;}
.mission .serviceBox.pink{ --main-color: #FF0282; }
.mission .serviceBox.purple{ --main-color: #8154A2; }

/*******IMAGE BORDER*********/
.elderly_home {
	background-image: linear-gradient(#111, #050505);
	--img-url: url(https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=350&h=350&fit=crop&crop=faces);
}
.headshot {
	flex-shrink: 0;
	margin: 20px;
	height: calc(150px + 6vw);
	width: calc(150px + 6vw);
	border: calc(8px + 0.2vw) solid transparent;
	background-origin: border-box;
	background-clip: content-box, border-box;
	background-size: cover;
	box-sizing: border-box;
	box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.5);
}

.headshot-1 {
	border-radius: 30%;
	background-image: url(../images/elderly_home.jpg), linear-gradient(#f9f047, #0fd850);
}

.headshot-2 {
	border-radius: 50%;
	background-image: url(../images/elderly_home.jpg), linear-gradient(to bottom right, #ff3cac, #562b7c, #2b86c5);
}

.headshot-3 {
	border-radius: 30% 10%;
	border: linear-gradient(to bottom left, #f83600, #f9d423);
}

/*=======DONATION=======*/

.donation_border { border-bottom: solid 1px #ccc;}
.div_donation h5 {
	color:var(--blue);
}
.div_donation  b { 
color: var(--light_blue);
font-weight:500;
}
.list_donation li {
	margin-bottom:20px;
}

@media only screen and (max-width: 1199px){
    /*.mission .serviceBox{ margin: 0 0 40px; }*/
}

@media (max-width: 768px) { 
	
} 
		
@media only screen and (max-width: 479px){
    .mission .serviceBox{ 
	padding: 0;
	padding-bottom:5px;
	margin-bottom: 35px;
   box-shadow: 0 4px 2px -2px rgba(196, 196, 196, 0.2); 
	}
    .mission .serviceBox .service-icon{
       /* margin: 0 0 20px;*/
	   
        position: relative;
    }
	.services_div h3 {margin: 0rem 0 3rem 0 !important; }
	
}

/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.mobile { display:none;}


}

/* ============ mobile view ============ */
@media(max-width: 991px){
	.desktop { display:none;}
	.mobile { display:block;}
	.heading { 
	font-size:30px;
	height: 50px;
	}
	.col-xs-6#logo,
.col-xs-6.menu	{ width:50%;}

}
