/**
 * CONTENTS
 *
 * BASE RULES
 * A Base rule is applied to an element using an element selector, a descendent selector, or a child selector, along with any pseudo-classes. 
 * It doesn’t include any class or ID selectors.
 *
 * LAYOUT RULES
 * Major layout styles.
 *
 * MODULE RULES
 * Module is a more discrete component of the page. 
 * It is your navigation bars and your carousels and your dialogs and your widgets and so on.
 *
 * STATE RULES
 * A state is something that augments and overrides all other styles. 
 * For example, an accordion section may be in a collapsed or expanded state. A message may be in a success or error state.
 *
 * THEMING RULES
 * It is probably self-evident but a theme defines colours and images that give your application or site its look and feel. 
 * Separating the theme out into its own set of styles allows for those styles to be easily redefined for alternate themes.
 *
 */

/*------------------------------------*\
    #BASE RULES
\*------------------------------------*/

@import url(https://fonts.googleapis.com/css?family=Fjalla+One);

body {
     padding-top: 120px;
    /*padding-top: 70px;*/
    padding-bottom: 30px;
    /*background-image: url("/Images/bg2.jpg");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;*/
    /*background: url("/Images/bg2.jpg") no-repeat center center fixed;*/
    /*-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;*/
}

.registeredStudents {
    width: 100%;
}

#logoutForm {
    /*display: none;*/
}

/*------------------------------------*\
    #LAYOUT RULES
\*------------------------------------*/

.justify-content-md-center {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}


.flex-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
/*------------------------------------*\
    #MODULE RULES
\*------------------------------------*/

.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}

.bs-callout-warning {
    background-color: #fcf8f2;
    border-color: #f0ad4e;
}

    .bs-callout-warning h4 {
        color: #f0ad4e;
    }

.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}

.bs-callout p:last-child {
    margin-bottom: 0;
}

.bs-callout-info {
    border-left-color: #5bc0de;
}

    .bs-callout-info h1, .bs-callout-info h2, .bs-callout-info h3, .bs-callout-info h4 {
        color: #5bc0de;
    }

    .bs-callout-info .glyphicon {
        color: #31708f;
    }


.card .panel, #datasection .panel {
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    /* box-shadow: 0 8px 8px rgba(0, 0, 0, 0.25); */
    /*cursor: pointer;*/
    transition: box-shadow 500ms ease-in;
}

    /*.card .panel:hover, #datasection .panel:hover {
       
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.75);
        transition: box-shadow 250ms ease-out;
    }*/

.card .panel-body {
    padding-top: 5px;
    padding-bottom: 16px;
}

.card .name {
    font-family: Fjalla One;
    font-size: 1.5em;
    border-bottom: 1px solid #dedede;
    margin-bottom: 5px;
    text-shadow: 2px 2px 0 #eee;
    background: linear-gradient(to bottom, rgba(242,242,242,0.65) 0%,rgba(255,255,255,0) 100%);
    transition: all 250ms ease;
}

/*.card .info {
    font-family: monospace;
    font-size: 1em;
    margin-bottom: 5px;
}*/

.card .title {
    font-size: 1.2em;
    margin-bottom: 7px;
    background-color: #f2f2f2;
    font-family: Fjalla One;
    border-left: 2px solid #dedede;
    padding: 4px 2px 1px;
    text-shadow: 2px 2px 0 #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card .description {
    font-size: 0.9em;
    max-height: 70px;
    overflow-y: auto;
    text-overflow: ellipsis;
}

.card strong {
    width: auto;
    margin-right: 10px;
    display: inline-block;
  
}

.sign-out {
    margin-right: 17px;
    margin-top: 10px;
}

.limited-column-td {
    overflow: hidden;
    white-space: nowrap;
    max-width: 400px;
    text-overflow: ellipsis;
}

.selected td {
    background-color: #61B4E4 !important; 
 }

.selected tr {
    background-color: #61B4E4 !important; 
 }
tr.odd.selected, tr.selected {
    background-color: #61B4E4 !important; 
 }

 


/*------------------------------------*\
    #STATE RULES
\*------------------------------------*/

.addedTerm {
    background: #ED7623;
}


/*------------------------------------*\
    #THEMING RULES
\*------------------------------------*/
.navbar-brand img {
    margin-top: -2px;
    width: 100px;
}
.no-underline:link {
    text-decoration:none;
}

.well-hover:hover {
    background-color: #E3E3E3;
}

#requests_index {
padding-top:10px;
padding-bottom:20px;
}
.btn-margin {
    margin:0px 0px 10px 5px !important;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    background-color: #552D81;
    border-color:#552D81;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

.field-validation-error{
    color:red;
    font-style:italic;
}

.badge-primary {
    color: #fff;
    background-color: #321b4c;
    border-color: #2e6da4
}