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

1. Insert Font Family

2. Template default CSS
   1.1	Variables

3. Header Section

4. Trend Menu

4. Sidebar

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

/* Start Font Family */


@keyframes lightbeam {
    0% {
        transform: translate(-50%, -50%) scale(0) ; 
    }
    50% {
        transform: translate(-50%, -50%) scale(1)
    }
    100%{
        transform: translate(-50%, -50%) scale(0)
    }

    
}

h2{
    font-size: 25px;
    position: relative;
    text-transform: capitalize;
    transition: all 0.5s ease-in-out;
  }
  h2::after{
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 250px;
    height: 250px;
    background: radial-gradient(circle, rgba(217, 222, 136, 0.425)20%,rgba(218, 222, 135, 0)60% );
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: lightbeam 4.5s infinite ease-in-out;
  }


@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;
    color: rgb(0, 0, 0);
    background:  rgb(231, 247, 247);
}
/* background: linear-gradient(to right, rgb(182, 244, 146 , .5), rgb(51, 139, 147, .3)) !important; */
i{
    color: #000 !important;
}
.bg-custome{
    background-color:  #ecfcfa;
}
.font-size-9px{
    font-size: 11px !important;
}

.displaynone{
    display: none !important;
}

.display-flex{
    display: flex !important;
}


@keyframes menuRun {
    from {
      transform: rotatex(0) scale(0);
    }
    to{ transform:rotatex(0) scale(1) ;

    }

    
  }

  .animation{
    animation: menuRun 900ms ease-in-out 0s;
  }

.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;
}


#searchbar-wrapper {
    position: absolute;
}

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

#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;
}
.displayNone{
    display: none;
    
}
@keyframes menuRun {
    from {
      transform: rotatey(0) scale(0);
    }
    to{ transform:rotatey(1) scale(1) ;

    }
  }


  #hideMenu{
    animation:menuRun 1s 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;
    
  }

.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(234, 183, 183, 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;
}