@media (max-width: 1024px) {
	body {
		font-size: 15px;
  		line-height: 20px;
	}
	.logo { width: 350px; }
	.intro p { padding-left: 94px; }
	.intro .badges img {
		width: 54%;
		margin-bottom: 10px;
	}
	#features h3 { 
		font-size: 17px;
	}
	#features .col-1-3 {
		padding-top: 90px;
	}
	.member {
		margin-left: 20px;
		margin-right: 40px;
	}
}

@media (max-width: 1023px) and (min-width: 961px) {
	
		#footer .hidden { display: none; }
}

@media (max-width: 960px) {
	#features .col-1-3 {
		padding-top: 70px;
	}
	#feature-set-1 .device {
		border-top-left-radius: 40px;
		border-top-right-radius: 40px;
	}
	#feature-set-2 .device {
		border-top-left-radius: 40px;
		border-top-right-radius: 40px;
	}
	#footer {
		padding: 20px 0 0 0;
		text-align: center;
	}
	#footer .col-3-4, #footer .col-1-4 {
		float: none;
		width: 100%;
	}
	#footer .logo-sm {
		float: none;
		margin: 0;
		width: 20%;
		height: auto;
	}
	#footer ul {
		padding-top: 10px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		margin: 10px auto 16px auto;
		text-align: center;
	}
		#footer ul:after {
			content: "";
    	display: table;
    	clear: both;
		}
		#footer ul li {
			display: inline-block;
			float: none;
			margin: 0 10px 5px 10px;
		}
		#footer .right { text-align: center; }
		#footer .social { margin-top: 10px; }
}

@media (max-width: 768px) {
	.intro .badges img {
		width: 70%;
	}

	#feature-set-1 img.fast { height: 90px; width: auto; }
	#feature-set-1 img.offline { height: 40px; width: auto; margin: 25px 0; }
	#feature-set-2 img.algorithm { height: 90px; width: auto; }
	#feature-set-2 img.push { height: 40px; width: auto; margin: 20px 0; }

	#feature-set-3 img { height: 70px; width: auto; }
	#feature-set-3 img.downloads { height: 40px; width: auto; margin: 15px 0; }
	#feature-set-3 .badges img { 
		width: 40%; height: auto; margin: 20px 6px 0 6px; 
	}
}

@media (max-width: 767px) {
	[class*='col-'] { 
  	float: none;
  	width: 100%;
  	padding-left: 20px; 
  	padding-right: 20px;
	}

	.offset-2-3,
	.offset-1-3,
	.offset-1-2,
	.offset-1-4,
	.offset-1-8 { margin-left: 0; }

	body {
		font-size: 15px;
  	line-height: 20px;
	}

	.member {
		margin-left: 10px;
		margin-right: 20px;
	}

	#header { 
		background: url(../resource/bg-header-mobile2.jpg) -40px -20px no-repeat;
		background-size: 110%;
		height: 820px;
	}
		#header .col-1-2 {
			width: 50%;
			margin-left: 20px;
		}
		#header .intro { 
			padding-top: 30px; 
			text-align: center;
		}
		#header .intro p {
			font-size: 16px;
			line-height: 20px;
			padding: 0;
		}
		#header .intro p.social {
			margin-top: none;
		}
		#header .logo { 
			width: 300px;
			height: auto;
			margin: 0;
		}
		#language {
			left:  2px;
			top: 2px;
		}
		.intro .badges {
			margin-top: 20px;
			margin-bottom: 6px;
	}	
		.intro .badges img { 
		width: 60%; margin: 0 6px 8px 6px; 
	}


	#features h3 { margin-top: 20px; }
	#features .col-1-3 {
		padding-top: 0px;
		margin-top: 50px;
	}
	#features .col-1-3 p {
		max-width: 460px;
		margin: auto;
	}

	#feature-set-1 {
		padding: 60px 0 0 0;
		margin: 0;
	}

		#feature-set-1 img.fast { height: 80px; width: auto; }
		#feature-set-1 img.offline { height: 50px; width: auto; margin: 0; }

		#feature-set-1 .col-1-3.device {
			padding-top: 0px;
		}
		#feature-set-1 .device {
			border-top-left-radius: 60px;
			border-top-right-radius: 60px;
		}
			#feature-set-1 .device h3 { 
				margin-bottom: 12px; 
				margin-top: -10px;
			}
			#feature-set-1 .device h3 em {
				font-style: normal; 
				padding: 0 20px; 
			}
			#feature-set-1 .device img { width: 92%; margin-bottom: -7px; }

	#feature-set-2 img.push { height: 80px; width: auto; margin: 0; }

	#feature-set-3 img { height: 90px; width: auto; }
	#feature-set-3 img.downloads { height: 50px; width: auto; margin: 0px 0; }
	#feature-set-3 .badges img { 
		width: 40%; height: auto; margin: 20px 6px 0 6px; 
	}

	#feature-set-2 .device, #feature-set-1 .device {
		border-top-left-radius: 40px;
		border-top-right-radius: 40px;
		width: 66%;
		margin-left: 16%;
	}

	#feature-set-2 .device p, #feature-set-1 .device p {
		padding: 0px 10px;
	}

	#feature-set-1 .device img, #feature-set-2 .device img { width: 100%; margin-bottom: -7px; }

	.hidden-phone { display: none; }
	.show-phone { display: inherit; }

}

@media (max-width: 475px) {
	#header { 
		background: url(../resource/bg-header-mobile3.jpg) 65% no-repeat;
		background-size: 130%;
		height: 580px;
	}
		#header .col-1-2 {
			width: 100%;
			margin: 0;
		}
		#header .intro { 
			padding-top: 30px; 
			text-align: center;
		}
		#header .intro p {
			font-size: 16px;
			line-height: 20px;
			padding: 0;
		}
		#header .logo { 
			width: 200px;
			height: auto;
			margin: 0;
		}
		.intro .badges img { 
		width: 43%; margin: 0 6px 0 6px; 
	}
	
	.member {
		margin-left: 0px;
		margin-right: 0px;
	}

	#feature-set-2 .device, #feature-set-1 .device {
		border-top-left-radius: 40px;
		border-top-right-radius: 40px;
		width: 96%;
		margin-left: 2%;
	}

	#feature-set-3 .badges img { 
		width: 80%; height: auto; margin: 20px 6px 0 6px; 
	}

	#footer {
		padding: 20px 0 0 0;
		text-align: center;
	}
	#footer .logo-sm {
		float: none;
		margin: 0;
		width: 40%;
		height: auto;
	}
	#footer ul {
		padding-top: 10px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		margin: 10px 0 16px 0;
		-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	}
		#footer ul:after {
			content: "";
    	display: table;
    	clear: both;
		}
		#footer ul li {
			width: 100%;
			text-align: left;
			margin-bottom: 5px;
		}

}