@font-face {
    font-family: "Roboto";
    src: url("/fonts/Roboto-Regular.eot");
    src: url("/fonts/Roboto-Regular.eot?#iefix") format('embedded-opentype'),
        url("/fonts/Roboto-Regular.woff2") format('woff2'),
        url("/fonts/Roboto-Regular.woff") format('woff'),
        url("/fonts/Roboto-Regular.ttf") format('truetype');
    font-weight: 400;
    font-style: normal;
}
.color-1{

    background-color:white; 
    color:navy;
    border:navy;    
}

.affix {

    width: 100%;
    z-index: 9996 !important;
}

.loader {
    border: 2px solid black; /* Light grey */
    border-top: 2px solid white; /* Blue */
    border-bottom-color: navy;
    border-radius: 50%;
    width: 1em;
    height: 1em;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.ui-widget-overlay {
    border-radius: 0px;
    opacity: 0.6;
    background-color: navy;
    z-index:9999 !important;

}
.ui-autocomplete.ui-front.ui-menu.ui-widget.ui-widget-content{
    z-index:9998 !important;
    border:1px solid navy;
}

.ui-widget-content .ui-state-focus{
    background: inherit;  
}
.link{
    color:inherit;
    cursor:pointer;
    text-decoration:underline;
}
.link:hover{
    color:inherit;
    cursor:pointer;
    text-decoration:none;
}
.color-2{

    color:white;     
    background-color:navy;

} 
.col-lg-3 .color-2{

    color:white;     
    background-color:navy;

} 
#order,#marker,[name=group],[name=vocmode]{

    color:black;     
    background-color:white;

} 

.navbar-inverse .navbar-nav > li > a {
    color:inherit;   
}
.navbar-inverse .navbar-nav > li > a:hover{
    color:inherit;
    opacity:0.5;
}

.navbar-inverse .navbar-nav > li > a.active
{
    opacity:0.5;
}
.navbar-inverse .navbar-toggle{

    border-color:inherit;
}
.navbar-inverse .navbar-toggle .icon-bar{
    color:inherit;
    border:1px solid;
    border-color:inherit;
}
.navbar-inverse .navbar-toggle .icon-bar:hover{
    color:inherit;
    border:1px solid red;
    border-color:inherit;

}
.button.color-2:active{

    transform: translateY(4px);
}

.color-3{

    color:black;
    background-color:white;
    border-color:white;

}
.color-4{
    color:black;
    background-color:lightgreen;
    border-color:white;
}    

.color-5{
    color:maroon;
    background-color:lightcoral;
    border-color:white;
}    


body {
    font-family: Roboto, sans-serif;
    font-size:14px;
}
.mobil{
    display:none;
}
.navbar-nav img{
    height:30px; 

}
.desktop{
    display:block; 
}
.main {
    text-align:left; 
    max-width:1200px;
    margin:auto;
    padding-left:0px;
    padding-right:0px;

}
#langbar .flag{
    height:30px;
    width:40px;
    border:1px white solid;
}
body>.wrapper {
    width: 100%;


}
.user-choice{
    cursor:pointer;
    padding:5px;
    border:1px solid;
}
a{
    color:inherit;
}
legend {
    font-weight: bold;
}



fieldset {
    margin: auto;
    border-width: 0px;
}

.big_card{
    font-size:21px;
    padding:20px;
    margin-right:5px;


}
.balken-label{
    clear:both;
    padding-top:10px;

}

.balken-container{ 

    min-height:30px;
    height:30px;

}
.balken{ 
    width:100%; 
    height:20px; 
    float:left; 
    z-index:1; 
}

.balken-front{ 
    width:20px; 
    height:20px; 
    opacity:0.5;
    transform:skew(0deg,-45deg); 
    -moz-transform:skew(0deg,-45deg); 
    -webkit-transform:skew(0deg,-45deg); 
    -o-transform:skew(0deg,-45deg); 
    margin-right:-100%; 
    margin-top:-10px; 
    float:left; 
    z-index:100; 
}
.balken-side{ 
    opacity:0.7;
    width:100%; 
    height:20px; 
    transform:skew(-45deg,0deg);
    -moz-transform:skew(-45deg,0deg); 
    -webkit-transform:skew(-45deg,0deg); 
    -o-transform:skew(-45deg,0deg); 
    margin-left:10px; 
    z-index:1; 

}
.button{
    margin-bottom:5px;
}
.stat_panel{
    overflow:hidden;
    padding:10px;
    background-color:wheat;
    color:black;
    padding-top:10px;
}



.caption{
    color:inherit;
    margin-left:10px;
    padding:0px;
    float:right;
    font-family:Courier;

}

.choose-alpha{
    background-color:white;
    padding:5px;
    margin-right:10px;
    cursor:pointer;
    font-family:Courier;
    font-size:21px;
    float:left;
    font-weight:bold;
    color:red;
}
.choose-loud{
    background-color:white;
    padding:5px;
    margin-right:10px;
    cursor:pointer;
    font-family:Courier;
    font-size:21px;
    float:left;
    margin-bottom:5px;
    font-weight:bold;
    color:green;
}    
.add_bag{
    font-size:10px;
    margin-right:10px;
    float:left
}
.hear{
    font-size:10px;
    float:left
}
.image{
    font-size:10px;
    float:left;
    margin-left:10px;    
}
.edit{
    font-size:10px;
    float:left;
    margin-left:10px;    
}
.rescan{
    font-size:10px;
    margin-left:10px;  
    float:left
}
#head  {

    overflow:hidden;
    width:100%;

}
#head > div {
    display:inline;

}
div .reihe:hover{
    background-color:white;

}
div .reihe{
    font-size:20px;

}
div .word:hover{
    background-color:#eeeeff;
    cursor:pointer;

}


#erase{
    cursor: pointer;
}

textarea{
    width:100%;
}
.colorinput{
    margin-bottom:20px;
}
.red{
    color:red !important
}
.pager{
    margin:0px;
    margin-right:5px;

}

.kb{

    text-align:center;
    margin-right:10px;
    cursor:pointer;
    font-family:Courier;
    font-size:18px;
    float:left;
    width:30px;
    line-height:1.5em;

}
.kb.page{
    line-height:30px;


}
.row{

    margin-bottom:10px; 
}
.custom_height{
    height:400px;
}
.color-1 .ui-corner-all,input,select{
    border:1px solid;
    border-top-color:inherit;
}
.ui-state-active,.ui-widget-content{
    border:1px solid white;
}
.ui-icon{
    color:inherit;

}
.ui-corner-all.navi#group_it,
.ui-corner-all.navi#bookmark_it,
.ui-corner-all.navi#print_it,
.ui-corner-all.navi#word_it
{
    color:inherit;
    width:200px;
    max-width:90%;
    max-height:32px;
    height:26px;


}
.ui-corner-all.navi#group_it .ui-button-text,
.ui-corner-all.navi#bookmark_it .ui-button-text,
.ui-corner-all.navi#print_it .ui-button-text,
.ui-corner-all.navi#word_it .ui-button-text

{
    color:inherit;
    width:200px;
    max-width:100%;
}


.ui-corner-all.navi{
    padding:0px;
    margin-right:10px;
    cursor:pointer;
    font-family:Courier;
    font-size:14px;

    width:40px;
    min-width:40px;
    max-width:40px;
    height:32px;
    max-height:2em;
    min-height:2em;
    margin:0px;
    top:0px;
    margin-right:10px;


}
.ui-corner-all.navi .ui-button-text{

    padding:0px;
    margin:0px;
    width:40px;
    padding-bottom:0px;
    line-height:2em; 
    height:32px;
    max-height:2em;
    min-height:2em;

}
.ui-corner-all.inputbar .ui-button-text
{
    line-height:16px;    
}

.ui-corner-all.hear .ui-button-text,
.ui-corner-all.rescan .ui-button-text,
.ui-corner-all.edit .ui-button-text,
.ui-corner-all.image .ui-button-text,
.ui-corner-all.add_bag .ui-button-text
{
    padding:1px;  
}
.ui-corner-all.add_bag,
.ui-corner-all.hear,
.ui-corner-all.rescan,
.ui-corner-all.image,
.ui-corner-all.edit{
    padding:1px;
    line-height:1px;
    height:24px;
    max-width:24px;
    min-width:40px;
}
input[type=text],input[type=password]{
    padding:0px;
    line-height:2em;
    font-size:16px;
    min-width:100px;
    height:28px;
    padding-left:5px;
    color:inherit;
    background-color:inherit;

}
select.color-2,option{
    padding:0px;
    padding-left:5px;
    line-height:1em;
    height:32px;
    font-size:16px;
    min-width:100px;
    color:inherit;

}
.ui-corner-all,
#add_vocs.ui-corner-all.ui-state-default,
#delete_vocs.ui-corner-all.ui-state-default,
#add_subbag.ui-corner-all.ui-state-default,
#delete_subbag.ui-corner-all.ui-state-default,
#erase_vocs.ui-corner-all.ui-state-default,
#shift_vocs.ui-corner-all.ui-state-default,option.color-2
input[type=button],input[type=text]
input[type=submit],input[type="password"]{


    background-image: none;
    border-radius:2px;
    line-height:26px;
    font-size:16px;
    min-width:100px;
    color:inherit;
    padding-left:5px;
    background-color:inherit;
    color:inherit;
}

.col-lg-3 input,.col-lg-4 input,.col-lg-2 input,
.col-lg-3 select,.col-lg-4 select,.col-lg-2 select,
.col-lg-3 .button,.col-lg-2 .button, .col-lg-4 .button
{
    width:100%; 
    height:32px;
    line-height:26px;
    font-size:16px;
    background-color:inherit;

}
.col-lg-4 select,.col-lg-2 select,.col-lg-3 select{
    height:32px;
}
#tabs h3{
    padding-left:30px;
    line-height:1em;
    min-hight:2.1em;
    height:auto;
}

.ui-accordion,.ui-accordion-header,.ui-widget-content{
    background:none; 
    background-color:inherit;
    color:inherit;
}
option{
    background-color:inherit;
    color:inherit;
}

.ui-autocomplete{

}
.ui-autocomplete .ui-state-focus{
    background-color:inherit;
    color:inherit;
    font-weight:bold;
}
.stat_panel{
    margin:2px;
}
.checkbox {
    display: inline-block;
    vertical-align: top;
    padding-left: 25px;
    position: relative;
    width:100%;

    height:28px;
}

.checkbox input.input-checkbox {
    position: absolute;
    left: 0px;
    top: 0px;
    margin-top:2px;
    margin-left:0px;
    width:20px;
    height:18px;

}
.ui-corner-all.navi.reset_it,.ui-corner-all.navi.filter_it{
    margin-top:-2px;

}
.ui-corner-all.navi.reset_it_main,.ui-corner-all.navi.filter_it_main,.ui-corner-all.navi.search_it_main{


    max-height:40px;
    height:30px;
    margin:0px;
    margin-left:10px;
    border-radius:0px;

}
#langbar img,.navbar-nav .lang_it{
    margin:0px;
    height:30px;
    margin-top:0px;
    margin-right:10px;

}


[data-id="fr"],[data-id="de"],[data-id="meta"],[data-id="description"]{

    float:left;
    display:block;

    overflow:hidden;

} 

#end{
    margin-right:0px;

}
.xs-small{

    padding-right:15px;
}
.imageview{
   
    width:50%;
    margin-left:auto;
    margin-right:auto;    
}
@media (max-width:1200px) {

    .navbar-nav img{
        height:30px; 
        margin-top:5px;
    }

    .main {
        padding-left:10px;
        padding-right:10px;

    }
    input,select,.ui-corner-all.navi{
        margin-bottom:10px;

    }

    .ui-corner-all.navi{

        width:30px;
        min-width:10px;
    }
    .ui-corner-all.navi .ui-button-text{

        width:inherit;
    }

    .ui-corner-all.navi.reset_it{
        float:right;
        margin-right:0px;

    }
    #langbar img, .navbar-nav .lang_it img{
        padding:0px;
        margin-top:0px;

    }
    .filter_it{
        float:left;

    }
    .navbar-nav.nav{
        font-size:12px
    }
    .ui-corner-all.navi.reset_it_main,.ui-corner-all.navi.filter_it_main,.ui-corner-all.navi.search_it_main{
        margin-top:0px;
        margin-right:0px;

    }

}
@media (max-width:992px) {
    .mobil{
        display:block;
    }
    .desktop{
        display:none; 
    }
}
@media (max-width:768px) {
    .imageview{

        width:80%;
        margin-left:auto;
        margin-right:auto;   
    }
    .mobil{
        display:block;
    }
    .desktop{
        display:none; 
    }
    div{

    }
    .main {
        padding-left:1px;
        padding-right:1px;

    }

    .reset-it{
        float:right;
        margin-right:0px
    }
    .filter-it{
        float:left;
    }
    .col-xs-12.col-md-3{
        width:50%;  
    }
    .ui-corner-all.navi#group_it .ui-button-text,
    .ui-corner-all.navi#group_it,
    .ui-corner-all.navi#bookmark_it,
    .ui-corner-all.navi#print_it,
    .ui-corner-all.navi#print_it .ui-button-text,
    .ui-corner-all.navi#word_it,
    .ui-corner-all.navi#word_it .ui-button-text,
    .ui-corner-all.navi#bookmark_it .ui-button-text{
        width:100%;
        max-width:100%;

    }

    .ui-corner-all.add_bag, .ui-corner-all.hear, .ui-corner-all.rescan,.ui-corner-all.image,.ui-corner-all.edit {
        padding: 1px;
        line-height: 1px;
        height: 24px;
        width: 100%;
        font-size:10px;
        min-width: 1px;
        margin-left:0px;
    }
}    
@media (max-width:500px) {
    .imageview{
        
        width:100%;
        margin-left:auto;
        margin-right:auto;   
    }
    .navbar-nav.nav{
        font-size:16px
    }  

    #langbar .flag {
        height: 20px;
        width: 25px;
        border: 1px white solid;
    }
    #langbar img,.navbar-nav .lang_it{
        margin:0px;
        height:25px;
        margin-top:0px;
        margin-left:5px;
        margin-right:5px;

    }

    .main {
        padding-left:1px;
        padding-right:1px;

    }
    .ui-corner-all.add_bag, .ui-corner-all.hear, .ui-corner-all.rescan, .ui-corner-all.edit {
        padding: 1px;
        line-height: 1px;
        height: 24px;
        width: 100%;
        font-size:9px;
        max-width: 20px;
        width:20px;
        margin-left:0px;

    }
    [data-id="mark"]{

    }
    .col-sm-3.col-md-3.col-xs-3.xs-small,.stat_panel {
        padding:0px;
        padding-right:5px;

    }
    .col-xs-12, .col-xs-2, .col-xs-6 {
        padding-left:5px;
        padding-right:5px;

    }
    .col-xs-12 #tabs h3,.ui-accordion .ui-accordion-content {

        padding:10px;
    }
    div{

    }
    .col-xs-12.col-md-3{
        width:50%;

    }
    .col-sm-3.col-md-3.col-xs-3.xs-small{
        padding-right:5px;
        padding-left:0px;

    } 
    .col-sm-1.col-md-1.col-xs-1.xs-small-left{
        padding-right:0px;
        padding-left:5px;


    } 
    .ui-corner-all.navi#group_it .ui-button-text,
    .ui-corner-all.navi#group_it,
    .ui-corner-all.navi#bookmark_it,
    .ui-corner-all.navi#print_it,
    .ui-corner-all.navi#print_it .ui-button-text,
    .ui-corner-all.navi#word_it,
    .ui-corner-all.navi#word_it .ui-button-text,
    .ui-corner-all.navi#bookmark_it .ui-button-text{
        width:100%;
        max-width:100%;

    }
    .ui-corner-all.navi.reset_it,.ui-corner-all.navi.filter_it{
        margin-top:0px;

    }
    #end{
        margin-right:0px
    }

}