@media (min-width: 1080px) and (max-width: 1200px)

{

	.container

	{

		width: 1040px;

		margin: 0 auto;

		padding: 0px 20px;

	}
	
	#mainbox{
		height:900px;	
	}

	.features-section ul li

	{

		width: 346px;

	}

	.stories-section ul li

	{

		width: 304px;

	}

	.story-img img

	{

		width: 304px;

		height: 195px;

	}

}

@media (min-width: 768px) and (max-width: 1080px)

{
		.menu{
	width:90%;
}
	.planoptionbox{
		width:130px;
		height:224px;
		background-size:contain;
		margin-right:12px;
		margin-top:10px;
		
	}
	#mainbox{
		height:900px;	
	}
	.container

	{

		width: 728px;

		margin: 0 auto;

	}

	.banner

	{

		padding: 100px 0px;

	}

	.big-text

	{

		font-size: 22px;

	}

	.header-text h2 

	{

    	font-size: 34px;

	}

	.small-text 

	{

    	width: 85%;

    	margin: 0px auto;

    	font-size: 16px;

	}

	.desc h2 {

    	font-size: 25px;

	}

	.desc p {

    	font-size: 16px;

	}

	.features-section ul li {

    	width: 242px;

	}

	.features-section ul li p {

   

    	font-size: 14px;

    	width: 95%;

	}

	.contact-section

	{

	width: 80%;

	margin: 0 auto;

	font-family: 'Open Sans', sans-serif;

	}

}

@media only screen 

and (min-device-width : 768px) 

and (max-device-width : 1024px) 

and (orientation : landscape) 

{

	.container

	{

		width: 728px;

		margin: 0 auto;

	}

	.banner

	{

		padding: 140px 0px;

	}

	.big-text

	{

		font-size: 22px;

	}

	.header-text h2 

	{

    	font-size: 34px;

	}

	.small-text 

	{

    	width: 85%;

    	margin: 0px auto;

    	font-size: 16px;

	}

	.desc h2 {

    	font-size: 25px;

	}

	.desc p {

    	font-size: 16px;

	}

	.features-section ul li {

    	width: 242px;

	}

	.features-section ul li p {

   

    	font-size: 14px;

    	width: 95%;

	}

	.contact-section

	{

	width: 80%;

	margin: 0 auto;

	font-family: 'Open Sans', sans-serif;

	}

}

@media (min-width: 640px) and (max-width: 768px)

{

	#socialicons{
		visibility:hidden;
	}
	.planoptionbox{
		width:130px;
		height:224px;
		width:110px;
		height:189px;
		background-size:contain;
		margin-right:12px;
		margin-top:10px;
		
	}

	.container

	{

		width: 600px;

		margin: 0 auto;

		padding: 0px 20px;

	}

	.banner

		{

			padding: 140px 0px;

		}

		.big-text {

    		font-size: 20px;

		}

		.header-text h2 {

    		font-size: 30px;

    		line-height: 40px;

		}

		.small-text {

    		width: 90%;

	    	font-size: 16px;

    		line-height: 35px;

		}

		.desc {

    		padding: 60px 0px;

		}

		.desc h2 {

    		font-size: 22px;

		}

		.desc p {

    		font-size: 14px;

		}

		.features-section ul li {

    		display: block;

    		float: none;

    		width: 80%;

    		margin: 40px auto;

		}

		p.box-desc {

   	 		line-height: 30px;

		}

		.stories-section ul li {

   	 		float: none;;

   	 		margin: 40px auto;

		}	

		.features {

    		padding: 140px 0px;

		}

		.stories {

    		padding: 140px 0px;

		}

		.contact {

    		padding: 140px 0px;

    

		}

}

@media (min-width: 480px) and (max-width: 640px)

{
	#socialicons{
		visibility:hidden;
	}
	.planoptionbox{
		width:110px;
		height:189px;
		background-size:contain;
		margin-right:12px;
		margin-top:10px;
		
	}


	.container

	{

		width: 440px;

		margin: 0 auto;

		padding: 0px 20px;

	}

	.banner

		{

			padding: 140px 0px;

		}

		.big-text {

    		font-size: 20px;

		}

		.header-text h2 {

    		font-size: 30px;

    		line-height: 40px;

		}

		.small-text {

    		width: 90%;

	    	font-size: 12px;

    		line-height: 20px;

		}

		.desc {

    		padding: 60px 0px;

		}

		.desc h2 {

    		font-size: 22px;

		}

		.desc p {

    		font-size: 14px;

			width: 100%;

		}

		.features-section ul li {

    		display: block;

    		float: none;

    		width: 80%;

    		margin: 40px auto;

		}

		p.box-desc {

   	 		line-height: 30px;

		}

		.stories-section ul li {

   	 		float: none;;

   	 		margin: 40px auto;

		}	

		.features {

    		padding: 140px 0px;

		}

		.stories {

    		padding: 140px 0px;

		}

		.contact {

    		padding: 140px 0px;

    

		}

}

@media (min-width: 20px) and (max-width: 480px)

{
	.container{
	
	}

	
	.responsive-menu-button
{
  float: right;
  padding-top: 24px;
  padding-right: 24px;
  padding-bottom: 24px;
  padding-left: 0px;
}
#mainlogo{
	min-width:240px;
	
}

.logo{
	position:relative;
	left:-20px;
	width:250px;
	
}

	#mainbox{
		padding-top:0px;
		background-image:none;

		
		
	}
	.container

	{

		width: 320px;

		margin: 0 auto;

		padding: 0px 0px;

	}
	
	.banner{
		padding: 30px 0px;
		background-image:none;
	}
	
	.planoptionbox{
		width:99px;
		height:201px;
		background-size:contain;
		margin-right:5px;
		margin-left:15px;
		margin-top:10px;
		
		
	}
	
	p.small-text{
		font-size: 14px;
		line-height:22px;
	
		position:relative;
		top:-30px;
	}
	#socialicons{
		visibility:hidden;
	}
	#stepsimage{
		margin-top:20px;		
		margin-bottom:20px;

		
	}

	.banner

		{

			padding: 40px 0px 10px;;

		}

		.big-text {

    		font-size: 15px;

		}

		.header-text h2 {

    		font-size: 26px;

    		line-height: 40px;


		}

		.small-text {

    		width: 90%;

	    	font-size: 15px;

    		line-height: 35px;

		}

		.button-section ul li {

    		margin: 50px 12px;

		}

		.white, .green {

    		padding: 15px;

		}

		.desc {

    		padding: 60px 0px;

		}

		.desc h2 {

    		font-size: 22px;

		}

		.desc p {

    		font-size: 14px;

			width: 100%;

		}

		.features

		{

			padding: 140px 0px;

		}

		.features-section ul li {

    		display: block;

    		float: none;

    		width: 90%;

    		margin: 40px auto;

		}

		.features-section ul li p

		{

			width: 100%;

		}

		p.box-desc {

   	 		line-height: 30px;

			font-size: 14px;

		}

		.stories

		{

			padding: 140px 0px;

		}

		.stories-section ul li {

   	 		float: none;;

   	 		margin: 40px auto;

			width: 260px;

		}

		.story-img img {

    		height: 170px;

    		width: 260px;

		}

		.features {

    		padding: 60px 0px;

		}

		.stories {

    		padding: 60px 0px;

		}

		.contact {

    		padding: 140px 0px;

    

		}

		.contact-section {

    		width: 80%;

		}

		h3.text-head {

    		font-size: 20px;

		}

		.menu {

   			 display: none;

		}

		.logo {

			float: left;

		}

}

@media only screen and (max-width: 767px){
img{
	max-width:100%;
	
}
#mobile-header {

display: block;

}

.header

{

	position: fixed;

}

.banner {

    padding: 160px 0px 80px;

}

.menu

{

	display: none;

}

}