﻿.myicons li, .mynav li, .mynav li a, .mynav2 li {
    display: inline-block
}

    .mylogo, .mynav li a, .mynav2, .tablighh {
        direction: ltr
    }

* {
    margin: 0;
    padding: 0;
    font-family: IRANSansWeb
}

@font-face {
    font-family: IRANSansWeb;
    src: url(../font/IRANSansWeb.eot);
    src: url(../font/IRANSansWeb.eot?#iefix) format("embedded-opentype"),url(../font/IRANSansWeb.woff) format("woff"),url(../font/IRANSansWeb.ttf) format("truetype"),url(../font/IRANSansWeb.svg#Byekan) format("svg");
    font-weight: 400;
    font-style: normal
}

body {
    font-size: 1rem;
    line-height: 1.5
}

.topnav {
    overflow: hidden;
    background-color: #fff
}

.row {
    flex-direction: row-reverse
}

.mynav {
    margin-top: 10px !important;
    margin-bottom: 10px
}

ul {
    list-style-type: none
}

.mynav li a {
    width: 100%;
    padding: 0 10px 0 0
}

.mynav span {
    margin-right: 4px;
    width: 100%;
    display: block
}

.myicons a, .topnav a {
    text-decoration: none;
    border: 1px solid transparent;
    display: inline-block;
    margin-top: 1px;
    color: #262626
}

.topnav a {
    float: right;
    font-size: 13px;
    padding-bottom: 2px
}

.myicons a {
    float: left;
    font-size: 16px
}

.mylogo a {
    padding: 5px 0 !important
}

.mobilemenu {
    display: none !important
}

.acctive {
    padding: 12px 8px 6px !important
}

    .acctive a {
        border-radius: 5px;
        text-shadow: 0 0 .1px #000;
        border: 1px solid #262626;
        color: #262626;
        padding: 5px 8px
    }

.topnav li {
    margin-top: 5px;
    padding: 16px 8px 6px;
    transition: 1s
}

.dropdown2.s .dropdown-content a {
    width: 50% !important
}

.pcmenu .dropdown-content {
    padding: 38px 1px
}

.mynav2 li:hover a {
    color: #000 !important
}

.mynav2 {
    margin-bottom: 0;
    padding: 0
}

.texttopnav {
    color: #fff;
    margin-top: 18px;
    text-align: center;
    font-size: 13px
}

ul.myicons {
    padding-left: 0;
    margin-bottom: 0;
    display: flex;
    align-items: center
}

@media(max-width:900px) {
    ul.myicons {
        float: right
    }
}

.topmenue {
    border-bottom: 1px solid #4b5661
}

.topnav a:hover {
    color: #000;
    border-bottom: 2px solid #000
}

.topnav a.active {
    background-color: #04aa6d;
    color: #fff
}

.mob, .topnav .icon {
    display: none
}

.container2 {
    display: inline-block;
    cursor: pointer
}

.bar1, .bar2, .bar3 {
    width: 20px;
    height: 2px;
    background-color: #000;
    margin: 4px 0;
    transition: .4s
}

.myactive {
    color: #0088ff7d;
    border-radius: 6px;
    animation: 2s infinite fall
}

@keyframes fall {
    15%,from {
        color: #4caf50;
        animation-timing-function: cubic-bezier(.07,2.02,.67,.57)
    }

    50%,60% {
        color: #d88915;
        animation-timing-function: cubic-bezier(.13,.84,.82,1)
    }

    85%,to {
        color: #ff5722
    }
}

.dropdown {
    position: relative;
    display: inline-block
}

.dropdown-content {
    display: none;
    position: fixed;
    background-color: #2b3948;
    width: 600px;
    z-index: 3;
    margin-top: 39px;
    direction: ltr
}

#myFunctionmenumobile2 a {
    width: 100% !important
}

.dropdown-content a {
    width: 30%;
    border-bottom: #ffdead;
    text-align: right
}

.dropdown2:hover .dropdown-content, .pcmenu, .show3, .sis {
    display: block
}

input {
    color: #000
}

@media screen and (max-width:900px) {
    .myTopnav, .myTopnav.responsive {
        height: 100vh;
        padding-top: 20px;
        position: fixed;
        top: 0;
    }

        .myTopnav ul, .mynav span, .sis, .texttopnav, .topnav a:not(:first-child) {
            display: none
        }

            .mob, .myTopnav ul li, .myTopnav.responsive ul li {
                display: block
            }

    .bottonmenu .row {
        align-items: center
    }

    .mobilemenu {
        display: block !important
    }

    .pcmenu {
        display: none !important
    }

    .dropdown-content {
        width: 100%
    }

        .dropdown-content a {
            width: 100%;
            border-bottom: #ffdead;
            text-align: right
        }

    .topnav a.icon {
        float: right;
        display: block;
        position: fixed;
        top: 16px;
        left: 14px
    }

    .myTopnav {
        display: block;
        width: 0;
        right: -100%;
        transition: 1s
    }

    .mynav {
        margin-top: 21px !important
    }

    .myTopnav ul li a, .myTopnav.responsive ul li a {
        display: block;
        text-align: left;
        margin-left: 10px
    }

    .dropdown-content {
        position: static;
        margin-top: 2px
    }

    .myTopnav.responsive {
        display: block;
        width: 80%;
        left: 0;
        right: auto;
        z-index: 8;
        background: #fff;
        border-left: 1px solid #e3e3e3
    }

    .acctive a {
        border-radius: 0;
        text-shadow: 0 0 .1px #000;
        border-right: 1px solid #262626;
        color: #262626;
        padding: 5px 8px;
        background: #f0f0f0
    }

    .topnav li {
        padding: 16px 2px 6px
    }

    .mylogo {
        padding: 0 !important
    }

    .flex1, .flex3 {
        order: 3
    }

    .flex2 {
        order: 2
    }

    .myTopnav.responsive a.icon {
        float: right;
        display: block;
        position: absolute;
        top: 4px;
        left: 4px;
        border-bottom: 2px solid #fff
    }

    .myTopnav.responsive ul {
        display: block;
        width: 80%
    }

    .myTopnav.responsive a {
        float: none;
        display: block;
        text-align: left
    }

    .myTopnav.responsive .bar1 {
        -webkit-transform: rotate(-45deg) translate(-7px,4px);
        transform: rotate(-45deg) translate(-7px,4px)
    }

    .myTopnav.responsive .bar2 {
        opacity: 0
    }

    .myTopnav.responsive .bar3 {
        -webkit-transform: rotate(45deg) translate(-4px,-2px);
        transform: rotate(45deg) translate(-4px,-2px)
    }

    h1, h2, h4 {
        text-align: right
    }

    .toppageh1, h2, h4 {
        text-align: center
    }
}

.tablighh {
    background-color: #05a6f0;
    color: #fff;
    text-align: center;
    padding: 1rem 1.5rem
}
