﻿@font-face {
    font-family: yekan;
    src: url(../fonts/Yekan.eot);
    src: url(../fonts/Yekan.eot?#iefix) format("embedded-opentype"), url(../fonts/Yekan.woff) format("woff"), url(../fonts/Yekan.ttf) format("truetype"), url(../fonts/Yekan.svg#BYekan) format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: dastnevis;
    src: url(../fonts/dastnevis.otf) format('opentype');
    src: url(../fonts/dastnevis.ttf) format('truetype');
}

@font-face {
    font-family: roya;
    src: url(../fonts/roya.ttf) format('truetype');
}

@font-face {
    font-family: iran_sans;
    src: url(../fonts/iran_sans.otf) format('opentype');
    src: url(../fonts/iran_sans.ttf) format('truetype');
}

@font-face {
    font-family: JKAbode;
    src: url(../fonts/JKAbode.ttf) format('truetype');
}

@font-face {
    font-family: "Koodak";
    src: url(../fonts/Koodak.ttf) format("truetype");
    src: url(../fonts/koodak.otf) format('opentype');
}

header {
    height: 100px;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    border-bottom: 5px solid #F44336;
}

    header .logo {
        width: 145px;
        height: 150px;
        margin-top: -5px;
        /*background-color: white;
        border: 1px solid silver;
        -webkit-box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);
        box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);*/
        float: left;
    }

.matn {
    font: 500 14px Yekan,tahoma;
    text-align: right;
    direction: rtl;
}

.ms-box {
    height: 100px;
    border-bottom: 5px;
}

    .ms-box .searchbox {
        display: block;
        width: 100%;
        height: 50px;
        margin-top: 5px;
        margin-right: 25px;
    }

    .ms-box .txtsearch {
        width: 200px;
        height: 40px;
        float: right;
        border: 1px solid silver;
        border-left: none;
        border-bottom-right-radius: 3px;
        border-top-right-radius: 3px;
        padding: 8px;
        font-family: yekan;
        text-align: center;
    }

        .ms-box .txtsearch:focus {
            border: 1px solid silver !important;
        }

    .ms-box .btnsearch {
        height: 40px;
        width: 40px;
        background-repeat: no-repeat;
        background-color: white;
        font-family: yekan;
        float: right;
        border: 1px solid silver;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

.menu {
    display: block;
    height: 40px;
}

    .menu .glyphicon {
        float: left;
    }

    .menu .item {
        display: block;
        width: 120px;
        height: 40px;
        color: black;
        text-align: center;
        padding: 5px;
        float: right;
        transition: all 200ms ease;
        font-family: yekan;
        cursor: pointer;
    }


        .menu .item .l1 {
            position: relative;
            display: block;
            visibility: hidden;
            opacity: 0;
            width: 250px;
            height: auto;
            background-color: #EEEEEE;
            float: right;
            margin-top: 20px;
            transition: all 150ms linear;
            z-index: 50000;
            -webkit-box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
            -moz-box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
            box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
            border: 1px solid silver;
        }

        .menu .item:hover .l1 {
            visibility: visible;
            opacity: 1;
        }

        .menu .item .l1 .item {
            display: block;
            width: 250px;
            height: 40px;
            padding: 10px;
            text-align: right;
            /*border-bottom:1px solid #343434;*/
            transition: all 0.15s linear;
            border-bottom: 1px solid #CFD8DC;
        }

            .menu .item .l1 .item .text {
                width: auto;
                height: auto;
                padding: 5px;
                font-family: yekan;
                color: black !important;
            }

            .menu .item .l1 .item:hover {
                background-color: #B0BEC5;
            }

            .menu .item .l1 .item .l2 {
                display: none;
                width: 280px;
                height: auto;
                margin-right: 240px;
                margin-top: -30px;
                background-color: #EEEEEE;
                float: right;
                list-style: none;
                z-index: 5000;
                padding: 0px !important;
                border: 1px solid silver;
                -webkit-box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
                -moz-box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
                box-shadow: 0px 6px 8px -1px rgba(0,0,0,0.75);
            }

                .menu .item .l1 .item .l2 li {
                    display: block;
                    width: 100%;
                    height: 40px;
                    padding: 10px;
                    font-family: yekan;
                    color: black;
                    text-align: right;
                    transition: all 0.15s linear;
                    border-bottom: 1px solid #CFD8DC;
                }

                    .menu .item .l1 .item .l2 li:hover {
                        background-color: #B0BEC5;
                    }

            .menu .item .l1 .item:hover .l2 {
                display: block;
            }

.pipe {
    display: block;
    float: right;
    width: 1px;
    height: 20px;
    margin-top: 8px;
    background-color: silver;
}
/******************Main****************************/
.Main-wrapper {
    height: auto;
    margin-top: 80px;
}

    .Main-wrapper aside {
        height: auto;
    }

        .Main-wrapper aside .DrPanel {
            display: block;
            color: white;
            height: auto;
            padding: 10px;
            font-family: yekan;
            direction: rtl;
            cursor: pointer;
            border-top-right-radius: 3px;
            border-top-left-radius: 3px;
            margin-top: 2px;
            color: white;
            background-color: white;
            background: rgba(169,3,41,1);
            background: -moz-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
            background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(169,3,41,1)), color-stop(44%, rgba(143,2,34,1)), color-stop(100%, rgba(109,0,25,1)));
            background: -webkit-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
            background: -o-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
            background: -ms-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
            background: linear-gradient(to bottom, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019', GradientType=0 );
        }

            .Main-wrapper aside .DrPanel span {
                float: left;
            }

        .Main-wrapper aside .DrContent {
            display: none;
            height: auto;
            border: 1px solid silver;
        }

            .Main-wrapper aside .DrContent a {
                display: block;
                width: 100%;
                height: auto;
                padding: 5px;
                font-family: yekan;
                text-decoration: none;
                direction: rtl;
                color: black;
                padding-right: 10px;
                transition: all 0.2s linear;
            }

                .Main-wrapper aside .DrContent a .glyphicon {
                    color: red;
                }

                .Main-wrapper aside .DrContent a:hover {
                    background-color: #E0E0E0;
                    padding-right: 15px;
                }

.slider {
    height: 400px;
}

.main-body {
    margin-top: 2px;
    height: auto;
    padding-bottom: 10px;
}

    .main-body .title {
        display: block;
        height: auto;
        padding: 10px;
        font-family: Yekan;
        text-align: center;
        color: white;
        background: #78909C;
        border-bottom: 5px solid #FF5722;
        font-size: 22px;
        direction: rtl;
    }

    .main-body .content {
        height: 450px;
        border: 1px solid silver;
        float: right;
        font-family: Tahoma;
        direction: rtl;
        text-align: justify;
    }

        .main-body .content article {
            display: block;
            font-family: Tahoma;
            direction: rtl;
            text-align: justify;
            margin-top: 10px;
        }

            .main-body .content article ul li {
                font-family: Tahoma;
            }

.adv-box {
    width: 98%;
    margin: auto;
}

.adv-title {
    display: block;
    height: auto;
    padding: 10px;
    font-family: yekan;
    text-align: center;
    background-color: #B0BEC5;
    margin-top: 5px;
    border-radius: 3px;
    color: white;
}

.adv-item {
    display: block;
    margin-top: 5px;
    height: 100px;
}

.box {
    display: block;
    height: auto;
    margin-top: 10px;
    /*border:1px solid silver;*/
}

    .box:hover {
        text-decoration: none !important;
    }

    .box:focus {
        text-decoration: none !important;
    }

    .box .product {
        display: block;
        width: 100%;
        height: auto;
        margin: auto;
        border: 1px solid #cacaca;
        border-radius: 3px;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear;
    }

.OldPrice {
    display: block;
    width: 100%;
    height: auto;
    color: red;
    text-align: center;
    font-family: 'B Yekan';
    direction: rtl;
    text-decoration: line-through;
}

.Price {
    display: block;
    width: 100%;
    height: auto;
    color: green;
    text-align: center;
    font-family: 'B Yekan';
    direction: rtl;
}

.box .product .img {
    display: block;
    width: 170px;
    height: 190px;
    margin: auto;
    margin-top: 5px;
}

.box .product .name {
    display: block;
    width: 95%;
    height: auto;
    padding: 5px;
    font-family: yekan;
    font-size: 13px;
    text-align: center;
    color: white;
    background-color: #607D8B;
    border-bottom: 4px solid #FFAB91;
    border-radius: 2px;
    margin: auto;
    margin-top: 5px;
}


.box .product:hover {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.panel-box {
    width: 98%;
    height: auto;
    margin: auto;
}

.product-title {
    display: block;
    padding: 5px;
    text-align: center;
    font-family: yekan;
    background-color: #B0BEC5;
    color: white;
    font-size: 20px;
}

.nav-tabs {
    font-family: yekan;
    font-family: 15px;
    margin-top: 20px;
}

.tab-content {
    font-family: Tahoma;
    font-family: 15px;
}

    .tab-content h3 {
        font-family: yekan;
        font-family: 15px;
    }

footer {
    height: 200px;
    border-top: 3px solid #FF1744;
    margin-top: 50px;
    background-color: black;
}

.color1 {
    background-color: #FF5722;
}

.pagination {
    display: block;
    margin-top: 10px;
}

.FooterContactInfo {
    color: white;
    font-family: 'B Yekan';
    margin-top: 100px;
}

.FooterDesigner {
    color: blue;
    font-family: 'B Yekan';
}

.demonstrations img {
    border: 1px solid silver;
    margin-top: 10px;
}

.PriceTable {
    font-family: 'B Yekan';
    font-size: 12px;
}

.PriceUpdateTime {
    float: left;
    margin-top: -10px;
    font-family: 'B Yekan';
    color: maroon;
    font-size: smaller;
}
