博客园主题美化：Cnblogs-Theme-SimpleMemory
Posted Festu
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了博客园主题美化：Cnblogs-Theme-SimpleMemory相关的知识，希望对你有一定的参考价值。
BNDong博客主题美化
1.前言
最近浏览博客园发现这款非常好看的主题，就想给自己的博客也整一个，在网上参考了很多博客后发现有些混乱，版本不一致，而且很多没有详言如何进行维护与增添，在此进行整理以供参考。
本主题原作者为BNDong大佬，他分享了自己的博客主题。
GitHub地址：Theme-SimpleMemory
BNDong大佬博客：https://www.cnblogs.com/bndong/
(ORZ真的好强，看起来舒服美观很有高级感，而且可维护的地方很多，完全不像是博客园)
2.博客美化步骤
其实GitHub上本来是有教程的，但是不知道为什么访问不了了，参考了一些GitHub上的交流区后基本弄清了几个基本步骤。
I.基本设置
将博客皮肤设置为SimpleMemory，同时申请开通JS权限，理由如实填写即可。
II.CSS定制源码
若要选择最新版主题，直接访问GitHub仓库的"dist"文件，CSS源码与JS源码都在这里，"simpleMemory.9z2n3tpk.js"不清楚是什么= =。访问"simpleMemory.css"文件后单击两个小方块的按钮复制源码，粘贴至CSS定制代码处，然后勾选"禁用模板默认CSS"即可。
若要选择其他版本的主题，访问GitHub页面的右下方Release，里面有各版本的主题源码，路径同最新版。
由于GitHub的网络连接不怎么稳定，复制可能不成功，需要多试几次。在此贴出v2.1.0版本的CSS代码:
点击查看代码
.article-info-tag, button
text-transform: uppercase
.day, .postMeta, .postSticky
position: relative
.postTitle a:link, html
-webkit-tap-highlight-color: transparent
#blog-calendar, .code-copay-btn, .code-hljs-len, .hidden
visibility: hidden
#EntryTag, #blogTitle h1
margin-top: 20px
#EntryTag a, .postSticky
background: #6fa3ef
#blogTitle h1 a:hover, .dayTitle a, a, a:active, a:link, a:visited
color: #5c8ec6
#calendar table a:hover, #navList a:hover, .postDesc a:hover, a:active, a:hover, a:link, a:visited, button
text-decoration: none
#mainContent, #sideBar, #topics
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden
*, .Cal
padding: 0
::-moz-selection
color: #FFF;
background: #807dd4
::selection
background: #807dd4;
color: #FFF
::-webkit-selection
background: #807dd4;
color: #FFF
::-webkit-scrollbar
width: 3px;
height: 3px
::-webkit-scrollbar-track
width: 3px;
background-color: #f9f9f9
::-webkit-scrollbar-thumb
background-color: #999;
background-clip: padding-box;
min-height: 100px
::-webkit-scrollbar-thumb:hover
background-color: #555
#BlogPostCategory a
background: #E8A258
#BlogPostCategory a span, #EntryTag a span
margin-right: 3px
.topicListFooter
text-align: right;
margin-right: 10px;
margin-top: 10px
#navList a, .dayTitle, button
text-align: center
#home, .inner
margin: 0 auto
#divRefreshComments
margin-right: 10px;
font-size: 9pt
*
margin: 0
html
height: 100%;
font-size: 62.5%
body
background-color: #fff;
font-size: 12px;
font-family: Merriweather, "Open Sans", "Microsoft Jhenghei", "Microsoft Yahei", sans-serif;
color: #3A4145;
-moz-font-feature-settings: \'kern\'1;
-o-font-feature-settings: \'kern\'1;
overflow: hidden
table
border-collapse: collapse;
border-spacing: 0
fieldset, img
border: 0
li
list-style: none
img
max-width: none
a
outline: 0
a:hover
color: #f60
.clear
clear: both
button
width: auto;
display: inline-block;
padding: .1rem 1.5rem;
cursor: pointer;
outline: 0;
color: #fff;
font-family: \'Open Sans\', sans-serif;
font-size: 11px;
line-height: 13px;
font-weight: 300;
letter-spacing: 1px;
text-shadow: none;
border-radius: .3rem;
border: .1em solid rgba(0, 0, 0, .05);
background: #5ba4e5
#topics .postTitle a:link, .page-title, .sb-title
text-shadow: 0 3px 6px rgba(0, 0, 0, .3)
b
font-weight: 400
#home
width: 70%;
max-width: 900px;
background-color: rgba(255, 255, 255, .9);
padding: 0 20px 30px;
box-shadow: 0 0 20px 10px rgba(220, 220, 220, .3)
#header
padding-bottom: 5px;
margin-top: 10px
#blogTitle
height: 60px;
clear: both
#blogTitle h1
font-size: 26px;
font-weight: 700;
line-height: 1.5em
#blogTitle h1 a
color: #515151
#blogTitle h2
font-weight: 400;
font-size: 13px;
line-height: 1.846153846;
color: #757575;
float: left
#blogLogo
float: right
#navigator
font-size: 13px;
border-bottom: 1px solid #ededed;
border-top: 1px solid #ededed;
height: 50px;
clear: both;
margin-top: 25px
#bannerbar
display: none
#blog-calendar td, #blog-calendar th, .Cal, .btn_my_zzk, .dayTitle
font-size: 12px
#navList
min-height: 30px;
float: left
#navList li
float: left;
margin: 0 40px 0 0
#navList a
display: block;
width: 5em;
height: 22px;
float: left;
padding-top: 19px
#navList a:active, #navList a:link, #navList a:visited
color: #6a6a6a;
font-weight: 700
#navList a:hover
color: #000
.blogStats
float: right;
color: #757575;
margin-top: 19px;
margin-right: 2px;
text-align: right
#main
margin-top: 30px;
width: 100%;
text-align: left
#mainContent .forFlow
float: none;
width: auto
#mainContent
min-height: 200px;
padding: 0 0 10px;
float: none;
margin: auto;
width: 100%
.day, .entrylistItem:not(:last-of-type)
min-height: 10px;
border-bottom: #e9e9e9 1px solid
.day:after, .entrylistItem:not(:last-of-type):after
content: "";
width: 7px;
height: 7px;
bottom: -5px;
left: 50%
.day
margin: 3.5rem auto;
padding-bottom: 3.3rem;
word-wrap: break-word
.btn_my_zzk, .c_b_p_desc_img, .day:after, .dayTitle
position: absolute
.c_b_p_desc_readmore
display: block;
background: 0 0;
border: 0;
border-bottom: 2px solid #666;
font-size: 16px;
padding: 0;
transition-property: border;
font-weight: 600;
width: 85px;
text-align: center;
color: #555 !important;
margin-top: 20px
.day:after
display: block;
border: 1px solid #e9e9e9;
margin-left: -5px;
background: #FFF;
border-radius: 100%;
box-shadow: rgba(255, 255, 255, .7) 0 0 0 5px
.dayTitle
display: none;
border: 1px solid #5c8ec6;
background: azure;
border-radius: 50%;
height: 65px;
line-height: 1.5;
margin: 15px 15px 15px -100px;
width: 63px;
clear: both;
top: -15px
.dayTitle a
display: inline-block;
margin-top: 15px;
width: 60px
.desc_img
display: none
.c_b_p_desc_img
width: calc(39% - 20px);
height: 100%;
opacity: .9;
top: -5px;
border-left: 1px dashed #e9e9e9;
right: 0;
padding-left: 13px;
overflow: hidden
.c_b_p_desc_img div
border-radius: 4px;
width: 100%;
height: 100%;
margin: 0;
opacity: .95
.postCon, .postDesc, .postSeparator, .postTitle
width: 100%;
clear: both
.postTitle
font-size: 20px;
float: right
.postTitle a:active, .postTitle a:visited
color: #4A4A4A;
transition: color .3s ease
.postTitle a:link
background-color: rgba(0, 0, 0, 0);
color: #4a4a4a;
font-family: "Open Sans", "Microsoft Jhenghei", "Microsoft Yahei", sans-serif;
font-size: 3.1rem;
font-weight: 700;
letter-spacing: -1px;
transition-delay: 0s;
transition-duration: .3s;
transition-property: color;
transition-timing-function: ease;
word-wrap: break-word
.postTitle a:hover
color: #000
.entrylistPostSummary, .postCon
font-feature-settings: \'liga\'1, \'onum\'1, \'kern\'1;
line-height: 1.7em;
word-wrap: break-word;
padding: 25px 0 10px;
color: #3a4145;
font-family: Noto Sans SC, serif;
margin: 0;
text-align: justify;
font-size: 1.45em;
display: block;
position: relative;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0
.postMeta
font-size: 14px;
color: #888;
top: 10px;
display: inline-block
.postDesc, p.article-info-text>.postMeta br
display: none
.postMeta>i
font-size: 15px;
margin: 0 5px
.postMeta>i:not(:first-child)
margin-left: 10px
.postDesc
float: left;
text-align: left;
padding-right: 5px;
margin: 0;
font-family: "Open Sans", sans-serif;
font-size: 1.4rem;
line-height: 2.2rem;
color: #9EABB3
#blog-calendar td, #sb_widget_my_zzk, .CalTitle
text-align: center
#cnblogs_post_body h1:hover::after, #cnblogs_post_body h2:hover::after, #cnblogs_post_body h3:hover::after, #cnblogs_post_body h4:hover::after, #cnblogs_post_body h5:hover::after
content: "#";
color: rgba(13, 110, 253, .5);
margin-left: 5px;
transition: color .15s ease-in-out
p.article-info-text>.postMeta
font-size: 16px;
font-weight: 700;
color: rgba(255, 255, 255, .9);
font-family: Noto Sans SC, serif;
text-shadow: 0 3px 6px rgba(0, 0, 0, .5)
#blog-calendar td, #calendar td
font-family: "Comic Sans MS"
p.article-info-text>.postMeta i
font-size: 16px
.postDesc a:active, .postDesc a:link, .postDesc a:visited
color: #666
.postDesc a:hover
color: #5c8ec6
.postSticky
display: inline-block;
font-size: 14px;
color: #fff;
padding: 1px 3px;
border-radius: 3px;
top: -6px
.postSeparator
height: 1px;
float: right;
margin: 0 auto 15px
#sideBar
margin-top: -15px;
width: 230px;
padding: 0 0 0 5px;
float: right
#sideBar a
color: #757575
#sideBar a:hover
color: #5c8ec6;
text-decoration: underline
#sb_widget_my_zzk
width: 100%
.btn_my_zzk
width: 25px;
height: 25px;
color: transparent;
border: 0;
cursor: pointer;
top: 1px;
right: -35px
.input_my_zzk:focus, .input_my_zzk:hover
border: 1px solid #666
.input_my_zzk:hover
transition: all .4s linear 0s
.catList, .catListArticleArchive, .catListArticleCategory, .catListBlogRank, .catListComment, .catListEssay, .catListFeedback, .catListImageCategory, .catListLink, .catListNoteBook, .catListPostArchive, .catListPostCategory, .catListTag, .catListView, .mySearch, .newsItem
background: #fff;
margin-bottom: 35px;
word-wrap: break-word
#blog-calendar
margin: 10px 5px 5px 10px
#calendar
width: 228px;
padding-bottom: 5px;
margin-bottom: 35px;
border: 1px solid #EDEDED;
box-shadow: 0 1px 3px #ccc
.calendar
border: 0 solid #000
#calendar .Cal
width: 100%;
line-height: 1.5em
#calendar td
background: #FFF;
padding-top: 2px
.Cal
border: none;
color: #666;
width: 100%;
font-family: arial
.CalOtherMonthDay, .CalWeekendDay
padding-top: 4px;
padding-bottom: 4px
#calendar table a:active, #calendar table a:link, #calendar table a:visited
font-weight: 700
#calendar table a:hover
color: #fff
.CalTodayDay
color: #b8b8b8;
font-weight: 700;
background: #2d2d2b
.CalDayHeader, .CalWeekendDay
background: #111
.CalOtherMonthDay
color: #3c3c3c
#calendar .CalNextPrev a:active, #calendar .CalNextPrev a:link, #calendar .CalNextPrev a:visited
font-weight: 700;
padding-left: 10px;
padding-right: 15px
.CalDayHeader
font-weight: 700;
padding-bottom: 5px;
padding-top: 5px
.CalTitle
background: #6293bb;
width: 100%;
height: 30px;
font-size: 14px;
font-weight: 700;
padding: 5px 0
.CalTitle td
background: #000;
font-family: verdana;
font-size: 12px;
font-weight: 700
.Cal td
height: 20px;
font-size: 10px
.Cal a:active, .Cal a:link, .Cal a:visited
color: #ff9;
text-decoration: underline
.Cal a:hover
text-decoration: none
.CalSelector
background: #efefef
.catListTitle
font-weight: 700;
line-height: 1.2;
font-size: 110%;
margin-top: 15px;
margin-bottom: 10px;
text-align: left
#sideBarMain ul, .catListComment, .page-description, .pfl_feedback_area_title
line-height: 1.5em
.divRecentComment
text-indent: 2em;
color: #494949;
margin-bottom: 20px
#sideBarMain li
line-height: 1.8
#topics
width: 100%;
min-height: 200px;
padding: 0 0 10px;
margin: 15px auto 4rem;
font-family: -apple-system, SF UI Text, Arial, PingFang SC, Hiragino Sans GB, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif
#topics .postTitle
border: 0;
font-size: 130%;
font-weight: 700;
line-height: 1.5;
width: 100%;
padding-left: 5px
#BlogPostCategory, #BlogPostCategory a:active, #BlogPostCategory a:link, #BlogPostCategory a:visited, #EntryTag, #EntryTag a:active, #EntryTag a:link, #EntryTag a:visited
color: #666
#BlogPostCategory a, #EntryTag a
height: 20px;
line-height: 20px;
color: #fff !important;
padding: 3px 5px;
border-radius: 3px;
margin: 2px 5px 0;
text-decoration: none;
font-size: 14px
#BlogPostCategory a:hover, #EntryTag a:hover
transition: all .3s linear 0s;
opacity: .8
#topics .postDesc
padding-left: 0;
width: 100%;
text-align: left;
color: #666;
margin-top: 5px;
background: 0 0
.feedbackListSubtitle-louzhu:after, .feedbackListSubtitle:after, .feedbackListSubtitle:before
top: 11px;
right: 100%;
left: -16px;
width: 0;
height: 0;
content: " ";
border-style: solid solid outset;
position: absolute;
display: block;
pointer-events: none
.feedback_area_title
font: normal normal 16px/35px "Microsoft YaHei";
margin: 10px 0 30px
.louzhu
margin: 0 2px
.feedbackListSubtitle a:active, .feedbackListSubtitle a:link, .feedbackListSubtitle a:visited
color: #777;
font-weight: 700
.feedbackListSubtitle a:hover
color: #5c8ec6;
text-decoration: underline
.feedbackListSubtitle b
color: #5c8ec6
.feedbackListSubtitle:before
border-color: transparent #d1d5da transparent transparent;
border-width: 8px
.feedbackListSubtitle-louzhu:after, .feedbackListSubtitle:after
border-color: transparent;
margin-top: 1px;
margin-left: 2px;
border-width: 7px
.feedbackListSubtitle:after
border-right-color: #f6f8fa
.feedbackListSubtitle-louzhu:after
border-right-color: #f1f8ff !important
.feedbackManage
width: 200px;
text-align: right;
float: right
.feedbackCon
padding: 10px 20px;
min-height: 35px;
line-height: 1.5;
border: 1px solid #e9e9e9;
border-top: 0;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
background: #fff;
position: relative
.feedbackListSubtitle-louzhu
background-color: #f1f8ff !important;
border-bottom-color: #c0d3eb !important
.feedbackItem
position: relative;
padding: 15px 0 15px 60px;
margin: 0;
font-size: 13px
.feedbackItem:before
position: absolute;
top: 0;
bottom: 0;
left: 90px;
display: block;
z-index: 0;
width: 2px;
content: "";
background-color: #e1e4e8
.feedbackAvatar
position: absolute;
left: 1px
.feedbackAvatar img
width: 40px;
height: 40px;
border: 1px solid #d1d5da;
padding: 2px;
border-radius: 3px
div#tbCommentBodyPreview
border: 0
#divRefreshComments
text-align: right;
margin-bottom: 10px
.commenttb
padding: 8px;
margin-bottom: 10px;
color: #555;
border: 1px solid #ddd;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
width: 320px
.commentTextBox:hover, .commenttb:hover
color: #333;
border-color: rgba(82, 168, 236, .8);
transition: all .4s linear 0s
.commenttb:hover
outline: 0;
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6);
box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6)
#Profile1_panelAdd input[type=text]:hover, #Profile1_txtContent:hover, .commentTextBox:hover
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6);
outline: 0;
box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .075), 0 0 4px rgba(82, 168, 236, .6)
.commentTextBox
width: 410px !important;
margin-top: 10px;
margin-bottom: 10px
#AjaxHolder_PostComment_btnSubmit
padding: 8px 20px;
text-align: center;
font-size: 14px;
color: #fff;
border: none;
background: #5c8ec6;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
cursor: pointer;
display: inline-block;
vertical-align: middle;
outline: 0;
text-decoration: none
#AjaxHolder_PostComment_btnSubmit:hover
background: #333
#AjaxHolder_PostComment_divCommnentArea tr
margin-top: 10px;
margin-bottom: 10px
.comment_vote
padding-right: 10px
.comment_vote a
color: #999
.comment_vote a:hover
color: #5c8ec6
#commentform_title
font: normal normal 16px/35px "Microsoft YaHei";
margin: 0;
background-image: none;
padding: 0
#comment_form_container .author
padding-left: 10px;
color: #555;
border: 1px solid #ddd;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
width: 320px;
height: 20px;
background-image: none
#comment_form_container p
font-size: 14px;
margin-bottom: 20px
.commentbox_title_left
font-size: 14px
#comment_form_container .comment_textarea
font-size: 13px;
padding: 8px;
margin-bottom: 10px;
color: #555;
border: 1px solid #ddd;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
min-height: 250px;
width: 100%;
height: 100%
#comment_form_container .comment_textarea:hover
border-color: #5c8ec6;
outline: 0;
transition: all .4s linear 0s
#comment_form_container .comment_textarea:focus
outline: 0
.commentbox_tab.active, .commentbox_tab:hover
border-bottom: 0;
color: #5c8ec6
.comment_btn
border: none;
background-color: #5c8ec6
.comment_btn:hover
background: #71ace5
.PostListTitle, .entrylistTitle, .thumbTitle
height: 38px;
line-height: 38px;
font: normal normal 16px/35px "Microsoft YaHei";
margin: 10px 0 30px;
background-image: none;
padding: 0
.dev__developer, .entrylistPosttitle a:active, .entrylistPosttitle a:link, .entrylistPosttitle a:visited
font-family: "Open Sans", "Microsoft Jhenghei", "Microsoft Yahei", sans-serif
.entrylistDescription
color: #666;
text-align: right;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
margin-bottom: 10px
.entrylistItem
position: relative;
margin: 3.5rem auto;
padding-bottom: 3.3rem;
word-wrap: break-word
.entrylistItem:after
display: block;
border: 1px solid #E7EEF2;
position: absolute;
margin-left: -5px;
background: #FFF;
border-radius: 100%;
box-shadow: #FFF 0 0 0 5px
.entrylistPosttitle
font-size: 20px;
width: 100%
.entrylistPosttitle a:active, .entrylistPosttitle a:link, .entrylistPosttitle a:visited
transition: all .4s linear 0s;
background-color: rgba(0, 0, 0, 0);
color: #4a4a4a;
font-size: 3.2rem;
font-weight: 700;
letter-spacing: -1px;
transition-delay: 0s;
transition-duration: .3s;
transition-property: color;
transition-timing-function: ease;
word-wrap: break-word;
-webkit-tap-highlight-color: transparent
.entrylistPosttitle a:hover
color: #000
.entrylistItemPostDesc, .sb-title
font-family: "Open Sans", sans-serif
.entrylistItemPostDesc
float: left;
width: 100%;
clear: both;
text-align: left;
padding-right: 5px;
margin: 0;
font-size: 1.4rem;
line-height: 2.2rem;
color: #9EABB3;
display: none
.entrylistItemPostDesc a:active, .entrylistItemPostDesc a:link, .entrylistItemPostDesc a:visited
color: #666
.entrylistItemPostDesc a:hover
color: #5c8ec6
.entrylist .postSeparator
clear: both;
width: 100%;
font-size: 0;
line-height: 0;
margin: 0;
padding: 0;
height: 0;
border: none
#footer, .pager
font-size: 12px
.divPhoto, .pager
margin-right: 10px
.divRecentCommentAticle a
color: #000
.pager
text-align: right;
color: #9EABB3
#nav_next_page a, .pager a
display: inline-block;
min-width: 18px;
text-align: center;
border: 1px solid #bfc8cd;
text-decoration: none;
border-radius: 4px;
color: #9EABB3 !important;
transition: all .2s ease
#nav_next_page a:active, #nav_next_page a:link, #nav_next_page a:visited, .pager a:active, .pager a:link, .pager a:visited
color: #9EABB3 !important
.pager a
padding: 0 5px
#nav_next_page a
padding: 3px 5px
#nav_next_page a:hover, .pager a:hover
background: #fff;
color: #889093;
border-color: #98a0a4
.PostList
border-bottom: 1px dashed #e9e9e9;
clear: both;
min-height: 1.5em;
padding-top: 20px;
margin-bottom: 20px;
padding-bottom: 20px
.postTitl2
float: left;
padding-top: 10px;
padding-bottom: 10px;
font-size: 14px
.postDesc2
color: #666;
float: right
.postText2
clear: both;
color: #757575
.pfl_feedback_area_title
text-align: right;
font-weight: 700;
margin-bottom: 10px
.pfl_feedbackItem
border: 1px dashed #ccc;
padding: 10px;
border-radius: 3px;
margin-bottom: 20px
.pfl_feedbacksubtitle
width: 100%;
height: 1.5em
.pfl_feedbackname
float: left
.commentbox_title_right, .pfl_feedbackManage
float: right
.pfl_feedbackname a
color: #5c8ec6;
font-weight: 700
.pfl_feedbackCon
color: #000;
padding-top: 5px;
padding-bottom: 5px
.pfl_feedbackAnswer
color: #F40;
text-indent: 2em
.tdSentMessage
text-align: right
.errorMessage
width: 300px;
float: left
#Profile1_panelAdd input[type=text], #Profile1_txtContent
padding: 8px;
margin-bottom: 10px;
color: #555;
border: 1px solid #ddd;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px
#Profile1_panelAdd input[type=text]:hover, #Profile1_txtContent:hover
color: #333;
border-color: rgba(82, 168, 236, .8);
transition: all .4s linear 0s
#Profile1_panelAdd input[type=text]:focus, #Profile1_txtContent:focus
outline: 0;
border-color: rgba(82, 168, 236, .8)
#Profile1_panelAdd input[type=submit]
padding: 8px 20px;
text-align: center;
font-size: 14px;
color: #fff;
border: none;
background: #5c8ec6;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
cursor: pointer;
display: inline-block;
vertical-align: middle;
outline: 0;
text-decoration: none
#Profile1_panelAdd input[type=submit]:hover
background: #333
.feedbackListSubtitle
clear: both;
align-items: center;
color: #586069;
flex-direction: row-reverse;
background-color: #f6f8fa;
border: 1px solid #e9e9e9;
border-bottom: 1px solid #e9e9e9;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
padding: 10px 20px;
position: relative;
white-space: nowrap;
text-overflow: ellipsis
#footer, .main-header, .scroll-down
position: absolute
.divPhoto
border: 1px solid #ccc;
padding: 2px
.thumbDescription
color: #757575;
text-align: right;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
margin-bottom: 30px
#footer
min-height: 100px;
margin: 20vh 0 0;
left: 0;
right: 0;
padding: 15px 0;
color: #888;
line-height: 1.5
.my-face
animation: my-face 5s infinite ease-in-out;
display: inline-block;
margin: 0 5px
@-moz-keyframes my-face
2%, 24%, 80%
-webkit-transform: translate(0, 1.5px) rotate(1.5deg);
-moz-transform: translate(0, 1.5px) rotate(1.5deg);
-ms-transform: translate(0, 1.5px) rotate(1.5deg);
-o-transform: translate(0, 1.5px) rotate(1.5deg);
transform: translate(0, 1.5px) rotate(1.5deg)
4%, 68%, 98%
-webkit-transform: translate(0, -1.5px) rotate(-.5deg);
-moz-transform: translate(0, -1.5px) rotate(-.5deg);
-ms-transform: translate(0, -1.5px) rotate(-.5deg);
-o-transform: translate(0, -1.5px) rotate(-.5deg);
transform: translate(0, -1.5px) rotate(-.5deg)
38%, 6%
-webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
-moz-transform: translate(0, 1.5px) rotate(-1.5deg);
-ms-transform: translate(0, 1.5px) rotate(-1.5deg);
-o-transform: translate(0, 1.5px) rotate(-1.5deg);
transform: translate(0, 1.5px) rotate(-1.5deg)
8%, 86%
-webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
-moz-transform: translate(0, -1.5px) rotate(-1.5deg);
-ms-transform: translate(0, -1.5px) rotate(-1.5deg);
-o-transform: translate(0, -1.5px) rotate(-1.5deg);
transform: translate(0, -1.5px) rotate(-1.5deg)
10%, 72%
-webkit-transform: translate(0, 2.5px) rotate(1.5deg);
-moz-transform: translate(0, 2.5px) rotate(1.5deg);
-ms-transform: translate(0, 2.5px) rotate(1.5deg);
-o-transform: translate(0, 2.5px) rotate(1.5deg);
transform: translate(0, 2.5px) rotate(1.5deg)
12%, 64%, 78%, 96%
-webkit-transform: translate(0, -.5px) rotate(1.5deg);
-moz-transform: translate(0, -.5px) rotate(1.5deg);
-ms-transform: translate(0, -.5px) rotate(1.5deg);
-o-transform: translate(0, -.5px) rotate(1.5deg);
transform: translate(0, -.5px) rotate(1.5deg)
14%, 54%
-webkit-transform: translate(0, -1.5px) rotate(1.5deg);
-moz-transform: translate(0, -1.5px) rotate(1.5deg);
-ms-transform: translate(0, -1.5px) rotate(1.5deg);
-o-transform: translate(0, -1.5px) rotate(1.5deg);
transform: translate(0, -1.5px) rotate(1.5deg)
16%
-webkit-transform: translate(0, -.5px) rotate(-1.5deg);
-moz-transform: translate(0, -.5px) rotate(-1.5deg);
-ms-transform: translate(0, -.5px) rotate(-1.5deg);
-o-transform: translate(0, -.5px) rotate(-1.5deg);
transform: translate(0, -.5px) rotate(-1.5deg)
18%, 22%
-webkit-transform: translate(0, .5px) rotate(-1.5deg);
-moz-transform: translate(0, .5px) rotate(-1.5deg);
-ms-transform: translate(0, .5px) rotate(-1.5deg);
-o-transform: translate(0, .5px) rotate(-1.5deg);
transform: translate(0, .5px) rotate(-1.5deg)
20%, 36%, 46%
-webkit-transform: translate(0, -1.5px) rotate(2.5deg);
-moz-transform: translate(0, -1.5px) rotate(2.5deg);
-ms-transform: translate(0, -1.5px) rotate(2.5deg);
-o-transform: translate(0, -1.5px) rotate(2.5deg);
transform: translate(0, -1.5px) rotate(2.5deg)
26%, 50%
-webkit-transform: translate(0, .5px) rotate(.5deg);
-moz-transform: translate(0, .5px) rotate(.5deg);
-ms-transform: translate(0, .5px) rotate(.5deg);
-o-transform: translate(0, .5px) rotate(.5deg);
transform: translate(0, .5px) rotate(.5deg)
28%
-webkit-transform: translate(0, .5px) rotate(1.5deg);
-moz-transform: translate(0, .5px) rotate(1.5deg);
-ms-transform: translate(0, .5px) rotate(1.5deg);
-o-transform: translate(0, .5px) rotate(1.5deg);
transform: translate(0, .5px) rotate(1.5deg)
30%, 40%, 62%, 76%, 88%
-webkit-transform: translate(0, -.5px) rotate(2.5deg);
-moz-transform: translate(0, -.5px) rotate(2.5deg);
-ms-transform: translate(0, -.5px) rotate(2.5deg);
-o-transform: translate(0, -.5px) rotate(2.5deg);
transform: translate(0, -.5px) rotate(2.5deg)
32%, 34%, 66%
-webkit-transform: translate(0, 1.5px) rotate(-.5deg);
-moz-transform: translate(0, 1.5px) rotate(-.5deg);
-ms-transform: translate(0, 1.5px) rotate(-.5deg);
-o-transform: translate(0, 1.5px) rotate(-.5deg);
transform: translate(0, 1.5px) rotate(-.5deg)
42%
-webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
-moz-transform: translate(0, 2.5px) rotate(-1.5deg);
-ms-transform: translate(0, 2.5px) rotate(-1.5deg);
-o-transform: translate(0, 2.5px) rotate(-1.5deg);
transform: translate(0, 2.5px) rotate(-1.5deg)
44%, 70%
-webkit-transform: translate(0, 1.5px) rotate(.5deg);
-moz-transform: translate(0, 1.5px) rotate(.5deg);
-ms-transform: translate(0, 1.5px) rotate(.5deg);
-o-transform: translate(0, 1.5px) rotate(.5deg);
transform: translate(0, 1.5px) rotate(.5deg)
48%, 74%, 82%
-webkit-transform: translate(0, -.5px) rotate(.5deg);
-moz-transform: translate(0, -.5px) rotate(.5deg);
-ms-transform: translate(0, -.5px) rotate(.5deg);
-o-transform: translate(0, -.5px) rotate(.5deg);
transform: translate(0, -.5px) rotate(.5deg)
52%, 56%, 60%
-webkit-transform: translate(0, 2.5px) rotate(2.5deg);
-moz-transform: translate(0, 2.5px) rotate(2.5deg);
-ms-transform: translate(0, 2.5px) rotate(2.5deg);
-o-transform: translate(0, 2.5px) rotate(2.5deg);
transform: translate(0, 2.5px) rotate(2.5deg)
58%
-webkit-transform: translate(0, .5px) rotate(2.5deg);
-moz-transform: translate(0, .5px) rotate(2.5deg);
-ms-transform: translate(0, .5px) rotate(2.5deg);
-o-transform: translate(0, .5px) rotate(2.5deg);
transform: translate(0, .5px) rotate(2.5deg)
84%
-webkit-transform: translate(0, 1.5px) rotate(2.5deg);
-moz-transform: translate(0, 1.5px) rotate(2.5deg);
-ms-transform: translate(0, 1.5px) rotate(2.5deg);
-o-transform: translate(0, 1.5px) rotate(2.5deg);
transform: translate(0, 1.5px) rotate(2.5deg)
90%
-webkit-transform: translate(0, 2.5px) rotate(-.5deg);
-moz-transform: translate(0, 2.5px) rotate(-.5deg);
-ms-transform: translate(0, 2.5px) rotate(-.5deg);
-o-transform: translate(0, 2.5px) rotate(-.5deg);
transform: translate(0, 2.5px) rotate(-.5deg)
92%
-webkit-transform: translate(0, .5px) rotate(-.5deg);
-moz-transform: translate(0, .5px) rotate(-.5deg);
-ms-transform: translate(0, .5px) rotate(-.5deg);
-o-transform: translate(0, .5px) rotate(-.5deg);
transform: translate(0, .5px) rotate(-.5deg)
94%
-webkit-transform: translate(0, 2.5px) rotate(.5deg);
-moz-transform: translate(0, 2.5px) rotate(.5deg);
-ms-transform: translate(0, 2.5px) rotate(.5deg);
-o-transform: translate(0, 2.5px) rotate(.5deg);
transform: translate(0, 2.5px) rotate(.5deg)
0%, 100%
-webkit-transform: translate(0, 0) rotate(0);
-moz-transform: translate(0, 0) rotate(0);
-ms-transform: translate(0, 0) rotate(0);
-o-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0)
@-webkit-keyframes my-face
2%, 24%, 80%
-webkit-transform: translate(0, 1.5px) rotate(1.5deg);
-moz-transform: translate(0, 1.5px) rotate(1.5deg);
-ms-transform: translate(0, 1.5px) rotate(1.5deg);
-o-transform: translate(0, 1.5px) rotate(1.5deg);
transform: translate(0, 1.5px) rotate(1.5deg)
4%, 68%, 98%
-webkit-transform: translate(0, -1.5px) rotate(-.5deg);
-moz-transform: translate(0, -1.5px) rotate(-.5deg);
-ms-transform: translate(0, -1.5px) rotate(-.5deg);
-o-transform: translate(0, -1.5px) rotate(-.5deg);
transform: translate(0, -1.5px) rotate(-.5deg)
38%, 6%
-webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
-moz-transform: translate(0, 1.5px) rotate(-1.5deg);
-ms-transform: translate(0, 1.5px) rotate(-1.5deg);
-o-transform: translate(0, 1.5px) rotate(-1.5deg);
transform: translate(0, 1.5px) rotate(-1.5deg)
8%, 86%
-webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
-moz-transform: translate(0, -1.5px) rotate(-1.5deg);
-ms-transform: translate(0, -1.5px) rotate(-1.5deg);
-o-transform: translate(0, -1.5px) rotate(-1.5deg);
transform: translate(0, -1.5px) rotate(-1.5deg)
10%, 72%
-webkit-transform: translate(0, 2.5px) rotate(1.5deg);
-moz-transform: translate(0, 2.5px) rotate(1.5deg);
-ms-transform: translate(0, 2.5px) rotate(1.5deg);
-o-transform: translate(0, 2.5px) rotate(1.5deg);
transform: translate(0, 2.5px) rotate(1.5deg)
12%, 64%, 78%, 96%
-webkit-transform: translate(0, -.5px) rotate(1.5deg);
-moz-transform: translate(0, -.5px) rotate(1.5deg);
-ms-transform: translate(0, -.5px) rotate(1.5deg);
-o-transform: translate(0, -.5px) rotate(1.5deg);
transform: translate(0, -.5px) rotate(1.5deg)
14%, 54%
-webkit-transform: translate(0, -1.5px) rotate(1.5deg);
-moz-transform: translate(0, -1.5px) rotate(1.5deg);
-ms-transform: translate(0, -1.5px) rotate(1.5deg);
-o-transform: translate(0, -1.5px) rotate(1.5deg);
transform: translate(0, -1.5px) rotate(1.5deg)
16%
-webkit-transform: translate(0, -.5px) rotate(-1.5deg);
-moz-transform: translate(0, -.5px) rotate(-1.5deg);
-ms-transform: translate(0, -.5px) rotate(-1.5deg);
-o-transform: translate(0, -.5px) rotate(-1.5deg);
transform: translate(0, -.5px) rotate(-1.5deg)
18%, 22%
-webkit-transform: translate(0, .5px) rotate(-1.5deg);
-moz-transform: translate(0, .5px) rotate(-1.5deg);
-ms-transform: translate(0, .5px) rotate(-1.5deg);
-o-transform: translate(0, .5px) rotate(-1.5deg);
transform: translate(0, .5px) rotate(-1.5deg)
20%, 36%, 46%
-webkit-transform: translate(0, -1.5px) rotate(2.5deg);
-moz-transform: translate(0, -1.5px) rotate(2.5deg);
-ms-transform: translate(0, -1.5px) rotate(2.5deg);
-o-transform: translate(0, -1.5px) rotate(2.5deg);
transform: translate(0, -1.5px) rotate(2.5deg)
26%, 50%
-webkit-transform: translate(0, .5px) rotate(.5deg);
-moz-transform: translate(0, .5px) rotate(.5deg);
-ms-transform: translate(0, .5px) rotate(.5deg);
-o-transform: translate(0, .5px) rotate(.5deg);
transform: translate(0, .5px) rotate(.5deg)
28%
-webkit-transform: translate(0, .5px) rotate(1.5deg);
-moz-transform: translate(0, .5px) rotate(1.5deg);
-ms-transform: translate(0, .5px) rotate(1.5deg);
-o-transform: translate(0, .5px) rotate(1.5deg);
transform: translate(0, .5px) rotate(1.5deg)
30%, 40%, 62%, 76%, 88%
-webkit-transform: translate(0, -.5px) rotate(2.5deg);
-moz-transform: translate(0, -.5px) rotate(2.5deg);
-ms-transform: translate(0, -.5px) rotate(2.5deg);
-o-transform: translate(0, -.5px) rotate(2.5deg);
transform: translate(0, -.5px) rotate(2.5deg)
32%, 34%, 66%
-webkit-transform: translate(0, 1.5px) rotate(-.5deg);
-moz-transform: translate(0, 1.5px) rotate(-.5deg);
-ms-transform: translate(0, 1.5px) rotate(-.5deg);
-o-transform: translate(0, 1.5px) rotate(-.5deg);
transform: translate(0, 1.5px) rotate(-.5deg)
42%
-webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
-moz-transform: translate(0, 2.5px) rotate(-1.5deg);
-ms-transform: translate(0, 2.5px) rotate(-1.5deg);
-o-transform: translate(0, 2.5px) rotate(-1.5deg);
transform: translate(0, 2.5px) rotate(-1.5deg)
44%, 70%
-webkit-transform: translate(0, 1.5px) rotate(.5deg);
-moz-transform: translate(0, 1.5px) rotate(.5deg);
-ms-transform: translate(0, 1.5px) rotate(.5deg);
-o-transform: translate(0, 1.5px) rotate(.5deg);
transform: translate(0, 1.5px) rotate(.5deg)
48%, 74%, 82%
-webkit-transform: translate(0, -.5px) rotate(.5deg);
-moz-transform: translate(0, -.5px) rotate(.5deg);
-ms-transform: translate(0, -.5px) rotate(.5deg);
-o-transform: translate(0, -.5px) rotate(.5deg);
transform: translate(0, -.5px) rotate(.5deg)
52%, 56%, 60%
-webkit-transform: translate(0, 2.5px) rotate(2.5deg);
-moz-transform: translate(0, 2.5px) rotate(2.5deg);
-ms-transform: translate(0, 2.5px) rotate(2.5deg);
-o-transform: translate(0, 2.5px) rotate(2.5deg);
transform: translate(0, 2.5px) rotate(2.5deg)
58%
-webkit-transform: translate(0, .5px) rotate(2.5deg);
-moz-transform: translate(0, .5px) rotate(2.5deg);
-ms-transform: translate(0, .5px) rotate(2.5deg);
-o-transform: translate(0, .5px) rotate(2.5deg);
transform: translate(0, .5px) rotate(2.5deg)
84%
-webkit-transform: translate(0, 1.5px) rotate(2.5deg);
-moz-transform: translate(0, 1.5px) rotate(2.5deg);
-ms-transform: translate(0, 1.5px) rotate(2.5deg);
-o-transform: translate(0, 1.5px) rotate(2.5deg);
transform: translate(0, 1.5px) rotate(2.5deg)
90%
-webkit-transform: translate(0, 2.5px) rotate(-.5deg);
-moz-transform: translate(0, 2.5px) rotate(-.5deg);
-ms-transform: translate(0, 2.5px) rotate(-.5deg);
-o-transform: translate(0, 2.5px) rotate(-.5deg);
transform: translate(0, 2.5px) rotate(-.5deg)
92%
-webkit-transform: translate(0, .5px) rotate(-.5deg);
-moz-transform: translate(0, .5px) rotate(-.5deg);
-ms-transform: translate(0, .5px) rotate(-.5deg);
-o-transform: translate(0, .5px) rotate(-.5deg);
transform: translate(0, .5px) rotate(-.5deg)
94%
-webkit-transform: translate(0, 2.5px) rotate(.5deg);
-moz-transform: translate(0, 2.5px) rotate(.5deg);
-ms-transform: translate(0, 2.5px) rotate(.5deg);
-o-transform: translate(0, 2.5px) rotate(.5deg);
transform: translate(0, 2.5px) rotate(.5deg)
0%, 100%
-webkit-transform: translate(0, 0) rotate(0);
-moz-transform: translate(0, 0) rotate(0);
-ms-transform: translate(0, 0) rotate(0);
-o-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0)
@-o-keyframes my-face
2%, 24%, 80%
-webkit-transform: translate(0, 1.5px) rotate(1.5deg);
-moz-transform: translate(0, 1.5px) rotate(1.5deg);
-ms-transform: translate(0, 1.5px) rotate(1.5deg);
-o-transform: translate(0, 1.5px) rotate(1.5deg);
transform: translate(0, 1.5px) rotate(1.5deg)
4%, 68%, 98%
-webkit-transform: translate(0, -1.5px) rotate(-.5deg);
-moz-transform: translate(0, -1.5px) rotate(-.5deg);
-ms-transform: translate(0, -1.5px) rotate(-.5deg);
-o-transform: translate(0, -1.5px) rotate(-.5deg);
transform: translate(0, -1.5px) rotate(-.5deg)
38%, 6%
-webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
-moz-transform: translate(0, 1.5px) rotate(-1.5deg);
-ms-transform: translate(0, 1.5px) rotate(-1.5deg);
-o-transform: translate(0, 1.5px) rotate(-1.5deg);
transform: translate(0, 1.5px) rotate(-1.5deg)
8%, 86%
-webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
-moz-transform: translate(0, -1.5px) rotate(-1.5deg);
-ms-transform: translate(0, -1.5px) rotate(-1.5deg);
-o-transform: translate(0, -1.5px) rotate(-1.5deg);
transform: translate(0, -1.5px) rotate(-1.5deg)
10%, 72%
-webkit-transform: translate(0, 2.5px) rotate(1.5deg);
-moz-transform: translate(0, 2.5px) rotate(1.5deg);
-ms-transform: translate(0, 2.5px) rotate(1.5deg);
-o-transform: translate(0, 2.5px) rotate(1.5deg);
transform: translate(0, 2.5px) rotate(1.5deg)
12%, 64%, 78%, 96%
-webkit-transform: translate(0, -.5px) rotate(1.5deg);
-moz-transform: translate(0, -.5px) rotate(1.5deg);
-ms-transform: translate(0, -.5px) rotate(1.5deg);
-o-transform: translate(0, -.5px) rotate(1.5deg);
transform: translate(0, -.5px) rotate(1.5deg)
14%, 54%
-webkit-transform: translate(0, -1.5px) rotate(1.5deg);
-moz-transform: translate(0, -1.5px) rotate(1.5deg);
-ms-transform: translate(0, -1.5px) rotate(1.5deg);
-o-transform: translate(0, -1.5px) rotate(1.5deg);
transform: translate(0, -1.5px) rotate(1.5deg)
16%
-webkit-transform: translate(0, -.5px) rotate(-1.5deg);
-moz-transform: translate(0, -.5px) rotate(-1.5deg);
-ms-transform: translate(0, -.5px) rotate(-1.5deg);
-o-transform: translate(0, -.5px) rotate(-1.5deg);
transform: translate(0, -.5px) rotate(-1.5deg)
18%, 22%
-webkit-transform: translate(0, .5px) rotate(-1.5deg);
-moz-transform: translate(0, .5px) rotate(-1.5deg);
-ms-transform: translate(0, .5px) rotate(-1.5deg);
-o-transform: translate(0, .5px) rotate(-1.5deg);
transform: translate(0, .5px) rotate(-1.5deg)
20%, 36%, 46%
-webkit-transform: translate(0, -1.5px) rotate(2.5deg);
-moz-transform: translate(0, -1.5px) rotate(2.5deg);
-ms-transform: translate(0, -1.5px) rotate(2.5deg);
-o-transform: translate(0, -1.5px) rotate(2.5deg);
transform: translate(0, -1.5px) rotate(2.5deg)
26%, 50%
-webkit-transform: translate(0, .5px) rotate(.5deg);
-moz-transform: translate(0, .5px) rotate(.5deg);
-ms-transform: translate(0, .5px) rotate(.5deg);
-o-transform: translate(0, .5px) rotate(.5deg);
transform: translate(0, .5px) rotate(.5deg)
28%
-webkit-transform: translate(0, .5px) rotate(1.5deg);
-moz-transform: translate(0, .5px) rotate(1.5deg);
-ms-transform: translate(0, .5px) rotate(1.5deg);
-o-transform: translate(0, .5px) rotate(1.5deg);
transform: translate(0, .5px) rotate(1.5deg)
30%, 40%, 62%, 76%, 88%
-webkit-transform: translate(0, -.5px) rotate(2.5deg);
-moz-transform: translate(0, -.5px) rotate(2.5deg);
-ms-transform: translate(0, -.5px) rotate(2.5deg);
-o-transform: translate(0, -.5px) rotate(2.5deg);
transform: translate(0, -.5px) rotate(2.5deg)
32%, 34%, 66%
-webkit-transform: translate(0, 1.5px) rotate(-.5deg);
-moz-transform: translate(0, 1.5px) rotate(-.5deg);
-ms-transform: translate(0, 1.5px) rotate(-.5deg);
-o-transform: translate(0, 1.5px) rotate(-.5deg);
transform: translate(0, 1.5px) rotate(-.5deg)
42%
-webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
-moz-transform: translate(0, 2.5px) rotate(-1.5deg);
-ms-transform: translate(0, 2.5px) rotate(-1.5deg);
-o-transform: translate(0, 2.5px) rotate(-1.5deg);
transform: translate(0, 2.5px) rotate(-1.5deg)
44%, 70%
-webkit-transform: translate(0, 1.5px) rotate(.5deg);
-moz-transform: translate(0, 1.5px) rotate(.5deg);
-ms-transform: translate(0, 1.5px) rotate(.5deg);
-o-transform: translate(0, 1.5px) rotate(.5deg);
transform: translate(0, 1.5px) rotate(.5deg)
48%, 74%, 82%
-webkit-transform: translate(0, -.5px) rotate(.5deg);
-moz-transform: translate(0, -.5px) rotate(.5deg);
-ms-transform: translate(0, -.5px) rotate(.5deg);
-o-transform: translate(0, -.5px) rotate(.5deg);
transform: translate(0, -.5px) rotate(.5deg)
52%, 56%, 60%
-webkit-transform: translate(0, 2.5px) rotate(2.5deg);
-moz-transform: translate(0, 2.5px) rotate(2.5deg);
-ms-transform: translate(0, 2.5px) rotate(2.5deg);
-o-transform: translate(0, 2.5px) rotate(2.5deg);
transform: translate(0, 2.5px) rotate(2.5deg)
58%
-webkit-transform: translate(0, .5px) rotate(2.5deg);
-moz-transform: translate(0, .5px) rotate(2.5deg);
-ms-transform: translate(0, .5px) rotate(2.5deg);
-o-transform: translate(0, .5px) rotate(2.5deg);
transform: translate(0, .5px) rotate(2.5deg)
84%
-webkit-transform: translate(0, 1.5px) rotate(2.5deg);
-moz-transform: translate(0, 1.5px) rotate(2.5deg);
-ms-transform: translate(0, 1.5px) rotate(2.5deg);
-o-transform: translate(0, 1.5px) rotate(2.5deg);
transform: translate(0, 1.5px) rotate(2.5deg)
90%
-webkit-transform: translate(0, 2.5px) rotate(-.5deg);
-moz-transform: translate(0, 2.5px) rotate(-.5deg);
-ms-transform: translate(0, 2.5px) rotate(-.5deg);
-o-transform: translate(0, 2.5px) rotate(-.5deg);
transform: translate(0, 2.5px) rotate(-.5deg)
92%
-webkit-transform: translate(0, .5px) rotate(-.5deg);
-moz-transform: translate(0, .5px) rotate(-.5deg);
-ms-transform: translate(0, .5px) rotate(-.5deg);
-o-transform: translate(0, .5px) rotate(-.5deg);
transform: translate(0, .5px) rotate(-.5deg)
94%
-webkit-transform: translate(0, 2.5px) rotate(.5deg);
-moz-transform: translate(0, 2.5px) rotate(.5deg);
-ms-transform: translate(0, 2.5px) rotate(.5deg);
-o-transform: translate(0, 2.5px) rotate(.5deg);
transform: translate(0, 2.5px) rotate(.5deg)
0%, 100%
-webkit-transform: translate(0, 0) rotate(0);
-moz-transform: translate(0, 0) rotate(0);
-ms-transform: translate(0, 0) rotate(0);
-o-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0)
@keyframes my-face
2%, 24%, 80%
-webkit-transform: translate(0, 1.5px) rotate(1.5deg);
-moz-transform: translate(0, 1.5px) rotate(1.5deg);
-ms-transform: translate(0, 1.5px) rotate(1.5deg);
-o-transform: translate(0, 1.5px) rotate(1.5deg);
transform: translate(0, 1.5px) rotate(1.5deg)
4%, 68%, 98%
-webkit-transform: translate(0, -1.5px) rotate(-.5deg);
-moz-transform: translate(0, -1.5px) rotate(-.5deg);
-ms-transform: translate(0, -1.5px) rotate(-.5deg);
-o-transform: translate(0, -1.5px) rotate(-.5deg);
transform: translate(0, -1.5px) rotate(-.5deg)
38%, 6%
-webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
-moz-transform: translate(0, 1.5px) rotate(-1.5deg);
-ms-transform: translate(0, 1.5px) rotate(-1.5deg);
-o-transform: translate(0, 1.5px) rotate(-1.5deg);
transform: translate(0, 1.5px) rotate(-1.5deg)
8%, 86%
-webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
-moz-transform: translate(0, -1.5px) rotate(-1.5deg);
-ms-transform: translate(0, -1.5px) rotate(-1.5deg);
-o-transform: translate(0, -1.5px) rotate(-1.5deg);
transform: translate(0, -1.5px) rotate(-1.5deg)
10%, 72%
-webkit-transform: translate(0, 2.5px) rotate(1.5deg);
-moz-transform: translate(0, 2.5px) rotate(1.5deg);
-ms-transform: translate(0, 2.5px) rotate(1.5deg);
-o-transform: translate(0, 2.5px) rotate(1.5deg);
transform: translate(0, 2.5px) rotate(1.5deg)
12%, 64%, 78%, 96%
-webkit-transform: translate(0, -.5px) rotate(1.5deg);
-moz-transform: translate(0, -.5px) rotate(1.5deg);
-ms-transform: translate(0, -.5px) rotate(1.5deg);
-o-transform: translate(0, -.5px) rotate(1.5deg);
transform: translate(0, -.5px) rotate(1.5deg)
14%, 54%
-webkit-transform: translate(0, -1.5px) rotate(1.5deg);
-moz-transform: translate(0, -1.5px) rotate(1.5deg);
-ms-transform: translate(0, -1.5px) rotate(1.5deg);
-o-transform: translate(0, -1.5px) rotate(1.5deg);
transform: translate(0, -1.5px) rotate(1.5deg)
16%
-webkit-transform: translate(0, -.5px) rotate(-1.5deg);
-moz-transform: translate(0, -.5px) rotate(-1.5deg);
-ms-transform: translate(0, -.5px) rotate(-1.5deg);
-o-transform: translate(0, -.5px) rotate(-1.5deg);
transform: translate(0, -.5px) rotate(-1.5deg)
18%, 22%
-webkit-transform: translate(0, .5px) rotate(-1.5deg);
-moz-transform: translate(0, .5px) rotate(-1.5deg);
-ms-transform: translate(0, .5px) rotate(-1.5deg);
-o-transform: translate(0, .5px) rotate(-1.5deg);
transform: translate(0, .5px) rotate(-1.5deg)
20%, 36%, 46%
-webkit-transform: translate(0, -1.5px) rotate(2.5deg);
-moz-transform: translate(0, -1.5px) rotate(2.5deg);
-ms-transform: translate(0, -1.5px) rotate(2.5deg);
-o-transform: translate(0, -1.5px) rotate(2.5deg);
transform: translate(0, -1.5px) rotate(2.5deg)
26%, 50%
-webkit-transform: translate(0, .5px) rotate(.5deg);
-moz-transform: translate(0, .5px) rotate(.5deg);
-ms-transform: translate(0, .5px) rotate(.5deg);
-o-transform: translate(0, .5px) rotate(.5deg);
transform: translate(0, .5px) rotate(.5deg)
28%
-webkit-transform: translate(0, .5px) rotate(1.5deg);
-moz-transform: translate(0, .5px) rotate(1.5deg);
-ms-transform: translate(0, .5px) rotate(1.5deg);
-o-transform: translate(0, .5px) rotate(1.5deg);
transform: translate(0, .5px) rotate(1.5deg)
30%, 40%, 62%, 76%, 88%
-webkit-transform: translate(0, -.5px) rotate(2.5deg);
-moz-transform: translate(0, -.5px) rotate(2.5deg);
-ms-transform: translate(0, -.5px) rotate(2.5deg);
-o-transform: translate(0, -.5px) rotate(2.5deg);
transform: translate(0, -.5px) rotate(2.5deg)
32%, 34%, 66%
-webkit-transform: translate(0, 1.5px) rotate(-.5deg);
-moz-transform: translate(0, 1.5px) rotate(-.5deg);
-ms-transform: translate(0, 1.5px) rotate(-.5deg);
-o-transform: translate(0, 1.5px) rotate(-.5deg);
transform: translate(0, 1.5px) rotate(-.5deg)
42%
-webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
-moz-transform: translate(0, 2.5px) rotate(-1.5deg);
-ms-transform: translate(0, 2.5px) rotate(-1.5deg);
-o-transform: translate(0, 2.5px) rotate(-1.5deg);
transform: translate(0, 2.5px) rotate(-1.5deg)
44%, 70%
-webkit-transform: translate(0, 1.5px) rotate(.5deg);
-moz-transform: translate(0, 1.5px) rotate(.5deg);
-ms-transform: translate(0, 1.5px) rotate(.5deg);
-o-transform: translate(0, 1.5px) rotate(.5deg);
transform: translate(0, 1.5px) rotate(.5deg)
48%, 74%, 82%
-webkit-transform: translate(0, -.5px) rotate(.5deg);
-moz-transform: translate(0, -.5px) rotate(.5deg);
-ms-transform: translate(0, -.5px) rotate(.5deg);
-o-transform: translate(0, -.5px) rotate(.5deg);
transform: translate(0, -.5px) rotate(.5deg)
52%, 56%, 60%
-webkit-transform: translate(0, 2.5px) rotate(2.5deg);
-moz-transform: translate(0, 2.5px) rotate(2.5deg);
-ms-transform: translate(0, 2.5px) rotate(2.5deg);
-o-transform: translate(0, 2.5px) rotate(2.5deg);
transform: translate(0, 2.5px) rotate(2.5deg)
58%
-webkit-transform: translate(0, .5px) rotate(2.5deg);
-moz-transform: translate(0, .5px) rotate(2.5deg);
-ms-transform: translate(0, .5px) rotate(2.5deg);
-o-transform: translate(0, .5px) rotate(2.5deg);
transform: translate(0, .5px) rotate(2.5deg)
84%
-webkit-transform: translate(0, 1.5px) rotate(2.5deg);
-moz-transform: translate(0, 1.5px) rotate(2.5deg);
-ms-transform: translate(0, 1.5px) rotate(2.5deg);
-o-transform: translate(0, 1.5px) rotate(2.5deg);
transform: translate(0, 1.5px) rotate(2.5deg)
90%
-webkit-transform: translate(0, 2.5px) rotate(-.5deg);
-moz-transform: translate(0, 2.5px) rotate(-.5deg);
-ms-transform: translate(0, 2.5px) rotate(-.5deg);
-o-transform: translate(0, 2.5px) rotate(-.5deg);
transform: translate(0, 2.5px) rotate(-.5deg)
92%
-webkit-transform: translate(0, .5px) rotate(-.5deg);
-moz-transform: translate(0, .5px) rotate(-.5deg);
-ms-transform: translate(0, .5px) rotate(-.5deg);
-o-transform: translate(0, .5px) rotate(-.5deg);
transform: translate(0, .5px) rotate(-.5deg)
94%
-webkit-transform: translate(0, 2.5px) rotate(.5deg);
-moz-transform: translate(0, 2.5px) rotate(.5deg);
-ms-transform: translate(0, 2.5px) rotate(.5deg);
-o-transform: translate(0, 2.5px) rotate(.5deg);
transform: translate(0, 2.5px) rotate(.5deg)
0%, 100%
-webkit-transform: translate(0, 0) rotate(0);
-moz-transform: translate(0, 0) rotate(0);
-ms-transform: translate(0, 0) rotate(0);
-o-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0)
.personInfo
margin-bottom: 20px
.pages
text-align: right
.postBody
color: #23263b;
font-size: 1.55rem;
line-height: 1.6
.postBody p, .postCon p
margin: 0 auto 1em
.postCon a:active, .postCon a:link, .postCon a:visited
color: #9EABB3
.postCon a:hover
color: #98a0a4
.postBody ul, .postCon ul
margin-left: 2em
.myposts_title
font-weight: 700;
text-align: center
#sideBar
font-size: 12px
#sideBar h3
font-size: 14px
#cnblogs_post_body img
max-width: 700px;
margin: 10px 0
.main-header
display: flex;
width: 100%;
height: 100vh;
max-height: 100vh;
text-align: center;
overflow: hidden;
top: 0;
left: 0;
z-index: 3;
box-shadow: 0 1px 2px rgba(150, 150, 150, .7);
background: #333
.main-header .part
flex: 1
.main-header .part .section
width: 100%;
height: 100%;
position: relative;
overflow: hidden
.main-header .part .section img
width: 100vw;
height: 100%;
object-fit: cover;
position: absolute;
left: var(--x);
pointer-events: none
#homeTopCanvas
z-index: -1
.inner
position: relative;
width: 80%;
max-width: 800px;
padding: 10px
.page-title, .sb-title
letter-spacing: -1px;
font-weight: 700;
color: #fff
.sb-title
-webkit-animation: fade-in-down 1s;
animation: fade-in-down 1s both
.page-title
animation: fade-in-down 1s both;
-webkit-animation: fade-in-down 1s both;
mix-blend-mode: screen;
font-size: 5rem;
font-family: Playball, cursive
.page-title span:hover
animation: pageTitleText 2s infinite;
-webkit-animation: pageTitleText 1s infinite
@keyframes pageTitleText
0%
text-shadow: 2px 0 0 tomato
10%
text-shadow: -2px -2px 0 gold
100%, 20%
text-shadow: 2px 0 0 #0f0
30%, 70%
text-shadow: 2px 0 0 #40e0d0
40%
text-shadow: 2px 2px 0 tomato
50%
text-shadow: 0 -2px 0 gold
60%
text-shadow: 0 2px 0 #0f0
80%
text-shadow: 2px -4px 0 tomato
90%
text-shadow: 2px 2px 0 gold
#footer .footer-text, .page-description
font-family: \'Long Cang\', cursive
.sb-title
font-size: 3.55rem
.vertical
display: flex;
width: 100%;
height: 100%;
position: absolute;
z-index: 2;
align-items: center
.page-author, .page-description
margin: 0;
letter-spacing: .01rem;
color: rgba(255, 255, 255, .8);
text-shadow: 0 3px 6px rgba(0, 0, 0, .5);
display: none;
font-weight: 400
.page-description
font-size: 2.2rem;
-webkit-animation: fade-in-down .9s;
animation: fade-in-down .9s both;
-webkit-animation-delay: .1s;
animation-delay: .3s;
-webkit-box-orient: vertical;
-webkit-line-clamp: 10;
overflow: hidden
.page-author
font-size: 1.5rem !important;
line-height: 1.3em;
font-family: \'Ubuntu Mono\', monospace;
-webkit-animation: fade-in-down .9s;
animation: fade-in-down .9s both;
-webkit-animation-delay: .1s;
animation-delay: .3s
.scroll-down
display: block;
z-index: 100;
bottom: 45px;
left: 50%;
margin-left: -16px;
width: 34px;
height: 34px;
font-size: 34px;
text-align: center;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-animation: bounce 4s 2s infinite;
animation: bounce 4s 2s infinite;
text-decoration: none !important
.hidden, .m-list-title, .post-del-title
display: none
.scroll-down-icon
color: rgba(255, 255, 255, .6);
font-size: 34px !important;
position: relative;
bottom: 7px
.scroll-down:hover
color: #fff;
-webkit-animation: none;
animation: none
.hidden
text-indent: -9999px
@-webkit-keyframes bounce
0%, 10%, 25%, 40%, 50%
-webkit-transform: translateY(0) rotate(-90deg);
transform: translateY(0) rotate(-90deg)
20%
-webkit-transform: translateY(-10px) rotate(-90deg);
transform: translateY(-10px) rotate(-90deg)
30%
-webkit-transform: translateY(-5px) rotate(-90deg);
transform: translateY(-5px) rotate(-90deg)
@keyframes bounce
0%, 10%, 25%, 40%, 50%
-webkit-transform: translateY(0) rotate(-90deg);
transform: translateY(0) rotate(-90deg)
20%
-webkit-transform: translateY(-10px) rotate(-90deg);
transform: translateY(-10px) rotate(-90deg)
30%
-webkit-transform: translateY(-5px) rotate(-90deg);
transform: translateY(-5px) rotate(-90deg)
@-webkit-keyframes fade-in-down
0%
opacity: 0;
-webkit-transform: translateY(-10px);
transform: translateY(-10px)
100%
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0)
@keyframes fade-in-down
0%
opacity: 0;
-webkit-transform: translateY(-10px);
transform: translateY(-10px)
100%
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0)
.menu-button-scroll
left: -17px !important;
width: 35px !important;
color: #777aaf !important;
border: 0 !important;
background-image: linear-gradient(180deg, #fff, #f5f5fa) !important;
-webkit-box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 20%);
box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 20%)
.menu-button-scroll:before
background: linear-gradient(#777aaf 20%, transparent 0, transparent 40%, #777aaf 0, #777aaf 60%, transparent 0, transparent 80%, #777aaf 0) !important
.m-list-title
position: relative;
border-bottom: #3B3B3B 1px solid;
word-wrap: break-word;
margin: 24px 0;
font-family: Merriweather, "Open Sans", "Microsoft Jhenghei", "Microsoft Yahei", sans-serif
#author_profile, #div_digg
margin-top: 5px
.m-list-title-select
color: #888;
font-size: 22px !important;
position: absolute;
right: -7px;
top: 1px
#introduce div, #rightMenu
right: 10px;
text-align: center
.m-list-title-select:hover
color: #B8B8B8;
cursor: pointer
.m-list-title>span
display: block;
width: 74px;
text-align: center;
position: absolute;
bottom: -9px;
left: 35%;
margin-left: -5px;
background: #000;
box-shadow: #000 0 0 0 6px;
color: #B8B8B8;
line-height: 20px
#cnblogs_post_body h6, blockquote
border-left: 3px solid rgba(84, 104, 255, .8) !important;
border-right: none !important;
border-top: none !important;
border-bottom: none !important;
padding: 15px !important;
background-color: #f7f7f7 !important;
background-image: linear-gradient(180deg, #fff, #f5f5fa) !important;
--text-opacity: 1 !important;
color: #484c7a !important;
box-shadow: 0 4px 11px 0 rgb(37 44 97 / 9%), 0 1px 3px 0 rgb(93 100 148 / 6%) !important;
margin: 10px 5px 10px 0 !important;
font-size: 14px;
font-weight: 400
blockquote p
margin: 0 !important;
padding: 0;
text-indent: 0 !important
.titleIcon
position: relative;
font-size: 34px !important;
color: #5d69a5;
line-height: 50px
#cnblogs_post_body ul
margin-left: 20px;
margin-top: 5px;
padding-left: 0
.postBody li, .postCon li
list-style-type: disc;
margin-bottom: .5em
#commentform_title, .entrylistTitle, .feedback_area_title
border-bottom: none
#commentform_title:after, .entrylistTitle:after, .feedback_area_title:after
content: \'\';
display: block;
width: 100%;
text-align: center;
position: relative;
bottom: 16px;
border-bottom: 1px dashed #e9e9e9
.entrylistTitle:after
left: 200px
#commentform_title:after, .feedback_area_title:after
left: 80px
#tbCommentBody
width: 100% !important
#rightMenu
position: fixed;
bottom: 10px;
min-width: 24px;
z-index: 2;
width: 40px
div#rightMenu .rightMenuItem
width: 28px;
height: 28px;
padding: 4px;
font-size: 15px;
cursor: pointer;
text-align: center;
line-height: 28px;
margin-bottom: 4px;
border-radius: 50%;
position: relative;
display: block;
-webkit-box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 20%);
box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 20%)
#div_digg
float: right;
margin-bottom: 10px;
margin-right: 20px;
font-size: 12px;
width: 140px;
text-align: center
#div_digg .buryit, #div_digg .diggit
text-align: center;
cursor: pointer;
padding-top: 0;
width: 58px;
height: 58px;
border-radius: 6px;
margin: 0
#div_digg .diggit
float: left;
border: 1px solid #a7f3d0;
background: #ecfdf5;
color: #10b981
#div_digg .buryit
float: right;
border: 1px solid #e5e7eb;
background: #f6f8fa;
color: #6b7280
以上是关于博客园主题美化：Cnblogs-Theme-SimpleMemory的主要内容，如果未能解决你的问题，请参考以下文章