/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	.content{width:90%;}
	.banner-slide{display:none;}
	.banner-right{width:100%;}
	ul.tabs li {
  width: 32%;
}
.header-contact{text-align:center; width:100%;}
.header-contact h1{text-align:center;}
.header-contact p{text-align:center;}

body {
  background: url("../images/body-bg.jpg") no-repeat scroll center 160px #fff;
  color: #666;
  font-family: "open_sansregular";
  font-size: 13px;
  line-height: 16px;
  margin: 0;
  padding: 0;
  text-decoration: none;
}
.header{float:none; height:auto; text-align:center;}
.marque-box{float:left;}
.header .logo{height:auto; width:100%; border-bottom:none;}
.header-right{float:none; margin:0; padding:0; width:100%; height:auto;}
.logo img{width:100%; text-align:center;}
.welcome{width:100%; padding:0;}
.welcome-container{padding:0;}
.principle-msg {
  height: 30%;
  margin: 0;
  min-height: 290px;
  text-align: center;
  width: 100%;
}
.gs-msg {
  height: 30%;
  margin: 0;
  min-height: 290px;
  text-align: center;
  width: 100%;
}
.activities-right{width:100%; margin:0;}
.recent-activities{width:100%; height:300px; float:left; overflow:scroll; margin-bottom:10px;}
.newsletter-box a h3 {
  width: 93%;
}
.vision-mission ul {
  width: 95%;
}
.social-icon {
  text-align: center;
  width: 100%;
}
.social-icon ul {
  float: none;
  text-align: center;
}
.social-icon ul li {
  display: inline;
  text-align: center;
}
.footer-bg {
  height: auto;
  margin: 0;
  padding: 0;
}
.footer-menus{width:100%;}
.footer-menus ul li {
  border-right: 1px solid #ccc;
  float: left;
  list-style: outside none none;
  margin: 3px 0 8px;
  padding: 0 5px;
}
.newsletter-box{width:100%; margin:0;}
.sidebar{display:none;}
.main-content{width:100%;}
.other-information{width:100%; margin:0 0 5% 0; padding:0;}
.donation-forms{width:100%;}
.details1{width:100%; text-align:center;}
.details1 p{width:100%; text-align:center;}
.inner-banner-bg{height:100%; border-bottom:none;}
.contact-address{width:100%; text-align:left;}
.contact-address p{text-align:left;}
.contact-form{text-align:left; width:100%;}
.field1 {
  float: left;
  margin: 0 0 10px;
  padding: 0;
  width: 100%;
}
.field1 p {
  margin-left: 12px;
}
.field1{width:100%;}
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
	
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
	.header{height:auto; margin:0; padding:0;}
	.header .logo{width:100%; margin:0; padding:0;}
	.header .logo img{width:100%; text-align:center;}
	.content{width:98%;}
	.menus-right {
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 155px;
  width: 97%;
}
	.menus{width:100%; margin:0; padding:0;}
	.navigation-Menus{height:auto;}
	.header-right{width:98%; margin:0; padding:0;}
	.marque-box{margin-bottom:20px; padding:0; width:100%;}
	.header-contact{width:100%; margin:0 0 20px 0; padding:0; text-align:center;}
	.header-contact h1{text-align:center; float:none; margin:0; padding:0;}
	.header-contact p{text-align:center; float:none; margin:0; padding:0;}
	body {
  background:none;}
  .banner-bg{width:100%; height:auto; margin:0; padding:0;}
  .banner-bg .banner-slide{display:none; margin:0;}
  .banner-right{width:100%; margin:0; padding:0; float:left;}
  .welcome{width:95%; margin:0; padding:0}
  .principle-msg {
  margin: 0;
  text-align: center;
  width: 91%;
  height: 30%;
  min-height: 290px;
}
.principle-msg img{ text-align:center;}
.principle-msg p {
  margin: 0 0 0 9px;
  padding: 0;
  width: 96%;
}


 .gs-msg {
  margin: 0;
  text-align: center;
  width: 91%;
  height: 30%;
  min-height: 290px;
}
.gs-msg img{ text-align:center;}
.gs-msg p {
  margin: 0 0 0 9px;
  padding: 0;
  width: 96%;
}
.scroll-pg .img1 img{max-width:100%;}
.scroll-pg .img1 {
  float: left;
  max-width: 29%;
}
h2{width:100%; text-align:center; float:none;}
.recent-scroll{width:100%;}
.recent-activities{width:100%;}
.recent-scroll {
  height: 200px;
}
.newsletter{width:100%; margin:0;}
.activities-right{width:100%;}
.newsletter-box {
  width: 97%;
}
.newsletter-form input{width:92%;}
.newsletter-box a h3{width:93%;}
.activities-right{margin:0; padding:0;}
.vision-mission{width:100%; margin:0;}
.vision-mission ul {
  margin: 0;
  padding: 10px;
  width: 93%;
}
.social-icon{width:100%; text-align:center;}
.social-icon ul{text-align:center; float:none;}
.social-icon ul li{text-align:center; display:inline;}
.footer-bg{height:auto; margin:0; padding:0;}
.footer-menus{width:100%;}
.footer-menus ul li {
  border-right: 1px solid #ccc;
  float:none;
  list-style: outside none none;
  margin: 3px 0 8px;
  padding: 0 5px 0 5px;
  display:inline-block;

}
.footer-menus ul {
  float: right;
  margin: 0;
  padding: 0;
  text-align:center;
}
ul.tabs li{width:30%;}
.sidebar{display:none;}
.main-content{width:100%;}
.other-address{display:none;}
element.style {
  float: left;
}
.other-information{width:100%; margin:0 0 5% 0; padding:0;}
.donation-forms{width:100%;}
.details1{width:100%; text-align:center;}
.details1 p{width:100%; text-align:center;}
.inner-banner-bg{height:100%; border-bottom:none;}
.login-form p{width:100%; margin:0; padding:0;}
.field1{width:100%; margin:0; padding:0;}
.login-form .field1 input{width:95%;}
.login-form{margin:0; padding:0; width:100%;}
.notmember{width:100%; margin:0; padding:0;}
.login-form .submit-btn{float:left; margin:0; padding:0;}
.login-form .submit-btn button{margin-left:0;}
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
	
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	.header{height:auto; margin:0; padding:0;}
	.header .logo{margin:0; padding:0;}
.header .logo img {
  text-align: center;
}
.content{width:98%;}
.menus-right {
  margin: 8px 0 0;
  padding: 0;
  position: absolute;
  right: 10px;
}
	.menus{width:100%; margin:0; padding:0;}
	.navigation-Menus{height:auto;}
.header-right {
  margin: 0;
  padding: 0;
  width: 50%;
}
	.marque-box {
  margin-bottom: 20px;
  padding: 0;
  width: 98%;
}
	.header-contact {
  float: right;
  margin: 0 14px 20px 0;
  padding: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 48px;
  width: 40%;
}
	.header-contact h1{float:right; margin:0; padding:0;}
	.header-contact p{float:right; margin:0; padding:0;}
	body {
  background: url(../images/body-bg.jpg) no-repeat scroll center 140px #fff;
  color: #666;
  font-family:Open Sans;
  font-size: 13px;
  line-height: 16px;
  margin: 0;
  padding: 0;
  text-decoration: none;
}
  .banner-bg{width:100%; height:auto; margin:0; padding:0;}
  .banner-bg .banner-slide {
  display: block;
  margin: 0;
  width: 69%;
}

  .banner-right{width:100%;}
  .banner-right {
  float: left;
  margin: 7px 0 0;
  padding: 0;
  width: 30%;
}
  ul.tabs {
  margin-left: 11px;
}
  .tab_container{margin-left:10px; width:96%;}

  .menus-right ul{margin:0; padding:0; float:right;}
  ul.tabs li {
  background: none repeat scroll 0 0 #eeeeee;
  border-width: 1px 1px 1px medium;
  cursor: pointer;
  float: left;
  font-weight: bold;
  height: 31px;
  line-height: 31px;
  margin: 0;
  overflow: hidden;
  padding: 0 21px;
  position: relative;
  width: 33%;
}
.social-icon {
  float: left;
  margin: 13px 0 0;
  padding: 0;
  width: 27%;
}
.newsletter-form input{width:95%;}
.ul.tabs li {
  margin: 0;
  width: 31%;
}
.principle-msg{}
.gs-msg{}
.newsletter-box{width:49%;}

.inner-banner-bg{height:100%; border-bottom:none;}
#cssmenu{height:auto;}
.navigation-Menus{height:43px;}
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
	
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
	
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
	.content{width:98%;}
}