/*
Theme Name:پارس موزیک
Theme URI: https://www.rtl-theme.com/pars-music-wordpress-theme/
Description: پارس موزیک مخصوص سایت های موزیک و دانلود
Version: 2.3
Author: مایکرو سایت
Author URI: https://www.rtl-theme.com/user-profile/roh/
*/
* {
    padding: 0;
    margin: 0
}

@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: 400;
    src: url(fonts/IRANSansX.woff) format("woff"), url(fonts/IRANSansX.woff2) format("woff2");
    font-display: swap
}

html {
    box-sizing: border-box
}

.searchform input {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    background: #f6f7f8;
    font-family: IRANSansX;
    border: 1px solid #ccc
}

.searchform input[type=submit] {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    background: #4caf50;
    color: #fff;
    cursor: pointer;
    font-family: IRANSansX;
    border: 1px solid #4caf50
}

*,
:after,
:before {
    box-sizing: inherit
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

li {
    list-style: none
}

table {
    border-collapse: separate;
    border-spacing: 0
}

img {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

:focus {
    border: none;
    outline: 0
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

::selection {
    background: #b2d3fa;
    color: #000
}

::-moz-selection {
    background: #b2d3fa;
    color: #000
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

* html .clearfix {
    zoom: 1
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: IRANSansX;
    font-weight: 700;
    color: #9a9999
}

h1 {
    
    font-size: 17px
}
.uskkttl{color:#222;}
.kk-star-ratings{flex-direction:column;}
.kksr-legend,.kksr-stars{margin:0 0 1em}
.kk-star-ratings .kksr-muted{opacity:1;color:#222;font-size:15px}

h2 {
    font-size: 16px
}

h3 {
    font-size: 14px
}

h4 {
    font-size: 11px
}

h5 {
    font-size: 11px
}

h6 {
    font-size: 11px
}

.clear {
    clear: both;
    display: block;
    height: 0;
    font-size: 0
}

a,
a:visited {
    color: #666;
    text-decoration: none;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

#color-grey-body a:hover {
    color: #f67182
}

#color-red-body a:hover {
    color: #f67182
}

#color-green-body a:hover {
    color: #4caf50
}

#color-photo-body a:hover {
    color: #333
}

body {
    direction: rtl;
    font-size: 14px;
    background: #f3f7f8;
    line-height: 2;
    font-family: IRANSansX
}

.container {
    width: 1200px;
    margin: 0 auto
}

.mainheader {
    color: #fff;
    background: #fff;
    padding: .8em;
}

.mainheader-header {
    background: #fff
}

.color-green-header {
    background: #4caf50;
    border-top: 2px solid #459a49
}

.color-red-header {
    background: #f1685d;
    border-top: 2px solid #f44336
}

.color-grey-header {
    background: #454647;
    border-top: 2px solid #222
}

.color-blue-header {
    background: #617be3;
    border-top: 2px solid #617be3
}

.color-photo-header {
    background: rgba(51, 51, 51, .6);
    border-top: 2px solid #f44336
}

.maincat ul li a:hover,
.secheader ul li a:hover {
    color: #fff !important
}

#color-photo-body .secheader ul.category-top li>a {
    border: none !important;
    padding: 8px 10px;
    margin-left: 10px;
    border-radius: 5px
}

#color-photo-body .secheader ul.category-top li ul li>a {
    margin-left: 0
}

#color-photo-body .secheader ul.category-top li>a:hover {
    background: rgba(0, 0, 0, .1) !important;
    color: #fff important
}

.logo,
.logo2 {

width: 250px;
height: 100px;
margin: 16px 0;

}


.logo2 {
    background: 0 0 !important
}

.logo a,
.logo2 a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 0
}

.site-description {
    display: none;
    visibility: hidden
}

.maincat {
    width: 64%;
    margin: 0 2.5% 0 1%
}

.maincat ul {
    display: flex;
    justify-content: space-between
}

.maincat ul li a {
    display: flex;
    padding: 15px;
    margin-left: 15px;
    color: rgba(255, 255, 255, .8)
}

.maincat ul li a:hover {
    color: #fff important;
    overflow: hidden
}

.seclink {
    width: 15%
}

.navghk {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.ring {
    background: url(images/sprite.png) no-repeat right -674px rgba(0, 0, 0, .1);
    width: 30px;
    border-radius: 100px;
    height: 30px
}

.notif {
    position: relative;
    float: left
}

.notif .notif-content {
    position: absolute;
    top: 50px;
    left: 0;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .1);
    width: 300px;
    display: none;
    z-index: 999
}

.notif .notif-content ul li a {
    display: block;
    padding: 7px 12px;
    color: #999;
    float: none;
    border-bottom: 1px solid #eee
}

.notif .notif-content ul li a:hover {
    background: #f6f7f8
}

.seclink .notif:hover {
    background: rgba(0, 0, 0, .1)
}

.seclink ul li a {
    display: block;
    float: right;
    color: rgba(255, 255, 255, .6);
    padding: 15px 12px
}

.seclink ul li a:hover {
    color: #fff important
}

.secheader {
    padding: 20px 0 0;
    -webkit-transition: .3s;
    transition: .3s
}

#color-photo-body {
    position: relative
}

.color-photo-float {
    position: absolute;
    top: 0;
    width: 100%;
    background-size: cover;
    height: 350px;
    opacity: .75;
    z-index: -1
}

.color-photo-float::before {
    position: absolute;
    top: 0;
    content: "";
    display: block;
    width: 100%;
    background: #000;
    opacity: .5;
    height: 350px;
    z-index: -2
}

.color-blue-secheader,
.color-green-secheader,
.color-grey-secheader,
.color-photo-secheader,
.color-red-secheader {
    background: rgba(0, 0, 0, .1);
    display: none;
}

.secheader ul.category-top {
    float: right;
    display: block;
    border-bottom: 1px solid #00000017;
    width: 64%
}

.secheader ul.category-top li {
    position: relative;
    display: block;
    float: right;
    padding-bottom: 15px
}

.secheader ul.category-top li ul {
    display: none;
    position: absolute;
    top: 35px;
    background: #fff;
    width: 250px;
    border-radius: 4px;
    right: 0;
    z-index: 999;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .1)
}

.secheader ul.category-top li:hover ul {
    display: block
}

.secheader ul.category-top li>a {
    margin: 0 0 0 20px;
    padding: 18px 5px 17px;
    color: rgba(255, 255, 255, .9);
    position: relative
}

.secheader ul.category-top li>a::before {
    content: '';
    position: absolute;
    bottom: -3px;
    height: 2px;
    background-color: #f2eded;
    width: 0;
    transition: .3s;
    left: 50%;
    transform: translate(-50%, 0)
}

.secheader ul.category-top li>a:hover::before {
    width: 100%
}

.secheader ul.category-top li ul li {
    display: block;
    float: none;
    margin: 0;
    padding: 0
}

.secheader ul.category-top li ul li a {
    margin: 0;
    padding: 10px;
    display: block;
    border-bottom: 1px solid #eee;
    color: #666
}

.secheader ul.category-top li ul li a:hover {
    margin: 0;
    padding: 10px;
    display: block;
    border-bottom: 1px solid #eee;
    color: #2354af !important
}

.telegram span {
    background: rgba(0, 0, 0, .2);
    color: #fff;
    margin-right: 5px;
    font-size: 10px;
    padding: 2px 4px;
    border-radius: 4px
}

.secheader ul li a:hover {
    color: #2060b4
}

.searchbox {
    background: #fff;
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    flex: 1
}

.searchbox2 {
    display: none;
    margin: 0 !important;
    transform: translateY(-7px)
}

.searchbox .searchtext {
    border: none;
    font-family: IRANSansX;
    padding: 9px 15px 9px 0;
    float: right;
    font-size: 12px;
    background: #fff;
    width: 80%;
    border-radius: 5px;
    overflow: hidden
}

.searchbox2 .searchtext {
    background: rgba(255, 255, 255, .1);
    color: #fff !important
}

.searchbox .buttonsearch {
    background: #617be3;
    width: 30px;
    height: 30px;
    border-radius: 50px;
    left: 5px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    border: none
}

.searchbox .buttonsearch i {
    color: #fff
}

.col2-header .social {
    float: left;
    width: 100px
}

.col2-header ul.category-top {
    width: 77.5% !important
}

.col2-header .social {
    float: right;
    width: 100px
}

.col3-header ul.category-top {
    width: 80%
}

.col3-header .social {
    float: left;
    width: 100px
}

.social {
    padding: 15px 0 0
}

.social a {
    float: left;
    width: 24px;
    display: block;
    height: 24px;
    margin-left: 5px;
    opacity: .75
}

.social a:hover {
    opacity: 1
}

.social a.s1 {
    background: url(images/sprite.png) no-repeat -772px -33px
}

.social a.s2 {
    background: url(images/sprite.png) no-repeat -743px -33px
}

.social a.s3 {
    background: url(images/sprite.png) no-repeat -714px -33px
}

.toppost {
    padding: 20px 0 40px
}

.topads {
    padding: 10px 0
}

.center-ads {
    text-align: center
}

.center-ads img {
    max-width: 100%;
    margin: 0 auto 10px;
    display: block
}

.top5thumb li {
    float: right;
    border-radius: 4px;
    padding: 10px;
    text-align: center;
    margin-left: 1.25%;
    background: #f6f8f9
}

.toggle {
    margin-left: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    height: 26px;
    width: 52px;
    border-radius: 16px;
    display: inline-block;
    position: relative;
    margin: 0 10px;
    background: #0b6497;
    transition: all .2s ease
}

[dark=true] body {
    background: #232328;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}
[dark=true] .postds , .kk-star-ratings .kksr-muted{

    color: #929090;

    
}


audio {
    width: 100%;
    margin: 5px 0
}

[dark=true] .commentss {
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .artistsList .artist-post {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}

[dark=true] .answer .chdr strong {
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
  
    box-shadow: none
}

.answer .chdr strong [dark=true] .list-picture li {
    background: 0 0;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    transition: all 300sm ease-in-out;
    border-right: none
}

[dark=true] .mwpsng {
    background: 0 0;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
  
    border-right: none
}

[dark=true] .parssmusics {
    background: #303030;
    color: #6b68ff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}

[dark=true] .parsspst li a span {
    color: #6b68ff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}

[dark=true] .navbar-nav {
    background: #232328;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}

[dark=true] .ptviph li a {
    background: #36363f;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
  
    box-shadow: none
}

[dark=true] .ptviph li a:hover span {
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .ptviph li a span {
    color: #fff;
    --toggle-color: rgb(44, 35, 35);
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .ptviph li .pvtrck {
    color: #fff;
    --toggle-color: rgb(44, 35, 35);
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .ptviph li a span:hover {
    color: #6b68ff
}

[dark=true] .ptviph li .pvsngr {
    color: #6b68ff
}

[dark=true] .ptviph li a:hover .pvsngr {
    color: #fff
}

[dark=true] .archive-title {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
  
}

[dark=true] .mainheader {
    background: #36363f;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
}

[dark=true] .arted {
    background: #36363f;
    color: #fff;
    background: linear-gradient(54deg, #36363f 0, #36363f 20%, #080808 75%, #36363f 100%);
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}

[dark=true] .iners {
    background: #232328;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
}

[dark=true] #breadcrumbs {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
    box-shadow: none
}

.category_title,
[dark=true] .category_side {
    background: #303030;
    color: #615e5e;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}

[dark=true] .sth2 {
    border-bottom: 1px solid #434343;
    box-shadow: none
}

[dark=true] .sth {
    border-bottom: 1px solid #434343;
    box-shadow: none
}

[dark=true] .mwsider {
    background: #303030;
    color: #615e5e;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}

.header-box h3,
[dark=true] .top-article {
    background: #303030;
    color: #525050;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
  
    box-shadow: none
}

[dark=true] .header-box h3 {
    background: #303030;
    color: #525050;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .simple-widget-header h3 {
    color: #fff
}

.postmeta,
[dark=true] .header-box {
    border-bottom: 1px solid #393939
}

[dark=true] .postmeta {
    border-bottom: 1px solid #393939
}

[dark=true] .footmeta {
    border-top: 1px solid #393939
}

[dark=true] .widgetarea {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
 
    box-shadow: none
}

[dark=true] .top5thumb li {
    background: #404040;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
}

[dark=true] .answer .chdr span {
    color: #bbb;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}

[dark=true] .answer li p {
    color: #bbb;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}

.comment-respond,
[dark=true] .post  {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}
[dark=true] .parstag {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
    box-shadow: none
}
.hnmimg,
.rphnm .icmn-close,
.rphnm form,
.rphnmbutton {
    display: none;
    transition: .3s all ease
}

.rmfixd {
    position: fixed;
    height: 110px;
    top: 50%;
    background: #aaa;
    background: #617be3;
    color: #fff;
    padding: 15px;
    text-decoration: none;
    z-index: 501;
    cursor: pointer;
    transform: translate(0, -50%)
}

.rmfixd:hover {
    background: #617be3be;
    box-shadow: 0 0 12px RGBA(0, 0, 0, .1);
    transition: .3s all ease
}

.rmfixd .label {
    transform: rotate(-90deg) translate(-40%, -80%);
    position: absolute;
    width: 67px;
    text-align: center
}

.rmfixd.rmnxt .entry-info span {
    margin-right: 1em
}

.rmfixd .entry-info img {
    height: 80px;
    width: 80px;
    border-radius: 7px
}

.rmprv {
    left: 0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px
}

.rmprv .label {
    left: 0
}

.rmnxt {
    right: 0;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px
}

.rmnxt .label {
    right: 0;
    transform: rotate(-90deg) translate(-40%, 80%);
    position: absolute;
    width: 67px;
    text-align: center
}

.rmnxt {
    text-align: right
}

.rmfixd .entry-info {
    height: 80px;
    width: 220px;
    display: flex;
    align-items: center
}

.rmnxt .entry-info {
    margin: 0 20px 0 1px
}

.rmprv .entry-info {
    margin: 0 1px 0 20px
}

.rmfixd .entry-info span {
    display: table-cell;
    vertical-align: middle;
    font-size: 13px;
    line-height: 1.65em;
    color: #fff
}

.rmfixd .entry-info-wrap {
    width: 1px;
    overflow: hidden;
    display: block
}

.rmfixd:hover .entry-info-wrap {
    width: 240px
}

.box.specials a h1 {
    color: #454545;
    font-size: 10px
}

.specials ul li {
    width: 25%
}

.alertbar ul li:nth-of-type(1) {
    width: 100%
}

.mocontent p {
    font-size: 15px
}

[dark=true] .foot span {
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .bg-custom {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
    box-shadow: none
}

[dark=true] .usrcat a {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";

    box-shadow: none
}

[dark=true] .comment-respond {
    background: #303030;
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
    
}

[dark=true] .downloadlinks {
    background: #4f4f4f;
    color: #fff
}

[dark=true] .downloadlinks h2 {
    color: #fff
}

[dark=true] .sidebar h3.adst {
    color: #fff;
    --toggle-color: black;
    --toggle-border: white;
    --mode-content: "Dark Mode on";
   
}

.theme-switch label input {
    display: none
}

.theme-switch label {
    position: relative;
    width: 48px;
    height: 26px;
    display: block;
    margin-left: 10px;
    margin-bottom: 0
}

.theme-switch label span {
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f6d365 0, #fdbb2d 51%, #f6d365 100%);
    border-radius: 34px;
    -webkit-transition: .2s ease-in-out;
    transition: .2s ease-in-out
}

.theme-switch label span::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 21px;
    width: 20px;
    height: 16px;
    background: #fff;
    border-radius: 35px;
    transform: translateX(0) translateY(-50%);
    -webkit-transition: .3s cubic-bezier(.72, .63, .26, .87);
    transition: .3s cubic-bezier(.72, .63, .26, .87)
}

.theme-switch label input:checked+span {
    background: #51545b
}

.theme-switch label input:checked+span::before {
    transform: translateX(-18px) translateY(-50%)
}

.main-content3 .top5thumb li {
    width: 19%
}

.main-content3 .top5thumb li img {
    max-width: 100%;
    height: auto
}

.main-content2 .top5thumb li {
    width: 19%
}

.top5thumb li p {
    padding: 5px;
    height: 64px
}

.top5thumb li:nth-child(5) {
    margin-left: 0
}

.top5thumb li img {
    width: 130px;
    border-radius: 4px;
    height: 130px;
    box-shadow: 0 2px 5px #eee
}

.descbox {
    font-size: 12px;
    margin-top: 10px;
    min-height: 61px;
    border-top: 1px solid #e1e1e1
}

.toppost .name {
    padding: 10px 0 0;
    text-align: center
}

.postmeta a,
.toppost .cat a {
    font-size: 12px;
    color: #7a859a;
    margin-left: 3px;
    padding: 4px 11px;
    display: block;
    background: #f3f5f9;
    border-radius: 30px;
    transition: .3s
}
.postheader{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.mwason {
    padding: .7em 1em;
    border-radius: 7px;
    background: RGBA(210,49,111,0.1);
    color: #f55151;
    font-size: 13px;
    text-align: center;

}
.mahanvip ul {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
   }
   .mahanvip li {
    width:19%
   }
   .mahanvip.mvips li {
    width:31.5%;
   }
   .mahanvip li a {
    display:flex;
    border-radius:10px;
    overflow:hidden;
    position:relative;
    background:#f6f6f6;
    padding:.7em;
    align-items:center;
    margin:0 0 1.5em
   }
   .mahanvip li img {
    width:80px;
    height:80px;
    border-radius:50px;
    margin-left:.7em
   }
   .mahanvip h4 {
    font-size:14px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #e1e1e1;
    padding:0 0 1.5em;
    margin:0 0 1.5em
   }
   .mahanvip h4:before {
    content:"";
    background:url(max/random.svg) no-repeat;
    background-size:cover;
    margin-left:.5em;
    width:24px;
    height:24px
   }
h1.entry-title,.soon-title{
    font-size: 16px;
    padding: 0 42px 0 0;
    width: 85%;
    position: relative
}
.soondd{
    padding: 3px 7px 5px;
    border-radius: 5px;
    background: RGBA(210,49,111,0.1);
    color: #f55151;
    font-size: 12px;
}
.soon-title::before {
    display: block;
    width: 32px;
    position: absolute;
    right: 0;
    content: "";
    box-shadow: 0 0 4px rgba(0, 0, 0, .1);
    height: 32px;
    border-radius: 12px;
    background: #f55151
}
h1.entry-title::before {
    display: block;
    width: 32px;
    position: absolute;
    right: 0;
    content: "";
    box-shadow: 0 0 4px rgba(0, 0, 0, .1);
    height: 32px;
    border-radius: 12px;
    background: #617be3
}

h1.entry-title span ,.soon-title span {
    display: flex;
    align-items: center;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 6px;
    justify-content: center;
    top: 6px;
    z-index: 10;
    font-weight: 700;
    color: #fff
}

#color-green-bod .navigation li a,
#color-green-body .category_side ul li span,
#color-green-body .header-box h3 i,
#color-green-body .morelink a,
#color-green-body .navigation li a:hover,
#color-green-body .navigation li.active a,
#color-green-body .navigation li.disabled,
#color-green-body .sidebar h3.adst::before,
#color-green-body .simplelist li .post-date,
#color-green-body .simplenav3 a.active,
#color-green-body .sth i,
#color-green-body .sth3 i,
#color-green-body h1.entry-title::before,
.category_side2 ul li span,
.searchbox .buttonsearch {
    background: #4caf50;
    color: #ffff
}

#color-green-body .simplenav3 a:hover,
#color-green-body.simplenav3 a.active:hover {
    color: #fff;
    background: #4caf50
}

#color-green-body .category_side ul li,
#color-green-body .usrcat a span,
.category_side2 ul li {
    background: #edffed
}

#color-green-bod .navigation li a,
#color-green-body .category_side ul li a,
#color-green-body .navigation li a:hover .navigation li.active a,
#color-green-body .navigation li.disabled,
#color-green-body .ptviph li .pvsngr,
#color-green-body .usrcat a span i,
.category_side2 ul li a {
    color: #4caf50
}

#color-green-bod .navigation li a,
#color-green-body .navigation li a:hover,
#color-green-body .navigation li.active a,
#color-green-body .navigation li.disabled {
    color: #fff
}

#color-green-body .foot a:hover,
#color-green-body .parslins:hover {
    color: #fff
}

#color-red-body .morelink a,
#color-red-body .sidebar h3.adst::before,
#color-red-rgb(255, 255, 255).entry-title::before {
    background: #e36f72 !important
}

.simplelist li::before {
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%) rotate(45deg);
    right: 0;
    border: 1px solid #ccc;
    border-radius: 50px 50px 50px 0
}

.simplelist li {
    position: relative;
    padding: 5px 15px 5px 10px;
    transition: all .3s ease-out
}

.simplelist li a {
    display: block;
    position: relative
}

.simplelist li .post-date {
    padding: 2px 5px;
    background: #617be3;
    color: #fff;
    border-radius: 2px;
    font-size: 11px
}

.toppost .name span {
    font-size: 11px;
    color: #aaa
}

.main-content2 {
    width: 66.75%;
    float: right
}

.main-content3 {
    flex: 53.3%;
    padding: 10px 0 0
}

.top-article {
    background: #fff;
    border-radius: 14px;
    margin-bottom: 15px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden
}

.top-article ul {
    padding: 15px
}

.top-article ul li {
    position: relative;
    padding: 5px 15px 5px 10px;
    transition: all .3s ease-out
}

.top-article ul.topdefault li::before {
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%) rotate(45deg);
    right: 0;
    border: 1px solid #ccc;
    border-radius: 50px 50px 50px 0
}

.header-box {
    padding: 20px 15px 15px;
    border-bottom: 1px solid #ebe7e7
}

.header-box h3 {
    margin-bottom: 15px;
    background: #fff;
    display: flex;
    align-items: center
}

.header-box h3 span {
    color: #fff;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #617be3;
    margin-left: 10px
}

.header-box nav {
    font-size: 12px;
    padding: 15px 0 0
}

.header-box nav a {
    padding: 5px 10px 13px;
    color: #999;
    border-bottom: 2px solid #f7f9f9
}

.header-box nav .active,
.header-box nav a:hover {
    color: #111;
    border-bottom: 2px solid #f86456
}

.rightsidebar {
    flex: 19.35%;
    padding-top: 20px;
    padding-left: 14px
}

.rightsidebar .center-ads {
    background: #fff;
    margin-bottom: 15px;
    padding-top: 10px;
    border-radius: 4px;
    border-bottom: 2px solid #e5e6e6
}

.main-content2 .center-ads,
.main-content3 .center-ads {
    padding: 10px 0 5px;
    background: #e7ebec;
    border-radius: 4px;
    margin: 15px 0
}

.category_side {
    padding: 20px 15px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    margin: 0 0 20px
}

.category_side2 {
    padding: 15px 0;
    border-radius: 14px;
    background: #2e2e2e;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    margin: 0 0 20px
}

.category_side2 .category_title {
    padding: 3px 30px 10px;
    border-bottom: 1px solid rgba(63, 63, 63, .17);
    margin: 0 10px 10px;
    color: #fff
}

.category_side .category_title {
    padding: 3px 30px 10px;
    border-bottom: 1px solid #e8e6e6;
    margin: 0 10px 10px
}

.category_side ul li,
.category_side2 ul li {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 14px;
    background: #eaeeff;
    margin: 10px 0
}

.category_side ul li a,
.category_side2 ul li a {
    display: block;
    padding: 10px;
    color: #617be3
}

.category_side ul li span,
.category_side2 ul li span {
    background: #617be3;
    font-size: 11px;
    padding: 2px 5px;
    border-radius: 12px;
    margin: 10px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    transition: all .3s ease-out
}

.category_side ul li a:hover,
.category_side2 ul li a:hover {
    color: #617be3
}

.category_side2 ul li a {
    color: #617be3
}

.category_side ul li ul,
.category_side2 ul li ul {
    display: none
}

.category_side ul li ul li ul,
.category_side2 ul li ul li ul {
    position: absolute;
    top: -1500px !important;
    display: block
}

.category_side ul li ul li:hover ul,
.category_side2 ul li ul li:hover ul {
    position: absolute;
    top: 0 !important
}

.category_side ul li:hover ul,
.category_side2 ul li:hover ul {
    position: absolute;
    top: 0;
    right: 100%;
    border-radius: 4px 0 0 4px;
    width: 200px;
    z-index: 50
}

.category_side ul li:hover ul li a {
    display: block;
    color: #617be3;
    padding: 10px
}

.category_side ul li:hover ul li a:hover {
    background-color: rgba(255, 255, 255, .1);
    color: #617be3
}

.sidebar {
    border-radius: 5px;
    margin-right: 12px
}

.text-ads li a {
    display: block;
    padding: 10px;
    border-radius: 5px;
    background: #ebedf7;
    border-bottom: 2px solid #e1e1e1;
    margin-bottom: 10px
}

.sidebar2 {
    flex: 32% !important
}

.sidebar3 {
    width: 26% !important
}

.sidebar h3 {
    font-size: 16px
}

#wp-calendar {
    width: 100%
}

#wp-calendar caption {
    text-align: right;
    color: #333;
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 15px
}

#wp-calendar thead {
    font-size: 10px
}

#wp-calendar thead th {
    padding-bottom: 10px
}

#wp-calendar tbody {
    color: #aaa
}

#wp-calendar tbody td {
    background: #f5f5f5;
    border: 1px solid #fff;
    text-align: center;
    padding: 8px
}

#wp-calendar tbody td:hover {
    background: #fff
}

#wp-calendar tbody .pad {
    background: 0 0
}

#wp-calendar tfoot #next {
    font-size: 10px;
    text-transform: uppercase;
    text-align: right
}

#wp-calendar tfoot #prev {
    font-size: 10px;
    text-transform: uppercase;
    padding-top: 10px
}

#recentcomments li span {
    display: block;
    color: #333;
    font-size: 13px
}

#recentcomments li {
    display: block;
    padding: 8px 0;
    font-size: 11px;
    border-bottom: 1px solid #eee;
    color: #666
}

.sidebar h3.adst {
    position: relative;
    border-bottom: 1px solid #e1e1e2;
    padding: 0 0 10px;
    margin-bottom: 10px
}

.sidebar h3.adst a {
    float: left;
    color: #999;
    border: 1px solid #e1e1e1;
    border-radius: 99px;
    font-weight: 400;
    font-size: 11px;
    padding: 2px 15px;
    background: #fff;
    box-shadow: 0 3px 5px #eee
}

.sidebar h3.adst a:hover {
    color: #fff !important;
    background: #777
}

.sidebar h3.adst::before {
    position: absolute;
    bottom: 0;
    width: 30px;
    content: "";
    height: 2px;
    background: #f86456
}

#recent-posts-2 ul li a {
    display: block;
    position: relative;
    padding: 5px 15px 5px 10px;
    transition: all .3s ease-out
}

#recent-posts-2 ul li a::before {
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%) rotate(45deg);
    right: 0;
    border: 1px solid #ccc
}

#recent-posts-2 ul li a:hover {
    color: #617be3
}

.sth {
    height: 40px;
    align-items: center;
    display: flex;
    font-size: 15px;
    border-bottom: 1px solid #f4f1f1;
    padding: 0 0 10px;
    margin-bottom: 10px
}

.sth3 {
    height: 40px;
    align-items: center;
    display: flex;
    font-size: 15px;
    border-bottom: 1px solid #3f3e3e;
    padding: 0 0 10px;
    margin-bottom: 10px
}

.sth2 {
    height: 40px;
    align-items: center;
    display: flex;
    font-size: 15px;
    border-bottom: 1px solid #f4f1f1;
    padding: 0 0 10px;
    margin-bottom: 10px
}

.sth span {
    width: 32px;
    height: 32px;
    background: #617be3;
    border-radius: 12px;
    margin-left: .7em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.sth4 {
    height: 40px;
    align-items: center;
    display: flex;
    font-size: 15px;
    border-bottom: 1px solid #5b70c9;
    padding: 0 0 10px;
    margin-bottom: 10px;
    color: #fff
}

.sth4 span {
    width: 32px;
    height: 32px;
    background: #fff;
    border-radius: 12px;
    margin-left: .7em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #617be3
}

.sth3 span {
    width: 32px;
    height: 32px;
    background: #617be3;
    border-radius: 12px;
    margin-left: .7em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.sth2 span {
    width: 32px;
    height: 32px;
    background: #f55151;
    border-radius: 12px;
    margin-left: .7em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.mwsider {
    padding: 20px 15px;
    border-radius: 14px;
    background: #222;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden;
    margin: 20px 0 20px
}

.mwsbox header h4 {
    height: 40px;
    align-items: center;
    display: flex;
    font-size: 15px;
    color: #fff;
    padding: 0 0 10px;
    margin-bottom: 10px
}

.mwsbox header h4 i {
    width: 32px;
    height: 32px;
    background: #fff;
    border-radius: 12px;
    margin-left: .7em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #617be3
}

.mwsknde ul {
    line-height: 2.2;
    padding: .5em .7em;
    font-size: 13px
}

.mwsknde ul li span {
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 17px;
    width: 17px;
    margin-left: 9px;
    font-size: 11px;
    border-radius: 50px;
    color: #617be3;
    transition: all .3s ease-out
}

.mwsknde ul li {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.mwsknde ul li a {
    color: #fff
}

.widgetarea {
    padding: 20px 15px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden;
    margin: 0 0 20px
}

.logomobi {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #617be3
}

.foot {
    border-radius: 5px;
    height: 50px;
    width: 100%;
    display: flex;
    align-items: center;
    position: relative
}

.foot .icons {
    display: flex;
    align-items: center
}

.foot span {
    font-size: 13px;
    font-family: IRANSansX;
    color: #49546d;
    position: relative;
    margin-right: 9px;
    display: flex;
    align-items: center
}

.foot span svg {
    display: flex;
    align-items: center;
    margin-left: 5px;
    height: 13px
}

.usrcat {
    flex-direction: column;
    display: flex;
    margin: 20px 0 0
}

.usrcat a {
    display: flex;
    align-items: center;
    font-size: 14px;
    margin: 0 0 1em;
    color: #000;
    padding: 1em;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    position: relative
}

.usrcat a:hover {
    border-color: #fc0
}

.usrcat a span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    background: #f3f5f9;
    border-radius: 12px;
    margin-left: 1em;
    transition: all .3s ease-out
}

.usrcat a span i {
    color: #617be3
}

.usrcat a:hover span {
    background: #617be3
}

.usrcat a:hover span i {
    color: #fff
}

.usrcat a:hover span path {
    fill: #fff
}

.parslins {
    display: flex;
    margin-bottom: 15px;
    border-radius: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 20px 15px 20px 15px;
    background: linear-gradient(91deg, #e91e4a, #f73425);
    color: #fff !important;
    position: relative;
    box-shadow: 0 14px 20px -19px #f42f36;
    transition: .3s
}

.parslins:hover {
    opacity: .9
}

.parslins.tel {
    background: linear-gradient(91deg, #2196f3, #108cef);
    box-shadow: 0 14px 20px -19px #008eff
}

.parslins.tel i {
    background: #75c1ff;
    width: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    font-size: 26px
}

.parslins.insta i {
    background: #ff785670;
    width: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    font-size: 26px
}

.usrcat a::after {
    content: "";
    left: 1.2em;
    top: 50%;
    transform: translate(0, -50%);
    width: 6px;
    height: 9px;
    background: url(./images/arrow-left.svg) no-repeat;
    background-size: cover;
    position: absolute
}

.usrcat a:hover:after {
    transform: translate(0, -50%) translateX(-5px)
}

.foot a {
    background: #7a859a;
    color: #f7f6fb;
    font-family: IRANSansX;
    border-radius: 100px;
    padding: 10px 50px;
    position: absolute;
    left: 15px;
    top: 0;
    transition: .3s all ease;
    overflow: hidden
}
.songred{
    background: #9a7a7a;
    color: #f7f6fb;
    font-family: IRANSansX;
    border-radius: 100px;
    padding: 10px 50px;
    position: absolute;
    left: 15px;
    top: 0;
    transition: .3s all ease;
    overflow: hidden

}

.foot a:hover {
    background: #617be3;
    color: #fff
}

.comment-respond,
.post {
    font-family: IRANSansX;
    background: #fff;
    padding: 20px 15px 20px;
    border-radius: 14px;
    margin-bottom: 15px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden
}

.morelink {
    display: flex;
    align-items: center;
    justify-content: space-around
}
.morelink2 {
    display: flex;
    align-items: center;
    justify-content:left;
}


.footmeta {
    color: #666
}

.footmeta div {
    float: left;
    margin-left: 15px;
    padding: 0 25px 0 10px
}

.footmeta .post_author {
    background: url(images/sprite.png) no-repeat right -1005px
}

.footmeta .post_comment {
    background: url(images/sprite.png) no-repeat right -965px
}

.footmeta .post_date {
    background: url(images/sprite.png) no-repeat right -1047px
}

#breadcrumbs {
    color: rgb(255, 255, 255);
    padding: 10px 35px 10px 10px;
    margin-top: 10px;
    background: #617be3;
    border-radius: 14px;
    margin-bottom: 15px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden
}

#breadcrumbs a {
    color: rgb(255, 255, 255);
     margin: 0 5px;
    padding: 0 5px
}

#breadcrumbs a:hover {
    border-bottom: 1px dashed rgba(255, 255, 255, .8);
    color: rgb(255, 174, 0)
}

.post-content {
    padding: 15px
}
.postds{

text-align: center;
line-height: 2.2;
color: #444;
}
.postdeta p{
    
text-align: justify;
line-height: 2.2;
color: #444;

}

.post div img,
.post img {
    max-width: 100%;
    height: auto;
    margin: 1em auto;
    border-radius: 12px;
    display: inherit;
}
.morelink a {
    background: #5a8cef;
    color: #fff;
    text-align: center;
    padding: 8px 15px;
    border-radius: 30px
}

.morelink2 a {
    background: #5a8cef;
    color: #fff;
    text-align: center;
    padding: 8px 15px;
    border-radius: 30px
}

.morelink a:hover {
    color: #fff !important
}

.post-big {
    background: #333;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
    margin: 20px 0;
    height: 355px;
    position: relative;
    border-radius: 5px;
    overflow: hidden
}

.post-big .categorylist {
    position: absolute;
    top: 20px;
    left: 20px
}

.post-big img {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: .8
}

.post-big .desc {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    padding: 15px;
    color: rgba(255, 255, 255, .75);
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 1)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 100%)
}

.post-big .desc a {
    color: rgba(255, 255, 255, .9)
}

.post-big .desc a:hover {
    color: #fff !important
}

.post .postimg a:hover {
    background: #4a75cc
}

.post .postimg {
    width: 19%;
    float: right
}

.post .postimg img {
    width: 135px;
    height: 135px;
    border-radius: 5px
}

.main-content3 .post .postimg img {
    max-width:100% !important;
    max-height:100% !important
}

.post .postdesc {
    float: left;
    width: 78%;
    font-size: 14px;
    text-align: justify
}

.post .postdesc h1 {
    float: right
}

.post .postdesc h1 a {
    color: #111;
    font-size: 15px
}

.android-version {
    color: #999;
    float: right;
    display: block;
    padding: 5px 30px 5px 15px;
    margin: 0 15px 0 0;
    background: url(images/sprite.png) no-repeat right -83px
}

.updated {
    float: left;
    display: block;
    padding: 5px 30px 5px 15px;
    color: #fff;
    border-radius: 50px;
    font-size: 11px;
    background: url(images/sprite.png) no-repeat right -128px #1ed75f
}

.postmeta {
    padding: 5px 0 10px;
    font-size: 12px;
    color: #999;
    margin: 0 0 15px;
    border-bottom: 1px solid #eee;
    display: flex
}
.postmeta p{
    padding: 1em 1.5em;
text-align: center;
line-height: 2.2;
color: #444;
}

.postcategory {
    padding: 5px 0 5px 20px;
    display: flex;
    align-items: center
}

.postcategory i {
    margin-left: 5px
}

.postview {
    padding: 5px 20px 5px 0
}

.postinfopro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px
}

.simple-widget-header {
    position: relative;
    padding: 0 0 10px 0
}

.simple-widget-header h3 {
    font-size: 115%;
    margin: 0 0 10px
}

.simple-widget-header span {
    color: #aaa;
    font-size: 90%
}

.simplenav a {
    padding: 5px 15px;
    display: block;
    margin-left: 15px;
    float: right;
    color: #999;
    border-radius: 99px
}

.simplenav .active,
.simplenav a:hover {
    background: #999;
    color: #fff !important;
    box-shadow: 0 7px 10px rgba(0, 0, 0, .1)
}

#color-red-body .simplenav .active,
#color-red-body .simplenav a:hover {
    background: #f67182 !important
}

#color-green-body .simplenav .active,
#color-green-body .simplenav a:hover {
    background: #4caf50 !important
}

.player {
    background: RGBA(0, 0, 0, .1);
    display: block;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    margin: 0 0 1em
}

.social h3 {
    background: RGBA(0, 0, 0, .1);
    display: block;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    margin: 0 0 .5em;
    font-size: 13px;
    font-weight: 400;
    width: 100%
}

.social.scils a {
    margin: 10px 5px;
    background-color: #aaa
}

.social .tlg {
    background-position: -63px -45px
}

.social a {
    width: 30px;
    height: 30px;
    text-indent: 200%;
    overflow: hidden;
    margin: 5px;
    border-radius: 12px;
    background-color: #1b262c;
    display: flex
}

.parsdlll {
    width: 70%;
    margin: 0 auto
}

.parsdlll a {
    display: flex;
    background: #f55151;
    color: #fff;
    align-items: center;
    padding: .5em 1em;
    border-radius: 50px;
    font-size: 15px;
    margin: 1em 0;
    justify-content: center;
    flex-wrap: wrap;
    height: 10%
}

.parsdlll a:hover {
    background: #333;
    color: #fff
}

.parsdlll .wdemo {
    color: #fff;
    background: #f55151
}

.parsdlll a::before {
    content: "";
    width: 24px;
    height: 22px;
    background: url(./images/dl.png);
    border-radius: 8px;
    margin-left: .5em
}

.wtws {
    display: flex;
    margin-bottom: 1em
}

.parsdlll .mwinsta,
.parsdlll .mwtlg {
    background: #61b1e3;
    color: #fff;
    padding: .8em 1em;
    width: 50%;
    margin: 0
}

.parsdlll .mwtlg {
    border-radius: 0 50px 50px 0
}

.parssmusics {
    background: #fff;
    border-radius: 14px;
    padding: 10px;
    margin-bottom: 20px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%)
}

.parssmusics .wflx {
    color: RGBA(0, 0, 0, .7);
    padding: 10px 30px 10px;
    border-bottom: 1px solid rgba(97, 123, 227, .1);
    position: relative;
    font-size: 14px
}

.parssmusics .wflx strong {
    color: #617be3;
    margin: 0 4px
}

.parssmusics .wflx span {
    display: flex;
    align-items: center;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 6px;
    justify-content: center;
    top: 6px;
    z-index: 10;
    font-weight: 700;
    color: #fff
}

.parssmusics .mwph4::before {
    background-position: -293px -28px
}

.parsspst {
    padding: 0 0 .7em;
    display: flex;
    flex-wrap: wrap
}

.parsspst li {
    width: 25%;
    padding: 4px
}

.commentss .title {
    color: #4a4a4a;
    font-size: 16px;
    margin: 0;
    position: relative
}

.commentss .inp {
    display: flex;
    justify-content: space-between
}

.commentss input,
.commentss textarea {
    background-color: #f0f1f3 !important;
    padding: 8px 5px !important;
    width: 100% !important;
    display: flex;
    align-items: center;
    border: none !important;
    transition: .3s;
    border-radius: 10px
}

.commentss .icon.email,
.commentss .icon.u_name {
    width: 49%
}

.commentss input:focus,
.commentss textarea:focus {
    border: 1px solid #6ca0f4;
    background: #fff;
    box-shadow: 0 0 15px rgba(108, 160, 244, .13)
}

.commentss input::placeholder,
.commentss textarea::placeholder {
    color: #9a9a9a;
    font-size: 12px;
    font-family: IRANSansX
}

.commentss textarea {
    font-family: IRANSansX;
    width: 100% !important;
    height: 150px !important;
    margin: 10px 0 !important
}

.commentss form .btn {
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between
}

.commentss form .btn span {
    color: #fff;
    font-size: 12px;
    padding-top: 10px
}

.commentss form .btn button {
    background: #b3baf8 !important;
    border: none !important;
    color: #fff;
    padding: 7px 31px;
    font-family: IRANSansX;
    font-size: 15px;
    border-radius: 10px;
    transition: .3s all ease;
    cursor: pointer
}

.commentss form .btn button:hover {
    opacity: .8
}

.answer li {
    flex-direction: column;
    background: rgba(97, 123, 227, .1);
    color: RGBA(0, 0, 0, .7);
    margin-bottom: 1em;
    border-radius: 8px;
    overflow: hidden
}

.comment_replay {
    background: #617be3;
    padding: 0 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px
}

.parstag {
    background: #fff;
    border-radius: 14px;
    padding: 5px;
    margin-bottom: 20px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%)
}

.parstag a {
    color: #617be3;
    margin: 5px;
    font-size: 12px;
    display: inline-block;
    background: #617be30f;
    padding: 2px 10px;
    border-radius: 10px;
}

.answer .chdr {
    justify-content: space-between;
    width: 100%;
    padding: .5em;
    background: rgba(97, 123, 227, .1);
    display: flex;
    border-radius: 5px
}

.answer .chdr strong {
    color: RGBA(0, 0, 0, .7);
    display: flex;
    align-items: center
}

.answer .chdr strong b {
    color: #fff;
    background: #2196f3;
    font-weight: 400;
    padding: 0 5px;
    border-radius: 5px;
    margin: 0 5px;
    font-size: 12px
}

.answer .chdr span {
    color: RGBA(0, 0, 0, .25);
    font-size: 12px
}

.answer li p {
    padding: 1em .5em .5em;
    color: RGBA(0, 0, 0, .5)
}

.answer ul {
    margin-right: 1em
}

#comments {
    list-style: none;
    background: #fff !important;
    border-radius: 4px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .09);
    margin: 0 0 20px !important;
    padding: 5px 20px
}

.commentss {
    background: #617be3;
    border-radius: 14px;
    padding: 10px;
    margin-bottom: 20px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%)
}

.parsspst li a {
    display: block;
    border-radius: 8px;
    background: rgba(97, 123, 227, .1);
    padding: 4.55px
}

.parsss {
    background: #fff;
    border-radius: 14px;
    padding: 10px;
    margin-bottom: 20px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%)
}

.parsspst li img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px
}

.parsspst li a span {
    font-size: 12px;
    color: RGBA(0, 0, 0, .6);
    text-align: center;
    display: block;
    padding: 4px 0 1px
}

.parsspst li:hover span {
    color: #fff
}

.parsspst li:hover a {
    background: #a0a5bd;
    border-color: #fff
}

.parsspst li:hover img {
    filter: grayscale(70%)
}

.mwftr {
    background: #333;
    padding: 1em 1.5em;
    font-size: 14px;
    color: #fff;
    justify-content: space-between;
    margin-top: -35px;
    border-radius: 0 0 40px 40px;
    padding-top: 50px;
    margin-bottom: 1em
}

.mwftr ul {
    background: #202020;
    padding: 1em;
    border-radius: 50px
}

.mwftr li a {
    color: #fff;
    font-size: 15px;
    padding: 5px 15px;
    border-radius: 50px
}

.mwftr li a:hover {
    background: #fbf01e;
    color: #000
}

audio,
video {
    width: 100%
}

.wmp3dl .mwinsta {
    background: #d734be;
    border-radius: 50px 0 0 50px
}

.wmp3dl .mwinsta:before,
.wmp3dl .mwtlg:before {
    display: none
}

.wmp3dl a span {
    font-size: 12px;
    background: rgba(0, 0, 0, .2);
    padding: 2px 7px;
    margin: 5px;
    border-radius: 6px;
    color: rgba(255, 255, 255, .9)
}

.mwpsng {
    padding: 0 0 .5em;
    color: RGBA(0, 0, 0, .6);
    display: block;
    text-align: center;
    margin: 0 0 1em;
    border-bottom: 1px solid rgba(97, 123, 227, .1)
}

.boxdownload a,
.singers a {
    background: #1b262c;
    color: #fff;
    display: flex;
    margin: .7em 0 1em;
    font-size: 16px;
    padding: .5em 1em;
    text-align: center;
    border-radius: 100px;
    border-bottom: 2px solid RGBA(0, 0, 0, .2);
    justify-content: center;
    align-items: center;
    flex-wrap: wrap
}

.wscial {
    flex-wrap: nowrap;
    width: 70%;
    margin: 0 auto 1em;
    justify-content: space-between
}

.wflx {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

.wscial a {
    color: #617be3;
    display: inline-flex;
    align-items: center;
    border: 1px solid #617be3;
    padding: 6px 12px;
    border-radius: 50px;
    font-size: 14px;
    width: 48.5%;
    justify-content: center
}

.wscial a i {
    margin-left: 5px
}

#color-blue-body .simplenav .active,
#color-blue-body .simplenav a:hover {
    background: #617be3;
    color: #fff
}

#color-blue-body .searchbox .buttonsearch {
    background: #617be3;
    color: #fff
}

.simplenav2 {
    border: 1px solid #dfe6e6;
    box-shadow: 0 4px 10px #edefef;
    border-radius: 4px;
    float: right
}

.simplenav2 a {
    padding: 6px 12px;
    display: block;
    float: right;
    color: #999
}

.simplenav2 .active,
.simplenav2 a:hover {
    background: #f6f6f7;
    color: #111
}

.simplenav3 {
    display: flex;
    justify-content: space-around;
    align-items: center
}

.simplenav3 a {
    border: none;
    color: #8a8a8a;
    background: #eef1fc;
    border-radius: 20px;
    padding: 2px 0;
    margin: 4px;
    width: 55px;
    text-align: center;
    transition: .3s all ease
}

.simplenav3 a:nth-child(2) {
    border-right: 0;
    border-left: 0
}

.conttopsd {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 180px
}

.conttopsd img {
    max-width: 100%;
    border-radius: 10px;
    object-fit: cover;
    position: relative;
    max-height: 100%
}

.conttopsd:hover .overl {
    opacity: 1
}

.overl {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 4px;
    opacity: 0;
    transition: .5s;
    background: linear-gradient(to right, rgba(44, 42, 42, .897) 0, rgba(8, 8, 8, .637) 100%)
}

.titnam {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    display: flex;
    justify-content: center;
    color: #fff;
    padding: 10px;
    text-align: center;
    font-size: 12px
}

.tasnam {
    position: absolute;
    top: 93%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 10px;
    text-align: center;
    padding: 10px;
    border-radius: 10px 10px 0 0;
    background: #fbab0bf0
}

.topssadf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px
}

.simplenav3 a.active,
.simplenav3 a:hover {
    background: #617be3;
    color: #fff
}

.list-picture li:hover a {
    color: #617be3
}

.list-picture li img {
    right: 10px;
    top: 10px;
    width: 60px;
    height: 60px;
    border-radius: 4px;
    position: absolute
}

.list-picture li .lp-desc {
    position: relative;
    padding: 5px 15px 5px 10px;
    transition: all .3s ease-out
}

.list-picture li .lp-desc::before {
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%) rotate(45deg);
    right: 0;
    border: 1px solid #ccc;
    border-radius: 50px 50px 50px 0
}

.list-picture li .lp-desc span {
    display: block;
    color: #aaa;
    font-size: 90%
}

.telegram-bar {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 100%;
    padding: 12px;
    background: #1a90cc;
    z-index: 99999;
    text-align: center
}

.telegram-bar a {
    color: #fff
}

.telegram-bar a span {
    color: #fff;
    background: rgba(0, 0, 0, .1);
    padding: 5px 10px;
    border-radius: 10px;
    margin-right: 15px
}

.req-android {
    margin: 0 0 15px;
    background: url(images/sprite.png) right -270px;
    padding: 20px 100px 20px 20px;
    border-radius: 5px;
    overflow: hidden
}

.req-android a span {
    background: rgba(0, 0, 0, .15);
    color: #fff;
    padding: 2px 10px;
    border-radius: 15px;
    font-size: 80%;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .1)
}

#show_help {
    display: none
}

.req-android h4 {
    color: #fff;
    padding: 0 0 5px;
    font-size: 100%
}

.two-row-tab {
    padding: 10px 0 15px
}

.two-row-tab a {
    float: right;
    width: 31%;
    display: block;
    text-align: center;
    padding: 20px 0 17px;
    background: #f9f9fe;
    border-bottom: 2px solid #fff
}

.two-row-tab a:hover {
    border-bottom: 2px solid #ccc
}

.two-row-tab .active {
    border-bottom: 2px solid #f44336;
    color: #000;
    background: #fff;
    box-shadow: 0 3px 10px #e1e1e2
}

.two-row-tab a:nth-child(2) {
    margin: 0 3.5%
}

.game-ico,
.software-ico {
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 auto 10px
}

.game-ico {
    background: url(images/sprite.png) right -88px
}

.software-ico {
    background: url(images/sprite.png) right -380px
}

.mainfooter {
    background: #333;
    padding: 40px 0 15px;
    color: rgba(255, 255, 255, .7)
}

.rowss {
    display: flex;
    flex-wrap: wrap
}

.mainfooter .simplelist li a {
    color: rgba(255, 255, 255, .75) !important
}

.mainfooter a.tag-cloud-link {
    color: rgba(255, 255, 255, .7);
    padding: 5px 10px;
    display: inline-block;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 50px;
    font-size: 14px
}

.mainfooter h3 {
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 15px
}

.mainfooter .footer-box {
    float: right;
    width: 31.5%
}

.mainfooter .footer-box:nth-child(2) {
    margin: 0 2.5%
}

.foot-game-ico {
    width: 30px;
    height: 30px;
    background: url(images/sprite.png) no-repeat right -430px #1091d3;
    border-radius: 99px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
    display: block;
    float: right;
    margin: 0 0 0 15px
}

.foot-soft-ico {
    width: 30px;
    height: 30px;
    background: url(images/sprite.png) no-repeat -740px -430px #1091d3;
    border-radius: 99px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
    display: block;
    float: right;
    margin: 0 0 0 10px
}

.goarchive {
    color: rgba(255, 255, 255, .5) !important;
    font-size: 11px;
    float: right;
    border-radius: 30px;
    background: rgba(0, 0, 0, .25);
    margin: 0 15px;
    padding: 3px 15px;
    display: block
}

.goarchive:hover {
    color: #333 !important;
    background: #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
}

.footerlist caption {
    color: #fff !important
}

.footerlist tbody {
    background: #fff
}

.footerlist li {
    padding: 8px 5px
}

.likeBox {
    float: left
}

.likeBox button {
    font-size: 15px;
    background: 0 0;
    border: none;
    padding: 0 7px;
    direction: ltr
}

.likeBox button.fm-like-it {
    color: #29d08b
}

.likeBox button.fm-dislike-it {
    color: #ff7347
}

.likeBox button span {
    margin-left: 4px;
    vertical-align: text-top
}

.-post-likes .likeBox {
    display: block;
    height: 38px
}

.-post-likes .likeBox button {
    height: 100%;
    background: #444 !important;
    color: #eee !important;
    font-size: 13px;
    padding: 0 10px;
    margin-top: 0 !important;
    transition: all .23s
}

.-post-likes .likeBox button:focus,
.-post-likes .likeBox button:hover {
    background: #343434 !important
}

.footerlist li span {
    font-size: 11px;
    color: rgba(255, 255, 255, .4)
}

.footerlist li a {
    color: rgba(255, 255, 255, .8)
}

.footerlist li img {
    width: 100%;
    border-radius: 4px;
    height: 80px
}

.copyright {
    padding: 17px 10px 20px 0;
    margin-top: 15px;
    color: rgba(255, 255, 255, .5);
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    background: rgba(0, 0, 0, .1)
}

.artwork {
    background: #0277bd;
    display: flex;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    margin-left: 10px;
    overflow: hidden
}

.artwork::before {
    content: '</>';
    display: flex;
    color: #fff;
    justify-content: center;
    align-items: center;
    width: 30px;
    position: absolute;
    height: 30px
}

.wpcontent {
    font-size: 14px;
    padding: 1em;
    line-height: 1.8;
    color: #555;
    text-align: center
}

.toolbar {
    background: url(images/sprite.png) right -590px #3b3b49;
    padding: 15px 65px 15px 10px;
    border-radius: 5px;
    color: #fff;
    border: 1px solid rgba(0, 0, 0, .15);
    display: block;
    margin: 15px 0 0
}

.toolbar p {
    font-size: 110%;
    padding: 0 0 5px;
    color: #fff !important
}

.toolbar span {
    color: rgba(255, 255, 255, .6) !important;
    background: rgba(255, 255, 255, .1);
    padding: 5px 15px;
    font-size: 10px;
    border-radius: 99px
}

@media screen and (max-width:1200px) {
    .container {
        width: 97%
    }
}

@media screen and (min-width:980px) {
   
    .menu-button,
    .navbar-nav {
        display: none
    }



    .fixed {
        position: fixed !important;
        top: 0;
        width: 100%;
        right: 0;
        z-index: 99999;
        box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
        background: rgba(53, 53, 53, .98) !important
    }

    .getabs {
        width: 100%;
        position: absolute
    }
}

@media screen and (max-width:980px) {
    .menu-button {
        display: block;
        float: left;
        padding: 10px;
        margin-top: 4px;
        cursor: pointer
    }

    .rightsidebar,
    .searchform {
        display: none
    }

    .main-content2,
    .main-content3 {
        width: 100%;
        float: none
    }

    .sidebar,
    .sidebar3 {
        float: none;
        width: 100% !important
    }

    .navbar-nav {
        position: fixed;
        top: 0;
        right: -900px;
        -webkit-transition: .3s;
        transition: .3s;
        background: #fff;
        width: 80%;
        display: block;
        box-shadow: 0 0 5px rgba(0, 0, 0, .1);
        z-index: 999;
        height: 100%
    }

    .navbar-nav .searchbox .searchtext {
        background: #f6f8f9;
        width: 82%
    }

    .navbar-nav ul li a {
        display: block;
        padding: 7px 10px;
        border-bottom: 1px solid #f4f4f4
    }

    .navbar-nav .searchbox {
        width: 80%;
        margin: 10px auto;
        float: none;
        display: block !important;
        background: #f9f9f9
    }

    .toppost {
        padding: 20px 0 0
    }

    #mask {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 990;
        display: none;
        background: rgba(0, 0, 0, .5)
    }

    .bar {
        position: relative;
        display: block;
        width: 40px;
        height: 4px;
        margin: 8px auto;
        background-color: #fff;
        border-radius: 10px;
        -webkit-transition: .3s;
        transition: .3s
    }

    .menu-button:hover .bar:nth-of-type(1) {
        -webkit-transform: translateY(1.5px) rotate(-4.5deg);
        -ms-transform: translateY(1.5px) rotate(-4.5deg);
        transform: translateY(1.5px) rotate(-4.5deg)
    }

    .menu-button:hover .bar:nth-of-type(2) {
        opacity: .9
    }

    .menu-button:hover .bar:nth-of-type(3) {
        -webkit-transform: translateY(-1.5px) rotate(4.5deg);
        -ms-transform: translateY(-1.5px) rotate(4.5deg);
        transform: translateY(-1.5px) rotate(4.5deg)
    }

    .navbar-nav .logo {
        width: 100%;
        float: none;
        background: url(images/logo.png) no-repeat;
        height: 54px;
        margin: 0
    }

    .req-android {
        width: 400px;
        margin: 0 auto
    }

    .toppost ul li {
        width: 15.9%
    }


    .container {
        width: 97%
    }

    .main-content,
    .top-article {
        width: 100%;
        float: none
    }

 

    .sidebar {
        width: 100%;
        float: none;
        margin: 0
    }

    .towmobile {
        width: 49%;
        float: right
    }

    .towmobile2 {
        width: 49%;
        float: left
    }

    .mainfooter .footer-box {
        width: 49%;
        float: right
    }

    .mainfooter .footer-box:nth-child(2) {
        margin: 0
    }

    .mainfooter .footer-box:nth-child(3) {
        clear: both;
        width: 100%;
        float: none;
        margin: 20px 0 0
    }

    .mainheader .searchbox {
        margin: 5px;
width: 100%;
    }
}

@media screen and (max-width:768px) {
    .post .postimg img {
        width: 100%;
        height: auto
    }
    .navghk{
        flex-direction: column;
    }
    .maincat{
        width: 100%;
    }
    .mainfooter .footer-box,
    .towmobile,
    .towmobile2 {
        width: 100%;
        float: none;
        margin: 0
    }

    .toppost ul li {
        width: 15.9%
    }

    .main-content2 .top5thumb li img {
        width: 100%;
        height: auto
    }
}

@media screen and (max-width:800px) {
    .ptviph li {
        width: 25% !important
    }
}

@media screen and (max-width:500px) {
    .ptviph li {
        width: 50% !important
    }

    .foot .icons {
        display: none
    }

    .parsdlll {
        width: 100% !important
    }

    .wscial a {
        width: 100% !important;
        margin-bottom: 10px
    }

    .parsspst li {
        width: 50% !important
    }
    .maincat ul{
        display: block;
    }
    .maincat ul li{
        display: flex;
        justify-content: center;
        background: #536cd0;
        margin: 5px;
        border-radius: 15px;
    }
    .foot a {
        display: flex;
        justify-content: center;
        width: 100%;
        left: 0
    }
    .notif{
        position: relative;
float: none;
margin: 5px;
    }
    .main-content2 .top5thumb li {
        width: 48.5%
    }

    .post .postimg img {
        width: 100%;
        height: auto
    }

    .post .postdesc,
    .post .postimg {
        width: 100%;
        float: none;
        padding-bottom: 20px
    }

    .post .postimg img {
        width: 200px;
        height: 200px;
        display: block;
        margin: 0 auto;
        border-radius: 5px
    }

    .req-android {
        width: 100%
    }
}

.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 1
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden
}

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0)
}

.owl-carousel .owl-item,
.owl-carousel .owl-wrapper {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0)
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

.owl-carousel .owl-item img {
    display: block;
    margin: 0 auto;
    border-radius: 4px
}

.swiper-slide {
    color: #000;
    border-radius: 12px;
    position: relative;
    background: #e8e8e8;
    padding: 1px;
    display: -ms-flexbox;
    display: box;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0
}

.swiper-slide img {
    max-width: 100%
}

.arted {
    background: linear-gradient(54deg, #3498db 0, #e8e8e8 20%, #e8e8e8 75%, #5499c7 100%)
}

.iners {
    background-color: #fff;
    border-radius: 12px;
    padding: 29px 20px 21px;
    display: -ms-flexbox;
    display: box;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
    display: none
}

.owl-carousel .owl-nav .owl-next {
    right: 0
}

.owl-carousel .owl-nav .owl-prev {
    left: 0
}

.owl-carousel .owl-dot,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev {
    cursor: pointer;
    cursor: hand;
    position: absolute;
    top: 40%;
    background: #fff3;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    margin: 0 10px;
    text-align: center;
    padding-top: 4px
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot {
    background: 0 0;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit
}

.owl-carousel.owl-loaded {
    display: block
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block
}

.owl-carousel.owl-hidden {
    opacity: 0
}

.owl-carousel.owl-refresh .owl-item {
    visibility: hidden
}

.owl-carousel.owl-drag .owl-item {
    -ms-touch-action: none;
    touch-action: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.mode-switch {
    display: inline-block;
    position: relative;
    height: 26px;
    width: 65px;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
    border: 1px solid rgba(0, 0, 0, .1);
    cursor: pointer;
    float: left;
    margin-left: 6px
}

.mode-switch .current-mode {
    position: absolute;
    left: 0;
    top: 0;
    margin: 2px;
    width: 20px;
    height: 20px;
    background: #0277bd;
    border-radius: 50px;
    transition: .3s ease-in-out;
    color: #fff
}

.mode-switch .current-mode:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 16px
}

.mode-switch.active .current-mode {
    left: calc(100% - 8px);
    transform: translateX(-100%);
    background: #fff;
    color: #0277bd
}

.mode-switch.active .current-mode:before {
    content: ""
}

.mode-switch.active {
    border-color: rgba(255, 255, 255, 1)
}

.owl-carousel.owl-grab {
    cursor: move;
    cursor: grab
}

.owl-carousel.owl-rtl {
    direction: rtl
}

.owl-carousel.owl-rtl .owl-item {
    float: right
}

.no-js .owl-carousel {
    display: block
}

.owl-carousel .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.owl-carousel .owl-animated-in {
    z-index: 0
}

.owl-carousel .owl-animated-out {
    z-index: 1
}

.owl-carousel .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.owl-height {
    transition: height .5s ease-in-out
}

.owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    transition: opacity .4s ease
}

.owl-carousel .owl-item img.owl-lazy {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.owl-carousel .owl-video-wrapper {
    position: relative;
    height: 100%;
    background: #000
}

.owl-carousel .owl-video-play-icon {
    position: absolute;
    height: 80px;
    width: 80px;
    left: 50%;
    top: 50%;
    margin-left: -40px;
    margin-top: -40px;
    background: url(owl.video.play.png) no-repeat;
    cursor: pointer;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    transition: -webkit-transform .1s ease;
    transition: transform .1s ease
}

.owl-carousel .owl-video-play-icon:hover {
    -webkit-transform: scale(1.3, 1.3);
    -ms-transform: scale(1.3, 1.3);
    transform: scale(1.3, 1.3)
}

.owl-carousel .owl-video-playing .owl-video-play-icon,
.owl-carousel .owl-video-playing .owl-video-tn {
    display: none
}

.owl-carousel .owl-video-tn {
    opacity: 0;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: opacity .4s ease
}

.owl-carousel .owl-video-frame {
    position: relative;
    z-index: 1;
    height: 100%;
    width: 100%
}

h2.archive-title {
    padding: 10px;
    margin: 10px 0;
    background: #fff
}

.downloadbox {
    margin: 15px 0 0
}

.information-post {
    padding: 15px;
    margin: 15px 0;
    background: #d1e4e8;
    border-bottom: 2px solid #adc5ca;
    border-radius: 4px;
    color: #8f929e
}

.information-post h4 {
    font-size: 15px;
    color: #47666d
}

.main-content2 .downloadbox .rightdl {
    display: none
}

.main-content3 .downloadbox .leftdl,
.main-content3 .downloadbox .rightdl {
    width: 100%;
    float: none
}

.downloadbox .postthumb {
    width: 100%;
    height: 220px;
    position: relative
}

.downloadbox h3 {
    text-align: justify;
    padding: 10px
}

.downloadbox .postthumb img {
    display: block;
    margin: 0 auto;
    width: 150px;
    height: 150px;
    border-radius: 5px
}

.main-content2 .downloadbox .leftdl {
    width: 100% float: none;
    padding: 0
}

.leftdl .social {
    margin-top: 0;
    padding: 5px;
    opacity: .4;
    filter: grayscale(100%);
    border-radius: 4px
}

.leftdl .social a {
    opacity: 1
}

.col30 {
    width: 28%;
    padding: 15px 0 10px 2%;
    float: right
}

.col50 {
    width: 48%;
    padding: 15px 0 10px 2%;
    float: right
}

.col70 {
    width: 68%;
    padding: 15px 0 10px 2%;
    float: right
}

.col50 h4 {
    font-size: 13px;
    color: #999
}

.col50 p {
    font-size: 14px
}

.downloadlinks {
    padding: 15px 15px 1px 15px;
    background: #efefef;
    border-radius: 4px;
    color: #353535
}

.downloadlinks h2 {
    padding-bottom: 25px;
    font-size: 15px
}

.simplelink {
    padding: 15px 0 5px
}

.simplelink a {
    padding: 10px 10px;
    border-radius: 3px;
    display: inline-block;
    width: 32.5%;
    text-align: center;
    margin: 0 0 10px
}

.simplelink a:nth-child(1) {
    border: 1px solid #f38270;
    color: #f38270
}

.simplelink a:nth-child(2) {
    border: 1px solid #1086c1;
    color: #1086c1
}

.simplelink a:nth-child(3) {
    border: 1px solid #1ed75f;
    color: #1ed75f
}

.expsingle {
    border-right: 3px solid #eee;
    margin: 10px 0;
    padding: 10px;
    color: #999
}

.downloadlink a,
.downloadlink a:hover {
    background: url(images/sprite.png) no-repeat right -752px #4caf50;
    padding: 10px 50px 10px 15px;
    color: #fff !important;
    border-radius: 4px;
    display: block;
    margin: 0 10% 20px
}

.bg-custom {
    padding: 5px 0 20px;
    font-family: IRANSansX;
    background: #fff;
    padding: 20px 15px 20px;
    border-radius: 14px;
    margin-bottom: 15px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%);
    overflow: hidden
}

.page-numbers {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    padding: 0;
    text-align: center;
    line-height: 30px;
    display: inline-block;
    font-size: 14px;
    margin-right: 5px;
    background: #fbfbfb;
    color: #767676;
    border-radius: 12px
}

.page-numbers.current {
    cursor: default;
    color: #fff !important;
    border-color: #ff0c5a !important;
    background: #617be3 !important
}

.page-numbers i {
    font-size: 12px;
    color: #777
}

.page-numbers.dots {
    cursor: default
}

.page-numbers:hover {
    color: #617be3;
    box-shadow: 0 1px 12px rgba(72, 98, 247, .267)
}

.artistsList {
    display: flex;
    flex-flow: wrap;
    justify-content: center
}

.artistsList .artist-post {
    background: #fff;
    margin: 0 7px 12px;
    border-radius: 10px;
    padding: 10px 5px 20px;
    box-shadow: 0 0 16px rgba(0, 0, 0, .07058823529411765);
    color: #000;
    transition: .3s
}

.artistsList .artist-post:hover {
    transform: translateY(-4px)
}

.artistsList .artist-post .cover {
    width: 125px;
    height: 125px;
    overflow: hidden;
    border-radius: 100%;
    border: 2px solid #617be3;
    margin: 14px auto
}

.artistsList .artist-post .cover img {
    width: 100%
}

.artistsList .artist-post .info {
    text-align: center
}

.artistsList .artist-post .info h2 {
    font-size: 14px;
    font-weight: 700
}

.navigation li a:hover,
.navigation li.active a {
    background: #617be3;
    color: #fff
}

.clearfix:after {
    content: "";
    clear: both;
    display: block
}

.dl-link {
    margin-bottom: 30px
}

.wpcf7 input[type=email],
.wpcf7 input[type=text] {
    border-radius: 5px;
    border: solid 1px #d6d7d8;
    height: 40px;
    width: 100%
}

.wpcf7 textarea {
    border-radius: 5px;
    width: 100%;
    border: solid 1px #d6d7d8
}

.wpcf7 input[type=button],
.wpcf7 input[type=submit] {
    font-family: IRANSansX;
    width: 100%;
    height: 35px;
    background-color: #4cb054;
    color: #fff;
    border-radius: 5px;
    border: solid 1px #4cb054
}

.irhead .rw.flx {
    justify-content: space-between
}

.ptviph {
    margin-top: 1.5em;
    margin-bottom: -1em
}

.ptviph.ptv404 h4 {
    background: #fff;
    margin: 0 0 1em;
    border-radius: 15px;
    border: 2px solid rgba(17, 45, 78, .3);
    overflow: hidden;
    box-shadow: 0 0 10px rgba(17, 45, 78, .1);
    padding: 1em;
    text-align: center;
    font-size: 14px
}

.ptviph.ptv404 h4 span {
    color: #0282cd
}

.ptviph ul {
    padding: 0 0 .7em;
    display: flex;
    flex-wrap: wrap
}

.ptviph li {
    width: 12.5%;
    padding: 5px;
    display: flex
}

.ptviph li a {
    display: block;
    background: #fff;
    padding: 10px;
    border-radius: 14px;
    box-shadow: 0 0 22px rgb(230 232 236 / 66%)
}

.ptviph li img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
    box-shadow: 0 0 10px rgba(2, 130, 205, .15);
    transition: all .3s ease-out
}

.ptviph li a span {
    font-size: 11px;
    color: RGBA(0, 0, 0, .4);
    text-align: center;
    display: block;
    overflow: hidden;
    margin: 7px 0 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: all .3s ease-out
}

.ptviph li a:hover span {
    color: #004280
}

.ptviph li .pvsngr {
    font-weight: 400;
    text-align: right;
    color: #617be3;
    font-size: 13px;
    padding: 3px 6px 0;
    transition: all .3s ease-out
}

.ptviph li .pvtrck {
    color: RGBA(0, 0, 0, .4);
    padding: 0 6px 3px;
    text-align: right;
    font-style: normal
}

.ptviph li a:hover .pvsngr {
    color: #000
}

.ptviph li:hover img {
    filter: grayscale(60%)
}

div.wp-caption{
max-width: 100%;
margin: auto;
}