@charset "UTF-8"; /* reset kinde of */ * { box-sizing: border-box; outline: none !important; } /* global */ p { margin: 0.25em 0; } a { text-decoration: none; } img, table { max-width: 100%; } .imgFeat { width: 100%; height: auto; } .hr { border: 0; height: 15px; background: transparent !important; } /* html */ html { scroll-behavior: smooth; } /* margin and padding */ .mrg0, .ul { margin: 0; } .mrgb { margin-bottom: 1rem; } /* lists */ .ul { list-style-type: none; padding: 0; } .li:last-child { margin-bottom: 0; } /* flex */ .fl,.flW,.flRe,.flWRe { display: flex; } .flW,.flWRe { flex-wrap: wrap; } .flRe,.flWRe { flex-direction: row-reverse; } .aliI-CE { align-items: center; } .jusCo-SP { justify-content: space-between; } .jusCo-CE { justify-content: center; } .fl-im { display: flex !important; } /* border-radius */ .borOK { border-radius: 50%; } .borNOK { border-radius: 10rem; } /* buttons and input[type="submit"] */ .but, input[type="submit"] { padding: 0; border: 0; margin: 0; background: transparent; cursor: pointer; } /* positioning */ .por{ position: relative; } .pos,.farhana { position: absolute; } .farhana { top: 0; right: 0; bottom: 0; left: 0; inset: 0; } .zin1 { z-index: 1; } .zin2 { z-index: 2; } .zin3 { z-index: 3; } .zin4 { z-index: 4; } .zin5 { z-index: 5; } /* aligns */ .txt-R { text-align: right; } .txt-C { text-align: center; } .txt-L { text-align: left; } .dir-L { direction: ltr; } .dir-R { direction: rtl; } /* summary */ summary { cursor: pointer; } .s2, .s3, article[name$=".-."] .s1, article[name$="....."] .s1 { display:none; } article[name$=".-."] .s2,article[name$="....."] .s3 { display:block !important; } /* fonts */ @font-face { font-family: 'main'; src: url(https://bayanbox.ir/download/1133625635203418600/Vazir.ttf); } @font-face { font-family: 'head'; src: url(https://bayanbox.ir/download/1814474956446320061/headings.ttf); } @font-face { font-family: 'main2'; src: url(https://bayanbox.ir/download/4157849144148293191/Normal.ttf); } /*font awesome*/ @font-face { font-family: 'Font Awesome 5 Free'; src: url("https://bayanbox.ir/download/4392897547407628947/fa-solid-900.eot?#iefix") format("embeded-opentype"), url("https://bayanbox.ir/download/3706299187250494616/fa-solid-900.woff") format("woff"), url("https://bayanbox.ir/download/3787616081568797036/fa-solid-900.woff2") format("woff2"), url("https://bayanbox.ir/download/59719621806361717/fa-solid-900.svg#fa-solid-900") format("svg"), url("https://bayanbox.ir/download/7180062416204032635/fa-solid-900.ttf") format("truetype"); font-style: normal; font-weight: normal !important; } /*به هیچ وجه پاک نکنید*/ .fa { font-family : 'Font Awesome 5 Free' !important; font-style: normal; font-weight: normal !important; } textarea, input, select, body, button, h1, h2, h3, h4, h5, h6,.followBx, .followThis, .cke_reset_all .cke_rtl * { font-family: main2, main; } /* body */ body { background: #fff; font-size:16px; } main { width: 740px; margin: 50px auto 0; } .nShBl h1 a { color: sandybrown; font-size: 3em; font-family: 'head'; } .nShBl { margin-bottom: 25px; text-align: center; } .nShBl strong { color:#000; } .sec { background: #fff; box-shadow: 0 0 30px 2px #edeced; padding: 10px; border-radius: 5px; margin-bottom: 10px; } /* post blocks */ .articles { width: 500px; } /* header */ .sec.header div { width: 100%; height: 200px; border-radius: 5px; background: url('https://i.pinimg.com/originals/c3/e8/bf/c3e8bf803213ac0c9aaf5e70f283c2d6.png')no-repeat; background-size: cover; } /* menu */ .menu-I { margin: 5px 0 2.5px 5px; } .menu-I a { color: #e9ba93; border: 2px dashed; padding: 5px 18px; border-radius: 10px; font-size: 0.76em; display: block; } /* posts in post block */ .post-I { background: #fff; margin-bottom: 20px; border-radius: 5px; box-shadow: 0 0 30px 3px #edeced; } /* original post */ /*post tags*/ .tags-for-each-post { font-size: 0.79em; background: #fff; padding: 10px; border-radius: 4px; box-shadow: 0 0 30px 3px #ececec; } .tags-for-each-post ul li { padding: 0px 3px; margin: 0 0 3px 3px; position:relative; } .tags-for-each-post ul li:after { content: '#'; color:#bdbdbd; font-size:0.81em; } .tags-for-each-post ul li a { color:#c4c4c4; } /*post tags*/ .header-post-org { padding: 5px 10px; border-bottom: 1px solid #fafafa; } /* تکه کد زیر را به هیچ وجه تغییر ندهید ینی اصلا رنگشو تغییر ندید باعث خراب شدن وب میشه */ .data .xd::marker { color: transparent !important; } .data[open=""] .xd svg, .data .xd i { display: none; } .data[open=""] .xd i { display: block; } .data { text-align: center; } /* data post */ .data .xd { fill: #000000a1; display: flex; align-items: center; justify-content: center; height: 100%; } .data .xd i { color: red; } .data-post { font-size: 0.73em; background: #fff; width: 200px; border-radius: 5px 0 0; top: 60px; box-shadow: 0 0 10px 3px #4c4c4c; right: 0; z-index: 1; } .data-post div { padding: 5px; text-align: center; } .data-post .txt-C { border-bottom: 1px solid #f7f7f7; margin-bottom: 8px; } .data-post a { display: block; background: antiquewhite; color: #000; font-weight: 600; padding: 4px 8px; text-align: center; } .name-post-org { width: calc(100% - 50px); padding: 11px 6px 0; font-size: 1em; } .name-post-org a { color: #000; } .main-post-org { font-size: 0.80em; padding: 5px 10px; } .footer-post-org { padding: 10px; border-top: 1px solid #f7f7f7; } .footer-post-org div svg { margin-left: 10px; fill: #000000a1; } .rated a .like { /*رنگ قلب بعد از لایک برای پست های عادی*/ fill: red; } .notes { font-family: 'head'; color: #afafaf; font-size: 16px; } /* chat posts */ .main-Chat { padding: 15px 5px; background: antiquewhite; } .chat-con { padding-right: 15px; } .chat-One { margin-bottom: 25px; } .main-content-of-chat { padding: 5px; font-size: 0.8em; } .chat-con:after { content: ''; position: absolute; border: 0; top: -1px; right: 6px; } /* chat one */ .chat-One .main-content-of-chat { background: #e8d6bd; color: #000; } .chat-One .chat-con:after { border-right: 15px solid transparent; border-bottom: 15px solid #e8d6bd; } /* chat Two */ .chat-Two .main-content-of-chat { background: #f0cdbd; color: #000; } .chat-Two .chat-con:after { border-right: 15px solid transparent; border-bottom: 15px solid #f0cdbd; } /* music posts */ .whole-part-of-music { height: 500px; overflow: hidden; border-radius: 5px; } .blurOv { backdrop-filter: blur(6px); } .music-header { width: 100%; padding: 10px 5px; } .music-name { font-size: 0.8em; width: calc(100% - 55px); padding-left: 5px; } .music-name a { color: #fff; } .author-img-music { width: 40px; height: 40px; } .author-img-music i { width: 25px; height: 25px; bottom: -9px; right: -8px; background: #0000006b; border-radius: 100px; color: #fff; font-size: 12px; } .img-music-i { width: 200px; height: 200px; border-radius: 10px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .img-music-i .por { border-radius: inherit; width: 100%; } .img-music-i .por img { border-radius: inherit; } .aud-con { left: 50%; width: 35px; height: 35px; border-radius: 50%; overflow: hidden; top: 100%; transform: translate(-50%, -66%); } .aud-con audio { filter: invert(1); width: 100px; height: 38px; position: absolute; left: -8px; top:0; } .footer-in-music { bottom: 10px; right: 10px; fill: cadetblue; } .music-like-counter { font-size: 13.3333px; color: cadetblue; margin-right: 10px; font-family: 'head'; } /* sidebar */ aside { width: 220px; } .head-side { padding: 2px 5px; border-radius: 5px; background: antiquewhite; color: #000; margin-bottom: 6px; font-family: 'head'; } /* profile */ .prof img { border-radius: 3px; } .blgDesc { font-size: 0.82em; margin-bottom: 8px; } .prof div a { width: 48%; padding: 5px; border-radius: 3px; } .prof div a.chata { border: 2px solid antiquewhite; color: #c7866a; } .prof div a.followa { background: antiquewhite; color: #000; border: 2px solid antiquewhite; } /* search box */ #srchBx { padding: 0 !important; margin: 0 !important; background: transparent; border-radius: 10px; height:auto !important; line-height: 0 !important; } #srchBx form { display: flex; align-items: center; justify-content: space-between; border-radius: 100px 5px 5px 100px; background: antiquewhite; } .search-wrapper { width: 87%; margin: 0 !important; } .search-wrapper .text { width: 100%; border: 0; outline: 0; padding: 0 6px; height: 40px; background: transparent; } .search-box .submit { width: 21% !important; height: 40px !important; border-radius: 10px !important; border: 0 !important; position: relative; background: #dea47f url(http://blog.ir/media/images/search.png?_2d5FF) no-repeat center !important; } .search-wrapper .text::placeholder { color: #000; } /* recent comments */ .recC-I { padding: 5px; border-radius: 6px; background: #fff; margin-bottom: 5px; transition: 0.3s ease-in-out; } .recC-I:nth-child(2n) { background: antiquewhite; } .recC-I:hover, .pos-Side:hover { transform: rotate(3deg); box-shadow: 2px 2px 8px #ddd; } .recC-I a { font-size: 0.80em; color: #000; } .recC-I a div { width: calc(100% - 52px); padding-left: 5px; } /* music web */ .musi-I { padding-right: 5px; margin-bottom: 6px; background: #fff8f1; } .musi-I:nth-child(2n) { background: #fff1e3; } .lePutMusic { padding-left: 5px; overflow: hidden; width: calc(100% - 48px); } .lePutMusic audio { position: absolute; top: 10px; height: 30px; width: 180px; left: 10px; filter: sepia(1) hue-rotate(303deg); transform: scale(1.3); } .musi-I:nth-child(2n)>.lePutMusic audio { filter: sepia(1) saturate(2) hue-rotate(303deg); } /* post-side : recent / top / popular / view ++ posts */ /* access key : recet posts : .pos-side popular posts : .pop-side top posts : .pot-side view posts : .pov-side */ .pos-Side { margin-bottom: 6px; padding: 5px; background: #fff; border-radius: 6px; transition: 0.3s ease-in-out; } .pos-Side:nth-child(2n) { background: antiquewhite; } .pos-Side a { color: #000; font-size: 0.80em; } .pos-Side a img { border-radius: 3px; margin-right: 5px; } .pos-Side a div { width: calc(100% - 48px); } /*categories*/ .category-I { margin-bottom: 6px; } .category-I a { color: black; display: block; text-align: right; padding: 1px 2px; background: blanchedalmond; border-radius: 4px; } .subsc li { padding-right:15px; position:relative; } .subsc li:after { position: absolute; content: '↵'; top: 3px; right: 0; } /* link and daily links */ /* access key : links : .link-l daily links : .link-d */ .link-I { margin-bottom: 6px; padding: 5px; border: 3px dashed #ffe6c4; } .link-I a { font-size: 0.80em; color: #000; display: block; } summary::marker { color: #000; } details .head-side { margin-bottom: 0; } details[open=""] .head-side { margin-bottom: 6px; } /* archive */ /* access : .archive */ .archive-I { margin-bottom: 15px; } .archive-I:first-child { margin-top: 11px; } .archive-I a{ padding: 5px; border-radius: 6px; background: floralwhite; color: #000; border: 2px solid antiquewhite; display: block; font-size: 0.80em; } .archive-I .span { top: -9px; left: 13px; min-width: 25px; height: 25px; border-radius: 100px; border: 2px solid antiquewhite; background: floralwhite; align-items: center; font-size: 10px; } /* stat */ /* access : .stat */ .stat-I:first-child { margin-top: 15px; } .statC { box-shadow: 0 0 0 3px #fff; } /* tag cloud */ .tag-I { padding: 2px 3px; border-radius: 2px; margin: 0 0 3px 2px; background: #f5fafa; } .tag-I a { font-size: 0.80em; color: #000; } .tag-I::after { content: '#'; color: #739797; font-weight: 600; } /* FOOTER */ .footer-web { margin-top: 25px; padding: 15px; background: antiquewhite; border-radius: 50px 50px 0 0; } .footer-web a { color: #000; font-size: 1em; font-family: head; display: block; } /*pagination*/ .pagination { padding: 10px; border-radius: 5px; background: #fff; box-shadow: 0 0 30px 3px #ebedec; margin-top: 15px; float: none; } .pagesList a { padding: 0 5px; border-radius: 5px; color: #000; text-align: center; margin-left: 5px; background: antiquewhite; } .pagesList .current { color:#aaa; background:#fafafa; } .pageNext, .pagePrev { border-radius: 100px; text-align: center; color: #000; display: block; padding: 0 10px !important; background: #ffefd9; margin-left: 5px; } .spacer { color:#000; margin: 0 5px; } /*page*/ .page { background: #fff; border-radius: 5px; box-shadow: 0 0 30px #ebedec; margin-bottom: 10px; } .header-page h1 { font-size: 1em; margin: 0; } .header-page { padding: 5px 10px; border-bottom: 1px solid #fafafa; margin-bottom : 5px; } .main-page { padding: 0 10px; font-size: 0.8em; } .footer-page { padding: 5px 10px; border-top: 1px solid #fafafa; margin-top: 5px; font-family: 'head'; } .footer-page a { color: burlywood; } /*info's about comments*/ .inf-ab-com-cou { padding: 10px; text-align: center; color: #aaa; border-radius: 4px; background: #fff; box-shadow: 0 0 30px 3px #ddd; margin: 15px 0; } /*comments*/ .comment-li-i { width: 100%; padding: 7px; margin-bottom: 25px; border-radius: 5px; box-shadow: 0 0 30px #ddd; } .letPutWholeCommentHere { margin-right: 7px; width: calc(100% - 40px); padding-right: 10px; } .letPutWholeCommentHere:after { top: 0; content: ''; position: absolute; border: 0; right: 0; } .commentIsHere { overflow: hidden; padding: 5px; } .who-is-talking span { color: #000; font-weight: lighter; } .who-is-talking b { font-size: 14px; color: #000; font-weight: bolder; } .who-is-talking { font-size: 12px; font-weight: 400; } .commentMainIsHere { font-size: 0.8em; } .who-is-talking div { width:calc(100% - 25px); padding-left:6px; } .webCom { height: 25px; width: 25px; text-align: center; display: flex; justify-content: center; align-items: center; border-radius: 28px; background: cornflowerblue; color: #fffdf9; } /*first-comment*/ .comment-li-i.first-comment { background: #fff; } .comment-li-i.first-comment .letPutWholeCommentHere .commentIsHere { background: antiquewhite; } .comment-li-i.first-comment .letPutWholeCommentHere:after { border-right: 13px solid transparent; /*این حتما باید همین رنگی باشه پس تغییرش ندید پایینی رو میتونید تغییر بدید ولی مطمعن بشید که با رنگ تکه کد بالا یکی باشه*/ border-bottom: 10px solid antiquewhite; } .comment-li-i.first-comment .letPutWholeCommentHere .commentIsHere .commentMainIsHere { color:#000; } /*second-comment*/ .comment-li-i.second-comment { background: #fff; } .comment-li-i.second-comment .letPutWholeCommentHere .commentIsHere { background: #f0cdbd; } .comment-li-i.second-comment .letPutWholeCommentHere:after { border-right: 13px solid transparent; /*این حتما باید همین رنگی باشه پس تغییرش ندید پایینی رو میتونید تغییر بدید ولی مطمعن بشید که با رنگ تکه کد بالا یکی باشه*/ border-bottom: 10px solid #f0cdbd; } .comment-li-i.second-comment .letPutWholeCommentHere .commentIsHere .commentMainIsHere { color:#000; } /*comment form*/ #comment_box { background: #fff; padding: 10px; border-radius: 5px; box-shadow: 0 0 30px 3px #ebedec; margin: 20px 0; } textarea[name="comment"] { width: 100%; resize: none; height: 100px; border: 2px dashed #ddd; color: #000; font-size: 0.8em; margin-bottom: 10px; padding-top: 14px; } .smalltip { display: none !important; } .formField2 .fldcontent { margin-right:0; padding-left:0; } .item_success { border: 0; border-radius: 4px; } .formField2 { position:relative; } .formField2 label { right: 6px; background: #fff; top: 0; border-radius: 100px; width: fit-content; border: 2px dashed #ddd; padding: 0 5px; font-size: 10px; text-align: center; font-weight: 800; position: absolute; } .inputFix {padding:0 !important;} .inputFix input.text { font-weight: 600; color: #000; margin-bottom: 7px; width: 100%; border: 2px dashed #ddd; padding-top: 10px; font-size: 0.8em; } select { color: #000; font-size: 0.8em; font-weight: 600; padding: 10px 5px 2px; direction: ltr; border: 2px dashed #ddd; width:100%; margin-bottom: 7px; } .bComForm .commentAvatar span { display: none !important; } .in .formField2 { margin-left: 5px; } .bComForm .hasComment .in { float: none; display: flex; width: 100%; align-items: center; flex-wrap: wrap; } #bComSub { width: 100%; text-align: center; border: 0; margin:0; background: repeating-linear-gradient(45deg, antiquewhite, burlywood 1px); border-radius: 100px; color: #000; } .bComForm .commentAvatar img { border: 0; border-radius: 18px 12% 53px 56%; } .item_wrn .icon:after { content: '‼'; text-align: center; display: flex; justify-content: center; align-items: center; font-size: 2em; } .item_wrn .icon { position: relative; background: transparent; border-radius: 100px; } .item_wrn { border: 0; background: gold; color: #000; font-size: 0.9em; border-radius: 2px; } label[for="frm_isprivate"], label[for="frm_anon"], label[for="frm_hide_mail"]{ border: 0; display: inline-block; position: static; padding-right: 0; } .bComForm .hasComment { margin: 4px 0 4px 72px; } #captchaInput { width: 100px; border: 2px dashed #ddd; } /*Typo Graphy*/ .txt h1, .txt h2, .txt h3, .txt h4, .txt h5, .txt h6 { margin: 15px 0; } .txt h1 { font-size: 19.8px; } .txt h5 { color: #888; font-style: oblique; } .txt hr { border: 0; border-bottom: 2px dashed #ddd; } .txt span[style="text-decoration: line-through;"] { color: #c5c5c5; text-decoration: line-through red double !important; } .txt span[style="text-decoration: underline;"] { text-decoration: 1px underline dashed black !important; } .txt sup, .txt sub,.txtch sub, .txtch sup { font-weight: 600; font-size: 12px; color: burlywood; } .txtch sub, .txtch sup { color:#000; } .txt audio,.txtch audio { border-radius: 100px; display: block; margin: 10px auto; max-width: 98%; height: 35px; filter: sepia(1) hue-rotate(315deg); } .txt video,.txtch { width: 100% !important; height: auto !important; } .txt blockquote,.txtch blockquote { position: relative; padding: 18px 15px 10px; background: antiquewhite; text-align: center; font-style:normal; border-radius: 10px; margin: 15px 0; border: 0 !important; } .txt blockquote:after { content: "❝"; position: absolute; left: 50%; top: -2px; transform: translate(-50%, -50%); width: 1em; height: 0.5em; background: tan; box-shadow: -1px 4px 6px 2px rgb(222 184 135 / 39%); border-radius: 5px; display: grid; padding-top: 0.5em; color: black; font-size: 30px; align-content: center; font-style: normal; } /*به هیچ وجه تغییر ندهید*/ .fa-times:before { content: "\f00d"; } .fa-music:before { content: "\f001"; } .fa-link:before { content: "\f0c1"; }