* {
    font-family: Arial, serif;
}
.box {
    padding: 20px;
    margin: auto;
    max-width: 1600px;
    background-color:#ccc;
    /*min-width: 660px;*/
    position: relative;
    border-left: #f7a823;
    clear: both;
}

header::before,
footer::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 6px;
    clear: both;
    background: #95c11f;
    background: -moz-linear-gradient(left,  #95c11f 0%, #95c11f 33%, #007ba6 33%, #007ba6 66%, #f7a823 66%, #f7a823 100%);
    background: -webkit-linear-gradient(left,  #95c11f 0%,#95c11f 33%,#007ba6 33%,#007ba6 66%,#f7a823 66%,#f7a823 100%);
    background: linear-gradient(to right,  #95c11f 0%,#95c11f 33%,#007ba6 33%,#007ba6 66%,#f7a823 66%,#f7a823 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#95c11f', endColorstr='#f7a823',GradientType=1 );
    background-size: 100% 50px;
}

.box:before {
    top: 0;
}
.box:after {
    bottom: 0;
}
header {
    padding: 4px !important;
}
.page-login header,
.page-login footer,
.login {
    width: 800px;
    margin: auto;
}
.content {
    height: 100%;
    position: relative;
}

.nav_el {
    color: #fff;
    background-color: #b3b3b3;
    border: 1px solid #ccc;
    display: inline-block;
    height: 4em;
    text-align: center;
	color: #000000;
}
.nav_el > span {
    display: block;
    line-height: 4em;
    font-weight: 600;
}
.nav_el:hover {
    color: #404040;
    text-decoration: underline;
}
a {
    color: #333;
}
a:hover {
    color: #333;
    text-decoration: underline;
}
.txt1 {
    font-size: 1.2em;
    /*margin-left: 4px;*/
}
.vwlbtn {
    height: 27px;
    vertical-align: top;
}
.inpw {
    width: 250px;
    height: 26px;
}
.full-width {
    width: 100% !important;
}
.btn-add {
    background-color: #5d9d68;
}
.btn-add2 {
    background-color: #346c34;
}
[data-edid] {
    background-color: #fffa74;
}
[data-delid], .red {
    background-color: #ff645b;
}

.req label::after {
    content: "*";
}

#creaFacForm select {
    display: inline-block;
    width: 85%;
}

#exiFacPnl .panel-title a {
    display: inline-block;
    margin: 4px -2px !important;
}

#nfrbgn h3 {
    margin-top: 0;
}

.answerlist li {
    margin-bottom: 0 !important;
    margin-top: 4px !important;
}

#quests .form-control {
    display: inline-block;
}

.add_answer {
    margin: 3px 0 15px 40px;
}

#nfrbgn input[type=text], #nfrbgn textarea {
    width: 95%;
    display: inline-block;
}

#nfrbgn .questionlistitem > label {
    padding: 0;
}
#nfrbgn .questionlistitem textarea,
#nfrbgn .questionlistitem input {
    padding: 8px;
}

/*#nfrbgn #kats table:nth-child(1) { background-color: #ffe6e6; }*/
/*#nfrbgn #kats table:nth-child(2) { background-color: #dff5ff; }*/
/*#nfrbgn #kats table:nth-child(3) { background-color: #fff6e6; }*/
/*#nfrbgn #kats table:nth-child(4) { background-color: #E7FFE7; }*/
/*#nfrbgn#kats table:nth-child(5) { background-color: #EFEDD2; }*/
/*#nfrbgn#kats table:nth-child(6) { background-color: #FFF0F5; }*/
/*#nfrbgn#kats div:nth-child(7) { background-color: #E0EDED; }*/
/*#nfrbgn#kats div:nth-child(8) { background-color: #CCE1E9; }*/
/*#nfrbgn#kats div:nth-child(9) { background-color: #F2E7E9; }*/

.question {
}
.answer {
    width: 85%;
    display: inline-block;
}
.wert {
    width: 9%;
    vertical-align: top;
}
#vwl_table {
}
#vwl_table .wid {
    padding: 0 15px;
}
#nfrbgn ul, #nfrbgn li {
    list-style: none;
}
#nfrbgn .add_question {
}
#nfrbgn .kat_el_wrapper {
    margin-bottom: 20px;
    background-color: #bebebe;
    padding: 15px;
}
#nfrbgn .kateg_inp {
    margin-bottom: 10px;
}
#nfrbgn .red {
    height: 35px;
}
#nfrbgn * {
    border-radius: 0;
}
#nfrbgn button > .ui-accordion-header-icon {
    display: none !important;
}
#nfrbgn button {
    padding-left: 12px !important;
}
#kats {
    padding: 0;
}
.kat_el_wrapper > span {
    font-size: 18px;
    display: inline-block;
    width: 100%;
    background-color: #eeeeee;
    padding: 6px;
    margin-bottom: 5px;
    cursor: pointer;
}
.questionlist {
    background-color: #eeeeee;
    padding: 5px;
}
.questionlistitem {
    background-color: #cccccc;
    border: 2px solid #eee;
    border-bottom: 24px aliceblue solid;
    cursor: pointer;
    /*display: inline-block;*/
    width: 100%;
    padding: 5px;
    margin: 8px 0 0;
}
.questionlistitem > span {
    display: inline-block;
    /*width: 100%;*/
}
#fill_fall .kat_wrapper:not(:first-child) {
    display: none;
}
.prev-btn {
    display: none;
    width: 50%;
}
.cont-btn {
    float: right;
    width: 50%;
}
.save-btn {
    width: 100%;
}
#diagram {
    position:relative;
    border: 1px solid #000;
    background: #fff;
    padding: 30px;
    width: 100%;
}
#axes {
    border-bottom:1px solid black;
    border-left:1px solid black;
    padding: 20px 0;
}
#axes_label_left {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg) !important;
    display: inline-block;
    position: absolute;
    left: -20px;
    top: 45%;
}
.kat_bars {
    margin-top: 8px;
    position: relative;
    background-color: #f0f0f0;
}
.bar {
    text-align: right;
    padding-right: 5px;
}
.bar > span {
    float: left;
}
.kat_label {
    position: absolute;
    top: 0;
    right: 8px;
    display: inline-block;
    line-height: 2.8em;
}
.edit-kat-name {
    float: right;
    margin: 3px;
}
.kat-name  {
    text-align: left;
    margin-bottom: 0 !important;
    padding: 1px !important;
}
.switch_link, .spl_link {
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}


ul.tabs{
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.tabs li{
    background: none;
    color: #222;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
}

ul.tabs li.current{
    background: #ededed;
    color: #222;
}

ul.tabs li:nth-child(1) { background-color: #ffe6e6; }
ul.tabs li:nth-child(2) { background-color: #dff5ff; }
ul.tabs li:nth-child(3) { background-color: #fff6e6; }
ul.tabs li:nth-child(4) { background-color: #E7FFE7; }
ul.tabs li:nth-child(5) { background-color: #EFEDD2; }
ul.tabs li:nth-child(6) { background-color: #FFF0F5; }
ul.tabs li:nth-child(7) { background-color: #E0EDED; }
ul.tabs li:nth-child(8) { background-color: #CCE1E9; }
ul.tabs li:nth-child(9) { background-color: #F2E7E9; }

.tab-content{
    display: none;
    background: #ededed;
    padding: 15px;
}

ul.tabs li.current {
    font-weight: bold;
}

.tab-content.current{
    display: inherit;
}

.fr_antw > label * {
    vertical-align: middle;
    margin-top: 0 !important;
}

/*.tab-content fieldset {*/
fieldset {
    border: 1px solid black !important;
    padding: .35em .625em .75em !important;
    margin: 0 2px !important;
    margin-bottom: 20px !important;
    background-color: #FAFAFA;
}

/*.tab-content fieldset legend {*/
fieldset legend {
    display: inline-block !important;
    width: auto !important;
    margin-bottom: 0 !important;
    padding: 1px 9px;
    background-color: #000;
    color: #fff;
    max-width: 100%;
}

.fr_free_txt label, .fr_free_txt textarea  {
    width: 100%;
    display: block;
}

#eva_control {
    background: #ededed;
}
.res_a, .res_b {
    border: 1px solid;
    padding: 10px;
}
.hor_bar {
    border: 1px solid;
    text-align: right;
}
.cat_m {
    background: cornflowerblue;
}
.cat_e {
    background: coral;
}
.cat_details {
    padding: 0 20px;
}
.show_quest {
    cursor: pointer;
    /*margin: 15px;*/
}
.show_quest_wrapper {
    color: rgb(60, 121, 168);
    margin: 15px;
    /*border: 1px dotted;*/
}
.show_quest_wrapper td {
    color: #3c3c3c;
    font-size: small;
}
.btn {
    background: #575756;
    color: #ffffff;
}
.miniflag {
    width: 33px;
    margin-left: 10px;
}

footer img {
    height: 60px;
}

.main-img-1 {
    height: 35px;
    margin-top: 20px;
}

.main-img-2 {

}

.main-img-3 {

}

.tflag {
    float: right;
    margin-left: 5px;
}

.tflag > img {
    width: 40px;
    height: 20px;
}

/* Korrekturen*/

body{
    background-color: #E6F5FF;
    padding-top: 1rem;
    color: #707070;
}
.box {
    background-color:rgb(255, 255, 255);
    text-align: center;
}
header.box {
    padding: 20px 20px 0 0;
    margin-top: 40px;
    border-radius: 10px 10px 0 0;
}
footer.box {
    padding-bottom: 20px;
    margin-bottom: 40px;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}
header::before,
footer::after {
    height: 4px;
    background: #187cbd;
    background: -moz-linear-gradient(left,  #88BBE6 0%, #88BBE6 50%,#187cbd 50%, #187cbd 100%);
    background: -webkit-linear-gradient(left,  #88BBE6 0%,#88BBE6 50%,#187cbd 50%, #187cbd 100%);
    background: linear-gradient(to right, #88BBE6 0%, #88BBE6 50%, #187cbd 50%, #187cbd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#187cbd', endColorstr='#88BBE6',GradientType=1 );
}
form h2{
    color: #187cbd;
    font-weight: bold;
}
.form-control{
    border: 1px solid #88bbe6;
}
form input{
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.btn{
    background: #187cbd;
}
.btn-primary:hover{
    background: #88bbe6;
    border-color: #187cbd;
}
.box:before {
    display: none;
}

/* Korrekturen 2- Login */
.box{
    max-width: 1200px;
}
header.box{
    padding: 20px !important;
}
.faq-link.ml-1 {
    color: #187cbd;
    border: 1px solid #187cbd;
    padding: 5px 10px;
    border-radius: 0.25rem;
}

/* Korrekturen 2 - Logo Soconic*/
.main-img-1 {
    height: 25px;
}
.center-block.box.login p {
    margin-bottom: 2rem;
}
/* Korrekturen 2 - Navigation + Evalution*/
.col-lg-12 h1 {
    font-size: 2rem;
    font-weight: bold;
    color: #187cbd;
}
.col-lg-12 h1 ~ a, .nav_el {
    background-color: #fff;
    border: 1px solid #187cbd;
    color: #187cbd;
    border-radius: .25rem;
    margin-bottom: 0.5rem;
    /*padding: 5px 10px;*/
}
.nav_el.red {
    background-color: #187cbd !important;
    color: #fff !important;
}
/* Korrekturen 2 - Evalution*/
ul.tabs li {
    border-radius: 0.25rem;
    margin-bottom: 0.25rem;
}
.tab-content {
    border-radius: 0.25rem;
    background: #fff;
}
fieldset {
    border: 1px solid #187cbd !important;
    border-radius: 0.25rem;
}
fieldset legend {
    background-color: #187cbd;
    border-radius: 0.25rem;
}
legend.fr_txt {
    font-size: 1.2rem;
    padding: 1rem;
}
#sve_state_btn,
#next_cat {
    background-color: #E6F5FF !important;
    border-color: #187cbd;
    color: #187cbd !important;
}
#sve_state_btn:not(:disabled):not(.disabled).active, #sve_state_btn:not(:disabled):not(.disabled):active, .show > #sve_state_btn.dropdown-toggle,
#next_cat:not(:disabled):not(.disabled).active, #next_cat:not(:disabled):not(.disabled):active, .show > #next_cat.dropdown-toggle {
    color: #fff;
    background-color: #E6F5FF;
    border-color: #187cbd;
}
#sve_state_btn:not(:disabled):not(.disabled).active:focus, #sve_state_btn:not(:disabled):not(.disabled):active:focus, .show > #sve_state_btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 1px #187cbd;
}
#eva_control {
    background: #ffffff;
    padding: 15px;
}
#sve_state_btn.focus, #sve_state_btn:focus {
    box-shadow: 0 0 0 1px #187cbd;
}
#next_cat:hover, #sve_state_btn:hover {
    color: #fff;
    background-color: #fff !important;
    border-color: #187cbd;
}
#finish_btn {
    color: #fff;
    background-color: #187cbd;
    border-color: #187cbd;
}
#finish_btn:hover {
    color: #fff;
    background-color: #88BBE6;
    border-color: #187cbd;
}
textarea, textarea:placeholder-shown {
    padding: 10px;
}

.canvas_wrapper {
    max-height: 220px;
}
.canvas_wrapper_pie {
    height: 400px;
}

/*
*   PRINT STYLES
*/

#printHeader {
    display: none;
}
#printHeader img {
    height: 60px;
}
#printHeader > .main-img-1 {
    height: 25px;
}

@media print {
    @page {
        margin: 0;
    }
    .cat_details > fieldset {
        break-inside: avoid;
        page-break-inside: avoid;
    }
    /*.canvas_wrapper_pie {*/
    /*    padding-right: 1cm;*/
    /*}*/
    body > footer, body > header {
        display: none !important;
    }
    #printHeader {
        display: flex;
    }
    canvas {
        width: 100% !important;
        height: auto !important;
    }
}