@font-face { font-family: 'yekan'; src: url('//cdn.bayan.ir/blog/templates/shared/fonts/BYekan.woff?download') format('woff'); font-weight: normal; font-style: normal; } /*--main--*/ main { width: 1024px; margin: auto; } body a{ text-decoration: none; } body { background: #faf5fa; } /*--header--*/ header { height: 211px; background-image: url(//bayanbox.ir/view/1977313772843354278/header-2.jpg); background-repeat: no-repeat; background-size: cover; font-family: yekan; } header .blog-title { padding: 60px 20px; } header a{ color: #fff; } header h1{ margin: 0; padding: 0; } header h2 { margin: 0; padding: 0; color: #fff; font-size: 14px; } header h1,h2 { font-family: yekan; font-weight: normal; } /*--menu--*/ nav { background: #fff; border-bottom: 1px solid #ede1ed; font-family: yekan; padding: 7px; border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; margin-bottom: 10px; } #menu ul { list-style: none; margin: 0; padding: 0; } #menu li { margin: 0; padding: 0; display: inline-block; } #menu a { padding: 0px 8px; border: 2px solid #b669b3; border-radius: 5px; color: #000; margin: 0px 3px; } #menu a:hover { transition-duration: .2s; background: #b669b3; color: #fff; } #menu a.selected { background: #b669b3; color: #fff; } /*--article--*/ #block-post { width: 760px; float: right; } article { margin-bottom: 10px; background: #fff; border: 1px solid #ede1ed; border-radius: 2px; } .post-title { padding: 0px 10px; background: #b669b3; border-top-right-radius: 2px; border-top-left-radius: 2px; } .post-title a{ color: #fff; } .post-title h2{ margin: 0; padding: 0; font-size: 14px; font-weight: normal; } .post-matn { padding: 2px 10px; line-height: 1.7; } .post-matn a{ color: #b669b3; } article img { max-width: 100%; height: inherit; } /*--post-detail--*/ .post-detail { padding: 4px 0px; background: #f7f2f7; color: #787878; cursor: default; } .post-detail a { color: #787878; cursor: default; } .post-detail ul{ list-style: none; padding: 0; margin: 0; } .post-detail li{ border-left: 1px solid #e8e8e8; display: inline-block; padding: 0px 10px; } .post-detail li:last-child { border-left: 0px; } .post-detail-bottom { background-color: #f7f2f7; height: 30px; padding: 5px; line-height: 30px; font-family: yekan; border-bottom-right-radius: 2px; border-bottom-left-radius: 2px; } .post-detail-bottom ul{ list-style: none; padding: 0; margin: 0; } .post-detail-bottom li{ margin: 0; padding: 0; display: inline-block; color: #fff; } .post-detail-left { float: left; } .post-detail-bottom a{ padding: 0px 8px; border: 2px solid #b669b3; border-radius: 5px; color: #000; margin: 0px 3px; } .post-detail-bottom a:hover { background: #b669b3; color: #fff; transition-duration: .2s; } .rate-box img { width: 20px; height: 20px; } /*--post-tags--*/ .post-tags { background: #fff; border: 1px solid #ede1ed; padding: 5px; margin-bottom: 10px; border-radius: 2px; } .post-tags-title { padding-bottom: 5px; border-bottom:1px solid #ededed; } .tag-back { padding-top: 5px; } /*----comment-----*/ .comment-count-box { text-align: center; margin-top: 10px; padding: 8px 0px; background: #fff; border: 1px solid #ede1ed; border-radius: 2px; font-family: yekan; } .comment-count-box a{ color: #454545; font-size: 20px; } .cm-body { background: #fff; border: 1px solid #e1e8ed; border-radius: 2px; margin-right: 56px; padding-bottom: 1px; } .cm-main { margin-top: 10px; } .cm-avatar { float: right; } .cm-av { width: 50px; border: 1px solid #e5e5e5; border-radius: 100%; } .comment-details { padding: 7px; background: #b669b3; color: #fff; overflow: hidden; border-top-right-radius: 2px; border-top-left-radius: 2px; } .cm-name { margin-right: 5px; float: right; } .comment-link { width: 15px; height: 15px; } .cm-name a{ color: #707070; } .cm-name a:hover{ color: #000; } .comment-matn { padding: 10px; line-height: 1.7; overflow: hidden; } .cm-date { float: left; } .cm-date a{ color: #808080; } .web_comment { float: left; display: inline-block; width: 19px; height: inherit; margin-left: 5px; } .cm-reply-main { overflow: hidden; padding: 0px 10px 10px 10px; } .comment-reply { margin-right: 40px; margin-left: auto; padding: 8px; background: #f5f5f5; line-height: 1.7em; color: #000; border-radius: 2px; } .comment-reply-page { padding: 8px; background: #f5f5f5; line-height: 1.7em; color: #000; border-radius: 2px; } .comment-reply p{ } .reply-av { width: 35px; border: 1px solid #e5e5e5; float: right; border-radius: 100%; } .comment-add-form { margin-top: 15px; margin-bottom: 15px; padding: 10px; border-radius: 2px; background: #fff; border: 1px solid #ede1ed; } .bComForm .sendbutton.hasCheckbox { background: #b669b3; border: 0px; cursor: pointer; margin-top: 0; width: 100px; color: #fff; } .bComForm .sendbutton.hasCheckbox:hover { background: #8db48f; transition-duration: .3s; } /*--pageination--*/ .pagingation { padding: 8px; background: #fff; border: 1px solid #e1e8ed; text-align: center; border-radius: 2px; } .pagesList { display: inline-block; } .pagingation a{ padding: 2px 10px; border: 2px solid #b669b3; border-radius: 5px; color: #000; } .pagingation a:hover { transition-duration: .3; background: #b669b3; color: #fff; } /*--block-left--*/ #block-left { float: left; width: 250px; } .archive a.selected { color: #89CC97; } .title-left { background: #b669b3; color: #fff; padding: 2px 8px; font-family: yekan; cursor: default; border-top-right-radius: 2px; border-top-left-radius: 2px; } .left-back { margin-bottom: 10px; background: #fff; border: 1px solid #ede1ed; border-radius: 2px; } #block-left ul { list-style: none; margin: 0; padding: 4px; } #block-left li{ padding: 0px 6px; margin: 2px 0px; border: 1px solid #e0e0e0; border-radius: 2px; } #block-left li:hover { background: #b669b3; color: #fff; transition-duration: .3s; } #block-left li:last-child{ border-bottom: 0px; } .left-input { padding: 6px 6px; } /*--follow-box--*/ .followBx { margin: 10px 8px 0px 8px; border-radius: 0px; } .followShow a, #followInBx a { font-family: yekan; } .followThis { padding: 1px 6px; font-size: 14px; font-weight: normal; } .followBx { margin: 5px 8px 5px 8px; border-radius: 0px; } .followThis.followed { background: #b669b3; border-radius: 0px; padding: 1px 6px; font-size: 14px; font-weight: normal; } .followThis { background: #b669b3; border-radius: 0px; } #followInBx #followersLs .followImg { border-radius: 0px; } /*stat*/ .stat-back { padding: 5px 4px; margin-bottom: 2px; border-radius: 4px; cursor: default; } .stat-value { float: left; display: inline-block; } /*about-me*/ .about-me { text-align: center; padding-bottom: 5px; padding-top: 10px; } .blog-image { width: 220px; height: inherit; margin: 5px 0px; } .description-web { line-height: 1.6em; padding: 5px 14px 5px 14px; text-align: right; } /*recent-comment*/ .recent-comment { padding: 2px 0px; clear: both; line-height: 1.7; } .left-input a{ color: #000; } .recent-comment img { width: 35px; border-radius: 100%; float: right; margin-top: 3px; } .recent-cm-detail { margin-right: 40px; overflow: hidden; } .recent-cm-name { color: #b669b3; } #block-left li:hover .recent-cm-name{ color: #fff; } .recent-cm-a{ color: #616161; } /*مطالب محبوب*/ .rate--post { color: #000; padding: 2px; margin-bottom: 2px; line-height: 1.8em; } .rate--post:hover{ color: #fff; } a.selected .rate--post { color: #b669b3; } .category-children { margin-right: 10px; } /*--tags--*/ .tagss { display: inline-block; } .tagss a{ padding: 5px 8px; border: 2px solid #b669b3; border-radius: 5px; display: table-cell; color: #000; transition-duration: .3s; } .tagss a:hover{ background: #b669b3; color: #fff; } .tagss a.selected{ background: #b669b3; color: #fff; } /*----fot----*/ footer { background: #fff; margin: 10px 0px; border-radius: 2px; padding: 8px; clear: both; bottom: 0; left: 0; top: auto; direction: ltr; border: 1px solid #ebebeb; } footer .erfan{ transition-duration: .5s; color: #b669b3; text-decoration: none; } footer .erfan:hover{ color: #cb90c8; } .bayan { float: right; color: #000; } .bayan a { color: #b669b3; } .bayan a:hover{ color: #c889c5; } @media only screen and (max-width: 1024px) { main { width: 900px; } #block-post { width: 650px; } #block-left { width: 240px; } } @media only screen and (max-width: 900px) { main { width: 800px; } #block-post { width: 550px; } #block-left { width: 240px; } } @media only screen and (max-width: 768px) { body { font-size: 90%; } main { width: 100%; } header { text-align: center; } #menu { text-align: center; } #menu li { display: block; } #menu a{ display: block; margin: 2px 0px; } #block-post { width: 95%; margin-right: 2.5%; margin-left: 2.5%; } #block-left { width: 95%; margin-right: 2.5%; margin-left: 2.5%; } }