﻿/* Main CSS*/
body {
    min-height: 100vh;
    /*background-color: lightblue;*/
}

.wrapper {
    min-height: 100vh;
}

.flex-fill {
    flex: 1 1 auto;
}

.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}
/*  Background Image */
.bg-image-index {
    background-image: url(../Images/gavel-on-judges-bench-2676x1783.jpg); /* The image used */
    background-color: #cccccc; /* Used if the image is unavailable */
    height: 600px; /* You must set a specified height */
    background-position: left; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    opacity: 0.9;
}
/*  Background Image */
.bg-image-header {
    background-image: url(../Images/HeaderImage-1.jpg); /* The image used */
    background-color: #cccccc; /* Used if the image is unavailable */
    height: 300px; /* You must set a specified height */
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    opacity: 0.9;
}

.pageHeader {
    color: #138496;
    font-size: larger;
    font-weight: bold;
    border-bottom: 2px solid #34495E;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 80%;
}

.bg-blur {
    opacity: 0.2;
}

.bg-news {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px;
    margin: 0 auto;
    background-position: center -100px;
    -webkit-filter: blur(7px);
}

.text-uppercase {
    text-transform: uppercase;
}

.text-active {
    color: #081B3C !important;
}

.text-shadow-dark {
    text-shadow: 2px 2px 4px #000000;
}

.text-shadow-white {
    text-shadow: 2px 2px 4px white;
}

.text-dark-important {
    color: black !important;
}
/* Header Text CSS*/
.headerText {
    color: white;
    text-shadow: 2px 2px 4px #000000;
}

/*Background Color*/
.orangeText {
    color: #FF6600;
}

.text-smokewhite {
    color: #e6e6fa;
}

.bg-sky {
    background-color: #0CADDF;
}

.bg-lightsky {
    background-color: #CDE8F8 !important;
}

.bg-lightestsky {
    background-color: #F8F9FA;
}

.bg-error {
    background-color: #f7c3cf;
}

/* Bootstrap Color Extender*/
.bg-violet {
    background-color: #563D7C;
}

.bg-lightblue {
    background-color: #70B1D4;
}

.bg-header {
    background-color: #47627D;
}

.bg-login-box {
    background-color: #FFFBF8;
}

.bg-creamy {
    background-color: #D6CACA;
}

.bg-smokeyellow {
    background-color: #CFAC94;
}

.bg-error {
    background-color: #FFCCCB;
}

.bg-header {
    background-color: #004880;
}

.bg-footer {
    background-color: #343A40;
}

.bottom-align-text {
    position: absolute;
    bottom: 0;
    right: 0;
}


/* Gradient color1 - color2 - color1 */

hr.style-one {
    border: 0;
    height: 1px;
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -moz-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -ms-linear-gradient(left, #ccc, #333, #ccc);
    background-image: -o-linear-gradient(left, #ccc, #333, #ccc);
}

td.wrapok {
    white-space: normal;
}

.td-limit {
    max-width: 70px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
/*Font Awesome Extender*/
.fa-2x {
    vertical-align: middle;
}
/* Message Box*/
#messagebox {
    border: solid 1px #cecece;
    min-height: 100px;
    color: #4B515D;
}

    #messagebox.success {
        border: solid 1px #00C851;
        border-left: solid 4px #00C851;
    }

    #messagebox.fail {
        border: solid 1px #ff4444;
        border-left: solid 4px #ff4444;
    }

    #messagebox.warning {
        border: solid 1px #ffbb33;
        border-left: solid 4px #ffbb33;
    }

#messagebox-icon {
    padding: 1em;
}

#messagebox-detail-link {
    margin-left: 1em;
    margin-right: 1em;
    position: relative;
    right: 0;
}

#messagebox-header {
    padding-left: 0.6em;
}

#expanded-status {
    border: solid 1px black;
}
/* Card*/
.login-card {
    /* create a custom class so you 
   do not run into specificity issues 
   against bootstraps styles
   which tends to work better than using !important 
   (future you will thank you later)*/
    background-color: rgba(245, 245, 245, 0.4);
    opacity: .4;
}
/* Word Wrap */
.text-wrap {
    word-wrap: break-word;
}

/* rectangle  list style                  */

/* list */
.rectangle-list ol {
    counter-reset: li; /* Initiate a counter */
    margin-left: 0; /* Remove the default left margin */
    padding-left: 0; /* Remove the default left padding */
}

    /* item  */
    .rectangle-list ol > li {
        position: relative;
        list-style: none; /* Disable the normal item numbering */
    }

/* item hover */
.rectangle-list p {
    display: block;
    padding: .4em .4em .4em .8em;
    *padding: .4em;
    margin: .5em 0 .5em 2.5em;
    background: #ddd;
    color: #444;
    text-decoration: none;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

    /* item hover */
    .rectangle-list p:hover {
        background: #CDE8F8;
        /*color:white;*/
    }

    /* number  */
    .rectangle-list p:before {
        content: counter(li);
        counter-increment: li;
        position: absolute;
        left: -2.5em;
        top: 50%;
        margin-top: -1em;
        background: #CDE8F8;
        height: 2em;
        width: 2em;
        line-height: 2em;
        text-align: center;
        font-weight: bold;
    }

    /* number hover */
    .rectangle-list p:after {
        position: absolute;
        left: -1em;
        top: 50%;
        margin-top: -.5em;
        content: '';
        border: .5em solid transparent;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -ms-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
    }

    .rectangle-list p:hover:after {
        left: -.5em;
        border-left-color: #CDE8F8;
    }

/* Tabs*/
section {
    padding: 60px 0;
}

    section .section-title {
        text-align: center;
        color: #007b5e;
        margin-bottom: 50px;
        text-transform: uppercase;
    }

#tabs {
    background: #007b5e;
    color: #eee;
}

    #tabs h6.section-title {
        color: #eee;
    }

    #tabs .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
        color: #f3f3f3;
        background-color: transparent;
        border-color: transparent transparent #f3f3f3;
        border-bottom: 4px solid !important;
        font-size: 20px;
        font-weight: bold;
    }

    #tabs .nav-tabs .nav-link {
        border: 1px solid transparent;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
        color: #eee;
        font-size: 20px;
    }
/*Custom Bootstrap CSS*/
.navbar-custom .navbar-brand {
    color: #FFFFFF;
}

.navbar-custom .navbar-nav .active > .nav-link, .navbar-custom .navbar-nav .nav-link.active, .navbar-custom .navbar-nav .nav-link.show, .navbar-custom .navbar-nav .show > .nav-link {
    color: #FFFFFF;
}

.navbar-custom .navbar-nav .nav-link {
    color: #FFFFFF;
}

    .navbar-custom .navbar-nav .nav-link:focus, .navbar-custom .navbar-nav .nav-link:hover {
        color: #081B3C !important;
    }
