﻿.normalheader {
    position: relative;
    height: 100px;
    background-color: white;
    margin-top: 40px;
    padding-left: 20px;
    padding-top: 20px;
    border: 1px solid #eaeaea;
    border-radius: 2px;
    padding-bottom: 20px;
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    transition: height 0.5s ease, margin-top 0.5s ease, margin-inline 0.5s ease, padding-block 0.5s ease;
    margin-inline: 40px;
}
#Expand-Arrow {
    transform: rotate(45deg);
}
#Minimise-Arrow {
    transform: rotate(225deg);
}
.description {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
}
    .description small {
        margin-bottom: 12px;
    }
#Breadcrumb{
    font-size:12px;
    text-decoration:none;
    color:grey
}
.normalheader.expanded {
    margin-top: -6px;
    margin-inline: 0;
    padding-top: 0;
    padding-bottom: 0;
    height: 50px;
}


    .PageContent {
    background-color: white;
    margin-top: 20px;
    border-radius: 2px;
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    margin-inline: 40px;
}
h2 {
    font-weight: 300;
    letter-spacing: 2px;
}
h3 {
    font-weight: 100 !important;
}
.form-control {
    font-size: 12px;
    border-color: #eaeaea;
    background-color: #F9FAFA;
    height:35px
}
label {
    font-weight: 600;
    font-size: 12px;
    color:grey
}
.btn-close {
    right: 10px; /* Adjust as needed */
    top: 50%;
    transform: translateY(-50%);
    z-index: 2; /* Ensure it's above other content but under modals/tooltips if any */
}

.accordion-button {
    position: relative;
    font-size:0.875rem;
    padding-block:10px
}

    .accordion-button:not(.collapsed) {
        color: grey;
        font-weight: 600;
        padding-block: 10px;
        background-color: white !important;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
        border: 1px solid #eaeaea;
    }

    .accordion-button:focus {
        z-index: 3;
        border-color: none;
        outline: 0;
        box-shadow: none;
    }
.accordion-item {

    background-color: #fff;
    border:none;
}
.accordion-body {
    border: 1px solid #eaeaea;
}
.accordion-button.collapsed {
    color: grey;
    background-color: #f1f3f6 !important;
    border-width: 0px;
    font-weight: 600;
    border-color: transparent;
    border-image: initial;
}


.form-group {
    padding-inline: 10px;
    padding-bottom: 20px;

}
.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #b1b1b1;
    outline: 0;
     box-shadow:none; 
}
#save-button {
    color: white;
    background-color: #73ccd2
}
label{
    margin-bottom:5px
}
@media(max-width:641px) {
    .form-group{
        width:100%
    }
}
tbody, td, tfoot, th, thead, tr {
    border-color: #dee2e6;
    border-style: solid;
    border-width: 1px;
    font-size: 12px;
    padding-inline: 10px;
    padding-block: 0px;
}
.subtable-row td{
border-block:0px !important;
}
.table > :not(:last-child) > :last-child > * {
    border-bottom-color: transparent;
}
th {
    background: #50acd1;
}
.subtable-row {
    border-width: 0px;
}
#searchbar {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom:20px
}
#save-button {
    background-color: #34495e;
    border-color: #34495e;
}
    #save-button:hover {
        color: #34495e;
        background-color: #34495e61;
        border-color: #34495e61
    }
#Inputdiv {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-bottom: 20px;
    flex-wrap: wrap
}
    #Inputdiv input {
        width:50%
    }
        #Inputdiv select {
        width:50%
    }

    #Inputdiv textarea{
        width:50%
    }
    #Inputdiv label{
        text-align:center
    }
@media(max-width:641px){
    #Inputdiv{
        justify-content:left
    }
    #Inputdiv input {
        width: 100%
    }

    #Inputdiv textarea {
        width: 100%
    }
}
.search-container {
    position: relative;
    max-width: 350px;
}

.search-input {
    padding-left: 30px; /* Adjust this value based on the width of your search icon */
    width: 100%;
    box-sizing: border-box;
    height: 36px;
    background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23696969" width="18px" height="18px"%3E%3Cpath d="M15.5 14h-.79l-.28-.27a6.5 6.5 0 0 0 1.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 0 0-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 0 0 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/%3E%3C/svg%3E') no-repeat 5px center; /* Set your SVG path here */
    background-size: 20px 20px; /* Adjust the size of the icon */
    background-color: #F9FAFA;
    outline: none; /* Remove default focus style */
}
.Validation{
    font-size:10px;
    color:red
} 