﻿
@font-face
{
 font-family:'YekanNumber';
 src: url('FontYekan/yekannumbers.eot?#') format('eot'),  /* IE6–8 */
    url('FontYekan/yekannumbers.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('FontYekan/yekannumbers.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
    font-family: "yekan";
    src: url(FontYekan/BYekan.eot);
    src: url(FontYekan/BYekan.eot?#iefix) format("embedded-opentype"), url(FontYekan/BYekan.woff) format("woff"), url(FontYekan/BYekan.ttf) format("truetype"), url(FontYekan/BYekan.svg#BYekan) format("svg");
    font-weight: normal;
    font-style: normal
}

body
{
    font-family:yekan,Arial;
}

a{text-decoration:none!important;}



h1{
    font-size:20px;
}


#araMenuBottom {
position: fixed;
bottom: 0px;
width: 100%;
border-radius: 0 0 30px 30px;
display: block;
margin: 0 auto;
box-shadow: 0 0 30px 0 #8c69e6;
}

#araMenuBottom a {
text-decoration: none;
color: #808080;
}

#araMenuBottom .bar {
background-color: #f8f9fa;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 60px;
display: flex;
align-items: center;
justify-content: space-around;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
box-shadow: 0 0 2px 0 #b2b2b2;
}

#araMenuBottom .icon {
text-align: center;
line-height: 20px;
cursor: pointer;
position: relative;
font-size: 12px;
font-weight:bold;
}


#araMenuBottom .icon i {
font-size: 20px;
}


#araMenuBottom .icon::after {
content: "";
display: block;
width: 3px;
height: 3px;
border-radius: 50%;
background-color: #8c69e6;
margin: 2px auto 0;
transform: translateY(20px);
transition: transform 0.2s;
}

#araMenuBottom .icon::before {
content: "";
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
border: 1px solid #c6b6f1;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
transition: 0.5s;
}

#araMenuBottom .icon .home,
#araMenuBottom .icon .msg,
#araMenuBottom .icon .user {
stroke-width: 15;
stroke: #000;
}

#araMenuBottom .button {
width: 55px;
height: 55px;
text-align: center;
background-color: #3e7bfa;
color: #fff;
border-radius: 50%;
transform: translateY(-20px);
transition: 0.5s;
position: relative;
box-shadow: 0 0 2px 0 #b2b2b2;
}

#araMenuBottom .button::after, #araMenuBottom .button::before {
display: none;
}
