@charset "utf-8";
body{background:#fff;color:#555;font:normal 15px "Microsoft YaHei", "微软雅黑", "Roboto",arial, sans-serif,"SimSun", "宋体";font-weight:300;overflow-x:hidden;}.small-border{display:block;width:150px;margin:0 auto;height:1px;background:#ececec;}::selection{background:#b2daeb;color:#fff;}::-moz-selection{background:#b2daeb;color:#fff;}p{color:#666;line-height:1.8em;margin:0 0 20px;}em{font-style:italic;}strong{font-weight:400;}h1,h2,h3,h4,h5,h6{color:#666;font-style:normal;font-weight:100;line-height:1.17em;margin:0 0 20px;}h2{font-size:2.5em;}h1{font-size:3.5em;margin-top:80px;}h3{font-size:1.4666666666666667em;font-weight:300;}h4{font-size:1em;font-weight:400;}h5{font-size:1em;font-weight:300;}h6{font-size:0.8em;text-transform:uppercase;font-weight:300;}.sub-heading{margin-bottom:40px;}.notification.columns{display:none;position:relative;width:100%;margin-bottom:20px;padding:10px 18px;text-align:left;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}.notification p{float:left;padding:0;margin:0;}.notification.success{border:1px solid #b3dc82;}.notification.success p{color:#5f9025;}.notification.error{border:1px solid #fbc4c4;}.notification.error p{color:#de5959;}.notification .close{float:right;text-indent:-999em;width:9px;height:9px;margin-top:10px;}.notification.success .close{background:url(../images/close-success.png) no-repeat;}.notification.error .close{background:url(../images/close-error.png) no-repeat;}a{color:#3498d9;cursor:pointer;text-decoration:none;-moz-transition:color .2s;-o-transition:color .2s;-webkit-transition:color .2s;transition:color .2s;}a:hover{color:#555;}a.button{display:inline-block;font-size:1.4666666666666667em;}a.button i{display:inline-block;margin-left:10px;width:30px;height:30px;margin-bottom:-8px;}a.button.small{font-size:12px;font-weight:400;}a.button.small i{margin-left:5px;width:15px;height:15px;margin-bottom:-4px;}a.button i.go{background:url('../images/go.png') no-repeat top center;}a.button i.go.small{background:url('../images/go-small.png') no-repeat top center;}a.button i.grid{background:url('../images/gallery.png') no-repeat top center;}a.button i.more{background:url('../images/more2.png') no-repeat top center;}a.button i.top{background:url('../images/top.png') no-repeat top center;}a.button:hover i,a.button.small:hover i{background-position:bottom;}header{position:fixed;top:0;left:0;z-index:300;width:100%;background:rgb(255,255,255);background:rgba(255,255,255,.9);min-height:80px;line-height:80px;box-shadow:0 0 4px rgba(0,0,0,.2);}html.ie header{border-bottom:1px solid #aeaeea;}nav ul{float:right;}nav ul li{float:left;margin-right:40px;}nav ul li:last-of-type{margin-right:0px;}nav ul li a{color:#aeaeae;}nav ul li a:hover,nav ul li a.current{color:#3498d9;}#mobile-nav{display:none;width:100%;background:rgba(198,198,198,.9);position:absolute;z-index:999;top:0;}#mobile-nav .navigationButton img{margin:15px 0px;}#mobile-nav .navigationButton img:hover{cursor:pointer;}#mobile-nav .navigationContent a{display:block;color:#fff;padding:15px 0px;border-bottom:1px solid #bebebe;}#mobile-nav .navigationContent li:last-child a{border-bottom:1px solid transparent;}#mobile-nav .navigationContent a:hover{color:#a1a1a1;}.hero{margin-top:35px;background:url('../images/hero-hardware.jpg') no-repeat top right;}.action{background:#fff;background:-webkit-linear-gradient(top,rgba(255,255,255,.8) 0%,rgba(255,255,255,1) 45%);background:-moz-linear-gradient(top,rgba(255,255,255,.8) 0%,rgba(255,255,255,1) 45%);background:linear-gradient(top,rgba(255,255,255,.8) 0%,rgba(255,255,255,1) 45%);margin-top:220px;padding-top:40px;padding-bottom:40px;text-align:center;border-bottom:1px solid #ececec;}.action li{display:inline-block;margin-right:50px;}.action li:last-of-type{margin-right:0px;}.overview{text-align:center;padding-top:40px;padding-bottom:40px;border-bottom:1px solid #ececec;}.content-box img{margin-bottom:20px;}.static{position:relative;overflow:hidden;padding-top:140px;height:455px;border-bottom:1px solid #ececec;}.sidephone-big,.sidephone-small{position:absolute;bottom:0;left:185px;}.static-list li{float:left;margin-right:15px;}.static-list li:last-of-type{margin-right:0px;}.static-phone{position:absolute;bottom:-293px;right:230px;}.static-tablet{position:absolute;bottom:0;right:0;}.detail{text-align:center;padding-top:40px;position:relative;min-height:623px;overflow:hidden;border-bottom:1px solid #ececec;}.detail .sub-heading{margin-bottom:0px;}html.ie .loupe{display:none;}.loupe-gallery{position:absolute;z-index:200;margin:80px 0 0 191px;*margin-left:103px;}.loupe-gallery .loupe-container,.loupe-gallery .loupe-container.degraded{display:none;}.loupe-gallery .loupe-container.active{display:block;}.loupe-gallery .loupe{-webkit-transform:translate(900px,0);-moz-transform:translate(900px,0);-ms-transform:translate(900px,0);transform:translate(900px,0);}@-webkit-keyframes touchBobble {
0%   { -webkit-transform:scale(1.04); }
100%  { -webkit-transform:scale(1); }
}

.loupe-container { position:relative; z-index:200; }
.loupe { position:absolute; z-index:150; top:55px; width:265px; height:265px; visibility:hidden; cursor:move; cursor:-webkit-grab; cursor:-moz-grab; cursor:grabbing; }
.loupe.grabbing { cursor:none; *cursor:move; }
.loupe .loupe-image { position:absolute; top:0; left:0; z-index:3; }
.loupe .canvas-fade { position:absolute; display:inline-block; border-radius:100px; top:24px; left:23px; -webkit-transition:opacity 0.4s; -moz-transition:opacity 0.4s; transition:opacity 0.4s; z-index:1; }
.loupe .tooltip { 
	display:none; z-index:2; position:absolute; top:110px; left:50%; margin-left:-84px; width:145px; padding:10px 0 9px; border-radius:25px; color:#fff; text-align:center; opacity:0;
	background:rgb(32,32,32);
	background:rgba(32,32,32,0.7);
	-webkit-transition:opacity 0.6s ease;
	   -moz-transition:opacity 0.7s ease;
	        transition:opacity 0.7s ease;
}
.loupe .canvas { display:inline-block; border-radius:100px; margin:18px 0 0 -18px; *position:relative; *top:18px;
	-ms-filter:'progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=90,  FinishX=100, StartY=75, FinishY=85), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=77,  FinishX=87, StartY=10, FinishY=0), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=10,  FinishX=0, StartY=75, FinishY=85), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=20,  FinishX=10, StartY=10, FinishY=0)';
	*filter:progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=90,  FinishX=100, StartY=75, FinishY=85)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=77,  FinishX=87, StartY=10, FinishY=0)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=10,  FinishX=0, StartY=75, FinishY=85)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=20,  FinishX=10, StartY=10, FinishY=0);
}

.loupe-still { position: absolute; z-index: 100; left: 50%; margin-left: -470px; top: -30px; }


/* =Gallery
-------------------------------------------------------------- */

.gallery {
	text-align: center;
	padding-top: 40px;
	position: relative;
}

.bx-wrapper {
	background: url(../images/hardware.jpg) no-repeat top center;
	padding-top: 85px;
	border-bottom: 1px solid #ececec;
}

#gallery-pager {
	padding-top: 20px;
	padding-bottom: 20px;
}

.bx-pager-item { display: inline-block; }
.bx-pager-link {
	display: inline-block;
	text-indent: -999em; 
	width: 12px; 
	height: 12px;
	margin: 0 5px;
	background: url(../images/pager.png) no-repeat top center;
}

.bx-pager-link.active { background: url(../images/pager-active.png) no-repeat top center; }
.bx-pager-link:hover { background-position: bottom; }

.bx-next, .bx-prev {
	position: absolute;
	display: block;
	text-indent: -999em;
	top: 55%;
	width: 30px;
	height: 73px;
}

.bx-next {
	right: 0;
	margin-right: -80px;
	background: url(../images/next.png) no-repeat top right;
}

.bx-prev {
	left: 0;
	margin-left: -80px;
	background: url(../images/prev.png) no-repeat top right;
}

.bx-prev:hover, .bx-next:hover { background-position: bottom; }


/* =Subscribe
-------------------------------------------------------------- */

.subscribe {
	text-align: center;
	padding-top: 20px;
	padding-bottom: 40px;
}

.subscribe .sub-heading {
	margin-bottom: 20px;
}

.subscribe input.text {
	display: inline-block;
	outline: none;
	-webkit-appearance: none;
	width: 340px;
	padding: 15px 0px 15px 15px;
	background: white;
	border: 1px solid #d4d4d4;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font: 12px "Roboto";
	color: #3498d9;
	margin-bottom: 20px;
}

.subscribe input.submit {
	border: none;
	display: inline-block;
	outline: none;
	cursor: pointer;
	background: transparent url(../images/more.png) no-repeat top right;
	-webkit-font-smoothing: antialiased;
	text-rendering: geometricPrecision;
	text-decoration: none;
	-webkit-appearance: none;
	font: 22px "Roboto";
	font-weight: 300;
	color: #3498d9;
	margin-left: 10px;
	padding-right: 40px;
	-moz-transition:color .2s;
	-o-transition:color .2s;
	-webkit-transition:color .2s;
	transition:color .2s;
}

.subscribe input.text::-ms-clear {
    display: none;
}

.subscribe input.submit:hover {
	color: #555;
	background-position: bottom right;
}

.social-list { padding-top: 20px; }
.social-list li { 
	display: inline-block;
	margin-right: 10px;
}
.social-list li:last-of-type {
	margin-right: 0px;
}

.social-list a {
	-webkit-transition: all 0.33s;
	-moz-transition: all 0.33s;
	-o-transition: all 0.33s;
	-ms-transition: all 0.33s;
	transition: all 0.33s;
}

.social-list a:hover {
	opacity: 0.4;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; /* IE 8 */
    filter: alpha(opacity=40);
	-webkit-transition: all 0.33s;
	-moz-transition: all 0.33s;
	-o-transition: all 0.33s;
	-ms-transition: all 0.33s;
	transition: all 0.33s;
}


/* =Footer
-------------------------------------------------------------- */
	
footer {
	width: 100%;
	background: #f9f9f9;
	border-top: 1px solid #ececec;
	padding: 40px 0px 20px;
	text-align: center;
}

.footer-action { padding-bottom: 15px; }
.footer-action li { display: inline-block; margin-right: 15px; }
.footer-action li:last-of-type { margin-right: 0px; }

.copyright { font-size: 12px; font-weight: 400; color: #aeaeae; }



/* =Switcher
-------------------------------------------------------------- */

/* =Responsive
-------------------------------------------------------------- */

/* Tablet Landscape */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
	body { margin: 0; padding: 0!important; }
	.bx-prev, .bx-next { display: none!important; }
}

/* Smaller than 960px */
@media only screen and (max-width: 959px) {
	h1 { margin-top: 0px; font-size: 3em; }
	h2 { font-size: 2.5em; }
	#mobile-nav { display: block; }
	header { position: static; margin-top: 47px; }
	#navigation {  display: none; }
	#logo {  width: 100%; text-align: center; }
	.bx-prev, .bx-next { display: none!important; }

	#style-switch { display: none; }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.hero { background-size: 100%; }
	.static { padding-top: 70px; height: 400px; }
	.sidephone-small { width: 200px; left: 12px; padding-bottom: 10px;}
	.sidephone-big { width: 200px; left: 130px; }
	.static-phone { width: 150px; bottom: 0px; right: 200px; }
	.static-tablet { width: 300px; }
	.detail { min-height: 542px; }
	.loupe { display: none; }
	.loupe-gallery { margin-left: 100px; }
	.gallery-content { width: 80%; height: auto; }
	.loupe-still { width: 120%; height: auto; top: -20px; margin-left: -330px;}
	.screenshot img { width: 186px; }
	.gallery-bxslider li .screenshot:first-of-type img { float: left; margin-left: 20px; }
	.gallery-bxslider li .screenshot:last-of-type img { float: left; margin-left: 30px; }
	.bx-wrapper { background-size: 100%; background-position: bottom center; }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	.bx-wrapper {
		background: url(../images/hardware-mobile.jpg) no-repeat top center;
		padding-top: 85px;
		border-bottom: 1px solid #ececec;
	}
	.screenshot { margin-bottom: 120px; }
	.screenshot:last-child { margin-bottom: 0px; }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.hero { background-size: 100%; background-position: center 70px; } 
	.action li { margin-right: 15px; }
	.static { min-height: 730px; padding-top: 40px; }
	.sidephone-small { left: 12px; }
	.static-phone { bottom: 0px; }
	.detail { min-height: 480px; }
	.loupe { display: none; }
	.loupe-gallery { margin-left: 70px; margin-top: 50px; }
	.gallery-content { width: 300px; height: auto; }
	.loupe-still { width: 490px; height: auto; top: -15px; margin-left: -249px; }

}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	.hero { background-size: 110%; background-position: center 100px; }
	.action { margin-top: 140px; } 	
	.action li { margin-right: 0px; margin-bottom: 20px; }
	.action li:last-of-type { margin-bottom: 0px; }
	.static { min-height: 660px; padding-top: 40px; }
	.sidephone-small { width: 170px; left: 12px; }
	.sidephone-big { width: 170px; left: 130px; }
	.static-phone { width: 130px; bottom: 0px; right: 150px; }
	.static-tablet { width: 260px; }
	.detail { min-height: 496px; }
	.loupe { display: none; }
	.loupe-gallery { margin-left: 40px; margin-top: 50px; }
	.gallery-content { width: 220px; height: auto; }
	.loupe-still { width: 360px; height: auto; top: -10px; margin-left: -179px; }
	.subscribe input.text { width: 300px; }


}
