/* خدا، به نامش */
/* hi lit */
    ::selection {
      color: #aaa;
      background: #fff6d5ff;
    }
/* hi lit */
html, body{
                scrollbar-color: #e1c10a80 #fff;
                scrollbar-width: thin;
    background: url("نگارخانه/پس.svg");
    background-repeat: repeat;
    background-size: 20vh;
}
*{margin:0;}
/* image */
.img  {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.tozi {
  font-family: "Vazir" !important;
color:
#532f00;
font-size: 2.5vh;
}
hr.khat {
  border: 0.1vh solid #C9AC3A50;
  width: 100%;
  transform: scale( 0.9,0.5);
  }
.qaabaxkarbar{
position:relative; 
z-index: 2;
width: 25vh;
max-width: 50vw;
transform: translate(00px, 6vh);
border-radius: 100%;
border: 1px solid #D6C16E;
}
.zirax {
  font-family: "Vazir" !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.baazkhaane {
  z-index: 20;
  position: fixed;
  right: 50%;
  display: block;
  width: 15vh;
    height: 7.5vh;
  max-width: ;
  transition: 0.3s;
  opacity: 1;
  transform: translate(50%, -5vh);
  background-image: url("نگارخانه/دکمه/خانه۳۱.svg");
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;     
  box-shadow: 0vh 0vh 4vh -1vh #c8ab37;
    border-radius: 2.5vh;
}
.baazkhaane:hover {
  cursor: pointer;
  transform: translate(50%, 0vh);
  background-image: url("نگارخانه/دکمه/خانه۳.svg");
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;     
  box-shadow: 0vh 0vh 0vh -10vh #fff;
border-radius: 5vh;
}
.rangi{
border: 1px solid #D6C16E;
border-radius: 2vh;
margin: 0.1vh;
}
.rangi:hover{
}
.karbarjaraqe{
border-radius: 1vh;
width: 4vh;
margin: 0.5vh;
}
.vasati {
  display: block;
  width: 74%;
  max-width: 90vw;
  transition: 0.5s;
  opacity: 1;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.vasati:hover {
  cursor: pointer;
  opacity: 0.8;
  filter: grayscale(100%) sepia(100%);
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.vasati:active {
  display: block;
  cursor: pointer;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.vasati:focus {
  display: block;
  cursor: pointer;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.bozogsho {
  transition: 0.2s;
  scale: 1;
}
.bozogsho:hover {
  scale: 1.1;
  cursor: pointer;
}
.tozi2 {
  color:#c8ab37;
  background: white;
  border-radius: 5vh;
  padding: 3vh;
  animation: namayesh-tozi 10s forwards;
  box-shadow: 1vh 1vh 1vh #CCC6AD50 , -1vh -1vh 1vh #ffffff;
  width: max-content;
  animation-delay: 2s;
  opacity: 0;
  border: solid 0.05vh #c8ab3780;
}
.sia-nevis {
  color:#aaa;
}
.chap-nevis {
  text-align: left;
}
.riz-nevis {
  font-size: 2vh;
}
.neveshte {
  opacity:0.9;
  transition: 0.2s;
  text-decoration: none; 
  color:#e6dfc4;
}
.neveshte:hover {
  opacity:1;
  cursor: pointer;
}
.jaraghe {
  transition: 0.2s;
  width: 10vh;
  float: right;
  margin-left: 1vw;
border: 1px solid #D6C16E;
}
.pizhdokme {
  width: 100%;
  max-width: 50vh;
  opacity:1;
  border-radius: ;
  transition: 0.2s;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.pizhdokme:hover {
  opacity:0.5;
  cursor: pointer;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.jadokme{
display: flex;
margin: 0 auto;
width: 45vh;
}
.sanjaqi{
								padding: 3vh;
								float: right;
}
.chapchasb {
  display: block;
  width: 7vh;
  opacity:1;
  border-radius: 20%;
  transition: 0.2s;
  float: left;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.chapchasb:hover {
  opacity:0.5;
  cursor: pointer;
  outline:0.1px solid #fff;
  outline-width: 0.1px;
}
.beyn {
  width: 3vh;
  height: 7vh;
  float: right;
}
.qaabax2 {
  border: calc( (0.1vh) + (0.1vw) ) solid #E4c28D;
  background: #fff;
  opacity:1;
  border-radius: 5vh;
  transition: 0.2s;
}
.tozi-ki1{
display: inline;
position: relative;
  color: #c8ab3780;
opacity:1;
font-size: 0;
transition: 0s;
}
.ki:hover
.tozi-ki1{
opacity:1;
font-size: 2vh;
transition: 0.5s;
margin-right: 1vh; 
}
.ki:hover
.qaabax{
width: 15vh;
}
.key{
float: left;
}
.key:hover
.tozi-key1{
cursor: help;
opacity:1;
font-size: 1.7vh;
transition: 0.2s;
padding: 1vh;
margin-right: 1vh; 
transition: 0s;
}
.key:hover
.key0{
opacity: 0;
font-size: 0;
transition: 0s;
}
.tozi-key1{
opacity: 0;
float: left;
font-size: 0;
}
.qaabax {
  border: 0.1vh solid #c8ab3780;
  display: block;
  opacity:1;
  border-radius: 5vh;
  transition: 0.2s;
  width: 4vh;
  height: 4vh;
  padding: 0.3vh;
}
.ax {
  display: inline-block;
  height: 100%;
  opacity:1;
  float: right;
  border-radius: 100%;
  transition: 0.2s;
}
.shafaf {   
  opacity: 1;
  transition: 0.3s;
}
.shafaf:hover {   
  opacity:0.5;
  cursor: pointer;
  transition: 0.3s;
}
.gonde {
  display: block;
  width: 7vh;
  opacity:1;
  border-radius: 100%;
  transition: 0.2s;
  float: right;
}
.gonde:hover {   
  opacity:0.5;
  cursor: pointer;
}
.riz {
  display: block;
  width: 2.5vh;
  opacity:1;
  border-radius: 100%;
  transition: 0.2s;
  float: right;
}
.riz:hover {   
  width: 7vh;
  opacity:0.5;
  cursor: pointer;
}
.dokme {
  cursor: default; 
  opacity:1;
  width: 100%;
}
.dokme:hover { 
  cursor: pointer;   
  opacity:0.7;
}
.qaab {
    display: block; 
  font-family: "Vazir";
  font-size: 2.5vh;
  color: #c8ab37ff;
  border-radius: 5vh;
  background: #fff;
  padding: 3vh;
  margin: 2vh;
            border-style: solid;
            border-color: #c8ab3780;
            border-width: 0.1vh;
              box-shadow: 
              1vh 1vh 1vh #CCC6AD50, 
              -1vh -1vh 1vh #ffffff;
}
.zirqaab {
    display: block; 
  font-family: "Vazir" !important;
  font-size: 2.5vh;
  color: #c8ab37ff;
  border-radius: 5vh;
  border: none;
  padding: 3vh;
}
.qaab2 {
  font-family: "Vazir" !important;
  font-size: 2.5vh;
  color: #c8ab37ff;
  border-radius: 5vh;
  background: #fff6d5ff;
  padding: 3vh;
            border-style: solid;
            border-color: #c8ab3780;
            border-width: 0.05vh;
              box-shadow: 
              7px 7px 13px #CCC6AD50 inset , 
              -7px -7px 13px #ffffff inset;
}
.qaab3{
  border-radius: 5vh;
  background: #fff6d5ff;
            border-style: solid;
            border-color: #c8ab3780;
            border-width: 0.05vh;
}
.qaab4{
  border-radius: 5vh;
  background: #fff;
            border-style: solid;
            border-color: #c8ab3780;
            border-width: 0.05vh;
}
.rokhdad{
display: inline-grid;
width: 100%;
grid-template-columns: 50% 50%;
}
.bznboro{
display: grid;
grid-template-columns: 75% 25%;
}
.gooshgerd{
border-top-left-radius: 7.5vh;
border-top-right-radius: 7.5vh;
border-bottom-left-radius: 2vh;
border-bottom-right-radius: 2vh;
}
.boro{
display: block;
border-top-left-radius: 5vh;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 5vh;
background: #fff6d5 no-repeat center url(نگارخانه/جو۱.svg);
    background-size: auto;
background-size: 40vh;
color: transparent;
border-style: solid;
border-color: #c8ab3780;
border-width: 0.05vh;
cursor: pointer;
width: 100%;
height: 100%;
transition: 0.3s;
border-right: none;
}
.boro:hover{
background: #fff6d5 no-repeat center url(نگارخانه/جو.svg);
background-size: auto;
background-size: 35vh;
}
.qaabnevis{
width: 100%;
border-top-left-radius: 0;
border-top-right-radius: 5vh;
border-bottom-right-radius: 5vh;
border-bottom-left-radius: 0;
  background: #fff6d5ff;
  background-size: 40vh;
  color: #c8ab37;
              box-shadow: 
              1vh 1vh 1vh #CCC6AD50 inset , 
              -1vh -1vh 1vh #ffffff inset;
            border-style: solid;
            border-color: #c8ab3780;
            border-width: 0.05vh;
font-size: 7vh;
font-weight: 900;
padding: 8vh;
transition: 1s;
}
.joo{
width: 100%;
border-radius: 5vh;
  background: #fff;
  background-size: 40vh;
  color: #c8ab37;
              box-shadow: 
              1vh 1vh 1vh #CCC6AD50 , -1vh -1vh 1vh #ffffff;
            border: solid 0.05vh #c8ab3780;
font-size: 7vh;
font-weight: 900;
padding: 8vh;
transition: 1s;
margin: 20vh auto auto;
}
.bejoo {
display: block;
background: url("نگارخانه/پس.svg");
cursor: pointer;
width: 10vh;
transition: 0.3s;
margin: -6vh auto -1vh;   
    border-radius: 100%;
z-index: 1;
position: relative;
padding: 1vh;
background-size: 20vh;
box-shadow: inset 0vh 1vh 1vh #CCC6AD50;
}
.bejoo:hover{
  padding: 3vh;
  margin: -8vh auto -3vh;
}
.kolof-nevis {
display: block;
font-family: "Vazir";
font-size: 3vh;
font-weight: 900;
}
@font-face {
  font-family: "Vazir" !important;
  src: url(قلم/Vazir.eot);
  src: url(قلم/Vazir.eot?#iefix) format('embedded-opentype'),
       url(قلم/Vazir.woff2) format('woff2'),
       url(قلم/Vazir.woff) format('woff'),
       url(قلم/Vazir.ttf) format('truetype');
  font-weight: normal;
}
@font-face {
  font-family: "Vazir" !important;
  src: url('قلم/Vazir-Bold.eot');
  src: url('قلم/Vazir-Bold.eot?#iefix') format('embedded-opentype'),
       url('قلم/Vazir-Bold.woff2') format('woff2'),
       url('قلم/Vazir-Bold.woff') format('woff'),
       url('قلم/Vazir-Bold.ttf') format('truetype');
  font-weight: bold;
}
@font-face {
  font-family: "Vazir" !important;
  src: url(قلم/Vazir-Black.eot);
  src: url(قلم/Vazir-Black.eot?#iefix) format('embedded-opentype'),
       url(قلم/Vazir-Black.woff2) format('woff2'),
       url(قلم/Vazir-Black.woff) format('woff'),
       url(قلم/Vazir-Black.ttf) format('truetype');
  font-weight: 900;
}
p {
    font-family: "Vazir" !important; 
    }   
#topbar {
    width: 100%;
    font-size: 3vh;
}
#content {
    width: 100%;
    font-size: 3vh;
}
#raast {
    float: right;
    width: 10%;
    height: 96%;
}
#biqaltak{
    height: 100%;
    width: 100%;
    overflow: visible;
}
#fekr {
    float: right;
    width: 30%;
    height: 96%;
    overflow: auto;
  overflow-y: scroll;
  scrollbar-color: #e1c10a50 #ffffff70;
  scrollbar-width: thin;
}
#fekr:hover {
  scrollbar-color: #e1c10aaa #ffffff;
}
/* width */
::-webkit-scrollbar {
  width: 1px;  
}
/* width */
::-webkit-scrollbar:hover {
  width: 12px;
}
/* Track */
::-webkit-scrollbar-track {
  background: #e1c10a80; 
  border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: #e1c10a80; 
  border-radius: 10px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #e1c10a80; 
}
#kaar {
    float: right;
    width: 50%;
    height: 96%;
    overflow: auto;
    background: ;
  overflow-y: scroll;
  scrollbar-color: #e1c10a50 #ffffff70;
  scrollbar-width: thin;
}
#kaar:hover {
  scrollbar-color: #e1c10aaa #ffffff;
}
.kol {
background: ;
z-index: 2;
width: 100%;
}
.vasat {
width: 90%;
max-width: 130vh;
margin: 0 auto;
top: 0px;
border-right: 0px;
padding-right: 0px;
right: 0px;
}
.ja {
width: 50vh;
}
.khoda {
width: 90%;
max-width: 40vh;
font-size: 5vh;
}
.kesh {
display: grid;
grid-template-columns: 50% 50%;
width: 100%;
}
.yek {
margin: 0 auto;
margin-right: 0;
width: 80%;
}
.do {
margin: 0 auto;
margin-left: 0;
width: 80%;
transition: 0.3s;
}
.do:hover {
opacity: 0.5;
cursor: help;
}
.dodo {
width: 90%;
max-width: 120vh;
}
.kaarbar {
float: right;
font-size: 5vh;
}
.fekr {
float: left;
width: calc(100% - 24vh);
font-size: 5vh;
}
.kaar {
float: left;
font-size: 5vh;
}
.khaali {
margin-top: 7vw;
}
            .کلیدا {
  filter: grayscale(100%) opacity(30%);
              transition: 0.5s;
            }

            .کلیدا:hover {
  filter: grayscale(00%);
              opacity: 1;
  }
.klidax{
transition: 1s;
}
.klidax:hover{
box-shadow: 0vh 0vh 7vh -2vh #c8ab37;
}
.klid{
display: inline-block;
transition: 0.3s;
}
.klid:hover{
transform: scale(120%);
}
.poosheklid {
                top: 0;
                position: sticky;
                text-decoration: none;
width: auto; 
padding-right: 3vh;
padding-left: 3vh;
padding-top: 0.2vh; 
padding-bottom: 0.2vh;
margin-right: 1vh;
cursor: help; 
float: right;
box-shadow: none;
}
.vasatchin {margin: 0 auto; display: table;}
a:hover {color: #aaa;}



.autocomplete {
  width: 100%;
  padding: 0;
}
.autocomplete-items {
  font-size: 5vh;    
  display: inline-block;
    padding: 0;
    object-position: center;
    object-fit: contain;
  width: 100%;
}
.autocomplete-items div {
  border: 1vh solid #fff6d5ff;
  border-radius: 5vh;
margin: 0.5vh;
  padding: 2vh;
  cursor: pointer;
  display: inline-block;
  background: #fff;
  transition: 0.2s;
  color: #c8ab37;
  box-shadow: 1vh 1vh 1vh #eae1be;
  position: relative;
  z-index: 2;
}
.autocomplete-items div:hover {
  background-color: #fff6d5ff; 
  color: black;
}
.pizhklid{
  width: 5vh;
  display: block;
  background: white;
    border-radius: 100%;
border: solid 0.1vh #c8ab3790;
              box-shadow: 
              1vh 1vh 1vh #CCC6AD50  , 
              -1vh -1vh 1vh #ffffff ;
  margin: 2vh auto;
  position: relative;
  z-index: 2;
  transition: 0.3s;
}
.pizhklid:hover{
  background: #fcf1cc;
}
.khklid{
  width: 7vh;
  display: block;
  background: white;
    border-radius: 100%;
border: solid 0.1vh #c8ab3790;
              box-shadow: 
              1vh 1vh 1vh #CCC6AD50  , 
              -1vh -1vh 1vh #ffffff ;
}
.khklid:hover{
}
                    @keyframes namayesh-tozi {
                        00% {     display:block; opacity: 0;     }
                        20% {     display:block; opacity: 1;     }
                        70% {     display:block; opacity: 1;     }
                        100% {     display:block; opacity: 0;     }
                    }
.khatkat{white-space: break-spaces;}
