html{box-sizing:border-box;}
*,*::before,*::after{box-sizing:inherit;}
@font-face{font-family:'B Nazanin';src:url('project1/font/B-NAZANINI.TTF') format('truetype');font-weight:normal;font-style:normal;}
body{font-family:'B Nazanin',Tahoma, sans-serif;padding:0;margin:0;}
.navbar {height:60px;width:100%;display:flex;background-image:linear-gradient(to right,snow,white,#f9fbfc,#cacdee,#c8cdd0,hsla(243, 77%, 35%,0.6),hsla(244, 75%, 33%,0.7),hsla(245, 71%, 29%,0.8),hsla(234, 98%, 20%,0.8),hsla(232, 97%, 15%,0.8),hsla(229, 97%, 11%,0.8),hsla(239, 98%, 18%,0.8),hsla(238, 98%, 16%,0.8));position:sticky;top:0;z-index:100}
div.blook1 {flex:0 1 70%;}
div.blook2 {flex:0 1 30%;display:flex;justify-content:flex-end;user-select:none;}
div.blook1,div.blook2{height:100%;max-height:60px;}
div.blook2 header{height:100%;max-height:60px;flex:1 2 85%;display:flex;align-items:center;}
div.blook2 header h2{white-space:nowrap;flex:1 1 100%;display:flex;justify-content:flex-end;align-items:center;margin-top:31px;font-family:'verdana';letter-spacing:2px}
div.blook2 div{height:100%;max-height:60px;flex:1 0 15%;display:flex;align-items:center;justify-content:center}
div.blook2 div a{height:100%;max-height:60px;display:flex;justify-content:center;align-items:center}
div.blook2 div a img{height:100%;width:100%;max-height:45px;max-width:45px;transition:0.6s}
@media screen and (min-width:855px) and (max-width:1100px){div.blook1{flex:0 1 65%} div.blook2{flex:0 1 35%} }
.faz{display:none;flex:1 1 100%;height:100%;max-height:60px;user-select:none}
@media screen and (max-width:854px){div.blook1,div.blook2{display:none} article.navbar{background:rgba(220,220,220,0.3)} .faz{display:flex;}
.logo{flex:0 1 60%} .icon{flex:0 1 20%}}
div.blook2 img:hover{transform:rotateY(180deg);}
.blook1 nav{display:flex;height:100%;max-height:60px;}
.fehrest{flex:1 1 20%;display:flex;justify-content:center;align-items:center}
.a1{color:Snow;text-decoration:none;font-size:clamp(1.1rem,1.2rem,1.3rem);white-space:nowrap;padding:2px;display:flex;align-items:center;flex:1 1 100%;height:100%;max-height:60px;justify-content:center;padding:4px;text-shadow:2px 2px 4px black;transition:background-color 0.4s}
.a1:hover{background-color:rgba(24,24,24,0.5)}
.fehrest i{vertical-align:middle;margin-left:2px;font-size:15px;color:LightGrey}
@media screen and (max-width:1000px){.a1{font-size:clamp(1rem,1.1rem,1.2rem);font-weight:bold}}
.sarfehrest{position:relative;}
.zirfehrest{position:absolute;z-index:100;width:100%;top:102%;visibility:hidden;opacity:0;background-color:rgba(24, 24, 65,0.7);border-radius:10px 10px 10px 10px;transition:0.4s;display:flex;flex-wrap:wrap;pointer-events:none;border:1.5px groove white}
.sarfehrest:hover .zirfehrest{visibility:visible;opacity:1;pointer-events:auto}
.zirfehrest a{flex:1 1 100%;text-decoration:none;display:flex;justify-content:center;align-items:center;white-space:nowrap;padding:5px;color:snow;transition:0.3s}
.zirfehrest a:not(.tild){border-bottom:1px solid LightGrey}
.tild{border-radius:0 0 10px 10px}
.zirfehrest a:hover{background-color:rgba(30,30,30,0.5)}
.first{border-radius:10px 10px 0 0}
.fehrest a:not(.a4){border-left:1px solid rgba(255,255,255,0.3)}
.icon,.logo{height:100%,max-height:60px}
.faz .icon{display:flex;justify-content:center;align-items:center;font-size:clamp(1.2rem,1.3rem,1.4rem)}
.logo{display:flex;justify-content:center;align-items:center;}
.faz .logo a{height:100%;max-height:60px;display:flex;justify-content:center;align-items:center;padding:4px}
.faz .logo h2{display:flex;align-items:center;margin-top:30px;letter-spacing:2px;white-space:nowrap;font-familt:'Verdana'}
.faz .logo img{height:100%;width:100%;max-height:45px;max-width:45px;}
@media screen and (max-width:420px){.logo{flex:0 1 75%} .icon{flex:0 1 12.5%;font-size:clamp(1.1rem,1.2rem,1.3rem)} .faz h2{font-size:clamp(1.1rem,1.2rem,1.3rem)} .faz .logo img{max-width:40px;max-height:40px}}
.icon i{border-radius:50%;padding:10px 20px;display:flex;justify-content:center;align-items:center;transition: background-color 0.3s;cursor:pointer}
.icon i:hover{background-color:rgba(105,105,105,0.4);}
.icon i:active{background-color:rgba(105,105,105,0.4);}
.faz h2{font-family:Georgia, serif}
.poster{height:auto;width:100%;overflow:hidden}
.poster video{width:100%;overflow:hidden;transform:scale(1.08,1.08);height:100%;opacity:0.4;transition:0.4s}
.poster video:hover{opacity:0.9}
.declar{display:flex;box-shadow:3px 3px 5px DarkSlateGray;cursor:pointer}

.declar figure{flex:0 1 40%;border-radius:6px;perspective:500px;position:relative;aspect-ratio: 2 / 1;}
.declar .matn{flex:0 1 60%;}
.declar img{width:100%;height:100%;border-radius:8px;box-shadow: 2px 2.5px 4px 0.5px DarkSlateGray}
.front,.back,.zircouch{width:100%;height:100%;}
.zircouch{transition:0.6s;transform-style:preserve-3d;border-radius:8px;}
.back,.front{backface-visibility:hidden;border-radius:8px;}
.back{transform:rotateX(180deg);display:flex;justify-content:center;align-items:center;background-color:DarkSlateGrey;color:snow;font-family:Copperplate, Papyrus, fantasy;font-size:clamp(1.3rem,1.4rem,1.5rem);font-weight:bold;white-space:nowrap;max-width:100%;max-height:100%}
.back,.front{position:absolute;}
figure:hover .zircouch{transform:rotateX(180deg)}
figure:hover .back{box-shadow:2px 2.5px 4px 0.5px black}
.matn .header{padding:5px;display:flex;align-items:flex-end}
.header h1{flex:1 1 100%;margin-bottom:0;text-shadow:2.5px 2px 4px black;color:snow}
.matn .parag{padding:4px;text-align:justify}
.parag h3{margin-top:0;border-right:1px solid LightSlateGrey;padding:0 10px;border-left:1px solid LightSlateGrey;text-align-last:center;unicode-bidi:embed;direction:rtl}
.matn{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr;margin-left:40px}
@media screen and (min-width:601px) and (max-width:1000px){.declar{flex-wrap:wrap;justify-content:center} .declar figure{flex:0 1 60%} .declar .matn{flex:0 1 60%;margin-left:0} .header h1{text-align:center}}
@media screen and (max-width:600px){.declar{flex-wrap:wrap;justify-content:center} .declar figure{flex:0 1 75%} .declar .matn{flex:0 1 75%;margin-left:0} .header h1{text-align:center;font-size:clamp(1.5rem,1.6rem,1.7rem)} .parag h3{font-size:1.1rem;line-height:2}}
.declar{margin:100px 20px;padding:10px;background-color:rgba(85, 95, 106,0.2);border-radius:7px;}