/*
Theme Name: Fangyutech
Theme URI: http://www.becomingjenny.net
Version: 1.0
Author: Brain@JennyStudio
Author URI: http://www.brain1981.com
Description: This theme is a customized version based on Wordpress theme twentyTwelve. JennyStudio - build your own WordPress theme.
License:
License URI: http://www.becomingjenny.net
Tags: light, gray, white, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: twentytwelve
*/
/* =Notes
--------------------------------------------------------------
This stylesheet uses rem values with a pixel fallback. The rem
values (and line heights) are calculated using two variables:
$rembase: 14;
$line-height: 24;
---------- Examples
* Use a pixel value with a rem fallback for font-size, padding, margins, etc.
padding: 5px 0;
padding: 0.357142857rem 0; (5 / $rembase)
* Set a font-size and then set a line-height based on the font-size
font-size: 16px
font-size: 1.142857143rem; (16 / $rembase)
line-height: 1.5; ($line-height / 16)
---------- Vertical spacing
Vertical spacing between most elements should use 24px or 48px
to maintain vertical rhythm:
.my-new-div {
margin: 24px 0;
margin: 1.714285714rem 0; ( 24 / $rembase )
}
---------- Further reading
http://snook.ca/archives/html_and_css/font-size-with-rem
http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/
/* =Reset
-------------------------------------------------------------- */
@import url(fonts/fonts-roboto.css);
@import url(fonts/flaticon.css);
*::-moz-selection {
background-color: #4D525A;
color: #FFF;
}
*::selection {
background-color: #4D525A;
color: #FFF;
}
input[type="button"],
input[type="submit"],
input[type="reset"],
textarea {
-webkit-appearance: none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
font-style: normal;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption,
th,
td {
font-weight: 300;
text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
clear: both;
}
html {
overflow-y: scroll;
font-size: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
a:focus {
outline: thin dotted;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
display: block;
}
audio,
canvas,
video {
display: inline-block;
}
audio:not([controls]) {
display: none;
}
del {
color: #333;
}
ins {
background: #fff9c0;
text-decoration: none;
}
hr {
background-color: #ededed;
background-color: rgba(0,0,0,0.1);
border: 0;
height: 1px;
margin: 24px 0;
margin-bottom: 1.714285714rem;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
small {
font-size: smaller;
}
img {
border: 0;
-ms-interpolation-mode: bicubic;
}
/* Clearing floats */
.clear:after,
.wrapper:after,
.format-status .entry-header:after {
clear: both;
}
.clear:before,
.clear:after,
.wrapper:before,
.wrapper:after,
.format-status .entry-header:before,
.format-status .entry-header:after {
display: table;
content: "";
}
/* =Repeatable patterns
-------------------------------------------------------------- */
/* Small headers */
.archive-title,
.page-title,
.widget-title {
font-size: 16px;
font-size: 1.225714286rem;
line-height: 2.181818182;
font-weight: normal;
color: #636363;
}
/* Shared Post Format styling */
article.format-quote footer.entry-meta,
article.format-link footer.entry-meta,
article.format-status footer.entry-meta {
font-size: 11px;
font-size: 0.785714286rem;
line-height: 2.181818182;
}
/* Form fields, general styles first */
button,
input,
select,
textarea {
border: 1px solid #ccc;
/*border: 1px solid rgba(0,0,0,0.4);*/
border-radius: 0px;
font-family: inherit;
padding: 4px;
}
button,
input {
line-height: normal;
}
textarea {
font-size: 100%;
overflow: auto;
vertical-align: top;
}
/* Reset non-text input types */
input[type="checkbox"],
input[type="radio"],
input[type="file"],
input[type="hidden"],
input[type="image"],
input[type="color"] {
border: 0;
border-radius: 0;
padding: 0;
}
/* Buttons */
.menu-toggle,
input[type="submit"],
input[type="button"],
input[type="reset"],
article.post-password-required input[type=submit],
.bypostauthor cite span {
padding: 4px 26px;
font-size: 12px;
font-size: 0.865714286rem;
line-height: 1.628571429;
font-weight: normal;
color: #fff;
background-color: #43c9ac;
border:none;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1);
-webkit-transition:color 0.2s, background 0.2s;
transition:color 0.2s, background 0.2s;
}
.menu-toggle,
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
cursor: pointer;
}
button[disabled],
input[disabled] {
cursor: default;
}
.menu-toggle:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
article.post-password-required input[type=submit]:hover {
color: #fff;
background-color: #000;
}
.menu-toggle:active,
.menu-toggle.toggled-on,
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
color: #fff;
background-color: #000;
border-color: transparent;
}
.bypostauthor cite span {
color: #fff;
background-color: #21759b;
background-image: none;
border: 1px solid #1f6f93;
border-radius: 2px;
box-shadow: none;
padding: 0;
}
.button,
body a.button{
background-color: #43c9ac;
padding:8px 20px;
border-radius: 2px;
color: #fff;
text-decoration: none;
-webkit-transition:background 0.2s, color 0.2s;
transition:background 0.2s, color 0.2s;
}
.button:hover{
text-decoration: none;
background-color: #000;
color: #fff;
}
.button.big{
padding:10px 25px;
font-size: 18px;
font-size: 1.285714rem;
}
/* Responsive images */
.entry-content img,
.comment-content img,
.widget img {
max-width: 100%; /* Fluid images for posts, comments, and widgets */
}
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
img.size-full,
img.size-large,
img.header-image,
img.wp-post-image {
max-width: 100%;
height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
/* Make sure videos and embeds fit their containers */
embed,
iframe,
object,
video {
max-width: 100%;
}
.entry-content .twitter-tweet-rendered {
max-width: 100% !important; /* Override the Twitter embed fixed width */
}
/* Images */
.alignleft {
float: left;
}
.alignright {
float: right;
}
.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.entry-content img,
.comment-content img,
.widget img,
img.header-image,
.author-avatar img,
img.wp-post-image {
}
.wp-caption {
max-width: 100%; /* Keep wide captions from overflowing their container. */
padding: 4px;
}
.wp-caption .wp-caption-text,
.gallery-caption,
.entry-caption {
font-style: italic;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 2;
color: #757575;
}
img.wp-smiley,
.rsswidget img {
border: 0;
border-radius: 0;
box-shadow: none;
margin-bottom: 0;
margin-top: 0;
padding: 0;
}
.entry-content dl.gallery-item {
margin: 0;
}
.gallery-item a,
.gallery-caption {
width: 90%;
}
.gallery-item a {
display: block;
}
.gallery-caption a {
display: inline;
}
.gallery-columns-1 .gallery-item a {
max-width: 100%;
width: auto;
}
.gallery .gallery-icon img {
height: auto;
max-width: 90%;
padding: 5%;
}
.gallery-columns-1 .gallery-icon img {
padding: 3%;
}
/* Navigation */
.site-content nav {
clear: both;
line-height: 2;
overflow: hidden;
}
#nav-above {
padding: 24px 0;
padding: 1.714285714rem 0;
}
#nav-above {
display: none;
}
.paged #nav-above {
display: block;
}
.nav-previous,
.previous-image {
float: left;
width: 50%;
}
.nav-next,
.next-image {
float: right;
text-align: right;
width: 50%;
}
.nav-previous,
.nav-next {
line-height: 1.5;
width: 47%;
}
.nav-previous a,
.nav-next a{
text-decoration: none;
display: block;
padding: 8px;
border: 1px solid rgba(0, 0, 0, 0.1);
}
.nav-previous { border-left: 6px solid #000; }
.nav-next { border-right: 6px solid #000; }
.nav-previous a{ border-left: none; }
.nav-next a{ border-right: none; }
.nav-previous a:hover,
.nav-next a:hover{
background-color: #eee;
text-decoration: none;
}
.nav-previous a .meta-nav,
.nav-next a .meta-nav{ display: none;}
.nav-single,
#comment-nav-above {
margin: 48px 0;
margin: 3.428571429rem 0;
}
/* Author profiles */
.author .archive-header {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.author-info {
border-top: 1px solid #ededed;
margin: 24px 0;
margin: 1.714285714rem 0;
padding-top: 24px;
padding-top: 1.714285714rem;
overflow: hidden;
}
.author-description p {
color: #757575;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
}
.author.archive .author-info {
border-top: 0;
margin: 0 0 48px;
margin: 0 0 3.428571429rem;
}
.author.archive .author-avatar {
margin-top: 0;
}
/* =Basic structure
-------------------------------------------------------------- */
/* Body, links, basics */
html {
font-size: 87.5%;
}
body {
font-size: 14px;
font-size: 1rem;
font-family: 'Roboto', '微软雅黑', Helvetica, Arial, sans-serif;
font-weight: 300;
text-rendering: optimizeLegibility;
color: #555;
background-color:#fff;
}
a {
outline: none;
color: #000;
text-decoration: none;
}
a:hover {
color: #333;
text-decoration: underline;
}
/* Assistive text */
.assistive-text,
.site .screen-reader-text {
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
}
.main-navigation .assistive-text:focus {
background: #fff;
border: 2px solid #333;
border-radius: 3px;
clip: auto !important;
color: #000;
display: block;
font-size: 12px;
padding: 12px;
position: absolute;
top: 5px;
left: 5px;
z-index: 100000; /* Above WP toolbar */
}
/* Page structure */
hgroup {
/*overflow: hidden;*/
margin: 0 auto;
max-width: 1200px;
max-width: 85.71428571rem;
position: relative;
width: 98%;
}
.site {
padding: 0 21px;
padding: 0 1.5rem;
}
.site-content {
margin: 21px 0 0;
margin: 1.5rem 0 0;
}
.widget-area {
margin: 21px 0 0;
margin: 1.5rem 0 0;
}
/* Header */
.site-header {
padding: 0;
background-color: #fff;
width:100%;
}
.site-header h1,
.site-header h2 {
text-align: center;
display: none;
}
.site-header h1 a,
.site-header h2 a {
color: #515151;
display: inline-block;
text-decoration: none;
}
.site-header h1 a:hover,
.site-header h2 a:hover {
color: #21759b;
}
.site-header h1 {
font-size: 24px;
font-size: 1.714285714rem;
line-height: 1.285714286;
margin-bottom: 2px;
margin-bottom: 0.15rem;
}
.site-header h2 {
font-weight: normal;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
color: #757575;
}
.header-image {
margin-top: 24px;
margin-top: 1.714285714rem;
}
/* Navigation Menu */
.main-navigation {
margin-top: 14px;
margin-top: 1rem;
text-align: center;
/*overflow: hidden;*/
clear:both;
/*background-color:#333;*/
}
.main-navigation li {
font-size: 15px;
font-size: 1.071428571rem;
line-height: 2.6;
}
.main-navigation a {
color: #333;
text-decoration: none;
display: block;
/*font-family: 'Roboto', '微软雅黑', serif;*/
}
.main-navigation a:hover,
.main-navigation a:focus {
background: #fafafa;
color:#43c9ac;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: none;
width:100%;
font-size: 0;
}
.main-navigation ul.nav-menu.toggled-on { display: inline-block; }
.menu-toggle {
display: inline-block;
margin-top: 8px;
margin-bottom: 8px;
font-size: 14px;
font-size: 1rem;
background-image: url(images/icon_menu.gif);
background-position: 20px center;
background-repeat: no-repeat;
padding: 3px 20px 3px 36px;
}
.menu-header-menu-container {
line-height: 0;
}
.main-navigation ul.nav-menu {
height:0;
overflow:hidden;
display: inline-block;
-webkit-transition: height 0.5s;
-moz-transition: height 0.5s;
transition: height 0.5s;
}
.main-navigation ul.nav-menu li {
border-top:1px solid #fff;
}
.main-navigation ul.nav-menu.toggled-on {
/*height:336px;*/
}
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_item > a,
.main-navigation .current_page_ancestor > a {
background: #fafafa;
color:#43c9ac;
}
/* Banner */
section[role="banner"] {
margin-bottom: 48px;
margin-bottom: 3.428571429rem;
}
/* Sidebar */
.widget-area .widget {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
margin-bottom: 24px;
margin-bottom: 1.714571429rem;
padding-bottom: 24px;
padding-bottom: 1.714571429rem;
border-bottom:1px solid #EDEDED;
word-wrap: break-word;
}
.widget-area .widget h3 {
margin-bottom: 10px;
margin-bottom: 1rem;
}
.widget-area .widget p,
.widget-area .widget li,
.widget-area .widget .textwidget {
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.646153846;
}
.widget-area .widget li { margin-bottom:10px;}
.widget-area .widget p {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.widget-area .textwidget ul {
list-style: disc outside;
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
}
.widget-area .textwidget li {
margin-left: 36px;
margin-left: 2.571428571rem;
}
.widget-area .widget a {
color: #757575;
text-decoration:none;
}
.widget-area .widget a:hover {
color: #21759b;
text-decoration:underline;
}
.widget-area .widget a:visited {
color: #5789a0;
}
.widget-area #s {
width: 45%;
width: -webkit-calc(100% - 65px);
width: calc(100% - 65px); /* define a width to avoid dropping a wider submit button */
}
/* Footer */
footer[role="contentinfo"] {
clear: both;
font-size: 14px;
font-size: 1rem;
line-height: 1.6;
margin-left: auto;
margin-right: auto;
padding: 0;
position: relative;
background-color: #2f2f2f;
color: #fff;
}
footer[role="contentinfo"] a {
color: #fff;
}
footer[role="contentinfo"] a:hover {
color: #fff;
}
footer[role="contentinfo"] h3{
font-size: 16px;
font-weight: 500;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid #ccc;
}
footer[role="contentinfo"] strong{
font-size: 14px;
font-size: 1rem;
font-weight: 400;
}
/* =Main content and comment content
-------------------------------------------------------------- */
.entry-meta {
clear: both;
}
.entry-header {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.entry-header img.wp-post-image {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.entry-header .entry-title,
.page-title {
line-height: 1.2;
padding-bottom: 10px;
padding-top: 2px;
color:#43c9ac;
border-bottom: 1px solid rgba(0,0,0,0.1);;
font-size: 21px;
font-size: 1.5rem;
font-weight: 600;
}
.entry-header .entry-title a {
text-decoration: none;
}
.entry-header .entry-format {
margin-top: 24px;
margin-top: 1.714285714rem;
font-weight: normal;
}
.comments-link {
margin-top: 14px;
margin-top: 1rem;
margin-bottom: 14px;
margin-bottom: 1rem;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
color: #757575;
}
.comments-link a,
.entry-meta a {
color: #757575;
}
.comments-link a:hover,
.entry-meta a:hover {
color: #21759b;
}
article.sticky .featured-post {
border-top: 4px double #ededed;
border-bottom: 4px double #ededed;
color: #757575;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 3.692307692;
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
text-align: center;
}
.entry-content,
.entry-summary,
.mu_register {
line-height: 1.8;
font-size: 16px;
font-size: 1.14258571rem;
}
.entry-content h1,
.comment-content h1,
.entry-content h2,
.comment-content h2,
.entry-content h3,
.comment-content h3,
.entry-content h4,
.comment-content h4,
.entry-content h5,
.comment-content h5,
.entry-content h6,
.comment-content h6 {
margin: 24px 0;
margin: 1.714285714rem 0;
line-height: 1.714285714;
font-weight: 400;
}
.entry-content h1,
.comment-content h1 {
font-size: 28px;
font-size: 2rem;
line-height: 1.5;
}
.entry-content h2,
.comment-content h2,
.mu_register h2 {
font-size: 21px;
font-size: 1.5rem;
line-height: 1.6;
color:#43c9ac;
font-weight: 600;
}
.entry-content h3,
.comment-content h3 {
font-size: 19px;
line-height: 1.846153846;
/*font-family: 'Roboto', '微软雅黑', serif;*/
}
.entry-content h4,
.comment-content h4 {
font-size: 16px;
font-size: 1.14258571rem;
line-height: 1.846153846;
}
.entry-content h5,
.comment-content h5 {
font-size: 14px;
font-size: 1rem;
line-height: 1.846153846;
}
.entry-content h6,
.comment-content h6 {
font-size: 14px;
font-size: 1rem;
line-height: 1.846153846;
}
.entry-content p,
.entry-summary p,
.comment-content p,
.mu_register p {
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
line-height: 1.8;
font-size: 16px;
font-size: 1.14258571rem;
}
.entry-content a,
.comment-content a {
/*color: #FF8288;*/
color: #000;
font-size: 16px;
font-size: 1.14258571rem;
}
.entry-content ol,
.comment-content ol,
.entry-content ul,
.comment-content ul,
.mu_register ul {
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
line-height: 1.8;
font-size: 16px;
font-size: 1.14258571rem;
}
.entry-content ul ul,
.comment-content ul ul,
.entry-content ol ol,
.comment-content ol ol,
.entry-content ul ol,
.comment-content ul ol,
.entry-content ol ul,
.comment-content ol ul {
margin-bottom: 0;
}
.entry-content ul,
.comment-content ul,
.mu_register ul {
list-style: disc outside;
}
.entry-content ol,
.comment-content ol {
list-style: decimal outside;
}
.entry-content li,
.comment-content li,
.mu_register li {
margin: 0 0 0 21px;
margin: 0 0 0 1.5rem;
line-height: 1.8;
}
.entry-content blockquote,
.comment-content blockquote {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
padding: 24px;
padding: 1.714285714rem;
font-style: italic;
}
.entry-content blockquote p:last-child,
.comment-content blockquote p:last-child {
margin-bottom: 0;
}
.entry-content code,
.comment-content code {
font-family: Consolas, Monaco, Lucida Console, monospace;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 1.8;
}
.entry-content pre,
.comment-content pre {
border: 1px solid #ededed;
color: #666;
font-family: Consolas, Monaco, Lucida Console, monospace;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 1.714285714;
margin: 24px 0;
margin: 1.714285714rem 0;
overflow: auto;
padding: 8px 16px;
padding: 0.5714285713rem 1.142885714rem;
}
.entry-content pre:hover,
.comment-content pre:hover {
background-color:#fafafa;
}
.entry-content pre code,
.comment-content pre code {
display: block;
}
.entry-content abbr,
.comment-content abbr,
.entry-content dfn,
.comment-content dfn,
.entry-content acronym,
.comment-content acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
.entry-content address,
.comment-content address {
display: block;
line-height: 1.714285714;
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
}
img.alignleft,
.wp-caption.alignleft {
margin: 7px 28px 28px 0;
margin: 0.5rem 2rem 2rem 0;
}
img.alignright,
.wp-caption.alignright {
margin: 12px 0 12px 24px;
margin: 0.857142857rem 0 0.857142857rem 1.714285714rem;
}
img.aligncenter,
.wp-caption.aligncenter {
clear: both;
margin-top: 12px;
margin-top: 0.857142857rem;
margin-bottom: 12px;
margin-bottom: 0.857142857rem;
}
.entry-content embed,
.entry-content iframe,
.entry-content object,
.entry-content video {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.entry-content dl,
.comment-content dl {
margin: 0 24px;
margin: 0 1.714285714rem;
}
.entry-content dt,
.comment-content dt {
font-weight: bold;
line-height: 1.714285714;
}
.entry-content dd,
.comment-content dd {
line-height: 1.714285714;
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.entry-content table,
.comment-content table {
border-bottom: 1px solid #ededed;
color: #757575;
font-size: 16px;
font-size: 1.14258571rem;
line-height: 2;
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
width: 100%;
}
.entry-content table thead td,
.comment-content table thead td{
font-weight: bolder;
}
.entry-content table caption,
.comment-content table caption {
font-size: 16px;
font-size: 1.142857143rem;
margin: 24px 0;
margin: 1.714285714rem 0;
}
.entry-content td,
.comment-content td {
border-top: 1px solid #ededed;
padding: 6px 10px 6px 10px;
}
.site-content article {
border-bottom: 1px solid #ededed;
margin-bottom: 45px;
margin-bottom: 3.042857143rem;
padding-bottom: 45px;
padding-bottom: 3.042857143rem;
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
article.error404 { border-bottom: none}
.page-links {
clear: both;
line-height: 1.714285714;
}
footer.entry-meta {
margin-top: 24px;
margin-top: 1.714285714rem;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
color: #757575;
}
.single-author .entry-meta .by-author {
display: none;
}
.mu_register h2 {
color: #757575;
font-weight: normal;
}
/* =Archives
-------------------------------------------------------------- */
.archive-header,
.page-header {
margin-bottom: 48px;
margin-bottom: 3.428571429rem;
padding-bottom: 22px;
padding-bottom: 1.571428571rem;
border-bottom: 1px solid #ededed;
}
.archive-meta {
color: #757575;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 2;
margin-top: 0;
}
/* =Single audio/video attachment view
-------------------------------------------------------------- */
.attachment .entry-content .mejs-audio {
max-width: 400px;
}
.attachment .entry-content .mejs-container {
margin-bottom: 24px;
}
/* =Single image attachment view
-------------------------------------------------------------- */
.article.attachment {
overflow: hidden;
}
.image-attachment div.attachment {
text-align: center;
}
.image-attachment div.attachment p {
text-align: center;
}
.image-attachment div.attachment img {
display: block;
height: auto;
margin: 0 auto;
max-width: 100%;
}
.image-attachment .entry-caption {
margin-top: 8px;
margin-top: 0.571428571rem;
}
/* =Aside post format
-------------------------------------------------------------- */
article.format-aside h1 {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
article.format-aside h1 a {
text-decoration: none;
color: #4d525a;
}
article.format-aside h1 a:hover {
color: #2e3542;
}
article.format-aside .aside {
padding: 24px 24px 0;
padding: 1.714285714rem;
background: #d2e0f9;
border-left: 22px solid #a8bfe8;
}
article.format-aside p {
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
color: #4a5466;
}
article.format-aside blockquote:last-child,
article.format-aside p:last-child {
margin-bottom: 0;
}
/* =Post formats
-------------------------------------------------------------- */
/* Image posts */
article.format-image footer h1 {
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
font-weight: normal;
}
article.format-image footer h2 {
font-size: 11px;
font-size: 0.785714286rem;
line-height: 2.181818182;
}
article.format-image footer a h2 {
font-weight: normal;
}
/* Link posts */
article.format-link header {
padding: 0 10px;
padding: 0 0.714285714rem;
float: right;
font-size: 11px;
font-size: 0.785714286rem;
line-height: 2.181818182;
font-weight: bold;
font-style: italic;
text-transform: uppercase;
color: #848484;
background-color: #ebebeb;
border-radius: 3px;
}
article.format-link .entry-content {
max-width: 80%;
float: left;
}
article.format-link .entry-content a {
font-size: 22px;
font-size: 1.571428571rem;
line-height: 1.090909091;
text-decoration: none;
}
/* Quote posts */
article.format-quote .entry-content p {
margin: 0;
padding-bottom: 24px;
padding-bottom: 1.714285714rem;
}
article.format-quote .entry-content blockquote {
display: block;
padding: 24px 24px 0;
padding: 1.714285714rem 1.714285714rem 0;
font-size: 15px;
font-size: 1.071428571rem;
line-height: 1.6;
font-style: normal;
color: #6a6a6a;
background: #efefef;
}
/* Status posts */
.format-status .entry-header {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.format-status .entry-header header {
display: inline-block;
}
.format-status .entry-header h1 {
font-size: 15px;
font-size: 1.071428571rem;
font-weight: normal;
line-height: 1.6;
margin: 0;
}
.format-status .entry-header h2 {
font-size: 12px;
font-size: 0.857142857rem;
font-weight: normal;
line-height: 2;
margin: 0;
}
.format-status .entry-header header a {
color: #757575;
}
.format-status .entry-header header a:hover {
color: #21759b;
}
.format-status .entry-header img {
float: left;
margin-right: 21px;
margin-right: 1.5rem;
}
/* =Comments
-------------------------------------------------------------- */
.comments-title {
margin-bottom: 48px;
margin-bottom: 3.428571429rem;
font-size: 16px;
font-size: 1.142857143rem;
line-height: 1.5;
font-weight: normal;
}
.comments-area article {
margin: 24px 0;
margin: 1.714285714rem 0;
}
.comments-area article header {
margin: 0 0 48px;
margin: 0 0 3.428571429rem;
overflow: hidden;
position: relative;
}
.comments-area article header img {
float: left;
padding: 0;
line-height: 0;
}
.comments-area article header cite,
.comments-area article header time {
display: block;
margin-left: 85px;
margin-left: 6.071428571rem;
}
.comments-area article header cite {
font-style: normal;
font-size: 15px;
font-size: 1.071428571rem;
line-height: 1.42857143;
}
.comments-area cite b {
font-weight: normal;
}
.comments-area article header time {
line-height: 1.714285714;
text-decoration: none;
font-size: 12px;
font-size: 0.857142857rem;
color: #5e5e5e;
}
.comments-area article header a {
text-decoration: none;
color: #5e5e5e;
}
.comments-area article header a:hover {
color: #21759b;
}
.comments-area article header cite a {
color: #444;
}
.comments-area article header cite a:hover {
text-decoration: underline;
}
.comments-area article header h4 {
position: absolute;
top: 0;
right: 0;
padding: 6px 12px;
padding: 0.428571429rem 0.857142857rem;
font-size: 12px;
font-size: 0.857142857rem;
font-weight: normal;
color: #fff;
background-color: #0088d0;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top, #009cee, #0088d0);
background-image: -ms-linear-gradient(top, #009cee, #0088d0);
background-image: -webkit-linear-gradient(top, #009cee, #0088d0);
background-image: -o-linear-gradient(top, #009cee, #0088d0);
background-image: linear-gradient(top, #009cee, #0088d0);
border-radius: 3px;
border: 1px solid #007cbd;
}
.comments-area .bypostauthor cite span {
position: absolute;
margin-left: 5px;
margin-left: 0.357142857rem;
padding: 2px 5px;
padding: 0.142857143rem 0.357142857rem;
font-size: 10px;
font-size: 0.714285714rem;
}
.comments-area .bypostauthor cite b {
font-weight: bold;
}
a.comment-reply-link,
a.comment-edit-link {
color: #686868;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
}
a.comment-reply-link:hover,
a.comment-edit-link:hover {
color: #21759b;
}
.commentlist .pingback {
line-height: 1.714285714;
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
/* Comment form */
#respond {
margin-top: 48px;
margin-top: 3.428571429rem;
}
#respond h3#reply-title {
font-size: 16px;
font-size: 1.142857143rem;
line-height: 1.5;
}
#respond h3#reply-title #cancel-comment-reply-link {
margin-left: 10px;
margin-left: 0.714285714rem;
font-weight: normal;
font-size: 12px;
font-size: 0.857142857rem;
}
#respond form {
margin: 24px 0;
margin: 1.714285714rem 0;
}
#respond form p {
margin: 11px 0;
margin: 0.785714286rem 0;
}
#respond form p.logged-in-as {
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
#respond form label {
display: block;
line-height: 1.714285714;
}
#respond form input[type="text"],
#respond form textarea {
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 1.714285714;
padding: 10px;
padding: 0.714285714rem;
width: 100%;
}
#respond form p.form-allowed-tags {
margin: 0;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 2;
color: #5e5e5e;
}
.required {
color: red;
}
/* =Front page template
-------------------------------------------------------------- */
.entry-page-image {
margin-bottom: 14px;
margin-bottom: 1rem;
}
.template-front-page .site-content article {
border: 0;
margin-bottom: 0;
}
.template-front-page .widget-area {
clear: both;
float: none;
width: auto;
padding-top: 24px;
padding-top: 1.714285714rem;
border-top: 1px solid #ededed;
}
.template-front-page .widget-area .widget li {
margin: 8px 0 0;
margin: 0.571428571rem 0 0;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.714285714;
list-style-type: square;
list-style-position: inside;
}
.template-front-page .widget-area .widget li a {
color: #757575;
}
.template-front-page .widget-area .widget li a:hover {
color: #21759b;
}
.template-front-page .widget-area .widget_text img {
float: left;
margin: 8px 24px 8px 0;
margin: 0.571428571rem 1.714285714rem 0.571428571rem 0;
}
/* =Widgets
-------------------------------------------------------------- */
.widget-area .widget ul ul {
margin-left: 12px;
margin-left: 0.857142857rem;
}
.widget_rss li {
margin: 12px 0;
margin: 0.857142857rem 0;
}
.widget_recent_entries .post-date,
.widget_rss .rss-date {
color: #aaa;
font-size: 11px;
font-size: 0.785714286rem;
margin-left: 12px;
margin-left: 0.857142857rem;
}
#wp-calendar {
margin: 0;
width: 100%;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
color: #686868;
}
#wp-calendar th,
#wp-calendar td,
#wp-calendar caption {
text-align: left;
}
#wp-calendar #next {
padding-right: 24px;
padding-right: 1.714285714rem;
text-align: right;
}
.widget_search label {
display: block;
font-size: 13px;
font-size: 0.928571429rem;
line-height: 1.846153846;
}
.widget_twitter li {
list-style-type: none;
}
.widget_twitter .timesince {
display: block;
text-align: right;
}
#searchsubmit { padding:4px 8px;}
.site-info { text-align: center}
.site-logo {
width:163px;/* height:58px;*/
max-width:98%;
display:block; float:none; margin:1.5rem auto 0 auto; overflow: hidden;
}
.site-logo img {width:100%; height:auto}
.site-title,
.site-description { clear:right;}
.tagcloud { overflow:hidden;}
.tagcloud a {padding:3px; float:left; display:inline-block;
-webkit-transition: background 0.2s ease;
transition: background 0.2s ease;}
.tagcloud a:hover { text-decoration: none!important; background-color:#333; color: #fff!important }
/* =Plugins
----------------------------------------------- */
img#wpstats {
display: block;
margin: 0 auto 24px;
margin: 0 auto 1.714285714rem;
}
/*wp-pagenavi*/
.wp-pagenavi {
clear: both;
text-align: center;
margin: 3rem auto;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
border-color: #008dd7;
background: #008dd7;
color: #fff;
text-decoration: none;
}
.wp-pagenavi span.pages {
border: none;
width: 30px;
}
/*homepage*/
a.more {
float: right;
width:auto;
height:22px;
color:#333;
font-size: 12px;
line-height: 22px;
margin:0;
display: inline-block;
text-align: center;
text-decoration: none;
border:1px solid #d3d3d3;
border-radius: 2px;
background:#fff;
padding:0 12px;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
a.more i{
color: #43c9ac;
-webkit-transition: all 0.2s;
transition: all 0.2s;
-webkit-transform-origin: center center;
transform-origin: center center;
}
a.more:hover {
color:#43c9ac;
}
a.more:hover i{
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
}
#home-headimage {
width:100%;
height:130px;
overflow: hidden;
}
#home-block1,
#home-block2,
#home-block3 {
overflow: hidden;
position: relative;/*to hold the more button*/
}
.full-padding {
padding-left:0;
padding-right:0;
}
.full-padding img {
max-width: 100%;
}
.category-title {
margin-bottom: 8px;
margin-top: 21px;
}
#home-block1 { background-color: #f0f0f0; }
#home-block2 { background-color: #ebebeb; }
#home-block3 { background-color: #eee; }
h2.home-title {
background: url(images/icon_arrow.gif) no-repeat;
background-position: 0 5px;
font-size: 17px ;
font-size: 1.2143rem;
padding-left: 18px;
padding-right: 0;
line-height: 1.5;
margin: 21px 0 14px 0;
margin: 1.5rem 0 1rem 0;
font-weight: normal;
}
.full-padding {
max-width: 1130px;
margin: 0 auto;
overflow: hidden;
}
.home-blocks p,
.home-blocks ul {
margin: 14px 0 21px 0;
margin: 1rem 0 1.5rem 0;
font-size: 15px;
font-size: 1.07147285rem;
line-height: 1.7;
}
.home-blocks h1 {
font-size:21px;
font-size:1.5rem;
font-weight: 300;
margin:21px 0 21px 0;
margin:1.5rem 0 1.5rem 0;
line-height: 1.5;
}
.home-blocks h2 {
text-align: left;
font-size: 21px;
font-size: 1.5rem;
font-weight: 600;
margin-bottom: 7px;
display: inline-block;
}
.home-blocks .sub-title{
display: block;
text-align: left;
color: #999;
font-size: 10px;
text-transform: uppercase;
margin-bottom: 21px;
margin-top: 0;
max-width: -webkit-calc(100% - 100px);
max-width: calc(100% - 100px);
}
.home-blocks .sub-title:hover{
/*text-decoration: none;
color:#111;*/
}
.swiper-container #slide-first{
background:url(images/top-home.jpg) center top no-repeat;
background-size: 150% auto;
height:420px;
}
#home-intro-left h1{
font-weight: 600;
margin-bottom: 7px;
}
#home-intro-right img{
display: block;
margin:0 auto 28px auto;
max-width: 100%;
}
#home-product{
background-color: #f4f4f4;
}
#home-product .site{
overflow: hidden;
margin:42px auto;
margin:3rem auto;
}
ul.home-product-list{
width:100%;
overflow: hidden;
margin-top: 42px;
margin-top: 3rem;
margin-bottom: 28px;
margin-bottom: 2rem;
font-size: 0;
}
li.home-product-item{
position: relative;
display: inline-block;
width:25%;
width:-webkit-calc(25% - 5px);
width:calc(25% - 5px);
margin-right: 5px;
margin-bottom: 5px;
overflow: hidden;
background-color: #fff;
cursor: pointer;
}
@media screen and (max-width: 768px) {
li.home-product-item{
width:50%;
width:-webkit-calc(50% - 5px);
width:calc(50% - 5px);
}
}
@media screen and (max-width: 480px) {
/*li.home-product-item{
width:100%;
margin-right: 0;
}*/
}
li.home-product-item h3{
position: relative;
font-size: 18px;
color:#43c9ac;
font-weight: 500;
padding: 14px 21px;
margin-bottom: 28px;
z-index: 2;
}
li.home-product-item h3:after{
position: absolute;
content:"";
display: block;
background-color: #43c9ac;
width:30px;
height:3px;
top: 48px;
left: 21px;
}
li.home-product-item img {
display: block;
height: auto;
width: 90%;
margin: 15px auto;
}
li.home-product-item .home-product-arrow,
li.home-product-item .home-product-more{
position: relative;
width: 100%;
display: block;
text-align: center;
background-color: #43c9ac;
color: #fff;
height:45px;
line-height: 45px;
font-size: 28px;
z-index: 2;
}
li.home-product-item .home-product-more{
position: absolute;
font-size: 14px;
bottom: 0;
-webkit-opacity: 0;
opacity: 0;
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.home-product-tech{
position: absolute;
top:0;
left: 0;
background-color: #43c9ac;
color:#000;
padding: 88px 21px 0 21px;
font-size: 14px;
height: 400px;
z-index: 1;
-webkit-opacity: 0;
opacity: 0;
-webkit-transition: all 0.3s;
transition: all 0.3s;
font-size: 14px;
font-size: 1rem
}
.home-product-tech p{
margin:0;
font-size: 14px;
font-size: 1rem;
}
@media screen and (max-width: 480px) {
.home-product-tech,
.home-product-tech p{
font-size: 12px;
}
}
li.home-product-item:hover h3{
color: #fff
}
li.home-product-item:hover h3:after{
background-color: #fff;
}
li.home-product-item:hover .home-product-tech{
-webkit-opacity: 1;
opacity: 1;
padding-top:68px;
}
li.home-product-item:hover .home-product-more{
-webkit-opacity: 1;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
#home-certificate{
background:#fff;
background-size: 100% auto;
}
#home-certificate .site{
overflow: hidden;
margin:42px auto;
margin:3rem auto;
position: relative;
}
#home-certificate .swiper-container{
}
#home-certificate .swiper-slide{
width:190px;
text-align: center;
line-height:1.5;
}
#home-certificate .swiper-slide a{
height: 206px;
display: inline-block;
vertical-align: middle;
text-align: center;
line-height: 206px;
margin: 10px auto;
border:1px solid #eee;
}
#home-certificate .swiper-slide img {
max-width: 95%;
max-height: 200px;
height: auto;
vertical-align: middle;
border: 3px solid #fff;
}
#home-certificate .swiper-slide p{
margin: 5px auto;
max-width: 90%;
font-size: 13px;
}
#home-certificate .site .swiper-button-prev,
#home-certificate .site .swiper-container-rtl .swiper-button-next{
left:0;
top:50%;
}
#home-certificate .site .swiper-button-next,
#home-certificate .site .swiper-container-rtl .swiper-button-prev{
right:0;
top:50%;
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%232fc3a3'%2F%3E%3C%2Fsvg%3E")
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%232fc3a3'%2F%3E%3C%2Fsvg%3E")
}
@media screen and (max-width: 768px) {
#home-certificate h2 br{
display: none;
}
#home-certificate .swiper-slide{
width:180px;
}
}
#home-team{
background:#f4f4f4;
}
#home-team .site{
overflow: hidden;
margin:42px auto;
margin:3rem auto;
}
#home-team .home-team-list,
.home-team-list{
font-size: 0!important;
list-style: none;
overflow: hidden;
}
li.home-team-item{
margin:0;
}
li.home-team-item a {
font-size: 0;
display: block;
overflow: hidden;
}
li.home-team-item img{
width:100%;
height:auto;
-webkit-transition: all 0.3s;
transition: all 0.3s;
-webkit-transform: scale(1,1);
transform: scale(1,1);
}
li.home-team-item a:hover img{
-webkit-transform: scale(1.05,1.05);
transform: scale(1.05,1.05);
}
#home-team-p-1,
#home-team-p-2{
float:left;
width:25%;
width:-webkit-calc(25% - 5px);
width:calc(25% - 5px);
margin-right:5px;
}
#home-team-p-3{
float:right;
width:50%;
}
#home-team-p-4{
float:left;
width:50%;
width:-webkit-calc(50% - 5px);
width:calc(50% - 5px);
margin-top:5px;
margin-right:5px;
}
@media screen and (max-width: 768px) {
#home-team-p-1{
float:left;
width:50%;
width:-webkit-calc(50% - 2.5px);
width:calc(50% - 2.5px);
margin:0;
}
#home-team-p-2{
float:right;
width:50%;
width:-webkit-calc(50% - 2.5px);
width:calc(50% - 2.5px);
margin:0;
}
#home-team-p-3,
#home-team-p-4{
width:100%;
margin:5px 0 0 0;
}
}
#home-posts{
padding: 28px 0;
padding: 2rem 0;
}
#home-posts time{
display: inline-block;
vertical-align: middle;
padding: 0px 6px;
color: #fff;
background: #abe1fd;
margin-right: 4px;
border-radius: 2px;
line-height: 1.5;
font-size: 12px;
}
.home_more{
margin: 0 auto;
display: block;
width: 56px;
text-align: center;
clear: both;
float:right;
}
.home_post_container {
margin-bottom: 14px;
margin-bottom: 1rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.inner_post_container{
margin-bottom: 21px;
margin-bottom: 1.5rem;
}
.footerSubscriber {
width:90%;
max-width:300px;
margin:0 auto;
}
.footerSubscriber form{
margin-top:7px;
margin-top:0.5rem;
}
.footerSubscriber #mail{
width: -webkit-calc(100% - 105px);
width: calc(100% - 105px);
line-height: 2.1;
border-radius: 15px;
padding: 0;
padding-left: 15px;
border-width: 0;
outline: none;
height:30px;
}
.footerSubscriber #subscribe{
width:80px;
padding: 6px 0;
font-weight: 400;
border-radius: 15px;
outline: none;
}
.footerSubscriber p{
margin:21px 0;
margin:1.5rem 0;
}
.footerSubscriber p a{
display: inline-block;
vertical-align: middle;
margin-left: 6px;
font-size: 0;
}
.footerContent {
text-align: center
}
.footerConnect img{
border:3px solid #fff;
width: 90px;
height: 90px;
}
.footerLink {
text-align: center;
font-size: 13px;
font-size: 0.928571429rem;
padding-bottom: 14px;
padding-bottom: 1rem;
padding-top: 14px;
padding-top: 1rem;
line-height: 1.6;
}
.friend-link {
display: inline;
}
.footer-menu {
/*display: none;*/
}
.copyright{
margin-top:14px;
margin-top:1rem;
margin-bottom:14px;
margin-bottom:1rem;
font-weight:400;
}
.friend-link li,
.footer-menu li {
display: inline-block;
padding:0;
width:48%;
}
footer .site-info {
margin:0 auto;
}
#footerLinkCont {
margin-top: 0;
border-top: 1px solid #ddd;
position: relative;
}
.icon_f{ width:20px; height:20px; background:url(images/facebook_icon.gif) no-repeat; display: inline-block; margin-right: 6px; padding: 0!important; vertical-align: text-bottom; }
.icon_t{ width:20px; height:20px; background:url(images/twitter_icon.gif) no-repeat; display: inline-block; margin-right: 0; padding: 0!important; vertical-align: text-bottom; }
/*inner pages*/
div#content {
min-height: 150px;
}
.top-image {
background-position: center top;
background-repeat: no-repeat;
height: 70px;
background-size:auto 100%;
width:100%;
}
#top-inner {
display: none;
background-image: url(images/bg_top_inner.jpg);
background-position: center top;
background-repeat: no-repeat;
background-color: #fff;
height:294px;
}
.content-with-sub {
min-height: 300px;
}
.sub-nav {
margin: 21px 0 28px 0;
margin: 1.5rem 0 2rem 0;
width:100%;
overflow: hidden;
}
.sub-nav ul {
overflow: hidden;
background-color: #f2f2f2;
}
.sub-nav li {
background-color: #fafafa;
height:35px;
line-height: 35px;
margin-top: 1px;
overflow: hidden;
width:50%;
float:left;
}
.sub-nav li a{
display: block;
padding-left: 20px;
border-right:1px solid rgba(0,0,0,0.1);
}
.sub-nav li a:hover,
.sub-nav li.current_page_item{
text-decoration: none;
background-color: #fff;
}
.sub-nav li.current-menu-item,
#menu-knowledge li.current_page_item {
background-color: #fff;
}
.sub-nav-title {
text-align: center;
color:#000;
font-size: 16px;
font-size: 1.225714286rem;
height:35px;
line-height:35px;
overflow: hidden;
background-color: #fff;
border-bottom: 2px solid #008dd7;
}
.sub-nav-title span {
display: inline-block;
padding-left:24px;
}
.sub-nav li.sub-nav-name {
border-left:none;
line-height:28px;
height:28px;
background-color: #fcfcfc;
width: 100%;
text-align: center;
}
.sub-nav li.sub-nav-name span{
display: inline-block;
padding-left:23px;
color:#e83c16;
}
#title-about {
}
#secondary { text-align:center; }
/*about page*/
span.heightlight{
color: #003274;
}
.certi-container,
.techi-container{
display: inline-block;
text-align: center;
width:32.5%;
vertical-align: top;
font-size: 15px;
font-size: 1.072854rem;
line-height: 1.5;
margin-bottom: 14px;;
margin-bottom: 1rem;
}
@media screen and (max-width: 600px) {
.certi-container,
.techi-container{
width:49%;
}
}
.certi-container a,
.techi-container a{
display:inline-block;
height:220px;
line-height:220px;
}
.techi-container a{
height:150px;
line-height:150px;
}
.certi-container a img,
.techi-container a img{
max-width:180px;
max-height:220px;
width:auto;
height:auto;
vertical-align: middle;
}
.techi-container a img{
max-height:120px;
}
/*product page*/
.product-list{
font-size: 0;
}
.product-item{
display: inline-block;
width:100%;
margin: 0 0 21px 0;
overflow: hidden;
}
@media screen and (min-width: 768px) {
.product-item{
width:50%;
width:-webkit-calc(50% - 28px);
width:calc(50% - 28px);
margin: 0 28px 56px 0;
}
.product-item:nth-child(even){
margin: 0 0 56px 28px;
}
}
.product-item .product-thumb,
.product-item .product-tech{
width:100%;
box-sizing: border-box;
}
@media screen and (min-width: 480px) {
.product-item .product-thumb,
.product-item .product-tech{
width:50%;
float: left;
min-height: 250px;
}
}
.product-item .product-thumb img{
width:95%;
height: auto;
}
.product-item .product-tech{
padding:15px;
line-height: 1.8;
font-size: 14px;
font-size: 1rem;
background-color: #fafafa;
}
li.product-item h3{
position: relative;
font-size: 18px;
color:#43c9ac;
font-weight: 500;
padding: 14px 0;
margin-bottom: 21px;
z-index: 2;
}
li.product-item h3:after{
position: absolute;
content:"";
display: block;
background-color: #43c9ac;
width:30px;
height:3px;
top: 40px;
left: 0;
}
.faq{
overflow: hidden;
background-color:#fdfdfd;
margin-bottom: 15px;
padding:0 14px;
-webkit-transition:height 0.5s;
transition:height 0.5s;
}
.faq h3{
margin:0 -15px 20px -15px;
padding:5px 15px;
border-bottom: 1px solid #eee;
cursor:pointer;
font-size:16px;
background-color: #f2f2f2;
background-image:url(images/faq-arraw.png);
background-repeat: no-repeat;
background-position: right top;
-webkit-transition:background 0.3s;
transition:background 0.3s;
}
.faq h3.on{
background-position:right -200px;
}
/*contact us page*/
#contact-left {
border-bottom:1px solid #ededed;
padding-bottom:30px;
margin-bottom:30px;
min-height:250px;
}
#contact-right {
line-height: 2.114285714;
margin-bottom: 30px
}
#countrySelect {
margin:0 0 14px 0;
margin:0 0 1rem 0;
}
.contList h3 {
margin-bottom: 6px;
font-weight: normal;
}
.contList {
margin-top: 14px;
margin-top: 1rem;
}
.contList li {
list-style:none;
overflow: hidden;
line-height: 22px;
padding: 5px 0;
margin-left: 0;
}
.contList li strong {
display:block;
width:180px;
height:30px;
}
.itemName {
display: inline-block;
width:100px;
color:#999;
}
#dituContent {
margin-top:30px;
margin-bottom:30px;
width:100%;
height:300px;
border:1px solid #ededed;
}
/*gravity forms*/
.gform_wrapper.gf_browser_chrome .gform_body {
width: 100%;
}
.gform_wrapper .top_label .gfield_label,
.gform_wrapper .left_label .gfield_label {
font-weight: normal!important;
}
.gform_wrapper li.gfield.gfield_error,
.gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
background-color: #ffe6b1!important;
border-top: 1px solid #b78123!important;
border-bottom: 1px solid #b78123!important;
}
.gform_wrapper div.validation_error {
color: #b78123!important;
}
.gform_wrapper .gform_footer input.button,
.gform_wrapper .gform_footer input[type=submit] {
margin: 0;
}
.gform_wrapper .left_label .gfield_label {
width: 30%!important;
margin: 0!important;
}
.gform_wrapper form .gform_body .left_label li.gfield_html_formatted,
.gform_wrapper form .gform_body .right_label li.gfield_html_formatted{
margin-left: 0%!important;
width: 100%;
}
.gform_wrapper .ginput_complex label {
padding: .625em 0 1em;
}
.gform_confirmation_message{
line-height: 1.6;
}
@media screen and (min-width: 768px) {
.gform_wrapper .left_label div.ginput_complex,
.gform_wrapper .right_label div.ginput_complex {
width: 35.5%!important;
}
}
/*baidu map*/
.iw_poi_title {color:#e83c16;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
.iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
/* =Media queries
-------------------------------------------------------------- */
/* Does the same thing as ,
* but in the future W3C standard way. -ms- prefix is required for IE10+ to
* render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
* the meta tag. See http://core.trac.wordpress.org/ticket/25888.
*/
@-ms-viewport {
width: device-width;
}
@viewport {
width: device-width;
}
@media screen and (min-width: 600px) {
.friend-link li,
.footer-menu li {
width:32%;
}
}
@media screen and (min-width: 450px) {
#home-headimage { height:230px; }
}
/* Minimum width of 768 pixels. */
@media screen and (min-width: 768px) {
.author-avatar {
float: left;
margin-top: 8px;
margin-top: 0.571428571rem;
}
.author-description {
float: right;
width: 80%;
}
.site {
margin: 0 auto;
max-width: 1208px;
/*max-width: 71.4285rem;
overflow: hidden;*/
}
.site-logo{
}
.site-content {
float: left;
/*width: 65.104166667%;*/
width: 76%;
}
body.template-front-page .site-content,
body.attachment .site-content,
body.full-width .site-content,
div.full-width,
section.full-width {
width: 100%;
}
.widget-area {
float: right;
/*width: 26.041666667%;*/
width: 20%;
}
.site-header {
min-height: 91px;
}
.site-header h1,
.site-header h2 {
text-align: left;
float:left;
width: 80%;
width:-webkit-calc(100% - 95px);
width:calc(100% - 95px);
}
.site-header h1 {
font-size: 26px;
font-size: 1.857142857rem;
line-height: 1.546153846;
margin-bottom: 0;
}
.menu-toggle {
display: none;
}
.main-navigation {
}
.main-navigation ul.nav-menu{
overflow: visible;
}
.main-navigation ul.nav-menu.toggled-on {
margin-top: 0;
margin-bottom: 0
}
.main-navigation ul.nav-menu li {
border-top:none;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
height:auto!important;
display: inline-block !important;
text-align: center;
width: 100%;
}
.main-navigation ul {
margin: 0;
text-indent: 0;
}
.main-navigation li {
padding:0;
}
.main-navigation li a,
.main-navigation li {
display: inline-block;
text-decoration: none;
font-size: 15px;
font-size: 1.071428571rem;
}
.main-navigation li a {
padding:0 21px;
padding:0 1.5rem;
display: block;
color: #333;
line-height: 3;
background-color:#fff;
/*text-transform: uppercase;*/
white-space: nowrap;
-webkit-transition: background 0.2s ease, border 0.2s ease;
transition: background 0.2s ease, border 0.2s ease;
}
.main-navigation .current-menu-item a:hover,
.main-navigation .current-menu-ancestor a:hover,
.main-navigation .current_page_item a:hover,
.main-navigation .current_page_ancestor a:hover,
.main-navigation a:hover,
.main-navigation a:focus{
color: #43c9ac;
background-color: #fff;
}
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_item > a,
.main-navigation .current_page_ancestor > a {
color: #43c9ac;
background-color: #fff;
/*font-weight: bolder;*/
/*background-image: url(images/bg_nav_current.png);
background-repeat: repeat-x;*/
}
.main-navigation li {
position: relative;
}
.main-navigation li ul {
margin: 0;
padding: 0;
position: absolute;
top: 100%;
z-index: 50;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
left:-webkit-calc(50% - 96px);
left:calc(50% - 96px);
}
.main-navigation li ul ul {
top: 0;
left: 100%;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li:focus > ul,
.main-navigation .focus > ul {
border-left: 0;
clip: inherit;
overflow: inherit;
height: inherit;
width: inherit;
}
.main-navigation li ul li a {
background: #fff;
text-align: center;
border-bottom: 1px solid #fafafa;
display: block;
/*font-size: 11px;
font-size: 0.785714286rem;*/
/*line-height: 2.181818182;*/
/*padding: 8px 10px;
padding: 0.571428571rem 0.714285714rem;*/
width: 145px;
white-space: normal;
}
.main-navigation li ul li a:hover,
.main-navigation li ul li a:focus {
background: #fff;
color: #43c9ac;
}
.swiper-container #slide-first{
background-size: 100% auto;
}
#slide1-video{
display: block;
float:left;
/*width:-webkit-calc(46% - 90px);
width:calc(46% - 90px);*/
width:-webkit-calc(50% - 90px);
width:calc(50% - 90px);
height:100%;
vertical-align:bottom;
position: relative;
}
#slide1-product{
display: none;
float:left;
width:-webkit-calc(54% - 100px);
width:calc(54% - 100px);
height:100%;
vertical-align:bottom;
position: relative;
background:url(images/slide1-product.png) center bottom no-repeat;
background-size: 95% auto;
}
#slide1-video #myVideo{
position: absolute;
z-index: 0;
bottom: 25px;
max-width: 100%;
box-shadow: 0 0 20px 0px #fff;
}
#slide1-bt {
float:right;
width:180px;
height:100%;
text-align: center;
vertical-align:bottom;
position: relative;
}
#slide1-bt a{
position: absolute;
bottom: 25px;
right: 5px;
z-index: 1;
}
#slide1-bt .button.big{
padding:15px 35px;
}
#respond form input[type="text"] {
width: 46.333333333%;
}
#respond form textarea.blog-textarea {
width: 79.666666667%;
}
.template-front-page .site-content,
.template-front-page article {
overflow: hidden;
}
.template-front-page.has-post-thumbnail article {
float: left;
width: 47.916666667%;
}
.entry-page-image {
float: right;
margin-bottom: 0;
width: 47.916666667%;
}
.template-front-page .widget-area .widget,
.template-front-page.two-sidebars .widget-area .front-widgets {
float: left;
width: 51.875%;
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
.template-front-page .widget-area .widget:nth-child(odd) {
clear: right;
}
.template-front-page .widget-area .widget:nth-child(even),
.template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets {
float: right;
width: 39.0625%;
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
}
.template-front-page.two-sidebars .widget,
.template-front-page.two-sidebars .widget:nth-child(even) {
float: none;
width: auto;
}
.commentlist .children {
margin-left: 48px;
margin-left: 3.428571429rem;
}
#home-intro-left{
float:left;
width:56%;
}
#home-intro-left h1{
margin-top:0;
}
#home-intro-right{
float:right;
width:40%;
padding-top: 21px;
padding-top: 1.5rem;
}
.home-blocks .home_post_container{
width:49.5%;
margin-right: 0.5%;
float:left;
}
#home-headimage { height:220px; }
#home-block1,
#home-block2,
#home-block3{
/*width:33.3%;*/
width:50%;
float:left;
overflow: hidden;
padding-bottom: 200px;
margin-bottom: -200px;
}
.footerSubscriber {
float:right;
display: block;
text-align: left;
}
.footerContent {
/*float:left;
text-align: left;
width:50%;
width:-webkit-calc(100% - 400px);
width:calc(100% - 400px);*/
}
.footerConnect {
text-align: right;
float:right;
width:120px;
}
.footer-menu {
display: block;
/*margin-bottom: 14px;
margin-bottom: 1rem;*/
}
.footerLink {
text-align: left;
}
.friend-link li,
.footer-menu li {
padding:0 30px;
padding-left: 0;
width:auto;
}
#top-inner {
display: block;
}
.top-image {
height: 150px;
background-size:auto 100%;
}
.sub-nav {
float: left;
width:180px;
}
.sub-nav-title {
text-align: left;
}
.sub-nav li {
border-left:3px solid #999;
width:auto;
float:none;
}
.sub-nav li a{
border-right:none;
}
.sub-nav li a:hover{
}
.sub-nav li.current-menu-item,
#menu-knowledge li.current_page_item {
border-left:3px solid #333;
}
.sub-nav li.sub-nav-name {
text-align: left;
}
.sub-nav li.sub-nav-name span{
padding-left:23px;
}
.content-with-sub {
border-left: 1px solid rgba(0,0,0,0.1);
width:76%;
width:-webkit-calc(100% - 210px);
width:calc(100% - 210px);
float:right!important;
padding-left: 28px;
padding-bottom: 60px;
}
.content-left {
float:left;
width:76%;
width:-webkit-calc(100% - 230px);
width:calc(100% - 230px);
}
.content-right{
float:right;
width:200px;
}
/*contact us page*/
#contact-left {
float:left;
width:33.5%;
width:-webkit-calc(40% - 50px);
width:calc(40% - 50px);
/*border-right:1px solid #ededed;*/
padding-right:40px;
margin-right:40px;
border-bottom: none;
min-height:450px;
/*margin-bottom: -300px;
padding-bottom: 300px;*/
}
#contact-right {
float:right;
width:55%;
width:-webkit-calc(59.5% - 30px);
width:calc(59.5% - 30px);
/*margin-bottom: -300px;
padding-bottom: 300px;*/
margin-top: 14px;
}
.contList li {
}
.contList li strong {
display:inline-block;
float: left;
}
div#page { clear:both;
/*margin-bottom: 42px;
margin-bottom: 3rem;*/
}
}
/* Minimum width of 1024 pixels. */
@media screen and (min-width: 1024px) {
body.custom-background-empty {
background-color: #fff;
}
body.custom-background-empty .site,
body.custom-background-white .site {
padding: 0;
margin-top: 0;
margin-bottom: 0;
box-shadow: none;
}
.site-header {
background-image: url(images/bg-topbar.png);
background-repeat: no-repeat;
background-position: center center;
}
.site-logo{
float:left;
margin:20px;
margin-left:0;
}
.main-navigation {
/*float: left;*/
clear: none;
width: 50%;
width: -webkit-calc(100% - 400px);
width: calc(100% - 400px);
margin-top: 26px;
display: inline-block;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
text-align: left;
}
.main-navigation li a{
padding: 0 21px;
}
#home-headimage {
height:260px;
}
.home-blocks{
padding: 0 28px;
padding: 0 2rem;
}
.home-blocks .home-blocks-cont li{
float:left;
width: 49.9%;
}
#home-posts{
padding: 28px;
padding: 2rem;
}
footer[role="contentinfo"]{
background:url(images/bg-footer.png) center top no-repeat transparent;
height:170px;
}
body.page-template-homepage footer[role="contentinfo"]{
background-color:#f4f4f4;
}
.copyright{
margin-top:91px;
margin-top:6.5rem;
}
}
/* Minimum width of 1200 pixels. */
@media screen and (min-width: 1200px) {
.site-header{
position: fixed;
z-index: 99;
top:0;
/*background-color: transparent;*/
}
.site-logo{
width:163px;
height:47px;
}
.admin-bar .site-header{
top:32px;
}
.main-navigation {
width: -webkit-calc(100% - 400px);
width: calc(100% - 400px);
margin-top: 26px;
}
.main-navigation li {
padding: 0 0;
padding: 0 0;
}
.main-navigation li a {
background-color: transparent;
padding: 0 35px;
padding: 0 2.5rem;
}
.main-navigation li ul {
left:-webkit-calc(50% - 96px);
left:calc(50% - 96px);
}
#home-headimage {
height:420px;
margin-top: 75px;
}
.swiper-container #slide-first{
background-size: auto auto;
background-position: center top;
}
#home-intro{
padding: 0 0 28px 0;
padding: 0 0 2rem 0;
}
#home-intro .site{
background-color: #fff;
padding: 0 42px 14px 42px;
overflow: hidden;
z-index: 1;
position: relative;
}
#home-intro-left{
width:-webkit-calc(100% - 550px);
width:calc(100% - 550px);
}
#home-intro-right{
width:500px;
}
/* dynamic floating nav bar */
.site-header{
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
}
.main-navigation,
.site-logo,
#top-tel * {
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
}
.site-header.scroll {
min-height: 0;
box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
/*position: fixed;
z-index: 10;
top: 0;*/
background-color: #fff;
text-shadow: none;
}
.site-header.scroll .main-navigation {
margin-top:10px;
}
.site-header.scroll .main-navigation li a {
color: #333;
}
.site-header.scroll .main-navigation li ul a {
background-color: #fff;
}
.site-header.scroll .main-navigation .current-menu-item > a,
.site-header.scroll .main-navigation .current-menu-ancestor > a,
.site-header.scroll .main-navigation .current_page_item > a,
.site-header.scroll .main-navigation .current_page_ancestor > a,
.site-header.scroll .main-navigation a:hover,
.site-header.scroll .main-navigation a:focus{
color: #43c9ac;
/*background-color: #000;*/
}
.site-header.scroll .site-logo {
margin-top:5px;
margin-bottom:5px;
width: 163px;
height: 47px;
}
#top-inner{
/*background-attachment: fixed;*/
background-position: center 50px;
background-size: initial;
}
/* dynamic floating nav bar */
#home-posts{
padding-top: 0;
}
}
@media screen and (min-width: 1440px) {
.main-navigation li a {
background-color: transparent;
padding: 0 42px;
padding: 0 3rem;
}
}
/*like it*/
.favorite_cont { text-align: center; }
a.favorite { display: inline-block; background: url(images/icon_heart.png) no-repeat left center; padding-left:16px }
a.favorite.done:hover {
font-size:0;
}
a.favorite.done:hover:after {
content:"(已赞)";
font-size:12px;
font-size: 0.857142857rem;
}
.favorite_wait {display: inline-block; background: url(images/loader_small.gif) no-repeat center center; width:16px; height:16px; line-height: 1.2; }
/*like it end*/
mark { background-color: transparent; }
/*return Top button*/
#returnTop {
background-color:#222;
width:40px;
height:40px;
display:block;
right:20px;
bottom:20px;
position:fixed;
line-height:50px;
color:#fff;
-webkit-opacity:1;
-moz-opacity:1;
opacity:1;
-webkit-transition: background 0.2s, -webkit-opacity 0.2s;
-moz-transition: background 0.2s, -moz-opacity 0.2s;
transition: background 0.2s, opacity 0.2s;
z-index: 6;
border-radius: 5px;
}
#returnTop_a{
position: absolute;
top: -2px;
left: 8px;
width: 0;
height: 0;
border-width: 10px 12px;
border-style: dashed dashed solid;
border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #FFF;
-webkit-transition: top 0.2s;
-moz-transition: top 0.2s;
transition: top 0.2s;
}
#returnTop_b{
position: absolute;
top: 18px;
left: 14px;
width: 12px;
height: 12px;
background: #FFF;
-webkit-transition: top 0.2s;
-moz-transition: top 0.2s;
transition: top 0.2s;
}
#returnTop.hide{
-webkit-opacity:0;
-moz-opacity:0;
opacity:0;
background-color:transparent;
filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#00000000', endColorstr='#00000000');
pointer-events: none;
}
#returnTop.hide #returnTop_a,
#returnTop.hide #returnTop_b { display: none }
:root #returnTop.hide { filter:none; }
#returnTop:hover {background-color:#43c9ac;}
#returnTop:hover #returnTop_a { top: -4px; }
#returnTop:hover #returnTop_b { top: 16px; }
/*QR Code button*/
#qrCode {
background:url(images/icon_qrcode.gif) center center no-repeat;
background-size: 50% 50%;
background-color:#222;
width:40px;
height:40px;
display:none;
right:20px;
bottom:20px;
position:fixed;
line-height:50px;
color:#fff;
-webkit-opacity:1;
-moz-opacity:1;
opacity:1;
-webkit-transition: background 0.2s, -webkit-opacity 0.2s;
-moz-transition: background 0.2s, -moz-opacity 0.2s;
transition: background 0.2s, opacity 0.2s;
z-index: 6;
border-radius: 5px;
}
#qrCode:hover {
background-color:#43c9ac;
}
#qrCode_cont {
position: absolute;
bottom: 0;
right: 50px;
background:no-repeat #fff;
overflow: hidden;
height:0;
width: 0;
border:none;
-webkit-transition: height 0.2s, width 0.2s;
-moz-transition: height 0.2s, width 0.2s;
transition: height 0.2s, width 0.2s;
}
#qrCode:hover #qrCode_cont{
text-align: center;
height:168px;
width: 147px;
padding:5px;
border:1px solid #f2f2f2;
line-height: 1;
}
#qrCode #qrCode_cont img {
display: inline-block;
}
#qrCode #qrCode_cont span {
display: inline-block;
color:#333;
font-size: 12px;
}
/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
#qrCode{
display:block;
}
#returnTop {
bottom:70px;
}
}
.video-js { max-width:100% }
.vjs-poster { background-color:transparent; }
.video-js .vjs-big-play-button {
top: calc(50% - 30px);
left: calc(50% - 30px);
border: none;
width: 60px;
height: 60px;
line-height: 56px;
border:3px solid #fff;
border-radius: 50%;
background-color: transparent;
}
.video-js .vjs-control:before {
line-height: 1.9;
}
/*lightbox*/
a[data-lightbox="jahefactury"]{
display: inline-block;
padding:4px;
border:1px solid #ddd;
margin:4px;
font-size:0;
}
/*arrow on top nav*/
.flaticon-down-arrow:after {
font-size:12px;
}
@media screen and (max-width: 1199px) {
.main-navigation .flaticon-down-arrow:after{
display: none;
}
}
/*top tel*/
#top-tel{
color:#fff;
float: right;
width: 200px;
overflow: hidden;
}
#top-tel .icon-tel{
display:block;
float:left;
width:40px; height:40px;
margin: 25px 15px 0 0;
background:url(images/icon-tel.png) no-repeat;
}
#top-tel p{
float:right;
line-height: 1.4;
font-weight: 500;
font-size: 17px;
margin-top: 22px;
}
#top-tel a,
#top-tel a:hover{
color:#fff;
text-decoration: none;
}
@media screen and (max-width: 1023px) {
#top-tel{
width:100%;
float: none;
display: none;
}
#top-tel .icon-tel{
display: none;
}
#top-tel p{
float: none;
text-align: center;
}
#top-tel br{
display: none;
}
#top-tel a,
#top-tel a:hover{
color:#2fc3a3;
}
}
@media screen and (min-width: 1200px) {
.site-header.scroll #top-tel .icon-tel{
margin-top: 8px;
}
.site-header.scroll #top-tel p{
margin-top: 6px;
}
}