/* reset everything to the default box model */

*, :before, :after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

/* set a border-box model only to elements that need it */

.form-control, /* if this class is applied to a Kendo UI widget, its layout may change */
.container,
.container-fluid,
.row,
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11,
.col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    height: 100%;
}

/* General */
body {
    font-family: "Segoe UI";
    font-size: 16px;
    font-weight: 200;
    color: #333;
}

.main-container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}


.head {
    background-color: #0064bf;
    height: 100px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    padding-left: 10px;
    padding-right: 10px;
}

.head-top {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

@media (max-width: 768px) {
    .head-top {
        margin-top: 6px !important;
        margin-bottom: 3px !important;
    }
}

.head-top .login {
    float: right;
    font-size: 14px;
    color: white;
    margin-top: 5px;
    margin-right: 6px;
    clear: both;
}

    .head-top .login a {
        color: white;
        cursor: pointer;
    }

.head-top .logged-view {
    width: 250px;
}

@media (max-width: 768px) {
    .head-top .logged-view {
        width: 160px;
    }
}



.body {
    padding-bottom: 10px;
    padding-top: 10px;
    position: absolute;
    top: 100px;
    left: 0;
    right: 0;
    bottom: 50px;
    overflow: auto
}


.footer {
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0;
    height: 50px;
    background-color: #0064bf;
}

    .footer [class*="col-"] {
        margin: 0;
    }

    .footer p,
    .footer a {
        color: white;
        font-size: 14px;
        text-align: center;
    }

    .footer p {
        margin-top: 5px;
        margin-bottom: 5px
    }

a:active, a:hover, a:link, a:visited {
    text-decoration: none;
}

pre {
    font-family: "Segoe UI";
    font-size: 16px;
    font-weight: 200;
    color: #333;
}

.app {
    background-color: white;
    -ms-touch-action: manipulation !important;
    touch-action: manipulation;
}

.no-padding {
    padding: 0px;
}

label {
    font-size: 13px;
    color: #333;
    font-weight: 600;
}

input[type='text'] {
    font-size: 13px !important;
    height: 28px;
}

.k-datepicker input[type='text'],
.k-numerictextbox input[type='text'] {
    height: 32px;
}


.inputValue {
    font-weight: 400;
    color: #212529;
    font-size: 1rem;
    line-height: 1.5;
}

.btn-block {
    box-sizing: border-box;
}


.btn, .k-button {
    color: #fff;
    background-color: #111111;
    border-color: #111111;
    font-size: 16px;
    border-radius: 1px;
    font-weight: 400;
    line-height:18px;    
}

@media (max-width: 768px) {
    .btn, .k-button {
        padding-block: 0.175rem;
        padding-inline: 0.275rem;
        font-size: 13px;
    }
}




.btn-danger {
    color: #fff;
    background-color: red !important;
    border-color: red;
}

.btn-smart, .k-button.k-primary, .k-grid-excel {
    background-color: #0064bf;
    border: 1px solid #0064bf;
    color: #fff;
    font-size: 16px;
    border-radius: 1px;
}

.k-grid-pdf {
    margin-right: 10px;
}

.btn:hover, .k-button:hover {
    color: #fff;
    background-color: #111111;
    border-color: #111111;
    text-decoration: none;
    opacity: 0.8;
}

.btn-smart:hover, .k-button.k-primary:hover, k-grid-excel:hover {
    background-color: #0064bf;
    border: 1px solid #0064bf;
    color: #fff;
    text-decoration: none;
    opacity: 0.8;
}

.dropdown-toggle {
    color: #111111;
}

    .dropdown-toggle:hover {
        background-color: #fff;
        color: #111111;
        opacity: 1;
    }

    .dropdown-toggle::after {
        position: absolute;
        right: 10px;
        top: 15px;
        font-size: 20px
    }

.k-dialog-buttongroup {
    direction: rtl;
}

    .k-dialog-buttongroup button {
        margin-right: 10px;
    }

p {
    color: #515151;    
}
/* Titles */
h1, h2, h3, h4, h5 {
    font-family: "Segoe UI";
    font-weight: 500;
    color: #333;
}

h1 {
    font-size: 28px;
    font-weight: bold;
}

h2 {
    font-size: 22px;
    margin-top: 3px;
    color: #333333;
}

h3 {
    font-size: 20px;
    color: #0064bf;
    margin-top: 3px;
    margin-bottom: 10px;
}

h4 {
    font-size: 16px;
    color: #0064bf;
}

h5 {
    font-size: 14px;
    color: #0064bf;
}

h6 {
    font-size: 12px;
    font-weight: bold;
    color: #0064bf;
}

@media (max-width: 768px) {
    h1 {
        font-size: 26px;
        font-weight: bold;
    }

    h2 {
        font-size: 18px;
        margin-top: 3px;
        color: #333333;
    }

    h3 {
        font-size: 16px;
        color: #0064bf;
        margin-top: 3px;
        margin-bottom: 10px;
    }

    h4 {
        font-size: 15px;
        color: #0064bf;
    }
}
/* Head */


.login-user {
    font-style: italic;
    font-size: 13px;
}

.login-off-btn > a > u {
    font-weight: bold;
    font-size: 14px;
}

@media (max-width: 768px) {
    .login-user {
        max-width: 120px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
}


.img-logo {
    max-height: 70px;
}

@media (max-width: 768px) {
    .img-logo {
        max-height: 62px;
    }
}

.company-info {
    display:flex;
    flex-direction:column;
}
.company-info .img-company {
    max-height: 100px;
}

@media (max-width: 768px) {
    .company-info .img-company {
        max-height: 70px;
        margin-bottom: 10px;
    }
}

.company-info .company-name-after:after {
    content: 'Area Riservata'
}

.login-container {
    position: relative;
    height: 400px;
}

.login-content-left {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 50%;
    text-align: right;
    padding-right: 220px;
}

.login-content {
    max-width: 400px;
    margin: 0 auto;
    position: relative;
}

.login-content-right {
    position: absolute;
    left: 50%;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: left;
    padding-left: 220px;
}


.home-container {
    position: relative;
    height: 400px;
}

.home-content-left {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 50%;
    text-align: right;
    padding-right: 220px;
}

.home-content {
    max-width: 400px;
    margin: 0 auto;
    position: relative;
}

.home-content-right {
    position: absolute;
    left: 50%;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: left;
    padding-left: 220px;
}


.img-plant-detail {
    height: 150px;
    width: 150px;
}

li {
    list-style-type: none;
    margin: 0;
}

@media (max-width: 768px) {
    .login-content-left,
    .login-content-right {
        display: none;
    }
}

/* Tables */


.table tbody tr td {
    border: none;
}

.table tbody tr.no-click {
    cursor: default;
}

.row-click {
    cursor: pointer;
}

    .row-click:hover {
        background-color: #bababa;
    }

    .row-click h2 {
        word-break: break-word;
    }

.list {
    margin-top: 5px;
}

    .list h2 {
        margin-top: 5px;
    }

/* Wells */


@media (min-width: 768px) {
    .well-left {
        margin: 0px 10px 0px 0px;
    }

    .well-right {
        margin: 0px 0px 0px 10px;
    }
}

/* Texts */

.plantInfo {
    margin-bottom: 20px;
}

.fieldLabel {
    font-size: 14px;
    color: #333;
    font-weight: 400;
}

.fieldValue {
    font-size: 16px;
}

.txt-expired {
    color: red;
}

.txt-to-expire {
    color: orange;
}

.txt-not-expired {
    color: green;
}

/* Paging */

.btn-page-div .btn {
    margin-top: 22px;
}

.btn-fluid {
    width: 100%;
}

.btn-left {
    padding-right: 0px;
}

.btn-right {
    padding-left: 0px;
}

/* Error */

.error h1 {
    margin: 50px;
    font-size: 32px;
    color: #0064bf;
}

/* Filters */

.btn-filter {
    float: right;
}

@media (max-width: 990px) {

    [class*="col-"] {
        margin-bottom: 15px;
    }
}

@media (max-width: 990px) {

    [class*="col-"] {
        margin-bottom: 15px;
    }
}

.dropdown-menu {
    width: 100%;
}

.dropdown-menu-scroll {
    max-height: 300px; /*Provide height in pixels or in other units as per your layout*/
    overflow-x: hidden;
    overflow-y: auto; /*Provide an auto overflow to diaply scroll*/
    padding: 0;
    margin: 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

.dropdown-toggle {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    background: #fff;
    border: solid 1px #ccc;
}

    .dropdown-toggle .caret {
        float: right;
        margin-top: 6px;
        border-top-width: 6px;
        border-right-width: 6px;
        border-left-width: 6px;
    }

.dropdown-menu-scroll {
    margin-right: 5px;
}

    .dropdown-menu-scroll > li > a {
        display: block;
        padding: 3px 10px;
        clear: both;
        font-weight: normal;
        line-height: 1.42857143;
        color: #333;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 100%;
    }

        .dropdown-menu-scroll > li > a:hover,
        .dropdown-menu-scroll > li > a:focus {
            color: #262626;
            text-decoration: none;
            background-color: #f5f5f5;
        }

    .dropdown-menu-scroll > .active > a,
    .dropdown-menu-scroll > .active > a:hover,
    .dropdown-menu-scroll > .active > a:focus {
        color: #fff;
        text-decoration: none;
        background-color: #337ab7;
        outline: 0;
    }

    .dropdown-menu-scroll > .disabled > a,
    .dropdown-menu-scroll > .disabled > a:hover,
    .dropdown-menu-scroll > .disabled > a:focus {
        color: #777;
    }

        .dropdown-menu-scroll > .disabled > a:hover,
        .dropdown-menu-scroll > .disabled > a:focus {
            text-decoration: none;
            cursor: not-allowed;
            background-color: transparent;
            background-image: none;
            filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
        }


.dropdown-menu input[type='text'] {
    width: 97%;
    margin: 4px;
}

.dropdown-menu > li input[type=checkbox] {
    margin-right: 5px;
}

span.has-error {
    color: red;
    border: none;
}

.has-error input, .has-error textarea {
    border: solid 1px red;
}

button.has-error {
    border: solid 1px red;
}


.reports {
    margin-bottom: 10px;
}

.reports-buttons {
    display: flex;
    gap: 10px;
    flex-wrap:wrap;
}

    .reports-buttons > *{
        flex-grow:1;
        display: flex;
        justify-content: flex-start;
    }

    .attachment_icon {
        background-color: #0064bf;
        padding: 5px;
        margin: 4px 6px 6px 3px;
        width: 21px;
        height: 21px;
        display: block;
    }

.attachment_icon_width {
    width: 21px;
    height: 21px;
}


.background-main {
    background-color: #0064bf;
}

.background-gray {
    background-color: #6B6B6B;
}

.background-green {
    background-color: #31ae63;
}

.background-orange {
    background-color: #FF6A00;
}

.background-red {
    background-color: #FF2E23;
}

.padding-10 {
    padding: 10px;
}

.color-main {
    color: #0064bf;
}

.color-gray {
    color: #6B6B6B;
}

.color-green {
    color: #31ae63;
}

.color-orange {
    color: #FF6A00;
}

.color-red {
    color: #FF2E23;
}


.listviewitem {
    border-bottom: 1px solid #ccc;
    overflow: hidden;
    padding-bottom: 10px;
}

    .listviewitem > * {
        overflow: hidden;
    }

    .listviewitem p {
        margin:0;
        padding:0;
        padding-bottom: 5px !important;        
    }

    .listviewitem h4 {
        padding-top: 0;
        margin-top: 2px;
        margin-bottom: 2px;
    }
    
    .listviewitem h6 {
        padding-bottom: 3px !important;
        margin:0;
    }

    .listviewitem > .row > * {
        margin:0;
    }

    .with-button {
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
    }

    .with-button .listviewitem {
        border: none;
        padding-bottom: 0;
    }

.k-listview-content li {
    margin-bottom: 10px;
}

    .k-listview-content li a {
        padding: 10px;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .k-listview-content li p {
        margin: 0;
    }
/*KENDO OVERRIDE*/
.k-button-toolbar-menu .k-header-column-menu {
    height: 35px;
    visibility: hidden;
    position: absolute;
    left: 0;
}


.customermap-pointer {
}

.customermap-pointer-inner {
    height: 50px;
    width: 50px;
    position: relative;
}

.customermap-pointerimage {
    height: 50px;
    width: 50px;
    position: absolute;
}

.customermap-planttypeimage {
    height: 24px;
    width: 24px;
    left: 13px;
    top: 8px;
    position: absolute;
}

.customermap-popup {
    min-height: 60px;
    position: relative;
    display: flex;
}

.customermap-popup-left {
    height: 90px;
    width: 90px;
    background-color: #0064bf;
    text-align: center;
    margin-right: 10px;
}

.customermap-popup-img {
    height: 50px;
    width: 50px;
    margin: auto;
    margin-top: 20px;
}

.customermap-popup-right {
    display: flex;
    flex-direction: column;
}

.customermap-popup-right-top {
    height: 74px;
}

.customermap-popup-right-bottom {
}

.customermap-popup-right h3 {
    color: #111111;
    margin: 0;
    white-space: nowrap;
    font-size: 16px;
}

.customermap-popup-right p {
    color: #515151;
    margin: 0 !important;
    font-size: 11px;
    margin-top: 2px !important;
}

    .customermap-popup-right p short {
        font-size: 9px;
    }

.customermap-popup-right a {
    font-size: 10px;
    font-weight: bold;
    margin-top: 10px;
}

.customermap-popup-right p img {
    height: 15px;
    width: 15px;
    margin-right: 5px;
}

.customermap-popup-right p span {
    margin-right: 5px;
}

.leaflet-control-attribution.leaflet-control {
    display: none !important;
}


.k-grid {
    background: transparent;
    border: none;
    box-shadow: none;
}


    .k-grid .btn-select {
        width: 85px;
    }

    .k-grid .alert {
        margin: 0;
        padding: 5px;
    }

    .k-grid .k-dirty {
        display: none;
    }

.k-grid-header {
    background: transparent;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: none;
    border-width: 1px;
    margin-right: -2px;
}


.k-header.k-grid-toolbar {
    background: transparent;
    border: none;
    padding: 0;
    padding-left: 0;
    padding-right: 0;
}

    .k-header.k-grid-toolbar .k-button {
        margin: 0;
        margin-right: 10px;
        margin-bottom: 10px;
    }

.k-grid-content {
    background: transparent;
    border-left-style: solid;
    border-left-color: rgb(204,204,204);
    border-right-style: none;
    border-right-width: 0;
    border-bottom-style: solid;
    border-bottom-color: rgb(204,204,204);
    border-width: 1px;
    padding-right: 2px;
}

.k-pager-wrap {
    padding-left: 0;
    padding-right: 0;
    border: none;
    background: transparent;
    color: #333;
}

    .k-pager-wrap .k-dropdown {
        border-color: #ccc;
    }


@media (max-width: 768px) {
    .k-pager-info.k-label {
        display: inline;
        font-size: 13px;
        color: #333;
    }
}

.k-filtercell label {
    display: block;
    position: relative;
    padding: 0;
    margin: 0;
    padding-left: 15px;
    float: left;
    margin-right: 10px;
}

    .k-filtercell label > input[type=radio] {
        position: absolute;
        bottom: 8px;
        left: 0;
    }

.k-toolbar.k-grid-toolbar {
    background-color: transparent;
    padding: 0;
}

    .k-toolbar.k-grid-toolbar button, .k-toolbar.k-grid-toolbar a {
        margin: 0;
        margin-right: 10px;
        margin-bottom: 10px;
    }

.k-filter-row th, .k-grid-header th.k-header {
    padding: 5px;
}


.error-template {
    padding: 40px 15px;
    text-align: center;
}

.error-actions {
    margin-top: 15px;
    margin-bottom: 15px;
}

    .error-actions .btn {
        margin-right: 10px;
    }

.item-list {
    border-left: 2px solid #0064bf;
    margin-left: 0;
    margin-bottom: 20px !important;
}


.k-widget.k-window.k-dialog.k-alert .k-window-titlebar.k-dialog-titlebar,
.k-widget.k-window.k-dialog.k-confirm .k-window-titlebar.k-dialog-titlebar {
    display: none;
}

.k-widget.k-window.k-dialog.k-alert,
.k-widget.k-window.k-dialog.k-confirm {
    max-width: 350px;
}

.k-column-menu input[type=checkbox] {
    margin-right: 5px;
}

.modal-dialog {
    margin: 10vh auto 0px auto
}

.modal {
    display: block !important; /* I added this to see the modal, you don't need this */
}

/* Important part */
.modal-dialog {
    overflow-y: initial !important
}

.modal-body {
    height: 60vh;
    overflow-y: auto;
}

.k-icon, .k-tool-icon {
    min-width: 1em;
}

.report-button-content {
    width: 100%;
    display: inherit;
}

.report-button-content-image {
    width: 10%;
    float: left;
}

.report-button-content-text {
    width: 90%;
    float: left;
}


.disclaimer-pre {
    overflow: hidden;
    white-space: pre-wrap;
}