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

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
  color: #0366d6;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 12px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 40px;
    background-color: rgba(200,200,200,0.15);
}
.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 40px; /* Vertically center the text there */
    background-color: #ffffff;
}

.modal-header {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.modal-footer {
    padding-top: 0;
}

.modal {
    overflow-y: auto !important;
}

.dot {
    height: 30px;
    width: 30px;
    background-color: rgba(250,250,250,0.05);
    border-radius: 50%;
    border-width: 2px;
    border-color: rgba(0,0,0,0.25);
    display: inline-block;
    padding: 0;
}

.dotAvtar {
    height: 40px;
    width: 40px;
    background-color: rgba(250,250,250,0.05);
    border-radius: 50%;
    border-width: 2px;
    border-color: rgba(200,200,200,0.95);
    display: inline-block;
    padding: 0;
}

.dotAvtarLarge {
    height: 80px;
    width: 80px;
    background-color: rgba(250,250,250,0.05);
    border-radius: 50%;
    border-width: 2px;
    border-color: rgba(200,200,200,0.95);
    display: inline-block;
    padding: 0;
}

.srchgrpDropFlds {
    max-height: 200px;
    overflow-y: auto;
}

.advFilterLabel {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 400;
    line-height: 1.2;
    font-size: 0.75rem;
    padding-top: 3px;
    vertical-align: middle;
    color: rgba(0,0,0,1);
}

.LabelBottom {
    font-size: 0.75rem;
    color: rgba(0,0,0,.8);
}
/*tool tip colour*/
.tooltip > .tooltip-inner {
    background-color: #444;
    text-shadow: 0 1px 1px #000;
    font-weight: normal;
}

tfoot {
    display: table-footer-group;
    vertical-align: middle;
    border-color: inherit;
    font-weight:600;
}

/*Control styles*/
.readonlyCtrl{
    background-color:rgba(100,100,100,.05);
}

.dropdown-divider{
    margin:2px;
}
.dropdown-item {
    padding: 0.55rem 1rem;
    /*margin:5px 5px 5px 5px;*/
}

.dropdown-menu{
    padding-left:5px;
    padding-right:5px;
}

/* -----------------Menu ------------------*/
.navbar-nav li > span {
    position: relative;
    display: block;
    padding: 10px 15px;
    font-weight: bold;
    color: rgba(242, 238, 238, 0.55);
}

/* adds some margin below the link sets  */
.navbar .dropdown-menu div[class*="col"] {
    margin-bottom: 1rem;
}

/*@media screen and (min-width: 767px) {*/

    /* remove the padding from the navbar so the dropdown hover state is not broken */
    .navbar {
        padding-top: 0px;
        padding-bottom: 0px;
    }

        /* remove the padding from the nav-item and add some margin to give some breathing room on hovers */
        .navbar .nav-item {
            padding: .1rem .5rem 0rem .5rem;
            margin: 0 .25rem 0 .25rem;
        }


        /* makes the dropdown full width  */
        .navbar .dropdown {
            position: static;
        }


        .navbar .dropdown-menu {
            /*width: 50%;*/
            left: auto;
            /* right: 0;
        height of nav-item  */
            top: 45px;
            display: block;
            visibility: hidden;
            opacity: 0;
            transition: visibility 0s, opacity 0.3s linear;
            transition: color .2s linear, background .2s linear, visibility 0s, opacity 0.3s linear;
            border-top-width: 2px;
            border-top-color: #314355;
            border-top-style: solid;
            
        }

        /* shows the dropdown menu on hover */
        .navbar .dropdown:hover .dropdown-menu, .navbar .dropdown .dropdown-menu:hover {
            display: block;
            visibility: visible;
            opacity: 1;
            transition: color .2s linear, background .2s linear, visibility 0s, opacity 0.3s linear;
        }

    .dropdown-menu .dropdown-item {
        color: rgba(242, 238, 238, 0.55);
    }

        .dropdown-menu .dropdown-item:hover {
            /*color: rgba(242, 238, 238, 1);
            background-color: rgba(60,60,60,.79);*/
            color: rgba(242, 238, 238, 1);
            /*background-color: #e14956;  #3b424d rgba(70,70,80,.79);*/
            background: #343a40; /* fallback for old browsers */
            background: -webkit-linear-gradient(to bottom, #343a40, #485051); /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(to bottom, #343a40, #485051); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        }

    .dropdown-menu {
        /*border: 1px solid rgba(0,0,0,.15);
        background-color: rgba(70,70,80,1);*/
        border: 1px solid rgba(0,0,0,.15);
        background-color: #343a40; /*rgba(30,40,30,1);*/
    }
/*}*/

/*:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #ffffff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #007bff;
    --secondary: #6c757d;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}*/
.status_1 { /*Created*/
    background-color: var(--warning);
    color: white;
}
.status_2 { /*Posted*/
    background-color: var(--info);
    color: white;
}
.status_3 { /*Cancelled*/
    background-color: var(--danger);
    color: white;
}
.status_4 { /*Deleted*/
    background-color: var(--pink);
    color: white;
}
.status_5 { /*Working*/
    background-color: var(--info);
    color: white;
}
.status_6 { /*Registered*/
    background-color: var(--info);
    color: white;
}
.status_7 { /*Active*/
    background-color: var(--info);
    color: white;
}
.status_8 { /*Relieved*/
    background-color: var(--gray);
    color: white;
}

.status_16 {    /*Discontinued*/
    background-color: var(--dark);
    color: white;
}

.status_23 { /*Disabled*/
    background-color: var(--dark);
    color: white;
}

.status_24 { /*Completed*/
    background-color: var(--dark);
    color: white;
}
.status_25 { /*Not to Register*/
    background-color: var(--dark);
    color: white;
}

.status_26 { /*Cheque in Hand*/
    background-color: var(--orange);
    color: white;
}
.status_27 { /*Cheque submitted*/
    background-color: var(--indigo);
    color: white;
}
.status_28 { /*Cheque Returned*/
    background-color: var(--red);
    color: white;
}
.status_29 { /*Cheque Issued*/
    background-color: var(--dark);
    color: white;
}

/*student color-profile col styles*/
.card-profile {
    border: 0;
    margin-bottom: 10px;
    margin-top: 50px;
    border-radius: 6px !important;
    color: rgba(0,0,0,.87);
    background: #fff;
    width: 100%;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}
.card-profile .card-avatar {
    width: 100px;
    max-width: 100px;
    max-height: 100px;
    margin: -50px auto 0;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    box-shadow: 0 06px 18px -12px rgba(0,0,0,.56), 0 4px 15px 0 rgba(0,0,0,.12), 0 8px 10px -5px rgba(0,0,0,.2);
}
.card-profile .card-avatar img {
    width: 100%;
}

.card-profile .card-avatar + .card-body {
    margin-top: 5px;
}
.card-title {
    font-weight: 600 !important;
    text-align:center;
    margin-top: 4px;
    font-size:14px;
    color: #3c4858;
}


/*profile pic popup zoom class*/
/**THE SAME CSS IS USED IN ALL 3 DEMOS**/
/**gallery margins**/
ul.gallery {
    margin-left: 13vw;
    margin-right: 13vw;
}

.zoom {
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in;
    cursor: zoom-in;
}

    .zoom:hover,
    .zoom:active,
    .zoom:focus {
        /**adjust scale to desired size, 
add browser prefixes**/
        -ms-transform: scale(5);
        -moz-transform: scale(5);
        -webkit-transform: scale(5);
        -o-transform: scale(5);
        transform: scale(5);
        position: relative;
        left:40px;
        z-index: 100;
    }

/**To keep upscaled images visible on mobile, 
increase left & right margins a bit**/
@media only screen and (max-width: 768px) {
    ul.gallery {
        margin-left: 15vw;
        margin-right: 15vw;
    }

    /**TIP: Easy escape for touch screens,
give gallery's parent container a cursor: pointer.**/
    .DivName {
        cursor: pointer
    }
}