/* General non-bootstrap css */
/*
.activeNav{
    background-color: gray;
    font-weight: bold;
}
*/

.row{
    /* This is keeping the app from having extra space on the side of the app. */
    margin-left:0px !important;
    margin-right:0px !important;
}

/* comment open widget button styles*/

.viewCommentsButton{
    color:white;
    cursor:pointer;
}
.viewCommentsButton:hover{
    text-decoration:underline;
    color:#eee;
}
.viewCommentsButton i{
    text-decoration:none !important;
}

/* Alexander Sage New CSS 10/24/2014*/
.hidden-md{
    margin-top:80px; margin-bottom:80px;
}

@media(max-width:768px){
    .contentBlock {
        padding: 4% !important;
    }
    .hidden-sm.hidden-md.hidden-lg{
        display:none;
    }
    .pageContentContainer{

        padding-left:1%;
        padding-right:1%;
    }
    .pageInfoHeader .websiteTitle {
        width: 96%;
        text-align: center;
        margin-left: 2% !important;
        margin-right: 2% !important;
    }
    .pageInfoHeader .pageDescription h4 {
        /*width: 94%;*/
        padding-left: 5% !important;
        padding-right: 5%;
    }
    .pageInfoHeader .websiteTitle h3{
        border-bottom: 2px solid #FFFFFF;
    }
    .row{
        margin-left:0px;
        margin-right:0px;
    }
    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{
        padding-left:0px;
        padding-right:0px;
    }
    /*dashboard page*/

    .doubleCollum .singleCollum{
        padding-left:0px;
        padding-right:0px;
    }
    .dashboardButtons{
        margin-bottom:20px
    }
    /* ehr data page*/
    .pageEhrData .pageContent {
        width:100%;
    }
    .pageEhrData .pageContent > div {
        width:100%;
    }
    .pageEhrData .col-xs-12{
        width:100%;
        overflow-x:scroll;
        border:1px solid #6075A8;
    }

    .searchBar.col-xs-3{
        width:100%;
    }

    /*analyses Template*/

    .analysesTemplate .pageContentHeader .pageContentTitle{
        padding-left:0px;
    }
    /* Nav bar*/
    .navbar .navbar-nav.patientIDToggle{
        display:none;
    }
    .collapse.navbar-collapse{
        margin:0px;
    }
    .navbar-nav {
        margin: 0px;
    }
    .collapse.navbar-collapse,.collapse.navbar-collapse .nav{
        width:100%;
        padding-left:0px;
        padding-right:0px;
    }
    ul.nav.navbar-nav li {
        border-bottom: 1px solid #e7e7e7;
        background-color: #FAFAFA;
    }
    ul.nav.navbar-nav li:last-child {
        border-bottom: none;
    }

    .patientNavBar ul.nav.navbar-nav li{

        background-color: transparent;
        border-bottom: 1px solid #6279AE;
    }
    /* Home Page */
    .pageHome .jumbotron .col-sm-3 {
        width: 100%;
    }
    .pageHome .jumbotron .col-sm-3 .homeLoginButton {
        width: 100%;
    }
    /*Create Account*/
    .btn-primary{
        width: 100% !important;
        font-size:1.5em;
        padding: 20px;
    }
}

@media(min-width:768px){
    .pageContentContainer{

        padding-left:8%;
        padding-right:8%;
    }
    .pageInfoHeader .websiteTitle{
        border-right: thick solid #FFFFFF;
        width:20%;
    }

    .pageInfoHeader .col-sm-7{
        width:70%;
    }

    /*Dashboard Page*/

    .pageDashboard .col-lg-5 {
        width: 50%;
    }
    /* ehr Data page */
    .pageEhrData .pageContent{
        padding-left:8%;
        padding-right:8%;
    }
    /* Analyses Template css*/
    .analysesTemplate .pageContentHeader .pageContentTitle{
        padding-left:50px
    }
    /*nav bar css*/

    .navBarToggle_als{
        display:none !important;
    }
    /*Login Page*/

}
@media (min-width: 992px){
    .jumbotron .loginForm{
        padding-right:100px;
        margin-right:100px;
        border-right: 1px solid grey;
    }
}

/* Cross Pages */
body{
    padding-top:0px !important;
}
.pageContentTitle{
    width:100%;
}
.buttonContainer{
    margin: 20px 20px 0 20px;
}
/*Page Header*/
.pageContentContainer{
    background-color:#2E384F;
    color:white;
    padding-bottom:50px;

}
.pageInfoHeader{
    margin-top:40px;
    padding-top:20px;
    margin-bottom:25px;
}
.pageInfoHeader .col-xs-offset-1{
    margin:0;
}

.col-xs-10{
    width:auto;
}
.col-xs-offset-1{
    margin-left:0;
}

.pageInfoHeader .websiteTitle h3{
    font-size:1.4em;
}
.pageInfoHeader .pageDescription h4{
    padding-left:20px;
    font-family: Helvetica-light, Helvetica;
}

.pageContent{
    background-color:#6F89C5;
    padding:20px 20px 20px 20px;
    width:100%;
}
h1, .h1, h2, .h2, h3, .h3{
    margin-top:0px;
    margin-bottom:0px;
    padding-top:20px;
    padding-bottom:10px;
}





/* reports page */
.reportBox{
    background-color:#ffffff;
    color:#333333;
    padding:10px;
    padding-top:0px;
}
.pageContent .col-xs-offset-1 {
    margin:0;
}
.white{
    text-align: center;
    margin-top: 50px;
    margin-bottom: 50px;
}

.row.pageContent .pageContentBg .white{
    text-align:center; margin-top:50px; margin-bottom:50px
}
.row.pageContent .pageContentBg .white span{
    font-size:7em
}


/* omics page */

.row.pageOmics .pageContent .pageContentTitle{
    padding-left:25px;
    padding-top:10px;
    margin-bottom:25px;
    width:100%;
}

.row.pageOmics .pageContent .omicsButtons{
    min-width:333px
}
.row.pageOmics .pageContent .omicsButtons .glyphicon, .row.pageOmics .pageContent .white span{
    font-size:7em
}
.row.pageOmics .pageContent .omicsButtons .glyphicon .buttonText{
    padding:9px
}
/* Patient Forum Page*/
.pagePatientForum .pageContentTitle p{

    font-size: 24px;
    font-family: Helvetica-light;
}
/* Patient Forum Page */
.pagePatientForum .commentSection{
    width:100%;
}
.pagePatientForum .commentSection button.pull-right{
    margin-bottom:20px;
}
.pagePatientForum .commentSection button.btn{
    background-color:#6F89C5;color:white;
}
.pagePatientForum .commentSection button.btn span{
    font-size:2em;
}
.pagePatientForum .commentSection #button1,.pagePatientForum .commentSection #button4{
    display:inline;
}
.pagePatientForum .commentSection #button0,.pagePatientForum .commentSection #button2{
    margin-right:10px;
}
.commentSection{

    padding-left:8%;
    padding-right:8%;
}
.commentSection .commentsTable{
    padding-top:50px
}
.commentSection .commentsTable .col-xs-offset-1{
    margin-bottom:50px;
}
.commentSection .commentsTable .col-xs-offset-1{
    margin-bottom:50px;
}
.commentSection .commentsTable .col-xs-offset-1 .headerContainer{
    /*margin-bottom:50px;*/
    background-color:transparent; border-top: 1px solid rgb(232,232,232); color:white;
    padding-top:15px;
}
.commentSection .commentsTable .col-xs-offset-1 .headerContainer .white{
    vertical-align: middle;
    font-size: 1.25em;
    padding-left: 40px;
    text-align: left;
    margin-top: 0px;
    margin-bottom: 0px;
}

.commentSection .commentsTable .col-xs-offset-1 .headerContainer .white h4,.commentSection .commentsTable .col-xs-offset-1 .headerContainer .white h5{
    font-family: Helvetica;
    display: inline;
}
.pagePatientForum .commentSection .commentContainer {
    word-wrap: break-word;
    min-height: 40px;
    padding-left: 40px;
}
.pagePatientForum .commentSection .commentButtons{
    float:right;
}

.pagePatientForum .commentSection .commentBox{
    width:100%;
}


.pagePatientForum .addCommentBox {
    width: 100%;
    text-align:left;
    padding-left: 8%;
    padding-right: 8%;
}
.pagePatientForum .addCommentBox .cancelButton {
    float: right; margin: 10px 0 0 10px; color:black;
}
.pagePatientForum .addCommentBox .submitPostButton {
    float: right; margin-top: 10px;
}

/* patients page */
.pagePatients{
    padding-top:40px;
}
.pageContentContainer .contentTitle{
    font-size:30px;

}
.pagePatients .patientButtons{
    width:100%;
    max-width:450px;
}
.pagePatients .patientButtons .buttonContent.leftContent {
    height:220px;
    margin-top:20px;
}

.pagePatients .patientButtons .buttonContent.rightContent .glyphicon {
    font-size:7em;
    margin-top:10px;
}
.pagePatients .patientButtons .buttonContent.rightContent .textInfo {
    padding:9px;
}

.pagePatients .patientButtons .buttonContent .pull-right.leftContent div {
    text-align:left;
    margin-left:5px;
    font-size:2em;
}
.pagePatients .patientButtons .buttonContent .pull-right.rightContent {
    border-right: 1px solid white;
}
.pagePatients .patientButtons .buttonContent .pull-right.rightContent div {
    margin:5px;
}
.pagePatients .pageContent .videoContentContainer{
    width:84%;
    margin-left:8%;
}

/* our Trials Page */

.pageOurTrials .patientButtons{
    width:100%;
    max-width:350px;
}
.pageOurTrials .patientButtons .glyphicon{
    font-size:7em;
 }


.pageOurTrials .patientButtons .thumbnail{
    height:350px;
}
.pageOurTrials .patientButtons .textInfo{
    padding:9px;
}
/* Dashboard Page*/
.pageDashboard .dashboardButtonContainer #button0 .panel .panel-body
{
    border-top:10px solid #029CEE;
    background-color:#5AB7E8;
    margin:-1px;
}

.pageDashboard .dashboardButtonContainer #button1 .panel .panel-body
{
    border-top:10px solid #B93E03;
    background-color:#E06020;
    margin:-1px;
}

.pageDashboard .dashboardButtonContainer #button2 .panel .panel-body
{
    border-top:10px solid #323234;
    background-color:#58595B;
    margin:-1px;
}

.pageDashboard .dashboardButtonContainer #button3 .panel .panel-body
{
    border-top:10px solid #408103;
    background-color:#66CC04;
    margin:-1px;
}
.pageDashboard .dashboardButtonContainer .panel .panel-body h1
{
    font-size:4em;
    margin:0;
}
.pageDashboard .dashboardButtonContainer .panel .panel-body h3
{
    clear:both; font-family: Helvetica-light, Helvetica
}

.pageDashboard .row{
    margin-left: 0px;
    margin-right: 0px;
}
.pageDashboard .dashboardButtonContainer{
    padding:0px;
    width:100%
}
.pageDashboard .dashboardButtons .panel{
    margin-bottom:0px;
}


.doubleCollum{
}
.doubleCollum .singleCollum.collumLeft{
    padding-left:0px;

}
.doubleCollum .singleCollum.collumRight{
    padding-right:0px;
}
.contentBlock{
    margin-top:20px;
}
.contentBlock,.contentBlock .panel{
    background-color:#6F89C5
}

.contentBlock,.contentBlock .panel .panel-header h2{
    font-family: Helvetica-light, Helvetica
}
.horizontalBarGraph{
    min-height:200px;
    margin-top:20px;
    margin-bottom:25px
}
.horizontalBarGraph .barGraphCollumVar h4{
    font-family: Helvetica-light, Helvetica; font-size: 1.5em;
}
.horizontalBarGraph .barGraphCollumProgress .progress{
    background-color: #6F89C5;
    height:40px;
}
.horizontalBarGraph .barGraphCollumProgress .progress h4{
    float:right;margin-left:1em;color:white;margin-top:0px; padding-top:5px; font-family: Helvetica-light, Helvetica;
}

/* login page*/
.jumbotron{
    height:700px;
    margin-top: 20px;
}

.jumbotron .createAccSection{
    text-align: center;
    padding-bottom:20px;
}
.jumbotron .createAccSection a{
    margin-top: 60px;
    margin-bottom:60px;
}

/* home page */
.pageHome .container{
    width:90%;
    margin-top:20px;
}
.pageHome .jumbotron{
    height:auto;
}
.pageHome .jumbotron .col-sm-3{
    display: inline-block;
    vertical-align: middle;
    float: none;
    margin-top:20px;
}
.pageHome .jumbotron .col-sm-3 .homeLoginButton{
    padding: 20px;
    font-size: 1.5em;
}

/* Navigation Bar */
.pageNavBar .mainHeaderNav{
    background-color: #FFFFFF;
}
.pageNavBar .navbar{
    margin-bottom: 0;
}
.pageNavBar .mainHeaderNav .navbar .logo{
    /*padding-left:30px;*/
    /*max-height:75px;*/
    /*width:40%;*/
    /*min-height:50px;*/
  min-width:300px;
  padding-left: 30px;
  width: 40%;
  max-width: 500px;

}

.pageNavBar .mainHeaderNav .navbar .buttons{
    margin-top:10px;
}
.pageNavBar .navTriangle{
    background-color:#e7e7e7
}
.pageNavBar .navTriangle:after {
    content: "";
    display: block;
    top:-20px;
    border: 12px solid transparent;
    border-bottom-color: #6F89C5;
    position: absolute;
    bottom: 0px;
    left: 50%;
    margin-left: -12px;
}
.pageNavBar .navbar-default .navbar-nav > li > ul > li >  a:hover, .navbar-default .navbar-nav > li > ul > li > a:focus {
    background-color: transparent;
    text-decoration: underline;
}
.pageNavBar .patientNavBar{
    background-color:#6F89C5;
    color:white;
}
 .pageNavBar .patientNavBar .navbar-nav>li>a,.patientNavBar .navbar-default .navbar-nav .open .dropdown-menu>li>a{
    color:white;
}
.pageNavBar .patientNavBar .navbar-default .navbar-nav>.open>a:hover,.patientNavBar .navbar-default .navbar-nav>.open>a:focus{
    background-color:transparent;
    color:white;
}

.loggedInNav .dropdown-menu{
    background-color:#e7e7e7;
}
.loggedInNav .dropdown-menu a{
    color:#777;
}
/* View Account page*/

.pageViewAccount .jumbotron{
    height:auto;
    margin-top:50px;
    background-color:#6F89C5;
    color:white
}


/* Analyses Pages Template CSS*/
.analysesTemplate.col-sm-10{
    width:auto;
}
.analysesTemplate.col-sm-offset-1{
    margin-left:0;
}
.analysesTemplate{margin-right:20px; margin-bottom:25px;}
.analysesTemplate .pageContentHeader{
    padding-top:10px; padding-bottom:30px
}
.analysesTemplate .pageContentHeader .pageContentTitle h2{
    color:white; padding-left:20px;  font-family: Helvetica-light, Helvetica
}
.analysesTemplate .pageContentHeader .input-group{
    padding-right:50px
}

.analysesTemplate .pageContentHeader .input-group .form-control{
    background-color:#475F96;
}
.analysesTemplate .pageContentHeader .input-group .form-control .input-group-addon{
    background-color:#475F96;
}
.analysesTemplate .eventSelection .row:nth-child(0){
    margin-top:20px
}
.analysesTemplate .eventSelection .row{
    background-color:transparent;
    margin-bottom:10px;
}
.analysesTemplate .row.white{
    text-align:center;
}
.analysesTemplate #drivingButton i{
    opacity:.5;
}
.analysesTemplate .helperPanel{
    margin-top:30px;
}
.analysesTemplate .helperPanel span{
    font-size:5em;
}
.analysesTemplate .helperPanel ol{
    text-align:left
}
.analysesTemplate .ngRow.odd {
    background-color: #7E95CB;
}
.analysesTemplate .ngRow.even {
    background-color: transparent;
}
.analysesTemplate .ngGrid {
    background-color: transparent;
}
.analysesTemplate .ngRow.selected {
    background-color: #6C9D8A !important;
}
.analysesTemplate .ngHeaderCell {
    background-color: #6F89C5;
    bottom: 0;
    color: white !important;
    position: absolute;
    top: 0;
    display : table-cell;
    height: auto !important;
    overflow:visible;
    position: static;
    border-bottom-style: solid;
}

.analysesTemplate .ngCell  {
    display : table-cell;
    height: auto !important;
    overflow:visible;
    position: static;
    border:none;
}

.analysesTemplate .ngRow {
    display : table-row;
    height: auto !important;
    position: static;
    border:none;
}

.analysesTemplate .ngCellText{
    height: auto !important;
    white-space: normal;
    overflow:visible;
}
.analysesTemplate .mutsTable{
    height: 400px;
}

.analysesTemplate .mutsTable .ngTopPanel{
    background-color:transparent;
    border:none;
}
.analysesTemplate .mutsTable .ngHeaderSortColumn .ngHeaderText{
  font-size: 18px;
  font-weight: 500;
  font-family: Helvetica, 'segoe pro', Tahoma, Arial, 'sans serif';
}
.analysesTemplate .mutsTable .ngFooterPanel{
  background-color:#6F89C5;
}
.analysesTemplate .mutsTable .ngFooterPanel select,.mutsTable .ngFooterPanel input{
  color:black !important;
}
.analysesTemplate .mutsTable .ngVerticalBar{
  display:none;
}
.analysesTemplate .mutsTable .ngHeaderCell{
  color:transparent !important;
}
.analysesTemplate .mutsTable .ngHeaderCell .ngHeaderSortColumn {
  color:white !important;
}




/*Discussion Grid Styles*/
.gridContainer{
    color:black;
    background-color: #FFF;
}
.gridContainer .gridHeader{
    border-bottom: 1px solid #d4d4d4;
}
.gridContainer .columnHeader{
    padding:8px;
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.gridContainer .gridSection,.gridContainer .columnHeader,.gridContainer .columnContent{
    float:left;
}
.gridContainer .columnHeader,.columnContent{
    /*border:1px solid purple;*/
    white-space: nowrap;
    text-align:center;
}
.gridContainer .columnContent, .gridContainer  h1.ng-binding{
    /*border:1px solid purple;*/
    white-space: nowrap;
    overflow:hidden;
    padding:15px 0px;
    line-height: 30px;
}
.gridContainer .gridContentRow:nth-child(odd){
    background-color:#f4f4f4;
}

.clear{
    clear:both;
}
.gridContainer .gridSection{
    /*border:1px solid deepSkyBlue;*/
    /*width:50%;*/
}
.gridContainer .gridSection .leftSection{
    width:48%;
}
.gridContainer .gridSection .rightSection{

    width:52%;
}
.gridContainer .gridSection .favorite{
    width:6%;
}
.gridContainer .gridSection .title{
    width:65%;
    text-align:left;
}
.gridContainer .gridSection .catagory{
    width:29%;
}
.gridContainer .gridSection .user{
    width:38%;
}
.gridContainer .gridSection .Views{
    width:19%;
}
.gridContainer .gridSection .Response{
    width:19%;

}
.gridContainer .gridSection .activity{
    width:24%;
}

.gridContainer .gridContentRow{
    cursor:pointer;
    /*border:1px solid #ccc;*/
}
.gridContainer .favoriteIcon{
    font-size:18px;
}

.gridContainer h1.ng-binding {
    padding: 0px 0px !important;
    font-size:16px;
    text-overflow:ellipsis;
    white-space: nowrap;
    overflow:hidden;
}
@media(min-width:768px){
    .gridContainer .gridSection{
        width:50%;
    }
    .gridContainer .mobileHidden{
        display:none;
    }
}
@media(max-width:768px){
    .main-content{
        padding: 0 3% 20px 3% !important;
    }
    .gridContainer .gridSection{
        width:100%;
    }
    .gridContainer{
        width:100%;
    }
    .gridContainer .mobileVisible{
        display:none;
    }
    .gridContainer .gridSection.rightSection{
        width:94%;
        margin-left:3%;
        border-top:1px solid #ddd;
    }
    .gridContainer .gridSection .user{
        width:30%;
    }
    .gridContainer .gridSection .Views{
        width:20%;
    }
    .gridContainer .gridSection .Response{
        width:20%;

    }
    .gridContainer .gridSection .activity{
        width:30%;
    }

    .gridContainer .rightSection .columnContent{
        padding:5px 0px;
    }
    .gridContainer .userImage{
        display:none;
    }
    .gridContainer .userImage:first-child{
        display:block;
    }

    .gridContainer .userImage{
    }
    .gridContainer .h1.ng-binding {
        font-size:18px !important;
        line-height:20px;
    }
}
.gridContainer .forum-user-image-initials-text {
    line-height:20px;
}


.gridContainer span.categoryTag {
    padding: 5px;
    color: white;
    border-radius: 5px !important;
}


/* New Comment Container Widget */
    .addCommentContainer {
        height: 50px;
        position: fixed;
        left: 0px;
        padding: 0% 45%;
        width: 10%;
        z-index: 99999;
        overflow:hidden;
        /* animation pieces*/

        bottom: -500px;
        transition: all .3s ease-in-out;
    }
    .addCommentContainer form {
        background-color: #fafafa;
        border: 1px solid #ccc;
        width: 100%;
        padding: 10px;
        height:100%;
    }
    .popIn {
        height:385px;
        bottom: 0px;
        padding: 0% 7%;
        width:100%;
    }
    #addCommentContainer #contentBox {} .ta-scroll-window.form-control {
        height: auto;
        min-height: 150px;
    }
    .ta-scroll-window > .ta-bind {
        height: auto;
        min-height: 150px;
    }
    .LoadedComment{

        background-color:rgba(0,0,0,0.6);
        color:black;
        position:fixed;
        left:0%;
        top:100%;
        width:100%;
        height:100%;
        padding:3%;
        z-index:999;
        transition: all .3s ease-in-out;
    }
    .loadedCommentShow{
        top:0% !important;

    }
    .blackBGColor_forShowingComments{
        z-index:-100;
        width:100%;
        height:100%;
        position:fixed;
        top:0px;
        left:0px;
        opacity:0;
        background-color:rgb(0,0,0);
        transition: all .3s ease-in-out;
    }
    .blackBGColor_forShowingComments_Show{
        z-index:900;
        opacity:0.8;
    }
    .main-content{
        height:100%;
        overflow-y:scroll;
    }





.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}