﻿#tabs
{
    overflow: hidden;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

#tabs li
{
    float: left;
    padding-top: 2px;
}

#tabs li :not(#current)
{
    opacity: 1;
}

#tabs li:disabled
{
    background-color: #CCCCCC;
}

#tabs a
{
    position: relative;
    background: #e8d4c9; /*background-image: linear-gradient(to bottom, #fff, #ddd);*/
    padding: .7em 3.5em;
    float: left;
    text-decoration: none;
    color: #491807;
    text-shadow: 0 1px 0 rgba(255,255,255,.8);
    border-radius: 5px 0 0 0;
     font-family: FarsiFont,FarsiFontIE;
    font-size: 1.2em;
    top: 0px;
    left: 0px;
}

#tabs a:hover, #tabs a:hover::after, #tabs a:focus, #tabs a:focus::after
{
    /*background: #DFDCBB;*/
    background-color: #e3d6cd;
    color: white;
}

#tabs a:focus
{
    outline: 0;
}

#tabs a::after
{
    content: '';
    position: absolute;
    z-index: 1;
    top: 0;
    right: -.5em;
    bottom: 0;
    width: 10%; /*  background: #ddd;     background-image: linear-gradient(to bottom, #fff, #ddd);*/
    box-shadow: 2px 2px 2px rgba(0,0,0,.4);
    transform: skew(10deg);
    border-radius: 0 5px 0 0; /* background: #DFDCBB;*/
    background: #e8d4c9;
    color: #491807;
}

#tabs a::disabled
{
    background-color: #CCCCCC;
}

#tabs #current a, #tabs #current a::after
{
    background: #491807;
    color: white;
    z-index: 3;
    opacity: 1;
}

#content
{
    position: relative;
    z-index: 2;
    border-radius: 0 5px 5px 5px;
    box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
    top: 0px;
    left: 0px;
}
