﻿body {
    /*font-family: Arial;*/
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    background-color: var(--bodycolor);
}

#wrapper {
    background-color: var(--wrappercolor);
}

#header {
    background-color: var(--headercolor);
    border-bottom: solid 5px var(--headerlinecolor);
}

#navleft {
    background-color: var(--navleftbackground);
}

#main {
    background-color: var(--maincolor);
    color: var(--mainfontcolor);
}

#footer {
    background-color: var(--footercolor);
}

a {
    color: var(--afontcolor);
}

    a#suchelink {
        text-decoration: none;
    }

h1 {
    color: var(--h1color);
}

.idfeld {
    font-weight:300;

}

.actionheader {
    background-color: var(--headlinebackground);
    color: var(--menutext);
    font-weight: bold;
    width: 100%;
    padding: 5px 5px 5px 10px;
    border-radius: 10px;
    font-size: 1em !important;
}



.ATreeLevel1 {
    color: var(--menutext);
    background-color: var(--headlinebackground);
    width: 100%;
    display: inline-block;
    padding: 5px 5px 5px 10px;
    border-radius: 10px;
}

.ATreeLevel1 {
    font-weight: bold;
    
 /*   color: #590303;*/
}


.rayTableHeaderRow {
    color: var(--tablerowheadercolor);

}

    .rayTableHeaderRow th {
        font-weight: 300;
        font-size: 1em;
    }

    a.mblink {
        color: var(--amblinkcolor);
    }

input[type=submit], input[type=file], input[type=button], .linkbutton, #enabledragdrop {
    background-color: var(--buttoncolor);
    border-radius: 7px 7px 7px 7px;
    padding: 2px 22px 2px 22px;
    border: 3px solid var(--buttoncolor);
    color: var(--buttonfontcolor);
    font-size: 0.8em;
    cursor: pointer;
}

    input[type=submit]:hover, input[type=file]:hover, input[type=button]:hover, .linkbutton:hover, #enabledragdrop:hover {
        background-color: var(--buttonhovercolor);
        border: 3px solid var(--buttoncolor);
    }


    .startlink a {
        color: var(--menutext);
    }

.LITreeLevel2:before {
    color: var(--mainfontcolor);
}

.logoutbutton {
    color: var(--logoutbuttoncolor);
}

.rayTableDiv td {
    border-top: 1px dotted var(--headerlinecolor);
    border-bottom: 1px dotted var(--headerlinecolor)
}

.rayTableDiv tr:nth-child(even) {
    background: var(--tabroweven);
}

.rayTableDiv tr:nth-child(odd) {
    background: var(--tabrowuneven);
}

.sitelogo {
    display: block;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
}
.logopanel {
    width: 100%;
}

.MainMenuTreeviewtrvClicktoOpen {
    cursor: pointer;
}

.LITreeLevel2:before {
    font-family: FontAwesome;
    /*content: '\f067';*/
    margin: 0 5px 0 -25px;
    font-size: 0.6em;

}

.LITreeLevel2 {
    border-left: 1px dotted #aba1b5;
    border-bottom: 1px dotted #aba1b5;
    padding: 3px 2px 3px 10px;
    border-radius: 0px 0px 0px 10px;
}

.LITreeLevel1 ul {
    margin-left: -15px;
}

.ATreeLevel2 {
    text-decoration: none;
    color: #4a3d50;
}

div.uploadform {
    margin: 10px 0 10px 0;
}

h1 {
    font-size: 1.4em;
    font-weight: bold;
}

h2{
    font-size: 1.0em;
    font-weight: bold;
    color: var(--menutext);
}

input, textarea, select {
    background-color: var(--inputbackground);
    border-radius: 3px 3px 3px 3px;
    margin-left: 3px;
    border: 1px solid var(--headerlinecolor);
}

    input:active, input:focus, textarea:active, textarea:focus, select:active, select:focus {
        background-color: #fff;
        border: 3px solid var(--borderfocuscolor);
        box-shadow:  0 0 10px var(--borderfocusshadow);
    }


.tabellenvorschau {
    overflow: visible;
    z-index: 10;
    position: absolute;
    background-color: white;
}

.tabellenvorschau tr {
    vertical-align: top;
}

.AlleTrackdetails h2 {
    cursor:pointer;
}

.rayTableHeaderRow {
    /*color: #590303;*/
    font-weight: bold; 
    text-align: left;
    border-bottom: 1px solid #000;
}
.rayTableHeaderRow td {
        color: #590303;
    font-weight: bold; 

}

.raygridTable {
   border-collapse: collapse;
}


.raygridTable td i {
    margin: 0 10px 0 10px;
}

.nodeicon {
    margin-right: 5px;
}

.tabfeldvalue {
    font-weight: 300;
}

.rayTabForm label, .idfeld, .raytablabel {
    font-weight: 300;
    margin-bottom: 5px;
}

    @media (max-width: 470px) {
        .rayTabForm input, .rayTabForm textarea, .rayTabForm select {
            width: 100%;
        }

        .rayTabForm span {
            display: block !important;
            margin-left: 0 !important;
            width: 100% !important;
        }

        .rayTabForm label, .idfeld, .raytablabel {
            display: block;
            width: 100%;
            vertical-align: top;
            color: var(--menutext);
        }
    }

    @media (min-width: 471px) {
        .rayTabForm input, .rayTabForm textarea {
            width: 470px;
        }

        .rayTabForm label, .idfeld, .raytablabel {
            display: inline-block;
            width: 200px;
            vertical-align: top;
            color: var(--menutext);
        }
    }

    .rayTabForm .tabellenaktion {
        width: 80px;
        margin-right: 120px;
    }



    .rayTabForm .raytabformbutton {
        width: 100px;
    }

    a.mblink {
        font-weight: 300;
        /*    color: #590303;*/
    }

        a.mblink:hover {
            text-decoration: none;
        }

    .detailitem {
        width: 500px;
    }

    #dgvbeteiligteautoren .rayGridButton {
        width: 50px
    }

    #dgvbeteiligteverlage .rayGridButton {
        width: 50px
    }

    .rayTabForm #barcode {
        width: 150px;
    }

    /*.linkbutton {
        margin-left: 5px;
        margin-right: 5px;
        height: 20px;
        background-color: #6d8db5;
        padding: 4px;
        background: -moz-linear-gradient(top, #8899c2 0%, #6d8db5 100%);
        background: -webkit-linear-gradient(top, #8899c2 0%,#6d8db5 100%);
        background: -o-linear-gradient(top, #8899c2 0%,#6d8db5 100%);
        background: linear-gradient(to bottom, #8899c2 0%,#6d8db5 100%);*/
        /*    background: -ms-linear-gradient(top, #8899c2 0%,#6d8db5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8899c2', endColorstr='#6d8db5',GradientType=0 );*/
        /*border-radius: 7px 7px 7px 7px;
        border: 3px solid #FFF;
        color: #FFF;
        font-size: 0.8em;
        cursor: pointer;
    }*/

    .pruefmeldung {
        color: red;
        font-size: 0.8em;
    }

    .playbutton span:after {
        font-family: FontAwesome;
        margin-left: 5px;
        content: "\f01d";
        cursor: pointer;
    }

    .playbutton span.playing:after {
        font-family: FontAwesome;
        margin-left: 5px;
        content: "\f04c";
    }



    .actiondetails {
        margin-bottom: 20px;
        border: 1px dotted #808080;
        width: 900px;
        margin-left: 20px;
    }

    .panelclose {
        font-size: 0.5em;
        margin-left: 20px;
        font-weight: normal;
        cursor: pointer;
    }

    .isrc {
        width: 50px;
    }

    .KatalogsuchePagerAlphabet a, .KatalogsuchePagerAlphabet a:visited {
        font-size: 0.8em;
        font-weight: bold;
        color: #808080;
    }

    span.pageralphabet {
        display: inline-block;
        margin-right: 10px;
    }

    .bulksave {
        cursor: pointer;
    }

    span.uncheckall, span.checkall, span.deleteallchecked {
        font-size: 0.8em;
        color: var(--menutext);
        display: inline-block;
        width: 200px;
        cursor: pointer;
        font-weight: bold;
    }

        span.uncheckall:hover, span.checkall:hover, span.deleteallchecked:hover {
            font-size: 0.8em;
            color: #03055a;
            display: inline-block;
            width: 200px;
            cursor: pointer;
            font-weight: bold;
        }


    .tagupdate {
        height: 400px;
    }

    .deletetagfound {
        text-decoration: line-through;
        color: red;
    }

    td.tagupdatecol1 {
        width: 300px;
        vertical-align: top;
    }

    .tagupdatecol2 {
        width: 600px;
        vertical-align: top;
    }

    select[name="filename"] {
        width: 250px;
    }

    select[name="kategorieid"] {
        width: 150px;
    }

    #trackRayDivID {
        font-size: 0.8em;
    }

    #addtrackartist {
        color: blue;
        cursor: pointer;
    }

    /*.rayTableDiv tr:nth-child(even) {background: #e1e1dc;}
.rayTableDiv tr:nth-child(odd) {background: #FFF;}*/

    input[type="date"] {
        width: 125px !important;
    }


    td.glossarcol1 {
        font-weight: bold;
    }

    .fehlermeldung {
        color: red;
    }

    .logoutbutton {
        margin-left: 40px;
        /*    color: red;*/
    }

    .rayTabForm tr td {
        vertical-align: top;
    }

    #trackRayDivID.autor tbody tr:not(.locked) {
        background-color: lightblue;
    }

    #specialdescriptionsavebutton {
        display: block;
        margin-left: 200px;
    }

    span.keywordfilter {
        display: inline-block;
        margin: 10px 10px 5px 0;
        border: solid 1px #000;
        border-radius: 7px;
        padding: 0 5px 0 5px;
        background-color: #e1e1dc;
        cursor: pointer;
    }

    .clearfix:before,
    .clearfix:after {
        content: " "; /* 1 */
        display: table; /* 2 */
    }

    .clearfix:after {
        clear: both;
    }

    .rayTabForm.readonly span {
        width: 470px;
    }

    .rayTabForm.readonly label {
        width: 200px;
    }

    .startlink {
        margin-left: 10px;
        font-size: 1.2em;
        font-weight: bold;
    }
    /*
        .startlink a {
            color: #590303;
        }*/

    a#mbMain_sperreaufheben {
        margin-bottom: 10px;
        display: inline-block;
    }

    span.label {
        display: inline-block;
        width: 100px;
    }

    img.sprachwahlflagge {
        width: 25px;
        margin-right: 10px;
    }

#Sprachwahl a {
    font-weight: 100;
    text-decoration: none;
}


.helpicon {
    margin-left: 10px;
    cursor: pointer;
    font-size: 18px;
    vertical-align: top;
}

#tracksubkategorieRayDivID select {
    width: 250px;
}