/*------------------------------------------------------------------

1. Insert Font Family

2. Template default CSS
   1.1	Variables

3. Header Section

4. Trend Menu

4. Sidebar

 -------------------------------------------------------------------*/

/* Start Font Family */

@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Fat.woff2") format('woff2');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Medium.woff2") format('woff2');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Bold.woff2") format('woff2');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Heavy.woff2") format('woff2');
    font-weight: 800;
    font-style: normal;
}


@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Light.woff2") format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-display: swap;
    font-family: "yekan-bakh";
    src: url("../font/yekan-bakh/YekanBakhFaNum-Regular.woff2") format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* End Font Family */

* {
    box-sizing: border-box;
    outline: 0;
}

html,
body {
    font-family: "yekan-bakh", sans-serif;
    direction: rtl;
    background-color: rgb(229, 212, 207); 
    color: #0d1600;   
}
/* background: linear-gradient(to right, rgb(182, 244, 146 , .5), rgb(51, 139, 147, .3)) !important; */

.bg-custome{
    background-color:rgb(239, 228, 224);
}


.bi {
    font-size: 1.2em;
    
}

button, input {
    overflow: visible;
}

/* Start Variables */

.top-0 {
    top: 0;
}

.right-0 {
    right: 0;
}

.left-0 {
    left: 0;
}

.bottom-0 {
    bottom: 0;
}

.line-h-0 {
    line-height: 0;
    cursor: pointer;
}

.cursor-pointer {
    cursor: pointer;
}

.border-radius-full {
    border-radius: 100px;
}

.border-radius-50 {
    border-radius: 50%;
}

.font-size-12 {
    font-size: 12px;
}

.font-size-13 {
    font-size: 13px;
}

.font-size-14 {
    font-size: 14px;
}
 
.font-size-25{
    font-size: 25px;
}
.font-size-em-95 {
    font-size: .95em;
}

.font-size-em-85 {
    font-size: 0.85em;
}

.font-size-em-1 {
    font-size: 1em;
}

.border-none {
    border: none;
}

.fw-bold {
    font-weight: bold;
}

.fw-500 {
    font-weight: 500;
}

.border-blue {
    border: 1px solid rgb(5, 163, 232);
}

.hover-bg-opacity-7:hover {
    opacity: .7;
}

/* End Variables */

/* Start Header Section */

.navbar {
    height: 65px;
    z-index: 21;
    box-shadow: rgba(0, 0, 0, 0.1) 1px 0 7px 0;
}

.navbar .wrapper {
    max-width: none;
    padding: 0 1.5em;
    vertical-align: middle;
}

.navbar .wrapper .sc {
    color: rgb(33, 34, 38);
}

.navbar .wrapper .header-row .row-item .menu-btn {
    appearance: none;
    width: 2.778em;
    height: 2.778em;
    color: rgb(111, 114, 133);
    background-color: transparent;
    border: 1px solid transparent;
}

.navbar .wrapper .header-row .row-item .menu-btn:hover, .navbar .wrapper .header-row .row-item .menu-btn:focus, .navbar .wrapper .header-row .row-item .menu-btn:active {
    background-color: rgb(245, 245, 249);
    opacity: .7;
}

.navbar .wrapper .header-row .row-item .btn-person {
    color: rgb(111, 114, 133);
}

.navbar .wrapper .header-row .row-item .btn-person:hover {
    background-color: rgb(245, 245, 249);
}

#searchbar-wrapper {
    position: absolute;
}

#searchbar-wrapper .input-box {
    height: 46px;
    flex: 1 1 0;
    padding: 0 1em;
    background: rgb(245, 245, 249);
    border: 1px solid rgb(245, 245, 249);
    font-size: 0.95em;
    transition: 300ms;
}

#searchbar-wrapper .input-box > .row {
    color: rgb(111, 114, 133);
}

.input {
    width: 100%;
    color: rgb(72, 75, 98);
    border: medium;
    outline: none;
    resize: none;
    background: transparent;
    appearance: none;
    padding-right: 14px;
    padding-bottom: 0.5em;
    line-height: 1.8em;
    font-size: 0.93em;
    font-weight: 400;
}

#searchbar-wrapper .input-box .row .end-icon {
    padding: 14px;
    color: rgb(111, 114, 133);
}

/* End Header Section */

/* Start Trend Menu */

.video-arat {
    min-height: 100vh;
}

.video-arat.sidebar-slide {
    padding-right: 240px;
}

.trend-menu {
    min-height: 42px;
    background-color: rgb(245, 245, 249);
    padding: 0.5em 2em;
}

.video-arat.list-responsive > .list {
    padding: 0 1em;
}

.video-arat .list {
    margin: 0 auto;
}

.video-arat .label {
    color: rgb(41, 42, 51);
}

.video-arat .trend-item {
    display: inline-flex;
    padding: 0 0.75em;
    font-weight: 300;
    line-height: 1.8;
    border-radius: 3px;
    color: rgb(255, 255, 255);
    background-color: rgb(223, 15, 80);
    margin: 0.1em 0 0.1em 1em;
}

/* End Trend Menu */

/* Start Sidebar */

.video-arat.sidebar-slide .sidebar {
    top: 65px;
}

.video-arat .aside {
    width: 240px;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 5;
    background-color: rgb(251, 251, 252);
    overflow: hidden auto;
}

.simple-bar-wrapper {
    width: inherit;
    height: inherit;
    max-width: inherit;
    max-height: inherit;
}

.simple-bar-height-auto-observer-wrapper {
    box-sizing: inherit !important;
    max-width: 1px;
    max-height: 1px;
    z-index: -1;
    pointer-events: none;
}

.simple-bar-height-auto-observer {
    box-sizing: inherit;
    opacity: 0;
    min-height: 1px;
    min-width: 1px;
    pointer-events: none;
    z-index: -1;
}

.simple-bar-mask {
    direction: inherit;
    z-index: 0;
}

.simple-bar-offset {
    direction: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.simple-bar-content-wrapper {
    direction: inherit;
    box-sizing: border-box !important;
    max-width: 100%;
    max-height: 100%;
    -ms-overflow-style: none;
}

.menu-wrapper {
    padding: 0.75em 0;
}

.menu-wrapper .menu-list .menu-item.is-active {
    background-color: rgb(245, 245, 249);
}

.menu-wrapper .menu-list .menu-item {
    transition: 300ms ease-in-out;
    -moz-box-align: center;
    height: 3em;
    padding: 0.5em 1.5em;
}

.menu-wrapper .menu-list .menu-item .is-active {
    color: rgb(223, 15, 80);
}

.menu-wrapper .menu-list .menu-item a div span {
    color: rgb(72, 75, 98);
}
/* saman moghadam  */
.pl-32px{
    padding-left: 32px;
}
.pr-48px{
    padding-right: 48px;
}
a{
    color: #000;
    cursor: pointer;
}
a:hover{
    text-decoration: none;
}
.display-None{
    display: none !important;
    
}
.display-flex{
    display: flex !important;
}
@keyframes menuRun {
    from {
      transform: rotatey(0) scale(0);
    }
    to{ transform:rotatey(1) scale(1) ;

    }
  }
  .font-size-15{
    font-size: 15px !important;
  }

  .animation{
    animation: menuRun 800ms ease-in-out 0s;
  }
  .rotated-180{
    transform: rotate(180deg);
  }

  .border-radius-30{
   border-radius: 30px;

   }
   .border-radius-5{
    border-radius: 5px;
   }

   .box-count-live{
    border: 1px solid rgb(211, 214, 224);
    background-color: rgb(245, 245, 249);
   }
   .font-size-px-10{
    font-size: 10px;
    
   }
   ul{
    list-style: none;
   }
   .h-15rem{
    height: 15rem !important;
   }
  /* body{
    background-color:#2B2B28 ;
  }
   .head{
     background: linear-gradient(102.2deg, rgb(109, 118, 150) 7.1%, rgb(89, 72, 79) 14.7%, rgb(69, 92, 79) 28%, rgb(204, 85, 67) 43.4%, rgb(237, 181, 121) 60.2%, rgb(219, 230, 175) 76.8%);
   }
   .hed-body{
    background-color: #3FFF00;
   } */
   .ax{
    border-radius: 100% !important;
   }
   .swiper {
    width: 100%;
    height: 350px;
    opacity: 0.89;
    
  }
  .background-secondary{ 
    background:rgba(140, 130, 130, 0.18) ; 
    

  }

  .span-costume-1{
    background-color: rgb(255, 252, 254);
    border:solid rgb(51, 25, 39);
    width: fit-content;
    
    
  }
.bg-black{
    background-color: #39333399
}
.span-costume{
    background-color: rgba(241, 206, 7, 0.642);
    width:fit-content ;
}
.font-size-18{
    font-size: 18px;
}
.base-box-shadow{
    box-shadow: 0 0 10px 0 rgba(226, 114, 114, 0.4);
}

.border-radius-25{
    border-radius: 25px;
}
 
.font-size-15{
    font-size: 15px;
}
/* End Sidebar */


.border-b{
    border-bottom: #5a56337c solid 2px;
    width: fit-content;
}

.dizain{
    position: absolute;
    right: 0;
    border-radius: 100%;
    background-color: rgb(237, 203, 13 )!important;
    opacity: .2;
    filter: blur(40px);
    width: 350px;
    height: 350px;
}

.dizain2{
    position: absolute;
    left: 0;
    border-radius: 100%;
    background-color: rgb(237, 125, 13)!important;
    opacity: .2;
    filter: blur(40px);
    width: 350px;
    height: 350px;

}
/* .dizain3{
    position: absolute;
    left: 1rem;
    right: 5rem;
    top: 10rem;
    border-radius: 100%;
    background-color: rgb(235, 229, 191)!important;
    opacity: .1;
    filter: blur(20px);
    width: 300px;
    height: 300px;
} */

.page{
    animation: blink 6s infinite;
}