@charset "utf-8";
/* CSS Document */
@media (max-width: 998px) {
	body{font-size:15px}
	h1{font-size:25px;}
	p{line-height:22px}
	/*header*/
	.header{padding:30px 0 20px;}
	
	h1.logo{margin-bottom:20px;}
	h1.logo a{background-size:170px 76px; width:170px; height:76px}
	
	/*navigation*/
	.navigation{padding-top:20px}
	.navigation ul{list-style:none; margin:0; padding:0; display:block; position:relative}
	.navigation ul li{font-size:14px; margin-left:14px;}
	.navigation ul li a{ background-position:100% 5px}
	/*sup menu*/
	.navigation ul li ul{top:32px;}
	
	/*---banner Aarea
	=========================*/
	.firstSlide img{width:180px !important;}
	.sliderArea h1{font-size:30px;}
.	.sliderArea h2{font-size:17px; line-height:22px}
	.bannerArea .topPart .info p{font-size:22px; line-height:35px;}
	.bannerArea .bottomPart h2{font-size:20px}
	.bannerArea .bottomPart p{font-size:13px}
	.bannerArea .bottomPart .midCol h2, .bannerArea .bottomPart .rightCol p, .bannerArea .bottomPart .leftCol p{line-height:normal}
	
	/*---cotnent
	=====================*/
	.content{padding:10px 0 0}
	
	/*---our program area
	========================*/
	.ourProgramArea .rightCol{padding-left:10px;}
	
	.ourProgramArea .infoCol{padding:90px 0 0;}
	.ourProgramArea .infoCol h2{font-size:18px;}
	.ourProgramArea .box{padding-bottom:30px}
	.ourProgramArea .infoCol small{display:block; font-size:60px;}
	.ourProgramArea .infoCol small span{font-size:30px}
	.ourProgramArea .infoCol p{font-size:15px; line-height:20px}
	
	/*---content
	========================*/
	
	/*ourphlsphyBlue*/
	.ourphlsphyBlue h1{font-size:20px;}
	.ourphlsphyBlue p{font-size:13px;}
	
	/*childProgramRow*/
	.seekingSupport h2{font-size:20px;}
	
	/*news page*/
	.upcomingEvents span.title{font-size:18px;}
	.upcomingEvents span.text{font-size:14px}
	
	/*supportArea*/
	.supportArea{padding:0 0 80px}
	.supportArea .boxin{margin:0 20px 30px 0}
	.supportArea a.donate{background:#00b2c4; color:#fff; border-radius:5px; font-size:26px; font-weight:bold; padding:0 15px 3px;}
	.supportArea h3{font-size:18px; line-height:23px}

	.supportArea .yelloBoxIn{position:relative; z-index:9; padding:20px 40px 30px}
	.supportArea .yelloBox h2{font-size:18px; padding-bottom:10px}
	.supportArea .yelloBox ul{list-style:none; margin:0; padding:0; color:#fff}
	.supportArea .yelloBox li strong{font-size:20px; width:25%}
	.supportArea .yelloBox h6{width:75%; line-height:14px; font-size:13px; padding:0 0 0 10px}
	
	.supportArea img{display:block; width:100%}
	.supportArea h4{font-size:15px; font-weight:700; margin:0}
	.supportArea ul{padding:0 0 20px 20px;}
	
	.report h3{font-size:20px; line-height:30px; padding:20px 0}
	

	/*---footer
	=================*/
	.footer{padding:30px 0}
	.footer h3{font-size:16px; letter-spacing:0}
	
	.footer ul.socialList li{font-size:12px}
	.footer ul.socialList li a{padding:5px 5px;}
	.footer ul.socialList li i{font-size:25px; width:20px}
}

@media (max-width: 765px) {
	p{padding-bottom:15px;}
	.textCol{padding:0}
	
	/*---header
	====================*/
	.header{padding:20px 0 0;}
	.hederFixed {position:relative; top: 0; left: 0; box-shadow: 0 0 0 rgba(0,0,0,0.33);}
	.filter-drop-spacer{display:none !important}
	/*navigation*/
	.navigation{float:none; padding:0}
	.navbar-header{padding-top:8px}
	.navbar-collapse{}
	.navigation ul{padding-top:10px;}
	.navigation ul li{float:none; position:relative; margin:0 0 10px; font-size:18px; height:auto}
	.navigation ul li:first-child{margin:0 0 10px;}
	.navigation ul li a{ background:none; padding:0}
	.navigation ul li.contact a{ background:none; padding:0; color:#00b2c4}
	
	.navigation ul li ul{position:relative; top:0; left:0; display:block !important; padding:10px 0 0 10px; display:block; background:none}
	.navigation ul li ul li{padding:0; margin-bottom:5px; font-size:14px}
	.navigation ul li ul li a{color:#00b2c4}
	/*.navigation ul li ul li:before{content:'-'; color:#00b2c4; position:absolute; top:0; left:0}
	.navigation ul li ul li:first-child:before{display:block}
	.navigation ul li ul li:first-child{padding:0 0 0 10px; margin-bottom:5px}*/
	.navigation ul li:hover ul{display:block}
	
	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{background:#00b2c4 !important}
	.navbar-default .navbar-toggle{border-color:#00b2c4 !important}
	.navbar-default .navbar-toggle .icon-bar{background-color:#00b2c4 !important}
	.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar{background-color:#fff !important}
	
	
	/*---banner Area
	=======================*/
	.firstSlide{margin-top:5%; }
	.firstSlide img{width:120px !important;}
	.sliderArea h1{font-size:18px; padding-bottom:0}
.	.sliderArea h2{font-size:14px; line-height:18px}
	.bannerArea .topPart{height:400px;}
	.bannerArea .topPart .info{float:none; margin:0 0 0 10px; width:250px;}
	.bannerArea .topPart .info:before{width: 250px; height: 250px;}
	.bannerArea .topPart .info p{color:#fff; font-weight:bold; font-size:17px; position:relative; z-index:9; padding:120px 30px 0 30px; line-height:25px;}
	
	.bannerArea .bottomPart{padding:0 30px 20px; margin-bottom:10px}
	.bannerArea .bottomPart .leftCol, .bannerArea .bottomPart .rightCol{width:230px; margin:0 auto; float:none}
	.bannerArea .bottomPart .midCol{width:260px; margin:0 auto; float:none}
	.bannerArea .bottomPart .rightCol:before{right:0;}
	.bannerArea .bottomPart .midCol{left:0; margin-top:-15px}
	.bannerArea .bottomPart .leftCol:before{top:-20px}
	
	
	/*---our program area
	========================*/
	.ourProgramArea .rightCol{padding-left:0;}
	
	.ourProgramArea .infoCol{padding:10px 0 0;}
	.ourProgramArea .infoCol h2{font-size:22px; position:relative}
	.ourProgramArea .box{padding-bottom:30px}
	.ourProgramArea .infoCol small{display:block; font-size:80px;}
	.ourProgramArea .infoCol small span{font-size:40px}
	.ourProgramArea .infoCol p{font-size:18px;}
	
	/*---cotnent
	=====================*/
	.content{padding:30px 0 0}
	
	/*ourphlsphyBlue*/
	.ourphlsphyBlue{ position:relative; color:#fff; padding:10px 20px 20px; margin-top:50px; width:280px; margin:0 auto; margin-bottom:20px}
	.ourphlsphyBlue:before{content: ""; width:98%; height:100%; background:#13b3c3; -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); -ms-transform: rotate(5deg); -o-transform: rotate(5deg); transform: rotate(5deg); display:block; border-radius:20%; position:absolute; top:0; left:0; z-index:1}
	.ourphlsphyBlue h1{font-size:18px; line-height:normal; padding-bottom:0}
	.ourphlsphyBlue p{font-size:12px; line-height:normal}
	
	.valueArea{padding:20px 0 0}
	.valueArea h1{font-weight:400; padding-bottom:10px}
	.valueArea h2{font-size:15px; color:#00b2c4; font-weight:700; margin:0 0 5px}
	
	.seekingSupport h1{padding-top:20px}
	.bottomCon .textBox{padding:0; border:none}
	
	/*news page*/
	.articleArea{border-bottom:1px solid #a0a0a3; padding-right:0; padding-bottom:0; border-right:none;}
	.upcomingEvents a.viewCal, .newsPage article a.readMore{font-size:16px;}
	.newsPage article a.readMore i{font-size:12px}
	.upcomingEvents span.title{font-size:20px;}
	.upcomingEvents span.text{font-size:15px}
	
	.supportArea .yelloBox{padding:0 0; position:relative; margin:0 auto; margin-bottom:50px; margin-top:20px; max-width:450px}
	.supportArea .yelloBox:before{ border-radius:20%;}
	.supportArea img{max-width:450px; margin:0 auto}
	.supportArea .yelloBoxIn{padding:20px 20px 20px}
	
	
	/*---footer
	=================*/
	.footer{padding:30px 0}
	.footer h3{font-size:19px; letter-spacing:1px; margin:0 0 5px;}
	.footer ul{margin:0}
	.footer strong{margin:0 8px}
	
	.footer ul.socialList li{font-size:14px}
	.footer ul.socialList li a{padding:5px 10px;}
	.footer ul.socialList li i{font-size:30px; width:30px}


}
