این قالب مال وب قبلیم بودش ک جمعش کردم
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"><html><head> <head:meta></head:meta> <!-- Layout - v1.1 erfanwd.blog.ir template no. 42 erfanwd.blog.ir قالب شماره 42 عرفان --> <link href="https://cdn.rawgit.com/rastikerdar/vazir-font/v23.0.0/dist/font-face.css" rel="stylesheet" type="text/css"> <meta content="width=device-width, initial-scale=1, maximum-scale=2" name="viewport"> <head:script></head:script> <head:style></head:style> </head> <body> <a href="http://sadra-daily.blog.ir" class="Offline animated rotateInUpRight anidel_2">ONLINE</a> <div id="wrp"> <div class="menu"> <box:menu> <ul> <view:menu> <li><a href="(*menu_item_link*)" class="(*menu_item_selected*)">(*menu_item_title*)</a></li> </view:menu> </ul> </box:menu> </div> <div id="block-left"> <div class="block-post"> <div class="header"> <h1><a href="(*blog_link*)"> </a></h1> <p>(*blog_short_description*)</p> </div> <box:post_detail> <div class="post"> <div class="post-title-back"> <div class="post-title"> <h2><a href="(*post_link*)">(*post_title*)</a></h2> </div> </div> <check:if post_image> <div class="post-image"> <img src="(*post_image*)"> </div> </check:if> <div class="post-detail-top"> <ul> <check:if post_author> <li><span class="post-author"><i class="fa fa-user fa-lg"></i> (*post_author*)</span></li> </check:if> <check:if post_date> <li> <span class="post_date"> <i class="fa fa-calendar-o fa-lg"></i> (*post_date format="%A %e %B %y"*) </span> </li> <li> <i class="fa fa-clock-o fa-lg"></i> (*post_date format="%H:%M"*) </li> </check:if> </ul> </div> <div class="post-matn"> (*post_full_content*) </div> <div class="post-detail"> <div class="post-detail-right"> <ul> <box:post_categories> <view:post_categories> <li> <a href="(*category_link*)"><i class="fa fa-bars fa-lg"></i> (*category_name*)</a> </li> </view:post_categories> </box:post_categories> <li> <i class="fa fa-eye fa-lg"></i> (*post_visits*) </li> </ul> </div> <div class="post-detail-left"> <ul> <li> <box:post_rating> <span class="rate-box (*user_rated*)"> <span class="rate-button-box rate-up (*user_rated_up*)"> <a class="rate-button" href="(*rate_up_link*)" rel="nofollow" title="like">(*up_rates*) <i class="fa fa-heart-o fa-lg"></i></a> </span> </span> </box:post_rating> </li> <check:if post_has_comments_section> <li> <a href="(*post_link*)#comments">(*post_comment_count*) <i class="fa fa-comments-o fa-lg"></i></a> </li> </check:if> </ul> </div> </div> </div> <box:post_tags> <div class="post-tags"> <div class="tag-back"> <div class="post-tags-title"> کلمات کلیدی : </div> <view:post_tags> <span class="tagss"> <a href="(*tag_link*)" class="(*tag_selected*)">(*tag_name*)</a> </span> </view:post_tags> </div> </div> </box:post_tags> <box:post_comments> <a name="comments"></a> <div class="comment-count-box"> <a class="comment_count" href="(*post_link*)#comments">نظرات ((*post_comment_count*))</a> </div> <view:post_comments> <a name="comment-(*comment_id*)"></a> <div class="cm-main"> <div class="cm-avatar"> <img class="cm-av" src="(*comment_avatar*)"> </div> <div class="cm-body"> <div class="comment-details"> <span class="cm-name">(*comment_fullname*) <check:if comment_website> <a href="(*comment_website*)" target="_blank"> <i class="fa fa-external-link fa-lg"></i> </a> </check:if> </span> </div> <div class="post-detail-top"> <ul> <li> <a href="(*comment_link*)">(*comment_date format="%A %e %B %y"*)</a> </li> <li> (*comment_date format="%H:%M"*) </li> </ul> </div> <div class="comment-matn">(*comment_body*)</div> <check:if comment_reply> <div class="cm-reply-main"> <img class="reply-av" src="(*post_author_avatar*)"> <div class="comment-reply"> (*comment_reply*) </div> </div> </check:if> </div> </div> </view:post_comments> <check:if comment_add_form> <a name="send_comment"></a> <div class="comment-add-form">(*comment_add_form*)</div> </check:if> </box:post_comments> </box:post_detail> <box:page_detail> <div class="post"> <div class="post-title-back"> <div class="post-title"> <h2><a href="(*page_link*)">(*page_title*)</a></h2> </div> </div> <div class="post-matn"> (*page_content*) </div> </div> <box:page_comments> <a name="comments"></a> <div class="comment-count-box"> <a class="comment_count" href="(*page_link*)#comments">نظرات ((*page_comment_count*))</a> </div> <view:page_comments> <a name="comment-(*comment_id*)"></a> <div class="cm-main"> <div class="cm-avatar"> <img class="cm-av" src="(*comment_avatar*)"> </div> <div class="cm-body"> <div class="comment-details"> <span class="cm-name">(*comment_fullname*) <check:if comment_website> <a href="(*comment_website*)" target="_blank"> <i class="fa fa-external-link fa-lg"></i> </a> </check:if> </span> </div> <div class="post-detail-top"> <ul> <li> <a href="(*comment_link*)">(*comment_date format="%A %e %B %y"*)</a> </li> <li> (*comment_date format="%H:%M"*) </li> </ul> </div> <div class="comment-matn">(*comment_body*)</div> <check:if comment_reply> <div class="cm-reply-main"> <div class="comment-reply-page"> (*comment_reply*) </div> </div> </check:if> </div> </div> </view:page_comments> </box:page_comments> <check:if comment_add_form> <a name="send_comment"></a> <div class="comment-add-form">(*comment_add_form*)</div> </check:if> </box:page_detail> <box:post_list> <div class="block-post-list"> <view:post_list> <div class="post"> <div class="post-title-back"> <div class="post-title"> <h2><a href="(*post_link*)">(*post_title*)</a></h2> </div> </div> <check:if post_image> <div class="post-image"> <img src="(*post_image*)"> </div> </check:if> <div class="post-detail-top"> <ul> <check:if post_author> <li><span class="post-author"><i class="fa fa-user fa-lg"></i> (*post_author*)</span></li> </check:if> <check:if post_date> <li> <span class="post_date"> <i class="fa fa-calendar-o fa-lg"></i> (*post_date format="%A %e %B %y"*) </span> </li> <li> <i class="fa fa-clock-o fa-lg"></i> (*post_date format="%H:%M"*) </li> </check:if> </ul> </div> <div class="post-matn"> (*post_summary*) </div> <check:if post_has_read_more> <div class="read-more"><a href="(*post_link*)">ادامه مطلب</a></div> </check:if> <div class="post-detail"> <div class="post-detail-right"> <ul> <box:post_categories> <view:post_categories> <li> <a href="(*category_link*)"><i class="fa fa-bars fa-lg"></i> (*category_name*)</a> </li> </view:post_categories> </box:post_categories> <li> <i class="fa fa-eye fa-lg"></i> (*post_visits*) </li> </ul> </div> <div class="post-detail-left"> <ul> <li> <box:post_rating> <span class="rate-box (*user_rated*)"> <span class="rate-button-box rate-up (*user_rated_up*)"> <a class="rate-button" href="(*rate_up_link*)" rel="nofollow" title="like">(*up_rates*) <i class="fa fa-heart-o fa-lg"></i></a> </span> </span> </box:post_rating> </li> <check:if post_has_comments_section> <li> <a href="(*post_link*)#comments">(*post_comment_count*) <i class="fa fa-comments-o fa-lg"></i></a> </li> </check:if> </ul> </div> </div> </div> </view:post_list> </div> </box:post_list> <box:pagination> <div class="pagingation"> <check:if page_first> <a href="(*page_first*)" class="pagefirst"><i class="fa fa-angle-double-right fa-lg"></i></a> </check:if> <check:if page_prev> <a href="(*page_prev*)" class="pagePrev"><i class="fa fa-angle-right fa-lg"></i></a> </check:if> <div class="pagesList"> <view:pages spec="3,2,2,2,3,2"> <check:if page_num> <a href="(*page_link*)" class="(*page_current*)">(*page_num*)</a> </check:if> <check:if not page_num> <span class="spacer">. . .</span> </check:if> </view:pages> </div> <check:if page_next> <a href="(*page_next*)" class="pageNext"><i class="fa fa-angle-left fa-lg"></i></a> </check:if> <check:if page_last> <a href="(*page_last*)" class="pagelast"><i class="fa fa-angle-double-left fa-lg"></i></a> </check:if> </div> </box:pagination> </div> <div class="left"> <div class="block-right-left"> <box:blog_info> <div class="left-back-ab"> <div class="about-me"> <check:if blog_image> <img class="blog-image" src="(*blog_image*)"> </check:if> <check:if blog_description> <div class="description-web">(*blog_description*)</div> </check:if> </div> </div> </box:blog_info> (*follow_box*) <box:archive> <div class="left-back"> <div class="title-left"> آرشیو مطالب </div> <div class="archive"> <ul> <view:archive> <li> <a href="(*link_url*)" class="(*archive_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*link_name*) ( (*link_count*) )</div></a> </li> </view:archive> </ul> </div> </div> </box:archive> <box:most_visited_posts> <div class="left-back"> <div class="title-left"> پربیننده ترین مطالب </div> <ul> <view:most_visited_posts> <li> <a href="(*post_link*)" class="(*post_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*post_title*)</div></a> </li> </view:most_visited_posts> </ul> </div> </box:most_visited_posts> <box:authors> <div class="left-back"> <div class="title-left"> نویسندگان </div> <ul> <view:authors> <li> <a href="(*author_link*)" class="(*author_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*author_name*) ( (*author_post_count*) )</div></a> </li> </view:authors> </ul> </div> </box:authors> <box:links> <div class="left-back"> <div class="title-left"> پیوندها </div> <ul> <view:links> <li> <a href="(*link_url*)" alt="(*link_alt*)" target="_blank"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*link_name*)</div></a> </li> </view:links> </ul> </div> </box:links> <box:daily_links> <div class="left-back"> <div class="title-left"> پیوندهای روزانه </div> <ul> <view:daily_links> <li> <a href="(*link_url*)" alt="(*link_alt*)" target="_blank"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*link_name*)</div></a> </li> </view:daily_links> </ul> </div> </box:daily_links> </div> </div> </div> <div class="right"> <div class="block-right-left"> <box:stat> <div class="left-back"> <div class="title-left"> خلاصه آمار </div> <ul> <view:stat> <li> <div class="stat-back"> <span class="stat-title">(*stat_title*)</span> <span class="stat-value">(*stat_value*)</span> </div> </li> </view:stat> </ul> </div> </box:stat> <box:categories> <div class="left-back"> <div class="title-left"> موضوعات </div> <ul> <view:categories> <li> <a href="(*category_link*)" class="(*category_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*category_name*) ((*category_post_count*))</div></a> </li> <check:if category_children> <div class="category-children"> <view:category_children></view:category_children> </div> </check:if> </view:categories> </ul> </div> </box:categories> <box:tag_cloud max="10"> <div class="left-back"> <div class="title-left"> کلمات کلیدی </div> <div class="left-input"> <view:tag_cloud> <span class="tagss"> <a href="(*tag_link*)" class="(*tag_selected*)">(*tag_name*)</a> </span> </view:tag_cloud> </div> </div> </box:tag_cloud> <box:recent_comments max="7"> <div class="left-back"> <div class="title-left"> آخرین نظرات </div> <ul> <view:recent_comments> <li> <a class="recent-cm-a" href="(*comment_link*)"> <div class="recent-comment"> <img class="recent-comment-av-img" src="(*comment_avatar*)"> <div class="recent-cm-detail"> <span class="recent-cm-name"> (*comment_fullname*) </span> <br> <span class="recent-cm-matn">(*comment_body_text max="50"*)</span> </div> </div> </a> </li> </view:recent_comments> </ul> </div> </box:recent_comments> <box:recent_posts> <div class="left-back"> <div class="title-left"> آخرین مطالب </div> <ul> <view:recent_posts> <li> <a href="(*post_link*)" class="(*post_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*post_title*)</div></a> </li> </view:recent_posts> </ul> </div> </box:recent_posts> <box:post_list flag="mobile"> <div class="left-back"> <div class="title-left"> پیام های کوتاه </div> <ul> <view:post_list> <li> <a href="(*post_link*)" class="(*post_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*post_title*)</div></a> </li> </view:post_list> </ul> </div> </box:post_list> <box:popular_posts> <div class="left-back"> <div class="title-left"> محبوب ترین مطالب </div> <ul> <view:popular_posts> <li> <a href="(*post_link*)" class="(*post_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*post_title*)</div></a> </li> </view:popular_posts> </ul> </div> </box:popular_posts> <box:most_commented_posts> <div class="left-back"> <div class="title-left"> مطالب پر بحث تر </div> <ul> <view:most_commented_posts> <li> <a href="(*post_link*)" class="(*post_selected*)"><div class="rate--post"><i class="fa fa-circle-o fa-lg"></i> (*post_title*)</div></a> </li> </view:most_commented_posts> </ul> </div> </box:most_commented_posts> <div class="boxer-b"> <p>منابع</p> </div> </div> </div> <!--بازار--> <center> <a href="https://cafebazaar.ir/" title="بازار"> <img src="http://s7.picofile.com/file/8387245992/bazaar_logo_production.png" width="55px" height="35px"> <p></p> </a></center><a> <!--فارسروید--> </a><center><a> </a><a href="https://farsroid.com/" title="فارسروید"> <img src="http://s6.picofile.com/file/8387246450/Logo_Small.png" width="150px" height="40px"> <p></p> </a></center><a> <!--Google Play--> </a><center><a> </a><a href="https://play.google.com/" title="Google Play"> <img src="http://s7.picofile.com/file/8387246426/play_prism_hlock_2x.png" width="150px" height="30px"> <p></p> </a></center><a> <!--Foooter--> </a><div class="fotter"><a> Designed By </a> <span class="bayan"> Edit By <a href="http://aitac.blog.ir/">محمد صادق تقی زاده</a> and <a class="erfan" href="http://hesamgraphic.ir/" target="_blank">حسام صائمی</a> and <a class="erfan" href="http://vira-q.blog.ir/" target="_blank">ویرا قالب</a> </span> </div> <!--Foooter--> </div> <!--wrp--> <div class="mymenu1"> <div class="label">موضوعات</div> <div class="spacer"></div> <div class="item"><span><a href="http://sadradl.blog.ir/category/%D8%A8%D8%A7%D8%B2%DB%8C/">بازی</a></span></div> <div class="item"><span><a href="http://sadradl.blog.ir/category/%D8%A7%D9%BE%D9%84%DB%8C%DA%A9%DB%8C%D8%B4%D9%86/">اپلیکیشن</a></span></div> </div></body></html>
CSS
/* دعا کن شهید شم */
*{font-family:Vazir !important;}
.fa{font: normal normal normal 14px/1 FontAwesome !important;}
@font-face {
font-family:'FontAwesome';
src:url('//bayanbox.ir/download/3376674101209512198/fontawesome-webfont.eot');
src:url('//bayanbox.ir/download/3376674101209512198/fontawesome-webfont.eot?#') format('embedded-opentype'),
url('//bayanbox.ir/download/563157643849148443/fontawesome-webfont.woff') format('woff'),
url('//bayanbox.ir/download/7290627479469205398/fontawesome-webfont.ttf') format('truetype');
font-style:normal;
font-weight:normal;
}
/*--body--*/
body a{
text-decoration: none;
}
body {
background: #f7f7f7;
}
/*--wrp--*/
#wrp {
width: 1024px;
margin: auto;
}
/*--header--*/
.header {
background-image: url(http://s7.picofile.com/file/8386672092/header_boy_1.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
padding: 100px 25px;
line-height: 1.8em;
color: #fff;
text-align: left;
font-family: Vazir;
border-radius: 2px;
margin: 10px 0px;
border: 1px solid #ececec;
}
.header h1{
font-size: 18px;
font-weight: normal;
font-family: Vazir;
background: rgba(0,0,0,.3);
display: inline-block;
padding: 4px 10px;
margin: 0;
border-radius: 2px;
}
.header a {
color: #fff;
}
/*--menu--*/
.menu {
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
padding: 6px 6px;
margin-top: 10px;
border-radius: 2px;
font-family: Vazir;
text-align: center;
}
.menu ul {
list-style: none;
padding: 0;
margin: 0;
}
.menu li {
list-style: none;
padding: 0px;
margin: 0px;
display: inline-block;
}
.menu a{
padding: 1px 10px;
margin: 0px 2px;
color: #fff;
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
border-radius: 15px;
}
.menu a:hover{
background: #d41c3b;
color: #fff;
transition-duration: .3s;
}
.menu a.selected{
background: #395cb8;
}
/*--all-block--*/
#block-left {
float: left;
width: 795px;
}
.block-post {
margin-bottom: 10px;
width: 565px;
float: right;
clear: both;
}
/*--post--*/
.post {
background: #fff;
margin-bottom: 10px;
border-radius: 2px;
border: 1px solid #ececec;
}
.post a{
color: #e02445;
}
.post a:hover {
color: #ab2139;
}
.post img{
max-width: 100%;
height: inherit;
}
.post-image img{
width: 100%;
height: inherit;
}
.post-title {
padding: 0px 10px;
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
border-radius: 2px 2px 0px 0px;
}
.post-title h2 {
margin: 0;
padding: 0;
font-family: Vazir;
font-weight: normal;
font-size: 16px;
}
.post-title a{
color: #fff;
}
.post-title a:hover {
color: #faf9f9;
}
.post-matn {
padding: 5px 10px 5px 10px;
line-height: 1.7;
color: #000;
}
.read-more {
text-align: center;
padding: 4px 0px 15px 0px;
}
.read-more a{
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
color: #ffffff;
border-radius: 2px;
padding: 4px 8px;
}
.read-more a:hover {
background: #e01f40;
color: #fff;
}
/*--post-detail-top--*/
.post-detail-top {
padding: 4px 0px;
background: #f5f5f5;
color: #a3a3a3;
cursor: default;
font-size: 12px;
}
.post-detail-top a {
color: #a3a3a3;
cursor: default;
}
.post-detail-top ul{
list-style: none;
padding: 0;
margin: 0;
}
.post-detail-top li{
border-left: 1px solid #dedede;
display: inline-block;
padding: 0px 5px;
}
.post-detail-top li:last-child {
border-left: 0px;
}
/*--post-detail--*/
.post-detail {
padding: 2px 10px;
background: #f5f5f5;
overflow: auto;
color: #a3a3a3;
border-radius: 0px 0px 2px 2px;
}
.post-detail ul{
list-style: none;
padding: 0;
margin: 0;
}
.post-detail li{
list-style: none;
padding: 4px 0px;
margin: 0;
display: inline-block;
}
.post-detail-right {
float: right;
}
.post-detail-left {
float: left;
}
.post-detail li:after {
content: "|";
color: #dedede;
padding: 0px 4px;
}
.post-detail li:last-child:after {
content: "";
padding: 0;
}
.post-detail a{
color: #e63856;
}
.post-detail a:hover {
color: #cd1d3c;
transition-duration: .3s;
}
.post-author{
cursor: default;
}
.post-author i{
padding-left: 3px;
}
.post_date {
cursor: default;
}
.post_date i{
padding-left: 3px;
}
.post-tags {
background: #fff;
border: 1px solid #ececec;
border-radius: 2px;
padding: 5px;
}
.post-tags-title {
background: #f5f5f5;
padding: 6px 10px;
margin-bottom: 4px;
border-radius: 2px;
color: #2e2e2e;
}
/*----comment-----*/
.comment-count-box {
text-align: center;
margin-top: 10px;
padding: 8px 0px;
background: #fff;
border: 1px solid #ececec;
border-radius: 2px;
font-family: Vazir;
}
.comment-count-box a{
color: #000;
font-size: 20px;
}
.cm-body {
background: #fff;
border: 1px solid #ececec;
border-radius: 2px;
margin-right: 56px;
padding-bottom: 1px;
}
.cm-main {
margin-top: 10px;
}
.cm-avatar {
float: right;
}
.cm-av {
width: 50px;
border-radius: 50%;
}
.comment-details {
padding: 6px;
background: #e63856;
overflow: hidden;
border-top-right-radius: 2px;
border-top-left-radius: 2px;
}
.cm-name {
margin-right: 5px;
float: right;
color: #fff;
}
.cm-name a{
color: #ebdbde;
}
.cm-name a:hover{
color: #f9f5f6;
}
.comment-matn {
padding: 10px;
line-height: 1.7;
overflow: hidden;
color: #000;
}
.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: #f0f0f0;
line-height: 1.7em;
color: #000;
border-radius: 2px;
}
.comment-reply-page {
padding: 8px;
background: #f0f0f0;
line-height: 1.7em;
color: #000;
border-radius: 6px;
}
.reply-av {
width: 35px;
float: right;
border-radius: 50%;
}
.comment-add-form {
margin-top: 15px;
margin-bottom: 15px;
padding: 10px;
background: #fff;
border-radius: 2px;
color: #000;
border: 1px solid #ececec;
}
.bComForm .sendbutton.hasCheckbox:hover {
background: #e0e0e0;
transition-duration: .3s;
}
input[type=button], input[type=text], input[type=password], input[type=submit], button, textarea, select, .inputBox, input.text, a.btn, a.btn:hover, a.btn:visited {
background-color: #e6e6e6;
border: 0px;
color: #454545;
border-radius: 0px;
}
.htmlbox {
border: 1px solid #dedede !important;
background: #fff;
}
.bComForm .sendbutton.hasCheckbox {
background: #e63856;
border: 0px;
cursor: pointer;
margin-top: 0;
width: 100px;
border-radius: 2px;
color: #fff;
}
.bComForm .sendbutton.hasCheckbox:hover {
background: #d42140;
transition-duration: .3s;
}
/*--pageination--*/
.pagingation {
background: #fff;
border: 1px solid #ececec;
border-radius: 2px;
text-align: center;
padding: 9px;
margin-top: 10px;
}
.pagesList {
display: inline-block;
}
.pagingation a{
padding: 4px 10px;
background: #e63856;
color: #fff;
border-radius: 2px;
}
.pagingation a:hover {
background: #d61f3e;
transition-duration: .3;
}
/*--left-right--*/
.left {
float: left;
width: 220px;
color: #000;
margin-top: 10px;
}
.right {
float: right;
width: 220px;
margin-top: 10px;
}
.block-right-left a{
color: #000;
}
.archive a.selected {
color: #000;
}
.title-left {
text-align: center;
border-radius: 2px 2px 0px 0px;
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
color: #fff;
padding: 2px 8px;
font-family: Vazir;
cursor: default;
}
.left-back {
border-radius: 2px;
margin-bottom: 10px;
background: #fff;
border: 1px solid #ececec;
}
.block-right-left ul {
list-style: none;
margin: 0;
padding: 0;
}
.block-right-left li{
padding: 0px 5px;
margin: 0;
border-bottom: 1px solid #e5e5e5;
}
.block-right-left li:last-child{
border-bottom: 0px;
}
.block-right-left li:hover {
background: #f7f7f7;
}
.left-input {
padding: 8px 5px;
}
/*--follow-box--*/
.followBx {
margin: 10px 8px 5px 8px;
}
.followThis.followed {
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
}
.followThis {
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
}
#followInBx #followersLs .followImg {
border-radius: 50%;
}
/*stat*/
.stat-back {
padding: 5px 4px;
border-radius: 4px;
cursor: default;
}
.stat-value {
float: left;
display: inline-block;
}
/*about-me*/
.left-back-ab {
border-radius: 2px;
margin-bottom: 10px;
background: #fff;
border: 1px solid #ececec;
}
.about-me {
margin-bottom: 10px;
text-align: center;
padding-bottom: 10px;
padding-top: 10px;
}
.blog-image {
width: 200px;
height: inherit;
margin: 5px 0px;
border-radius: 2px;
}
.description-web {
line-height: 1.6em;
padding: 10px 10px 0px 10px;
}
/*recent-comment*/
.recent-comment {
padding: 2px 0px;
clear: both;
line-height: 1.7;
}
.left-input a{
color: #4d4d4d;
}
.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: #e63856;
}
#block-left li:hover .recent-cm-name{
color: #000;
}
.recent-comment a{
color: #cad9e2;
}
/*مطالب محبوب*/
.block-right-left i{
color: #ebebeb;
margin-left: 5px;
font-size: 12px;
}
.block-right-left li:hover i {
color: #e63856;
}
.rate--post {
color: #2b2b2b;
padding: 4px;
line-height: 1.8em;
}
.rate--post:hover{
}
a.selected .rate--post i {
color: #e63856;
}
.category-children {
margin-right: 10px;
}
/*--tags--*/
.tagss {
display: inline-block;
}
.tagss a{
padding: 5px 8px;
background: #f3f3f3;
border-right: 2px solid #dedede;
display: table-cell;
color: #000;
transition-duration: .3s;
border-radius: 2px;
}
.tagss a:hover{
background: #f1f1f1;
color: #000;
}
.tagss a.selected{
background: #f1f1f1;
color: #000;
}
/*----fot----*/
.fotter {
background-image: linear-gradient(45deg,#2196F3 0,#03A9F4 35%,#00BCD4 60%,#3F51B5 100%);
border: 1px solid #ececec;
margin-bottom: 10px;
border-radius: 2px;
padding: 20px;
clear: both;
bottom: 0;
left: 0;
top: auto;
direction: ltr;
color: #000;
}
.fotter .erfan{
transition-duration: .5s;
color: #e63856;
text-decoration: none;
}
.fotter .erfan:hover{
color: #cc1e3c;
}
.bayan {
float: right;
color: #000;
}
.bayan a {
color: #e63856;
}
.bayan a:hover{
color: #c91d3a;
}
@media only screen and (max-width: 768px) {
body {
font-size: 90%;
}
.menu li:after {
content: "";
}
.header {
text-align: center;
}
.menu li{
padding: 1px 0px;
display: block;
}
#wrp {
width: 95%;
margin-right: 2.5%;
margin-left: 2.5%;
}
#block-left {
width: 100%;
}
.block-post {
width: 100%;
border-right: 0px;
}
.left {
width: 100%;
margin-top: 0px;
}
.right {
width: 100%;
margin-top: 0px;
}
.menu {
text-align: center;
}
.menu a{
display: block;
}
.left-back-ab {
border-radius: 2px;
}
.about-me img{
width: 80%;
}
}
/*!
* Font Awesome 4.5.0 by @davegandy - http://fontawesome.io - @fontawesome
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
*/
/* FONT PATH
* -------------------------- */
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* makes the font 33% larger relative to the icon container */
.fa-lg {
font-size: 1.33333333em;
line-height: 0.75em;
vertical-align: -15%;
}
.fa-2x {
font-size: 2em;
}
.fa-3x {
font-size: 3em;
}
.fa-4x {
font-size: 4em;
}
.fa-5x {
font-size: 5em;
}
.fa-fw {
width: 1.28571429em;
text-align: center;
}
.fa-ul {
padding-left: 0;
margin-left: 2.14285714em;
list-style-type: none;
}
.fa-ul > li {
position: relative;
}
.fa-li {
position: absolute;
left: -2.14285714em;
width: 2.14285714em;
top: 0.14285714em;
text-align: center;
}
.fa-li.fa-lg {
left: -1.85714286em;
}
.fa-border {
padding: .2em .25em .15em;
border: solid 0.08em #eeeeee;
border-radius: .1em;
}
.fa-pull-left {
float: left;
}
.fa-pull-right {
float: right;
}
.fa.fa-pull-left {
margin-right: .3em;
}
.fa.fa-pull-right {
margin-left: .3em;
}
/* Deprecated as of 4.4.0 */
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.fa.pull-left {
margin-right: .3em;
}
.fa.pull-right {
margin-left: .3em;
}
.fa-spin {
-webkit-animation: fa-spin 2s infinite linear;
animation: fa-spin 2s infinite linear;
}
.fa-pulse {
-webkit-animation: fa-spin 1s infinite steps(8);
animation: fa-spin 1s infinite steps(8);
}
@-webkit-keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes fa-spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
.fa-rotate-90 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.fa-rotate-180 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.fa-rotate-270 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
}
.fa-flip-horizontal {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
-webkit-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.fa-flip-vertical {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
-webkit-transform: scale(1, -1);
-ms-transform: scale(1, -1);
transform: scale(1, -1);
}
:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
filter: none;
}
.fa-stack {
position: relative;
display: inline-block;
width: 2em;
height: 2em;
line-height: 2em;
vertical-align: middle;
}
.fa-stack-1x,
.fa-stack-2x {
position: absolute;
left: 0;
width: 100%;
text-align: center;
}
.fa-stack-1x {
line-height: inherit;
}
.fa-stack-2x {
font-size: 2em;
}
.fa-inverse {
color: #ffffff;
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.fa-comment-o:before {
content:"\f0e5";
}
.fa-calendar-o:before {
content:"\f133";
}
.fa-comment-o:before {
content:"\f0e5";
}
.fa-calendar-o:before {
content:"\f133";
}
.fa-home:before {
content:"\f015";
}
.fa-comments:before {
content:"\f086";
}
.fa-paint-brush:before {
content:"\f1fc";
}
.fa-thumbs-o-up:before {
content:"\f087";
}
.fa-external-link:before {
content:"\f08e";
}
.fa-thumbs-o-down:before {
content:"\f088";
}
.fa-heart-o:before {
content: "\f08a";
}
.rate-button-box.rated .fa-heart-o:before {
content:"\f004";
color: #e63856;
}
.fa-comments-o:before {
content: "\f0e6";
}
.fa-user:before {
content: "\f007";
}
.fa-angle-double-left:before {
content:"\f100";
}
.fa-angle-double-right:before {
content:"\f101";
}
.fa-angle-right:before {
content:"\f105";
}
.fa-angle-left:before {
content:"\f104";
}
.fa-sticky-note-o:before {
content:"\f24a";
}
.fa-clock-o:before {
content:"\f017";
}
.fa-bars:before {
content:"\f0c9";
}
.fa-eye:before {
content:"\f06e";
}
.fa-circle-o:before {
content:"\f10c";
}
.mymenu1{z-index: 99999999;}
.label:hover{
display:inline-block;
background:#333;
transition:0.5s ease-in-out;
color:#fff;
display: inline-block;
}
.item span a{border: 3px double #4c4c4cbf;}
.item:hover span a{background:#333333ab;border: 3px double #0c0c0c9e;}
.mymenu1{padding: 15px 10px 1px 10px;border-radius:20px;border: 4px double #00000000;transition:0.5s ease-in-out;text-transform: uppercase;color: rgba(0, 0, 0, 0.8);width: 96%;display: inline-block;direction: rtl;cursor: pointer;pointer-events: none;position: fixed;bottom: 15px;right: 15px;left: 10px;}
.mymenu1:hover {padding: 15px 10px 1px 10px;background: rgba(0, 242, 96, 0.60);background: -webkit-linear-gradient(to right, rgba(5, 117, 230, 0.66), rgba(0, 242, 96, 0.66));background: linear-gradient(to right, rgba(5, 117, 230, 0.66), #00f260a8);width: 96%;
bottom: 15px;right: 0px;left: 10px;
transition:0.5s ease;
border:4px double #272323b3;
pointer-events: all;
padding: 15px 10px 1px 10px;
border-radius:20px;
}
.mymenu:before{border:0px;}
.mymenu1:after{border:0px;}
.label {
display: inline-block;
cursor: pointer;
transition: 0.5s ease-in-out;
text-align: center;
float: right;
background: #283c86a8;
/* fallback for old browsers */background: -webkit-linear-gradient(to right, #45a247, #283c86); /* Chrome 10-25, Safari 5.1-6 */background: linear-gradient(to right, #45a247a8, #283c86a8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */font-size: initial;pointer-events: all;padding: 10px 15px;border: 3px double #0000008a;border-radius: 10px/20%;}
.item {display: inline-block;text-align: center;margin-bottom: 15px;margin-right: 2px;margin-left: 2px;opacity: 0;transition: opacity 0.5s ease, top 0.5s ease;transition-delay: 0;}
span {
transition: color 0.5s ease;
}
.item span a{color: #000;font-size: initial;border-radius:5px;padding: 9px 5px;transition: 0.4s ease-in-out;display: inline-block;}
.item:hover span a {color: #ffffff;transition: 0.4s ease-in-out;padding:9px 5px;}
.mymenu1:hover .item {
opacity: 1;
top: 0px;
}
.item:nth-child(1) {
transition-delay: 0.45s;
}
.item:nth-child(2) {
transition-delay: 0.4s;
}
.item:nth-child(3) {
transition-delay: 0.35s;
}
.item:nth-child(4) {
transition-delay: 0.3s;
}
.item:nth-child(5) {
transition-delay: 0.25s;
}
.item:nth-child(6) {
transition-delay: 0.2s;
}
.item:nth-child(7) {
transition-delay: 0.15s;
}
.item:nth-child(8) {
transition-delay: 0.1s;
}
.item:nth-child(9) {
transition-delay: 0.05s;
}
.item:nth-child(10) {
transition-delay: 0s;
}
.mymenu1:hover .item:nth-child(1) {
transition-delay: 0.25s;
}
.mymenu1:hover .item:nth-child(2) {
transition-delay: 0.3s;
}
.mymenu1:hover .item:nth-child(3) {
transition-delay: 0.35s;
}
.mymenu1:hover .item:nth-child(4) {
transition-delay: 0.4s;
}
.mymenu1:hover .item:nth-child(5) {
transition-delay: 0.45s;
}
.mymenu1:hover .item:nth-child(6) {
transition-delay: 0.5s;
}
.mymenu1:hover .item:nth-child(7) {
transition-delay: 0.55s;
}
.mymenu1:hover .item:nth-child(8) {
transition-delay: 0.6s;
}
.mymenu1:hover .item:nth-child(9) {
transition-delay: 0.65s;
}
.mymenu1:hover .item:nth-child(10) {
transition-delay: 0.7s;
}
@media only screen and (max-width: 700px) {.mymenu1 {position: fixed;left: 0px;right:0px;}.mymenu1:hover {position: fixed;left: 0px;right: 15px;}}
.Offline {
top: 8px;
right: 6px;
position: fixed;
width: fit-content;
color: #ffffff;
direction: rtl;
background-color: #0beb00;
padding: 6px;
padding-bottom: 2px;
padding-top: 2px;
border-radius: 50px;
border-top-right-radius: 0;
}
.bbox {
Background: #0000bb;
Color: #fff;
Border-top: 5px solid #0000aa;
Border-left: 5px solid #0000aa;
Border-bottom: 5px solid #0000cc;
Border-right: 5px solid #0000cc;
Text-align: center;
Margin: 20px;
Padding: 2px;
Font-size: 16px;
Transition: all 0.5s;
}
.bbox:hover {
Filter: grayscale(100%);
Transform: scale(1.1)}
}
.box1{
direction:rt1;
background:#1abc0c
color:#000
font-family:"Vazir";
padding:15px;
margin:10px;
border-top:4px solid #16a085
}
.boxer-b {
margin:8px 2px;
padding: 2px 5px;
border-radius: 20px 0px;
background: #afd8f3;
background-image: linear-gradient(90deg,#c2f7ff,#c8e4ff);
border-right: 3px solid #0056b8;
border-left: 3px solid #00b2ff;
text-align: center;
direction: rtl;
transition: all 1s cubic-bezier(0.75,-5,0.25,5);
}
.boxer-b:hover {
border-radius: 0px 20px;
background-image: linear-gradient(-90deg,#c2f7ff,#c8e4ff);
border-right-color: #00b2ff;
border-left-color:#0056b8;
}
با تشکر از حسام صائمی و محمدصادق تقی زاده ک در این ادیت کمکمون کردن
با تشکر از عرفان ک قالبو طراحی کرد
خدا بیامرزه صدرا دانلود رو
وبلاگ خوبی بود
خدابیامرزتش