:root {
    --color-primary: #1E5CFF;
    --color-primary2: #144cd8;
    --plyr-color-main: #ffffff;
    --color-dark: #374957;
    --color-dark2: #404040;
    --color-light: #F3F3F6;
    --color-light2: #e3e7f1;
    --color-light3: #c4c8d4;
    --color-bg: #FDFDFD;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-red: #DA353A;
    --color-green: #35da98;
    --color-yellow: #da8d35;
    --plyr-color-main: #1E5CFF;
}


@media (min-width: 1350px) {
    .container {
        width: 1300px;
        max-width: 1300px;
    }
}

body {
    font-size: 16px;
    margin: 0 auto;
    padding: 0;
    background: var(--color-white);
}

body {
    display: flex;
    flex-wrap: wrap;
    min-height: 100vh;
    flex-direction: column;
    margin: 0 auto;
    justify-content: space-between;
}

html,
body {
    overscroll-behavior-x: none;
}

.pagination{width:100%;list-style:none;box-sizing:border-box;text-align:center;}
.pagination li,.pagination li span{display:inline-block;margin: 0 1px;}
.pagination li a,.pagination li span{padding:3px 10px;background:#fff;color:#444;margin: 5px 0;
border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;}
.pagination li a:hover,.pagination .current{background: #3380d2;color: #fff;}
.pagination .current{padding:3px 10px;}

.navbar-toggler.collapsed {
    display: none;
}

.navbar-toggler {
    display: none;
}

.navbar-toggler .navbar-toggler-icon {
    width: 25px;
    height: 25px;
    position: relative;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    cursor: pointer;
}

.navbar-toggler .navbar-toggler-icon span {
    display: block;
    position: absolute;
    height: 3px;
    width: 25px !important;
    width: 100%;
    background: var(--color-black);
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.25s ease-in-out;
    -moz-transition: 0.25s ease-in-out;
    -o-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

.navbar-toggler .navbar-toggler-icon span:nth-child(1) {
    top: 12px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}


.navbar-toggler .navbar-toggler-icon span:nth-child(2) {
    top: 11px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.navbar-toggler.collapsed .navbar-toggler-icon span:nth-child(1) {
    top: 5px;
    transform: none;
}


.navbar-toggler.collapsed .navbar-toggler-icon span:nth-child(2) {
    top: 16px;
    transform: none;
}


.fullpage {
    width: 100vw;
    height: 100vh;
    display: flex;
    overflow: hidden;
    background: var(--color-bg);
}


.formpage {
    padding: 0 25px 5px;
    margin: 0 auto;
    text-align: center;
}

.formpage h1 {
    text-align: center;
    margin-bottom: 30px;
    font-size: 20px;
    font-weight: normal;
}

.formpage .form-group.whitebox input {
    border-radius: 0 !important;
    background: var(--color-white);
    border: 0;
    border-bottom: 1px solid var(--color-light2);
}

.formpage small {
    display: block;
    text-align: center;
    color: var(--color-gray2);
    margin-bottom: 25px;
}


.form-group {
    position: relative;
}


.formpage .btn-link>svg {
    margin: 0 7px;
    width: 20px;
    position: relative;
    top: 4px;
}

.form-group.group-flex {
    display: flex;
    direction: ltr;
    padding: 5px 0;
    margin: 0 auto;
    justify-content: center;
}

.form-group.group-flex>* {
    margin-left: 10px !important;
    font-weight: normal;
    text-align: center;
}

.form-group.group-flex.digits>* {
    font-size: 25px !important;
    line-height: 59px;
    height: 59px;
    width: 59px;
}

.form-group.group-flex> :nth-child(1) {
    margin-left: 0 !important;
}

.form-group.group-flex.dirtl {
    direction: rtl;
}

.form-group.group-flex.dirtl> :nth-child(1) {
    margin-left: 10px !important;
}

.form-group.group-flex.dirtl> :last-child {
    margin-left: 0 !important;
}



.listdeti {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    text-align: center;
    width: 100%;
}


.listdeti.listtiny {
    margin-top: 35px;
    color: var(--color-gray2);
}

.listdeti li {
    text-align: center;
    margin-bottom: 10px;
    font-size: 16px;
}


.listdeti.listtiny li svg {
    display: inline-block;
    position: relative;
    top: -2px;
    margin-left: 3px;
    width: 19px;
    height: 19px;
}

.listdeti li a {
    display: inline-block;
    color: var(--color-primary);
    margin: 0 15px;
    font-weight: bold;
}


.listdeti.listdeti li a {
    color: var(--color-primary);
}

.timerbox {
    color: var(--color-black);
    margin: 0 4px;
}

.timerbox b {
    margin: 0 0 0 6px;
    font-weight: normal;
}

.sendag {
    display: none !important;
}

.timerbox.hide {
    display: none !important;
}

.sendag.show {
    display: inline-block !important;
}

.btn-tiny {
    margin-right: 5px;
    border: 0;
    font-size: 13px !important;
    padding: 0 10px;
    height: auto;
    line-height: 26px;
    width: auto;
    min-height: 28px;
    background: transparent;
    color: var(--color-black);
}

.btn-tiny:hover, .btn-tiny:focus {
    border: 0;
    background: var(--color-light) !important;
    color: var(--color-black) !important;

}

.donesend {
    display: none;
    margin-top: 15px;
}

.donesend.show {
    display: block !important;
}

.step-error input {
    border-color: var(--color-red) !important;
    color: var(--color-red) !important;
}

.step-error .form_title>span {
    color: var(--color-red);
}


.backbtn {
    display: block;
    width: auto;
    overflow: hidden;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin: 8px 0;
}

.wizard-form {
    width: 100%;
    padding: 25px 50px;
}

.prevBtn {
    color: var(--color-black);
    cursor: pointer;
    display: block;
    float: right;
    padding: 0;
    margin: 0;
    font-family: "Bakh";
}

.prevBtn img {
    width: 20px;
    height: 20px;
    display: block;
    float: left;
    margin: 1px 5px 0 0;
}

/********** Sidebar CSS **************/
.loglogo {
    position: absolute;
    left: 0;
    top: 0;
    margin: 25px;
    max-width: 170px;
}

.swithlinks {
    list-style: none;
    margin: 20px 0;
    padding: 0;
    display: flex;
}

.swithlinks.fixlinks {
    position: fixed;
    top: 0;
    right: 0;
    margin: 44px;
    font-size: 19px;
}

.swithlinks li {
    margin: 0 5px;
    padding: 0 5px 0 10px;
    color: var(--color-black);
    width: auto;
    border-left: 2px solid var(--color-light2);
}

.swithlinks li:last-child {
    border-left: 0;
}

.swithlinks li a, .swithlinks li a:hover, .swithlinks li a:focus {
    color: var(--color-primary);
}


.swithlinks li a.blacklink, .swithlinks li a.blacklink:hover, .swithlinks li a.blacklink:focus {
    color: var(--color-black);
}

.artbar {
    width: 100%;
}

.artbar>img {
    object-fit: cover;
    display: block;
    width: 100%;
    height: 100vh;
    float: left;
    margin: 0;
}

.sidepage {
    padding: 0;
    width: 100%;
    min-width: 500px;
    color: var(--color-black);
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
}

.sidepage_inner {
    max-width: 450px;
    margin: 0 auto;
    padding: 0;
    align-items: center;
    align-content: center;
    display: flex;
    flex-wrap: wrap;
}


.donesend {
    font-size: 12px;
    color: var(--color-dark2);
}

.reglogo {
    display: block;
    margin: 0 auto 10px;
    height: 40px;
    width: auto;
}

.reglogo img {
    max-height: 100%;
}


.minititle {
    position: relative;
    overflow: hidden;
    text-align: center;
    color: var(--color-gray2);
    font-size: 13px;
    padding: 10px;
}

.minititle>span {
    background: var(--color-black);
    padding: 0 15px;
    position: relative;
    z-index: 9;
}

.minititle::before {
    content: "";
    height: 2px;
    width: 100%;
    background: var(--color-dark);
    position: absolute;
    right: 0;
    left: 0;
    top: 20px;
}

.stepwizard {
    display: none;
}

.form_title {
    position: relative;
}


.form_title>h3 {
    text-align: right;
    font-weight: bold;
    font-size: 30px;
    margin-bottom: 15px;
}



.form_title>span {
    display: block;
    text-align: right;
    color: var(--color-dark);
    font-size: 16px;
    margin: 0;
    padding: 0;
    line-height: 28px;
}

.wizard-form .form-group {
    margin: 10px auto;
}


.group-flex>h3 {
    font-size: 20px;
    margin: 15px 0;
    padding: 0;
}

.form-group.form-iconic>img {
    position: absolute;
    right: 0;
    top: 0;
    margin: 14px 15px;
    width: 24px;
    height: 24px;
}

.form-group.form-iconic input {
    padding-right: 50px;
}


.form-group>label {
    font-size: 14px;
    color: var(--color-dark);
    margin: 0;
    padding: 0;
    font-weight: normal;
}


.form-group.m0 {
    margin: 0;
    padding: 10px;
}


.form-group.flex-group {
    flex-wrap: nowrap;
    display: flex;
}


.form-group.flex-group>.form-group {
    width: 100%;
    margin: 0;
    padding: 5px;
}

.form-group.flex-group .btn {
    margin: 6px 0;
    margin-left: 15px;
}


.form-group.flex-group .btn:last-child {
    margin-left: 0;
}

.btn-alert.btn-danger, .btn-alert.btn-danger:focus, .btn-alert.btn-danger:hover {
    text-align: center;
    padding: 11px;
    border: 0;
    color: var(--color-red);
    background: var(--color-light);
    margin: 15px auto;
    overflow: hidden;
    width: 100%;
    box-shadow: none;
}



.btn-loader svg {
    -webkit-animation: rotate 2s linear infinite;
    animation: rotate 2s linear infinite;
    z-index: 2;
    position: absolute;
    width: 30px;
    height: 30px;
    display: none;
    left: 0;
    margin: 0 auto;
    right: 0;
    top: 11px;
}

.btn-loader.loading svg {
    display: block;
}

.btn-loader.loading {
    font-size: 0 !important;
}

.btn-loader svg .path {
    stroke: var(--color-white);
    stroke-linecap: round;
    -webkit-animation: dash 1.5s ease-in-out infinite;
    animation: dash 1.5s ease-in-out infinite;
}

@-webkit-keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}



/*header*/
.hd-fix {
    padding: 25px 0;
    z-index: 99;
}

.logo svg #logotext path {
    fill: var(--color-black);
}

.logo {
    width: 170px;
    min-width: 170px;
    padding:10px 15px 10px 10px;
}

.hd-row {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: stretch;
}

.hd-row a {
    direction: ltr;
    padding-left: 8px;
}

.topsearch {
    width: 100%;
    position: relative;
    margin: 0 25px;
}

.topsearch input[type="text"] {
    padding-right: 59px;
    padding-left: 50px;
    border-radius: 10px !important;
    font-size: 20px !important;
}

.topsearch button.sbtn, .topsearch button.sbtn:hover, .topsearch button.sbtn:focus {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    padding: 0 15px;
    margin: 4px;
    bottom: 0;
}

.topsearch button.sbtn svg {
    width: 19px;
    height: 19px;
    position: relative;
    top: 0;
}


.app_results {
    display: block;
    position: absolute;
    right: 0;
    left: 0;
    z-index: 99;
    background: var(--color-white);
    border-radius: 15px;
    border: 1px solid var(--color-light2);
    padding: 20px;
}


.app_results .errorbox {
    margin: 0;
    padding: 10px;
    max-width: 100%;
}

.app_results .errorbox .erroricon {
    width: 35px;
    height: 35px;
    margin: 0 0 10px;
}

.app_results .errorbox h1 {
    font-size: 23px;
    color: #C0C6D3;
}

.app_results .errorbox p {
    font-size: 14px;
    margin: 0;
    color: #C0C6D3;
}

.app_results .errorbox * {
    text-align: right;
}

.flex_suggest {
    padding: 15px;
    user-select: none;
    -webkit-user-select: none;
}

.flex_suggest * {
    user-select: none;
    -webkit-user-select: none;
}



.flex_suggest .title {
    margin: 0;
    padding: 15px 5px;
    font-size: 20px;
}

.flex_suggest .title h3 {
    font-size: 16px;
    color: var(--color-light3);
}

.hide {
    display: none !important;
}


.user_guest {
    align-content: center;
    align-items: center;
    display: flex;
    padding: 0;
    margin-left: 15px;
    min-width: 40px;
}


.noarrow:before {
    display: none;
}


.user_guest img {
    width: 24px;
    height: 24px;
    display: block;
}

.user_guest.face {
    margin: 10px 0;
}

.user_guest.noface img {
    background: var(--color-light);
    padding: 8px;
    box-sizing: content-box;
    border-radius: 50%;
}


.user_guest.face img {
    width: 45px;
    min-width: 45px;
    padding: 0;
    height: 45px;
    border-radius: 50%;
}

.btn.btn-secondary.user-btn {
    margin: 10px 5px;
    padding: 0;
    min-width: 110px;
    min-height: 40px;
    float: left;
    width: 150px;
    font-size: 15px !important;
    font-weight: bold;
    line-height: 45px;
    height: 45px;
}


.btn.btn-secondary.user-btn:hover, .btn.btn-secondary.user-btn:focus {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}

.sidebar__inner .btn.btn-secondary.user-btn:hover,
.sidebar__inner .btn.btn-secondary.user-btn:focus {
    background: var(--color-light2) !important;
    color: var(--color-primary) !important;
}

.dorpdown-info {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
    padding: 10px;
    min-width: 270px;
    border-bottom: 1px solid var(--color-light2);
}

.dorpdown-info>b {
    width: 100%;
    justify-content: center;
    display: flex;
    color: var(--color-primary);
    margin-bottom: 3px;
    font-size: 20px;
}

.dorpdown-info>small {
    width: 100%;
    justify-content: center;
    font-size: 17px;
    display: flex;
    color: var(--color-light3);
}

.dorpdown-expire {
    margin: 10px auto;
    text-align: center;
    display: block;
    background: var(--color-light);
    padding: 10px;
    border-radius: 10px;
    color: var(--color-black);
    font-size: 12px;
}

.dorpdown-expire>b {
    font-size: 22px;
    display: block;
    text-align: center;
    margin: 0 auto;
}


.sep {
    border-bottom: 1px solid var(--color-light2);
    margin: 10px auto;
}

/*navbar*/
.navbar-nav.headerbar {
    margin: 15px 0;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    padding: 0 20px;
    align-items: center;
    align-content: center;
}

.sep-item {
    width: 1px;
    height: 20px;
    background: var(--color-light2);
    margin: 0 15px;
}

.navbar-nav.headerbar .nav-item>a {
    color: var(--color-black);
    border: 1px solid var(--color-white);
    display: block;
    padding: 12px 20px;
    width: auto;
    font-weight: bold;
    font-size: 16px;
    margin: 0 5px;
}

.navbar-nav.headerbar .nav-item>a:active, .navbar-nav.headerbar .nav-item>a:hover, .navbar-nav.headerbar .nav-item>a:focus {
    background: var(--color-white);
    border: 1px solid var(--color-light2);
    border-radius: 50px;
}

.navbar-nav.headerbar .nav-item>a.dropdown-toggle::after {
    top: 3px;
    position: relative;
    margin-right: 7px;
    display: none;
}


.navbar-nav.headerbar .nav-item>a svg {
    width: 20px;
    height: 20px;
    float: right;
    margin-left: 15px;
}

.dropdown-menu {
    border: 1px solid var(--color-light2);
    border-radius: 15px;
    padding: 15px;
    text-align: right;
    margin-top: 10px !important;
}

.dropdown-menu::before {
    content: "";
    width: 12px;
    height: 12px;
    position: absolute;
    top: -6px;
    right: 25px;
    border-right: 1px solid var(--color-light2);
    border-top: 1px solid var(--color-light2);
    transform: rotate(-45deg);
    background: var(--color-white);
}

.dropdown-item {
    padding: 15px 20px;
    font-size: 16px;
    background: var(--color-white);
    color: var(--color-black) !important;
    font-weight: bold;
    margin: 5px auto;
    border-radius: 10px;
    min-width: 180px;
}


.dropdown-item:hover, .dropdown-item:focus {
    color: var(--color-primary) !important;
    background: var(--color-bg);
}

.dropdown-item>svg {
    width: 19px;
    height: 19px;
    float: right;
    margin: 0 0 0 14px;
}

.dropdown-item>svg path {
    fill: var(--color-black);
}

.dropdown-item:hover>svg path, .dropdown-item:focus>svg path {
    fill: var(--color-primary);
}

.dropdown-menu.dropdown-first {
    width: 800px;
}

.dorpdown-inner {
    min-width: 480px;
}

@media screen and (min-width: 1350px) {
    .dropdown-menu.dropdown-first {
        width: 1250px;
    }

    .dorpdown-inner {
        min-width: 600px;
    }
}



.dropdown-menu.dropdown-first {
    padding: 40px;
}


.dorpdown-inner {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: baseline;
}

.dropdown-menu.dropdown-first.show {
    display: flex;
    flex-wrap: nowrap;
}

.dorpdown-inner>* {
    flex: 1 1 33%;
}

.dropdown-img {
    width: 100%;
    position: relative;
    padding: 0;
    min-width: 550px;
}


/*footer*/
footer {
    margin-top: 50px;
}

.headerbar footer {
    display: none;
}

.row_footer {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    justify-content: stretch;
}

.row_footer>aside {
    width: 100%;
    padding: 15px;
}

.row_footer>aside>h3 {
    font-size: 21px;
    margin: 0 0 5px;
    display: block;
    font-weight: bold;
}

.sidelinks {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidelinks li {
    width: 100%;
    position: relative;
}

.sidelinks li a {
    color: #999da8;
    display: block;
    font-size: 18px;
    padding: 8px 0;
    transition: all 1500ms ease-in-out;

}

.sidelinks li a:hover, .sidelinks li a:focus {
    color: var(--color-black);
    transition: all 300ms ease-in-out;

}


.sidelogos {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    justify-content: right;
}

.sidelogos li {
    background: var(--color-light);
    margin: 10px;
    padding: 15px;
    border-radius: 15px;
    float: right;
}

.sidelogos li img {
    max-width: 65px;
}

footer .social {
    display: flex;
    list-style: none;
    margin: 25px 0;
    padding: 0;
}

.social li h3 {
    font-size: 21px;
    margin: 0 15px 0 25px;
    font-weight: bold;
}

.social li {
    margin-left: 15px;
    display: flex;
    align-items: center;
}

.social li svg {
    width: 32px;
    height: auto;
}

.cpr {
    background: var(--color-primary);
    color: var(--color-white);
    padding: 25px;
    font-size: 13px;
}

.inner_cpr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
}

.inner_cpr p {
    margin: 0;
}

.inner_cpr label {
    margin: 0;
    border-left: 1px solid #648FFF;
    padding: 0 15px;
    color: var(--color-white);
}

.inner_cpr label b {
    color: #98b6ff;
    font-weight: normal;
    margin-left: 10px;
}

.inner_cpr label:last-child {
    border: 0;
}



/*all*/

.sec {
    margin: 10px auto 50px;
}


.title {
    display: flex;
    flex-wrap: wrap;
    padding: 15px;
    margin: 20px auto 20px;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}

.title h3, .title h2, .title h1 {
    display: block;
    font-size: 27px;
    color: var(--color-black);
    font-weight: normal;
    margin: 0;
    line-height: 28px;
}

.title>small {
    width: 100%;
    display: block;
    line-height: 25px;
    color: #9ea3af;
}

.title.center_title>h3, .title.center_title>h2, .title.center_title>h1 {
    width: 100%;
    text-align: center;
    font-size: 25px;
    line-height: 33px;
}


.title.center_title>small {
    text-align: center;
    font-size: 20px;
    margin: 5px auto;
}

.title h3 svg, .title h2 svg, .title h1 svg {
    width: 24px;
    height: 24px;
    float: right;
    margin: 2px 0 0 10px;
}

.title.center_title>h3 svg, .title.center_title>h2 svg, .title.center_title>h1 svg {
    float: none;
}

.title h3 svg path, .title h2 svg path, .title h1 svg path {
    fill: var(--color-black);
}

.title .more_title {
    float: left;
}



.title.postitle {
    flex-direction: column;
    justify-content: start;
}

.post_header .post_det {
    padding-right: 50px;
    width: 100%;
}

.post_header .title.postitle {
    margin: 0;
}

.title.postitle>h1 {
    font-size: 45px;
    line-height: 1.5em;
    color: var(--color-black);
    display: block;
    float: none;
    text-align: right;
    width: 100%;
}

.title.postitle>h2 {
    font-size: 25px;
    font-weight: normal;
    line-height: 1.5em;
    color: #939393;
    float: none;
    display: block;
    margin: 10px auto;
    text-align: right;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.btn.morel {
    float: left !important;
    width: auto !important;
    margin: 0 !important;
    font-size: 16px !important;
    min-height: 35px !important;
    padding: 8px 12px !important;
}

.btn.morel svg {
    width: 17px;
    height: 17px;
    float: right;
    margin: 5px 2px 0 12px;
}


/*posts*/
.flexposts {
    display: flex;
    flex-wrap: wrap;
}

.post_thumb {
    padding: 15px;
    margin: 0;
}


.post_thumb .postimg {
    transform: scale(1);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
}

.post_thumb:hover .postimg {
    transform: scale(1.05);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
}




.clearfix.spacer {
    min-height: 50px;
}

.plyr--video {
    border-radius: 20px;
    margin: 20px auto;
}

.plyr__controls, .plyr__controls * {
    direction: ltr;
}

.plyr__control {
    min-height: 48px;
}

.plyr__controls {
    padding: 40px !important;
}

.plyr__controls .plyr__control, .plyr__controls .plyr__control:hover, .plyr__controls .plyr__control:focus, .plyr__controls .plyr__control:active {
    min-height: 20px;
    margin: 0;
}

.plyr__menu__container .plyr__control span {
    font-size: 12px;
    direction: ltr;
    font-family: "SF";
}


/*placeholder*/


.slideimg,
.preview_app {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 15px;
    position: relative;
}


.postimg {
    display: block;
    margin-bottom: 15px;
    width: 100%;
    overflow: hidden;
    border-radius: 15px;
    position: relative;
    aspect-ratio: 1.5;
}


.iconmask {
    width: 75px;
    height: 75px;
    min-width: 75px;
    margin-left: 15px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}

.preview_app img,
.postimg img,
.iconmask img {
    position: absolute;
    right: 0;
    left: 0;
    width: 100%;
    top: 0;
    bottom: 0;
    text-indent: -9999px;
}

.placeholder {
    position: relative;
    z-index: 0;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
}


.placeholder>img {
    position: relative !important;
}

.placeholder:before {
    content: "";
    position: absolute;
    left: -45%;
    height: 100%;
    width: 55%;
    z-index: 45;
    opacity: .8;
}

@keyframes loading {
    0% {
        left: -45%;
    }

    100% {
        left: 175%;
    }
}




.icon_row {
    display: flex;
    flex-wrap: nowrap;
    justify-content: stretch;
    padding: 10px 0;
    align-items: flex-start;
}

.icon_row.icon_new {
    flex-wrap: wrap;
}

.icon_row a h2 {
    color: var(--color-black);
    font-size: 20px;
    display: block;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 5px 0 0 0;
    font-family: "SF", "Bakh";
    font-weight: 300;
}


.icon_row a p {
    color: #939393;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 23px;
    margin-top: 8px;
    margin-bottom: 0;
}


/*collections item*/
.collection_thumb {
    margin: 0;
    padding: 10px;
}


.col_shadow {
    position: absolute;
    bottom: -31px;
    right: 0;
    left: 0;
    filter: blur(30px);
    width: auto;
    opacity: 0;
    transition: all 1500ms cubic-bezier(1, 0, 0, 1);
}

.col_item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.col_item>a {
    display: block;
    overflow: hidden;
    margin-bottom: -2px;
}


.col_item {
    transform: scale(1);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
    box-shadow: 0 15px 40px rgba(39, 75, 131, .7);
}

.collection_thumb:hover .col_item {
    transform: scale(1.05);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
    box-shadow: 0 20px 50px rgba(39, 75, 131, .8);
}



.collection_thumb:hover .col_shadow {
    opacity: 0.7;
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
}

.col_det {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    padding: 25px;
    width: 100%;
}

.col_det>div>svg {
    width: 30px;
    height: 30px;
    margin-left: 10px;
    min-width: 30px;
    float: right;
}

.col_det h2 {
    font-size: 25px;
    margin: 0;
    line-height: 30px;
    padding: 0 0 0 80px;
    font-weight: bold;
}

.col_det>p {
    display: block;
    font-size: 15px;
    margin: 7px 0 0;
}

.col_det .morelink {
    background: var(--color-white);
    border: 0;
    padding: 2px 15px;
    font-size: 15px !important;
    color: var(--color-primary);
    min-height: 10px;
    width: auto;
    font-weight: normal;
    margin: 0;
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    margin: 25px;
    opacity: 0;
    line-height: 30px;
    height: 31px;
}

.collection_thumb .morelink {
    opacity: 0;
    transition: all 1500ms cubic-bezier(.5, 0, 0, 1);
}

.collection_thumb:hover .morelink {
    opacity: 1;
    transition: all 300ms cubic-bezier(.5, 0, 0, 1);
}



/*tabs*/
.nav-tabs-sibapp li {
    margin-left: 20px;
}

.nav-tabs-sibapp li:last-child {
    margin-left: 0;
}

.nav-tabs-sibapp li button, .nav-tabs-sibapp li button:hover, .nav-tabs-sibapp li button:focus {
    margin: 0;
    padding: 16px 25px;
    min-height: 10px;
    color: var(--color-black);
    background: var(--color-light);
    border: 0;
    font-weight: normal;
    font-size: 18px !important;
    line-height: 32px;
    height: 61px;
}

.nav-tabs-sibapp li button:hover, .nav-tabs-sibapp li button:focus {
    color: var(--color-black) !important;
    background: var(--color-light2) !important;
}

.nav-tabs-sibapp li button.active, .nav-tabs-sibapp li button.active:focus, .nav-tabs-sibapp li button.active:active, .nav-tabs-sibapp li button.active:hover {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}

.nav-tabs-sibapp li button svg {
    width: 24px;
    height: 24px;
    float: right;
    margin: 2px 0 0 10px;
}

.nav-tabs-sibapp li button svg path, .nav-tabs-sibapp li button:hover svg path, .nav-tabs-sibapp li button:focus svg path {
    fill: var(--color-black) !important;
}

.nav-tabs-sibapp li button.active svg path {
    fill: var(--color-white) !important;
}



/*apps*/

.app_thumb {
    padding: 0;
    margin: 0;
}


.app_thumb .iconmask {
    width: 100px;
    height: 100px;
    min-width: 100px;
    border-radius: 20px;
}

.app_thumb .postimg {
    transform: scale(1);
    transition: all 800ms cubic-bezier(1, 0, 0, 1);
}

.app_thumb:hover .postimg {
    transform: scale(1.05);
    transition: all 1000ms cubic-bezier(1, 0, 0, 1);
}


.app_thumb .icon_row {
    padding: 30px 25px;
    align-items: center;
    align-content: center;
    padding-left: 100px;
    position: relative;
    border-bottom: 1px solid var(--color-light2);
    margin: 0 10px;
}


.app_thumb .icon_row {
    padding-left: 100px !important;
}

.app_thumb .icon_row.icon_new {
    padding-left: 20px !important;
}



.app_thumb .icon_row.nodl {
    padding: 20px 0;
}

.app_thumb.col-lg-3:nth-last-child(-n+4) .icon_row {
    border: 0;
}

.app_thumb.col-lg-4:nth-last-child(-n+3) .icon_row {
    border: 0;
}

.app_thumb.col-lg-6:nth-last-child(-n+2) .icon_row {
    border: 0;
}

.app_thumb.col-lg-12:nth-last-child(-n+1) .icon_row {
    border: 0;
}

.app_thumb .icon_row a h2 {
    color: var(--color-black);
    font-size: 20px;
    font-family: "SF", "Bakh";
    font-weight: bold;
    line-height: 1.5em;
}

.app_thumb .icon_row a p {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    font-size: 14px;
    line-height: 21px;
    margin-top: 10px;
}

.iconmask {}

.app_thumb .iconmask {
    transform: scale(1);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
}

.app_thumb:hover .iconmask {
    transform: scale(1.1);
    transition: all 300ms cubic-bezier(1, 0, 0, 1);
}


.btn.downloadlink {
    max-width: 86px;
    margin: 0;
    position: absolute;
    left: 10px;
    min-height: 10px;
    padding: 2px;
    border: 5px solid var(--color-primary);
    font-size: 14px !important;
    line-height: 29px;
    height: 41px;
}


.btn.downloadlink.downloading, .btn.downloadlink.downloading:hover, .btn.downloadlink.downloading:focus {
    font-size: 0 !important;
    width: 41px;
    height: 41px;
    background: transparent !important;
    border-right: 5px solid var(--color-white) !important;
    -webkit-animation: rotate 800ms linear infinite;
    animation: rotate 800ms linear infinite;
}

.btn.downloadlink.downloaded, .btn.downloadlink.downloaded:hover, .btn.downloadlink.downloaded:focus {
    font-size: 0 !important;
    background: var(--color-light) !important;
    color: var(--color-primary) !important;
    border: 5px solid var(--color-light) !important;
}

.btn.downloadlink.downloaded::after {
    content: "ط·آ¯ط·آ§ط¸â€ ط¸â€‍ط¸ث†ط·آ¯ ط·آ´ط·آ¯";
    font-size: 15px;
    position: relative;
    top: 2px;
}



.app_preview .btn.downloadlink {
    max-width: 105px;
    background-color: var(--color-light);
    color: var(--color-primary);
    border: 5px solid var(--color-light);
    display: flex;
    padding: 5px 10px;
    line-height: 23px;
}

.app_preview .btn.downloadlink:hover, .app_preview .btn.downloadlink:focus, .app_preview .btn.downloadlink:active {
    background-color: var(--color-light2) !important;
    color: var(--color-primary) !important;
    border: 5px solid var(--color-light2) !important;
}

.app_preview .btn.downloadlink svg {
    min-width: 20px;
    height: 20px;
    margin: 0 0 0 8px;
}

.btn.downloadlink.downloading svg {
    display: none;
}

.app_preview .btn.downloadlink.downloading, .app_preview .btn.downloadlink.downloading:hover, .app_preview .btn.downloadlink.downloading:focus {
    background: transparent !important;
    border-color: var(--color-light2) !important;
    border-right: 5px solid var(--color-white) !important;
}


/*big app*/
.app_preview {
    border: 1px solid var(--color-light2);
    padding: 0;
    border-radius: 15px;
    margin: 15px;
}

.app_preview .icon_row {
    border: 0;
    padding: 0;
    margin: 25px;
}


.sw_preview {
    overflow: hidden;
    padding: 0 25px 25px;
}

.sw_single {
    overflow: hidden;
}

/*app page*/
.app_header {
    width: 100%;
    margin: 25px auto 0;
    position: relative;
    padding-right: 420px;
    z-index: 9;
}

.app_header.post_header {
    padding-right: 0;
    display: flex;
    flex-wrap: nowrap;
}


.app_header_det {
    float: left;
    display: flex;
    flex-direction: column;
}

.app_header_det>h1 {
    text-align: left;
    font-size: 50px;
    font-weight: bold;
    font-family: "SF", "Bakh";
    margin-bottom: 20px;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    direction: ltr;
    -webkit-box-orient: vertical;
}


.app_header_det>h2 {
    text-align: left;
    font-weight: bold;
    font-family: "SF", "Bakh";
    margin-bottom: 20px;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    direction: ltr;
    -webkit-box-orient: vertical;
}

.app_header_list {
    list-style: none;
    margin: 15px 0;
    padding: 0;
    display: flex;
    color: #9298a9;
    justify-content: right;
}


.app_header_list li {
    border-left: 1px solid var(--color-light2);
    padding: 0 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: end;
}

.post_header_list li {
    align-items: start !important;
}

.app_header_list li:last-child {
    border: 0;
    padding-left: 0;
}

.app_header_list li svg {
    width: 20px;
    height: 20px;
    margin-bottom: 10px;
}

.app_header_list li>label {
    display: block;
    font-size: 14px;
    text-align: left;
}

.app_header_list li>label>b {
    font-weight: normal;
}

.app_header_list li>label>a {
    color: #9298a9;
}

.app_header_list li>label>a:hover {
    color: var(--color-black);
}

.app_header>.postimg,
.app_header>.iconmask {
    float: right;
}

.app_header>.iconmask {
    float: right;
    width: 240px;
    height: 240px;
    min-width: 240px;
    border-radius: 40px;
    right: 0;
    position: absolute;
}

.app_header>.postimg {
    float: right;
    width: 385px;
    height: 240px;
    min-width: 385px;
    border-radius: 20px;
    position: relative;
}

.downloadbox>label {
    color: #9298a9;
    margin: 0 0 0 15px;
    float: right;
    font-size: 16px;
}

.downloadbox {
    display: flex;
    flex-direction: row-reverse;
    align-content: end;
    align-items: center;
    padding: 10px 0;
}

.downloadbox_btn {
    position: relative;
}

.downloadbox_ver {
    position: absolute;
    left: 0;
    padding: 0;
    background: #308FFF;
    top: 0;
    bottom: 0;
    border-right: 3px solid var(--color-white);
    display: flex;
    border-radius: 30px 0 0 30px;
    text-align: center;
    justify-content: center;
    display: flex;
    align-content: center;
}

.downloadbox_ver>i {
    padding: 0 20px;
    align-content: center;
    display: flex;
    cursor: pointer;
}


.downloadbox_main {
    background: var(--color-primary);
    padding: 20px 30px;
    padding-left: 30px;
    border-radius: 50px;
    display: block;
    position: relative;
    padding-left: 120px;
    align-items: center;
    align-content: center;
    display: flex;
}

.downloadbox_main:hover {
    background: var(--color-primary2);
}

.downloadbox_main>b>svg {
    float: right;
    width: 22px;
    height: 22px;
    margin: 2px 0 0 10px;
}

.downloadbox_ver>i::after {
    display: none;
}

.downloadbox_main>small {
    margin: 0 10px 0 0;
    font-size: 16px;
}


.downloadbox_main>b {
    font-size: 19px;
    font-weight: normal;
}


.dropdown-menu.dropdown-versions {
    left: 0 !important;
    right: auto !important;
    min-width: 336px;
}

.dropdown-versions .dropdown-item::before {
    content: "";
    width: 8px;
    height: 8px;
    background: var(--color-light2);
    position: absolute;
    right: 5px;
    top: 23px;
    border-radius: 10px;
}

.dropdown-versions .dropdown-item:hover::before {
    background: var(--color-primary);
}

.dropdown-versions .dropdown-item {
    padding: 15px 25px 15px 60px;
    position: relative;
    width: 100%;
    margin: 5px 0;
    font-size: 16px;
    font-weight: normal;
}

.dropdown-versions .dropdown-item>i {
    background: var(--color-primary);
    width: 30px;
    float: left;
    display: block;
    margin: 10px;
    border-radius: 20px;
    height: 30px;
    padding: 7px;
    display: flex;
    align-content: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
}

.dropdown-versions.dropdown-menu::before {
    display: none;
}

.fullwidth {
    overflow: hidden;
}



.mainpost {
    /*max-width: 900px;*/
    margin: 0 auto;
    display: block;
    padding: 0 10px;
    text-align: justify;
    line-height: 2em;
}

.mainpost img {
    overflow: hidden;
    margin: 25px auto;
    float: none;
    /*max-width: 70%;*/
    border-radius: 20px;
    display: block;
}

.mainpost>h2 {
    margin: 50px auto 20px auto;
}

.mainpost>p {
    display: block;
    text-align: justify;
    font-size: 16px;
}

.mainpost>a,
.mainpost>p>a {
    color: var(--color-primary);
}

.mainpost>a:hover,
.mainpost>p>a:hover {
    background: var(--color-primary);
    color: var(--color-white);
}

.mainpost > ul > li > a {
    color: var(--color-primary);
}

.mainpost > ul > li > a:hover, .mainpost > ul > li > a:focus {
    background: var(--color-primary);
    color: var(--color-white);
}

blockquote {
    border-right: 4px solid var(--color-black);
    font-size: 20px;
    padding: 40px;
    color: var(--color-black);
    margin: 20px auto !important;
    overflow: hidden;
}

/*hashtag*/
.sec.hashtags {
    padding-right: 140px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    margin: 10px auto;
}

.sec.hashtags .title {
    position: absolute;
    right: 0;
    margin: 0;
    padding: 6px 28px;
}

.hashtag_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sw_aitag .swiper-slide {
    width: auto;
}

.hashtag_list li a {
    background: var(--color-light);
    color: var(--color-black);
    padding: 8px 15px;
    border-radius: 26px;
    margin: 0 0 10px 10px;
    display: block;
    width: auto;
}


.hashtag_list li a:hover, .hashtag_list li a:focus {
    background: var(--color-light2);
    color: var(--color-black);
}


/*review*/
.rate_row {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    justify-content: space-between;
    align-content: center;
    align-items: start;
}

.revtitle.reviewt {
    width: 350px;
    min-width: 350px;
    margin-left: 35px;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}


.revtitle.reviewt .iconmask {
    width: 130px;
    height: 130px;
    min-width: 130px;
    float: none;
    margin: 0 auto;
    border-radius: 25px;
}


.reviewcount>b {
    display: block;
    text-align: center;
    font-size: 20px;
    width: 100%;
}


.reviewcount>label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
    color: var(--color-light3);
    font-size: 14px;
}

.reviewcount>label i {
    text-align: center;
    font-size: 20px;
    color: var(--color-black);
    font-weight: bold;
    margin-left: 5px;
    font-style: normal;
}



.reviewcount {
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}

.reviewstars {
    width: 100%;
    margin: 15px auto;
}

.reviewstars>div {
    width: 200px;
    margin: 0 auto;
    background: url('../svg/starsbg.svg');
    background-repeat: repeat;
    background-size: auto;
    background-repeat: repeat;
    background-size: auto;
    background-repeat: repeat-x;
    background-size: 200px;
    display: block;
    height: 35px;
    position: relative;
    overflow: hidden;
}

.reviewstars>div>b {
    content: "";
    background: url('../svg/stars.svg');
    background-repeat: repeat;
    background-size: auto;
    background-repeat: repeat;
    background-size: auto;
    background-repeat: repeat-x;
    background-size: 200px;
    display: block;
    height: 35px;
    position: absolute;
    left: 0;
}

.item .reviewstars {
    position: absolute;
    left: 0;
    top: 0;
    margin: 20px;
    right: auto;
    width: auto;
}

.item .reviewstars>div {
    width: 88px;
    background-size: 88px;
    height: 15px;
    float: left;
}

.item .reviewstars>div>b {
    background-size: 88px;
    height: 15px;
    margin: 0;
}

.item .reviewstars>label {
    font-size: 12px;
    margin: 0 0 0 8px;
    display: block;
    float: right;
    color: var(--color-primary);
    font-weight: bold;
}

.reviews {
    width: 100%;
}

.reviews>.item {
    margin-bottom: 15px;
    background-color: var(--color-light);
    display: block;
    padding: 25px;
    position: relative;
    border-radius: 15px;
}

.reviews .item b {
    display: block;
    width: 100%;
    margin: 0 0 10px;
    font-size: 16px;
}

.reviews .item span {
    font-size: 14px;
    color: var(--color-dark);
    display: block;
    width: 100%;
    padding: 4px 0;
}


.reply {
    background: var(--color-white);
    padding: 15px;
    border-radius: 15px;
    margin-top: 25px;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
    align-items: start;
}

.reviews .item .reply>svg {
    float: right;
    width: 24px;
    min-width: 24px;
    height: 24px;
    margin: 2px;
}

.reviews .item .reply>b {
    color: var(--color-dark2);
    font-weight: normal;
    font-size: 18px !important;
    width: auto !important;
    float: right !important;
    margin: 0 10px;
}

.reviews .item .reply>span {
    margin: 0;
    padding: 0;
    display: block;
    font-size: 16px !important;
    width: auto;
}


.modal-content {
    border: 0;
    border-radius: 25px;
    padding: 10px 25px;
}



.btn-more.collapsed>svg {
    transform: rotate(0);
}

.btn-more>svg {
    transform: rotate(180deg);
    margin-left: 10px;
    margin-top: -3px;
}

.btn-more {
    font-size: 0 !important;
}

.btn-more.collapsed {
    font-size: 16px !important;
}

.btn-more:after {
    content: "بستن";
    font-size: 16px !important;
}

.btn-more.collapsed:after {
    display: none;
}


/*rating*/

.rate {
    position: relative;
    height: 40px;
    text-align: center;
    width: 100%;
    margin: 15px auto 0;
}

.rate:not(:checked)>input {
    position: absolute;
    top: -9999px;
}

.rate:not(:checked)>label {
    float: none;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 0;
    background-image: url('../svg/rate0.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
    width: 33px;
    height: 33px;
}

.rate>input:checked~label {
    background-image: url('../svg/rate1.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
    width: 33px;
    height: 33px;
    display: inline-block;
}

.rate:not(:checked)>label:hover,
.rate:not(:checked)>label:hover~label {
    background-image: url('../svg/rate1.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
}

.rate>input:checked+label:hover,
.rate>input:checked+label:hover~label,
.rate>input:checked~label:hover,
.rate>input:checked~label:hover~label,
.rate>label:hover~input:checked~label {
    background-image: url('../svg/rate1.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px;
}


/*learning*/
.learn_box {
    padding: 15px;
    background: var(--color-light);
    border-radius: 15px;
}

.learn_title {
    padding: 10px;
    cursor: pointer;
    position: relative;
}

.learn_title>svg {
    float: right;
    margin-left: 10px;
}

.learn_title>b {
    float: right;
    color: var(--color-primary);
    margin: 2px 2px 2px 15px;
    font-size: 16px;
    font-weight: bold;
}

.learn_inner {
    display: block;
    padding: 25px;
    line-height: 2em;
}


.learn_title i>svg {
    position: absolute;
    transform: rotate(180deg);
    left: 10px;
    width: 20px;
    height: 20px;
    top: 12px;
}


.learn_title.collapsed i>svg {
    transform: rotate(0);
}


.learn_title.collapsed small {
    max-width: 500px;
    font-size: 16px;
    display: inline-block;
    opacity: .6;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    padding: 2px;
}

.learn_title small {
    display: none;
}


/*dashboard sidebar*/

.fixlinebox {
    display: flex;
    flex-wrap: nowrap;
    margin: 0 auto;
    padding: 25px;
}

#sidebar {
    max-width: 400px;
    min-width: 400px;
    width: 100%;
    padding: 0;
}

.sidebar__inner {
    padding: 15px;
}

#mainbar {
    width: 100%;
    padding: 15px;
}


.profile_header {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    background: var(--color-primary);
    border-radius: 50px;
    padding: 10px 15px 10px 140px;
    align-content: center;
    align-items: center;
    margin-bottom: 25px;
}

.profile_header>img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-left: 15px;
}

.profile_header b, .profile_header small {
    color: var(--color-white);
    display: block;
    margin: 2px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    font-size: 18px;
    font-weight: normal;
}

.profile_header small {
    font-size: 15px;
}

.profile_header .user-btn {
    position: absolute;
    left: 12px;
    max-width: 110px;
}


.dashboard_menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashboard_menu li {
    width: 100%;
    overflow: hidden;
}


.dashboard_menu li a {
    color: var(--color-black);
    font-size: 19px;
    display: block;
    position: relative;
    padding: 18px 10px;
    border-bottom: 1px solid var(--color-light2);
    transition: all 1500ms ease-in-out;
}


.dashboard_menu li a label {
    float: left;
    direction: ltr;
    font-family: "SF", "Bakh";
    color: var(--color-light3);
}

.dashboard_menu li:last-child a {
    border: 0;
}

.dashboard_menu li a svg {
    width: 24px;
    height: 24px;
    float: right;
    margin: 0 0 0 20px;
}

.dashboard_menu li a svg path {
    fill: var(--color-black);
    transition: all 1500ms ease-in-out;

}

.dashboard_menu li a:hover, .dashboard_menu li a:focus,
.dashboard_menu li a.active {
    color: var(--color-primary);
    transition: all 200ms ease-in-out;
}


.dashboard_menu li a:hover svg path, .dashboard_menu li a:focus svg path,
.dashboard_menu li a.active svg path {
    fill: var(--color-primary);
    transition: all 200ms ease-in-out;

}


/*banner*/
.user_plans {
    max-width: 650px;
    margin: 0 auto;
    padding: 0 25px;
}

.user_banner {
    margin-bottom: 25px;
}

.user_banner svg {
    width: 100%;
}

.user_plans h3 {
    padding: 5px 15px 0;
    margin: 0;
    font-weight: bold;
    font-size: 25px;
}

.user_plans_list {
    list-style: none;
    margin: 0;
    padding: 15px;
}

.user_plans_list li::before {
    content: "";
    position: absolute;
    right: 0;
    top: 12px;
    width: 5px;
    height: 5px;
    background: var(--color-black);
    border-radius: 5px;
}

.user_plans_list li {
    width: 100%;
    position: relative;
    padding: 4px;
    padding-right: 20px;
    font-size: 14px;
}

.btn-pro {
    text-align: right;
    height: 65px;
    line-height: 34px;
    font-size: 20px !important;
    padding: 14px;
}

.btn-pro small {
    font-size: 12px;
    margin: 0 5px;
    font-weight: normal;
}

.btn-pro svg {
    float: right;
    margin: 6px;
    width: 22px;
    height: 22px;
}

.btn-secondary.btn-pro svg path {
    fill: var(--color-primary);
}

.btn-primary.btn-pro svg path {
    fill: var(--color-white);
}


.btn-pro label {
    float: left;
    margin: 3px;
    font-size: 11px;
    display: flex;
    align-items: center;
    position: relative;
    top: -3px;
}


.btn-pro label b {
    font-size: 24px;
    font-weight: bold;
    margin: 0 6px;
}


/*my apps*/
#mainbar .app_thumb .icon_row {
    padding: 15px;
}

#mainbar .flexposts .app_thumb:last-child .icon_row {
    border: 0;
}


.new_app_label {
    margin: 0;
    position: absolute;
    left: 10px;
    min-height: 10px;
    padding: 2px;
    color: var(--color-black);
}

.new_app_label::before {
    content: "";
    width: 8px;
    height: 8px;
    float: right;
    background: var(--color-primary);
    border-radius: 10px;
    margin: 8px;
}


.new_app_label.cancled::before {
    background: var(--color-red);
}


.new_app_label.expired::before {
    background: var(--color-light3);
}

.modal-header {
    border: 0;
}

.modal-header h2 {
    font-size: 25px;
    text-align: center;
    color: var(--color-primary);
    margin: 0 0 10px;
    padding: 6px;
    display: block;
    width: 100%;
    font-weight: normal;
}

.modal-header h2 svg {
    width: 20px;
    height: 20px;
    margin: 0 0 0 5px;
    position: relative;
    top: -2px;
}


.avatar-upload {
    position: relative;
    max-width: 120px;
    margin: 0 auto 20px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 0;
    z-index: 1;
    bottom: 0;
    left: 0;
    top: 0;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input+label {
    transition: all 0.2s ease-in-out;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 99;
    cursor: pointer;
}

.avatar-upload.icon-upload>label {
    font-size: 12px;
    text-align: center;
    margin: 10px 0;
    color: var(--color-light3);
}


.avatar-upload .avatar-preview {
    width: 120px;
    height: 120px;
    position: relative;
    border-radius: 25px;
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 25px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}


.modal-content {
    overflow: hidden;
}

.modal-content .user_plans {
    margin: 0;
    padding: 0;
}

.modal-content .user_banner svg {
    z-index: 9;
    position: relative;
}


.modal_alert::before,
.modal-content .user_banner::before {
    content: "";
    background: linear-gradient(180deg, rgba(84, 169, 234, 0.2) 0%, rgba(217, 217, 217, 0) 100%);
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    left: 0;
    height: 150px;
}

.btn-close.fix-close, .btn-close.fix-close:hover, .btn-close.fix-close:focus {
    position: absolute;
    left: 0;
    top: 0;
    margin: 15px;
    z-index: 99;
    background: transparent !important;
    border: 0 !important;
    width: auto !important;
}

.miniform {
    max-width: 350px;
    margin: 0 auto;
}

.modal_alert {
    padding: 80px;
    text-align: center;
}

.modal_alert_icon {
    text-align: center;
    margin-bottom: 50px;
}

.modal_alert_icon svg {
    width: 50px;
    height: 50px;
    margin: 0 auto;
}

.modal_alert h2 {
    text-align: center;
    font-size: 23px;
    display: block;
    font-weight: bold;
}

.modal_alert span {
    text-align: center;
    font-size: 18px;
    display: block;
    margin: 25px auto;
}


.card {
    border: 0;
    padding: 10px;
}

.card-header {
    border: 0;
    position: relative;
    border-radius: 50px !important;
    padding: 20px;
    cursor: pointer;
}

.card-header>svg {
    float: right;
    margin: 4px;
    margin-left: 4px;
    margin-left: 15px;
    width: 24px;
    height: 24px;
}

.card-header>label {
    margin: 0;
    font-size: 22px;
    font-weight: normal;
    cursor: pointer;
}

.card-header>label>small {
    font-weight: normal;
    font-size: 14px;
    margin: 0 5px;
}

.card-header>i>svg {
    width: 20px;
    height: 20px;
}

.card-header>i {
    position: absolute;
    left: 25px;
    top: 20px;
}

.card-header.collapsed>i {
    transform: rotate(180deg);
    top: 25px;
}

.trans_list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

.trans_list li {
    width: 50%;
    padding: 20px 15px;
    border-bottom: 1px solid var(--color-light2);
}


@media screen and ((min-width: 992px) AND (max-width: 1200px)) {

    .trans_list li {
        width: 100%;
        border-bottom: 1px solid var(--color-light2) !important;
    }

    .trans_list li:last-child {
        border: 0 !important;
    }

}


.trans_list li svg {
    width: 23px;
    height: 23px;
    float: right;
    margin-left: 10px;
}

.trans_list li:last-child, .trans_list li:nth-last-child(3n-1) {
    border: 0;
}

.trans_list li b {
    font-size: 16px;
    font-weight: normal;
}

.trans_list li label {
    float: left;
    font-size: 16px;
    margin: 0;
    padding: 3px;
}

.label_green {
    color: var(--color-green);
}


.label_red {
    color: var(--color-red);
}


.label_blue {
    color: var(--color-primary);
}


.label_yellow {
    color: var(--color-yellow);
}


/*pages*/

.pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 50px auto 25px;
    padding: 0 15px;
    max-width: 900px;
}

.pages>span,
.pages>a {
    margin: 3px;
    color: var(--color-black);
    background: var(--color-white);
    font-size: 15px;
    display: inline-block;
    padding: 8px;
    border-radius: 10px;
    border: 2px solid var(--color-black);
    min-width: 40px;
    text-align: center;
}

.pages>a:hover {
    border: 2px solid var(--color-black);
    background: var(--color-black);
    color: var(--color-white);
}

.pages>a.current:hover,
.pages>a.current {
    border-color: var(--color-black);
    color: var(--color-white);
    background: var(--color-black);
}

.pages>span {
    border: 0;
}




/*contact*/
.sec.container.contact {
    max-width: 1000px;
}

.sec.container.contact .title>h2 {
    float: none;
    text-align: center;
}

.contactlist {
    list-style: none;
    margin: 0;
    padding: 0;
    color: var(--color-dark);
}

.contactlist li {
    width: 100%;
    padding: 5px 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.contactlist li b {
    float: right;
    font-size: 18px;
    font-weight: normal;
}

.contactlist li img {
    width: 80px;
    height: 80px;
    margin: 0;
    padding: 22px;
}

.contactlist li label {
    display: block;
    margin: 0;
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: var(--color-black);
}


/*error*/
.errorpage {
    height: 100vh;
    width: 100%;
    background: var(--color-light);
    color: var(--color-black);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}


.erroricon {
    height: 80px;
    width: 80px;
    margin: 15px auto;
}

.errorlogo {
    max-width: 150px;
    margin: 15px auto;
    display: block;
}

.errorbox>* {
    width: 100%;
}

.errorbox {
    float: none;
    display: flex;
    flex-wrap: wrap;
    margin: 10px auto;
    position: relative;
    z-index: 9;
    max-width: 350px;
    padding: 30px 0;
    width: 100%;
}

.errorbox .btn {
    max-width: 240px;
    display: block;
}

.errorbox * {
    text-align: center;
}

.mainlog {
    width: 150px;
    margin-bottom: 30px;
}

.form-group>small {
    padding: 0 25px;
    color: var(--color-light3);
}

.bigarrow {
    padding: 15px 0 0;
    margin-bottom: -22px;
    z-index: 99;
    position: relative;
}

.bigarrow span {
    display: block;
    font-family: "SF", "Bakh";
    font-size: 30px;
    font-weight: bold;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
    text-align: center;
}

.bigarrow svg {
    width: 50px;
    margin: 0 auto;
    display: block;
}

.footer_bar {
    display: none;
}

.topsearch.inner_search {
    margin: 0 auto;
    min-height: 60vh;
}



.topsearch.inner_search .app_results, .topsearch.inner_search .app_results.hide {
    display: block !important;
    min-width: 100% !important;
    width: 100% !important;

}

.topsearch.inner_search .app_results {
    position: relative;
    border: 0;
    padding: 10px;
}


.topsearch.inner_search .hashtag_list li {
    margin: 5px;
    width: auto;
}

.topsearch.inner_search .flex_suggest .title h3 {
    font-size: 15px;
    color: var(--color-light3);
}


.btn-close, .btn-close:hover, .btn-close:focus {
    background: transparent !important;
    padding: 0;
    margin: 0;
    border: 0;
    width: 42px;
    height: 42px;
    min-height: 42px;
}

.btn-close:hover, .btn-close:focus {
    opacity: 1;
}

/*toast*/
.nice-toast-close {
    padding: 0;
    margin: 0;
    width: auto;
    height: auto;
    min-height: 20px;
}


.nice-toast-error {
    background: var(--color-red) !important;
    color: #fff !important;
}

.nice-toast-info {
    background: var(--color-primary) !important;
    color: #fff !important;
}

.nice-toast-success {
    background: #059669 !important;
    color: #fff !important;
}

.nice-toast-warning {
    background: #fed7aa !important;
    color: #000 !important;
}

.nice-toast-warning .nice-toast-close {
    color: #000 !important;
}

.nice-toast-warning .nice-toast-progress {
    background-color: rgba(0, 0, 0, .7);
}


.nice-toast {
    padding: 10px !important;
    border-radius: 10px !important;
    min-height: 55px !important;
}

.nice-toast-progress {
    bottom: 5px !important;
    left: 7px !important;
    border-radius: 10px !important;
    right: 7px !important;
    width: auto !important;
}

.nice-toast-icon {
    width: 20px;
    height: 20px;
    margin: 6px;
}

.nice-toast-close {
    height: 20px;
    top: 2px;
}

.nice-toast-close {
    font-weight: normal;
}

.nice-toast-close:hover {
    background: transparent !important;
}

.nice-toast-content {
    padding: 6px;
    font-size: 14px;
}


.swal2-popup p,
.swal2-popup h2 {
    font-weight: normal;
}

.swal2-popup {
    background: var(--color-white);
    border-radius: 25px;
    padding: 20px;
}

.swal2-popup .btn {
    display: inline-block;
    width: auto;
    min-width: 120px;
    margin: 0 15px;
    border-radius: 25px;
}

.swal2-actions {
    display: flex;
    flex-wrap: nowrap;
}

.swal2-actions .btn {
    width: 100%;
}





.gamecard, .wrap {
    position: relative
}

.wrap {
    padding-bottom: 20px;
    width: 400px;
    height: 375px;
    margin: 0 auto;
    min-height: 100px
}

.wrap>p {
    text-align: center;
    font-size: 16px;
    padding: 0;
    max-width: 300px;
    margin: 0 auto 15px;
}

.game {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective: 500px;
    perspective: 500px;
    min-height: 100%;
    height: 100%;
    margin-bottom: 100px;
}

@-webkit-keyframes matchAnim {
    0% {
        background: var(--color-light);
    }

    100% {
        background: #fff;
    }
}

@keyframes matchAnim {
    0% {
        background: var(--color-light);
    }

    100% {
        background: #fff;
    }
}

.game .gamecard {
    border: 0;
    float: left;
    width: 66px;
    height: 66px;
    padding: 5px;
    text-align: center;
    display: block;
    -webkit-perspective: 500px;
    perspective: 500px;
    cursor: pointer;
    z-index: 50;
    -webkit-tap-highlight-color: transparent
}

.gamecard .inside {
    width: 100%;
    height: 100%;
    display: block;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
    background: #fff
}

.gamecard .inside.matched, .gamecard .inside.picked {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.gamecard .inside.matched {
    -webkit-animation: 1s ease-in-out .4s matchAnim;
    animation: 1s ease-in-out .4s matchAnim
}

.gamecard .back, .gamecard .front {
    border: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0
}

.gamecard .back img, .gamecard .front img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
    max-height: 100%
}

.gamecard .front {
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg)
}

.gamecard .back {
    -webkit-transform: rotateX(0);
    transform: rotateX(0)
}



.modal-overlay.modal_alert::before {
    display: none;
}

.modal-overlay.modal_alert {
    padding: 15px 30px 0;
    position: relative;
}

.modal-overlay.modal_alert span {
    margin: 15px auto;
}


#giftcode,
.modal-overlay input, .modal-overlay input:focus {
    text-align: center;
    font-family: "SF";
    font-size: 19px;
    font-weight: bold;
    color: var(--color-dark2);
}

code {
    display: block;
    text-align: left;
    direction: ltr;
}

/**** UPDATE 2 ****/
a.posthumb2_cat {
    float: right;
    display: block;
    color: #979797;
    padding: 2px;
    margin: 0 0 0 5px;
}

a.posthumb2_cat:hover, a.posthumb2_cat:focus {
    color: #727272;
}

a.posthumb2_h2 {
    width: 100%;
    overflow: hidden;
    display: block;
    padding: 2px;
}


a.posthumb2_h2 h2 {
    color: var(--color-black);
    font-size: 20px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 0;
    font-weight: bold;
    line-height: 1.5em;
}

.posthumb2_det {
    list-style: none;
    margin: 0;
    padding: 2px;
    overflow: hidden;
    width: 100%;
}

.posthumb2_det li {
    float: right;
    margin-left: 15px;
    padding: 0;
}

.posthumb2_det li svg {
    width: 18px;
    float: right;
    margin: 2px 2px 2px 5px;
}

.posthumb2_det li b {
    font-weight: normal;
    color: #979797;
    font-size: 14px;
}

.categories_box .learn_title>b {
    color: var(--color-black);
}

.categories_box .learn_title>label {
    float: right;
    margin: 0;
    padding: 1px 10px;
    margin-right: 10px;
    position: relative;
}

.categories_box .learn_title>label::before {
    content: "/";
    position: absolute;
    right: -9px;
    top: 3px;
}

.categories_box .learn_title i>svg {
    background: #fff;
    border-radius: 7px;
    width: 30px;
    height: 30px;
    padding: 6px;
    margin: -3px;
}

.categories_box .learn_inner {
    background: url('../img/menu_sidebg.svg');
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 400px;
    min-height: 400px;
    padding-left: 420px;
}


.navbar-nav.nav-sidebar {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    width: 290px;
    padding-left: 25px;
    position: relative;
}

.navbar-nav.nav-sidebar .nav-item {
    position: unset;
}

.navbar-nav.nav-sidebar .nav-item a {
    color: var(--color-black);
    display: block;
    position: relative;
    padding: 4px;
}


.navbar-nav.nav-sidebar .nav-item a:hover, .navbar-nav.nav-sidebar .nav-item a:focus {
    color: var(--color-primary);
}

.navbar-nav.nav-sidebar .nav-item a.dropdown-toggle::after {
    border: 0;
    left: 0;
    background: url('../svg/left.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    position: absolute;
    right: auto;
    height: 20px;
    width: 20px;
    margin: 7px;
}


.navbar-nav.nav-sidebar .nav-item a.dropdown-toggle.show::after {
    background-image: url('../svg/left_blue.svg');
}

.navbar-nav.nav-sidebar .dropdown-menu {
    float: none;
    position: absolute !important;
    bottom: auto !important;
    transform: none !important;
    right: 100% !important;
    top: 0 !important;
    margin: 0 !important;
}

.navbar-nav.nav-sidebar .dropdown-menu::before {
    display: none;
}

.navbar-nav.nav-sidebar .dropdown-menu {
    background: transparent;
    border: 0;
    padding: 0;
}

.navbar-nav.nav-sidebar .dropdown-menu .dropdown-item {
    background: transparent;
    font-weight: normal;
}




@media screen and (max-width: 992px) {
    .categories_box .learn_title>label {
        font-size: 12px;
    }

    .categories_box .learn_title i>svg {
        margin: -8px;
    }

    .categories_box .learn_title>label {
        padding: 1px 5px;
        margin-right: 15px;
    }

    .categories_box .learn_inner {
        background: transparent !important;
        padding: 15px;
    }


    .navbar-nav.nav-sidebar .nav-item a {
        padding: 6px;
        font-size: 15px;
    }

    .navbar-nav.nav-sidebar {
        width: 100%;
        padding-left: 0;
    }

    .navbar-nav.nav-sidebar .nav-item {
        position: relative;
    }

    .navbar-nav.nav-sidebar .dropdown-menu {
        position: relative !important;
        right: 0 !important;
        border: 1px solid var(--color-light3);
        padding: 10px 20px !important;
        margin: 15px 0 !important;
        border-radius: 10px;
    }


    .navbar-nav.nav-sidebar .nav-item a.dropdown-toggle::after {
        transform: rotate(-90deg);
    }


    .navbar-nav.nav-sidebar .nav-item a.dropdown-toggle.show::after {
        transform: rotate(90deg);
    }


}



/*alien*/


.alien_error {
    margin: 0 auto;
    max-width: 100vw;
}


.alien_error_inner {
    margin: 50px auto 0;
    position: relative;
    height: 350px;
    direction: ltr;
    width: 320px;
}



.error_mask {
    -webkit-mask-image: url('../svg/error_mask.svg');
    mask-image: url('../svg/error_mask.svg');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: cover;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 15px;
}

.alien_item {
    position: absolute;
    margin: 0 auto;
    top: 0;
    bottom: 0;
    z-index: 9;
    max-width: 320px;
    width: 100%;
}


.alien_item svg {
    margin: 0 auto;
    display: block;
    width: 100%;
    z-index: 9;
    position: absolute;
    right: 0;
    left: 0;
}

.alien_item.error_safine {
    -webkit-animation: alien_bob 1500ms ease-in-out infinite;
    animation: alien_bob 1500ms ease-in-out infinite;
}

.alien_item.error_safine svg {
    top: 0;
    right: -25px;
    z-index: 8;
}




.alien_item.error_safine svg #error_light {
    opacity: 0;
}

.alien_error_inner.active .alien_item.error_safine svg #error_light {
    opacity: 1;
    -webkit-animation: error_light_anime 1000ms ease-in-out infinite;
    animation: error_light_anime 1000ms ease-in-out infinite;
}


@keyframes error_light_anime {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}



.alien_item.error_safine svg #error_lamp path {
    fill: #BECBD3;
}

.alien_error_inner.active .alien_item.error_safine svg #error_lamp path:nth-child(odd) {
    -webkit-animation: error_lamp_anime 1200ms ease-in-out infinite;
    animation: error_lamp_anime 1200ms ease-in-out infinite;
}

.alien_error_inner.active .alien_item.error_safine svg #error_lamp path:nth-child(even) {
    -webkit-animation: error_lamp_anime 1200ms 600ms ease-in-out infinite;
    animation: error_lamp_anime 1200ms 600ms ease-in-out infinite;
}

@keyframes error_lamp_anime {
    0% {
        fill: #BECBD3;
    }

    50% {
        fill: #1E5CFF;
    }

    100% {
        fill: #BECBD3;
    }
}


.alien_error_inner.active .alien_item.error_safine svg #alien_inner {
    opacity: 1;
    transform: translateX(-5px);
    -webkit-animation: alien_alien 350ms linear infinite;
    animation: alien_alien 350ms linear infinite;
}

@keyframes alien_alien {
    0% {
        transform: translateX(-5px);
    }

    50% {
        transform: translateX(5px);
    }

    100% {
        transform: translateX(-5px);
    }
}


@keyframes error_light_anime {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


.alien_error_inner .alien_item.error_safine svg #bubble {
    opacity: 0;
}

.alien_error_inner.active .alien_item.error_safine svg #bubble {
    opacity: 1;
}



.alien_error_inner.active .error_light {
    -webkit-animation: alien_buzz 150ms linear infinite;
    animation: alien_buzz 150ms linear infinite;
    opacity: 1;
}


@keyframes alien_buzz {
    50% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    100% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
}


.alien_error_inner.active .alien_item.error_icon {
    -webkit-animation: alien_buzz 200ms ease-in-out infinite;
    animation: alien_buzz 200ms ease-in-out infinite;
}


.alien_error_inner .alien_item.error_icon svg {
    width: 150px;
    bottom: -80px;
    z-index: 6;
    transform: rotate(15deg);
    transition: all 1000ms ease-in-out;
    -webkit-animation: alien_bob 1500ms ease-in-out infinite;
    animation: alien_bob 1500ms ease-in-out infinite;
}

.alien_error_inner.active .alien_item.error_icon svg {
    bottom: 50px;
    transform: rotate(15deg);
    transition: all 3500ms ease-in-out;
    -webkit-animation: alien_icon 2500ms linear infinite;
    animation: alien_icon 2500ms linear infinite;
}


@keyframes alien_icon {
    0% {
        -webkit-transform: translateX(3px) rotate(2deg) rotate(15deg);
        transform: translateX(3px) rotate(2deg) rotate(15deg);
    }

    50% {
        -webkit-transform: translateX(-3px) rotate(-2deg) rotate(-15deg);
        transform: translateX(-3px) rotate(-2deg) rotate(-15deg);
    }

    100% {
        -webkit-transform: translateX(3px) rotate(2deg) rotate(15deg);
        transform: translateX(3px) rotate(2deg) rotate(15deg);
    }
}




.alien_item.error_inspace,
.alien_item.error_inspace_2 {
    z-index: 0;
    position: absolute;
}

.alien_item.error_inspace svg {
    top: 100px;
    left: -300px;
    width: 60px;
    z-index: 6;
    position: absolute;
    -webkit-animation: alien_bob 2000ms ease-in-out infinite;
    animation: alien_bob 2000ms ease-in-out infinite;

}

.alien_item.error_inspace_2 svg {
    top: 170px;
    right: -290px;
    width: 95px;
    z-index: 6;
    position: absolute;
    -webkit-animation: alien_bob 2500ms ease-in-out infinite;
    animation: alien_bob 2500ms ease-in-out infinite;

}

.alien_item.error_folder svg {
    width: 98px;
    right: 15px;
    left: auto;
    z-index: 7;
    bottom: -35px;
    transition: all 1000ms ease-in-out;
    -webkit-animation: alien_bob 1500ms ease-in-out infinite;
    animation: alien_bob 1500ms ease-in-out infinite;
}


.alien_error_inner.active .alien_item.error_folder svg {
    bottom: 30px;
    right: 45px;
    transition: all 2000ms ease-in-out;
    -webkit-animation: alien_bob 1500ms linear infinite;
    animation: alien_bob 1500ms linear infinite;
}

.alien_item.error_file svg {
    width: 77px;
    left: 30px;
    right: auto;
    z-index: 5;
    bottom: -43px;
    transition: all 1000ms ease-in-out;
    -webkit-animation: alien_bob 1500ms ease-in-out infinite;
    animation: alien_bob 1500ms ease-in-out infinite;
}

.alien_error_inner.active .alien_item.error_file svg {
    bottom: 50px;
    left: 55px;
    transition: all 2000ms ease-in-out;
    -webkit-animation: alien_bob 1500ms linear infinite;
    animation: alien_bob 1500ms linear infinite;
}

.alien_item.error_bg {
    z-index: 0;
    position: absolute;
}

.alien_item.error_bg svg {
    top: auto;
    bottom: 0;
    height: auto;
    z-index: 4;
    position: absolute;
}




.alien_item.error_plus svg {
    width: 12px;
    z-index: 6;
    bottom: 43px;
}


.alien_error_inner .alien_item.error_plus {
    opacity: 0;
}

.alien_error_inner.active .alien_item.error_plus {
    opacity: 1;
}

.alien_item.error_plus svg:nth-child(1) {
    left: -105px;
    -webkit-animation: plus_anime 3000ms linear infinite;
    animation: plus_anime 3000ms linear infinite;
}

.alien_item.error_plus svg:nth-child(2) {
    left: -55px;
    bottom: 50px;
    -webkit-animation: plus_anime 1500ms linear infinite;
    animation: plus_anime 1500ms linear infinite;

}

.alien_item.error_plus svg:nth-child(3) {
    right: 0;
    bottom: 0;
    -webkit-animation: plus_anime 2000ms linear infinite;
    animation: plus_anime 2000ms linear infinite;

}

.alien_item.error_plus svg:nth-child(4) {
    right: -60px;
    bottom: -15px;
    -webkit-animation: plus_anime 2500ms linear infinite;
    animation: plus_anime 2500ms linear infinite;
}

.alien_item.error_plus svg:nth-child(5) {
    right: -105px;
    bottom: 50px;
    -webkit-animation: plus_anime 1200ms linear infinite;
    animation: plus_anime 1200ms linear infinite;

}

.alien_item.error_plus svg:nth-child(6) {
    left: -15px;
    bottom: 90px;
    -webkit-animation: plus_anime 2800ms linear infinite;
    animation: plus_anime 2800ms linear infinite;

}

.alien_item.error_plus svg:nth-child(7) {
    right: -15px;
    bottom: 70px;
    -webkit-animation: plus_anime 1900ms linear infinite;
    animation: plus_anime 1900ms linear infinite;
}


@keyframes plus_anime {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    50% {
        transform: translateY(-90px) rotate(45deg);
        opacity: 0.5;
    }

    100% {
        transform: translateY(-150px) rotate(15deg);
        opacity: 0;
    }
}



.alien_error>b {
    display: block;
    font-weight: normal;
    text-align: center;
    margin: 50px auto 0;
    position: relative;
    z-index: 9;
    width: 100%;
    color: var(--color-black);
}

.alien_error>b>a {
    font-weight: normal;
    color: var(--color-primary);
    margin: 0 3px;
}

.alien_item.error_alien {
    right: auto;
    left: -500px;
    width: 400px;
    transform: rotate(0);
    -webkit-animation: alien_anime 2500ms cubic-bezier(1, 0, 0, 1) 1;
    animation: alien_anime 2500ms cubic-bezier(1, 0, 0, 1) 1;
}


@keyframes alien_anime {
    0% {
        right: auto;
        left: -500px;
        transform: rotate(0);
    }

    45% {
        left: -100px;
        transform: rotate(15deg);
    }

    70% {
        left: -100px;
        transform: rotate(15deg);
    }

    100% {
        left: -500px;
        transform: rotate(0);
    }
}




/* Bob */
@keyframes alien_bob {
    0% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }

    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }

    100% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}


body header, body footer {
    /*filter: blur(0);*/
    transition: filter 1s ease-in-out;
}

.inspace header, .inspace footer {
    /*filter: blur(15px);*/
    transition: filter 1s ease-in-out;
}



@media screen and (max-width: 992px) {
    .alien_error {
        margin: 0;
        overflow: hidden;
    }

    .alien_item.error_safine svg {
        right: -15px;
    }
}








/** update hot line ***/

.iconmask {
    clip-path: polygon(100% 50%, 100% 56.6%, 100% 59.3%, 100% 61.4%, 99.9% 63.2%, 99.9% 64.8%, 99.9% 66.2%, 99.8% 67.5%, 99.8% 68.7%, 99.7% 69.8%, 99.6% 70.8%, 99.5% 71.8%, 99.5% 72.8%, 99.4% 73.7%, 99.3% 74.6%, 99.1% 75.4%, 99% 76.3%, 98.9% 77%, 98.8% 77.8%, 98.6% 78.5%, 98.5% 79.2%, 98.3% 79.9%, 98.1% 80.6%, 98% 81.3%, 97.8% 81.9%, 97.6% 82.5%, 97.4% 83.1%, 97.2% 83.7%, 97% 84.3%, 96.8% 84.8%, 96.5% 85.4%, 96.3% 85.9%, 96% 86.4%, 95.8% 86.9%, 95.5% 87.4%, 95.3% 87.9%, 95% 88.3%, 94.7% 88.8%, 94.4% 89.2%, 94.1% 89.7%, 93.8% 90.1%, 93.4% 90.5%, 93.1% 90.9%, 92.8% 91.3%, 92.4% 91.7%, 92% 92%, 91.7% 92.4%, 91.3% 92.8%, 90.9% 93.1%, 90.5% 93.4%, 90.1% 93.8%, 89.7% 94.1%, 89.2% 94.4%, 88.8% 94.7%, 88.3% 95%, 87.9% 95.3%, 87.4% 95.5%, 86.9% 95.8%, 86.4% 96%, 85.9% 96.3%, 85.4% 96.5%, 84.8% 96.8%, 84.3% 97%, 83.7% 97.2%, 83.1% 97.4%, 82.5% 97.6%, 81.9% 97.8%, 81.3% 98%, 80.6% 98.1%, 79.9% 98.3%, 79.2% 98.5%, 78.5% 98.6%, 77.8% 98.8%, 77% 98.9%, 76.3% 99%, 75.4% 99.1%, 74.6% 99.3%, 73.7% 99.4%, 72.8% 99.5%, 71.8% 99.5%, 70.8% 99.6%, 69.8% 99.7%, 68.7% 99.8%, 67.5% 99.8%, 66.2% 99.9%, 64.8% 99.9%, 63.2% 99.9%, 61.4% 100%, 59.3% 100%, 56.6% 100%, 50% 100%, 43.4% 100%, 40.7% 100%, 38.6% 100%, 36.8% 99.9%, 35.2% 99.9%, 33.8% 99.9%, 32.5% 99.8%, 31.3% 99.8%, 30.2% 99.7%, 29.2% 99.6%, 28.2% 99.5%, 27.2% 99.5%, 26.3% 99.4%, 25.4% 99.3%, 24.6% 99.1%, 23.7% 99%, 23% 98.9%, 22.2% 98.8%, 21.5% 98.6%, 20.8% 98.5%, 20.1% 98.3%, 19.4% 98.1%, 18.7% 98%, 18.1% 97.8%, 17.5% 97.6%, 16.9% 97.4%, 16.3% 97.2%, 15.7% 97%, 15.2% 96.8%, 14.6% 96.5%, 14.1% 96.3%, 13.6% 96%, 13.1% 95.8%, 12.6% 95.5%, 12.1% 95.3%, 11.7% 95%, 11.2% 94.7%, 10.8% 94.4%, 10.3% 94.1%, 9.9% 93.8%, 9.5% 93.4%, 9.1% 93.1%, 8.7% 92.8%, 8.3% 92.4%, 8% 92%, 7.6% 91.7%, 7.2% 91.3%, 6.9% 90.9%, 6.6% 90.5%, 6.2% 90.1%, 5.9% 89.7%, 5.6% 89.2%, 5.3% 88.8%, 5% 88.3%, 4.7% 87.9%, 4.5% 87.4%, 4.2% 86.9%, 4% 86.4%, 3.7% 85.9%, 3.5% 85.4%, 3.2% 84.8%, 3% 84.3%, 2.8% 83.7%, 2.6% 83.1%, 2.4% 82.5%, 2.2% 81.9%, 2% 81.3%, 1.9% 80.6%, 1.7% 79.9%, 1.5% 79.2%, 1.4% 78.5%, 1.2% 77.8%, 1.1% 77%, 1% 76.3%, 0.9% 75.4%, 0.7% 74.6%, 0.6% 73.7%, 0.5% 72.8%, 0.5% 71.8%, 0.4% 70.8%, 0.3% 69.8%, 0.2% 68.7%, 0.2% 67.5%, 0.1% 66.2%, 0.1% 64.8%, 0.1% 63.2%, 0% 61.4%, 0% 59.3%, 0% 56.6%, 0% 50%, 0% 43.4%, 0% 40.7%, 0% 38.6%, 0.1% 36.8%, 0.1% 35.2%, 0.1% 33.8%, 0.2% 32.5%, 0.2% 31.3%, 0.3% 30.2%, 0.4% 29.2%, 0.5% 28.2%, 0.5% 27.2%, 0.6% 26.3%, 0.7% 25.4%, 0.9% 24.6%, 1% 23.7%, 1.1% 23%, 1.2% 22.2%, 1.4% 21.5%, 1.5% 20.8%, 1.7% 20.1%, 1.9% 19.4%, 2% 18.7%, 2.2% 18.1%, 2.4% 17.5%, 2.6% 16.9%, 2.8% 16.3%, 3% 15.7%, 3.2% 15.2%, 3.5% 14.6%, 3.7% 14.1%, 4% 13.6%, 4.2% 13.1%, 4.5% 12.6%, 4.7% 12.1%, 5% 11.7%, 5.3% 11.2%, 5.6% 10.8%, 5.9% 10.3%, 6.2% 9.9%, 6.6% 9.5%, 6.9% 9.1%, 7.2% 8.7%, 7.6% 8.3%, 8% 8%, 8.3% 7.6%, 8.7% 7.2%, 9.1% 6.9%, 9.5% 6.6%, 9.9% 6.2%, 10.3% 5.9%, 10.8% 5.6%, 11.2% 5.3%, 11.7% 5%, 12.1% 4.7%, 12.6% 4.5%, 13.1% 4.2%, 13.6% 4%, 14.1% 3.7%, 14.6% 3.5%, 15.2% 3.2%, 15.7% 3%, 16.3% 2.8%, 16.9% 2.6%, 17.5% 2.4%, 18.1% 2.2%, 18.7% 2%, 19.4% 1.9%, 20.1% 1.7%, 20.8% 1.5%, 21.5% 1.4%, 22.2% 1.2%, 23% 1.1%, 23.7% 1%, 24.6% 0.9%, 25.4% 0.7%, 26.3% 0.6%, 27.2% 0.5%, 28.2% 0.5%, 29.2% 0.4%, 30.2% 0.3%, 31.3% 0.2%, 32.5% 0.2%, 33.8% 0.1%, 35.2% 0.1%, 36.8% 0.1%, 38.6% 0%, 40.7% 0%, 43.4% 0%, 50% 0%, 56.6% 0%, 59.3% 0%, 61.4% 0%, 63.2% 0.1%, 64.8% 0.1%, 66.2% 0.1%, 67.5% 0.2%, 68.7% 0.2%, 69.8% 0.3%, 70.8% 0.4%, 71.8% 0.5%, 72.8% 0.5%, 73.7% 0.6%, 74.6% 0.7%, 75.4% 0.9%, 76.3% 1%, 77% 1.1%, 77.8% 1.2%, 78.5% 1.4%, 79.2% 1.5%, 79.9% 1.7%, 80.6% 1.9%, 81.3% 2%, 81.9% 2.2%, 82.5% 2.4%, 83.1% 2.6%, 83.7% 2.8%, 84.3% 3%, 84.8% 3.2%, 85.4% 3.5%, 85.9% 3.7%, 86.4% 4%, 86.9% 4.2%, 87.4% 4.5%, 87.9% 4.7%, 88.3% 5%, 88.8% 5.3%, 89.2% 5.6%, 89.7% 5.9%, 90.1% 6.2%, 90.5% 6.6%, 90.9% 6.9%, 91.3% 7.2%, 91.7% 7.6%, 92% 8%, 92.4% 8.3%, 92.8% 8.7%, 93.1% 9.1%, 93.4% 9.5%, 93.8% 9.9%, 94.1% 10.3%, 94.4% 10.8%, 94.7% 11.2%, 95% 11.7%, 95.3% 12.1%, 95.5% 12.6%, 95.8% 13.1%, 96% 13.6%, 96.3% 14.1%, 96.5% 14.6%, 96.8% 15.2%, 97% 15.7%, 97.2% 16.3%, 97.4% 16.9%, 97.6% 17.5%, 97.8% 18.1%, 98% 18.7%, 98.1% 19.4%, 98.3% 20.1%, 98.5% 20.8%, 98.6% 21.5%, 98.8% 22.2%, 98.9% 23%, 99% 23.7%, 99.1% 24.6%, 99.3% 25.4%, 99.4% 26.3%, 99.5% 27.2%, 99.5% 28.2%, 99.6% 29.2%, 99.7% 30.2%, 99.8% 31.3%, 99.8% 32.5%, 99.9% 33.8%, 99.9% 35.2%, 99.9% 36.8%, 100% 38.6%, 100% 40.7%, 100% 43.4%);
    width: 100px;
    min-width: 100px;
    height: 100px;
    border-radius: 0;
}

.icon_row .posthumb2_title a.posthumb2_h2 {
    margin-bottom: 6px;
}

.posthumb2_cat.app_name_post2 {
    margin-right: 10px;
    background: var(--color-light);
    padding: 3px 10px;
    font-size: 13px;
    margin: 2px 10px 0 0;
    border-radius: 8px;
}

.posthumb2_cat.app_name_post2:hover {
    background: var(--color-dark);
    color: var(--color-white);
}

.swiper-button-prev, .swiper-button-next {
    background: transparent !important;
}

.swp-nav-gp {
    position: absolute;
    left: 0;
    top: 0;
    margin: 35px;
    display: flex;
    flex-direction: row-reverse;
}

.sec_swp {
    overflow: hidden;
    position: relative;
}

.swp-nav-gp .swp-nav {
    position: relative !important;
    top: 0;
    left: 0 !important;
    bottom: 0;
    right: 0 !important;
    float: right;
    width: 24px;
    height: 24px;
    margin: 2px 5px;
}

.swp-nav-gp .swp-nav:after {
    display: none;
}


.swiper-pagination-progressbar {
    position: relative !important;
    bottom: 0;
    top: auto !important;
    max-width: 100px;
    border-radius: 9px;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden;
    right: 0;
    left: 0 !important;
    margin: 10px auto 0 !important;
    background: var(--color-light) !important;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--color-light3) !important;
}




/**update 1.3 ***/

footer {
    background: #FBFBFB;
    padding: 50px 0;
}

.row_footer>aside>h3 {
    font-size: 20px;
    font-weight: bold;
    color: var(--color-primary);
}


footer .social {
    margin: 10px 0;
}

.social li {
    margin-left: 20px;
    width: auto;
}

.social li svg {
    width: 22px;
    height: 22px;
}

.sidelinks li a {
    font-size: 16px;
    padding: 5px 0;
}

.row_footer>aside>span {
    color: #999da8;
}


.cpr {
    padding: 20px 50px;
    margin: 35px auto 15px;
    border-radius: 10px;
    background: var(--color-primary2);
}


.inner_cpr p {
    font-size: 20px;
    margin: 0;
    padding: 0;
}


.inner_cpr p svg {
    margin-left: 5px;
}


.footer_2nd {
    background: linear-gradient(180deg, rgba(0, 71, 255, 0.05) 0%, rgba(255, 255, 255, 0.05) 100%);
    padding: 100px 0 50px;
    margin-top: -57px;
}

.sidelogos {
    justify-content: left;
}

.sidelogos li {
    background: var(--color-white);
}

.row_footer>aside.about_footer>h3 {
    color: var(--color-black);
    font-weight: normal;
}

.row_footer>aside.about_footer>span {
    display: block;
    padding: 5px 0;
    text-align: justify;
    line-height: 1.6em;
    width: 100%;
}

.about_more {
    color: var(--color-primary);
    display: inline-block;
    padding: 5px 0;
    margin: 0;
    cursor: pointer;
    font-weight: normal;
}

.about_more:hover, .about_more:focus {
    color: var(--color-primary2);
}

.about_more svg {
    height: 20px;
    margin-right: 5px;
    width: 7px;
}

.logos_footer {
    max-width: 400px;
}

.row_footer>aside.big_aside {
    min-width: 45%;
}




.subscribe_form {
    max-width: 400px;
}

.subscribe_form form {
    display: flex;
    flex-wrap: nowrap;
    margin: 0;
    padding: 0;
}

.subscribe_form form input[type="email"] {
    margin: 0 !important;
    padding: 5px 15px;
    background: rgba(255, 255, 255, 0.25);
    border: 0;
    font-family: "SF", "Bakh";
    font-weight: normal;
    font-size: 19px;
    color: #fff !important;
}

.subscribe_form form button, .subscribe_form form button:hover, .subscribe_form form button:focus {
    margin: 0;
    margin-right: 0px;
    padding: 5px;
    color: #fff !important;
    background: #1F2984 !important;
    border: 0 !important;
    max-width: 100px;
    margin-right: 20px;
}


.subscribe_form ::-webkit-input-placeholder {
    color: #fff !important;
}

.subscribe_form :-moz-placeholder {
    color: #fff !important;
}

.subscribe_form ::-moz-placeholder {
    color: #fff !important;
}

.subscribe_form :-ms-input-placeholder {
    color: #fff !important;
}

.breadcrumb {
    background: transparent;
    direction: rtl;
}

.breadcrumb-item {
    display: flex;
    align-items: center;
}

.breadcrumb-item.active,
.breadcrumb li a {
    color: #979797;
}

.breadcrumb li a:hover, .breadcrumb li a:focus {
    color: #333;
}

.breadcrumb-item+.breadcrumb-item::before {
    float: right;
    padding: 5px !important;
    margin: 0;
    margin-left: 10px;
    content: "";
    background-image: url('../svg/crumb.svg');
    background-size: 100%;
    width: 18px;
    height: 18px;
}



/*vote*/
.full_vote_box {
    background: #EEF7FF;
    padding: 25px;
    border-radius: 25px;
    max-width: 100%;
    margin: 50px auto;
    width: 70%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    position: relative;

}

.full_vote_box>label {
    font-size: 20px;
    margin: 0;
    width: 100%;
}

.vote-buttons {
    display: flex;
    align-items: center;
    justify-content: end;
    width: 100%;
}

.vote-buttons.voted {
    pointer-events: none;
}

.vote-btn:hover, .vote-btn:focus,
.vote-btn {
    background: #D6E9F9 !important;
    border: 3px solid #D6E9F9 !important;
    border: 0;
    margin: 0 10px;
    padding: 15px 5px;
    border-radius: 25px;
    min-height: 144px;
}

.vote-btn:hover, .vote-btn:focus {
    cursor: pointer;
    border: 3px solid #B2D4F3 !important;
}

.vote-buttons.voted .vote-btn {
    opacity: 0.6;
    transform: scale(0.9);
    transition: all 200ms ease-in-out;
}

.vote-buttons.voted .vote-btn.clicked {
    opacity: 1;
    transform: scale(1.03);
    transition: all 200ms ease-in-out;
    border: 3px solid #B2D4F3 !important;
}

.vote-btn img {
    width: 40px;
    display: block;
    margin: 0 auto 15px;
    cursor: pointer;
}

.vote-btn label {
    display: block;
    margin: 0;
    text-align: center;
    color: #000;
    font-size: 16px;
    cursor: pointer;
}

.vote-btn small {
    display: block;
    text-align: center;
    width: 100%;
    color: var(--color-primary);
    cursor: pointer;
    font-size: 20px;
}



.collapsed_span {
    display: block;
    overflow: hidden;
    margin: 5px 0 !important;
    padding: 0 !important;
    display: -webkit-box !important;
    /*-webkit-line-clamp: 3;*/
    line-clamp: 3;
    -webkit-box-orient: vertical;
    transition: all 500ms linear;
}

.expanded .collapsed_span {
    -webkit-line-clamp: unset;
    line-clamp: unset;
    transition: all 500ms linear;
}

.expanded .about_more {
    font-size: 0;
    display: inline;
}

.expanded .about_more::before {
    content: "بستن";
    font-size: 16px;
    position: relative;
    top: 2px;
    margin-right: 5px;
}


.sec_descriptions {
    max-width: 900px;
    margin: 15px auto;
    padding: 0 15px;
    text-align: center;
}

.sec_descriptions .collapsed_span {
    color: #9ea3af;
    text-align: center;
}

.sec_descriptions .more_span {
    margin: 0 auto;
    text-align: center;
    float: none;
}

/***update 3.1***/
.ruby {
    display: ruby;
    width: 100%;
}

.alert.app_alert {
    width: 100%;
    margin: 0 auto;
    font-size: 16px;
    border: 0;
    position: relative;
    padding-right: 45px;
    color: #8E8E93;
}


.alert.app_alert::before {
    content: "";
    border: 0;
    left: auto;
    background: url('../svg/info.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    position: absolute;
    right: 10px;
    height: 20px;
    width: 20px;
    margin: 2px;
}

.author_face_box {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    margin-bottom: 25px;
}

.author_face {
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto 10px;
}

.author_name {
    display: block;
    text-align: center;
    width: auto;
    margin: 0 auto;
}

.author_name b {
    color: var(--color-black);
    font-size: 23px;
    font-weight: bold;
}

.author_sec_inner>span {
    text-align: center;
    max-width: 70%;
    display: block;
    margin: 0 auto;
    color: #525252;
    font-size: 17px;
    line-height: 1.7em;
}

.social.shareit.author_social_links li a {
    background: var(--color-black);
    border-radius: 50%;
}

.social.shareit.author_social_links li a:hover, .social.shareit.author_social_links li a:focus {
    background: var(--color-dark2);
    border-radius: 50%;
}

.social.shareit.author_social_links li a svg path {
    fill: var(--color-white);
}


#article_navbar {
    max-width: 300px;
    min-width: 300px;
    width: 100%;
    padding: 0;
}

.single_pills {
    padding: 0 0 50px;
}

.article_navbar_inner ul {
    list-style-type: disc;
    padding-right: 17px;
}

.article_navbar_inner ul ul {
    list-style-type: decimal;
}

.article_navbar_inner ul li {
    color: #979797;
    width: 100%;
    margin: 0;
}


.article_navbar_inner ul li a {
    color: #979797;
    padding-top: 5px;
    padding-bottom: 5px;
}

.article_navbar_inner ul li.current a {
    color: #1E5CFF;
}


.nav-item>ul {
    display: none;
}

li.nav-item.active-link>ul {
    display: block;
}



/*grids*/
.sw_big {
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
}

.sw_big .swp-nav-gp svg path {
    fill: var(--color-white);
}

.big_slider_item {
    overflow: hidden;
    position: relative;
    margin: 0;
    border-radius: 0;
}

.sw_big .swiper-wrapper {
    border-radius: 18px;
    overflow: hidden;
}

.sw_big .swiper-slide:first-child .big_slider_item {
    border-radius: 0 18px 18px 0;
}


.sw_big .swiper-slide:last-child .big_slider_item {
    border-radius: 18px 0 0 18px;
}


.big_slider_item_gradient::after {
    content: "";
    /*background: linear-gradient(180deg, rgba(0, 92, 255, 0) 20%, #005CFF 80%);*/
    height: 60%;
    z-index: 9;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
}

.big_slider_item .big_slider_det {
    position: absolute;
    z-index: 99;
    bottom: 0;
    right: 0;
    left: 0;
    padding: 35px;
    align-items: end;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}


.big_slider_det h2 {
    color: var(--color-white);
    display: block;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 5px 0 0 0;
    font-weight: bold;
    font-size: 26px;
}

.big_slider_det p {
    color: var(--color-white);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 0;
    margin-top: 8px;
    margin-bottom: 0;
    opacity: 0.8;
    font-size: 15px;
}


.big_slider_item .sliderlink, .big_slider_item .sliderlink:hover, .big_slider_item .sliderlink:focus, .big_slider_item .sliderlink:active {
    width: auto;
    margin: 0;
    background: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    font-size: 15px !important;
    white-space: nowrap;
    color: var(--color-white);
    border: 0 !important;
    margin-right: 15px;
}

.big_slider_item .sliderlink:hover, .big_slider_item .sliderlink:focus, .big_slider_item .sliderlink:active {
    background: rgba(255, 255, 255, 0.4) !important;
}

.container.nopad {
    padding-right: 4px;
    padding-left: 4px;
}


/*card_item*/
.sw_cards.container {
    padding: 0;
    overflow: hidden;
}

.sw_cards .swiper-slide {
    max-width: 33.3333%;
}

.card_thumb {
    margin: 0;
    padding: 15px;
}

.card_item {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
}

.card_item .icon_row {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 9;
    padding: 15px 0;
    align-items: center;
    margin: 0 15px;
}

.card_item .icon_row:before {
    content: "";
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    position: absolute;
    top: 0;
    width: 100%;
}

.card_item .icon_row .iconmask {
    width: 66px;
    height: 66px;
    min-width: 66px;
}

.card_item .icon_row a h2, .card_item .icon_row a p {
    color: var(--color-white);
}

.card_item .icon_row a h2 {
    font-size: 17px;
    padding-left: 120px;
}

.card_item .icon_row a p {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.8);
    margin-top: 0;
}

.card_item .icon_row .btn.downloadlink, .card_item .icon_row .btn.downloadlink:focus, .card_item .icon_row .btn.downloadlink:hover {
    background: var(--color-white) !important;
    border-color: var(--color-white) !important;
    color: var(--color-primary) !important;
    font-weight: bold;
    padding: 3px 19px;
    height: 35px;
    line-height: inherit;
    max-width: 96px;
}


.card_item_gradient {
    position: absolute;
    right: -30px;
    left: -30px;
    bottom: 0;
    top: -50px;
    z-index: -1;
}


.card_item_badge {
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 30px;
    margin: 20px;
    padding: 6px 14px;
    font-size: 13px;
}


/*update ai search*/
.ai_search {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 67px;
    z-index: 0;
    height: 67px;
    overflow: hidden;
}

.ai_search svg {
    position: relative;
    display: block;
    width: 90px;
    min-width: 90px;
    min-height: 90px;
    margin: -12px;
}


.search_title_ai {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.search_title_ai strong {
    font-weight: normal;
    font-size: 30px;
    color: var(--color-primary);
}

.search_title_ai label {
    font-weight: normal;
    font-size: 30px;
    color: var(--color-light3);
}


.app_results {
    overflow: hidden;
}


.aisuggest_list {
    list-style: none;
    margin: 0;
    padding: 0;
}


.aisuggest_list li a {
    background: var(--color-light);
    color: var(--color-black);
    padding: 25px;
    border-radius: 20px;
    margin: 0 0 10px 10px;
    display: block;
    display: flex;
    flex-direction: column;
    min-height: 210px;
    justify-content: space-between;
}

.aisuggest_list li a b {
    font-weight: normal;
    font-size: 16px;
}

.ai_suggest_icon {
    text-align: left;
    background: var(--color-white);
    width: 42px;
    height: 42px;
    display: flex;
    align-content: center;
    justify-content: center;
    border-radius: 50%;
}

.aisuggest_list li a:hover, .aisuggest_list li a:focus {
    background: var(--color-light2);
    color: var(--color-black);
}