body,html{
        height: 100%;
        
    }

    /* remove outer padding */
    .main .row{
        padding: 0px;
        margin: 0px;
    }

    /*Remove rounded coners*/

    nav.sidebar.navbar {
        border-radius: 0px;
    }

    nav.sidebar, .main{
        -webkit-transition: margin 200ms ease-out;
        -moz-transition: margin 200ms ease-out;
        -o-transition: margin 200ms ease-out;
        transition: margin 200ms ease-out;
    
}
    /* Add gap to nav and right windows.*/
    .main{
        padding: 10px 10px 0 10px;
        height: 100%;
        background: white;
    }

    /* .....NavBar: Icon only with coloring/layout.....*/

    /*small/medium side display*/
    @media (min-width: 768px) {
        .navbar{
        position: fixed;
    }
                /*Allow main to be next to Nav*/
        .main{
            position: absolute;
            width: calc(100% - 40px); /*keeps 100% minus nav size*/
            margin-left: 40px;
            float: right;
        }

        /*lets nav bar to be showed on mouseover*/
        nav.sidebar:hover + .main{
            margin-left: 200px;
        }

        /*Center Brand*/
        nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
            margin-left: 0px;
        }
        /*Center Brand*/
        nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
            text-align: center;
            width: 100%;
            margin-left: 0px;
        }

        /*Center Icons*/
        nav.sidebar a{
            padding-right: 13px;
        }

        /*adds border top to first nav box */
        nav.sidebar .navbar-nav > li:first-child{
            border-top: 1px #e5e5e5 solid;
        }

        /*adds border to bottom nav boxes*/
        nav.sidebar .navbar-nav > li{
            /*border-bottom: 1px #d9534f solid;*/
        }

        /* Colors/style dropdown box*/
        nav.sidebar .navbar-nav .open .dropdown-menu {
            position: static;
            float: none;
            width: auto;
            margin-top: 0;
            background-color: transparent;
            border: 0;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

        /*allows nav box to use 100% width*/
        nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
            padding: 0 0px 0 0px;
        }

        /*colors dropdown box text */
        .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
            color: #777;
        }

        /*gives sidebar width/height*/
        nav.sidebar{
            width: 200px;
            height: 100%;
            margin-left: -160px;
            float: left;
            z-index: 8000;
            margin-bottom: 0px;
        }

        /*give sidebar 100% width;*/
        nav.sidebar li {
            width: 100%;
        }

        /* Move nav to full on mouse over*/
        nav.sidebar:hover{
            margin-left: 0px;
        }
        /*for hiden things when navbar hidden*/
        .forAnimate{
            opacity: 0;
        }
    }
    @media (min-width: 767px) {

        /*Allow main to be next to Nav*/
        .main{
            position: absolute;
            width: calc(100% - 40px); /*keeps 100% minus nav size*/
            margin-left: 40px;
            float: right;
        }

        /*lets nav bar to be showed on mouseover*/
        nav.sidebar:hover + .main{
            margin-left: 200px;
        }

        /*Center Brand*/
        nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
            margin-left: 0px;
        }
        /*Center Brand*/
        nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
            text-align: center;
            width: 100%;
            margin-left: 0px;
        }

        /*Center Icons*/
        nav.sidebar a{
            padding-right: 13px;
        }

        /*adds border top to first nav box */
        nav.sidebar .navbar-nav > li:first-child{
            border-top: 1px #e5e5e5 solid;
        }

        /*adds border to bottom nav boxes*/
        nav.sidebar .navbar-nav > li{
            /*border-bottom: 1px #d9534f solid;*/
        }

        /* Colors/style dropdown box*/
        nav.sidebar .navbar-nav .open .dropdown-menu {
            position: static;
            float: none;
            width: auto;
            margin-top: 0;
            background-color: transparent;
            border: 0;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

        /*allows nav box to use 100% width*/
        nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
            padding: 0 0px 0 0px;
        }

        /*colors dropdown box text */
        .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
            color: #777;
        }

        /*gives sidebar width/height*/
        nav.sidebar{
            width: 200px;
            height: 100%;
            margin-left: -160px;
            float: left;
            z-index: 8000;
            margin-bottom: 0px;
        }

        /*give sidebar 100% width;*/
        nav.sidebar li {
            width: 100%;
        }

        /* Move nav to full on mouse over*/
        nav.sidebar:hover{
            margin-left: 0px;
        }
        /*for hiden things when navbar hidden*/
        .forAnimate{
            opacity: 0;
        }
    }

    /* .....NavBar: Fully showing nav bar..... */

    @media (min-width: 1330px) {
    .navbar{
        position: fixed;
    }
    nav.sidebar{
            width: 230px;
            height: 100%;
            margin-left: -160px;
            float: left;
            z-index: 8000;
            margin-bottom: 0px;
        }
        /*Allow main to be next to Nav*/
        .main{
            width: calc(100% - 200px); /*keeps 100% minus nav size*/
            margin-left: 200px;
        }

        /*Show all nav*/
        nav.sidebar{
            margin-left: 0px;
            float: left;
        }
        /*Show hidden items on nav*/
        nav.sidebar .forAnimate{
            opacity: 1;
        }
    }

    nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
        color: white;
        background-color: #E7E7E7;

    }

    nav:hover .forAnimate{
        opacity: 1;
    }
    section{
        padding-left: 15px;
    }

    #footer{
                padding: 20px;
                height: 50px;
                width: 100%;
                text-align: center;
                background: white;/*linear-gradient(to top, #ffe7bc 100%, #fff 100%);*/
            }

nav {
    
    /*background: linear-gradient(to bottom, #006BAB 0%, #0194C0 100%);*/

    background-color: transparent;

    /*border-right: 1px solid rgba(240, 173, 78, 0.8);*/

}

/* navbar */
.navbar-default {
    background-color: white;
    border-color: white;
    /*box-shadow: 5px 0 2px -2px #eae1e1;*/
    border-right: 1px solid rgba(0,0,0,0.2);
}
/* Title */
.navbar-default .navbar-brand {
    color: #ffffff;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #5E5E5E;
}
/* Link */
.navbar-default .navbar-nav > li > a {
    color: white;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #000000;
    background-color: transparent;


    
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: transparent;
    
   
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #555;
    /*background-color: #D5D5D5;*/

}

.navbar .brand, .navbar .nav > li > a {
    color: #000; /*#0194C0;*/
  }

.navbar-default .navbar .brand, .navbar .nav > li > a:hover {
     color: #d9534f;
     font-weight: 450;
}

.navbar-default .navbar-nav > .active{
         color: #d9534f;
}




.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
        width: 100%;
    color: #fff;
    margin-left: 3%;
    /* margin-right: 2%; */
    /* float: right; */
    background: #d9534f;
    box-shadow: /*2px 4px 6px rgba(0,0,0, 1);*/-1px 0px 7px rgba(0,0,0,1), 1px 1px 7px #000000, 0px 0px 2px #d9534f;
    /* border-right: 1px solid rgba(0, 0, 0, 0.2); */
}



  .huge{
    font-size: 37px;
}

.tag-boxes .panel-primary{
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #114579;
    min-height: 140px;
    max-height: auto;
}

.tag-boxes .panel-blue{
    color:white;
    background:#114579;
    box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 2px black, 1px 1px 7px #114579, 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.tag-boxes .panel-blue:hover{
    cursor: pointer;
    color:white;
    background:#114579;
    box-shadow:  inset /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black, inset 1px 1px 7px #114579, inset 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.panel-blue:hover .panel-footer-shadow{
     box-shadow:   /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black,  1px 1px 7px #114579,  1px 2px 0px #000000;
}
.tag-boxes .panel-blue a{
    color:#114579;
}

.tag-boxes .panel-blue a:hover{
    color:#114579;
}
.tag-boxes .panel-red{
    color:white;
    background:#d9534f;
    box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 2px black, 1px 1px 10px #d9534f, 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.tag-boxes .panel-red:hover{
    cursor: pointer;
     color:white;
    background:#d9534f;
    box-shadow:  inset /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black, inset 1px 1px 10px #d9534f, inset 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.panel-red:hover .panel-footer-shadow{
     box-shadow:   /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black,  1px 1px 10px #d9534f,  1px 2px 0px #000000;
}
.tag-boxes .panel-red a{
    color:#d9534f;
}

.tag-boxes .panel-red a:hover{
    color:#d9534f;
}

.tag-boxes .panel-yellow{
    color:white;
    background:#DCAE1D;
    box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 2px black, 1px 1px 10px #DCAE1D, 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}

.tag-boxes .panel-yellow:hover{
    cursor: pointer;
    color:white;
    background:#DCAE1D;
    box-shadow: inset /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black, inset 1px 1px 10px #DCAE1D, inset 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}

.panel-yellow:hover .panel-footer-shadow{
     box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black,  1px 1px 10px #DCAE1D,  1px 2px 0px #000000;
}
.tag-boxes .panel-yellow a{
    color:#DCAE1D;
}

.tag-boxes .panel-yellow a:hover{
    color:#DCAE1D;
}

.tag-boxes .panel-green{
    color:white;
    background:#137c3e;
    box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 2px black, 1px 1px 7px #137c3e, 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.tag-boxes .panel-green:hover{
    cursor: pointer;
   color:white;
    background:#137c3e;
    box-shadow: inset /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black,inset 1px 1px 7px #137c3e,inset 1px 2px 0px #000000;
    min-height: 140px;
    max-height: auto;
}
.panel-green:hover .panel-footer-shadow{
      box-shadow:  /*2px 4px 6px rgba(0,0,0, 1);*/1px 1px 6px black, 1px 1px 7px #137c3e, 1px 2px 0px #000000;
}
.tag-boxes .panel-green a{
    color:#137c3e;
}

.tag-boxes .panel-green a:hover{
    color:#137c3e;
}

.nav.navbar-nav.navbar-right li a {
    color: #eeeeee;
}


.navbar-default .navbar-toggle .icon-bar {
    background-color: black;
}

.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: #fff;
}

#min-height
{
    min-height: 100%;
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
   background-color: #fcfcfc; 
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #eeeeee;
   color: black;font-weight: 500;transition: all .5s ease-in-out;
}


/* Sticky Fixed . */

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #d9534f; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

/* Payment history  */
.containersss
{
    padding: 2px;
    margin-bottom: 25px;
}

.modal
{
    display: none; 
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4); 
    padding-top: 60px;
}   
.modal-content 
{
    background-color: #fefefe;
    margin: 0% auto 15% auto;
    border: 1px solid #888;
    /* width: 30%; */
    height:auto;
    max-width: 400px;
    min-width: 270px;
    width: 100%;
}
@media screen and (max-width: 600px) 
{
    .modal-content {
        width: 90%;
    }
}
.close
{
    position: absolute;
    right: 3px;
    top: 0;
    color: #000;
    font-size: 30px;
    font-weight: bold;
}
.close:hover,
.close:focus 
{
    color: red;
    cursor: pointer;
}
.animate 
{
    -webkit-animation: animatezoom 0.6s;
    animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom 
{
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}

@keyframes animatezoom 
{
    from {transform: scale(0)} 
    to {transform: scale(1)}
}
@media screen and (max-width: 300px) 
{
    span.psw 
    {
        display: block;
        float: none;
    }
    .cancelbtn 
    {
        width: 100%;
    }
}