/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */




/* Variablen */
$PrioColor1:        #4caf50 !default;
$PrioColor2:        #3f51b5 !default;
$PrioColor3:        #ff0000 !default;
$PrioColor4:        #cc0000 !default;
$PrioColor5:        #e8ffdd !default;
$OnHoldColor:       #f6f600 !default;
$PrioColorClosed:   #d3d3d3 !default;
$PrioColorDone:     #f3f3f3 !default;
$PrioColorAnswered:     transparent!default;
$PrioColorWaiting:    transparent!default;
$PrioColorNew:    transparent !default;
$NewButtonFrameColor: transparent !default;
$color-intern:      #e2e3e5 !default;
$color-extern:      #e2e3e5 !default;
$color-text-intern:      #000000 !default;
$color-text-extern:      #000000 !default;
$ImportantEventColor: #ff0000 !default;

#navbar {
    /*width: 1700px;*/
}

.textboxerror{
    border-style: solid;
    border-color: red;
}

.hm-avatar{
    width: 100px;
    height:100px;
    border-radius: 50%;
    margin: 0 auto;
    vertical-align: middle;
}
.hm-avatar-big{
    border-radius: 50%;
    border: 3px solid white;
    display: inline-block;
    height:200px;
    width: 200px;
    margin: 0 auto;
    vertical-align: middle;
}

.hm-avatar-small{
    width: 16px;
    height:16px;
    border-radius: 50%;
    margin: 0 auto;
    vertical-align: middle;
}

.hm-avatar-medium{
    width: 40px;
    height:40px;
    border-radius: 50%;
    margin: 0 auto;
    vertical-align: middle;
    margin: 3px;
}

.hm-avatar-medium-2{
    width: 40px;
    height:40px;
    border-radius: 50%;
    margin: 0 auto;
    vertical-align: middle;
}

/** Multilevel Menu Quelle: https://bootsnipp.com/snippets/featured/multi-level-dropdown-menu-bs3 **/
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100% !important;
    margin-top: 0px !important;
    margin-left: -1px !important;
    -webkit-border-radius: 0 6px 6px 6px !important;
    -moz-border-radius: 0 6px 6px !important;
    border-radius: 0 6px 6px 6px !important;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}



.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

/* Menu ende */


/*custom fcs*/
.navbar-brand > img {display: block;height: 32px;}
.navbar-brand {
    padding: 10px 15px !important;
}


.container {
    width: 1600px;
}

// https://stackoverflow.com/a/20548578
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

/*Breite Modals */
.modal.modal-wide .modal-dialog {
    width: 90%;
}
.modal-wide .modal-body {
    overflow-y: auto;
}

/* form labels nach links*/
.form-horizontal.form-label-left .control-label {
    text-align: left;
    margin-bottom: 0;
    padding-top: 7px; // Default padding plus a border        
}

/* mindestbreite auf bildschirm */
@media (min-width: 1200px) {
    .container-fluid {min-width: 1350px; } 
}


.horizontalJustifiedList{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;    
}
// Core variables and mixins
@import "_bootstrap";



/*!
 * Start Bootstrap - Simple Sidebar (https://startbootstrap.com/template-overviews/simple-sidebar)
 * Copyright 2013-2017 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-simple-sidebar/blob/master/LICENSE)
 */

body {
    overflow-x: hidden;

}


#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled {
    padding-left: 250px;
}

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    left: 250px;
    width: 0;
    height: 100%;
    margin-left: -250px;
    overflow-y: auto;
    background: #000;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
    width: 250px;
}

#page-content-wrapper {
    width: 100%;
    position: absolute;
    padding: 15px;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -250px;
}


/* Sidebar Styles */

.sidebar-nav {
    position: absolute;
    top: 0;
    width: 250px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    text-indent: 20px;
    line-height: 40px;
}

.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #999999;
}

.sidebar-nav li a:hover {
    text-decoration: none;
    color: #fff;
    background: rgba(255, 255, 255, 0.2);
}

.sidebar-nav li a:active, .sidebar-nav li a:focus {
    text-decoration: none;
}

.sidebar-nav>.sidebar-brand {
    height: 65px;
    font-size: 18px;
    line-height: 60px;
}

.sidebar-nav>.sidebar-brand a {
    color: #999999;
}

.sidebar-nav>.sidebar-brand a:hover {
    color: #fff;
    background: none;
}

@media(min-width:768px) {
    #wrapper {
        padding-left: 0;
    }
    #wrapper.toggled {
        padding-left: 250px;
    }
    #sidebar-wrapper {
        width: 0;
    }
    #wrapper.toggled #sidebar-wrapper {
        width: 250px;
    }
    #page-content-wrapper {
        padding: 20px;
        position: relative;
    }
    #wrapper.toggled #page-content-wrapper {
        position: relative;
        margin-right: 0;
    }
}


/* Ticketliste */
/*
.listview tbody tr td.prio1, .prio1 {background:$PrioColor1 !important;}
.listview tbody tr td.prio2, .prio2 {background:$PrioColor2 !important;}
.listview tbody tr td.prio3, .prio3 {background:$PrioColor3 !important;}
.listview tbody tr td.prio4, .prio4 {background:$PrioColor4 !important;color:#FFF;}
.listview tbody tr td.onhold, .onhold {background:$OnHoldColor !important;}
.listview tbody tr td.prioclosed, .prioclosed {background:$PrioColorClosed !important;}
.listview tbody tr td.priodone, .priodone {background:$PrioColorDone !important;}
.redText{color:red;}
*/

.listview tbody tr td.prio1, .prio1 {
    border-color: currentColor;
    padding:5px;
    color: $PrioColor1;
    font-weight: bold;
    background-color: transparent;
    border: 1px solid $PrioColor1; }

.prio1.legend {
    border-radius: 9px;
}

.listview tbody tr td.prio2, .prio2 {
    color: $PrioColor2;
    padding:5px;
    font-weight: bold;
    background-color: transparent;
    border: 1px solid $PrioColor2; }

.prio2.legend {
    border-radius: 9px;
}

.listview tbody tr td.prio3, .prio3 {
    color: $PrioColor3;
    padding: 5px;
    font-weight: bold;
    background-color: transparent;
    border: 1px solid $PrioColor3;
}

.prio3.legend {
    border-radius: 9px;
}

.listview tbody tr td.prio4, .prio4 {
    color: $PrioColor4;
    padding:5px;
    font-weight: bold;
    background-color: transparent;
    border: 1px solid $PrioColor4; }

.prio4.legend {
    border-radius: 9px;
}

.listview tbody tr td.onhold, .onhold {
    background: $OnHoldColor !important; }
.listview tbody tr td.prioanswered, .prioanswered {
    background-color: $PrioColorAnswered !important; }
.listview tbody tr td.prionew, .prionew {
    background-color: $PrioColorNew !important; }
.listview tbody tr td.priowaiting, .priowaiting {
    background-color: $PrioColorWaiting !important; }

.listview tbody tr td.prioclosed, .prioclosed {
    background: $PrioColorClosed !important; }

.listview tbody tr td.priodone, .priodone {
    background: $PrioColorDone !important; }

.redText {
    color: red; }
/* ESCALATION */
.escalation {height:16px;width:88px;background:transparent url(../../images/escalation.png) no-repeat left top; display:inline-block; margin-top: 7px;}
.estep1 {background-position:0 -16px;}
.estep2 {background-position:0 -32px;}
.estep3 {background-position:0 -48px;}
.estep4 {background-position:0 -64px;}
.estep5 {background-position:0 -80px;}

.importantbackground {
    background-color: $ImportantEventColor !important;
}

/*Footer : https://stackoverflow.com/a/20658161*/
.footer_fixed{
    position:fixed;
    bottom: 0;
    width: 100%;
}

html {height: 100%;}
#content-wrap{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    /* Negative indent footer by its height */
    margin: 0 auto -60px;
    /* Pad bottom by footer height */
    padding: 0 0 60px;
}
.footer_bottom{
    width: 100%;
    bottom: 0;
}
/*Footer ende */
.panel-title-fcs {
    margin-top: 0;
    margin-bottom: 0;
    color: inherit;

    > a,
    > small,
    > .small,
    > small > a,
    > .small > a {
        color: inherit;
    }
}

/* inline form mit ein bisschchen abstand*/
.fcs-form-padding > div {
    padding-right: 1em;
    padding-bottom: 1em;
}


.panel-fcs-content{
    @include panel-variant($panel-info-border, $panel-info-text, $panel-info-heading-bg, $panel-info-border);
    /* oder primary? */
    //    @include panel-variant($panel-primary-border, $panel-primary-text, $panel-primary-heading-bg, $panel-primary-border);
}

.panel-fcs-border{
    //    @include panel-variant($panel-default-border, $panel-default-text, $panel-default-heading-bg, $panel-default-border);
    /* oder primary? */
    @include panel-variant($panel-primary-border, $panel-primary-text, $panel-primary-heading-bg, $panel-primary-border);
    border: 0px;
}



.panel-fcs-content > .panel-heading  .btn-default{
    border: 1px solid #6c757d;
}

.panel-info > .panel-heading  .btn-default{
    border: 1px solid #6c757d;
}

.btn-info {
    border-color: currentColor;
    color: $btn-info-bg;
    background-color: transparent;
    border: 1px solid $btn-info-bg; 
}


/*
body {
  background-color: $body-bg; 
}
*/

$FCSBorderHeaderColor: #f5f5f5 !default;
$FCSBorderBackgroundColor: $body-bg; //#fff !default;

$FCSContentHeaderColor: #e2e3e5 !default;
$FCSPanelBorderColor: $FCSContentHeaderColor !default;
$FCSPanelFontColor: darken($FCSContentHeaderColor, 90%) !default;
$FCSContentHeaderTextColor: #000000 !default;

$FCSContentBackgroundColor: #fff !default;


$navbar-default-bg: #fff !default;

$sidemenu-default-bg: #2d2d2d !default;

$sidemenu-default-link-color: #9f9f9f !default;


.panel-fcs-border > .panel-heading, .panel-fcs-border > .panel-footer {
    color: #333;
    padding-top: 35px;
    background-color: $FCSBorderHeaderColor;
    border-color: #ccc; }

.panel-fcs-content > .panel-heading, .panel-fcs-content > .panel-footer {
    color: $FCSContentHeaderTextColor;
    background-color: $FCSContentHeaderColor;
    border-color: $FCSPanelBorderColor;
}

.panel-fcs-content {
    border-color: $FCSPanelBorderColor; 
    background-color: $FCSContentBackgroundColor;
}

.panel-info > .panel-heading, .panel-info > .panel-footer {
    color: $FCSContentHeaderTextColor;
    background-color: $FCSContentHeaderColor;
    border-color: $FCSPanelBorderColor;
}

.panel-fcs-content > .panel-heading a:not(.btn) {
    color: #333; 
}

.panel-info > .panel-heading a {
    color: $FCSContentHeaderTextColor;
}

.panel-info {
    border-color: $FCSPanelBorderColor; 
    background-color: $FCSContentBackgroundColor;
}

.panel-info > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: $FCSPanelBorderColor; }

.panel-fcs-content > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: $FCSPanelBorderColor; }

.navbar-default {
    background-color: $navbar-default-bg;
    border-bottom-color: #273823;
}


#msb, .msb > .navbar-default {
    background-color: $sidemenu-default-bg !important;
}

#pinMenu, .msb .navbar-nav li a {
    color: $sidemenu-default-link-color !important;
}


.panel-fcs-border>.panel-body{
    min-height: 100%;
}



/* Text nur bei bestimmten größen nach links oder rechts ausrichten 
Quelle: https://github.com/twbs/bootstrap/issues/11292
*/
.text-left-not-xs, .text-left-not-sm, .text-left-not-md, .text-left-not-lg {
    text-align: left;
}
.text-center-not-xs, .text-center-not-sm, .text-center-not-md, .text-center-not-lg {
    text-align: center;
}
.text-right-not-xs, .text-right-not-sm, .text-right-not-md, .text-right-not-lg {
    text-align: right;
}
.text-justify-not-xs, .text-justify-not-sm, .text-justify-not-md, .text-justify-not-lg {
    text-align: justify;
}

@media (max-width: 767px) {
    .text-left-not-xs, .text-center-not-xs, .text-right-not-xs, .text-justify-not-xs {
        text-align: inherit;
    }
    .text-left-xs {
        text-align: left;
    }
    .text-center-xs {
        text-align: center;
    }
    .text-right-xs {
        text-align: right;
    }
    .text-justify-xs {
        text-align: justify;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .text-left-not-sm, .text-center-not-sm, .text-right-not-sm, .text-justify-not-sm {
        text-align: inherit;
    }
    .text-left-sm {
        text-align: left;
    }
    .text-center-sm {
        text-align: center;
    }
    .text-right-sm {
        text-align: right;
    }
    .text-justify-sm {
        text-align: justify;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .text-left-not-md, .text-center-not-md, .text-right-not-md, .text-justify-not-md {
        text-align: inherit;
    }
    .text-left-md {
        text-align: left;
    }
    .text-center-md {
        text-align: center;
    }
    .text-right-md {
        text-align: right;
    }
    .text-justify-md {
        text-align: justify;
    }
}
@media (min-width: 1200px) {
    .text-left-not-lg, .text-center-not-lg, .text-right-not-lg, .text-justify-not-lg {
        text-align: inherit;
    }
    .text-left-lg {
        text-align: left;
    }
    .text-center-lg {
        text-align: center;
    }
    .text-right-lg {
        text-align: right;
    }
    .text-justify-lg {
        text-align: justify;
    }
}


/* Service form - change the table header*/

#serviceTable th{
    text-align: center;
    background-color: $brand-primary;
    color: white;
}


/*Loading spinner Quelle: https://www.bootply.com/128062 */
.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}        


/* Required Symbol bei Pflichtfeldern:*/
.form-group.required .control-label:after { 
    content:"*";
    color:red;
}

/* Neue Seitenaufteilung FCS */
.container-fluid{
    padding-left: 0px;
    padding-right: 0px;
}
.panel-fcs-border{
    border: 0px;
    border-radius: 0px;
    background-color: $FCSBorderBackgroundColor;
}
.navbar{
    /*margin-bottom: 20px;*/
    margin-bottom: 0px;
}

#TicketRightPanel, #TicketDataLeft, #TicketDataRight {
    .col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{
        width:100%;
    }
}

/* Damit die select2-container an die BS input-group passen */
.select2-container .select2-selection--single {
    height: 30px !important;
}


/* Buttons Ticketdetails*/

#TicketRightPanel #TicketActions:not(.btnasicon) .btn, #TicketRightPanel #TicketActions:not(.btnasicon) .btn-group,
#TicketDataRight #TicketActions:not(.btnasicon) .btn, #TicketDataRight #TicketActions:not(.btnasicon) .btn-group,
#TicketDataLeft #TicketActions:not(.btnasicon) .btn, #TicketDataLeft #TicketActions:not(.btnasicon) .btn-group {
    margin-bottom: 10px;
    width: 100%;
}

.ui-widget {
    z-index: 10 !important;
}

/* Icons blasser machen */
.glyphicon {
    opacity: 0.7;
}

/*WYSIWYG-Editor Breite*/
.sceditor-container {
    width: 100% !important;
}

/* Auf der Startseite ein bischen Abstand zu den Rändern */
.StartPageContent {
    padding: 0 20px;
}

#DropzoneField{
    cursor: pointer;
}

/*Überlauf in der ticketansicht*/
.TicketContent{
    word-wrap: break-word;
}
/*Keine zusätzlichen Leerzeilen im <pre>-Block*/
.TicketContent pre {
  white-space: nowrap;
}


/**Serviceauswahlliste**/

.ServiceSelectListItem .ServiceLvlTitle {
    float: right;
}

.ServiceSelectListItem .ServiceDescr {
    clear: right;
    display: block;
    color: grey;
}
.ServiceSelectListItem .ServiceRisks {
    clear: right;
    display: block;
    color: grey;    
}
.select2-results__option--highlighted .ServiceDescr{
    color: lightgrey;
}
.select2-results__option--highlighted .ServiceRisks{
    color: lightgrey;
}

/** Button-Groups mit Margin beim umbruch **/
.btn-withMargin .btn {
    margin-bottom: 5px;
}


/** SCEditor (WYSIWYG-iframe-Style (used for body,code:before,html,p,table))) **/

.WYSIWYG-iframe-Style {
    margin:0;
    padding:0;
    font-family:$font-family-sans-serif;
    font-size:14px;
    color:#555
}


/** Block-Grid**/

[class*="block-grid-"] {
    display: block;
    padding: 0;
    margin: 0 -0.625rem;
    *zoom: 1; }
[class*="block-grid-"]:before, [class*="block-grid-"]:after {
    content: " ";
    display: table; }
[class*="block-grid-"]:after {
    clear: both; }
[class*="block-grid-"] > li {
    display: inline;
    height: auto;
    float: left;
    padding: 0 0.625rem 1.25rem; }

@media only screen {
    .small-block-grid-1 > li {
        width: 100%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-1 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-1 > li:nth-of-type(1n+1) {
        clear: both; }

    .small-block-grid-2 > li {
        width: 50%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-2 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-2 > li:nth-of-type(2n+1) {
        clear: both; }

    .small-block-grid-3 > li {
        width: 33.33333%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-3 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-3 > li:nth-of-type(3n+1) {
        clear: both; }

    .small-block-grid-4 > li {
        width: 25%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-4 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-4 > li:nth-of-type(4n+1) {
        clear: both; }

    .small-block-grid-5 > li {
        width: 20%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-5 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-5 > li:nth-of-type(5n+1) {
        clear: both; }

    .small-block-grid-6 > li {
        width: 16.66667%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-6 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-6 > li:nth-of-type(6n+1) {
        clear: both; }

    .small-block-grid-7 > li {
        width: 14.28571%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-7 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-7 > li:nth-of-type(7n+1) {
        clear: both; }

    .small-block-grid-8 > li {
        width: 12.5%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-8 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-8 > li:nth-of-type(8n+1) {
        clear: both; }

    .small-block-grid-9 > li {
        width: 11.11111%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-9 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-9 > li:nth-of-type(9n+1) {
        clear: both; }

    .small-block-grid-10 > li {
        width: 10%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-10 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-10 > li:nth-of-type(10n+1) {
        clear: both; }

    .small-block-grid-11 > li {
        width: 9.09091%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-11 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-11 > li:nth-of-type(11n+1) {
        clear: both; }

    .small-block-grid-12 > li {
        width: 8.33333%;
        padding: 0 0.625rem 1.25rem; }
    .small-block-grid-12 > li:nth-of-type(n) {
        clear: none; }
    .small-block-grid-12 > li:nth-of-type(12n+1) {
        clear: both; } }
@media only screen and (min-width: 40.063em) {
    .medium-block-grid-1 > li {
        width: 100%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-1 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-1 > li:nth-of-type(1n+1) {
        clear: both; }

    .medium-block-grid-2 > li {
        width: 50%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-2 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-2 > li:nth-of-type(2n+1) {
        clear: both; }

    .medium-block-grid-3 > li {
        width: 33.33333%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-3 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-3 > li:nth-of-type(3n+1) {
        clear: both; }

    .medium-block-grid-4 > li {
        width: 25%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-4 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-4 > li:nth-of-type(4n+1) {
        clear: both; }

    .medium-block-grid-5 > li {
        width: 20%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-5 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-5 > li:nth-of-type(5n+1) {
        clear: both; }

    .medium-block-grid-6 > li {
        width: 16.66667%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-6 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-6 > li:nth-of-type(6n+1) {
        clear: both; }

    .medium-block-grid-7 > li {
        width: 14.28571%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-7 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-7 > li:nth-of-type(7n+1) {
        clear: both; }

    .medium-block-grid-8 > li {
        width: 12.5%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-8 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-8 > li:nth-of-type(8n+1) {
        clear: both; }

    .medium-block-grid-9 > li {
        width: 11.11111%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-9 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-9 > li:nth-of-type(9n+1) {
        clear: both; }

    .medium-block-grid-10 > li {
        width: 10%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-10 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-10 > li:nth-of-type(10n+1) {
        clear: both; }

    .medium-block-grid-11 > li {
        width: 9.09091%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-11 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-11 > li:nth-of-type(11n+1) {
        clear: both; }

    .medium-block-grid-12 > li {
        width: 8.33333%;
        padding: 0 0.625rem 1.25rem; }
    .medium-block-grid-12 > li:nth-of-type(n) {
        clear: none; }
    .medium-block-grid-12 > li:nth-of-type(12n+1) {
        clear: both; } }
@media only screen and (min-width: 64.063em) {
    .large-block-grid-1 > li {
        width: 100%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-1 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-1 > li:nth-of-type(1n+1) {
        clear: both; }

    .large-block-grid-2 > li {
        width: 50%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-2 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-2 > li:nth-of-type(2n+1) {
        clear: both; }

    .large-block-grid-3 > li {
        width: 33.33333%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-3 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-3 > li:nth-of-type(3n+1) {
        clear: both; }

    .large-block-grid-4 > li {
        width: 25%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-4 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-4 > li:nth-of-type(4n+1) {
        clear: both; }

    .large-block-grid-5 > li {
        width: 20%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-5 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-5 > li:nth-of-type(5n+1) {
        clear: both; }

    .large-block-grid-6 > li {
        width: 16.66667%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-6 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-6 > li:nth-of-type(6n+1) {
        clear: both; }

    .large-block-grid-7 > li {
        width: 14.28571%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-7 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-7 > li:nth-of-type(7n+1) {
        clear: both; }

    .large-block-grid-8 > li {
        width: 12.5%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-8 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-8 > li:nth-of-type(8n+1) {
        clear: both; }

    .large-block-grid-9 > li {
        width: 11.11111%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-9 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-9 > li:nth-of-type(9n+1) {
        clear: both; }

    .large-block-grid-10 > li {
        width: 10%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-10 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-10 > li:nth-of-type(10n+1) {
        clear: both; }

    .large-block-grid-11 > li {
        width: 9.09091%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-11 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-11 > li:nth-of-type(11n+1) {
        clear: both; }

    .large-block-grid-12 > li {
        width: 8.33333%;
        padding: 0 0.625rem 1.25rem; }
    .large-block-grid-12 > li:nth-of-type(n) {
        clear: none; }
    .large-block-grid-12 > li:nth-of-type(12n+1) {
        clear: both; } }

/* Kategorien mit langem Titel in der Kategorieauswahl korrekt anzeigen*/
#CatTree .fancytree-title {
    white-space: break-spaces;
}
/* Mail2Ticket-Bilder laufen in der Ticketdetailansicht aus dem Rahmen */
#TicketDescrPanel img {
    max-width: 100%;
    height: auto;
}


.btn-primary {
    @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
    background-color: transparent;
    color: #3f51b5;
    &:active,
        &.active,{
        background-color: darken($btn-primary-bg, 40%)    
    }    
}
// Success appears as green
.btn-success {
    @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
    background-color: transparent;
    color: $btn-success-bg;
    &:active,
        &.active,{
        background-color: darken($btn-success-bg, 40%)    
    }    
}




.btn-success-full {
    @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
    background-color: $btn-success-bg;
    color: #fff;
    &:active,
        &.active,{
        background-color: darken($btn-success-bg, 40%)    
    }    
}
.btn-default {
    @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border);
    background-color: transparent;
    color: $btn-default-color;
    &:active,
        &.active,{
        background-color: darken($btn-default-bg, 40%);
        color: white !important;
    }          
}

.extern .panel-heading {
    background-color: $color-extern;
    color: $color-text-extern;
}

.intern .panel-heading {
    background-color: $color-intern;
    color: $color-text-intern;
}

@import "fontawesome_scss/fontawesome.scss";
@import "fontawesome_scss/regular.scss";
@import "fontawesome_scss/solid.scss";

.img-circular-event{
    width: 30px;
    height: 30px;
    background-image: url('index.php?module=upload&class=download&event=ShowImage&name=standard_avatar.jpg');
    background-size: cover;
    display: inline-block;
    border-radius: 100px;                                    
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    margin: 3px;
    margin-bottom: -8px;
}

.img-circular {
    width: 40px;
    height: 40px;
    background-image: url('index.php?module=upload&class=download&event=ShowImage&name=Medium_standard_avatar.jpg');
    background-size: cover;
    display: inline-block;
    border-radius: 100px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    vertical-align: middle;
    margin: 3px;        
}

.img-circular-small{
    width: 16px;
    height: 16px;
    background-image: url('index.php?module=upload&class=download&event=ShowImage&name=Small_standard_avatar.jpg');
    background-size: cover;
    display: inline-block;
    margin-bottom: -2px;
    display: inline;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    margin: 3px;
}    


.img-circular-group-medium{
    width: 40px;
    height: 40px;
    background-image: url('index.php?module=upload&class=download&event=ShowImage&name=Medium_standard_avatar.jpg');
    background-size: cover;
    display: inline-block;
    border-radius: 100px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    vertical-align: middle;
    margin: 3px;
}

.img-circular-group{
    width: 16px;
    height: 16px;
    background-image: url('index.php?module=upload&class=download&event=ShowImage&name=Small_standard_avatar.jpg');
    background-size: cover;
    display: inline-block;
    margin-bottom: -2px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    vertical-align: middle;
    margin: 3px;
}
/*Resize-Option für Select2-Inhalte unterbinden*/
textarea[class^="select2"]{
    resize:none;
}
