/* 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. */



/* this is for reposive  fontsize  */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}


/* Header additional css styles */


.mainbody {
    margin-top: 2rem;
}
/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
    
}

/* Sticky footer styles
-------------------------------------------------- */


/* Main ET Core CSS*/

.field-validation-error {
    color: #d44950;
    font-size: smaller;
    background: transparent;
}

.background-ucla-molecules {
    background-image: url('../images/light-blue-with-molecules_rev.jpg');
    background-size: cover;
    background-repeat: no-repeat;
}


/************ UCLA Branding Classes - Start  *****************/

/**********************************************/

/* CORE CSS WHICH NEED TO BE MOVED */


/**********************************************/


/* conatiner and card classes*/
.container-content-without-padding, .ETCorePageContainer {
    margin-left: -15px;
    margin-right: -15px;
}



.table-with-less-padding td, .table-with-less-padding th {
    padding: .35rem;
}


.ETCorePageContainer .card-header {
    border-bottom: none;
}

.ETCorePageContainer .card {
    border: 1px solid transparent;
}

.ETCorePageContainer .card.firstCard {
    border-top-left-radius: unset;
    border-top-right-radius: unset;
}


.ETCorePageContainer .card-header {
    padding-bottom: unset;
}

.ETCorePageContainer .card-body {
    padding-top: unset;
}

/* Alert override */
.ETCorePageContainer .alert {
    margin-bottom: unset;
    border-radius: unset;
}


/* Validation summary classes*/

.validation-summary-errors {
    color: #dc3545;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    font-weight: bold;
    padding-left: 15px;
}

.validation-summary-errors::before {
    content: "Please fill required fields or correct the input -";
}

.validation-summary-valid {
    display: none;
}






/************ UCLA Branding Classes - Start  *****************/

/*  Text color classes */
.text-ucla-darkerblue {
    color: #005587
}

.text-ucla-darkestblue {
    color: #003B5C
}

.text-ucla-blue {
    color: #2774AE
}

.text-ucla-lighterblue {
    color: #8BB8E8
}

.text-ucla-lighestblue {
    color: #DAEBFE
}


.text-ucla-darkestgold {
    color: #FFB81C
}

.text-ucla-darkergold {
    color: #FFC72C
}

.text-ucla-gold {
    color: #FFD100
}

a.text-ucla-blue:link {
    color: #2774AE
}

.text-ucla-red {
    color: #dc3545
}

/*  Text color classes */


/* background color classes*/
.bg-ucla-darkerblue {
    background-color: #005587
}

.bg-ucla-darkestblue {
    background-color: #003B5C
}

.bg-ucla-blue {
    background-color: #2774AE
}

.bg-ucla-lighterblue {
    background-color: #8BB8E8
}


.bg-ucla-lighestblue {
    background-color: #DAEBFE
}

.bg-ucla-verylightblue {
    background-color: #edf6ff;
}

.bg-ucla-darkestgold {
    background-color: #FFB81C
}

.bg-ucla-darkergold {
    background-color: #FFC72C
}

.bg-ucla-gold {
    background-color: #FFD100
}

/* background color classes*/


/* border color classes*/
.border-ucla-darkerblue {
    border-color: #005587
}

.border-ucla-darkestblue {
    border-color: #003B5C
}

.border-ucla-blue {
    border-color: #2774AE
}

.border-ucla-lighterblue {
    border-color: #8BB8E8
}


.border-ucla-lighestblue {
    border-color: #DAEBFE
}

.border-ucla-darkestgold {
    border-color: #FFB81C
}

.border-ucla-darkergold {
    border-color: #FFC72C
}

.border-ucla-gold {
    border-color: #FFD100
}

/* border color classes*/


/* button classes*/

.btn-ucla-gold {
    background-color: #ffd100;
    color: #003b5c;
    font-weight: bolder;
    text-transform: uppercase;
}

.btn-ucla-blue {
    background-color: #2774AE;
    color: white;
    font-weight: bolder;
    text-transform: uppercase;
}

    .btn-ucla-blue:hover {
        color: white;
    }

.btn-ucla-gold:hover {
    /* font-weight:bolder;*/
}


.btn-insidegrid-ucla-blue {
    border: solid 1px #2774AE;
    color: #2774AE;
    text-transform: uppercase;
}


/* button classes*/



/* Height Width common classes*/

.min-height-vp50 {
    min-height: 50vh;
}

/* Height Width common classes*/




/* UCLA Grid Branding */

.UclaGrid .k-grid-footer, .UclaGrid .k-grid-footer td, .UclaGrid .k-grid-header, .UclaGrid .k-grid-header .k-header {
    background-color: #005587;
    color: white;
}

    .UclaGrid .k-grid-header .k-header .k-link {
        color: white;
    }

.UclaGrid.k-grid .k-grid-header .k-header .k-link {
    height: auto;
}

.UclaGrid.k-grid .k-grid-header .k-header .k-column-title {
    word-break: break-word;
    white-space: normal;
}

.UclaGrid .k-grid-header th.k-header {
    vertical-align: top;
}

.UclaGrid.k-grid td, .UclaGrid.k-grid td.k-state-selected, .UclaGrid .k-grid-content-locked, .UclaGrid .k-grid-footer, .UclaGrid .k-grid-footer-locked, .UclaGrid .k-grid-footer-wrap, .UclaGrid .k-grid-header,
.UclaGrid .k-grid-header-locked, .UclaGrid .k-grid-header-wrap, .UclaGrid .k-group, .UclaGrid .k-group-footer td, .UclaGrid .k-grouping-header, .UclaGrid .k-grouping-header .k-group-indicator, .UclaGrid .k-header, .UclaGrid.k-widget, .UclaGrid .k-toolbar {
    border-color: #2774AE;
}

.UclaGrid .k-active-filter, .UclaGrid .k-state-active, .UclaGrid .k-state-active:hover, .UclaGrid .k-tabstrip .k-state-active {
    background-color: #2774AE;
}

.UclaGrid .k-grid-toolbar .k-button {
    background-color: #2774AE;
    color: white;
}

.UclaGrid.k-grid .k-grid-search {
    border-color: #2774AE;
    color: #2774AE;
    margin-left: auto;
    margin-right: 0;
}

.UclaGrid .k-grid-header .k-i-sort-asc-sm, .UclaGrid .k-grid-header .k-i-sort-desc-sm, .UclaGrid .k-grid-header .k-sort-order {
    color: white;
}

.UCLAGridPopUp .k-window-titlebar {
    background-color: #005587
}

.UclaGrid table {
    word-break: break-word;
}

.UclaGrid td {
    padding: .5em .5em;
    vertical-align: top;
}

.UclaGrid .k-grid-header th.k-header {
    padding: .5em .5em;
}

.UCLAGridPopUp div.k-edit-form-container {
    width: auto;
    padding: 1em;
}

.UCLAGridPopUp .k-popup-edit-form .k-edit-label {
    width: 20%;
    text-align: left;
}

/*
    Increase the width of the textbox containers. The default one is 60%.
    The sum of label and editor percentage widths should be around 90%, to make up for existing paddings.
*/
.UCLAGridPopUp .k-popup-edit-form .k-edit-field {
    width: 70%;
}

    /*
    Expand the edit textboxes and any other Kendo UI widgets.
    In case of unexpected side effects, use widget-specific classes, instead of .k-widget.
*/
    .UCLAGridPopUp .k-popup-edit-form .k-edit-field > .text-box,
    .UCLAGridPopUp .k-popup-edit-form .k-edit-field > .k-widget:not(.k-tooltip),
    .UCLAGridPopUp .k-popup-edit-form textarea {
        width: 98%;
    }


.UCLAGridPopUp .k-edit-form-container .k-primary {
    color: #2774AE;
}

.UclaGrid .k-button-solid-primary {
    border-color: #2774AE;
    color: #fff;
    background-color: #2774AE;
}

.UCLAGridPopUp .k-button-solid-primary {
    border-color: #2774AE;
    color: #fff;
    background-color: #2774AE;
}

/*.UclaGrid .k-grid-filter.k-active, .k-grid-filter.k-state-active {
    background-color: #2774AE;
}*/

.UclaGrid .k-tabstrip .k-tabstrip-items .k-link {
    padding: 1.071em;
    background-color: #005587;
}

.UclaGrid .k-tabstrip ul {
    background-color: #edf6ff;
    list-style-type: disclosure-closed;
    color: #005587;
} 

.UclaGrid .k-tabstrip-items-wrapper {
    background-color: #005587;
}

.UclaGrid .k-tabstrip .k-content.k-active, .k-tabstrip .k-content.k-state-active {
    background-color: #edf6ff;
}

.UclaGrid .k-active, .k-active-filter, .k-active:hover, .k-state-active, .k-state-active:hover, .k-tabstrip .k-active, .k-tabstrip .k-state-active {
    background-color: #2774AE;
}

/* UCLA Grid Branding */

/************ UCLA Branding Classes - End *****************/