Crepuscule (Talk | contribs) |
Crepuscule (Talk | contribs) |
||
Line 108: | Line 108: | ||
#content { | #content { | ||
margin-left:10%; <!--width--> | margin-left:10%; <!--width--> | ||
− | width: 80%; | + | width:80%; |
} | } | ||
Revision as of 03:20, 19 October 2016
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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-size: 18px; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
- focus {/* remember to define focus styles! */
outline: 0; } body { background: #FFFFFF; line-height: 1; /* -webkit-text-size-adjust: none; */ } ol, ul { list-style: none; } table {/* tables still need 'cellspacing="0"' in the markup */ border-collapse: separate; border-spacing: 0; } caption, th, td { font-weight: normal; text-align: left; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } a img { border: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } [role=button], [role=menubar], [role=menu]{ -webkit-user-select: none; -moz-user-select: none; }
- -webkit-selection {
background: rgba(0, 0, 0, 0.05); }
- -moz-selection {
background: rgba(0, 0, 0, 0.05);
}
- selection {
background: rgba(0, 0, 0, 0.05);
}
/* = Structure
*/
- page {
margin: 1em auto; padding-bottom: 60px; background: #fff; border-radius: 5px; }
- page-heading {
height: 90px; width: 100%; top: 0; border-radius: 3px; border-top: 1px solid #fff; }
- notification {
position: absolute; width: 300px; margin-top: 20px; margin-left: -150px; left: 50%; color: rgba(0, 0, 0, 0.6); color: #666; font-size: 13px; text-align: center; cursor: default; }
- notification .important {
color: #d80000; font-weight: 900; } ps { margin: 1.45em; padding: 0.5em; background-color: lightYellow; border: 1px solid #E6DB55; text-decoration: none; font-size: 12px; line-height: 1.4em; }
- content {
margin-left:10%; width:80%; }
/* Singular */
- content.singular {
margin: 0 7.6%; width: auto; } .attribution { font-size:24px; } .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title { margin: 0 auto; width: 68.9%; }
/* Attachments */ .singular .image-attachment .entry-content { margin: 0 auto; width: auto; } .singular .image-attachment .entry-description { margin: 0 auto; width: 68.9%; }
/* Showcase */ .page-template-showcase-php #content { margin: 0 7.6%; width: auto; } .page-template-showcase-php section.recent-posts { float: right; margin: 0 0 0 31%; width: 69%; }
/* error404 */ .error404 #content { margin: 0 7.6%; width: auto; }
/* Alignment */ .alignleft { display: inline; float: left; margin-right: 1.625em; } .alignright { display: inline; float: right; margin-left: 1.625em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
/* One column */ .one-column #nav-below { border-bottom: 1px solid #ddd; margin-bottom: 1.625em; } /* Simplify the showcase template */ .one-column .page-template-showcase-php section.recent-posts { float: none; margin: 0; width: 100%; } .one-column .page-template-showcase-php .other-recent-posts { border-bottom: 1px solid #ddd; } /* Simplify the showcase template when small feature */ .one-column section.featured-post .attachment-small-feature { border: none; display: block; height: auto; max-width: 60%; position: static; } .one-column article.feature-image.small { margin: 0 0 1.625em; padding: 0; } .one-column article.feature-image.small .entry-title { font-size: 20px; line-height: 1.3em; } .one-column article.feature-image.small .entry-summary { height: 150px; overflow: hidden; padding: 0; text-overflow: ellipsis; } .one-column article.feature-image.small .entry-summary a { left: -9%; } /* Remove the margin on singular articles */ .one-column.singular .entry-header, .one-column.singular .entry-content, .one-column.singular footer.entry-meta, .one-column.singular #comments-title { width: 100%; } /* Simplify the pullquotes and pull styles */ .one-column.singular blockquote.pull { margin: 0 0 1.625em; } .one-column.singular .pull.alignleft { margin: 0 1.625em 0 0; } .one-column.singular .pull.alignright { margin: 0 0 0 1.625em; } .one-column.singular .entry-meta .edit-link a { left: 0; top: 40px; } .one-column.singular #author-info { margin: 2.2em -8.8% 0; padding: 20px 8.8%; } /* Make sure we have room for our comment avatars */ .one-column .commentlist > li.comment { margin-left: 102px; width: auto; } /* Talking avatars take up too much room at this size */ .one-column .commentlist > li.comment { margin-left: 0; } .one-column .commentlist > li.comment .comment-meta, .one-column .commentlist > li.comment .comment-content { margin-right: 85px; } .one-column .commentlist .avatar { background: transparent; display: block; padding: 0; top: 1.625em; left: auto; right: 1.625em; } .one-column .commentlist .children .avatar { background: none; padding: 0; position: absolute; top: 2.2em; left: 2.2em; } .one-column #respond { width: auto; }
/* = Global
*/
body, input, textarea { color: #373737; font-size: 15px; font-weight: 300; line-height: 1.625; } body { background: #FFFFFF; }
/* Headings */ h1,h2,h3,h4,h5,h6 { clear: both; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.625em; }
hr.article { height: 1px; background-color: rgba(0, 0, 0, 0); background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .0)); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .0)); background-image: -ms-linear-gradient(left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .0)); background-image: -o-linear-gradient(left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .0)); background-image: linear-gradient(left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .0)); border: 0; margin: 3em 0 0; }
hr.soften { height: 1px; margin: 30px 0; background-color: rgba(0, 0, 0, 0); background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); border: 0; clear: both; }
/* Text elements */ p { margin-bottom: 1.625em; } ul, ol { margin: 0 0 1.625em 2.5em; } ul { list-style: square; } ol { list-style-type: decimal; } ol ol { list-style: upper-alpha; } ol ol ol { list-style: lower-roman; } ol ol ol ol { list-style: lower-alpha; } ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; } dl { margin: 0 1.625em; } dt { font-weight: bold; } dd { margin-bottom: 1.625em; } strong { font-weight: bold; } cite, em, i { font-style: italic; } blockquote { font-style: italic; font-weight: normal; margin: 0 3em; } blockquote em, blockquote i, blockquote cite { font-style: normal; } blockquote cite { color: #666; font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 300; letter-spacing: 0.05em; text-transform: uppercase; } pre { background: #f4f4f4; font: 13px "Courier 10 Pitch", Courier, monospace; line-height: 1.5; margin-bottom: 1.625em; overflow: auto; padding: 0.75em 1.625em; } code, kbd { font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } abbr, acronym, dfn { border-bottom: 1px dotted #666; cursor: help; } address { display: block; margin: 0 0 1.625em; } ins { background: #fff9c0; text-decoration: none; } sup, sub { font-size: 10px; height: 0; line-height: 1; position: relative; vertical-align: baseline; } sup { bottom: 1ex; } sub { top: .5ex; }
/* Forms */ input[type=text], input[type=password], textarea { background: #fafafa; box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); border: 1px solid #ddd; color: #888; } input[type=text]:focus, textarea:focus { color: #373737; } textarea { padding-left: 3px; width: 98%; } input[type=text] { padding: 3px; } input#s { background: url(images/search-dark.png) no-repeat 5px 6px; -moz-border-radius: 2px; border-radius: 2px; font-size: 14px; height: 22px; line-height: 1.2em; padding: 4px 10px 4px 28px; } input#searchsubmit { display: none; }
/* Links */ a { color: #969696; text-decoration: none; -webkit-transition: color .25s linear, text-shadow .25s linear; -moz-transition: color .25s linear, text-shadow .25s linear; -o-transition: color .25s linear, text-shadow .25s linear; -ms-transition: color .25s linear, text-shadow .25s linear; transition: color .25s linear, text-shadow .25s linear; } a:focus, a:hover { color: #424242; text-decoration: none; } p a:focus, p a:hover { -webkit-animation: link-hover 1.3s ease-out 300ms infinite forwards; animation: link-hover 1.3s ease-out 300ms infinite forwards;
} .entry-content p:first-child a:last-child { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
/* Assistive text */ .assistive-text { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); } a.assistive-text:active, a.assistive-text:focus { background: #eee; border-bottom: 1px solid #ddd; color: #1982d1; clip: auto !important; font-size: 12px; position: absolute; text-decoration: none; top: 0; left: 7.6%; } .page_navi { width: 100%; height: 36px; line-height: 36px; text-align: center; overflow: hidden; background-color: white; border-radius: 2px; } .page_navi a { padding: 3px 8px; margin: 2px; text-decoration: none; color: #888; border: 1px solid #e2e2e2; border-radius: 2px;
-webkit-transition: color .5s linear .1s, background-color .35s linear .1s; transition: color .5s linear .1s, background-color .35s linear .1s; } .page_navi a:hover,.page_navi a.current { color: white; background-color: #888; border-radius: 2px;
-webkit-transition: color .5s linear .1s, background-color .35s linear .1s; transition: color .5s linear .1s, background-color .35s linear .1s; }
/* = Header
*/
- main-header {
position: relative; width: 100%; height: 80px; zoom: 1; -webkit-animation: header-loading 600ms ease-out 0 1 forwards; animation: header-loading 600ms ease-out 0 1 forwards; }
- root #main-header {/*for IE9*/
filter:none\9; }
- main-header > .container {
max-width: 960px; margin: 30px auto; }
- main-header .logo {
float: left; opacity: .75; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
- main-header .logo:hover {
opacity: 1; }
/* = Menu
*/
- nav,
- nav li,
- nav ul,
- nav a,
- nav a:after {
list-style: none; font-weight: 500; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none; }
- nav > a {
display: none; }
- nav li {
position: relative; }
- nav li a {
color: #555; color: rgba(0, 0, 0, 0.6); display: block; }
- nav li a:hover {
color: #000; -webkit-animation: none; animation: none; }
- nav li a:active {
background-color: #eee !important; }
- nav li i {
display: inline; margin-right: 5px; }
/* First Level */
- nav > ul {
float: right; margin-right: 20px; }
- nav > ul > li {
float: left; line-height: 65px; width: 100px; }
- nav > ul > li > a {
text-align: center; }
- nav > ul > li > a i {
font-size: 90%; color: rgba(0, 0, 0, 0.35); margin-right: 3px; }
- nav > ul > li > a:after,
- nav > ul:not( :hover ) > li > a:after {
position: absolute; content: ; height: 100%; width: 100%; top: 0; left: 0; background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.8)), to(rgba(255, 255, 255, 0)))); background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0)); background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0))); background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0))); background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0))); background-image: linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0))); border-radius: 3px; opacity: 0; }
- nav > ul > li:hover > a:after,
- nav > ul:not( :hover ) > li.active > a:after {
opacity: 1; }
/* Second Level */
- nav li ul {
background-color: #f1f1f1; background-color: rgba(245, 245, 245, 0.9); display: none; opacity: .1; position: absolute; top: 63px; width: 180px; z-index: 99999; text-indent: 1.5em; line-height: normal; box-shadow: 0px 1px 8px 1.5px rgba(0, 0, 0, 0.3), 0px 10px 50px 5px rgba(0, 0, 0, 0.2); border-radius: 5px; -webkit-animation: menu-opening 300ms ease-out 0 1 forwards; animation: menu-opening 300ms ease-out 0 1 forwards; -webkit-transition: opacity 300ms; -moz-transition: opacity 300ms; transition: opacity 300ms; }
- nav li ul:after {
position: absolute; content: ""; display: block; top: -10px; left: 30px; width: 0; height: 0; font-size: 0; border: 10px solid transparent; border-bottom-color: rgba(255, 255, 255, 0.9); border-top: 0; overflow: hidden; -webkit-transform: translateZ(0); -webkit-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .2)); -moz-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .2)); -ms-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .2)); -o-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .2)); filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, .2)); }
- nav li:hover ul {
display: block; opacity: 1; left: 0; right: 0; }
- nav li:not( :first-child ):hover ul {
left: -40px; }
- nav li ul a {
font-size: 14px; border-top: 1px solid rgba(255, 255, 255, 0.9); border-bottom: 1px solid rgba(0, 0, 0, 0.15); padding: 15px 0; }
- nav li ul li a:hover,
- nav li ul:not( :hover ) li.active a {
border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d5d5d5; background-color: #ddd; background-color: rgba(0, 0, 0, 0.08); }
- nav li ul li:last-child a {
padding-bottom: 18px; border-bottom: 1px solid #b8b8b8; border-radius: 0 0 5px 5px; }
- nav li ul li:first-child a {
border-radius: 5px 5px 0 0; }
/* Search Form */
- page-heading #searchform {
margin-right: 50px; padding-top: 50px; }
- page-heading #searchform #s {
float: right; -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease; width: 72px; }
- page-heading #searchform #s:focus {
background-color: #f9f9f9; width: 196px; }
- searchsubmit {
display: none; } .only-search #searchform { top: 5px; z-index: 1; } .only-search #s { background-color: #666; border-color: #000; color: #222; } .only-search #s, .only-search #s:focus { width: 85%; } .only-search #s:focus { background-color: #bbb; } .with-image #searchform { top: auto; bottom: -27px; max-width: 195px; }
/* = Content
*/
- main {}
.page-title { font-size: 12px; font-weight: 500; line-height: 2.6em; margin: 0 0 2.6em; text-transform: uppercase; } .page-title a { font-size: 12px; letter-spacing: 0; text-transform: none; }
- content > article,
.no-results { margin: 2em 0; padding: 0 0 1em; }
- content > article:first-of-type {
margin-top: 0!important; }
- content > article:last-child,
.no-results { border-bottom: none; } .blog .sticky .entry-header .entry-meta { clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); position: absolute !important; } .entry-title { clear: both; font-size: 28px; font-weight: normal; line-height: 1.5em; padding-bottom: .3em; padding-top: 15px; } div.entry-title { font-size: 4em; }
.entry-content a.more-link { display: block; margin: 10px auto 30px; padding: 5px 20px; float: left; border: 1px solid #bbb; border-radius: 5px; -webkit-transition: 500ms; -moz-transition: 500ms; transition: 500ms; } .entry-content a.more-link:hover { color: #666; border-color: #999; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); -webkit-animation: none; animation: none; text-shadow: none; } .entry-content a.more-link:active { background: -webkit-gradient(linear, left top, right top, from(#fff), to(#eee)); background: -webkit-linear-gradient(top, #fff, #eee); background: -moz-linear-gradient(top, #fff, #eee); background: -o-linear-gradient(top, #fff, #eee); background: -ms-linear-gradient(top, #fff, #eee); background: linear-gradient(top, #fff, #eee); background-color: #fff; } .entry-content a.more-link .meta-nav { font: normal 140% "Times New Roman", serif; padding-left: 3px; } .entry-meta { color: #b4b4b4; clear: both; font-size: 12px; line-height: 18px; } .entry-meta a { font-weight: bold; color: #969696; } .entry-meta a:hover { color: #424242; } footer.entry-meta .sep{ padding: 0 3px; } .category-archive-meta, .tag-archive-meta { font-style: italic; text-shadow: 1px 1px 2px #D8D8D8; width: 85%; margin: 8% auto; cursor: default; } .single-author .entry-meta .by-author { display: none; } .entry-content, .entry-summary { padding: 8px 0 0; } .entry-content h1, .entry-content h2, .comment-content h1, .comment-content h2 { color: #000; font-weight: bold; margin: 0 0 .8125em; } .entry-content h1 { font-size: 1.4em; line-weight: 1em; text-shadow: 1px 2px 2px #ccc; } .entry-content h3, .comment-content h3 { font-size: 10px; letter-spacing: 0.1em; line-height: 2.6em; text-transform: uppercase; } .entry-content p { line-height: 180%; color: #555; color: rgba(0, 0, 0, 0.6); cursor: default; } .entry-content p a { border-bottom: 1px dotted #999; padding-bottom: 1.5px; } .entry-content p a:hover { border-color: #000; } .entry-content table, .comment-content table { border-bottom: 1px solid #ddd; margin: 0 0 1.625em; width: 100%; } .entry-content th, .comment-content th { color: #666; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; text-transform: uppercase; } .entry-content td, .comment-content td { border-top: 1px solid #ddd; padding: 6px 10px 6px 0; } .entry-content #s { width: 75%; } .comment-content ul, .comment-content ol { margin-bottom: 1.625em; } .comment-content ul ul, .comment-content ol ol, .comment-content ul ol, .comment-content ol ul { margin-bottom: 0; } .comment-content img { width: 85%; max-width: 400px; margin: 1em 0; border-radius: 2px; box-shadow: 0px 1px 6px 1px rgba(0, 0, 0, 0.25); } dl.gallery-item { margin: 0; } .page-link { clear: both; display: block; margin: 0 0 1.625em; } .page-link a { background: #eee; color: #373737; margin: 0; padding: 2px 3px; text-decoration: none; } .page-link a:hover { background: #888; color: #fff; font-weight: bold; } .page-link span { margin-right: 6px; } .entry-meta .edit-link a, .commentlist .edit-link a { background: #eee; -moz-border-radius: 3px; border-radius: 3px; color: #666; float: right; font-size: 12px; line-height: 1.5em; font-weight: 300; text-decoration: none; padding: 0 8px; } .entry-meta .edit-link a:hover, .commentlist .edit-link a:hover { background: #888; color: #fff; } .entry-content .edit-link { clear: both; display: block; }
/* Images */ .entry-content img, .comment-content img, { max-width: 97.5%; /* 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 { max-width: 98.5%; width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */ height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ margin: 20px auto 40px; } .entry-content img.wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } .entry-content p img.size-full { margin: 25px auto 40px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none; -webkit-user-drag: none; -webkit-user-select: none; -moz-user-select: none; } .single .entry-content p img.size-full { margin: 80px auto; } .single .entry-content p:first-child img.size-full { margin-top: 40px; } .single .entry-content p:last-child img.size-full { margin-bottom: 60px; } /* img.alignleft, img.alignright, img.aligncenter { margin-bottom: 1.625em; }
- /
p img, .wp-caption { margin-top: 0.4em; } .wp-caption { background: #eee; margin-bottom: 0em; max-width: 96%; padding: 9px; } .wp-caption img { display: block; margin: 0 auto; max-width: 98%; } .wp-caption .wp-caption-text, .gallery-caption { color: #666; font-size: 12px; } .wp-caption .wp-caption-text { margin-bottom: 0.6em; padding: 10px 0 5px 40px; position: relative; } .wp-caption .wp-caption-text:before { color: #666; content: '\2014'; font-size: 14px; font-style: normal; font-weight: bold; margin-right: 5px; position: absolute; left: 10px; top: 7px; }
- content .gallery {
margin: 0 auto 1.625em; }
- content .gallery a img {
border: none; } img#wpstats { display: block; margin: 0 auto 1.625em; }
- content .gallery-columns-4 .gallery-item {
width: 23%; padding-right: 2%; }
- content .gallery-columns-4 .gallery-item img {
width: 100%; height: auto; }
/* Image styles */ img[class*="align"], img[class*="wp-image-"],
- content .gallery .gallery-icon img {/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
box-shadow: 0px 1px 6px 1px rgba(0, 0, 0, 0.25); border-radius: 2px; }
/* Make sure embeds and iframes fit their containers */ embed, iframe, object { max-width: 100%; }
/* Password Protected Posts */ .post-password-required .entry-header .comments-link { margin: 1.625em 0 0; } .post-password-required input[type=password] { margin: 0.8125em 0; } .post-password-required input[type=password]:focus { background: #f7f7f7; }
/* Author Info */
- author-info {
font-size: 12px; overflow: hidden; } .singular #author-info { background: #f9f9f9; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin: 2.2em -35.6% 0 -35.4%; padding: 20px 35.4%; } .archive #author-info { border-bottom: 1px solid #ddd; margin: 0 0 2.2em; padding: 0 0 2.2em; }
- author-avatar {
float: left; margin-right: -78px; }
- author-avatar img {
background: #fff; -moz-border-radius: 3px; border-radius: 3px; box-shadow: 0 1px 2px #bbb; padding: 3px; }
- author-description {
float: left; margin-left: 108px; }
- author-description h2 {
color: #000; font-size: 15px; font-weight: bold; margin: 5px 0 10px; }
/* Comments link */ .entry-header .comments-link a { background: #eee url(images/comment-bubble.png) no-repeat; color: #666; font-size: 13px; font-weight: normal; line-height: 35px; overflow: hidden; padding: 0 0 0; position: absolute; top: 1.5em; right: 0; text-align: center; text-decoration: none; width: 43px; height: 36px; } .entry-header .comments-link a:hover, .entry-header .comments-link a:focus, .entry-header .comments-link a:active { background-color: #1982d1; color: #fff; color: rgba(255,255,255,0.8); } .entry-header .comments-link .leave-reply { visibility: hidden; }
/* Post Formats Headings To hide the headings, display: none the ".entry-header .entry-format" selector, and remove the padding rules below.
- /
.entry-header .entry-format { color: #666; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; position: absolute; text-transform: uppercase; top: -5px; } .entry-header hgroup .entry-title { padding-top: 15px; } article.format-aside .entry-content, article.format-link .entry-content, article.format-status .entry-content { padding: 20px 0 0; } article.format-status .entry-content { min-height: 65px; } .recent-posts .entry-header .entry-format { display: none; } .recent-posts .entry-header hgroup .entry-title { padding-top: 0; }
/* Singular content styles for Posts and Pages */ .singular .hentry { border-bottom: none; } .singular.page .hentry { padding: 3.5em 0 0; } .singular .entry-title { font-size: 46px; line-height: 48px; text-align: center; margin: 20px auto 15px; cursor: default; } .singular .entry-title, .singular .entry-header .entry-meta { padding-right: 0; } .singular .entry-header .entry-meta { position: absolute; top: 0; left: 0; } blockquote.pull { font-size: 21px; font-weight: bold; line-height: 1.6125em; margin: 0 0 1.625em; text-align: center; } .singular blockquote.pull { margin: 0 -22.25% 1.625em; } .pull.alignleft { margin: 0 1.625em 0 0; text-align: right; width: 33%; } .singular .pull.alignleft { margin: 0 1.625em 0 -22.25%; } .pull.alignright { margin: 0 0 0 1.625em; text-align: left; width: 33%; } .singular .pull.alignright { margin: 0 -22.25% 0 1.625em; } .singular blockquote.pull.alignleft, .singular blockquote.pull.alignright { width: 33%; } .singular .entry-meta .edit-link a { bottom: auto; left: 50px; right: auto; top: 80px; }
/* = Aside
*/
.format-aside .entry-title, .format-aside .entry-header .comments-link { display: none; } .singular .format-aside .entry-title { display: block; } .format-aside .entry-content { padding: 0; } .singular .format-aside .entry-content { padding: 1.625em 0 0; }
/* = Link
*/
.format-link .entry-title, .format-link .entry-header .comments-link { display: none; } .singular .format-link .entry-title { display: block; } .format-link .entry-content { padding: 0; } .singular .format-link .entry-content { padding: 1.625em 0 0; } a { -webkit-tap-highlight-color: rgba(0, 0, 0, 0.2); }
/* = Gallery
*/
.format-gallery .gallery-thumb { float: left; display: block; margin: .375em 1.625em 0 0; }
/* = Status
*/
.format-status .entry-title, .format-status .entry-header .comments-link { display: none; } .singular .format-status .entry-title { display: block; } .format-status .entry-content { padding: 0; } .singular .format-status .entry-content { padding: 1.625em 0 0; } .format-status img.avatar { border-radius: 3px; box-shadow: 0 1px 2px #ccc; float: left; margin: 4px 10px 2px 0; padding: 0; }
/* = Quote
*/
.format-quote blockquote { color: #555; font-size: 17px; margin: 0; }
/* = Image
*/
.indexed.format-image .entry-header { min-height: 61px; /* Prevent the comment icon from colliding with the image when there is no title */ } .indexed.format-image .entry-content { padding-top: 0.5em; } .indexed.format-image p, .indexed.format-image p img { margin-bottom: 0; } .indexed.format-image footer.entry-meta { background: #ddd; margin-top: -7px; padding: 20px 30px; overflow: hidden; } .indexed.format-image div.entry-meta { display: inline-block; float: left; width: 35%; } .indexed.format-image div.entry-meta + div.entry-meta { float: none; width: 65%; } .indexed.format-image .entry-meta span.cat-links, .indexed.format-image .entry-meta span.tag-links, .indexed.format-image .entry-meta span.comments-link { display: block; } .indexed.format-image footer.entry-meta a { color: #444; } .indexed.format-image footer.entry-meta a:hover { color: #fff; }
- content .indexed.format-image img {
border: none; max-width: 100%; padding: 0; } .indexed.format-image .wp-caption { background: #111; margin-bottom: 0; max-width: 96%; padding: 11px; } .indexed.format-image .wp-caption .wp-caption-text { color: #ddd; } .indexed.format-image .wp-caption .wp-caption-text:before { color: #444; } .indexed.format-image a:hover img { opacity: 0.8; }
/* = error404
*/
.error404 #main #searchform { background: #f9f9f9; border: 1px solid #ddd; border-width: 1px 0; margin: 0 -8.9% 1.625em; overflow: hidden; padding: 1.625em 8.9%; } .error404 #main #s { width: 95%; }
/* = Showcase
*/
h1.showcase-heading { color: #666; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; text-transform: uppercase; }
/* Intro */ article.intro { background: #f9f9f9; border-bottom: none; margin: -1.855em -8.9% 1.625em; padding: 0 8.9%; } article.intro .entry-title { display: none; } article.intro .entry-content { color: #111; font-size: 16px; padding: 1.625em 0 0.625em; } article.intro .edit-link a { background: #aaa; -moz-border-radius: 3px; border-radius: 3px; color: #fff; font-size: 12px; padding: 0 8px; position: absolute; top: 30px; right: 20px; text-decoration: none; } article.intro .edit-link a:hover, article.intro .edit-link a:focus, article.intro .edit-link a:active { background: #777; }
/* Featured post */ section.featured-post { float: left; margin: -1.625em -8.9% 1.625em; padding: 1.625em 8.9% 0; position: relative; width: 100%; } section.featured-post .hentry { border: none; color: #666; margin: 0; } section.featured-post .entry-meta { clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); position: absolute !important; }
/* Small featured post */ section.featured-post .attachment-small-feature { float: right; height: auto; margin: 0 -8.9% 1.625em 0; max-width: 59%; position: relative; right: -15px; } section.featured-post.small { padding-top: 0; } section.featured-post .attachment-small-feature:hover, section.featured-post .attachment-small-feature:focus, section.featured-post .attachment-small-feature:active { opacity: .8; } article.feature-image.small { float: left; margin: 0 0 1.625em; width: 45%; } article.feature-image.small .entry-title { line-height: 1.2em; } article.feature-image.small .entry-summary { color: #555; font-size: 13px; } article.feature-image.small .entry-summary p a { background: #222; color: #eee; display: block; left: -23.8%; padding: 9px 26px 9px 85px; position: relative; text-decoration: none; top: 20px; width: 180px; z-index: 1; } article.feature-image.small .entry-summary p a:hover { background: #1982d1; color: #eee; color: rgba(255,255,255,0.8); }
/* Large featured post */ section.feature-image.large { border: none; max-height: 288px; padding: 0; width: 100%; } section.feature-image.large .showcase-heading { display: none; } section.feature-image.large .hentry { border-bottom: none; left: 9%; margin: 1.625em 9% 0 0; position: absolute; top: 0; } article.feature-image.large .entry-title a { background: #222; background: rgba(0,0,0,0.8); -moz-border-radius: 3px; border-radius: 3px; color: #fff; display: inline-block; font-weight: 300; padding: .2em 20px; } section.feature-image.large:hover .entry-title a, section.feature-image.large .entry-title:hover a { background: #eee; background: rgba(255,255,255,0.8); color: #222; } article.feature-image.large .entry-summary { display: none; } section.feature-image.large img { display: block; height: auto; max-width: 117.9%; padding: 0 0 6px; }
/* Featured Slider */ .featured-posts { border-bottom: 1px solid #ddd; display: block; height: 328px; margin: 1.625em -8.9% 20px; max-width: 1000px; padding: 0; position: relative; overflow: hidden; } .featured-posts .showcase-heading { padding-left: 8.9%; } .featured-posts section.featured-post { background: #fff; height: 288px; left: 0; margin: 0; position: absolute; top: 30px; width: auto; } .featured-posts section.featured-post.large { max-width: 100%; overflow: hidden; } .featured-posts section.featured-post { -webkit-transition-duration: 200ms; -webkit-transition-property: opacity, visibility; -webkit-transition-timing-function: ease; -moz-transition-duration: 200ms; -moz-transition-property: opacity, visibility; -moz-transition-timing-function: ease; -ms-transition-duration: 200ms; -ms-transition-property: opacity, visibility; -ms-transition-timing-function: ease; -o-transition-duration: 200ms; -o-transition-property: opacity, visibility; -o-transition-timing-function: ease; } .featured-posts section.featured-post { opacity: 0; visibility: hidden; } .featured-posts #featured-post-1 { opacity: 1; visibility: visible; } .featured-post .feature-text:after, .featured-post .feature-image.small:after { content: ' '; background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera11.10+ */ background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ background: linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */ width: 100%; height: 45px; position: absolute; top: 230px; } .featured-post .feature-image.small:after { top: 253px; }
- content .feature-slider {
top: 5px; right: 8.9%; overflow: visible; position: absolute; } .feature-slider ul { list-style-type: none; margin: 0; } .feature-slider li { float: left; margin: 0 6px; } .feature-slider a { background: #3c3c3c; background: rgba(60,60,60,0.9); border-radius: 12px; box-shadow: inset 1px 1px 5px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.5); display: block; width: 14px; height: 14px; } .feature-slider a.active { background: #1982d1; box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4), inset 0 0 2px rgba(255,255,255,0.8); cursor: default; opacity: 0.5; }
/* Recent Posts */ section.recent-posts { padding: 0 0 1.625em; } section.recent-posts .hentry { border: none; margin: 0; } section.recent-posts .other-recent-posts { border-bottom: 1px solid #ddd; list-style: none; margin: 0; } section.recent-posts .other-recent-posts li { padding: 0.3125em 0; position: relative; } section.recent-posts .other-recent-posts .entry-title { border-top: 1px solid #ddd; font-size: 17px; } section.recent-posts .other-recent-posts a[rel="bookmark"] { color: #373737; float: left; max-width: 84%; } section.recent-posts .other-recent-posts a[rel="bookmark"]:after { content: '-'; color: transparent; font-size: 11px; } section.recent-posts .other-recent-posts a[rel="bookmark"]:hover { } section.recent-posts .other-recent-posts .comments-link a, section.recent-posts .other-recent-posts .comments-link > span { border-bottom: 2px solid #999; bottom: -2px; color: #444; display: block; font-size: 10px; font-weight: 500; line-height: 2.76333em; padding: 0.3125em 0 0.3125em 1em; position: absolute; right: 0; text-align: right; text-transform: uppercase; z-index: 1; } section.recent-posts .other-recent-posts .comments-link > span { border-color: #bbb; color: #888; } section.recent-posts .other-recent-posts .comments-link a:hover { color: #1982d1; border-color: #1982d1; } section.recent-posts .other-recent-posts li:after { clear: both; content: '.'; display: block; height: 0; visibility: hidden; }
/* = Attachments
*/
.image-attachment div.attachment { background: #f9f9f9; border: 1px solid #ddd; border-width: 1px 0; margin: 0 -8.9% 1.625em; overflow: hidden; padding: 1.625em 1.625em 0; text-align: center; } .image-attachment div.attachment img { display: block; height: auto; margin: 0 auto 1.625em; max-width: 100%; } .image-attachment div.attachment a img { border-color: #f9f9f9; } .image-attachment div.attachment a:focus img, .image-attachment div.attachment a:hover img, .image-attachment div.attachment a:active img { border-color: #ddd; background: #fff; } .image-attachment .entry-caption p { font-size: 10px; letter-spacing: 0.1em; line-height: 2.6em; margin: 0 0 2.6em; text-transform: uppercase; }
/* = Navigation
*/
/* = Post Footers
*/
- qr {
position: relative; height: 150px; width: 125px; margin: 3em auto 7em; opacity: .85; }
- qr figcaption {
position: absolute; display: block; bottom: -50px; width: 100%; text-align: center; }
- qr figcaption p {
font-size: 12px; margin-bottom: 0; }
- share-buttons {
text-align: center; margin-bottom: 50px; }
- share-buttons a {
display: inline-block; margin: 1em; padding: 10px 25px; border: 1px solid #bbb; border-radius: 5px; -webkit-transition: 500ms; -moz-transition: 500ms; transition: 500ms; }
- share-buttons a:hover,
- share-buttons a:focus {
color: #666; border-color: #999; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); -webkit-animation: none; animation: none; text-shadow: none; }
- share-buttons a:active {
background: -webkit-gradient(linear, left top, right top, from(#fff), to(#eee)); background: -webkit-linear-gradient(top, #fff, #eee); background: -moz-linear-gradient(top, #fff, #eee); background: -o-linear-gradient(top, #fff, #eee); background: -ms-linear-gradient(top, #fff, #eee); background: linear-gradient(top, #fff, #eee); background-color: #fff; -webkit-animation: none; animation: none;
}
- share-buttons a i {
font-size: 125%; margin-right: 2px; } p.copyright-info { color: #888; font-size: 12px; text-align: center; }
/* = Related Posts
*/
.related-posts { width: 92.5%; height: 150px; margin: 30px auto 50px; } .related-posts > h3 { color: #999; margin: -10px auto 30px; font-size: 20px; text-align: center; } .related-posts > ul { margin: auto; } .related-box { max-width: 130px; min-width: 100px; margin: 5px 10px 0; float: left; text-align: center; list-style: none; } .related-box .related-title { width: auto; font-size: 13px; overflow: hidden; } .related-box .related-img img { max-width: 130px; max-height: 87px; border: 1px solid #e1e1e1\9; box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.35); }
/* = Comments
*/
- comments-title {
color: #666; font-size: 10px; font-weight: 500; line-height: 2.6em; padding: 0 0 2.6em; text-transform: uppercase; } .nopassword, .nocomments { color: #aaa; font-size: 24px; font-weight: 100; margin: 26px 0; text-align: center; } .commentlist { list-style: none; margin: 0 auto; width: 68.9%; } .content .commentlist, .page-template-sidebar-page-php .commentlist { width: 100%; /* reset the width for the one-column and sidebar page layout */ } .commentlist > li.comment { background: #f6f6f6; border: 1px solid #ddd; -moz-border-radius: 3px; border-radius: 3px; margin: 0 0 1.625em; padding: 1.625em; position: relative; } .commentlist .pingback { margin: 0 0 1.625em; padding: 0 1.625em; } .commentlist .children { list-style: none; margin: 0; } .commentlist .children li.comment { background: #fff; border: 1px solid #ddd; border-radius: 5px; margin: 1.625em 0 0; padding: 1.625em; position: relative; } .commentlist .children li.comment .fn { display: block; } .comment-meta .fn { font-style: normal; } .comment-meta { color: #666; font-size: 12px; line-height: 2.2em; } .commentlist .children li.comment .comment-meta { line-height: 1.625em; margin-left: 50px; } .commentlist .children li.comment .comment-content { margin: 1.625em 0 0; } .comment-meta a { font-weight: bold; } .comment-awaiting-moderation { color: #951015; } .commentlist .avatar { border-radius: 3px; box-shadow: 0 1px 2px #ccc; left: -102px; padding: 0; position: absolute; top: 0; } .commentlist > li:before { content: url(images/comment-arrow.png); left: -21px; position: absolute; } .commentlist > li.pingback:before { content: ; } .commentlist .children .avatar { background: none; box-shadow: none; left: 2.2em; padding: 0; top: 2.2em; } a.comment-reply-link { background: #eee; -moz-border-radius: 3px; border-radius: 3px; color: #666; display: inline-block; font-size: 12px; padding: 0 8px; text-decoration: none; } a.comment-reply-link:hover, a.comment-reply-link:focus, a.comment-reply-link:active { background: #888; color: #fff; } a.comment-reply-link > span { display: inline-block; position: relative; top: -1px; }
/* Post author highlighting */ .commentlist > li.bypostauthor { background: #ddd; border-color: #d3d3d3; } .commentlist > li.bypostauthor .comment-meta { color: #575757; } .commentlist > li.bypostauthor .comment-meta a:focus, .commentlist > li.bypostauthor .comment-meta a:active, .commentlist > li.bypostauthor .comment-meta a:hover { } .commentlist > li.bypostauthor:before { content: url(images/comment-arrow-bypostauthor.png); }
/* Post Author threaded comments */ .commentlist .children > li.bypostauthor { background: #e5e5e5; border-color: #d3d3d3; }
/* sidebar-page.php comments */ /* Make sure we have room for our comment avatars */ .page-template-sidebar-page-php .commentlist > li.comment, .page-template-sidebar-page-php.commentlist .pingback { margin-left: 102px; width: auto; } /* And a full-width comment form */ .page-template-sidebar-page-php #respond { width: auto; }
/* Comment Form */
- respond {
background: #ddd url("images/background.jpg"); border: 1px solid #d3d3d3; border-radius: 3px; box-shadow: 0px 2px 3px 1px rgba(0, 0, 0, 0.1) inset; margin: 0 auto 1.625em; padding: 1.625em; position: relative; width: 68.9%; }
- respond input[type="text"],
- respond textarea {
background: #f8f8f8 url("");; border: 4px solid #eee; border-radius: 5px; box-shadow: inset 0 1px 3px rgba(204,204,204,0.95); position: relative; padding: 10px; text-indent: 80px; }
- respond .comment-form-author,
- respond .comment-form-email,
- respond .comment-form-url,
- respond .comment-form-comment {
position: relative; } /*
- respond .comment-form-author label,
- respond .comment-form-email label,
- respond .comment-form-url label,
- respond .comment-form-comment label {
- /
- respond label {
background: #eee; box-shadow: 1px 2px 2px rgba(204,204,204,0.8); color: #555; display: inline-block; font-size: 13px; left: 4px; min-width: 60px; padding: 4px 10px; position: absolute; top: 4px; z-index: 1; }
- respond label .icon {
padding-right: 2px; color: rgba(0, 0, 0, .5); }
- respond .comment-form-capatcha {
width: 40%; }
- respond input[type="text"]:focus,
- respond textarea:focus {
text-indent: 0; z-index: 1; }
- respond textarea {
resize: vertical; width: 95%; }
- respond .comment-form-author .required,
- respond .comment-form-email .required,
- respond .comment-form-capatcha .required {
color: #bd3500; font-size: 22px; font-weight: bold; left: 75%; position: absolute; top: 45px; z-index: 1; }
- respond .comment-notes,
- respond .logged-in-as {
font-size: 13px; color: #666; color: rgba(0, 0, 0, 0.55); cursor: default; -webkit-user-select: none; -moz-user-select: none; }
- respond p {
margin: 15px 0; }
- respond .form-submit {
text-align: center; }
- respond button#submit {
background: #222; background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .7)), to(rgba(0, 0, 0, .9))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .9)); background: -moz-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .9)); background: -o-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .9)); background: -ms-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .9)); background: linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .9)); border: none; border-radius: 3px; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 8px 1px rgba(0, 0, 0, 0.6); color: #eee; opacity: .95; cursor: pointer; font-size: 15px; padding: 13px; position: relative; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); width: 200px; -webkit-transition: opacity 0.2s linear; -o-transition: opacity 0.2s linear; -moz-transition: opacity 0.2s linear; -ms-transition: opacity 0.2s linear; transition: opacity 0.2s linear; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; }
- respond button#submit:hover {
opacity: .85; }
- respond button#submit:active {
opacity: 1; background: rgba(0, 0, 0, .7); } .commentlist #respond { margin: 1.625em 0 0; width: auto; }
- reply-title,
- respond h4 {
color: #555; color: rgba(0, 0, 0, 0.7); font-size: 24px; font-weight: bold; line-height: 30px; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.85); margin-top: 10px; cursor: default; -webkit-user-select: none; -moz-user-select: none; }
- respond h4 {
font-size: 20px; margin-top: 20px; }
- reply-title a {
font-size: 22px; font-weight: normal; color: #555; } a#cancel-comment-reply-link { position: absolute; display: block; font-size: 20px; color: #666; right: 1.625em; top: 1.25em; }
- respond label {
line-height: 2.2em; -webkit-user-select: none; -moz-user-select: none; }
- respond input[type=text] {
display: block; height: 24px; width: 100%; }
- respond p {
font-size: 12px; }
- respond p.comment-form-author {
max-width: 340px; }
- respond p.comment-form-comment {
margin: 0; }
- respond p.comment-form-email,
- respond p.comment-form-url {
display: inline-block; width: 100%; max-width: 340px; }
- respond p.comment-form-url {
margin-left: 40px; }
- respond .form-allowed-tags {
display: none; }
/* = Footer
*/
- site-footer {
position: relative; width: 100%; background: #333 url(""); border-top: 1px solid #ddd; margin-top: 80px; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; }
- site-footer:after {
position: absolute; content: ""; width: 100%; height: 50px; top: 0; left: 0; background: rgba(0,0,0,0.0); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.85)), color-stop(30%, rgba(90,90,90,0.1)), color-stop(100%, rgba(0,0,0,0))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.85) 0%, rgba(90,90,90,0.1) 30%, rgba(0,0,0,0) 100%); background: -moz-linear-gradient(top, rgba(0,0,0,0.85) 0%, rgba(90,90,90,0.1) 30%, rgba(0,0,0,0) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.85) 0%, rgba(90,90,90,0.1) 30%, rgba(0,0,0,0) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.85) 0%, rgba(90,90,90,0.1) 30%, rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.85) 0%, rgba(90,90,90,0.1) 30%, rgba(0,0,0,0) 100%); }
- site-footer .container {
width: 100%; width: 1440px\9; height: 430px; margin: 50px auto 0; }
- site-footer .panel {
width: 12.5%; height: 100%; -moz-box-sizing: border-box; box-sizing: border-box; padding: 10px; float: left; border-left: 1px solid #444; border-right: 1px solid #111; }
- site-footer .panel:first-child {
width: 37.5%; border-left: none; }
- site-footer .panel:last-child {
width: 37.5%; border-right: none; }
- site-footer .panel > h3 {
color: #eee; color: color: rgba(255, 255, 255, 0.9); font-size: 20px; text-shadow: 1px 2px 5px rgba(0, 0, 0, 0.8); margin-left: 8px; margin-bottom: 10px; cursor: default; }
- site-footer .panel:first-child > h3 {
margin-left: 95px; }
- site-footer .panel:last-child > h3 {
margin-left: 10px; }
- site-footer a {
-webkit-animation: none; animation: none; }
/* jquery.hoverfold.js */
- site-footer .images-container {
width: 420px; float: right; }
- site-footer .view {
width: 100px; height: 66px; margin: 18px 15px; float: left; position: relative; border-color: #ddd; border: 2px solid rgba(255, 255, 255, 0.8); border-radius: 2px; box-shadow: 0 1px 10px 1px rgba(0, 0, 0, 0.5); -webkit-perspective: 500px; -moz-perspective: 500px; -o-perspective: 500px; -ms-perspective: 500px; perspective: 500px; -webkit-tap-highlight-color: rgba(255, 255, 255, 0.3); -webkit-touch-callout: none; }
- site-footer .view .slice {
width: 20px; height: 100%; background-size: 100px; background-repeat: no-repeat; background-color: #ddd; z-index: 100;
-webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d;
-webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center;
-webkit-transition: -webkit-transform 150ms ease-in-out; -moz-transition: -moz-transform 150ms ease-in-out; -o-transition: -o-transform 150ms ease-in-out; -ms-transition: -ms-transform 150ms ease-in-out; transition: transform 150ms ease-in-out;
}
- site-footer .view .view-back {
width: 100%; height: 100%; position: absolute; right: 0; background: #666; background-size: 100px; background-repeat: no-repeat; background-position: 0px center; z-index: 0; }
- site-footer .view .view-back:before {
position: absolute; content: ' '; width: 50%; height: 100%; top: 0; right: 0; background: #0a0a0a; background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 80%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 0, 0, 0.9)), color-stop(80%, rgba(0, 0, 0, 0))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 80%); background: -o-linear-gradient(left rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 80%); background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 80%); background: linear-gradient(left, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 80%); }
- site-footer .view img.spinner {
display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; background: rgba(0, 0, 0, 0.5); }
.fuck-ie #site-footer .view .view-back { background-image: none!important; }
.fuck-ie #site-footer .view img { width: 100px; height: 66px; }
- site-footer .view .view-back span {
position: absolute; width: 100%; bottom: 0; color: #ddd; color: rgba(255, 255, 255, 0.8); opacity: 0; font-size: 12px; text-align: center; text-shadow: none; -webkit-transition: opacity 500ms linear, bottom 300ms ease-in-out; -moz-transition: opacity 500ms linear, bottom 300ms ease-in-out; -o-transition: opacity 500ms linear, bottom 300ms ease-in-out; -ms-transition: opacity 500ms linear, bottom 300ms ease-in-out; transition: opacity 500ms linea, bottom 300ms ease-in-out; -webkit-transition-delay: 100ms; -moz-transition-delay: 100ms; -o-transition-delay: 100ms; -ms-transition-delay: 100ms; transition-delay: 100ms; }
- site-footer .view:hover .view-back span {
bottom: -25px; opacity: 1; text-shadow: none; }
.view-back a { display: block; font-size: 12px; color: rgba(255,255,255,0.4); position: absolute; right: 5px; width: 20px; height: 30px; line-height: 15px; text-align: right; }
.view-back a:hover { color: #fff; border-color: #fff; }
- site-footer .view .s2,
- site-footer .view .s3,
- site-footer .view .s4,
- site-footer .view .s5 {
-webkit-transform: translate3d(20px,0,0); -moz-transform: translate3d(20px,0,0); -o-transform: translate3d(20px,0,0); -ms-transform: translate3d(20px,0,0); transform: translate3d(20px,0,0); }
- site-footer .view .s1 {
background-position: 0px center; }
- site-footer .view .s2 {
background-position: -20px center; }
- site-footer .view .s3 {
background-position: -40px center; }
- site-footer .view .s4 {
background-position: -60px center; }
- site-footer .view .s5 {
background-position: -80px center; }
- site-footer .view .overlay {
width: 20px; height: 100%; opacity: 0; position: absolute; -webkit-transition: opacity 150ms ease-in-out; -moz-transition: opacity 150ms ease-in-out; -o-transition: opacity 150ms ease-in-out; -ms-transition: opacity 150ms ease-in-out; transition: opacity 150ms ease-in-out; }
- site-footer .view:hover .overlay {
opacity: 1; }
- site-footer .view img {
position: absolute; z-index: 0; -webkit-transition: left 0.3s ease-in-out; -o-transition: left 0.3s ease-in-out; -moz-transition: left 0.3s ease-in-out; -ms-transition: left 0.3s ease-in-out; transition: left 0.3s ease-in-out; }
/* style2.css */
- site-footer .view {
-webkit-perspective: 260px; -moz-perspective: 260px; -o-perspective: 260px; -ms-perspective: 260px; perspective: 260px; }
- site-footer .view:hover .s1 {
-webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -o-transition-delay: 200ms; -ms-transition-delay: 200ms; transition-delay: 200ms;
-webkit-transform: rotate3d(0,1,0,-3deg); -moz-transform: rotate3d(0,1,0,-3deg); -o-transform: rotate3d(0,1,0,-3deg); -ms-transform: rotate3d(0,1,0,-3deg); transform: rotate3d(0,1,0,-3deg); }
- site-footer .view:hover .s2 {
-webkit-transition-delay: 150ms; -moz-transition-delay: 150ms; -o-transition-delay: 150ms; -ms-transition-delay: 150ms; transition-delay: 150ms;
-webkit-transform: translate3d(19px,0,0) rotate3d(0,1,0,-10deg); -moz-transform: translate3d(19px,0,0) rotate3d(0,1,0,-10deg); -o-transform: translate3d(19px,0,0) rotate3d(0,1,0,-10deg); -ms-transform: translate3d(19px,0,0) rotate3d(0,1,0,-10deg); transform: translate3d(19px,0,0) rotate3d(0,1,0,-10deg); }
- site-footer .view:hover .s3 {
-webkit-transition-delay: 100ms; -moz-transition-delay: 100ms; -o-transition-delay: 100ms; -ms-transition-delay: 100ms; transition-delay: 100ms;
-webkit-transform: translate3d(19px,0,0) rotate3d(0,1,0,-16deg); -moz-transform: translate3d(19px,0,0) rotate3d(0,1,0,-16deg); -o-transform: translate3d(19px,0,0) rotate3d(0,1,0,-16deg); -ms-transform: translate3d(19px,0,0) rotate3d(0,1,0,-16deg); transform: translate3d(19px,0,0) rotate3d(0,1,0,-16deg); }
- site-footer .view:hover .s4 {
-webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms;
-webkit-transform: translate3d(19px,0,0) rotate3d(0,1,0,-30deg); -moz-transform: translate3d(19px,0,0) rotate3d(0,1,0,-30deg); -o-transform: translate3d(19px,0,0) rotate3d(0,1,0,-30deg); -ms-transform: translate3d(19px,0,0) rotate3d(0,1,0,-30deg); transform: translate3d(19px,0,0) rotate3d(0,1,0,-30deg); }
- site-footer .view:hover .s5 {
-webkit-transform: translate3d(20px,0,0) rotate3d(0,1,0,-40deg); -moz-transform: translate3d(20px,0,0) rotate3d(0,1,0,-40deg); -o-transform: translate3d(20px,0,0) rotate3d(0,1,0,-40deg); -ms-transform: translate3d(20px,0,0) rotate3d(0,1,0,-40deg); transform: translate3d(20px,0,0) rotate3d(0,1,0,-40deg); }
- site-footer .view .s5:after {
position: absolute; content: ' '; width: 100%; height: 100%; top: 0; right: 0; background: rgba(0,0,0,0); -webkit-transition-delay: 220ms; -moz-transition-delay: 220ms; -o-transition-delay: 220ms; -ms-transition-delay: 220ms; transition-delay: 200ms; -webkit-transition: none; -o-transition: none; -moz-transition: none; -ms-transition: none; transition: none; }
- site-footer .view:hover .s5:after {
position: absolute; content: ' '; width: 100%; height: 100%; top: 0; right: 0; background: #fff; -webkit-transition: background 0.3s ease-in-out; -o-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; -ms-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; }
- site-footer .view .s4 > .overlay {
background: -moz-linear-gradient(right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); }
- site-footer .view .s5 > .overlay {
background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); }
/* Switch Bar */
- site-footer .switch-bar {
position: relative; display: inline-block; vertical-align: middle; margin-top: 15px; margin-left: 50%; left: -90px; }
- site-footer .switch-bar > .btn {
position: relative; float: left; /* small */ padding: 5px 10px; font-size: 12px; line-height: 1.5; background-color: #202020; background-color: rgba(0, 0, 0, 0.2); border: 1px solid #3f3f3f; border: 1px solid rgba(100, 100, 100, 0.5); border-radius: 3px; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25) inset; }
- site-footer .switch-bar > .btn:not(:active),
- site-footer .switch-bar > .btn:not(:active) a {
-webkit-transition: all .15s linear; -moz-transition: all .15s linear; -o-transition: all .15s linear; -ms-transition: all .15s linear; transition: all .15s linear; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; }
- site-footer .switch-bar > .btn:hover {
cursor: pointer; background: #3f3f3f; background: rgba(100, 100, 100, 0.5); box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25); }
- site-footer .switch-bar > .btn:active {
background-color: #1a1a1a; background-color: rgba(0, 0, 0, 0.35); }
- site-footer .switch-bar > .btn:hover a {
color: #fff; text-shadow: none; }
- site-footer .switch-bar > .btn i {
font-size: 14px; vertical-align: middle; margin-right: 2px; }
- site-footer .switch-bar .btn + .btn,
- site-footer .switch-bar .btn + .btn-group {
margin-left: -1px; }
- site-footer .switch-bar > .btn:not(:first-child):not(:last-child) {
border-radius: 0; }
- site-footer .switch-bar > .btn:first-child {
margin-left: 0; }
- site-footer .switch-bar > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
border-top-right-radius: 0; border-bottom-right-radius: 0; }
- site-footer .switch-bar > .btn:last-child:not(:first-child) {
border-bottom-left-radius: 0; border-top-left-radius: 0; }
/* Footer nav */
- site-footer ul.nav {
list-style: none; margin: 0; }
- site-footer ul.nav li {
position: relative; }
- site-footer ul.nav li a {
display: block; color: #fff; color: rgba(255, 255, 255, 0.9); font-size: 14px; border-top: 1px solid #444; border-bottom: 1px solid #111; padding: 12px 8px; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); }
- site-footer ul.nav li a:before {
position: absolute; content: ' '; width: 100%; height: 100%; top: -1px; left: 0; opacity: 0; border-top: 1px solid #555; border-top: none\9; background: rgba(255, 255, 255, .1); background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, .1)), to(rgba(0, 0, 0, 0))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); background: -moz-linear-gradient(top, rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); background: -o-linear-gradient(top, rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); background: -ms-linear-gradient(top, rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); background: linear-gradient(top, rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -ms-transition: opacity 0.3s linear; transition: opacity 0.3s linear; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; }
- site-footer ul.nav li a:hover {
border-top-color: rgba(0, 0, 0, 0); -webkit-transition: border-top-color 0.3s linear; -o-transition: border-top-color 0.3s linear; -moz-transition: border-top-color 0.3s linear; -ms-transition: border-top-color 0.3s linear; transition: border-top-color 0.3s linear; -webkit-transition-delay: 80ms; -moz-transition-delay: 80ms; -o-transition-delay: 80ms; -ms-transition-delay: 80ms; transition-delay: 80ms; }
- site-footer ul.nav li a:hover:before {
opacity: 1; }
- site-footer ul.nav li a:active:before {
opacity: 1; border-top: 1px solid #222; background: rgba(0, 0, 0, .3); background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .3)), to(rgba(0, 0, 0, 0))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); background: -moz-linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); background: -o-linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); background: -ms-linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); background: linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); }
- site-footer ul.nav li:last-child a {
padding-bottom: 18px; border-bottom: 0; }
- site-footer ul.nav li:first-child a {
border-top: 0; }
- site-footer ul.nav li a.pending {
color: #888; color: rgba(255, 255, 255, 0.5); cursor: default; }
- site-footer ul.nav li a.pending:hover:before {
opacity: 0; }
- site-footer ul.nav li a span {
font-size: 12px; color: #888; color: rgba(255, 255, 255, 0.5); line-height: 18px; padding-left: 5px; }
- site-footer ul.nav li .popover.left {
left: -280px!important; top: -35px!important; /* margin-left: -110px; margin-top: 23px; */ }
- site-footer ul.nav li .popover.left .popover-content {
min-height: 80px; box-sizing: border-box; }
/* Footer Maps */
- footer-map {
width: 480px; height: 300px; }
- footer-map path {
-webkit-transition: all .25s linear; -moz-transition: all .25s linear; -o-transition: all .25s linear; -ms-transition: all .25s linear; transition: all .25s linear; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; } .jvectormap-label {
position: absolute; display: none; border-radius: 3px; background: #292929; color: white; font-size: smaller;
opacity: 0.9;
padding: 6px 13px;
box-shadow: 20px 20px 25px 5px rgba(0, 0, 0, 0.4); } .jvectormap-zoomin, .jvectormap-zoomout {
display: none;
}
/* Footer Search Form */
- site-footer input#s {
width: 200px; margin: 30px auto; border: 1px solid #3f3f3f; border: 1px solid rgba(100, 100, 100, 0.5); background: url(images/search.png) no-repeat 5px 6px; color: #555; background-color: #202020; background-color: rgba(0, 0, 0, 0.2); box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.35) inset; }
- site-footer input#s:focus {
color: #eee; } /* Copyright Info */
- copyright {
width: 80%; margin: 0 auto; padding-bottom: 50px; text-align: center; }
- copyright .hr-group hr {
display: none\9; height: 1px; margin: 0; border: 0; background-color: rgba(0, 0, 0, 0); }
- copyright .hr-group hr:first-child {
margin-top: 60px; background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); background-image: linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); }
- copyright .hr-group hr:last-child {
margin-bottom: 20px; background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0)); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0)); background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0)); background-image: linear-gradient(left, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0)); }
- copyright p,
- copyright a {
color: #ccc; color: rgba(255, 255, 255, 0.75); font-size: 12px; line-height: 1.8; text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.65); margin-bottom: 0; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; -moz-transition: color 0.3s linear; -ms-transition: color 0.3s linear; transition: color 0.3s linear; -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -o-transition-delay: 50ms; -ms-transition-delay: 50ms; transition-delay: 50ms; }
- copyright p {
cursor: default; }
- copyright a:hover {
color: #fff; }
/* = Components
*/
/* Progress Bar */
- progress-bar {
pointer-events: none; }
- progress-bar .bar {
background: #09c; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 2px; box-shadow: 0 -3px 10px 1px #09c; }
- progress-bar .peg {
display: block; position: absolute; right: 0px; width: 100px; height: 100%; box-shadow: 0 0 10px 2px #09c, 0 0 5px 1px #09c; opacity: 1; -webkit-animation: progress-pulse 2s ease-out 0 infinite; animation: progress-pulse 2s ease-out 0 infinite; -webkit-transform: rotate(3deg) translate(0px, -4px); -moz-transform: rotate(3deg) translate(0px, -4px); -ms-transform: rotate(3deg) translate(0px, -4px); -o-transform: rotate(3deg) translate(0px, -4px); transform: rotate(3deg) translate(0px, -4px); }
- progress-bar .spinner {
display: block; position: fixed; z-index: 100; top: 15px; right: 15px; }
- progress-bar .spinner-icon {
width: 18px; height: 18px; -moz-box-sizing: border-box; box-sizing: border-box; border: solid 2px transparent; border-top-color: #838383; border-left-color: #969696; border-radius: 50%; -webkit-animation: progress-spinner 400ms linear infinite; animation: progress-spinner 400ms linear infinite; }
/*slimbox2*/
- lbOverlay {
position: fixed; z-index: 9999; left:0; top: 0; width: 100%; height: 100%; background-color: #000; cursor: pointer; }
- lbCenter,#lbBottomContainer {
position: absolute; z-index: 999999; overflow: hidden; background-color: #fff; }
- lbCenter {
border-radius: 5px 5px 0 0; box-shadow: 0px 1px 8px 1.5px rgba(0, 0, 0, 0.65), 0px 40px 70px 8px rgba(0, 0, 0, 0.55); }
- lbBottomContainer {
border-radius: 0 0 5px 5px; } .lbLoading { background: #fff url('images/slimbox/loading.gif') no-repeat center; }
- lbImage {
position: absolute; left: 0; top: 0; border: 6px solid #fff; background-repeat: no-repeat; }
- lbPrevLink,#lbNextLink {
display: block; position: absolute; top: 0; width: 50%; outline: none; }
- lbPrevLink {
left: 0; }
- lbPrevLink:hover {
background: transparent url('images/slimbox/prev.gif') no-repeat 0 15%; }
- lbNextLink {
right: 0; }
- lbNextLink:hover {
background: transparent url('images/slimbox/next.gif') no-repeat 100% 15%; }
- lbBottom {
font-size: 11px; color: #666; line-height: 1.4em; text-align: left; border: 10px solid #fff; border-top-style: none; border-radius: 0 0 5px 5px; }
- lbCloseLink {
display: block; float: right; width: 66px; height: 22px; background: transparent url('images/slimbox/close.gif') no-repeat center; margin: 5px 0; outline: none; }
- lbCaption, #lbNumber {
margin-right: 71px; }
- lbCaption {
font-weight: bold; }
/* Popover & Tooltip */
.clearfix { *zoom:1; } .clearfix:before, .clearfix:after { display:table; content:""; line-height:0; } .clearfix:after { clear:both; } .hide-text { font:0/0 a; color:transparent; text-shadow:none; background-color:transparent; border:0; } .input-block-level { display:block; width:100%; min-height:30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } .tooltip { position:absolute; z-index:1030; display:block; visibility:visible; font-size:11px; line-height:1.4; opacity:0; filter:alpha(opacity=0); cursor: default; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -ms-transition: opacity 0.3s; transition: opacity 0.3s; -webkit-user-select: none; -moz-user-select: none; } .tooltip.in { opacity:0.8; filter:alpha(opacity=80); } .tooltip.top { margin-top:-3px; padding:5px 0; } .tooltip.right { margin-left:3px; padding:0 5px; } .tooltip.bottom { margin-top:3px; padding:5px 0; } .tooltip.left { margin-left:-3px; padding:0 5px; } .tooltip-inner { max-width:200px; padding:8px; color:#ffffff; text-align:center; text-decoration:none; background-color:#000000; box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.5); border-radius:4px; } .tooltip-arrow { position:absolute; width:0; height:0; border-color:transparent; border-style:solid; -webkit-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5)); -moz-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5)); -ms-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5)); -o-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5)); filter: drop-shadow(0 1px 5px rgba(0,0,0,.5)); } .tooltip.top .tooltip-arrow { bottom:0; left:50%; margin-left:-5px; border-width:5px 5px 0; border-top-color:#000000; } .tooltip.right .tooltip-arrow { top:50%; left:0; margin-top:-5px; border-width:5px 5px 5px 0; border-right-color:#000000; } .tooltip.left .tooltip-arrow { top:50%; right:0; margin-top:-5px; border-width:5px 0 5px 5px; border-left-color:#000000; } .tooltip.bottom .tooltip-arrow { top:0; left:50%; margin-left:-5px; border-width:0 5px 5px; border-bottom-color:#000000; }
/* Popover */ .popover { position: absolute; top: 0; left: 0; z-index: 1010; display: none; max-width: 276px; min-width: 176px; padding: 1px; text-align: left; white-space: normal; cursor: default; background-color: #ffffff; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0px 13px 50px 8px rgba(0, 0, 0, 0.25); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; } .popover.fade { opacity: 0; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; } .popover.fade.in { opacity: .95; } .popover.top { margin-top: -10px; } .popover.right { margin-left: 10px; } .popover.bottom { margin-top: 10px; } .popover.left { margin-left: -10px; } .popover-title { color: #555; color: rgba(0, 0, 0, 0.65); padding: 8px 14px; margin: 0; font-size: 14px; /* font-weight: normal;*/ line-height: 18px; background-color: #f7f7f7; border-bottom: 1px solid #ebebeb; border-radius: 5px 5px 0 0; } .popover-title:after { position: absolute; width: 43%; top: 8px; right: 0; content: '鐐瑰嚮鏌ョ湅璇ュ垎绫荤収鐗?'; color: #333; float: right; font-size: 12px; font-weight: normal; color: #AAA; text-shadow: 1px 1px #FFF; } .popover-title:empty { display: none; } .popover-content { color: #444; color: rgba(0, 0, 0, 0.75); padding: 9px 14px; font-size: 13px; font-weight: normal; line-height: 1.6; } .popover .arrow, .popover .arrow:after { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; } .popover .arrow { border-width: 11px; } .popover .arrow:after { border-width: 10px; content: ""; } .popover.top .arrow { bottom: -11px; left: 50%; margin-left: -11px; border-top-color: #999; border-top-color: rgba(0, 0, 0, 0.25); border-bottom-width: 0; } .popover.top .arrow:after { bottom: 1px; margin-left: -10px; border-top-color: #ffffff; border-bottom-width: 0; } .popover.right .arrow { top: 50%; left: -11px; margin-top: -11px; border-right-color: #999; border-right-color: rgba(0, 0, 0, 0.25); border-left-width: 0; } .popover.right .arrow:after { bottom: -10px; left: 1px; border-right-color: #ffffff; border-left-width: 0; } .popover.bottom .arrow { top: -11px; left: 50%; margin-left: -11px; border-bottom-color: #999; border-bottom-color: rgba(0, 0, 0, 0.25); border-top-width: 0; } .popover.bottom .arrow:after { top: 1px; margin-left: -10px; border-bottom-color: #ffffff; border-top-width: 0; } .popover.left .arrow { top: 50%; right: -11px; margin-top: -11px; border-left-color: #999; border-left-color: rgba(0, 0, 0, 0.25); border-right-width: 0; } .popover.left .arrow:after { right: 1px; bottom: -10px; border-left-color: #ffffff; border-right-width: 0; } a.popover-link { cursor: help; }
/* Back to top */
- back-to-top {
position: fixed; display: none; width: 48px; height: 48px; right: 40px; bottom: 80px;
background: rgba(255, 255, 255, 0.3);
border-radius: 24px;
box-shadow: 0px 1px 8px 1.5px rgba(0, 0, 0, 0.35), 0px 20px 70px 8px rgba(0, 0, 0, 0.25);
cursor: pointer;
-webkit-transition: background 500ms; -moz-transition: background 500ms; -ms-transition: background 500ms; -o-transition: background 500ms; transition: background 500ms; -webkit-user-select: none; -webkit-touch-callout: none; }
- back-to-top:hover {
background: rgba(255, 255, 255, 0.8); }
- back-to-top #rocket {
margin: 8px auto; display: block; opacity: 0.
}
- back-to-top #rocket path,
- back-to-top .tooltip {
-webkit-transition: all 500ms; -moz-transition: all 500ms; -ms-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }
- back-to-top:hover #rocket path {
fill: rgba(0, 0, 0, 0.5); }
- back-to-top .tooltip {
width: 100px; top: 8px !important; left: -80px !important; cursor: pointer; }
- back-to-top .tooltip.in {
left: -125px !important; }
- back-to-top .tooltip .tooltip-inner {
color: rgba(0, 0, 0, 0.5); background: rgba(255, 255, 255, 0.8); box-shadow: 0px 1px 8px 1.5px rgba(0, 0, 0, 0.35), 0px 20px 70px 8px rgba(0, 0, 0, 0.25); }
- back-to-top .tooltip .tooltip-arrow {
border-left-color: rgba(255, 255, 255, 0.8); } /* IE Alert */
- ie-alert {
position: fixed; top: 0; width: 100%; padding: 8px 0; font-size: 14px; text-align: center; background: #fd6060; border-bottom: 1px solid #f00; color: #fff; z-index: 999999; box-shadow: 0 1px 5px 3px rgba(0, 0, 0, 0.2); /* 涔犳儻鎬у姞闃村奖鐨勬瘺鐥呬粈涔堟椂鍊欐墠鑳芥敼鎺? */ }
- ie-alert a {
color: #fff; }
/* = Page - Subscription
*/
- page-subscription > header p {
text-align: center; font-size: 26px; color: #666; }
- page-subscription > section h3 {
font-size: 22px; padding: 1em; text-align: center; }
- page-subscription > section p {
padding: 0 3.5em; }
- page-subscription > section img {
display: block; width: 200px; margin: 20px auto; }
- page-subscription > section iframe {
display: block; max-width: 400px; height: 480px; margin: 50px auto 85px; border-radius: 5px; box-shadow: 0 12px 50px 3px rgba(0, 0, 0, 0.125); border: 1px solid #eaeaea; }
- page-subscription > section i {
opacity: .75; }
- page-subscription > hr {
margin: 60px 0; }
- page-subscription .feed-url {
display: block; margin: 0 2em; padding: 0.5em; text-align: center; font-size: 26px; color: #888; background: #eaeaea; border-radius: 5px; }
/* = Page - iOS App
*/
- page img.masterhead {
max-width: 962px; width: 101%; width: calc(100% + 2px); max-height: 541px; margin-top: -91px; margin-left: -1px; border-top-left-radius: 3px; border-top-right-radius: 3px; }
- page img.masterhead.alternative {
position: absolute; transition: opacity .5s ease-in-out; opacity: 0; }
- page img.masterhead.alternative:hover {
opacity: 1; }
- page img.app-icon {
display: block; margin: 5em auto 3.5em; max-width: 100px; border-radius: 17.544%; border: 1px solid #f8f8f8; box-shadow: 0px 10px 80px 5px rgba(0, 0, 0, 0.05); }
- content.page-app header {
text-align: center; }
- content.page-app h2 {
font-size: 26px; }
- content.page-app h3 {
font-size: 20px; margin-bottom: 3em; }
- content.page-app section#intro {
text-align: center; margin-bottom: 7.5em; }
- content.page-app section.details {
height: 350px; width: 118%; margin-left: -9%; }
- content.page-app section.details:nth-child(odd) {
background-color: #fafafa; }
- content.page-app section.details:last-child {
margin-bottom: -7em; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } /*
- content.page-app section#stay-updated {
background-color: #e2eff1; color: #65799b; }
- content.page-app section#essentials {
background-color: #b6d5e1; color: #555273; }
- content.page-app section#compression {
background-color: #65799b; color: #e2eff1; }
- content.page-app section#download {
background-color: #555273; color: #b6d5e1; }
- /
- content.page-app section.details > div {
display: inline-block; height: 100%; width: 50%; }
- content.page-app section.details.center > div {
display: block; height: 50%; width: 100%; text-align: center; }
- content.page-app section.details.left > div {
float: left; }
- content.page-app section.details.right > div {
float: right; }
- content.page-app section.details > div.detail-content {
padding: 5em; box-sizing: border-box; }
- content.page-app section.details.center > div.detail-content {
padding-top: 3em; }
- content.page-app section.details.left > div.detail-content {
padding-left: 0; }
- content.page-app section.details.right > div.detail-content {
padding-right: 0; }
- content.page-app section.details > div.detail-content > h3 {
font-size: 28px; margin-bottom: 0.5em; }
- content.page-app section.details > div.detail-content > p {
font-size: 20px; }
- content.page-app section.details > div.detail-image {
text-align: center; }
- content.page-app section.details > div.detail-image > img {
height: 100%; max-height: 350px; }
- content.page-app section.details.center > div.detail-image > img {
max-width: 600px; height: auto; }
- qr-download > canvas {
border-radius: 5px; opacity: .8; margin-bottom: 0.5em; }
@media (max-width: 599px) { #content.page-app section { background-color: #fff!important; } #content.page-app section.details { height: auto; width: 100%; margin-left: 0; text-align: center; } #content.page-app section.details > div { float: none!important; width: 100%; height: auto; } #content.page-app section.details > div.detail-content { padding: 0; } #content.page-app section.details p { text-align: center; } #content.page-app section.details > div.detail-image > img { height: auto; } #stay-updated > div.detail-image, #compression > div.detail-image, #qr-download { display: none!important; } }
/* = Animations
*/
@-webkit-keyframes header-loading { 0% { -webkit-transform: translate(0, -110px); opacity: 0.30; } 100% { -webkit-transform: translate(0, 0); opacity: 1; } } @keyframes header-loading { 0% { -webkit-transform: translate(0, -110px); opacity: 0.30; } 100% { -webkit-transform: translate(0, 0); opacity: 1; } } @-webkit-keyframes menu-opening { 0% { -webkit-filter: blur(8px); } 100% { -webkit-filter: none; } } @keyframes menu-opening { 0% { -webkit-filter: blur(8px); } 100% { -webkit-filter: none; } } @-webkit-keyframes link-hover { 0% { text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); } 50% { text-shadow: 1px 1px 13px rgba(0, 0, 0, 0.4); } 100% { text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); } } @keyframes link-hover { 0% { text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); } 50% { text-shadow: 1px 1px 13px rgba(0, 0, 0, 0.4); } 100% { text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); } } @-webkit-keyframes title-link-hover { 0% { text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3); } 50% { text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6); } 100% { text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3); } } @keyframes title-link-hover { 0% { text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3); } 50% { text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6); } 100% { text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3); } } @-webkit-keyframes progress-spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes progress-spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes progress-pulse {
0% { opacity: 1; } 50% { opacity: .3; }
100% {
opacity: 1; }
} @keyframes progress-pulse {
0% { opacity: 1; } 50% { opacity: .3; }
100% {
opacity: 1; }
} /* = Retina Display
*/
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { #site-footer { background: #333 url(""); background-size: 10px 10px; } #respond input[type="text"], #respond textarea { background: url(""); background-size: 190px 191px; } } /* = Responsive Structure
*/
@media (min-width: 1680px) { #content nav.float.left { padding-right: 270px; } #content nav.float.right { padding-left: 270px; } }
@media (min-width: 1440px) { #site-footer .container { width: 1440px; } #site-footer .panel { width: 180px; } #site-footer .panel:first-child { width: 540px; } #site-footer .panel:last-child { width: 540px; } #site-footer ul.nav li a:before { width: 180px; left: -11px; } #site-footer .images-container { margin-right: 18px; } }
@media (min-width: 1280px) { #nav li ul { width: 200px; } #content nav.float, #content nav.float .tooltip { display: block; } }
@media (max-width: 1280px) { #site-footer .container { height: 750px; } #site-footer .panel#footer-panel-2, #site-footer .panel#footer-panel-3 { position: absolute; border: none; top: 500px; width: 200px; margin-left: 50%; } #site-footer .panel#footer-panel-2 { left: -200px; } #site-footer .panel:first-child, #site-footer .panel:last-child { width: 50%; } }
@media (max-width: 1170px) { #nav ul li:last-child:hover ul { left: -139px; } #nav ul li:last-child ul:after { left: auto; right: 30px; } }
@media (max-width: 1000px) { #main-logo { margin-left: 20px; } #nav > ul > li { /* width: 70px; */ } #nav ul li:last-child ul:after { right: 22px; } #nav ul li:last-child:hover ul { left: auto; right: 0; } .related-posts .related-box:last-child { display: none; } #back-to-top { display: none!important; } }
@media (max-width: 970px) { #page, #page-heading { border: none; border-radius: 0; margin-bottom: 0; } #site-footer { border-top: 0; margin-top: 0; } }
@media (max-width: 940px) { #respond p.comment-form-author, #respond p.comment-form-email, #respond p.comment-form-url { display: block; width: 95%; max-width: none; } #respond p.comment-form-url { margin-left: 0; } #respond .form-submit { margin-top: 40px; } #site-footer .container { height: auto; } #site-footer .panel { width: 480px!important; float: none; margin: auto; border: none; } #site-footer .panel#footer-panel-2, #site-footer .panel#footer-panel-3 { position: relative; width: inherit; margin-left: auto; top: 0; left: auto; } #site-footer .panel#footer-panel-1 { margin-bottom: 30px; } #site-footer .panel > h3 { text-align: center; } #site-footer .panel:first-child > h3 { margin-left: 0; } #copyright { width: 90%; } }
@media (max-width: 800px) { body { overflow-x: hidden; } /* Simplify the basic layout */ #content { margin: 0 3%; width: auto; } #content .entry-header .entry-title { text-align: center; font-size: 200%; } #nav-below { border-bottom: 1px solid #ddd; margin-bottom: 1.625em; } hr.article { background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0) 100%); } /* Simplify the showcase template */ .page-template-showcase-php .featured-posts { min-height: 280px; } .featured-posts section.featured-post { height: auto; } .page-template-showcase-php section.recent-posts { float: none; margin: 0; width: 100%; } .page-template-showcase-php .other-recent-posts { border-bottom: 1px solid #ddd; } /* Simplify the showcase template when small feature */ section.featured-post .attachment-small-feature, .one-column section.featured-post .attachment-small-feature { border: none; display: block; float: left; height: auto; margin: 0.625em auto 1.025em; max-width: 30%; position: static; } article.feature-image.small { float: right; margin: 0 0 1.625em; width: 64%; } .one-column article.feature-image.small .entry-summary { height: auto; } article.feature-image.small .entry-summary p a { left: 0; padding-left: 20px; padding-right: 20px; width: auto; } /* Remove the margin on singular articles */ .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title { width: 100%; } /* Simplify the pullquotes and pull styles */ .singular blockquote.pull { margin: 0 0 1.625em; } .singular .pull.alignleft { margin: 0 1.625em 0 0; } .singular .pull.alignright { margin: 0 0 0 1.625em; } .singular .entry-meta .edit-link a { left: 0; position: absolute; top: 40px; } .singular #author-info { margin: 2.2em -8.8% 0; padding: 20px 8.8%; } /* Make sure we have room for our comment avatars */ .commentlist { width: 100%; } .commentlist > li.comment, .commentlist .pingback { margin-left: 102px; width: auto; } /* And a full-width comment form */ #respond { width: auto; } }
@media (max-width: 767px) { #main-header { height: 45px; } #main-header > .container { margin: 20px auto; } #main-logo > img { max-width: 200px; } #nav { position: relative; top: auto; left: auto; } #nav > a { width: 3.125em; /* 50 */ height: 3.125em; /* 50 */ text-align: left; text-indent: -9999px; position: absolute; right: 10px; top: 10px; } #nav > a:before, #nav > a:after { position: absolute; border: 2px solid #585858; top: 35%; left: 25%; right: 25%; content: ; } #nav > a:after { top: 60%; } #nav li ul:after, #nav > ul > li > a:after, #nav > ul:not( :hover ) > li > a:after { display: none; } #nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type { display: block; }
/* first level */ #nav > ul { width: 50%; height: auto; display: none; position: absolute; /* left: 0; */ top: 65px; right: 0; margin-right: 0; z-index: 999999; background-color: #F1F1F1; background-color: rgba(245, 245, 245, 0.9); border-radius: 5px 0 0 5px; box-shadow: 0px 1px 8px 1.5px rgba(0, 0, 0, 0.35), 0px 15px 50px 8px rgba(0, 0, 0, 0.35); } #nav:target > ul { display: block; } #nav > ul > li { width: 100%; float: none; font-size: 18px; line-height: normal; padding: 0; } #nav > ul > li > a { height: auto; text-align: left; padding: 15px 0.833em; /* 20 (24) */ } #nav > ul > li:not( :last-child ) > a { border-right: none; border-top: 1px solid rgba(255, 255, 255, 0.9); border-bottom: 1px solid rgba(0, 0, 0, 0.15); } #nav ul li:first-child a { border-top-left-radius: 5px; } #nav ul li:last-child a { border-bottom-left-radius: 5px; padding-bottom: 18px; } /* second level */ #nav li ul { position: static; padding-top: 0; margin: 0; width: 100%; box-shadow: none; border-radius: 0; background-color: #ddd; background-color: rgba(0, 0, 0, 0.1); } #nav li ul li:first-child a, #nav li ul li:last-child a { border-radius: 0; } #nav > ul > li:hover > a { background-image: none; background-color: #d5d5d5; background-color: rgba(0, 0, 0, 0.15); } } @media (max-width: 650px) { #content .entry-header .entry-title { margin: 0; } #header { background-size: 192px 45px; background-position: center 0; height: 100px; width: auto; overflow: hidden; } #page-heading #s { width: 70%; } #page-heading #s:focus { width: 70%; } #main #content { margin: 0 4.6%; width: auto; } #content .gallery-columns-2 .gallery-item { width: 45%; padding-right: 4%; } #content .gallery-columns-2 .gallery-item img { width: 100%; height: auto; } article.intro .entry-content { font-size: 12px; } .featured-post .entry-title { font-size: 14px; } .singular .entry-title { font-size: 28px; } .entry-meta { font-size: 12px; } #qr { display: none; } /* Reposition the site title and description slightly */ #site-title { padding: 5.30625em 0 0; } #site-title, #site-description { margin-right: 0; } /* Make sure the logo and search form don't collide */ #searchform { top: 1.625em !important; } /* Floated content doesn't work well at this size */ .alignleft, .alignright { float: none; margin-left: 0; margin-right: 0; } /* Make sure the post-post navigation doesn't collide with anything */ #nav-single { display: block; position: static; } .singular .hentry { padding: 1.625em 0 0; } .singular.page .hentry { padding: 1.625em 0 0; } /* Talking avatars take up too much room at this size */ .commentlist > li.comment, .commentlist > li.pingback { margin-left: 0 !important; } .commentlist .avatar { background: transparent; display: block; padding: 0; position: static; } .commentlist .children .avatar { background: none; left: 2.2em; padding: 0; position: absolute; top: 2.2em; } /* Use the available space in the smaller comment form */ #respond, .commentlist .children li.comment { padding: 1em; } #comments-title, #respond #reply-title, #respond .comment-notes { text-align: center; } a#cancel-comment-reply-link { position: relative; font-size: 14px; top: 0; left: 0; } #respond input[type="text"] { width: 95%; } #respond textarea { width: 100%; box-sizing: border-box; } #respond .comment-form-author .required, #respond .comment-form-email .required { left: 95%; } .one-column .commentlist .children .avatar { top: 1.35em; left: 1.35em; } #content .gallery-columns-3 .gallery-item { width: 31%; padding-right: 2%; } #content .gallery-columns-3 .gallery-item img { width: 100%; height: auto; }
.single .entry-content p img.size-full { margin: 35px auto; }
.commentlist > li.comment { padding: 1em; }
.one-column .commentlist > li.comment .comment-meta, .one-column .commentlist > li.comment .comment-content { margin-right: 0; }
.one-column .commentlist > li.comment .avatar-68 { width: 56px; height: 56px; margin: auto; margin-bottom: 18px; }
.breadcrumbs,
.breadcrumbs + #nav-single {
display: none;
}
#content nav#nav-single {
text-align: center;
padding-top: 2em;
}
#content nav a {
font-size: 18px;
}
#ckepop {
display: none;
}
#site-footer .panel {
padding: 10px 30px;
}
}
@media (max-width: 480px) { body { font-size: 16px; line-height: 1.5; } #page-heading { height: 35px; } #page img.masterhead { margin-top: -35px; margin-left: 0; width: 100%; border-radius: 0; } #searchform { display: none; }
#nav > a { top: 5px; } #nav > ul { width: 100%; top: 75px; left: 0; margin: 0; border-radius: 0; } #nav ul li:first-child a, #nav ul li:last-child a { border-radius: 0; } #nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a { box-shadow: none; }
.related-posts { width: 300px; } .related-box { margin: 15px 10px 0; }
#site-footer .panel { width: 100%!important; } #site-footer .images-container { width: 270px; float: none; margin: auto; } #footer-images-grid > a:first-child { display: none; } #site-footer .switch-bar { width: 300px; margin-left: 50%; left: -105px; } #footer-map { width: 100%; } } @media (max-width: 320px) { body { padding: 0; } #page { border-radius: 0; } #header { background-size: 192px 45px; } .entry-title { padding-right: 0; } #copyright .hr-group hr:first-child { margin-top: 0; } }
@media (max-width: 275px) { #s { width: 25%; } #s:focus { width: 25%; } #site-footer .panel:first-child, #site-footer .panel:last-child { display: none; } }
*/
@media print { body { background: none !important; font-size: 10pt; } footer.entry-meta a[rel=bookmark]:link:after, footer.entry-meta a[rel=bookmark]:visited:after { content: " [" attr(href) "] "; /* Show URLs */ } #page { clear: both !important; display: block !important; float: none !important; max-width: 100%; position: relative !important; } #searchform { display: none; } #main { border-top: none; box-shadow: none; } #content { margin: 0; width: auto; } #content.singular { margin: 0; width: 100%; } .singular .entry-header .entry-meta { position: static; } .entry-meta .edit-link a { display: none; } #content nav { display: none; } .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title { margin: 0; width: 100%; } .singular .hentry { padding: 0; } .entry-title, .singular .entry-title { font-size: 21pt; } .entry-meta { font-size: 10pt; } .entry-header .comments-link { display: none; } .page-link { display: none; } .singular #author-info { background: none; border-bottom: none; border-top: none; margin: 2.2em 0 0; padding: 0; } #respond { display: none; } #colophon { display: none; }
/* Comments */ .commentlist > li.comment { background: none; border: 1px solid #ddd; -moz-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; margin: 0 auto 1.625em; padding: 1.625em; position: relative; width: auto; } .commentlist .avatar { height: 39px; left: 2.2em; top: 2.2em; width: 39px; } .commentlist li.comment .comment-meta { line-height: 1.625em; margin-left: 50px; } .commentlist li.comment .fn { display: block; } .commentlist li.comment .comment-content { margin: 1.625em 0 0; } .commentlist .comment-edit-link { display: none; } .commentlist > li::before, .commentlist > li.bypostauthor::before { content: ; } .commentlist .reply { display: none; }
/* Post author highlighting */ .commentlist > li.bypostauthor { color: #444; } .commentlist > li.bypostauthor .comment-meta { color: #666; } .commentlist > li.bypostauthor:before { content: none; }
/* Post Author threaded comments */ .commentlist .children > li.bypostauthor { background: #fff; border-color: #ddd; } .commentlist .children > li.bypostauthor > article, .commentlist .children > li.bypostauthor > article .comment-meta { color: #666; }
}
/* = IE7
*/
- ie7 article.intro {
margin-left: -7.6%; margin-right: -7.6%; padding-left: -7.6%; padding-right: -7.6%; max-width: 1000px; }
- ie7 section.featured-post {
margin-left: -7.6%; margin-right: -7.6%; max-width: 850px; }
- ie7 section.recent-posts {
margin-right: 7.6%; }
img.wp-smiley,
img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1em !important;
width: 1em !important;
margin: 0 .07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}
</style>
<link rel='https://api.w.org/' href='https://www.camarts.cn/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.camarts.cn/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.camarts.cn/wp-includes/wlwmanifest.xml" />
<style>
/* = Dynamic Styles
*/
- -webkit-scrollbar {
width: 10px; background: #eee; opacity: .8; }
- -webkit-scrollbar-button {
width: 10px; height: 5px; }
- -webkit-scrollbar-track {
background: #eee; border: 1px solid lightgray; box-shadow: 0px 0px 3px #dfdfdf inset; border-radius: 10px; }
- -webkit-scrollbar-thumb {
background: #969696; border: thin solid gray; border-radius: 10px; -webkit-transition: background .25s linear; }
- -webkit-scrollbar-thumb:hover {
background: #7d7d7d; -webkit-transition: background .25s linear; }
.ribbon-version1 {
position: relative;
top: -10px;
left: -10px;
max-width:200px;
float:left;
}
.expand-btn , .expand-btn2 , .expand-btn3, .expand-btn4, .expand-btn5, .expand-btn6, .expand-btn7, .expand-btn8, .expand-btn9, .expand-btn10, .expand-btn11, .expand-btn12, .expand-btn13, .expand-btn14, .expand-btn15, .expand-btn16, .expand-btn17, .expand-btn18, .expand-btn19, .expand-btn20, .expand-btn21, .expand-btn22, .expand-btn23, .expand-btn24, .expand-btn25, .expand-btn26, .expand-btn27, .expand-btn28, .expand-btn29, .expand-btn30{ display: block; width: 100%; text-align: center; padding: 10px 20px 0; font-size: 1.1em; border-top: 1px solid #ccc; text-decoration: none; color: #7baae8;
cursor: pointer;
}
@media screen and (min-width:480px) { .expand-btn, .expand-btn2, .expand-btn3, .expand-btn4, .expand-btn5, .expand-btn6, .expand-btn7, .expand-btn8, .expand-btn9, .expand-btn10, .expand-btn11, .expand-btn12, .expand-btn13, .expand-btn14, .expand-btn15, .expand-btn16, .expand-btn17, .expand-btn18, .expand-btn19, .expand-btn20, .expand-btn21, .expand-btn22, .expand-btn23, .expand-btn24, .expand-btn25, .expand-btn26, .expand-btn27, .expand-btn28, .expand-btn29, .expand-btn30{ padding-bottom: 0; } }
@media screen and (min-width:768px) { .expand-btn, .expand-btn2 , .expand-btn3, .expand-btn4, .expand-btn5, .expand-btn6, .expand-btn7, .expand-btn8, .expand-btn9, .expand-btn10, .expand-btn11, .expand-btn12, .expand-btn13, .expand-btn14, .expand-btn15, .expand-btn16, .expand-btn17, .expand-btn18, .expand-btn19, .expand-btn20, .expand-btn21, .expand-btn22, .expand-btn23, .expand-btn24, .expand-btn25, .expand-btn26, .expand-btn27, .expand-btn28, .expand-btn29, .expand-btn30 { text-align: right; padding: right: 30px; } .note-title { font-size: 1.75em; } }
.note-content,.note-content2 ,.note-content3,.note-content4,.note-content5,.note-content6,.note-content7,.note-content8,.note-content9,.note-content10,.note-content11,.note-content12,.note-content13,.note-content14,.note-content15,.note-content16,.note-content17,.note-content18,.note-content19,.note-content20,.note-content21,.note-content22,.note-content23,.note-content24,.note-content25,.note-content26,.note-content27,.note-content28,.note-content29,.note-content30{ display: none; }
.side-nav {
display: none;
}
@media only screen and (min-width:769px) {
.side-nav{
position: fixed;
display: block;
top: 140px; left: 10px; border: 1px solid #ccc; z-index: 5;
border-radius: 5px; font-weight:bold;
background:url(http://pic.qiantucdn.com/58pic/12/95/00/85Y58PICpKB.jpg); }
.side-nav h4 {
padding-left: 15px; border-bottom: 1px solid #ccc;
}
.side-nav ul { padding-left: 0;
margin-left: 0;
}
.side-nav li { list-style: none; margin: 0px; padding: 1px;
max-width: 120px;
} .topLink{ padding:2px,30px;
} }