/*
Theme Name:OFM Studios GmbH 2013
Theme URI:http://www.onlinefussballmanager.de/
Version:8
Author:OFM
    Inhaltsverzeichnis:

    1. ...... OFM Standards Definition
    2. ...... OFM Icon Definition
*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* 1. OFM Standards Definition Start */
select.selectBox{
width:250px;
border:1px solid #b8b8b8;
color:#000;
display:inline-block;
height:30px;
margin:3px 0 10px 0;
background:#fff;
font-family:calibri,sans-serif;
border-radius:2px;
font-size:12px;
padding:6px 12px;
border-radius:4px;
box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);
transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input.inputField,textarea.textareaBox{
width:250px;
border:1px solid #b8b8b8;
color:#000;
display:inline-block;
height:26px;
margin:3px 0 10px 0;
line-height:18px;
background:#fff;
font-family:calibri,sans-serif;
border-radius:2px;
font-size:12px;
padding:2px 0 1px 3px;
border-radius:4px;
box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);
transition:border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input.inputField:focus,textarea.textareaBox:focus,select.selectBox:focus{
border:1px solid #5c86af;
color:#000;
font-weight:bold;
box-shadow:0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(119, 168, 207, 0.8);
}

.has-error,input.has-error:focus,select.has-error:focus{
border:1px solid #a94442 !important;
box-shadow:0 1px 1px rgba(0, 0, 0, 0.075) inset !important;
}

.standardArrowBox {
position:absolute;
background:#f7f7f7;
border:1px solid #04397a;
border-radius:8px;
width:350px;
height:auto;
z-index:99999;
bottom:70px;
left:-10px;
padding-bottom:20px;
}

    #deluxe_3,
    #deluxe_6,
    #deluxe_13,
    #deluxe_20 {
        left:-100px;
    }

    #deluxe_3:before,
    #deluxe_3:after,
    #deluxe_6:before,
    #deluxe_6:after,
    #deluxe_13:before,
    #deluxe_13:after,
    #deluxe_20:before,
    #deluxe_20:after{
        left:35%;
    }


    #deluxe_4,
    #deluxe_7,
    #deluxe_16 {
        left:-234px;
    }


    #deluxe_4:before,
    #deluxe_4:after,
    #deluxe_7:before,
    #deluxe_7:after,
    #deluxe_16:before,
    #deluxe_16:after {
        left:74%;
    }

.standardArrowBox:after,.standardArrowBox:before{
top:100%;
left:10%;
border:solid transparent;
content:" ";
height:0;
width:0;
position:absolute;
pointer-events:none;
}

.standardArrowBox:after{
border-color:rgba(136, 183, 213, 0);
border-top-color:#f7f7f7;
border-width:15px;
margin-left:-15px;
}

.standardArrowBox:before{
border-color:rgba(194, 225, 245, 0);
border-top-color:#04397a;
border-width:16px;
margin-left:-16px;
}

.standardArrowBox h1{
color:#303030;
font-size:14px;
line-height:16px;
margin-top:20px;
}

.standardArrowBox p{
margin:10px 0;
padding:0 10px;
color:#606060;
}
/* 1. OFM Standards Definition End */
/*-----------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* 2. OFM Icon Definition Start */
.chatMap{background:url(/bilder/chat/chat_icons_map.png) no-repeat transparent;}

.smileyIcon{
width:16px;
height:16px;
background-position:-21px 0;
}

.closeChatIcon{
width:21px;
height:21px;
background-position:0 0;
}

.generalIcon{
width:17px;
height:17px;
background-position:-37px -34px;
top:6px;
}

.generalActiveIcon{
width:17px;
height:17px;
background-position:-37px 0;
top:6px;
}

.helpChatIcon{
width:18px;
height:19px;
background-position:-54px -38px;
top:2px;
}

.helpChatActiveIcon{
width:18px;
height:19px;
background-position:-54px 0;
top:2px;
}

.privateChatIcon{
width:21px;
height:16px;
background-position:-72px 0;
top:4px;
}

.privateChatIcon{
width:21px;
height:16px;
background-position:-72px -32px;
top:4px;
}

.privateChatActiveIcon{
width:21px;
height:16px;
background-position:-72px 0;
top:4px;
}

.newPrivateChatMessageIcon{
width:21px;
height:16px;
background-position:-72px -64px;
top:4px;
}

.clansIcon{
width:24px;
height:16px;
background-position:-93px 0;
}

.closeButton{
width:14px;
height:15px;
background-position:-117px 0;
}

.kixxIcon{
width:29px;
height:17px;
background-position:-131px 0;
}

.pencilIcon{
width:12px;
height:15px;
background-position:-160px 0;
}

.newMessageIcon{
width:11px;
height:11px;
background-position:-131px -17px;
}

.small-chat-icon{
background:url(/bilder/chat/chat_freundesliste.png) no-repeat top left transparent;
width:12px;
height:12px;
margin:0 0 0 6px;
top:3px;
}

.small-chat-icon:hover{background:url(/bilder/chat/chat_freundesliste_hover.png) no-repeat top left transparent;}
.smileyIcon:hover{background-position:-21px -16px;}
.closeChatIcon:hover{background-position:0 -21px;}
.generalActiveIcon:hover{background-position:-37px -17px;}
.generalIcon:hover{background-position:-37px -51px;}
.helpChatActiveIcon:hover{background-position:-54px -19px;}
.helpChatIcon:hover{background-position:-54px -57px;}
.privateChatActiveIcon:hover{background-position:-72px -16px;}
.privateChatIcon:hover{background-position:-72px -48px;}
.clansIcon:hover{background-position:-93px -16px;}
.closeButton:hover{background-position:-117px -15px}
/* 2. OFM Icon Definition End */
/*-----------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------------------*/

/*
#turnier caption {
display: block;
    width: 97%;
}

table.tableScrollable {
    width: 100%;
    display:block;
}
.tableScrollable thead {
    display: inline-block;
    width: 100%;
}
.tableScrollable tbody {
    height: 220px;
    display: inline-block;
    width: 100%;
    overflow: auto;
}

.tableScrollable thead tr th:nth-of-type(1),
.tableScrollable tbody tr td:nth-of-type(1) {
    width:24px;
}

.tableScrollable thead tr th:nth-of-type(2),
.tableScrollable tbody tr td:nth-of-type(2) {
    width:100px;
}

.tableScrollable thead tr th:nth-of-type(3),
.tableScrollable tbody tr td:nth-of-type(3) {
    width:77px;
}

.tableScrollable thead tr th:nth-of-type(4),
.tableScrollable tbody tr td:nth-of-type(4),
.tableScrollable thead tr th:nth-of-type(5),
.tableScrollable tbody tr td:nth-of-type(5),
.tableScrollable thead tr th:nth-of-type(6),
.tableScrollable tbody tr td:nth-of-type(6) {
    width: 55px;
}

.tableScrollable thead tr th:nth-of-type(7),
.tableScrollable tbody tr td:nth-of-type(7) {
    width:80px;
}
*/

/******************************/
/*** Responsive Div-Tables ***/
/****************************/

.resp-table-wrap {
    padding-bottom:100px;
    max-height: 287px;
    overflow: hidden;
    position: absolute;
    width:calc(100% - 7px);
}

.resp-table-wrap .caption {
    border-top: 1px solid #031B42;
    border-bottom: 1px solid #031B42;
    padding: 0 0 0 5px;
    padding-top: 0px;
    height: 24px;
    font-weight: normal;
    text-align: center;
    width:calc(100% - 14px);
}


.resp-table-wrap .trainingImage {
    position: fixed !important;
    top: 0;
    margin-left: 120px;
    margin-top: 150px;
    z-index: 999999;
    color:#000;
}

.resp-table {
    width: calc(100% - 9px);
}

.resp-table-header{
/*display: table-header-group; */
background-color: gray;
font-weight: bold;
    display: flex;
}

    .table-header-cell {
    /*display: table-cell; */
    text-align: justify;
    border-bottom: 1px solid black;
    }


.resp-table-body {
/*display: table-row-group; */
    display: block;
    width: 100%;
    height: 192px;/*220px vorher*/
}

.resp-table-row {
/*display: table-row; */
    display: flex;
    flex-basis: 100%;
    cursor: pointer;
}

.table-body-cell {
height: 35px;
}

.table-body-cell.c0,
.table-body-cell.c1,
.table-body-cell.c6 {
    display:flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.table-body-cell.c6 {
    justify-content: flex-end;
}

.table-body-cell,
.table-header-cell {
    box-sizing: border-box;
    padding: 5px;
    display: block;
}

.table-header-cell {
    color:#FFF;
    font-size: 9px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center !important;
}


    .table-header-cell.c0,
    .table-body-cell.c0 {
        width:25px;
        background: #004072;
    }

        .table-body-cell.c0 input[type=radio] {
            margin-left:2px;
            margin-right:0;
        }

        .resp-table-row:nth-child(even) .table-body-cell.c0 {
            background:#002B50;
        }

    .table-header-cell.c1,
    .table-body-cell.c1 {
        width:120px;
        background:#155088;
        color:#FFF;
    }

        .resp-table-row:nth-child(even) .table-body-cell.c1 {
        background: #004072;
        }

    .table-header-cell.c2,
    .table-body-cell.c2 {
        width:89px;
        background-color: #91ABC9;
    }

        .table-body-cell.c2 {
            display: flex;
            align-content: center;
            justify-content: flex-start;
            flex-wrap: wrap;
        }

        .table-body-cell.c2 span {
            display: block;
        }

        .resp-table-row:nth-child(even) .table-body-cell.c2 {
            background: #749EB6;
        }

    .table-header-cell.c3,
    .table-body-cell.c3,
    .table-header-cell.c4,
    .table-body-cell.c4,
    .table-header-cell.c5,
    .table-body-cell.c5 {
        width:38px;
        background-color: #B5CBD8;
        display: flex;
        align-content: center;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

.table-header-cell.c3,
.table-body-cell.c3 {
    width: 40px;
}

        .resp-table-row:nth-child(even) .table-body-cell.c3,
        .resp-table-row:nth-child(even) .table-body-cell.c5 {
            background: #96B9C0;
        }

       .table-body-cell.c4 {
            background: #91ABC9;
        }


        .resp-table-row:nth-child(even) .table-body-cell.c4 {
            background: #80A4B2;
        }

.table-body-cell.c3,
.table-body-cell.c4,
.table-body-cell.c5,
.table-body-cell.c6 {
    text-align: right;
}

.table-header-cell.c6,
.table-body-cell.c6 {
    width:111px;
    padding-right: 10px;
    background-color: #6ba7b6;
}

    .resp-table-row:nth-child(even) .table-body-cell.c6 {
        background:#7cafc3;
    }


.table-header-cell.c0,
.table-header-cell.c1,
.table-header-cell.c3,
.table-header-cell.c5 {
    background:#4A87C1;
}

.table-header-cell.c2,
.table-header-cell.c4,
.table-header-cell.c6{
    background:#2B70AB;
}

/*
.resp-table-row:nth-child(odd):hover .table-body-cell.c0,
.resp-table-row:nth-child(odd).selected .table-body-cell.c0{
    background:#0c5187;
}

.resp-table-row:nth-child(odd):hover .table-body-cell.c1,
.resp-table-row:nth-child(odd).selected .table-body-cell.c1 {
    background:#4A87C1;
}

.resp-table-row:nth-child(odd):hover .table-body-cell.c2,
.resp-table-row:nth-child(odd).selected .table-body-cell.c2,
.resp-table-row:nth-child(odd):hover .table-body-cell.c4,
.resp-table-row:nth-child(odd).selected .table-body-cell.c4{
    background:#2B70AB;
}

.resp-table-row:nth-child(odd):hover .table-body-cell.c3,
.resp-table-row:nth-child(odd).selected .table-body-cell.c3,
.resp-table-row:nth-child(odd):hover .table-body-cell.c5,
.resp-table-row:nth-child(odd).selected .table-body-cell.c5{
    background:#4A87C1;
}

.resp-table-row:nth-child(odd):hover .table-body-cell.c6,
.resp-table-row:nth-child(odd).selected .table-body-cell.c6 {
    background:#2B70AB;
}


.resp-table-row:nth-child(even):hover .table-body-cell.c0,
.resp-table-row:nth-child(even).selected .table-body-cell.c0{
    background:#01213c;
}

.resp-table-row:nth-child(even):hover .table-body-cell.c1,
.resp-table-row:nth-child(even).selected .table-body-cell.c1 {
    background:#02355c;
}

.resp-table-row:nth-child(even):hover .table-body-cell.c2,
.resp-table-row:nth-child(even).selected .table-body-cell.c2,
.resp-table-row:nth-child(even):hover .table-body-cell.c4,
.resp-table-row:nth-child(even).selected .table-body-cell.c4{
    background:#4d7c96;
}

.resp-table-row:nth-child(even):hover .table-body-cell.c3,
.resp-table-row:nth-child(even).selected .table-body-cell.c3,
.resp-table-row:nth-child(even):hover .table-body-cell.c5,
.resp-table-row:nth-child(even).selected .table-body-cell.c5{
    background:#86b1ba;
}

.resp-table-row:nth-child(even):hover .table-body-cell.c6,
.resp-table-row:nth-child(even).selected .table-body-cell.c6 {
    background:#6196ab;
}
*/

.resp-table-row .table-body-cell {
    border-bottom: 1px solid transparent;
}

.resp-table-row:hover .table-body-cell,
.resp-table-row.selected .table-body-cell {
    color:#FFF;
    border-bottom: 1px solid rgba(0,0,0,.6) !important;
}

.resp-table-row:hover .kixx,
.resp-table-row.selected .kixx{
    color:lightsalmon;
}

.resp-table-row:hover .table-body-cell.c0,
.resp-table-row.selected .table-body-cell.c0{
    background:#0c5187;
}

.resp-table-row:hover .table-body-cell.c1,
.resp-table-row.selected .table-body-cell.c1 {
    background:#4A87C1;
}

.resp-table-row:hover .table-body-cell.c2,
.resp-table-row.selected .table-body-cell.c2,
.resp-table-row:hover .table-body-cell.c4,
.resp-table-row.selected .table-body-cell.c4{
    background:#2B70AB;
}

.resp-table-row:hover .table-body-cell.c3,
.resp-table-row.selected .table-body-cell.c3,
.resp-table-row:hover .table-body-cell.c5,
.resp-table-row.selected .table-body-cell.c5{
    background:#4A87C1;
}

.resp-table-row:hover .table-body-cell.c6,
.resp-table-row.selected .table-body-cell.c6 {
    background:#2B70AB;
}

.resp-table-row .trainingsmap.icon-info-big {
    margin-left:0 !important;
    position:absolute;
}

.infoTournament,
.infoTraining {
    margin-top: -33px;
    color: #000;
    margin-left: 20px;
}

.scrollable .scroll-bar.vertical {
    right:10px !important;
    z-index: 999;
}

.scrollable .viewport {
    touch-action: none;
}
