/*2021-6-28 new overview*/

.top-banner-container img {
	max-width: 1920px;
	display: block;
	margin: 0 auto;
}

.top-banner-container {
	height: auto;
}

.top-banner-text .h-style-1 {
	padding: 0 0 20px 0;
	line-height: 1.2em;
	font-size: 46px;
}

.top-banner-text p {
	font-size: 22px;
}

.overview-w h1,
.section h2, .section-title h2 {
	font-size: 36px;
	line-height:1.6em;
}

.overview-w {
	max-width: 1240px;
	position: relative;
	margin: 0 auto;
	width: 100%;
}


.overview-w a:link {
	color: #0066cc;
	text-decoration: none;
	outline: none
}

.overview-w a:visited {
	text-decoration: none;
	color: #0066cc;
	outline: none
}

.leftmenu_title a:link, .leftmenu ul li span a:link {
color: #333333;	
}

.leftmenu_title a:visited, .leftmenu ul li span a:visited{
	color: #333333;
}


.overview-w a:hover, .leftmenu_title a:hover, .leftmenu ul li span a:hover {
	color: #0066cc;
	text-decoration: underline;
	outline: none
}

.icon-bg a:link, .icon-bg a:visited, .next-step-container a:link, .next-step-container a:visited {
	color: #333333;
}

.container-text-w {
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	position: absolute;
	left: 50%;
	z-index: 3;
}

.top-banner-w {
	width: 100%;
	vertical-align: middle;
	display: table-cell;
	text-align: left;
	z-index: 3;
	color: #fff;
	max-width: 70%;
	overflow: hidden;
}

.top-banner-w .h-style-1 {
	padding: 0 0 26px 0;
	line-height: 1.2em;
	font-size: 46px;
	color: #333333;
}

.button-face-green-w {
	background: #3bac45;
	border-color: #3bac45;
}

.button-face-green-w:hover {
	background: #00923c;
	border-color: #00923c;
}

.inside-nav .navbar-nav>li {
	padding-right: 55px;
}

h1,
h2,
h3,
h4 {
	font-weight: 700;
}

.inside-nav .navbar-default .navbar-nav>.active>a,
.inside-nav .navbar-default .navbar-nav>.active>a:focus,
.inside-nav .navbar-default .navbar-nav>.active>a:hover {
	box-shadow: 0px 2px 0px #0a923c;
	color: #333333;
}

.inside-nav .navbar-default .navbar-nav a:focus,
.inside-nav .navbar-default .navbar-nav a:hover {
	box-shadow: 0px 2px 0px #0a923c;
	background: none;
	color: #58585b !important;
	font-size: 18px;
}

p {
	font-size: 16px;
	line-height:1.6em!important;
}

.overview-flex,
.flex-box-1-img {
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	margin: 0 auto;
}

.overview-flex>div {
	flex: 1;
	padding: 55px 0;
	border-radius: 10px;
	box-shadow: 0 0 10px #cccccc;
	margin: 20px;
	position: relative;
	text-align: center;
	overflow: hidden;
	cursor: pointer;
}

.overview-flex>div h3 {
	margin: 0;
	padding: 20px 0 0 0;
	background: #ffffff;
	color: #0a923c;
	font-weight: normal;
	font-size: 20px;
}

.overview-flex>div p {
	font-size: 0;
	display: none;
}

.overview-flex>div:hover {
	background: #ffffff;
	box-shadow: 0 0 10px #a6e5bd;
}

.overview-flex>div:hover img.original {
	opacity: 0;
	width: 0;
	height: 0;
}

.overview-flex>div:hover {
	padding: 20px 0;
}

.overview-flex>div:hover h3 {
	font-size: 0;
	display: none;
}

.overview-flex>div:hover p {
	font-size: 16px;
	padding: 0 30px;
	color: #333333;
	text-align: left;
	display: block;
}

.flex-box-1-img-item {
	position: relative;
	margin: 25px;
	margin-bottom: 20px;
	overflow: hidden;
	flex: 1;
	text-align: center;
}

.flex-box-1-img-item-yuan {
    margin: 0 40px;
    border: 6px dotted #ff5d2d;
    border-radius: 663px;
    padding: 25px 0;
}

.flex-box-1-img-item-yuan:nth-child(2) {
    border: 6px dotted #fbae3e;
}

.flex-box-1-img-item-yuan:nth-child(3) {
    border: 6px dotted #87c700;
}
.flex-box-1-img-item-yuan:nth-child(4) {
    border: 6px dotted #01b399;
}

.flex-box-1-text {
	padding: 20px 15px;
	text-align: center;
}

.flex-box-1-img-item-border {
	border: 1px solid #cecfd0;
}

.flex-box-1-img-item-border-left {
	border-left: 2px solid #868686;
	height: 150px;
	margin-top: 50px;
}

.font26 {
	font-size: 26px!important;
}

.tableul .item-li {
	font-size: 24px;
	font-style: italic;
	color: #0066cc;
	font-weight: bold;
	line-height: 1.6em;
}

.boxbg {
	background: url(/gsimages/pro/ht-us-facility-bg2.jpg) top center no-repeat;
	padding: 30px 0;
	min-height: 524px;
	position: relative;
}

.boxbg2,
.customer-pst {
	background: rgba(66, 91, 132, 0.8);
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: 100%;
}

.customer-pst {
	background: transparent;
}

.boxw {
	padding: 82px 15px;
}

h2.font32 {
	font-size: 32px;
}

.button-face-box-w {
	border: 1px solid #3bac45;
	text-shadow: none;
	color: #3bac45 !important;
	background: transparent;
}

.button-face-box-w:hover {
	background-color: #3bac45;
	color: #ffffff!important;
	text-decoration: none!important;
	border-color: #3bac45;
}

.flex-box-1-img1 img {
	width: 100%;
}


/*customer start*/

.cutomer-bg {
	background: url(/gsimages/mb/mb-customer-bg.jpg) top center no-repeat;
	min-height: 435px;
	position: relative;
}

.banner {
	width: 1000px;
	height: 258px;
	margin: 0;
	position: relative;
	overflow: hidden;
}

.banner .img {
	width: 4000px;
	height: 220px;
	position: absolute;
	left: 0px;
	top: 0px;
}

.banner .img li {
	width: 1000px;
	height: 190px;
}

.banner .img li {
	float: left;
}

.banner .img li .flex-customer-item {
	width: 576px;
	height: 190px;
	margin-right: 0;
	margin: 0 10px;
}

.flex-customer-item {
	width: 48%;
	padding: 0;
	background: #ffffff;
	margin-right: 4%;
	position: relative;
	padding-bottom: 35px;
}

.flex-customer-item {
	width: 48%;
	padding: 0;
	background: transparent;
	margin-right: 4%;
	position: relative;
}

.banner .num {
	position: absolute;
	width: 100%;
	bottom: 2px;
	left: 0px;
	text-align: center;
	font-size: 0px;
}

.banner .num li {
	width: 10px;
	height: 10px;
	background-color: none;
	border-radius: 50%;
	display: inline-block;
	margin: 0px 3px;
	cursor: pointer;
	border: 1px solid #ffffff;
}

.banner .num li.on {
	background-color: #ffffff;
}

.banner .img li .flex-customer-item:first-child {
	width: 382px;
}

.banner h3 {
	font-size: 24px;
	margin-top: 0;
	margin-bottom: 0px;
}


/*customer start*/


/*bottom contact*/

.next-step-container ul li span.icon-shubiao1 {
	background: url(/gsimages/mb/phone-new.png) center -39px no-repeat transparent;
}

.next-step-container ul li span.icon-phone1 {
	background: url(/gsimages/mb/phone-new.png) center 0 no-repeat transparent;
}

.next-step-container ul li span.icon-online1 {
	background: url(/gsimages/mb/phone-new.png) center -76px no-repeat transparent;
}

.next-step-container ul li span.icon-fax1 {
	background: url(/gsimages/mb/phone-new.png) left -114px no-repeat transparent;
}

.next-step-container ul li span {
	display: inline-block;
	width: 42px;
	height: 40px;
	vertical-align: middle !important;
}

.next-step-container ul li {
	margin: 0 5px;
	font-size: 16px;
}


/*bottom contact*/


/**21-0812 gene new page start**/

.flex-1-item div h3 {
	font-weight: normal;
}

.flex-1-item p {
	font-size: 14px;
}

.flex-1-item div {
	float: left;
	width: 90%;
}

.tableul li {
	line-height: 1.6em;
}

.button-face-white {
	background: #fff;
	color: #333333 !important;
	text-shadow: none;
}

.button-face-white:hover {
	background: none;
	border: 1px solid #fff;
}

.accordion-group .accordion-heading {
	border-radius: 4px;
	background: #ffffff;
}

.flex-item:hover {
	background: #f1f1f1;
}

.flex-item p a,
.flex-item p a:link,
.flex-item p a:visited {
	color: #58585b;
}

.flex-item p a:hover {
	color: #0066cc;
}

.cl-0066cc {
	color: #0066cc;
}

.cl-0066cc:hover {
	text-decoration: underline;
}

.cl-01a79d {
	color: #01a79d;
}

.cl-8bc731 {
	color: #8bc731;
}

.cl-f8ac00 {
	color: #f8ac00;
}

iframe {
	width: 675px;
	height: 370px;
}
.iframe-size-sub {
	width: 555px;
    height: 335px;
}
.free-flex {
	display: flex;
}
.promotions-content {
	position: relative;
}

.promotions-content>div {
	display: inline-block;
	width: calc(100% - 365px);
	vertical-align: top;
}

.promotions-content img {
	width: auto;
}

.feature {
	position: relative;
	display: flex;
	flex-flow: wrap;
}

.feature-item {
	width: 33.3%;
	position: relative;
	text-align: center;
}

.feature-item>div {
	width: 208px;
	position: relative;
	margin: 0 auto;
	height: 248px;
	box-sizing: border-box;
	padding: 40px 10px;
	background-repeat: no-repeat;
}

.feature-item:nth-child(2n+1)>div {
	background-image: url(/gsimages/mb/hexagon-bg1.svg);
}

.feature-item:nth-child(2n+1):hover>div {
	background-image: url(/gsimages/mb/hexagon-bg2.svg);
}

.feature-item:nth-child(2n+1):hover>div p {
	color: #12a242;
}

.feature-item:nth-child(2n)>div {
	background-image: url(/gsimages/mb/hexagon-bg2.svg);
}

.feature-item:nth-child(2n):hover>div {
	background-image: url(/gsimages/mb/hexagon-bg1.svg);
}

.feature-item:nth-child(2n):hover>div p {
	color: #12a242;
}

.feature-item>div img {
	margin-bottom: 10px;
}


/*new*/

.inside-nav .navbar-nav>li {
	padding-right: 55px;
}

#google_views h2 {
	text-align: left;
	font-size: 24px;
}

.container-text-two {
	position: relative;
	display: flex;
	flex-flow: wrap;
}

.rating-list-item {
	padding-bottom: 10px;
	border-bottom: 1px solid #ddd;
}

.container-text-two-left {
	flex: 1;
}

.container-text-two-right {
	width: 300px;
	position: relative;
	margin-left: 20px;
	display: none;
}

.flex-container {
	position: relative;
	display: flex;
	flex-flow: wrap;
}

.flex-container-item {
	flex: 1;
	box-shadow: 0 0 10px #cccccc;
	padding: 30px;
	margin: 0 20px 20px;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background: #FFFFFF;
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-ms-transform: perspective(1000px);
	-moz-transform: perspective(1000px);
	-ms-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
}

.flex-container-item>div:nth-child(1) {
	text-align: center;
	padding: 25px;
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
}

.flex-container-item>div:nth-child(2) {
	position: absolute;
	width: 100%;
	height: 100%;
	background: #FFFFFF;
	padding: 30px;
	top: 0;
	left: 0;
	border-radius: 10px;
	transition: all 0.5s;
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	transform: rotateY(180deg);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
	opacity: 0;
}

.flex-container-item:hover>div:nth-child(1) {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
	opacity: 0;
}

.flex-container-item:hover>div:nth-child(2) {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

.flex-container-item>div:nth-child(1) h3 {
	margin-bottom: 0;
	font-weight: normal;
	font-size: 20px;
}

.cl-12a242 {
	color: #12a242;
}

.testimonial-box {
	position: relative;
	padding: 30px 50px;
	border: 1px solid #dfdfdf;
	padding-bottom: 130px;
}

.arrow-left,
.arrow-right {
	position: absolute;
	overflow: hidden;
	width: 0;
	height: 0;
	border-width: 20px;
	border-style: solid dashed dashed dashed;
}

.arrow-left {
	left: 0px;
}

.arrow-right {
	right: 0px;
}

.arrow-left-background {
	top: 50%;
	border-color: transparent transparent transparent #dfdfdf;
	transform: translateY(-50%);
}

.arrow-left-border {
	top: 50%;
	border-color: transparent transparent transparent #fff;
	transform: translateY(-50%);
	left: -2px;
}

.testimonial-box>div:nth-child(1) {
	padding: 40px;
	position: relative;
}

.testimonial-box>div:nth-child(1) span {
	position: absolute;
	font-size: 100px;
	color: #15a442;
	line-height: 1em;
	height: 50px;
}

.quotation-marks-left {
	left: 0;
	top: 0;
}

.quotation-marks-right {
	right: 0;
	bottom: 0;
}

.arrow-right-background {
	top: 50%;
	border-color: transparent #dfdfdf transparent transparent;
	transform: translateY(-50%);
}

.arrow-right-border {
	top: 50%;
	border-color: transparent #fff transparent transparent;
	transform: translateY(-50%);
	right: -2px;
}

.testimonial-box>div:nth-child(2) {
	position: absolute;
	right: 50px;
	bottom: 40px;
}

.testimonial-box>div:nth-child(2) img {
	border-radius: 50%;
}

.tools-box {
	position: relative;
	display: flex;
	flex-flow: wrap;
}

.tools-box>div {
	flex: 1;
	position: relative;
	text-align: center;
	cursor: pointer;
}

.tools-box>div>div:nth-child(1) {
	position: relative;
}

.tools-box>div.active .img-mask {
	display: block;
}

.tools-box>div.active h3 {
	color: #0066CC;
}

.tools-box>div.active h3.h3green {
	color: #8fc31f;
}


.tools-box-img {
	width: 120px;
	height: 120px;
	margin: 0 auto;
}

.tools-box-img img {
	max-width: 100%;
}

.img-mask {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	border: 10px solid #0066cc;
	border-radius: 50%;
	display: none;
}

.tools-box-details {
	position: relative;
	padding: 30px 60px;
	border: 1px solid #0066cc;
	display: none;
	border-top-left-radius: 70px;
	border-bottom-right-radius: 70px;
	background: #f9fcfd;
	max-width: 84%;
	margin: 0 auto;
}

.tools-box-details-border {
	border-color: #8fc31f;
	background: #fefffc;
}

.tools-box-details>div {
	display: none;
}

.tools-box-details>div.active {
	display: block;
}

.tools-box-details>div .btn-more {
	text-align: right;
}

.calculation-box {
	position: relative;
	border-radius: 10px;
	box-shadow: 0 0 10px #cccccc;
	display: none;
}

.calculation-box-1 {
	position: relative;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	background: #f9f9f9;
	padding: 40px 30px;
}

.calculation-box-2 {
	position: relative;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	background: #ffffff;
	padding: 40px 30px;
}

.calculation-price {
	position: relative;
	display: flex;
	flex-flow: wrap;
}

.calculation-price-item {
	flex: 1;
	position: relative;
}

.calculation-price-item>div {
	width: 260px;
	margin: 0 auto;
}

.calculation-price-item-ec {
	background: url(/gsimages/mb/gene-synthesis-ecomony-bg.jpg);
	border-bottom: 10px solid #01a79d;
}

.calculation-price-item-fa {
	background: url(/gsimages/mb/gene-synthesis-fast-bg.jpg);
	border-bottom: 10px solid #8bc731;
}

.calculation-price-item-st {
	background: url(/gsimages/mb/gene-synthesis-standard-bg.jpg);
	border-bottom: 10px solid #f8ac00;
}

.price-box {
	width: 100%;
	height: 123px;
	text-align: center;
}

.price-box-title {
	color: #FFFFFF;
	padding-top: 10px;
	font-size: 18px;
}

.price-box-number {
	margin-top: 35px;
	font-size: 26px;
	font-weight: bold;
}

.order-box {
	position: relative;
	background: #f9f9f9;
	padding: 30px;
	text-align: center;
}

.button-face-01a79d {
	background: #01a79d;
	border: 1px solid #01A79D;
}

.button-face-01a79d:hover {
	color: #01a79d !important;
	border: 1px solid #01A79D;
	background: none;
}

.button-face-8bc731 {
	background: #8bc731;
	border: 1px solid #8bc731;
}

.button-face-8bc731:hover {
	color: #8bc731 !important;
	border: 1px solid #8bc731;
	background: none;
}

.button-face-f8ac00 {
	background: #f8ac00;
	border: 1px solid #f8ac00;
}

.button-face-f8ac00:hover {
	color: #f8ac00 !important;
	border: 1px solid #f8ac00;
	background: none;
}

.payment-box {
	position: relative;
	clear: both;
	margin-bottom: 20px;
}

.payment-box img {
	width: 80px;
}

.payment-box div {
	padding-top: 20px;
}

/**menu nav**/
.menu-nav {
		position: relative;
	}
	
	.menu-nav .menu-nav-title {
		height: 60px;
		display: inline-block;
		line-height: 60px;
		font-size: 18px;
		margin-right: 25px;
		cursor: pointer;
		position: relative;
		padding-left: 35px;
		padding-right: 30px;
	}
	
	.menu-nav .menu-nav-title .iconfont {
		position: absolute;
		right: 0;
		transform: rotateX(0deg);
	}
	
	.menu-nav .menu-nav-title .iconfont {
		color: #3333333 !important;
	}
	

	.menu-nav .menu-nav-title .iconfont.active {
		transform: rotateX(180deg);
		margin-top: 20px;
		line-height: 0px;
	}
	
	.menu-nav .menu-nav-title button {
		max-width: 26px;
		line-height: 0em;
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		margin-top: -2px;
	}
	
	.menu-nav .menu-nav-title .icon-bar {
		width: 20px;
		height: 3px;
		display: inline-block;
		background: #333333;
	}
	
	.menu-nav .menu-nav-title.active .icon-bar,
	.menu-nav .menu-nav-title.hover .icon-bar {
		background: #333333;
	}
.menu-nav-content {
		position: absolute;
		top: 100%;
		left: 0;
		width: 300px;
		z-index: 10;
	}
/**menu nav**/
	
	.leftmenu {
		background-color: #ffffff;
		border: 1px solid #e9e9e9;
                padding:30px 25px;
	}
	
	.leftmenu ul li {
		background-color: #ffffff;
		font-size: 16px;
		line-height: 1.25em;
                padding:8px 0;
	}
	
	.leftmenu ul li span.select {
		display: inline-block;
		width: 100%;
		position: relative;
	}
	
	.leftmenu ul li span.select .iconfont {
		position: absolute;
		right: 0;
		top: 0;
                cursor:pointer;
                font-size:16px;
                color:#58585b;
       
	}
	.leftmenu ul li span.select .icon-xiala:before {
                content: "\e794";
                padding:10px 12px;
        }
	.leftmenu ul li span.select .iconfont:hover {
		color: #0066cc;
	}
	
	.leftmenu ul li span.select .iconfont.icon-xiala.active:before {
                 content: "\e795";
         }
	
	.leftmenu ul li ul {
		display: none;
	}
	
	.leftmenu ul li ul.active {
		display: block;
	}
	
	.show-on {
		position: fixed;
		top: 72px;
		width: 100%;
		left: 0;
		z-index: 9000;
		display: none;
	}
	

.leftmenu ul li span.drop1 a {
	color: #0066cc;
}

.drop1 {
	display: inline-block;
	position: relative;
	width: 100%;
	cursor: pointer;
}

.right-promo {
	background: #ffffff;
	border-top: 5px solid #f8ac00;
}
.leftmenu.right-promo ul li {
	background: #ffffff;
}
.auto-module {
	overflow: auto;
}

/*2021-0813 plasmid*/
	.gridtable th.gridtable-thbg1 {
		background: #99d98c;color: #ffffff;width: 20%;border-top-color: #99d98c;border-left-color: #99d98c;
	}
	.gridtable th.gridtable-thbg2 {
		background: #52b69a;color: #ffffff;width: 20%;border-top-color: #52b69a;
	}
	.gridtable th.gridtable-thbg3 {
		background: #168aad;color: #ffffff;width: 20%;border-top-color: #168aad;
	}
    .gridtable th.gridtable-thbg4 {
		background: #1e6091;color: #ffffff;width: 20%;border-top-color: #1e6091;border-right-color: #1e6091;
	}
	.gridtable th.gridtable-thbg1:hover {
		background: #76c893;color: #ffffff;width: 20%;border-top-color: #76c893;border-left-color: #76c893;
	}
	.gridtable th.gridtable-thbg2:hover {
		background: #34a0a4;color: #ffffff;width: 20%;border-top-color: #34a0a4;
	}
	.gridtable th.gridtable-thbg3:hover {
		background: #1a759f;color: #ffffff;width: 20%;border-top-color: #1a759f;
	}
    .gridtable th.gridtable-thbg4:hover {
		background: #184e77;color: #ffffff;width: 20%;border-top-color: #184e77;border-right-color: #184e77;
	}
	
.resource-item {
		position: relative;
		width: 50%;
		margin-bottom: 50px;
		float: left;
		font-weight:normal;
	}
	
	.resource-item img {
		vertical-align: top;
		border: 1px solid #ddd;		
	}
	
	.resource-item-right {
		position: relative;
		display: inline-block;
		width: calc(100% - 225px);
		text-align: left;
		margin-left: 20px;
	}
	
	a i.iconlearn {
		color:#8fc31f!important; 
		cursor: pointer;
	}
	a i.iconlearn:hover {
		color:  #00923c!important;
	}
	a.button {
		margin-top: 25px;
    display: block;
}
	
	.tools-box-img-border img{
		border: 10px solid #c1c1c1;
        border-radius: 50%;
        padding: 14px;
	}
	
	.img-mask-green {
		border-color: #8fc31f;
		}
	.wd-84 {
		max-width: 84%;
		margin: 0 auto;
	}	
		
    .flex-box-1-img-item img {
    transition: all .5s ease-out;
    vertical-align: bottom;
}
        .flex-box-1-img-item:hover>img {
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1)
}
.top-banner-w .cl-balck {
	color: #333333;
}

/*2021-0813 plasmid end*/

/*2021-0827 gensmart start*/

.top-banner-w-center {
	text-align: center;
    display: inline-block;
	}
	.bg-blue-00a1e9 {
		background: #00a1e9;
	}
	.section-pst {
		position:  relative;
		height: 325px;
		overflow: initial;
		
	}
	.bg-height {
		min-height: 642px;
	}
	.tableul li.icon-bg {
		padding-left: 40px;
		background:url(/gsimages/icon/other-popular-tools-icon.png) left 7px no-repeat;
		}
/*2021-0827 gensmart end*/	

@media only screen and (max-width: 1600px) {
	.top-banner-text .h-style-1 {
		font-size: 36px;
	}
}
@media only screen and (max-width:1439px) {
	.top-banner-text .h-style-1 {
		font-size: 32px;
		margin-bottom: 0;
	}
	
	.slider-wrapper {
		width: 400px;
	}

	.inside-nav .navbar-nav>li {
		padding-right: 45px;
	}
	
	.data-box-item {
		margin: 10px 10px;
	}
	.calculation-box-1{
                padding:30px 30px;
        }
        .data-box-item input{
                width:50px;
        }
	.calculation-price-item {
		margin-bottom: 20px;
	}
}

/**21-0812 gene new page end**/


/*2021-10-26 peptide start*/

.feature-item-peptide:nth-child(2n+1)>div {
		background:#fffbef;
		}
		
		.feature-item-peptide:nth-child(2n)>div {
    background:#f9f8f8;
}

	.feature-item-peptide>div {
		width: 286px;
		border-radius: 15px;
		margin-bottom: 10px;
		}
	.feature-item-peptide:nth-child(2n+1):hover>div {
    background: #f8f0d8;
}	
.feature-item-peptide:nth-child(2n):hover>div {
    background: #efefef;
}	

.feature-item-peptide:nth-child(2n+1):hover>div p, .feature-item-peptide:nth-child(2n):hover>div p {
	color: #d58b2c;
}

.img-mask-yellow {
	border-color: #ff8f00;	
}

.tools-box>div.active h3.h3yellow {
    color: #ff8f00;
}

.tools-box-details-border-yellow {
	border: 1px solid #ff8f00;
	background: #fffefc;
}

.tableul li.icon-bg-yellow {
    background: url(/gsimages/peptide/other-popular-tools-icon-yellow.png) left 7px no-repeat;
}

/*2021-10-26 peptide end*/

@media only screen and (max-width:1366px) {
	.overview-w {
		max-width: 1024px;
	}
	
	.overview-flex>div {
		margin: 10px;
	}
	
	.flex-box-1-img-item {
		margin: 5px;
	}
	.free-flex {
	display: block;
}
.ifn-1366 {
	float: none;
}
}
@media only screen and (max-width:1023px) {
.menu-nav {
    display: none;
}
}
@media only screen and (max-width:999px) {
	.container-fluid .navbar-collapse.collapse.in {
		display: block!important;
	}
	/*customer start*/
	
	.banner {
		width: 768px;
		height: 260px;
		margin: 0 auto;
		position: relative;
		overflow: hidden;
	}
	
	.banner .img {
		width: 3072px;
		height: 260px;
		position: absolute;
		left: 0px;
		top: 0px;
	}
	
	.banner .img li {
		width: 768px;
		height: 220px;
		position: relative;
	}
	
	.banner .img li .flex-customer-item {
		width: 370px;
		height: 220px;
		margin-right: 0;
		margin: 0 7px;
	}
	/*customer end*/
	/**21-0812 gene new page**/
	
	.top-banner-text .h-style-1 {
		font-size: 26px;
		line-height: 26px;
	}
	
	.container-fluid .navbar-collapse.collapse.in {
		display: block!important;
	}
	

	.top-banner-w {
		width: 100%;
		max-width: 100%;
		display: block;
	}
	
	.container-text-two-right {
		display: none;
	}
	/**21-0812 gene new page**/
        .data-box{
                margin-top:50px;
        }
        .data-box-item {
                margin: 5px 5%;
                flex: none;
                width: 40%;
        }
        .calculation-box-1 {
               padding: 20px 20px;
         }
}
@media only screen and (max-width:768px) {
.flex-box-1-img-item-yuan {
	padding: 6px;
}	
	.top-banner-container {
		background: #e8e8eb;
		height: auto;
	}
	.top-banner-container-gs {
		background: #0f4e96;
	}
	
	.top-banner-container img {
		width: 816px;
		height: 200px;
		margin-left: calc(100% - 816px);
	}
	
	.top-banner-w {
		padding: 20px 0;
		text-align: center;
	}
	
	.container-text-w {
		position: relative;
		left: 0;
		text-align: center;
		width: 100%;
		transform: translateY(0);
	}
	
	.top-banner-w .h-style-1 {
		font-size: 24px;
		padding: 0 0 20px 0;
		color:#ffffff;
	}
	
	.top-banner-w .cl-balck-min {
		color: #ffffff;
	}
	
	.overview-w h1,
	.section h2,.section-title h2 {
		margin-top: .633em;
		margin-bottom: .633em;
		font-size: 28px;
	}
	
	.overview-flex,
	.flex-box-1-img {
		display: block;
	}
	
	.flex-box-1-img-item {
		margin: 28px;
	}
	/*customer start*/
	
	.banner {
		width: 300px;
		height: 372px;
		margin: 0 auto;
		position: relative;
		overflow: hidden;
	}
	
	.banner .img {
		width: 1200px;
		height: 372px;
		position: absolute;
		left: 0px;
		top: 0px;
	}
	
	.banner .img li {
		width: 300px;
		height: auto;
	}
	
	.banner .img li .flex-customer-item {
		width: 576px;
		min-height: auto;
		height: auto;
		margin-right: 0;
		margin: 0;
	}
	
	.banner .img li .flex-customer-item:first-child {
		width: 300px;
	}
	
	.flex-customer-item img {
		margin-bottom: 10px;
		width: 250px;
		height: 100px;
		vertical-align: middle;
	}
	
	.banner h3 {
		font-size: 22px;
	}
	
	.banner .num {
		bottom: 1;
	}
	/*customer end*/
	/**21-0812 gene new page**/
	
	.tableul-min {
		float: none;
		width: 100%;
		padding: 0;
	}
	
	.boxw {
		padding: 28px 15px;
	}
	
	h2.font32 {
		font-size: 26px;
	}
	
	.top-banner-text .h-style-1 {
		font-size: 26px;
		line-height: 30px;
	}
	
	.top-banner-text p {
		font-size: 16px;
	}
	
	.flex-container-item {
		flex: none;
		width: 60%;
		margin: 0 20% 20px;
	}
	
	.next-step-container ul li {
		display: block;
		text-align: left;
	}
	
	.feature-item {
		width: 50%;
	}
	/**21-0812 gene new page**/
	
	
	.wd-84 {
		max-width: 100%;
	}
	
	
/**21-0812 gene new page**/

	.container-text-two {
		display: block;
	}
	
	iframe {
		width: 300px;
		height: 150px;
	}
	
	.iframe-size, .iframe-size-sub {
    width: 320px;
    height: 170px;
}

	.flex-item {
		flex: none;
		width: 50%;
	}
	
	.feature-item {
		width: 100%;
	}
	
	.flex-container-item {
		flex: none;
		width: 90%;
		margin: 0 5% 20px;
	}
	
	.top-banner-container {
		background: #033186;
	}	
	
	.top-banner-text {
		position: relative;
		width: 100%;
		padding: 15px;
		transform: translateY(0);
	}
	
	.promotions-content>div {
		width: 100%;
	}
	
	.slider-wrapper {
		width: 310px;
	}
	
	.calculation-box-1 {
		padding: 30px 10px;
	}
	
	.data-box-item {
		margin: 5px 5%;
		flex: none;
		width: 90%;
	}
	
	.testimonial-box {
		position: relative;
		padding: 20px 20px;
		border: 1px solid #dfdfdf;
		padding-bottom: 130px;
	}
	
	.testimonial-box>div:nth-child(1) {
		padding: 10px;
		position: relative;
	}
	
	.testimonial-box>div:nth-child(1) span {
		position: absolute;
		font-size: 40px;
		color: #15a442;
		line-height: 1em;
		height: 20px;
	}
	
	.testimonial-box>div:nth-child(2) {
		position: absolute;
		left: 30px;
		bottom: 20px;
		text-align: left;
	}
	
	.tools-box-img {
		width: 80px;
		height: 80px;
	}
	
	.tools-box>div h3 {
		font-size: 14px;
	}
	
	.tools-box-details {
		padding: 30px 30px;
		border-top-left-radius: 60px;
		border-bottom-right-radius: 60px;
		max-width: 100%;
	}
	
	.section h2 {
		line-height: 1.2em;
		margin-top: 0;
	}
/**21-0812 gene new page**/
.section-pst {
	height: 100%;
}

.resource-item-right {
	width:100%;
}
.resource-item {
	float: left;
	width:100%;
}
.resource-item img {
	display: table;
    margin: 0 auto;
}
}

