
/*		Mobile Layout:320px and 480px and more but less than or equal to 767px.
----------------------------------------------------------------------------------
*/

@media only screen and (min-width:320px) and (max-width:767px){
	*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	.header-content{ padding:0 10px }
	.mobi-nav {cursor:pointer;height:30px;padding:0 5px;position:absolute;right:10px;top:20px;width:35px;z-index:999}		    
	.mobi-nav div {background:#fff;float: left;height: 3px;margin-top:5px;width: 25px;}
	.main-nav{float:left;width:100%; display:none; margin-top:0}
	.main-nav ul{float:left;width:100%;margin:0px; max-height:215px; overflow:auto}
	.main-nav li{margin:0px;width:100%; line-height:18px; margin:0 0 10px}
	.main-nav li a{ width:100%;text-align:center;text-decoration:none;padding-right:0; border:0}
	.main-nav li:first-child{margin:0 0 10px}
	.cart-wrap{ width:100%; text-align:center; padding:0; border:0; line-height:18px; padding-bottom:20px}	
	.logo{padding:10px 0; width:120px}	
	.main-nav a:hover, .main-nav li.active a{ border:0}	
	.solar-charger {float: none;margin:30px auto 0;width:300px;}
	

	/* Home Page */	
	.content-section{ padding-bottom:0}
	.hero-section img{ margin:0}
	.header-wrap{ position:relative; background:#097e98; float:left; width:100%}	
	.hero-content div{ font-size:15px; line-height:24px; padding:15px 30px;}
	.hero-content{ margin:0; padding:10px 0 0}
	.hero-content h2{ font-size:14px; line-height:28px; padding-top:10px}
	.hero-section .hero-content img{ height:30px}
	.product-item{ width:100%}
	.product-item .blog-thumb-info h3{ font-size:16px}
	.contact-wrap,.footer-content{ width:100%}
	.footer-content{ padding:50px 10px}	
	.thumb-item,.fortune,.the-new,.next-billion{ float:none; margin:0 auto 15px; overflow:hidden; }	
	.partners-gallery{ width:100%}
	.partner-thumb {float: none;margin: 0 auto 20px;overflow: hidden; position: relative;}
	.donate-content-left{ width:100%;}
	.donate-content-left div{ font-size:24px}
	.donate-content-right {float: left; width: 100%; margin:20px 0 0}
	.partners-gallery{ margin:35px 0 0; padding-bottom: 0px;}
	.donate-content{ padding:30px 10px 0}
	.donate-wrap{ padding-bottom:30px}
	.footer-logo {float: none;margin: 0 auto;width: 121px;}
	.join-our {float: none; margin: 0 auto; width: 304px; clear:both}
	.footer-row{ float:left; width:100%}
	.copyright{ text-align:center; width:100%}
	.social-wrap{ float:none; margin:0 auto 0; padding:20px 0 0; overflow:hidden; width:184px}
	.widget-wrap{padding: 30px 10px;}	
	.hero-section img{ min-height:100px}
	.content-wrap-right,#brandlogoThumb{ width:100%}
	.brandlogo-wrap h3{ width:100%; border:0; font-size:20px}
    .hero-content a, .donate-content-right a{float: left; width: 100%; margin-top: 15px;}
    .hero-content div span{font-size: 13px;}
    .hero-content div span{margin-top: 15px;}
    
    .testimonial{float: left; width: 100%; text-align: center;}
    .testimonial-img{float: none; margin: 0 auto;}
    .testimonial p{width: 100%;max-width: 100%; font-size: 17px; margin-top: 20px;}
    /*.sopurt-section h4{font-size: 20px; line-height: 25px; padding: 20px 0; }*/
    .partner-thumb-text span{font-size: 50px;}
    .footer-gallery .overlay{display: none;}
    .achievied-section h4{line-height: 28px;}
	
	/* About Pge */
	.meet-the-founder{ float:left; width:100%}
	.play-video{ margin:30px 0}
	.sameer-story-info{ width:100%; margin:20px 0}
	.summer-story-title h2{ margin-left:0; font-size:24px}
    
    /* Product Pge */
    .product-range{ float:left; width:100%}
    .products-page .hero-section{min-height: 150px}
    
	/* Blog  Page */
	.blog-content-inner,.blog-content{ float:left; width:100%}
	.blog-product{ width:100%; margin: 0 0 30px}
	.blog-product-info h2{ font-size:18px}
	.blog-sidebar{ float:left}
	.comment-box{ width:100%; margin-left:-10px}
	.contact-page, .blog-page{ padding:50px 0}	
	.mapping-wrap{ width:100%}
	
	.blog-sidebar{ width:100%}
	.recent-post h3{ font-size:18px}
	.recent-post li{ font-size:16px}

	/* Begin new css v2 */
	#video-background{display: none;}
	#video-container{min-height: 300px;background: url(images/hero-img.jpg) no-repeat center top;background-size: cover;}
	.home-page .hero-wrap{top:70px;}
	.hero-section{min-height: 150px}
    #sponsor-page .hero-section{min-height: 150px}
    
    .product-tabs{ margin: 30px 0 50px}
    .product-tabs ul{ width: 100%; text-align: center}
    .product-tabs ul li{float: none; width: 237px; clear: both; overflow: hidden; margin: 10px auto 0;}
    .tab-contents{margin-top: 0px;}
    .products-figures{ width: 100%}
    
    .product-details{float: left; width: 100%; padding-top: 40px;}
    .product-details h3{ text-align: center; margin-bottom: 0;}
    
    .product-details a.download-spec-btn {margin-top: 30px;}
    .products-page .content-section {padding-bottom: 30px;}
    /*.sopurt-section{margin-top: 0px;}*/
    
    /* ======================== Sponsor page ========================== */
    #sponsor-page{padding-top: 0}
    .section-lead-text h3{font-size: 20px; line-height: 28px;}
    .section-lead-text span{font-size: 17px; }
    .offering-info, .info-details{ width: 100%; text-align: center}
    .info-details:first-child p{width: auto; margin-top: 10px;}
    .info-details:last-child p{padding: 0 25px;}
    .info-details:first-child{padding-left: 0}
    .info-details:last-child { border-left: 0 solid #000000; margin-top: 20px; padding-left: 0; }
    .info-details:first-child h4, .info-details:last-child h4 {font-size: 20px;}
    .info-details p{font-size: 15px; line-height: 25px;}
    .call-to-action { float: left; margin-left: 0; margin-top: 20px; width: 100%; }
    .meet-the-people{margin-top: 40px; padding-bottom: 0;}
    .offering-wrap{margin-top: 30px;}
    .feature-text{padding: 0;}
    .feature-text h2{font-size: 22px; line-height: 32px;}
    .feature-text p{font-size: 16px; line-height: 25px; margin-top: 20px;}
    .feature-text span{font-size: 17px}
    .feature-text-section{padding: 45px 0;}
    .promo{margin-top: 0;}
    .promo-item-wrap{width: 100%; margin: 45px 0 0;}
    .promo-item-wrap h5{margin-top: 15px;}
    .promo-item-wrap h5{font-size: 17px;}
    .promo-item-wrap p{margin-top: 10px;}
    .promo{padding: 10px 0 40px;}
    
    .title-section{ margin-top: 35px;}
    .title-section h4{ font-size: 20px; line-height: 25px;}
    .brandlogo-wrap{ padding-bottom: 0px;}
    .footer-gallery .mobi-view{ display: block; position: relative; height: auto; left: auto; top: auto; padding-bottom: 30px; opacity: 1; clear: both; overflow: hidden}
    .footer-gallery .mobi-view span{ margin-top: 30px;}
    .footer-gallery .overlay .sponsor-btn a{ width: 90%; max-width: 365px;}
    
    
    .slide-outer-wrap,.feature-wrap-inner{ max-width: 280px }
    .slick-slide{margin: 0 5px;}
    form[id*="give-form"] .give-donation-amount #give-amount, form[id*="give-form"] .give-donation-amount #give-amount-text{max-width: 315px; width: 82%}
    .give-btn{width: 100%; max-width: 315px; }
    .give-donation-amount{max-width: 315px; width: 100%; }
    #give-recurring-form, form.give-form, form[id*="give-form"], .call-to-action{text-align: center;}
    form[id*="give-form"] .give-donation-amount{margin: 0 auto 15px;}
    .give-form-wrap{text-align: center;}
    .currency-per-month{right: 40px;}
    .call-to-action{float: none; max-width: 350px; margin: 25px auto 0; clear: both; overflow: hidden; }
    .offering-info{padding-bottom: 25px;}
    form.floated-labels .floatlabel input, form.floated-labels .floatlabel select, form.floated-labels .floatlabel textarea{font-size: 12px}
    .give-modal form[id*="give-form"], .give-modal form[id*="give-form"] .give-submit{width: 100%; max-width: 100%;}
    #give-user-login-submit-30 .give-submit{width: 100%; margin-bottom: 5px;}
    #give-user-login-submit-30 .give-cancel-login{width: 100%; max-width: 100%; margin-left: 0px}
    .call-to-action .give-recurring-donors-choice{max-width: 315px;}
    .home-page .hero-wrap{padding: 0 15px;}
	.home-page .hero-section{max-height: 270px; background: url(../images/image-new.jpg) no-repeat center center; background-size: cover;}
	.partner-thumb{width: 100%; min-height: 350px; padding-bottom: 50px}
	.partner-thumb:first-child {max-width: 250px; margin: 0 auto; clear: both;}
	.indicate-arrow{bottom: 75px;}
	.partner-thumb:after {bottom: 5px; top: auto; left: 50%; margin-left: -25px; transform: rotate(90deg); }
	.partner-thumb:first-child:after{bottom: 25px}
	.partner-thumb:last-child{padding-bottom: 0; margin-bottom: 0;}
	.partners-gallery{margin-top: 65px;}
	#sponsor-page .hero-section{min-height: 50px}

}

/*		Wide Mobile Layout:480px.
------------------------------------------------------------
*/

@media only screen and (min-width:480px) and (max-width:767px){
	*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	.hero-wrap{ top:40px}
	.hero-section .hero-content img{ height:45px}
	.hero-content h2{ font-size:18px}
	.hero-content div{ margin:0 auto; width:65%}
    .product-tabs ul li{width: 45%; margin-right: 2%; margin-left: 2%;}
    .product-tabs ul li:nth-child(2){margin-right: 0%;}
    .product-tabs ul li:nth-child(3){margin-left: 0%;}
    .hero-content a, .donate-content-right a{width: 50%; float: left; margin-left: 25%;}
    #sponsor-page .hero-section{min-height: 90px;}
    .home-page .hero-content{max-width: 100%; width: 100%;}
    
    
    .slide-outer-wrap,.feature-wrap-inner{ max-width: 420px }
    .call-to-action .give-recurring-donors-choice{max-width: 315px;}
    
    .Gtabs{text-align: center;}
    .Gtabs li{float: none; display: inline-block; clear: both; overflow: hidden;}

    
}



/*		Tablet/iPad Layout:768px.
-----------------------------------------------------------------
*/

@media only screen and (min-width:768px) and (max-width:990px){
	*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	
	.main-nav li{ font-size:12px}
	.main-nav li a{ padding:0 10px}
	.logo{ width:145px}
	
	.solar-charger{ width:225px; margin:-85px 0 0}
	.content-wrap-right{ width:500px}
	
	.partners-gallery{ margin:50px 0 0}
	.partner-thumb { float: left;/*margin-right: 30px;*/width: 29%;}
	
	.donate-content-left div{ font-size:18px}
	.donate-content-left{ width:30%}
	.donate-content-right{ width:65%}
	.donate-wrap{ padding-bottom:35px; min-height:auto}
	.overlay{ top:50px}
	.overlay h2{ font-size:48px; padding-bottom:30px}
	.overlay div{ font-size:15px}
	.brandlogo-wrap h3{ line-height:30px}
	#brandlogoThumb{ float:left; width:100%}
	.thumb-item{ margin-left:-20px}
	.brandlogo-wrap{ margin-top:20px}
	
	
	.summer-story-title{ width:35%}
	.sameer-story-info{ width:60%}
	
	.blog-content{ width:74%}
	.blog-product{ width:45%}
	.blog-product-info{ padding-left:0}
	.blog-product-info h2{ font-size:17px}
	.mapping-wrap{ width:71%}
	div.contact-address{ padding:0}
	.contact-details a{ font-size:15px}
	.contact-details address{ font-size:15px; line-height:20px}
	.contact-info{ width:185px}
	.contact-details{ padding-bottom:5px}
	
	/* Footer */
	.join-our{ width:210px; margin-left:30px}
	.social-wrap{ margin-left:20px}
	.text-field{ width:auto; padding-left: 10px}
	.widget-wrap{ padding:50px 10px}
	
	/* Begin new css v2 */
	#video-container{min-height: 430px;background: url(images/hero-img.jpg) no-repeat center top;background-size: cover;}
	#video-background{display: none;}

	.overlay .numscroller{ padding-bottom: 25px; }
    
    /* Product Pge */
    .products-page .hero-section{min-height: 150px}
    .product-range{ width:750px}
    .product-tabs {margin-top: 50px;}
    .tab-contents {margin-top: 60px;}
    .product-details a.download-spec-btn {margin-top: 50px;}
    .footer-gallery .overlay span{margin-top: 30px;}
    
    /* Home page */
    /*.partner-thumb img{margin-left: 0px;}*/
    .partner-thumb-text span{font-size: 60px;}
    .home-page .hero-content{margin-top: 18%;}
    .brandlogo-wrap{margin-bottom: 0;}
    
    /* ================= Sponsor page style ======================== */
    .info-details:first-child{padding-left: 0}
    .feature-text{padding: 0 30px;}
    .promo{padding-bottom: 30px;}
    
    .slide-outer-wrap,.feature-wrap-inner{ max-width: 690px }
    
    .brandlogo-wrap{ padding-bottom: 0px; margin-top: 60px;}

    .call-to-action{margin-left: 45px;}
    .give-donation-amount{max-width: 315px; width: 80%;}
    .give-donation-amount #give-amount, form[id*="give-form"] .give-donation-amount #give-amount-text, #give-recurring-form, form.give-form, form[id*="give-form"]{width: 110%; max-width: 315px;}
    .give-donation-amount{width: 100%; max-width: 315px;}
    .give-btn{width: 115%; width: 100%;}
    form[id*="give-form"] .give-donation-amount #give-amount, form[id*="give-form"] .give-donation-amount #give-amount-text{width: 82.5%; max-width: 315px;}
    .currency-per-month{right: 0}
    .give-modal form[id*="give-form"], .give-modal form[id*="give-form"] .give-submit {max-width: 100%; width: 100%; }
    .home-page .hero-section{max-height: 400px;background: url(../images/image-new.jpg) no-repeat center center; background-size: cover;}

    .partner-thumb { float: left;width: 21.809524%;}
	.partner-thumb figure{max-width: 140px;}
	.partner-thumb-text div{font-size: 13px; line-height: 18px;}
	.partner-thumb:after{width: 35px; right: -40px}
	.partner-thumb-text span{font-size: 45px}
	.partner-thumb-text div{padding: 5px 0;}

	.blog-content{width: 100%;}
	.blog-product{width: 46.8%;}
	.blog-product-info div{padding-right: 5px;}
}

/*		Tablet/iPad Layout:1024px.
-----------------------------------------------------------------
*/

@media only screen and (min-width:991px) and (max-width:1024px){
	*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	
	#brandlogoThumb{ width:auto}	
	.thumb-item,.fortune,.the-new,.next-billion{ margin-right:36px}
	.partner-thumb{ margin-right:48px}
	/* Begin new css v2 */
	.wscreen{display:inline-block;}
	.tscreen{display:none;}
	#video-container{min-height: 460px;background: url(images/hero-img.jpg) no-repeat center top;background-size: cover;}
	#video-background{display: none;;background: url(images/hero-img.jpg) no-repeat center top;background-size: cover;}
    
    /* Product Pge */
    .products-page .hero-section{min-height: 150px}
    
    
    
    .slide-outer-wrap,.feature-wrap-inner{ max-width: 950px }
    
    .brandlogo-wrap{ padding-bottom: 0px;}
    .give-modal form[id*="give-form"], .give-modal form[id*="give-form"] .give-submit {max-width: 100%; width: 100%; }
    form[id*="give-form"] .give-donation-amount #give-amount, form[id*="give-form"] .give-donation-amount #give-amount-text{width: 85.6%}
    .home-page .hero-section{max-height: 400px; background: url(../images/image-new.jpg) no-repeat center center; background-size: cover; min-height: 365px}

    .partner-thumb {width: 17.809524%;}
    .partner-thumb:first-child{top: 25px;}

    .blog-product{width: 31%;}

    
    
}

@media only screen and (min-width:1025px) and (max-width:1399px){

	.wscreen{display:inline-block;}
	.tscreen{display:none;}

    /* Product Pge */
    .products-page .hero-section{min-height: 150px}
    
}

@media only screen and (min-width:1400px) and (max-width:1840px){

	.wscreen{display:inline-block;}
	#video-container-2.wscreen{margin-top:-100px}
	.tscreen{display:none;}

}
	