﻿html, body, .mainContainer, #form1 {
    height: 100%;
    padding: 0;
    margin: 0;
}
.required{
    color:#FF0000;
    font-size:12px;
}
body {
    /*font-family: 'Segoe UI', sans-serif !important;*/
    background-color: #EEE;
    /*font-family: "Poppins", sans-serif;*/
    font-weight: 400;
    font-style: normal;
}
h1, h2, h3, p, input, select, textarea, li {
    /*font-family: 'Segoe UI', sans-serif !important;*/
}
.warningBG {
    background: linear-gradient(to right, rgba(255,165,0,0.8), rgba(255,165,0,0.4))
}
@keyframes progressAnimation {
    0% {
        width: 5%;
        background-color: #F9BCCA;
    }

    100% {
        width: 85%;
        background-color: #EF476F;
    }
}
/*END*/

input[readonly] {
    background-color: #FFF !important;
}
    p.pLrg, span.pLrg {
        font-size:2.6em !important;
    }
.lrg {
    font-size:1.8em;
    font-weight:300
}
h1 {
    font-weight: 400;
    letter-spacing: -0.025em;
    font-size: 2em;
    margin-bottom: 20px;
}
h3 {
    font-size:1.6em;
    text-transform:uppercase;
    letter-spacing:-0.04em;
    font-weight:700;
    margin:0px 0px 15px 0px;
}
.capsBold{
    font-size:1em;
    text-transform:uppercase;
    font-weight:700;
    margin-top:-15px !important
}
a {
    color:#26488e;
    text-decoration:none!important;
}
.label.label-danger {
    color: #FFF !important;
}
div.panel-body .row .form-group.required label:after {
    content: " *";
    color: red;
}
label {
    font-weight:600;
}
.small {
    font-size:8pt;
}
.hiddenPanel {
    display:none
}
.padBottom100 {
    padding-bottom:100px !important
}
.greenText {
    color:rgb(68, 203, 36);
}
.right{
    float:right;
}
.left {
    float:left
}
input[type=checkbox] {
    margin-right:8px
}
.mainContainer {
    min-width: 300px;
    background-color: #EEE;
}
.logo {
    background-color:#FFF;
    padding:20px;
    margin-bottom:30px;
}
    .logo img {
        width:100%;
        height:auto
    }
.rowHighlight {
    background-color:rgba(214,212,75,0.5) !important;
}
.permissions label {
    margin-right:30px;
    display:inline;
    white-space:nowrap
}
.menuCol {
    float: left;
    width: 225px;
    margin-right: -225px;
    height: 100%;
    background-color: #14768C;
    position: fixed
}
    .menuCol p {
        text-align:center;
        color:#FFF;
    }
    .menuCol a {
        color:#FFF !important
    }
    .menuCol ul{
        list-style:none;
        margin:0;
        padding:0;
    }
        .menuCol ul li {
            border-bottom: 1px solid #1B899B;
        }
            .menuCol ul li:last-child {
                border:0;
            }
            .menuCol ul li a:link, .menuCol ul li a:link, .menuCol ul li a:link {
                color:#FFF !important;
                display:block;
                padding:10px 20px;
            }
            .menuCol ul li a:hover {
                background:rgba(255,255,255,0.1)
            }

                .mainCol {
                    margin-left: 225px;
                    padding: 0% 2.5%;
                    /*    background-color: #EEE;*/
                }
.panel-title {
    border-bottom:1px solid #EEE;
    padding:10px 25px;
    font-weight:400;
    font-size:1.4em;
    
}
.viewMember .panel-title {
    cursor:pointer
}
.showDiv {
    display: block;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.panel-body {
    padding: 25px !important;
}
    .panel-body .panelContainer {
        padding: 25px !important;
    }

.panel-body-table {
    padding:0px;
}
    .panel-body-table .table {
        font-weight:200;
    }
    .panel h2 {
        margin:0px;
        padding:0px;
    }
.memberPhoto {
    width:100%;
    height:auto
}

tr.pagerRow td table tr td span {
    padding: 15px;
    font-weight: 600 !important
}


tr.pagerRow td table tr td a:link, tr.pagerRow td table tr td a:active, tr.pagerRow td table tr td a:visited {
    padding: 5px 15px;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

tr.pagerRow td table tr td a:hover {
    background-color: #26488e;
    color: #FFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.notes {
    border-bottom:1px solid #CCC;
    padding:10px 0px 10px 0px;
    margin-bottom:0px;
}
    .notes:last-child {
        border-bottom:0px
    }
    .notes .noteCol {
        max-width:50px;
    }
        .notes .noteCol i {
            font-size:2em
        }
            .notes .private {
                color:#FF0000
            }
#noteHistory {
    overflow-y:scroll;
    max-height:500px;
}
.report {
    background-color:#FFF;
    vertical-align:top;
    display:inline-block;
    margin:1.5%;
    width:18%;
    box-shadow:1px 1px 2px #CCC;
}
    .report .repContent {
        padding: 15px;
    }
        .report .repContent h3, .report .repContent a {
            color:#333
        }
        .report .repContent p {
            color:#999
        }
        .report:hover {
            background-color: #15768C;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }
        .report:hover p, .report:hover h3 {
            color:#FFF;
        }

        @media screen and (max-width:1000px) {
            .menuCol, .mainCol {
        float:none;
        display:block;
        width:100%;
    }

    .menuCol {
        float: none;
        width: auto;
        margin-right:0px;
        height: auto;
        background-color: #14768C;
        position: relative
    }
    .mainCol {
        margin-left: 0px;
        padding: 2.5% 5%;
        /*    background-color: #EEE;*/
    }
    .logo {
        text-align:center;
        background-color: #FFF;
        padding: 20px;
        margin-bottom: 30px;
    }

        .logo img {
            max-width: 300px;
            margin: 0 auto;
            height: auto
        }
    .menuCol a {
        color: #FFF !important;
        font-size:0.9em;
    }
    .menuBar {
        text-align:center;
        margin-top:20px;
    }
    .menuCol ul {
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

        .menuCol ul li {
            border-right: 1px solid #1B899B;
            display:inline-block;
        }

            .menuCol ul li:last-child {
                border: 0;
            }

            .menuCol ul li a:link, .menuCol ul li a:link, .menuCol ul li a:link {
                color: #FFF !important;
                display: block;
                padding: 10px 15px;
            }

            .menuCol ul li a:hover {
                background: rgba(255,255,255,0.1)
            }


}
.box{
    padding:20px;
    background-color:#EEE;
    margin-bottom:20px;
    border-radius:8px;
    border:2px solid #CCC
}
/* Define your original styles for .mx-1 without the .panel-primary class */
.mx-1 {
    
    transition: 0.4s; /* Transition effect for opacity */
}

