.Tabs { position: relative; z-index: 10; min-width: 340px; display: block; }
.Tabs .tab {
    float:left;
    opacity: .80;
    height: 21px;
    width: auto;
    text-align: center;
    font-size: 11px;
    margin-left: 5px;
    color: #fff;
    background: #6e98e3;
    padding: 2px 5px 0;
    overflow: hidden;
    border-radius: 3px 3px 0 0;
    border-bottom: solid 1px transparent;
    transform:translateY(6px); -webkit-transform:translateY(6px); -moz-transform:translateY(6px); -ms-transform:translateY(6px); -o-transform:translateY(6px);
    -webkit-transition:all ease .2s;-moz-transition:all ease .3s;-ms-transition:all ease .3s;-o-transition:all ease .3s;transition:all ease .2s;
}

.Tabs .tab.selected {
    opacity: 1;
    color: #555;
    background: #fff;
    border-bottom: solid 1px #fff;
    transform:translateY(0px); -webkit-transform:translateY(0px); -moz-transform:translateY(0px); -ms-transform:translateY(0px); -o-transform:translateY(0px);
    -webkit-box-shadow:6px 6px 0 0 rgba(0,0,0,.3); -moz-box-shadow:6px 6px 0 0 rgba(0,0,0,.3); box-shadow:6px 6px 0 0 rgba(0,0,0,.3);
}

.Tabs .tab:hover {
    opacity: 1;
    transform:translateY(0px);
    -webkit-transform:translateY(0px);
    -moz-transform:translateY(0px);
    -ms-transform:translateY(0px);
    -o-transform:translateY(0px);
}


@media screen and (max-width: 800px) {
    .Tabs { z-index: 12; }
    .Tabs .tab {
        height: auto;
        transform:translateY(0px); -webkit-transform:translateY(0px); -moz-transform:translateY(0px); -ms-transform:translateY(0px); -o-transform:translateY(0px);
        margin:3px 0 0 5px;
    }
    .Tabs .tab.selected {
        -webkit-box-shadow:0 0 0 0; -moz-box-shadow:0 0 0 0; box-shadow:0 0 0 0;
    }
}