@charset "UTF-8";
/* #region ***** README ***** */
/*
    Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
    for details on configuring this project to bundle and minify static web assets. 
    See also the fix for WebOptimizer + NET6 at https://github.com/ligershark/WebOptimizer/issues/232#issuecomment-1355031387

    Sass/Scss is a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets (CSS).
    It allows to write CSS using variables, modules and other utilities to make code cleaner and more maintainable.
    For more info, check: https://sass-lang.com/documentation/syntax
*/
/* #endregion */
/* #region ==== Telerik ThemeBuilder Variables ==== */
/* 
    How-To use Teleriks Theme variables for own purpose:  
    After downloading the theme from Telerik's ThemeBuilder page, 
    cut the variables out of the .SCSS-file into this file
    and replace them with a reference to this file. (e.g. @import "_settings.scss";)
    Now, we can use these variables in our own .SCSS-files.
*/
/* #endregion */
/* #region ==== BSales Variables ==== */
/* #endregion */
/* #region ==== Fonts ==== */
@font-face {
  font-family: "Open Sans";
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url(../fonts/OpenSans-Light.ttf) format("woff");
}
@font-face {
  font-family: "Open Sans";
  font-weight: 400;
  src: local("Open Sans"), local("OpenSans"), url(../fonts/OpenSans-Regular.ttf) format("woff");
}
@font-face {
  font-family: "Open Sans";
  font-weight: 600;
  src: local("Open Sans SemiBold"), local("OpenSans-SemiBold"), url(../fonts/OpenSans-SemiBold.ttf) format("woff");
}
/* #endregion */
/* #region Telerik + Bootstrap Compatibility Fix */
*, :before, :after {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.form-control,
.container,
.container-fluid,
.row,
a.dropdown-item,
.col-1, .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xl-1, .col-xxl-1,
.col-2, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xl-2, .col-xxl-2,
.col-3, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xl-3, .col-xxl-3,
.col-4, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xl-4, .col-xxl-4,
.col-5, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xl-5, .col-xxl-5,
.col-6, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xl-6, .col-xxl-6,
.col-7, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xl-7, .col-xxl-7,
.col-8, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xl-8, .col-xxl-8,
.col-9, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xl-9, .col-xxl-9,
.col-10, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xl-10, .col-xxl-10,
.col-11, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xl-11, .col-xxl-11,
.col-12, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 .col-xl-12, .col-xxl-12 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.navbar-nav > .nav-item > .dropdown-menu > form {
  margin-right: 32px;
  /* sum of left and right padding of an ".dropdown-item" */
}

a.k-button:hover, a.k-button:focus {
  color: #ffffff;
}

/* #endregion */
/* #region Telerik + FontAwesome Compatibility Fix */
.fa.k-sprite,
.fa.k-sprite::before {
  font-size: 20px;
  line-height: 20px;
  width: auto;
  height: auto;
}

.k-button > .k-button-icon.fa-solid {
  line-height: 1.5rem;
  font-family: "Font Awesome 6 Pro";
}

/* #endregion */
/* #region Telerik Name column must use full width if possible and must not disappear on small displays. */
/* Small screens */
@media (max-width: 768px) {
  .name-column {
    width: 155px;
    /* Occupy the available width */
  }
}
/* Larger screens */
@media (min-width: 769px) {
  .name-column {
    width: 100%;
    /* Fixed width */
  }
}
/* #endregion */
/* #region Override Bootstrap Components */
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus {
  color: #ffffff;
  background-color: #7ba6d1;
}
.navbar .dropdown-item.active, .navbar .dropdown-item:active {
  color: #ffffff;
  background-color: #374267;
}

a {
  color: #374267;
}
a:hover, a:focus {
  color: #7ba6d1;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #ffffff;
  background-color: #374267;
}
.nav-pills .nav-link:not(.active) {
  color: #374267;
}
.nav-pills .nav-link:not(.active):hover, .nav-pills .nav-link:not(.active):focus {
  color: #7ba6d1;
}

/* #endregion */
/* #region Override Telerik Components */
.k-body,
.k-typography,
.k-widget,
.k-button,
.k-input-inner {
  font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.k-animation-container {
  padding-bottom: 0.33rem;
}

.k-notification {
  padding: 0.75rem;
}

.k-grid .k-hierarchy-cell {
  width: 0;
}
.k-grid .k-header.k-hierarchy-cell {
  border: none;
}
.k-grid .k-hierarchy-cell .k-icon {
  display: none;
}
.k-grid .k-hierarchy-col {
  width: 1px;
}
.k-grid tbody > tr {
  border-color: inherit;
  height: 60px;
}

.k-grid.tr-height-unset tbody > tr {
  border-color: inherit;
  height: unset;
}

.k-listview > .k-listview-content.k-d-flex.k-flex-row.k-flex-wrap {
  justify-content: center;
  padding: 0px 50px;
}

/* #endregion */
/* where is it used ? */
.pricing-header {
  max-width: 700px;
}

/* navbar bottom shadow */
.box-shadow {
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
}

/* #region ==== ListView  ==== */
.img-small {
  height: 100px;
  width: 100px;
}

.orders-listview-item {
  border-radius: 0px;
  overflow-x: hidden;
}

.presentationresult-listview-item {
  padding: 2px;
  /* for visible selection */
  margin: 2px;
  /*for clear boundary between items, which are selected*/
  /*box-shadow: 0 0 2px 1px $primary;*/
}
.presentationresult-listview-item:focus, .presentationresult-listview-item:hover {
  box-shadow: 0 0 2px 1px #374267;
}
.presentationresult-listview-item > div > span.head-title {
  font-size: 0.85rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: pre-wrap;
}

.gallery-item {
  font-size: 0.85rem;
  width: 200px;
  height: 250px;
  padding: 5px;
  /* for visible selection */
  margin: 2px;
  /* for clear boundary between items, which are selected */
}
.gallery-item:focus, .gallery-item:hover {
  box-shadow: 0 0 2px 1px #374267;
}
.gallery-item.k-selected {
  background-color: #374267;
  color: #ffffff;
}
.gallery-item > img {
  height: 200px;
  width: 100%;
  margin: auto;
  object-fit: contain;
}
.gallery-item > span {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: pre-wrap;
}

.gallery-item-triangled {
  position: relative;
  font-size: 0.85rem;
  width: 200px;
  height: 250px;
  padding: 5px;
  /* for visible selection */
  margin: 2px;
  /* for clear boundary between items, which are selected */
}
.gallery-item-triangled::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 0px solid transparent;
  border-top: 20px solid #374267;
  position: absolute;
  left: 100%;
  top: 0;
  margin-left: -20px;
}
.gallery-item-triangled:focus, .gallery-item-triangled:hover {
  box-shadow: 0 0 2px 1px #374267;
}
.gallery-item-triangled.k-selected {
  background-color: #374267;
  color: #ffffff;
}
.gallery-item-triangled > img {
  height: 200px;
  width: 100%;
  margin: auto;
  object-fit: contain;
}
.gallery-item-triangled > span {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: pre-wrap;
}

/* #endregion */
/* #region ==== Login Layout ==== */
.container-login {
  min-width: 500px;
  position: absolute;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2.5rem;
}

@media (max-width: 500px) {
  .container-login {
    min-width: 90%;
  }
}
.divider:after,
.divider:before {
  content: "";
  flex: 1;
  height: 1px;
  background: #eee;
}

.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: auto;
}

/*.form-signin .checkbox {
        font-weight: 400;
    }*/
.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}

.form-signin .form-control:focus {
  z-index: 2;
}

.form-signin input[type=email] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type=password] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* #endregion */
/*#region fixed table body css  */
/* Currently applied for Attributes table in Attribute Group Details View*/
/* to make table body vertically scrollable */
.tbody-scrollable > tbody {
  max-height: 450px !important;
  overflow-y: auto;
  display: grid;
}

/* #endregion */
/* #region KendoForm */
/* Layout for mobile */
/* to make all fields in a single column, if it´s a Multi-column Form */
@media (max-width: 600px) {
  /*Resize the screen to less than 600px and check out the styling in action.*/
  .k-form-field {
    grid-column-start: 1;
    grid-column-end: span 1;
  }

  fieldset {
    grid-column-start: 1;
    grid-column-end: span 1;
  }

  div.k-form-layout.k-d-grid.k-grid-cols-2 {
    grid-template-columns: repeat(1, minmax(0px, 1fr));
  }
}
/* #endregion */