@charset "utf-8";
/*
	Todd Motto Labs
	URL: www.toddmotto.com
*/

/*------------------------------------*\
    Responsive Navigation
\*------------------------------------*/
*,
*:after,
*:before {
	margin:0;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
body {
	background:#ECF0F1;
}
a,
a:hover {
	text-decoration:none;
}
ul,
ol {
	list-style:none;
}
.wrapper {
	width:26%;
	margin-top:-20px ;
	position:absolute;
    z-index:1000;
}
.main {
	width:100%;
	margin:5px 0;
	text-align:center;
}
.margin{ margin:0 auto;}

.header{width:100%;background:#f6f6f6;height:95px;border-bottom:2px solid #efefef;font-size:10pt;color:#3e3a39;}
.header .header_1{width:350px;float:left;height:80px;margin-left:100px;padding-top:0px;}
.header .top{height:35px;padding-top:60px;width:800px;float:right;text-align:left;}
.header .top span{color:#848081;}
.menu{width:1000px;margin:0 auto;height:220px;margin-top:50px;}
.menu div{width:16%;float:left;text-align:center;font-size: 16px;  line-height: 30px;}
.menu div img{margin:0 auto;display:block;width: 100px;  height: 100px;}
.main_news{width:1200px;margin:0 auto;background:#f3f4f4;height:auto;}
.main_news h3{padding:20px 0 0px 50px;}
/* Navigation styling */
.nav {
	position:relative;
	display:inline-block;
	font-size:14px;
	font-weight:900;
}
.nav-list {
	
}
.nav-item {
	float:left;
	*display:inline;
	zoom:1;
}
.nav-item a {
	display:block;
	padding:15px 20px;
	color:#FFF;
	background:#34495E;
}
.nav-item:first-child a {
	border-radius:5px 0 0 5px;
}
.nav-item:last-child a {
	border-radius:0 5px 5px 0;
}
.nav-item a:hover {
	background:#2C3E50;
    /*filter:alpha(Opacity=60);-moz-opacity:0.6;opacity: 0.6;*/ 
}
/* Mobile Navigation */
.nav-mobile {
	display:none; /* Hide from browsers that don't support media queries */
	cursor:pointer;
	position:absolute;
	top:0;
	right:0;
	background:#34495E url(../img/nav.svg) no-repeat center center;
	height:30px;
	width:30px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
   
}
      /* jQuery jcSlider css */
        body {
            overflow-x: hidden;
			margin:0px; padding:0px;
        }

        .jcSlider {
            width: 1200px;
            position: relative;
            height: 755px;
            margin: 0 auto
        }

        .imgHide {
            width: 1200px;
            height: 755px;
            overflow: hidden;
            position: relative;
        }

        .imgList {
            height: 9999%;
            width: 9999%;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
        }

            .imgList li {
                position: absolute;
                left: 0;
                top: 0;
                height: 755px;
                width: 1200px;
                list-style: none;
                display: none;
                overflow: hidden;
            }

        .imgNum {
            position: absolute;
            left: 0;
            top: 0;
            z-index: 2;
            display: none;
        }

            .imgNum dd {
                width: 14px;
                height: 14px;
                float: left;
                list-style: none;
                cursor: pointer;
                margin: 0 3px;
                overflow: hidden;
            }

                .imgNum dd a {
                    display: block;
                    height: 14px;
                    width: 14px;
                    text-indent: -999em;
                    overflow: hidden;
                    text-align: center;
                    line-height: 14px;
                    background: url(../images/pagination.png) no-repeat 0 0;
                }

                    .imgNum dd a:hover, .imgNum dd.select a {
                        background-position: 0 -14px;
                    }

        .imgPrev {
            position: absolute;
            left: 0;
            top: 10px;
            z-index: 3;
            display: block;
            cursor: pointer;
            height: 755px;
            width: 40px;
            margin-left: -30px;
        }

        .imgNext {
            position: absolute;
            left: 0;
            top: 10px;
            z-index: 3;
            display: block;
            cursor: pointer;
            height: 755px;
            width: 40px;
            margin-left: 20px;
        }

        .imgPrev {
            background: url(../images/left1.png) no-repeat left center;
        }

        .imgNext {
            background: url(../images/right1.png) no-repeat right center;
        }

        /* demo2 add css */
        #demo2 .imgNum dd {
            width: 24px;
            height: 24px;
            float: left;
            list-style: none;
            cursor: pointer;
            margin: 0 4px;
            overflow: hidden;
        }

            #demo2 .imgNum dd a {
                display: block;
                height: 24px;
                width: 24px;
                overflow: hidden;
                text-indent: 0;
                text-align: center;
                line-height: 24px;
                background: url(../images/NumBtn.png) no-repeat 0 -27px;
                color: #000;
                font-size: 13px;
            }

                #demo2 .imgNum dd a:hover, #demo2 .imgNum dd.select a {
                    background-position: 0 0;
                    color: #fff;
                }
        .newNews{   width: 85%;margin: 0 auto; padding: 30px 0; }
        .newNews .news-head{ font-size: 1.17em; font-weight: 600; text-align: center; }
        .newNews .news-content{     width: 100%;  margin: 20px 0; }
        .newNews .news-content ul{ width: 100%;  display: flex;  flex-wrap: wrap; }
        .newNews .news-content li{ width: 50%; display: flex;  margin: 20px 0; }
        .newNews .news-content li .li-img{ width: 50%; }
        .newNews .news-content li .li-img img{     width: 95%;   margin-left: 2.5%;}
        .newNews .news-content li .li-content{ width: 47%;margin: 0 1.5%; }
        .newNews .news-content li .li-content span{ font-size: 18px; color: #bc9882;  font-weight: 700;display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2; overflow: hidden;}
        .newNews .news-content li .li-content p{ font-size: 14px; color: #666; display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 4; overflow: hidden; }
        .newNews .news-content li .li-content p:first-child{ margin: 10px 0; display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 1; overflow: hidden;}
         .NewProduct{     width: 85%; margin: 0 auto; padding: 30px 0; }
        .NewProduct .product-head{ font-size: 1.17em; font-weight: 600; text-align: center;}
        .NewProduct .product-content{ width: 100%; margin: 20px 0; }
        .NewProduct .product-content .product-ul{ width: 100%; display: flex; flex-wrap: wrap; }
        .NewProduct .product-content .product-ul li{ width: 16%; display: flex; margin: 20px auto; }
        .NewProduct .product-content .product-ul li a .li-content{    width: 95%;
    margin: 0 2.5%;}
        .NewProduct .product-content .product-ul li a .li-content img{     width: 90%;  margin: 0 1.5%; }
        .NewProduct .product-content .product-ul li a .li-content span{     font-size: 18px;color: #bc9882; font-weight: 700; display: -webkit-box;  -webkit-box-orient: vertical; -webkit-line-clamp: 2;  overflow: hidden;  text-align: center; }
    				

/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media only screen and (min-width: 320px) and (max-width: 768px) {
	.nav-mobile {
		display:block;
	}
	.nav {
		width:100%;
		padding:30px 0 0;
      /*filter:alpha(Opacity=70);-moz-opacity:0.7;opacity: 0.7;*/ 
	}
	.nav-list {
		display:none;
	}
	.nav-item {
		width:100%;
		float:none;
	}
	.nav-item a {
		background:#34495E;
		padding:10px;


	}
	.nav-item:first-child a {
		border-radius:5px 0 0;
	}
	.nav-item:last-child a {
		border-radius:0 0 5px 5px;
	}
	.nav-active {
		display:block;
	}
	.nav-mobile-open {
		border-radius:5px 5px 0 0;
		-webkit-border-radius:5px 5px 0 0;
		-moz-border-radius:5px 5px 0 0;
	}
}