@charset "utf-8";
/* CSS Document */



/*------------------------------------------------------------------
[generic Table of contents]

* body
	+ #header
		- .logo
		- nav
	+ .slider
		- .carousel
			 - .carousel-inner
			 	- .item
					- .carousel-caption
	+ .grey
		- .heading
		- .inner-link

	+ .about-section
		- .who-we-are

	+ .staff-section
		- .our-staff
			- .effects
		    	- .img
					- .overlay-abt

	+ #causes
		- .wrapper
			- #portfolio-filter
			- #portfolio-list
				- .description
					- .description-pics
				- .detail
	+.causes-wrap
		- .causes-nav
			- .grey-box
			- #progressBar
			- .causes-detail2
		- .latest-causes
	+ #events-wrap
		- .event-box
		- .gallery
		- .pagination

	+ #gallery-wrap
		- .gallery-nav
			- #portfolio
				- .item
				- .img
	+ #map
		- #google
	+ #arrow
		- #button1
	+.contact-wrap
		- .contact
			- #contact-form
	+ .helping-child
		- .yellowbox
		- .imgbox
	+ .about-us
	+ .need-help
    + .parent-dimond
		- .diamond
		- .diamond-inner
    + #recents
		- .update-image
		- .update-white
    + .sponspors
	   - #flexiselDemo3
    + .features
	- #donate

	+ #footer


-------------------------------------------------------------------*/


body{
	font-size:16px;
	margin:0;
	font-family:'PTSans-Regular';
	padding-top:70px; /*for fixed header requirement*/
}
@font-face {
    font-family: 'PTSansBold';
    src: url('../fonts/pts75f.eot');
    src: url('../fonts/pts75f.eot') format('embedded-opentype'),
         url('../fonts/pts75f.woff2') format('woff2'),
         url('../fonts/pts75f.woff') format('woff'),
         url('../fonts/pts75f.ttf') format('truetype'),
         url('../fonts/pts75f.svg#PTSansBold') format('svg');
}

@font-face {
	font-family:'PTSans-Regular';
	src: url('../fonts/PTSans-Regular_latin%2blatin-ext_gdi.eot');
	src: url('../fonts/PTSans-Regular_latin%2blatin-ext_gdid41d.eot?#iefix') format('embedded-opentype'),
		url('../fonts/PTSans-Regular_latin%2blatin-ext_gdi.woff') format('woff'),
		url('../fonts/PTSans-Regular_latin%2blatin-ext_gdi.ttf') format('truetype'),
		url('../fonts/PTSans-Regular_latin%2blatin-ext_gdi.otf') format('opentype'),
		url('../fonts/PTSans-Regular_latin%2blatin-ext_gdi.svg#PTSans-Regular') format('svg');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+0020-F6D0;
}

@font-face {
    font-family: 'OpenSansLight';
    src: url('../fonts/opensans-light.eot');
    src: url('../fonts/opensans-light.eot') format('embedded-opentype'),
         url('../fonts/opensans-light.woff2') format('woff2'),
         url('../fonts/opensans-light.woff') format('woff'),
         url('../fonts/opensans-light.ttf') format('truetype'),
         url('../fonts/opensans-light.svg#OpenSansLight') format('svg');
}

h1{font-size:34px; }
a:hover , a:focus{ text-decoration:none; }

.padding{ padding-left:6%; padding-right:6%; }
/* hidden fixed navigation */


#header {
    background-color: rgba(0, 0, 0, 0.8);
    position: absolute;
    top: 0;
    width: 100%;
}
#header .logo {

}
#header .logo a{
	display:block;
	padding:13px 0;
}
#header nav {
    background-color: transparent !important;
    border: medium none !important;

}

.navbar{
	margin-bottom:0;
}
.navbar li {
	margin-left:5px;
}
.navbar-nav.navbar-right:last-child {
    margin-right:0;
}
.navbar-nav > li > a{
	font-family:'PTSans-Regular';
	border-top:3px solid transparent;
    color:#acacac !important;
	padding-bottom:24px;
    padding-top:25px;
	display:inline-block;
	text-shadow:0 0;
}

/* menu on hover - with animation */
.dropdown-menu{
	top:98% !important;
	min-width:100%;
	border: none;
}
@media screen and (min-width: 250px) and  (max-width: 400px) {
	.dropdown-menu{
		top:98% !important;
		min-width:100%;
		border: none;
		height:600px;
		overflow-y: auto;
		z-index: 9999999;
	}
}
/* menu on hover - with animation */
.dropdown.drop-collapsed .dropdown-menu {
  height: 0 !important;
  z-index: -1;

}
.dropdown .dropdown-menu {
  overflow: hidden;
  -webkit-transition: height 0.65s ease;
  transition: height 0.65s ease;
  z-index: 9999999;

}

.dropdown-menu .divider {
    background-color:#c8c3c3;
}

.navbar-nav > li > .dropdown-menu {
  display: block;
  visibility: hidden;
  opacity: 0;
  filter: alpha(opacity=0);
  border-radius:0;
}

.navbar-nav > li.open .dropdown-menu {
  	visibility: visible;
  	opacity: 1;
  	filter: alpha(opacity=100);
  	background:#ffff00;
	height: 25px;
}

.navbar-nav > li.open .dropdown-menu >li a{
  background:#ffff00;
	height: 25px;
}

.navbar-nav> li.dropdown.open.active > a:hover,
.navbar-nav > li.dropdown.open > a
{
   color: #000;
   background-color: #ffff00 !important;
   border-top:3px solid transparent;
   z-index:999999;
}


.navbar-default .navbar-nav > li.active ,.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
	background:#ffff00;
    color:#000 !important;
	transition: ease-in-out all .9s;
	-moz-transition: ease-in-out all .9s;
	-webkit-transition: ease-in-out all .9s;
	-ms-transition:ease-in-out all .9s;
}

.affix {
	 position: fixed !important;
	 top: 0 !important;
	 z-index: 999;

 }

.affix-top {
	z-index: 10000  !important;

}
/*===== HEADER ENDS =====*/




/* ===== SLIDER START =====*/
.slider{
}

.carousel-inner > .item img{
	width:100%;
	height:100%;
}
.slider .container{
	position:relative;
	z-index:8;
}
.slider .carousel-caption{
	left:0;
	text-align:left;
	text-shadow:0px 0px;
	margin-bottom:8%;
	bottom:8%;
	max-width:550px;
	min-width:300px;

}
.slider .carousel-caption h1 , .slider .carousel-caption h2
, .about-us h1 , .helping-child h1 ,
.child-pics .yellowbox a , .need-help h1
, .need-help h4 , .update-white h3 , #recents h1 , .sponspors h1 ,
.about-section h1 , .who-we-are h2 , .staff-section h1, .contact h1{
	  font-family: 'PTSansBold';
}

.slider .carousel-caption h1{
	color:#ffff00;
	font-size:75px;
	margin-bottom:0;

}
.slider .carousel-caption h2{
	font-size:32px;
	margin-top:0;
	margin-bottom:20px;
	color:#333333;
}

.slider .carousel-caption p , .slider .carousel-caption a
, .about-us p{
	font-size:20px;
	line-height:25px;
	color:#333333;
}
.slider .carousel-caption a{
	color:#fff;
	border:2px solid #fff;
	display:inline-block;
	padding:2% 5%;
	margin-top:20px;
}
.slider .carousel-caption a:hover{
	text-decoration:none;
	color:#0000;
	border:2px solid #ffff00;
	background:#ffff00;
}
/* ===== SLIDER ENDS ===== */



/*===== ABOUT US SECTION WITH DIMOND IMGS ====== */
.about-us{
	margin-bottom: 5%;
    margin-top: 5%;
}
/*IT WILL USE FOR DIMOND SHAPE*/
hr{
  border: 0;
  height: 1px;
  width:20%;
  position: relative;
  margin:25px auto;
}
.hr{
  border: 0;
  height: 1px;
  width:20%;
  position: relative;
  margin:25px 0;
  background:#959595;}

.center-diamond{
	 background: #959595;
}
.center-diamond:before{
      	background:#959595;
		content: "";
		display: inline-block;
		height: 15px;
		left: 45%;
		margin: 0 0 0 -3px;
		position: absolute;
		top: -7px;
		transform: rotate(45deg);
		width: 15px;
}


.yellow-diamond{
	 background: #ffff00;
}
.yellow-diamond:before{
      	background:#ffff00;
		content: "";
		display: inline-block;
		height: 15px;
		left: 45%;
		margin: 0 0 0 -3px;
		position: absolute;
		top: -7px;
		transform: rotate(45deg);
		width: 15px;
}

.about-us h1 , .about-us p{
	color:#282828;
}
.about-us p{
	font-size:16px;
	line-height:23px;
	margin-left:9%;
	margin-right:9%;
}

/*helping child pics with text boxes*/
.helping-child{
	text-align:center;
	margin-bottom:5%;
}
.child-pics{
	margin: auto auto 5%;
    max-width: 960px;
    width: 100%;
}
.child-pics .yellowbox{
	background:#ffff00;
	color::#282828;
	padding:7%;
	position:relative;
}
.child-pics .yellowbox span{
	display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: -19%;
}
.child-pics .yellowbox span img{
    margin-top:0;
}
.child-pics .yellowbox a{
	display:block;
	color:#333333;
}
.child-pics .yellowbox a:hover{
	text-decoration:underline;
}
.child-pics .yellowbox a , .update-white h3{
	font-size: 22px;
    margin-top:36px;
	text-transform: capitalize;
}
.child-pics .yellowbox p , .features p , footer p{
	font-family:'PTSans-Regular';
	font-size:16px;
	line-height:23px;
}
.child-pics .imgbox{
	width:100%;
	display:block;
	overflow:hidden;
}


/*background of need help section*/
.need-helpbg{

}
.need-help{
	background: url("../images/testinomial-bg.jpg") no-repeat fixed center;
	color:#fff;
	padding-bottom:4%;
	padding-top:5%;
	min-height:300px;
	height:100%;
}


.need-help h1{
	color:#ffff00;
	font-size:34px;
	margin-top:0;
}
.need-help h4{
	margin:20px;
}
.need-help h4 , .need-help p{
	font-size:16px;
}
.need-help p{
	line-height:23px;
	margin-left:10%;
	margin-right:10%;
}




/*dimond shape here*/
.parent-dimond{
	 padding:6% 0 5%;
}
.details{
}
.diamond{
     width: 80px;
	 height:80px;
	  border:2px solid #ffff00;
      transform:rotate(45deg);
      -ms-transform:rotate(45deg);
      -webkit-transform:rotate(45deg);
      position:relative;
	  left:35%;
	  right:0;
}
.diamond .fa{
	color:#a4a4a4;
	font-size:34px;
	position:absolute;
	transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
   -webkit-transform:rotate(-45deg);
   left:0px;
   right:0;
   top:21px;
}

.diamond-inner{
      color:#a4a4a4;
}
.diamond-inner span{
	font-size:40px;
	display:inline-block;
	margin-top:15px;

}
.diamond-inner h6{
	font-size:18px;
	margin-top:0;
}



/* ====== MOST RECENT UPDATES ====== */

#recents{
   background: url("../images/update-bg.png") no-repeat fixed center top rgba(0, 0, 0, 0);
    height: 100%;
    min-height: 700px;
    padding-bottom:3%;
    padding-top:2%;
    text-align: center;
}
/*just for hover effects*/
.update-parent{
	 transition:  all 0.9s ease-in-out 0s;
}
 .update-parent:hover{
	transform: rotate(-3deg)scale(1.09);
	transition: all 0.7s ease 0s;
}

#recents .update-image{
	display:block;
	margin-top:20px;
	overflow: hidden;
    width: 100%;
}
#recents .update-image img{
	width:100%;
}

#recents .update-white{
	background:#fff;
    padding: 6%;
    width: 100%;
	position:relative;

}
#recents .update-white span{
	display: block;
	position:absolute;
	left:0;
	right:0;
	top:-15%;

}
#recents .update-white span .fa{
	font-size:34px;
	background:#fff000;
	border:2px solid #333;
	border-radius:78px;
	height:78px;
	width:78px;
	padding-top:20px;
}



#recents .update-white a{
	font-size:13px;
	color:#b1b1b1;
}
#recents .update-white a:hover, #recents .update-white a:focus{
	color:#282828;
	text-decoration:underline;
}

/* =====  OUR SPONSPORS WITH LOGOS ===== */
.sponspors{
	padding-bottom:6%;
    padding-top: 5%;
    text-align: center;
}

/*for logo slider*/
.nbs-flexisel-container {
    position:relative;
    max-width:100%;
}
.nbs-flexisel-ul {
    position:relative;
    width:9999px;
    margin:0px;
    padding:0px;
    list-style-type:none;
    text-align:center;
}

.nbs-flexisel-inner {
    overflow:hidden;
    width:100%;
    border:1px solid #e1e1e1;
	padding-bottom: 2%;
    padding-top: 2%;
	margin-top:40px;
}

.nbs-flexisel-item {
    float:left;
    margin:0px;
    padding:0px;
    cursor:pointer;
    position:relative;
    line-height:0px;
}
.nbs-flexisel-item img {
    cursor: pointer;
    position: relative;
	background:#F3F4F5;
	padding:5px 10px;
	border-radius:4px;

}

/*** Navigation ***/

.nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
    width: 14px;
    height: 20px;
    position: absolute;
    cursor: pointer;
    z-index: 100;
	top:-22px !important;

}

.mylink {
	cursor:pointer;

	}
.nbs-flexisel-nav-left {
    right:22px !important;
    background: url(../images/leftarrow.png) no-repeat;
}

.nbs-flexisel-nav-right {
    right: 5px;
    background: url(../images/rightarrow.png)no-repeat;
}






.features{
	background:#333333;
	padding-bottom:4%;
	padding-top:5%;
	color:#fff;
}
.features #donate{
	border-left:1px solid #959595;
	border-bottom:1px solid #959595;
	position:relative;
	padding-left:41px;
	padding-bottom:26%;
	margin-bottom:5%;


}

.shape {
   width:19px;
   height:19px;
   background:#959595;
   /* Rotate */
   -webkit-transform: rotate(-45deg);
   -moz-transform: rotate(-45deg);
   -ms-transform: rotate(-45deg);
   -o-transform: rotate(-45deg);
   transform: rotate(-45deg);
   /* Rotate Origin */
   -webkit-transform-origin: 0 100%;
   -moz-transform-origin: 0 100%;
   -ms-transform-origin: 0 100%;
   -o-transform-origin: 0 100%;
   transform-origin: 0 100%;
   position:absolute;
}
.shape:first-of-type{
	top:0;
	left:16px;
}

.shape:nth-of-type(2){
	 bottom: -14px;
    right: -7px;
}

.glyphicon-home , .glyphicon-envelope , .glyphicon-earphone{
	color:#9c9c9c;
	margin-right:4px;
}
.features #donate address{
	margin-bottom:0;
}
.features #donate em{
	font-style:normal;
}
.features #donate em , .features #donate a{
	font-size:13px;
}
.features #donate a{
	color:#fff;
}
.features #donate a:hover{
	color:#ffff00;
}
.features #donate a:hover , .features #twitter a{
	text-decoration:none;
}
/*box for twitter feed back*/
.features #twitter{
	padding-bottom:5%;
	padding-left:41px;
	padding-right:8%;
	border-left:1px solid #959595;
	margin-bottom:5%;
}

.features #twitter h3 , .features #latest-work h3{
	margin-top:0;
	font-size:22px;
}
.features #twitter a{
	color:#ffff00;
}
.features #latest-work{
	padding-left:41px;
	border-left:1px solid #959595;
	text-align:center;
}
.features #latest-work img{
	margin-bottom:11px;
	margin-right:18px;
	transition:all 0.5s linear 0.1s;
}
.features #latest-work img:focus , .features #latest-work img:hover{
	transform: scale(1.2);
	-webkit-transition:all 0.5s linear 0.1s;
	-moz-transition:all 0.5s linear 0.1s;
	-o-transition:all 0.5s linear 0.1s;
    transition: all 0.5s linear 0.1s;
	opacity:0.6;
}
.features #latest-work img:nth-child(2n){
	margin-right:0;
}


/* ====== FOOTER ===== */
footer{
	background:#ffff00;
	color:#000;
	text-align:center;
	padding-bottom:1%;
	padding-top:1%;
}
footer p{
	margin:0;  626262
}

#twitter strong{
	color:#626262;
	font-weight:normal;
}


  /* ====== ABOUT PAGE STARRT ====== */

.grey{ background:#f5f5f5; padding:25px 0; }

.inner-link{ color:#646464; font-size:14px; }
.inner-link > a{ color:#646464; }
.inner-link > a:hover{ color:#646464; text-decoration:underline; }

.heading{ color:#282828; font-size:20px; text-transform: uppercase;}
.about-section{ padding-top:5%;}
.about-section h1{
	margin:0;
	color:#333333;
}
/*having pic and some text*/
.who-we-are{ color:#282828; padding: 6% 0 0; }

.who-we-are h2{
	font-size:22px;
	margin:0;
}
.who-we-are p{
	line-height:23px;
	margin-bottom:6%;
	margin-top:5%;
}
.who-we-are ul{
	list-style:none;
	list-style-image: url(../images/about-list.png);
	list-style-position:inside;
	margin:0;
	padding:0;
}
.who-we-are ul li{
	color:#5a5a5a;
	line-height:34px;
}

.staff-section{}
.staff-section h1{ color:##333333; margin:0; }
.our-staff{
	padding:6% 0 4%;
}

.img {
  position: relative;
  margin-bottom:30px;
  width: 100%;
  overflow: hidden;
}
.img img {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: auto;
}

.overlay-abt {
  display: block;
  position: absolute;
  z-index: 20;
  background: rgba(0, 0, 0, 0.8);
  overflow: hidden;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  height:0;
  width:100%;
  top:0;
  left:0;
  right:0;
  color:#fff;
  padding-left:14px;
}

.img.hover .overlay-abt {
  height: 100%;
}


.overlay-abt  h2 {
    font-size: 18px;
	font-family: "PTSansBold";
	margin:0;
	padding-top:96%;
	margin-bottom:11px;
}
.overlay-abt p > strong{ display:inline-block;}
.overlay-abt p{
    font-size:14px;
    font-family: 'OpenSansLight';
}

.overlay-abt  ul.info {
	margin:0;
	padding:0;
}
.overlay-abt  ul.info li {
	display: inline-block;
	padding-right:15px;
}
.overlay-abt  ul.info li a > .fa{
	color:#fff;
	font-size:18px;
	-webkit-transition:all 0.5s linear 0.1s;
   -moz-transition:all 0.5s linear 0.1s;
   -o-transition:all 0.5s linear 0.1s;
   transition:all 0.5s linear 0.1s;
}
.overlay-abt  ul.info li a > .fa:hover , .overlay-abt  ul.info li a > .fa:focus{
	color:#ffff00;
	transform: scale(1.3);
	-webkit-transition:all 0.5s linear 0.1s;
   -moz-transition:all 0.5s linear 0.1s;
   -o-transition:all 0.5s linear 0.1s;
	transition:all 0.5s linear 0.1s;
}

 /* ====== ABOUT PAGE ====== */



 /* ====== causes PAGE ====== */

#causes{ padding:6% 0 4%; }
.causes-nav{}

ul#portfolio-filter{
	overflow: hidden;
	padding:0;
}
ul#portfolio-filter li {
	margin-bottom:4%;
	margin-left:10px;
	margin-right:10px;
	float:none;
	display:inline-block;
}
ul#portfolio-filter li a {
	 color:#fff;
	 font-size:18px;
	 background:#333333;
	 border-radius:0;
	 padding: 10px 50px;
	 display:inline-block;
}
ul#portfolio-filter > li > a.current, ul#portfolio-filter  > li a:hover ,
ul#portfolio-filter > li > a.current:focus{
	color:#333333;
	font-size:18px;
	background:#fefe00 !important;
	transition:all 0.5s ease-in-out 0.1s;
}

/*- -*/
/*- OUR DATA HOLDER -*/
ul#portfolio-list {
	margin:0;
	padding: 0;
	list-style: none;
}
ul#portfolio-list li {
	width:30%;
	max-width:100%;
	height: auto;
	display: inline-block;
	float: left;
	margin-right:14px;
	margin-left:14px;
	overflow: hidden;
}
/*ul#portfolio-list li:nth-child(3n){
	margin-right:0;
}*/



/*for tabs detail*/
.causes-nav .description{ border: 1px solid #b7b7b7; margin-bottom:28px;}
.causes-nav .description img{ width:100%;}
/*w'll be used on many pages*/
.description-pics{
	display: block;
    overflow: hidden;
    width: 100%}
.description .detail{ color:#282828; padding: 24px 20px;}
.description .detail:hover{
	background:#fefe00;
	transition:all 0.5s ease-in-out 0.1s;
}
.description .detail h2{ color:#333333; font-size:24px; margin-top:0;}

.description .detail a{
	border: 2px solid #333333;
    color: #333333;
    display: inline-block;
    font-family: "PTSansBold";
    margin-top:30px;
    padding: 10px 35px;
    text-align: center;
	background:#fff;
}
.description .detail a:hover , .description .detail a:focus{
	background:#333333 !important;
	border: 2px solid #333333;
	color:#fff;
	transition:all 0.3s ease-in-out 0s;
}

.pages .pagination > li{
	display:inline-block;
	margin-left:3px;
	margin-right:3px;
}
.pages .pagination > li:first-child{ margin-left:0;}
.pages .pagination > li:last-child{ margin-right:0;}
.pages .pagination > li:first-child > a, .pagination > li:first-child > span ,
 .pages .pagination > li:last-child > a, .pagination > li:last-child > span{
	border:none;
	background: transparent;
	color:#333333;
}
.pages .pagination > li:first-child > a:hover, .pages .pagination > li:first-child > a:focus, .pagination > li:first-child > span:hover , .pagination > li:first-child > span:focus,
 .pages .pagination > li:last-child > a:hover,  .pages .pagination > li:last-child > a:focus, .pagination > li:last-child > span:hover , .pagination > li:last-child > span:focus{
	border:none;
	background: transparent;
	color:#333333;
}

.pages .pagination > li a{
	background:#333333;
	color:#fff;
	font-size:18px;
}
.pages .pagination > li a:hover , .pages .pagination > li a:focus {
	background:#fefe00;
	color:#333333;
}

 /* ====== causes PAGE ENDS ====== */



/* ===== CAUSES DETAILS ===== */
#causes-wrap{ padding:4% 0 5%;}
.causes-detail{ margin-bottom:7%;}
.causes-detail .grey-box{
	background:#f4f4f4;
	padding: 32px 24px;
	color:#333333;
}
.causes-detail .grey-box span{
    margin-top: 30px;
	display:inline-table;
}
.causes-detail .grey-box a , .causes-detail2 a , .event-btn a {
    border: 2px solid #333333;
    color: #333333;
    display: inline-block;
    font-family: "PTSansBold";
    margin-top: 30px;
	margin-bottom:10px;
    padding: 10px 35px;
    text-align: center;
}
.causes-detail .grey-box a:hover , .causes-detail .grey-box a:focus,
.causes-detail2 a:hover , .causes-detail2 a:focus , .event-btn a:hover , .event-btn a:focus{
 	border: 2px solid #333333;
	background:#333333;
	color:#fff;
	transition: all 0.5s ease-in-out 0s;
}
#progressBar {
     width:100%;
     height:15px;
     background-color:#d6d6d6;
	margin-bottom:15px;
    margin-top:20px;
}

#progressBar div {
    height: 100%;
    color:#333;
    text-align: right;
    line-height:15px; /* same as #progressBar height if we want text middle aligned */
    width:0;
	font-size:12px;
    background-color: #fefe00;
}

.causes-detail2{ color:#646464 !important;}
.causes-detail2 h1{ color:#333333; margin-bottom:5%;}
.causes-detail2 p{ margin-bottom:30px;}
.causes-detail2 a,{
    margin-top:20%;
	font-size:18px;
	font-family:'PTSans-Regular';
}
.causes-detail2 a > .fa{
	margin-right:5px;
	margin-left:5px;
}

.latest-causes{
	color:#646464;
	padding-bottom:25px;
	border-bottom:1px solid #d3d3d3;
	font-size:14px;
	margin-bottom:25px !important;}

.latest-causes:nth-child(3n){ margin-bottom:50px !important;}
.latest-causes h1{ font-size:20px; margin-top:0;}

.latest-causes .border{
	background:#333333;
	height:1px; display:block;
	width:80px;
	margin-bottom:25px;
}
.latest-causes a{
	font-size:16px;
	font-family: "PTSansBold";
	color:#282828;
	margin-top:-5px;
	display:block;
 }
 .latest-causes a:hover, .latest-causes a:focus{
	 text-decoration:underline;
 }

.latest-causes p{ margin-bottom:0;}

.latest-causes p > .fa , .events .event-box p > .fa {
	background:#fefe00;
    margin-right: 10px;
    padding: 8px;
	margin-top:10px;
}
.latest-causes img.gallery{
	margin-bottom:18px;
	margin-right:18px;
	float:left;
	transition:all 0.5s linear 0.1s;
}
.latest-causes img.gallery:hover, .latest-causes img.gallery:focus{
	transform:scale(1.2);
	transition:all 0.5s linear 0.1s;
	opacity:0.6;
}
/* ===== CAUSES DETAILS ENDS ===== */



/* ===== MAIN EVENTS ===== */

#events-wrap{ padding:8% 0;}
@media only screen and (max-width: 320px) {
	#events-wrap{ padding:23% 0;}
}

@media only screen and (min-width: 321px) and (max-width: 500px) {
	#events-wrap{ padding:23% 0;}
}
@media only screen and (min-width: 501px) and (max-width: 760px) {
	#events-wrap{ padding:23% 0;}
}
@media only screen and (min-width: 761px) and (max-width: 1200px) {
	#events-wrap{ padding:4% 0;}
}


.events{ margin-bottom:60px; color:#646464;}
.events .event-box{ padding:30px 0 40px; color: #646464;  border-bottom: 1px solid #d3d3d3; }
.events .event-box a{
	color:#333333;
	font-size:24px;
	display:inline-block;
	margin-bottom:30px;
}
.events .event-box a:hover{
	text-decoration:underline;
}
.events .event-box p{ margin:0; }

/*FOR EVENTS DETAILS*/
.event-box h1 , .events h1 {
    color: #333333;
    display: inline-block;
    font-size: 24px;
    margin-bottom: 30px;
}
.events p{ margin-bottom:15px; }
#googleMap {
    height: 100%;
    min-height: 340px;
    position: relative;
	margin-top:10px;
}
.event-btn a{
	font-size:18px;
	font-family:'PTSans-Regular';
	margin:6% 0;
}
.event-btn a > .fa{
	margin-right:5px;
	margin-left:5px;
}

/* ===== MAIN EVENTS ENDS ===== */



/* ===== MAIN GALLERY ===== */

#gallery-wrap{ padding:6% 0 4%;}


/** filters list **/
#filter-list {
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom:10px;
	padding:0;
}

#filter-list li {
	display:inline-block;
    margin-bottom:4%;
	margin-left:10px;
	margin-right:10px;
}
#filter-list li a{
    color:#fff;
	 font-size:18px;
	 background:#333333;
	 border-radius:0;
	 padding: 10px 50px;
	 display:inline-block;
}

ul#filter-list > li > .active, ul#filter-list  > li a:hover ,
ul#filter-list > li > a:focus{
	color:#333333;
	font-size:18px;
	background:#fefe00 !important;
	transition:all 0.5s ease-in-out 0.1s;
}

 @media screen and (max-width: 320px) {
	 .headlogo {
		 display: none;
	 }
 }



/** portfolio list **/
#portfolio {
	display: block;
    width: 100%;
    padding:0;
    margin:0;
	text-align: center;
}
#portfolio item {
	width:30%;
	height:326px;
	max-height:100%;


}
#portfolio li.item {
	display: none;
	opacity: 0;
	width:30%;
	margin-left:12px;
	margin-right:12px;
	margin-bottom:0;
	max-height:326px;
	position:relative;

}

#portfolio li.item img {
    height: inherit;
    overflow: hidden !important;
    transition: opacity 0.7s ease-out 0s, transform 0.7s ease-out 0s;
    width: inherit;
}
#portfolio li.item:hover img {
    height: inherit;
    overflow: hidden !important;
    transform: scale(1.3);
    width: inherit;
}

#portfolio .item img {
  max-width: 100%;
}
#portfolio .item .fa-search {
  font-size:18px;
	color:#fff;
	position:absolute;
	top:40%;
}
#portfolio .item p{
	color:#fff;
	position:absolute;
	top:50%;
	left:0;
	right:0;
}


.overlay {
    background-color:rgba(0, 0, 0, 0.8);
    display: none;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: 0;
    transition: all 0.5s ease-in-out 0s;
    width: 100%;
}
#portfolio li.item:hover .overlay {
    display: block;
    opacity: 0.9;
}


/* ===== MAIN GALLERY ENDS ===== */


/* ===== CONTACT US PAGE ====== */

#google{
    height: 100%;
    min-height:300px;
    position: relative;
}
#button1{
	color: #b7b7b7;
    font-size:18px;
}

.contact-wrap{
	padding:4% 0 6%;
}
.contact{ color:#646464; }
.contact h1{ color:#282828; text-transform:uppercase; margin-bottom:6%; }
.contact p{ margin-bottom:9%; }
.contact p > span{ display:block; }

.contact form{}
.contact form label{ font-weight:normal;}
.contact form .form-control::-moz-placeholder {
    color: #b1b1b1;
}
.contact form .form-control{
    background-color: #f6f6f6;
    border: 1px solid #c9c9c9;
    border-radius:0;
    box-shadow: 0 0;
	height: 37px;
}
.contact form textarea{
	background-color: #f6f6f6;
    border: 1px solid #c9c9c9;
	resize:vertical;
	width:100%;
}

.contact .btn.btn-default{
	border:2px solid #333333;
	border-radius:0;
	padding:12px 50px;
	font-size:18px;
}
.contact .btn.btn-default:hover, .contact .btn.btn-default:focus{
	background:#333333;
    border:2px solid #333333;
    color:#fff;
    transition:all 0.4s ease-in-out 0s;
}

/* ===== CONTACT US PAGE ENDS ====== */






/*responsive layout*/
@media only screen and (min-width: 320px) and (max-width: 480px) {

	  body{
		padding-top:50px !important;
	 }

	  /*slider*/
	  .carousel-inner > .item img{
		 height:100%;

	 }

	.slider .carousel-caption h1{
		font-size:18px !important;
	}
	.slider .carousel-caption h2{
		 font-size: 16px !important;
         margin-bottom: 4px;
	}
	.slider .carousel-caption p, .slider .carousel-caption a{
		font-size:12px !important;
		line-height:15px;
	} /*slider ends*/

	.child-pics .yellowbox span{
		top:-22%;
	}
	.diamond{
		margin-bottom:10%;
		margin-top:10%;
	}
	.overlay-abt  h2{
		padding-top:90% !important;
	}
	.overlay-abt  ul.info li{
		padding-right:10px;
	}
	.pages .pagination > li{ margin-left:0;}

	ul#portfolio-list li{
		width:100% !important;
	}

}
@media only screen and (min-width: 320px) and (orientation: portrait){

	body{
		padding-top:64px;
	}
	.slider .carousel-caption h1{
		font-size:18px !important;
	}
	.slider .carousel-caption h2{
		 font-size: 16px !important;
         margin-bottom: 4px;
	}
	.slider .carousel-caption p, .slider .carousel-caption a{
		font-size:12px !important;
		line-height:15px;
	} /*slider ends*/

	.causes-detail .grey-box a, .causes-detail2 a, .event-btn a{
		font-size:10px;
		padding:10px 20px;
	}

}
@media only screen and (width: 360px) and (orientation: portrait){
	body{
		padding-top:54px !important;
	}
}


@media only screen and (max-width: 640px) {
	body{
		padding-top:60px !important;
	}
	.slider .carousel-caption h1{
		font-size:18px !important;
	}
	.slider .carousel-caption h2{
		 font-size: 15px !important;
         margin-bottom: 4px;
	}
	.slider .carousel-caption p, .slider .carousel-caption a{
		font-size:12px !important;
		line-height:15px;
	} /*slider ends*/
	.slider .carousel-caption a{ margin-top:5px;}

	.child-pics .imgbox img{
		width:100%;
	}
	.child-pics .yellowbox span{
		display:none;
	}

	.view-staff{ margin-bottom:10px;}
	.overlay-abt  h2{
		padding-top:90%;
	}
	.overlay-abt  ul.info li{
		padding-right:10px;
	}
	ul#portfolio-list li{
		width:98% !important;
		margin-left:0;
	}

}

@media only screen and (max-width: 768px){
    body{
		padding-top:70px;
	}

	  /*slider*/
	.slider .carousel-caption h1{
		font-size:40px;
	}
	.slider .carousel-caption h2{
		 font-size:28px;
	}
	.slider .carousel-caption p, .slider .carousel-caption a{
		font-size: 16px;
	}
	.slider .carousel-caption a{ margin-top:10px;}

	.child-pics .yellowbox{
		padding:5% !important;
	}
	.child-pics .yellowbox span{
		top:-18%;
	}
	.diamond{
		margin-bottom:10%;
		margin-top:10%;
	}

	.features #latest-work img:nth-child(2n){
		margin-right:18px;
	}

	.overlay-abt  h2{
		padding-top:20% !important;
	}
	.overlay-abt  ul.info li{
		padding-right:10px;
	}
	.causes-nav ul > li, .gallery-nav ul > li{
		margin-left:0;
		margin-right:0px;
	}
	ul#portfolio-list li{
		width:28%;
		margin-left:10px;
		margin-right:10px;
	}

}


@media only screen and (width: 800px) {

	.slider .carousel-caption a{ margin-top:10px;}
	.slider .carousel-caption h1{
		font-size:50px;
	}

	.child-pics .yellowbox{
		padding:3%;
	}
	.overlay-abt  h2{
		padding-top:20% !important;
	}
	.overlay-abt  ul.info li{
		padding-right:10px;
	}
	ul#portfolio-list li{
		width:30%;
	}
}
@media only screen and (width: 980px){
	ul#portfolio-list li{
		width:30%;
	}
}

@media only screen and (max-width: 1024px) {
	.navbar-default .navbar-nav > li > a{
		padding-left:10px;
		padding-right:10px;
		font-size:14px;
	}

	.child-pics .yellowbox{
		padding:7%;
	}
1	.diamond{
		margin-bottom:10%;
		margin-top:10%;
	}
	#recents .update-white span{
		top:-14%;
	}

	.features #latest-work img:nth-child(2n){
		margin-right:18px;
	}
	/*HOME PAGE ENDS*/

	.overlay-abt  h2{
		padding-top:30%;
	}
	.overlay-abt  ul.info li{
		padding-right:10px;
	}

}