html{ font-family:'寰蒋闆呴粦'; } body { position: relative; } /* Code in headings */ h3 code { font-size: 14px; font-weight: normal; } a,a:active,a:hover,a:focus{ outline:0; } ul{margin:0;padding: 0} li{ list-style: none; margin: 0; } ol li{ list-style: inherit; } .bg-blue{ background-color: #026ad5; } /* Tweak navbar brand link to be super sleek -------------------------------------------------- */ body > .navbar { font-size: 14px; } /* Change the docs' brand */ body > .navbar .brand { padding-right: 0; padding-left: 0; margin-right: 20px; float: left; font-weight: bold; color: #0E94D8; text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.125); -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; } body > .navbar .brand:hover { text-decoration: none; text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.4); } .container{ width: 100%; padding: 0 !important; } .cate-banner{ position: relative; top: -106px; height: 450px; background-repeat: no-repeat; background-size: cover; background-position: center; } .mian.row{ margin-top: -106px; max-width: 1400px; } .row{ max-width: 1200px; margin:0 auto; } .product-content{ max-width: 1200px; } .product-content h3{ padding: 15px; background-color: #e5e5e5; margin: 30px 0; } .product-content h3 span{ float: right; font-size: 16px; line-height: 36px; } .product-content h3 a{ color: #2d69ce !important; } .product-content h4{ padding:20px 10px; background-color: #eff3f6 } .product-content h4 span{ color: #2d69ce; font-size: 14px; } .product-content li{ line-height: 24px; margin-bottom: 10px; } .product-content p{ } .p-0{ padding: 0; } .col-md-6 ol{ padding-left: 20px; } .select-lag{ border-radius: 15px; width: 678px; height: 378px; background: url("../images/halma-worldwide.jpg") no-repeat 20px 20px #fff; } .select-lag .list-unstyled li a{ display: block; width: 50%; height: 338px; float: left; } .navbar-header{ position: relative; z-index:100; } .navbar-collapse{ position: relative; } .navbar-nav .menu{ position: absolute; top: 100%; width: 100%; height: 150px; padding-left: 15%; padding-top: 1em; left: 0; background: #fff; opacity: 0.6; filter:alpha(opacity=80); box-shadow: 0 5px 10px #ddd; } .navbar-nav .menu{ display: none; } .navbar-nav li.active{ background:rgba(255, 255, 255, 0.6); } .navbar-nav .menu li{ float: left; width: 20%; } .navbar-nav .menu li a{ color: #000; } .navbar-nav .menu li a:hover{ color: #369; } .carousel-control span{ border: 3px solid #fff; border-radius: 23px; display: block; } .carousel-control .glyphicon:empty { width: 40px !important; height: 40px !important; line-height: 35px; } /* Sections -------------------------------------------------- */ /* padding for in-page bookmarks and fixed navbar */ section { padding-top: 30px; } section > .page-header, section > .lead { color: #5a5a5a; } section > ul li { margin-bottom: 5px; } img{ max-width: 100%; } /*鑿滃崟鏍峰紡*/ .header-wrapper{ position: relative; border-bottom: 2px solid #2d69ce; padding: 0; background:-webkit-linear-gradient(#fff,#d5d5d5); background:-o-linear-gradient(#fff,#d5d5d5); background:-moz-linear-gradient(#fff,#d5d5d5); background:linear-gradient(#fff,#d5d5d5); z-index: 100; } header .row{ padding: 0; } header .menu li{ list-style: none; float: left; } header .menu li a{ display: inline-block; padding: 15px 10px; color: #000; font-size: 15px; } header .menu li a.active, header .menu li a:hover{ background-color: #2d69ce; color: #fff; } header .header-tip{ padding: 10px 0; } header .header-tip a{ color: #FF0000; } header .header-tip span{ margin-right:10px; } header .header-tip i{ margin-right: 5px; } header .header-tip .phone-text{ font-size: 20px; color: red; font-weight: bold; } header .header-tip .icon{ display: inline-block; vertical-align: middle; } header .header-tip .icon-phone{ width: 26px; height: 17px; background:url('../images/icon-phone.png') no-repeat center; } header .header-tip .icon-mail{ width: 26px; height: 26px; background: url(../images/icon-mail.png) no-repeat; background-size: 100% 100%; } header .header-tip .icon-flag{ width: 20px; height: 17px; background:url('../images/icon-flag.png') no-repeat center; background-size: contain; } header .header-tip .icon-flag-en{ width: 20px; height: 17px; background:url('../images/icon-flag-en.jpg') no-repeat center; background-size: contain; } header .header-tip .website{ display: inline-block; position: relative; border: 0px; text-align: left; } header .header-tip .website .btn{ border-color: transparent; background: none; } header .header-tip .website a, header .header-tip .website span{ text-align: left; } header .old-website a{ font-size: 16px; text-decoration: underline; } .m-top-10{ margin-top: 10px !important; } .p-bottom-80{ padding-bottom: 80px !important; } /*product list*/ .productList{ margin-top:-80px; } .cardList .card-title{ font-size: 18px; font-weight:bold; color: #2d69ce; } .cardList .card-description{ margin-top:20px; font-size: 14px; color: #666; } .card-description p{ } .cardList .readMore a{ font-size: 14px; color: #6eb5ff; margin-top: 20px; font-weight: 400; } .cardList img{ width: 100%; } .swiper-container-news img{ max-height: 130px; } /*case list*/ .caseList .caseContent{ padding: 40px 0; } .caseList .case-item{ float: left; margin-right:15px; } .block-title { position: relative; padding: 30px 0px; color: #2d69ce; } .block-title div:last-child{ font-size: 18px; } .block-title:after{ content: ''; display:block; width: 100%; height: 1px; margin-top: -25px; background-color: #d9d9d9; } .contact-container{ background-position: center; background-repeat: no-repeat; } .contact-container .block-title:after{ display: none; } .contact-container>.row{ background: url(../images/contact-bg.png) no-repeat; background-size: contain; background-position: 150px 50px; } .block-title-text{ position: relative; display: inline-block; padding: 5px 100px; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; z-index: 100; background-color: #f3f3f3; } .block-title-text div{ font-size: 20px; color: #2d69ce; } .block-title-text div:last-child{ font-size: 14px; color: #2d69ce; } .block-content ul{ margin: 40px 0; } .block-content li{ margin-bottom:15px; } .block-content a{ color: #333; font-weight: 400; } .caseItem .item{ float: left; width: 120px; height: 120px; border:1px solid #ddd; background-color: #fff; margin: 5px; display: flex; align-items: center; } .caseList{ background: -webkit-linear-gradient(#f3f3f3, #ffff); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(#f3f3f3, #ffff); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(#f3f3f3, #ffff); /* Firefox 3.6 - 15 */ background: linear-gradient(#f3f3f3, #ffff); /* 鏍囧噯鐨勮娉 */ } .caseList .case-item{ position: relative; } .caseList .case-inoustry .case-item img{ width: 220px; height: 277px; } .caseList .case-description{ position: absolute; bottom: 0; left: 0; width: 100%; color: #fff; text-align: center; line-height: 50px; background-color: #3570d1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; cursor: pointer; } .caseList .case-item:hover .case-description{ opacity: 0.8; } .comment-container input[type='text']{ width: 100%; border-radius: 5px; border:0; background-color: #fff; line-height: 38px; padding-left:10px; box-shadow: 2px 2px 5px #ddd; } .comment-container textarea{ height: 120px; margin:10px 0 10px; overflow: auto; width: 100%; border-radius: 5px; border:0; background-color: #fff; padding-left:10px; box-shadow: 2px 1px 5px #ddd; } .comment-container .btn{ padding: 5px; margin-right:10px; color: #fff; } .comment-container .btn.bg-blue{ background-color: #478bde; } .comment-container .btn.bg-orange{ background-color: #f6ae3e; } .comment-container .btn-large{ width: 100px !important; } /* Jumbotrons -------------------------------------------------- */ /* Base class ------------------------- */ #myCarousel { top: -106px; } #myCarousel .carousel-opacity{ max-width: 1200px; margin: 0 auto; bottom: 26px; opacity: 0.8; left: 50%; margin-left: -600px; height: 100px; } #myCarousel .banner-description{ display: none; } #myCarousel .banner-description.active{ display: block; } #myCarousel .banner-description h3{ font-weight: bold; color: #2d69ce; font-size: 20px; margin: 0; } #myCarousel .banner-description p{ color: #666; font-size: 14px; margin-top: 10px; } #myCarousel .banner-thumb{ display: inline-block; width: 48px; height: 40px; float: right; margin-left: 10px; margin-top: 10px; } .carousel-inner > .item > img{ height: 623px; } .row-fluid-h3 { font-size: 14px; color: #505050; border-bottom: 1px dotted #9A9A9A; padding: 10px 0px; font-weight: 700; } .news-list h3, .view-applications h3 { margin: 0px 0px 10px; padding: 13px 0px; font-size: 14px; color: #505050; font-weight: 700; border-bottom: 1px dotted #9A9A9A; } .panel-collapse .col-md-3 img { max-width: 100%; } .panel-collapse .col-md-9 p { font-size: 12px; } .row-fluid .item-list{ display: none; } .row-fluid .active{ display: block; } .row-fluid img { max-width: 100%; height: auto; vertical-align: middle; border: 0px none; } .jumbotron h1 { font-size: 80px; font-weight: bold; letter-spacing: -1px; line-height: 1; } .jumbotron p { font-size: 24px; font-weight: 300; line-height: 1.25; margin-bottom: 30px; } /*bottom*/ .bottom { padding: 10px; background-color:#478bde; color: #FFF; } .bottom li ul li a { color: #FFF; font-weight: 400; margin: 0px; } .bottom li span { color: #CFF; margin-bottom: 10px; } .bottom li span { color: #CFF; margin-bottom: 10px; display: block; width: 100%; text-align: center; } .bottom .pull-left { padding: 0px 1.9%; width: 15%; } .bottom .pull-left li { list-style: none outside none; } .bottom .pull-left ul li { color: #B5B5BF; float: none; font-size: 11px; padding: 2px 0px; text-align: left; } .bottom li ul { padding-left: 0px; } .bottom .pull-left ul li a{ font-size: 14px; } .footer { padding: 30px; background: none repeat scroll 0% 0% #333; font-size: 12px; color: #808080; } .footer a { color: #808080; font-size: 12px; font-weight: 400; } .icon-top{ display: none; position: fixed; bottom: 300px; right: 100px; width: 55px; height: 55px; background:url('../images/icon-top.png') no-repeat center; background-size:contain; } .m-220 .col-md-4 { height: 220px; } .m-220.scada-case .col-md-4{ height: 270px; } .m-220.scada-case .col-md-4 p{ line-height: 14px; } .m-220 .col-md-4 img{ height: 180px; } /* Link styles (used on .masthead-links as well) */ .jumbotron a { color: #fff; color: rgba(255,255,255,.5); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .jumbotron a:hover { color: #fff; text-shadow: 0 0 10px rgba(255,255,255,.25); } /* Pattern overlay ------------------------- */ .jumbotron .container { position: relative; z-index: 2; } .jumbotron:after { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(../img/bs-docs-masthead-pattern.png) repeat center center; opacity: .4; } .modal-dialog{ width: 800px; max-height:440px; overflow: hidden; margin-top: 100px; } .modal-dialog video{ width: 100%; } .modal-content{ position: relative; } .modal-body{ padding: 0; background-color: #000; } .modal-content .close{ position: absolute; right: 20px; top: 20px; font-size: 40px; color: #fff !important; z-index: 100; font-weight:400; opacity: 1; } .row-fluid-h3{ font-size: 14px; color: #505050; border-bottom: 1px dotted #9A9A9A; padding: 10px 0px; font-weight: 700; } .news-list h3 ,.view-applications h3{ margin: 0; margin-bottom: 10px; padding: 13px 0px; font-size: 14px; color: #505050; font-weight: 700; border-bottom: 1px dotted #9A9A9A; } .panel-collapse a{ font-size: 12px; color: #999; font-weight: 400; } .panel-collapse .col-md-3{ padding: 0 5px 0 10px; } .panel-collapse .col-md-3 img{ max-width: 100%; } .panel-collapse .col-md-9 p{ font-size: 12px; } .panel-title{ padding: 0; } .panel-title a{ display: block; width: 100%; padding: 5px 15px; } .panel-default .active{ background: #369; color: #fff; text-decoration:none; } .pager ul{ width: 225px; margin: auto; } .pager ul li{ width: 13px; display: block; float: left; padding: 0px; overflow: hidden; background: url('../images/switcher-dot_11.png') no-repeat scroll 0% 0% transparent; text-indent: -100px; margin: 0px 10px; } .pager ul li.active{ background-position: -20px 0px; } /* Footer -------------------------------------------------- */ .bottom{ padding: 50px 0; color: #fff; } .bottom .container{ margin: 10px; } .bottom .pull-left{ padding-right: 10px; width: 15.5%; } .bottom .pull-left li{ list-style: none; } .bottom .pull-left ul li{ color: #B5B5BF; float: none; font-size: 14px; padding:5px 0px 0 15px;; background:url('../images/icon-menu.png') no-repeat left center; padding: 6px 0px 6px 15px; } .bottom .pull-left ul li a{ display: inline-block; width: 100%; } .bottom li span{ color: #fff; margin-bottom: 10px; text-align: left; font-size: 16px; font-weight:bold; } .bottom li ul{ padding-left: 0px; } .bottom li ul li{ list-style-type: none; list-style-image: none; } .bottom li ul li a{ color: #fff; font-weight: 400; margin: 0; } .footer { padding: 30px; background: #478bde; font-size: 11px; color: #fff; } .footer .container{ padding: 0; } .footer p { margin-bottom: 0; color: #fff; font-size: 12px; } .footer a{ color: #fff; font-size: 12px; font-weight:400; text-decoration: underline; } .footer-links { margin: 10px 0; } .footer-links li { display: inline; padding: 0 2px; } .footer-links li:first-child { padding-left: 0; } /* Example page ------------------------- */ .bootstrap-examples h4 { margin: 10px 0 5px; } .bootstrap-examples p { font-size: 13px; line-height: 18px; } .bootstrap-examples .thumbnail { margin-bottom: 9px; background-color: #fff; } /* Alert with link to latest version of the docs */ .bs-alert-old-docs { margin: 30px 0 0; } /* Bootstrap code examples -------------------------------------------------- */ /* Base class */ .bs-docs-example { position: relative; margin: 15px 0; padding: 39px 19px 14px; *padding-top: 19px; background-color: #fff; border: 1px solid #ddd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /*page*/ .cate-banner img{ width: 100%; height: 450px; } .col-md-3 .combox{ max-width: 200px; overflow: hidden; } #sub_category .category-title{ font-size: 26px; color: #0269d5; font-weight: 400; margin-top:10px !important; } #sub_category h2{ font-size: 26px; } .category-list li a{ display: block; width: 100%; padding: 5px 10px; color: #989898; background-color: #ececec; border-bottom:1px solid #fff; overflow: hidden; text-overflow: ellipsis; } .category-list li a:hover, .category-list li a.active{ background-color: #0269d5; color: #fff; } .navigate{ padding: 10px 0; text-align: right; border-bottom:2px solid #0369d5; } .navigate h1{ margin:0 !important; } #category .result_list{ padding: 30px 0; border-bottom: 1px dotted #bfbfbf; } #category .result_list .title{ margin:0; } #category .result_list .title a{ color: #0269d5 } #category .result_list .title .fr{ font-size: 12px; color: #666; float: right; line-height: 26px; } .category-title{ color: #0269d5; font-size: 26px; margin-top: 15px; } #category .result_list .btn{ padding: 5px 20px; margin-top: 20px; border-radius: inherit; color: #fff; } .category-more li{ margin-bottom:10px; } .category-more li:hover{ opacity: 0.8; } .result_list .thumb{ position: relative; padding: 30px 20px 50px; border:1px solid #d5d5d5; box-shadow: 2px 2px 3px #ddd; } .result_list .thumb img{ display: inline-block; height: 170px; width: 100%; margin-bottom:10px; border-bottom: 1px solid #ddd; } .result_list .thumb-title{ color: #0268d7; font-size: 16px; font-weight: bold; } .result_list .thumb-more{ position: absolute; left: 50%; bottom: 20px; margin-left: -48px; display: inline-block; padding: 5px 20px; color: #fff; background-color: #999; border-radius: 3px; } .result_list .thumb-more:hover{ background-color: #0268d7; } .result_list .thumb-description{ height: 40px; color: #676767; font-weight: bold; font-size: 14px; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .result_list h3.title a{ font-size: 16px; color: #000; } .mainbody .content{ line-height: 1.75; } .mainbody .content p{ padding: 6px 0; line-height: 1.6; text-indent: 24px; } .mainbody .content .contact p{ text-indent: 0px !important; } .mainbody .content h2{ color: #0269d5; font-weight: bold; } .mainbody .content a{ color: #777; font-weight: 400; width: 100%; } .mainbody .content a img{ max-width: 100%; } .mainbody .content img{ max-width: 100%; } .mainbody .content .zhengshu img{ height: 400px; } .mainbody .content .zhengshu .col-md-4{ margin-bottom: 20px } .mainbody .navigate h1{ font-size: 20px; } .news-list{ margin-bottom: 10px; } .news-item{ margin-bottom: 10px; } .news-item a{ display: block; font-weight: 400; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin-bottom: 10px; } .news-item a h3{ padding: 5px 0; margin-bottom: 0; color: #2d69ce; border-bottom: 0; } .news-item .news-date{ padding: 2px; background-color: #7abbff; color: #fff; } .swiper-container-news { width: 100%; height: 100%; } .swiper-container-news .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-container-partners { width: 100%; height: 260px; padding: 0 10px; } .swiper-container-partners img{ max-height: 120px; } .swiper-container-partners .swiper-slide { text-align: center; font-size: 18px; background: #fff; height: 120px; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-container-honor { width: 100%; height: 320px; } .swiper-container-honor .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; /*background:url('../images/water.jpg') repeat-y;*/ } .text-copyright{ text-align: center; } .suspension { position: fixed; z-index: 55; right: 0px; bottom: 126px; width: 80px; height: 204px; _position: absolute; _bottom: auto; top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-10)); _margin-bottom: 140px; } .suspension1 { position: fixed; z-index: 55; right: 0px; bottom: 40px; width: 80px; height: 204px; _position: absolute; _bottom: auto; top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-10)); _margin-bottom: 140px; }/*鍥哄畾搴曢儴鎮诞*/ .suspension-box { position: relative; float: right; } .suspension-box a.a { display: block; width: 50px; height: 50px; background-color:#2d69ce; margin-bottom: 1px; cursor: pointer; } .suspension-box a.back_top { background-color: #2d69ce; } .suspension-box a.qq:hover, .suspension-box a.tel:hover, .suspension-box a.code:hover { opacity: 0.8; filter: alpha(opacity=80); } .suspension-box a.back_top:hover { background-color: #2d69ce; } .suspension-box div.code { position: absolute; left: -185px; top: 0; display: none; width: 155px; height: 191px; padding: 10px 10px 0px 10px; background-color: #fff; border: 1px solid #D9D9D9; } .suspension-box div.code p { width: 155px; padding-left: 6px; margin-top: 0px; font-size: 14px; } .suspension-box div.code i { width: 8px; height: 15px; position: absolute; top: 118px; right: -8px; background-image: url(../images/side_bg2.png); background-repeat: no-repeat; } .suspension-box div.tencent { position: absolute; left: -187px; top: 0px; width: 177px; height: 85px; display: none; background-color: #fff; border: 1px solid #D7D7D7; } .suspension-box div.tencent p.tencent-p { width: 75px; float: right; margin-right: 18px; margin-top: 18px; font-size: 16px; color: #333; } .suspension-box div.tencent i.tencent-i { width: 8px; height: 15px; position: absolute; top: 20px; right: -8px; text-indent: -9999px; background-image: url(../images/side_bg2.png); background-repeat: no-repeat; } .suspension-box div.tencent b.tencent-b { position: absolute; left: 10px; top: 10px; width: 62px; height: 64px; background-image: url(../images/side_bg3.png); background-repeat: no-repeat; } .suspension-box div.tencent span.tencent-span { position: absolute; left: 8px; top: 7px; border-radius: 22px; width: 45px; height: 48px; text-align: center; z-index: 99; overflow: hidden; } .suspension-box div.tencent .tencent-qq { position: absolute; left: 3px; top: 0px; height: 45px; width: 39px; } .suspension-box div.tel { position: absolute; left: -187px; top: 32px; display: none; width: 177px; height: 85px; background-color: #fff; border: 1px solid #D7D7D7; } .suspension-box div.tel i { width: 8px; height: 15px; position: absolute; top: 35px; right: -8px; background-image: url(../images/side_bg2.png); background-repeat: no-repeat; } .suspension-box div.tel strong { display: block; margin-left: 17px; margin-top: 16px; font-size: 16px; font-weight: normal; } .suspension-box div.tel p { margin-left: 17px; font-size: 23px; font-family: arial; color: #FF0000; } .j-back-top{ cursor:pointer; } .icon-pdf{ display: inline-block; width: 18px; height: 18px; background: url(../images/icon-download.png) no-repeat; background-size: contain; vertical-align: bottom; } .swiper-container-horizontal>.swiper-pagination-bullets{ text-align: center; } @media screen and (max-width: 414px) { header .header-wrapper{ padding: 10px; } .cate-banner{ background-position: left; background-size: initial; } #myCarousel{ height: 300px; } #myCarousel img{ height: 300px; } .productList{ margin-top: -100px; } .caseList .case-item{ text-align: center; width: 100%; } .col-md-3 .combox{ max-width: 100%; } .bottom .pull-left{ width: 50%; padding: 10px 20px !important; } .bottom ul.pull-right{ width: 100%; } .icon-top{ right: 20px; } .m-menu-icon i{ line-height: 42px; font-size: 18px; color: #555; } .m-menu{ width: 100%; position: absolute; left: 0; top: 100%; background-color: rgba(0,0,0,1); } .m-menu.hide{ display: none !important; } .m-menu li a{ display: block; width: 100%; padding: 8px 10px; line-height: 24px; color: #fff; } }