/* 
    Created on : Mar 5, 2015, 2:02:01 PM
    Author     : M. Aarons
*/

/* Adjust small screen text orientation - When going to "phone mode" things that aligned right will go left" */
@media (max-width: 768px) {
  .text-right {
    text-align: left !important; 
  }
}

.href-link {
    color: #438EB9;
    font-weight: bold;
}

.grid-align-left {
    text-align: left;
}

.group-display {
    border:1px solid #eef;
    max-height:35em;
    min-height:15em;
    overflow:auto;
    padding-top:.2em;
}
.group-display > table{
    width:100%;
}
.group-display > table > thead > tr > th:first-child{
    min-width:120px;
    font-size:1.1em;
}
.group-display > table > tbody > tr > td:first-child{
    padding:.4em 0 0 1.25em;
    min-width:100px;
    font-size:.9em;
}
.list-link {
    padding:.15em;
    display:block;
    margin-left:1.5em;
    font-weight:normal;
    font-size:.9em;
}
.list-link-sub {
    margin:.3em 0em .3em 1.5em;
    display:block;
    font-weight:bold;
    font-size:.95em;
}
.group-popup {
    border:2px solid #eef;
    background:#fff;
    position:absolute;
    z-index:10;
    display:none;
    text-align:center;
    padding:1em 2em;
    min-width:15em;
}
.del-button{
     text-align:center;
     vertical-align:middle;
     height:28px;
     padding:.2em .5em 0em 0em;
     float:right;
}
.del-button:active,
.del-button.active{
    margin-top:1px;
    margin-left:2px;
}
.add-button{
    //float:right;
    margin-left:1em;
    font-weight:bold;
    font-size:.75em;
    width:2.5em;
    padding:0;
}
.add-button > img{
    padding:0 0 1px 0;;
    margin:0;
    border:0;
    width:1.55em;
    height:1.5em;
}
.hover-bg{
    background:#F8F8F8;
    border-radius:.35em;
    vertical-align:middle;
    min-height:1.5em;
    border:1px solid #FFF;
    padding-left:.3em;
}
.hover-bg:hover{
    padding-left:.5em;
    background:#E5E5E5;
}
/* ng-cloak */
.mouse-pointer:hover{
    cursor:pointer;
}
.form-control{
    font-weight:bold;
    font-size:1.2em;
}
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng.ng-cloak {
    display: none;
}
ul{
    list-style: none;
}
a{
    color: #333;
}
a:hover{
    cursor: pointer;
}
ul.simple-post-list .post-image {
    float: left;
    margin-right: 12px;
}
ul.simple-post-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.body-header{
    color:#438EB9;
}
.callout-box{
    background-color: #546489;
    color: #fff;
    padding: 10px 20px;
}
.body-title{
    border: 1px solid #e3e3e3;
    border-left: 5px solid #234383;
    padding: 0 20px 20px;
}
.featured-box{
    border: 1px solid #e3e3e3;
    border-top: 5px solid #234383;
    padding: 0 20px 20px;
}

multi-container.pos_left {
    position: relative;
    left: 0px;
}

multi-container.pos_right {
    position: relative;
    left: 20px;
}

.form-dropdown{
    width: 100%; 
    height: 32px; 
    border-radius: 3px;
    overflow:scroll;
    overflow-x:scroll;
}

.form-checkbox{
    width: 24px;
    height: 24px;
}

/* Custom dialog/modal headers */

.dialog-header-error { background-color: #d2322d; }
.dialog-header-wait { background-color: #428bca; }
.dialog-header-notify { background-color: #eeeeee; }
.dialog-confirm{background-color: lightskyblue;}
.dialog-header-confirm { background-color: white; }
.dialog-header-error span, .dialog-header-error h4,
.dialog-header-wait span, .dialog-header-wait h4,
.dialog-header-confirm span, .dialog-header-confirm h4 { color: #00ffff; }


/******************************************************
 *
 *      DRAG AND DROP Styles for GROUPS
 *
 ******************************************************/

/**
 * For the correct positioning of the placeholder element, the dnd-list and
 * it's children must have position: relative
 */
.groupsDnD ul[dnd-list],
.groupsDnD ul[dnd-list] > li {
	position: relative;
}

/**
 * The dnd-list should always have a min-height,
 * otherwise you can't drop to it once it's empty
 */
.groupsDnD ul[dnd-list] {
    min-height: 42px;
    padding-left: 0px;
}

/**
 * The dndDraggingSource class will be applied to
 * the source element of a drag operation. It makes
 * sense to hide it to give the user the feeling
 * that he's actually moving it.
 */
.groupsDnD ul[dnd-list] .dndDraggingSource {
    display: none;
}

/**
 * An element with .dndPlaceholder class will be
 * added to the dnd-list while the user is dragging
 * over it.
 */
.groupsDnD ul[dnd-list] .dndPlaceholder {
    display: block;
    background-color: #ddd;
    min-height: 42px;
}

/**
 * The dnd-lists's child elements currently MUST have
 * position: relative. Otherwise we can not determine
 * whether the mouse pointer is in the upper or lower
 * half of the element we are dragging over. In other
 * browsers we can use event.offsetY for this.
 */
.groupsDnD ul[dnd-list] li {
    background-color: #fff;
    border: 1px solid #ddd;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
}

/**
 * Show selected elements in green
 */
.groupsDnD ul[dnd-list] li.selected {
    background-color: #dff0d8;
    color: #3c763d;
}

/**
 * Super/Sub Group specifc background
 */
.groupsDnD ul[dnd-list] li.background-super {
	background-color: #adeffd;
	color: #2F4D99;
        font-weight: bold;
        font-size: larger;
}

.groupsDnD ul[dnd-list] li.background-subgroup {
	background-color: #c9effd;
        font-style: oblique;
	color: black;
        font-weight: bold;
        padding-left: 25px;
}

/***********************************************
 *
 * Required stuff to make grid in group modify
 * to change color based on whether a User has an
 * attached group.
 *
 ************************************************/

// A generic directive for row and cell color
.ui-grid-row .ui-grid-cell {
  background-color: inherit !important;
}

.grid-row-style-red {
  background-color: #ff0000 !important;
}
.grid-row-style-yellow {
  background-color: #fffc5b !important;
}
.grid-row-style-blue {
  background-color: #0000ff !important;
}