.wrap {
	width: 700px;
	margin: 0 auto;
}

.wrap p {
	padding-bottom: 20px;
}

.adaptoz {
	width: 700px;
	margin: 0 auto;
	min-height: 100%;
	position: relative;
	1margin-top: 50px;
	padding-top: 50px;
	margin-bottom: 150px;
	1background: green;
}

.adaptoz .ad_nav {
	position: absolute;
	width: 700px;
	height: 50px;
	text-align: center;
	margin-top: -50px;
	z-index: 50;
	background: #fff;
}

.adaptoz .ad_nav:after {
	position: absolute;
	background: transparent url('../i/nav_shad.png') 0 0 no-repeat;
	width: 700px;
	height: 18px;
	display: block;
	content: "";
	bottom: -18px;
	opacity: 0.5;
	filter:alpha(opacity=50);
}

.adaptoz .ad_nav a {
	display: inline-block;
	text-align: center;
	margin: 0 50px;
	height: 40px;
	line-height: 40px;
	padding: 0 10px;
	color: #000;
	margin-top: 5px;
	vertical-align: top;
	text-decoration: none;
	position: relative;
	z-index: 10;
	font-size: 12px;
	11background: #f1f1f1;
}

.adaptoz .ad_nav a span,
#text .adaptoz .ad_nav a span {
	display: -moz-inline-stack;	display: inline-block; *display: inline;
	vertical-align: middle;
	line-height: 1;
	color: #666;
	border-bottom: 1px dashed #666;
}

.adaptoz .ad_nav a:hover,
#text .adaptoz .ad_nav a:hover {
	opacity: .7;
	filter:alpha(opacity=70);
	background: transparent;
}

.adaptoz .ad_nav a:hover span,
#text .adaptoz .ad_nav a:hover span {
	color: #00858b;
	border-bottom-color: #00858b;
}

.adaptoz .ad_nav a.active,
#text .adaptoz .ad_nav a.active {
	color: #fff;
	cursor: default;
	opacity: 1;
	filter:alpha(opacity=100);
	-moz-transition: color 0.2s;
	-webkit-transition: color 0.2s;
	-o-transition: color 0.2s;
	-ms-transition: color 0.2s;
	transition: color 0.2s;
}

.adaptoz .ad_nav a.active span,
#text .adaptoz .ad_nav a.active span {
	color: #fff;
	border-bottom-color: #fff;
}

.adaptoz .ad_nav a i {
	display: -moz-inline-stack;	display: inline-block; *display: inline;
	vertical-align: middle;
	height: 40px;
	width: 40px;
	margin-right: 5px;
	opacity: 0.7;
	filter:alpha(opacity=70);
}

.adaptoz .ad_nav a:hover  i,
.adaptoz .ad_nav a.active i  {
	opacity: 1;
	filter:alpha(opacity=100);
}

#desktop_link i {background: transparent url('../i/icons.png') 0 0 no-repeat; width: 32px;}
#ipad_link i    {background: transparent url('../i/icons.png') 0 -80px no-repeat; width: 26px;}
#iphone_link i  {background: transparent url('../i/icons.png') 0 -160px no-repeat; width: 18px;}

#desktop_link:hover i {background: transparent url('../i/icons.png') -40px 0 no-repeat;}
#ipad_link:hover i    {background: transparent url('../i/icons.png') -40px -80px no-repeat;}
#iphone_link:hover i  {background: transparent url('../i/icons.png') -40px -160px no-repeat;}

#desktop_link.active i {background: transparent url('../i/icons.png') 0 -40px no-repeat;}
#ipad_link.active i    {background: transparent url('../i/icons.png') 0 -120px no-repeat;}
#iphone_link.active i  {background: transparent url('../i/icons.png') 0 -200px no-repeat;}

#active_bar {
	margin-left: 50px;
	width: 10px;
	height: 40px;
	background: #06afb6;
	color: #fff;
	cursor: default;
	position: absolute;
	left: 0;
	top: 5px;
	display: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	-moz-transition: left 0.1s linear;
	-webkit-transition: left 0.1s linear;
	-o-transition: left 0.1s linear;
	-ms-transition: left 0.1s linear;
	transition: left 0.1s linear;
}

.adaptoz .ad_nav.fixed {
	position: fixed;
	top: 0;
	margin-top: 0;
}

.adaptoz .ad_nav.bottom {
	top: auto;
	margin-top: 0;
	bottom: 0;
}


.adaptoz .case  {
	position: relative;
}

.adaptoz .case img {
	-webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 070px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 7px rgba(0, 0, 0, 0.5);
	--webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}



.adaptoz .case.monitor {
	margin-bottom: 170px;
}

.adaptoz .case.monitor img {
	margin-left: 28px;
	margin-top: 37px;
}

.adaptoz .monitor .device {
	width: 700px;
	height: 550px;
	background: transparent url('../i/monitor.png') 0 0 no-repeat;
	position: absolute;
	top: 0;
}

.adaptoz .monitor .device.fade {
	background-image: url('../i/monitor-fade.png');
}



.adaptoz .case.ipad {
	width: 650px;
	margin: 0 auto;
	margin-bottom: 80px;
}

.adaptoz .case.ipad img {
	margin-left: 59px;
	margin-top: 61px;
	width: 530px;
}

.adaptoz .ipad .device {
	width: 650px;
	height: 512px;
	background: transparent url('../i/ipad.png') 0 0 no-repeat;
	position: absolute;
	top: 0;
}



.adaptoz .case.iphone {
	width: 309px;
	margin: 0 auto;
}

.adaptoz .case.iphone img {
	margin-left: 26px;
	margin-top: 120px;
	width: 260px;
}

.adaptoz .iphone .device {
	width: 309px;
	height: 630px;
	background: transparent url('../i/iphone4-260.png') 0 0 no-repeat;
	position: absolute;
	top: 0;
}

.adaptoz .iphone .device.fade {
	background: transparent url('../i/iphone4-260-fade.png') 0 0 no-repeat;
}


.adaptoz .device.fade:after {
	position: absolute;
	display: block;
	content:" ";
	width: 100%;
	height: 0;
	font-size: 0;
	line-height: 0;
	top: 100%;
	left: 0;
	background: #fff;
	opacity: 0;
	filter:alpha(opacity=0);
	opacity: 1;
	filter:alpha(opacity=100);
	height: 300px;
}

.adaptoz .iphone .device.fade:after {
	display: none;
}

.adaptoz .device.bottom {
	top: auto;
}

.adaptoz .monitor .device.bottom {
	
	bottom: -143px;
}

.adaptoz .ipad .device.bottom {
	bottom: -50px;
}

.adaptoz .iphone .device.bottom {
	bottom: -115px;
}





.hr {
	position: relative;
	border-bottom: 1px dashed #ccc;
	margin: 0 0 30px;
	margin-right: -150px;
	margin-left: -150px;
}

.hr i  {
	display: block;
	position: relative;
	background: #fff url('../i/scissor.png') 0 0 no-repeat;
	width: 30px;
	height: 29px;
	top: 15px;
}

@media only screen and (max-width: 1350px) {
	.hr {
	margin-right: -15px;
	margin-left: -150px;
}
}