/*html,body{height:100%;}*/     /* allow container to have height 100% */
body
{
    background-color:#f1f1f1;
    /*background:url(images/bg.gif) repeat-x 0px 0px;*/
    color:#333333;
    font-size: 14px;    /*persist this setting in a cookie*/
    /*font-family: 'Gotham SSm A', 'Gotham SSm B', sans-serif, Verdana;*/
    font-family:  Verdana;  
    /*-webkit-font-smoothing: subpixel-antialiased;*/       
}

/***************** Bootstrap overrides *********************/
/* Set padding to keep content from hitting the edges */
.body-content {
    /*min-height:85%;*/     /* fills window height */ 
    padding:15px;
    margin:57px 20px 0 20px; 
    overflow:hidden; 
    background-color:#fff; 
    border:solid 1px #ccc; 
    border-radius:3px;
}

@media (min-width: 1200px) {
  .container {
    width: 97.5%;
  }
}

@media print{  
    body {font-size:x-small}    /*by default, force all text to x-small*/
    select, input, input[type=text], input[type=number], input[type=date] {font-size:x-small}
    a[href]:after {content: none !important;}   /*bootstrap adds explicit href printing by default, this disables it*/
    #lblPageTitle {font-size:large;}
}

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

form label {}
.form-control-static{ /*margin-top:7px;*/} /*static text in forms*/
.input-group[class*="col-"]{padding:0 15px 0 15px;} /*to align form controls. By default, input-group does not have any padding*/
.panel-title {font-size:inherit; } /*panel membership > Status/Code/Name*/
/*.panel-title .text-danger, .panel-title .text-success,  .panel-title .text-warning {font-weight:bold }*/ /*panel membership > Status/Code/Name, emphasize special statuses */
.tab-content {margin:10px 0 0 0;} /*pushes down tab content for more presize touch*/
.dropdown .dropdown-menu .glyphicon {width: 20px;} /*reserves space for icon in dropdowns*/

/*bootstrap-datepicker, fix to show on top of modal + formatting */
/*.datepicker {z-index: 1151 !important;top: 0 !important;left: 0 !important;height: 75%; width: 75%;}
.datepicker .datepicker-days{width:100%;height:100%;}
.datepicker .datepicker-months{width:100%;height:100%;}
.datepicker .datepicker-years{width:100%;height:100%;}
.datepicker table{width:100%;height:100%;font-size:x-large;font-weight:bold; border-spacing: 10px;border-collapse: separate; }
.datepicker table td{background-color:#e2e2e2;}*/


span.twitter-typeahead .tt-dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: inherit;
  text-align: left;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
}
span.twitter-typeahead .tt-suggestion > p {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
}
span.twitter-typeahead .tt-suggestion > p:hover,
span.twitter-typeahead .tt-suggestion > p:focus {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
  background-color: #428bca;
}
span.twitter-typeahead .tt-suggestion.tt-cursor {color: #ffffff;background-color: #428bca;}
span.twitter-typeahead {width: 100%; position:absolute;} /*fixes hint misalignment*/
.input-group span.twitter-typeahead {display: block !important;}
.input-group span.twitter-typeahead .tt-dropdown-menu {top: 32px !important;}
.input-group.input-group-lg span.twitter-typeahead .tt-dropdown-menu {top: 44px !important;}
.input-group.input-group-sm span.twitter-typeahead .tt-dropdown-menu {top: 28px !important;}
.tt-hint {} /*autocomplete text*/

/* custom modal fade-in effect - delete @media wrapper */
@media DISABLED {   /*used as a workaround to nested comments*/
    .modal {
        /*! adjust transition time */
        -webkit-transition: all ease-out !important;
        -moz-transition: all 0.3s ease-out !important;
        -o-transition: all 0.3s ease-out !important;
        transition: all 0.3s ease-out !important;
    }

    .modal.in .modal-dialog {
        /*! editthis transform to any transform you want */
        -webkit-transform: scale(1.1, 1.1) !important;
        -ms-transform: scale(1.1, 1.1) !important;
        transform: scale(1.1, 1.1) !important;
    }

    .modal.fade .modal-dialog {
        /*! disable sliding from left/right/top/bottom */
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}
/* END: custom modal fade-in effect */


/* Angular */
input.ng-invalid {border: 1px solid red;}
/*input.ng-valid {border: 1px solid green;}*/


/*---- custom classes, prefixed with "app" -----> */
.sep {clear:both;height:10px;}
.sep-line {clear:both; height:1px; background-color:#ddd; margin:10px 0 10px 0;}
/*.app-text-sm{font-size:small;}
.app-text-md{font-size:medium;}
.app-text-lg{font-size:large;}
.app-text-lge{font-size:larger;}
.app-text-xlg{font-size:x-large;}*/
.app-text-bold {font-weight:bold;}
.app-pointer {cursor:pointer;} 
.app-btn-editsavecancel{}   /*used to identify a button-group consisting of Edit/Save/Cancel buttons*/
.app-btn-edit{} /*identifier of action button*/
.app-btn-save{} /*identifier of action button*/
.app-btn-cancel{} /*identifier of action button*/
.app-icon {float:left;display: block; width:70px; height:45px; /*background-size: contain;*/
           background-position:-10px -17px;background-repeat: no-repeat; /*border:1px solid black;*/ }
.app-spinner{} /*loading.gif image*/
.app-toggle{} /*toggle (ON/OFF) checkboxes*/
.app-blink{} /*blink element*/
.app-bg-shade{background-color:#f9f9f9;}

/* loading spinner start */
.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}
@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}
@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}
/* loading spinner end */

/*floating back to top button*/
#backToTop.affix-top {
    position: absolute; /* allows it to "slide" up into view */
    bottom: -82px; /* negative of the offset - height of link element */
    left: 10px; /* padding from the left side of the window */
}
#backToTop.affix {
    position: fixed; /* keeps it on the bottom once in view */
    bottom: 18px; /* height of link element */
    right: 5px; /* padding from the right side of the window */
}

/*floating element*/
.float-bottom-left.affix-top {
    position: absolute; /* allows it to "slide" up into view */
    bottom: -82px; /* negative of the offset - height of link element */
    left: 10px; /* padding from the left side of the window */
}
.float-bottom-left.affix {
    position: fixed; /* keeps it on the bottom once in view */
    bottom: 62px; /* consider back to top button */
    right: 5px; /* padding from the right side of the window */
}

/*toggle switch (transform checkboxes)*/
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #428bca;
}

input:focus + .slider {
  box-shadow: 0 0 1px #428bca;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}
/*end of toggle switch */

/*close graphic at the top right corner*/ 
.close-wrapper {
    position: relative;
    /*display: inline-block;*/
}
    .close-wrapper .close-icon:before {
        content: '✕';
    }
    .close-wrapper .close-icon {
        position: absolute;
        top: 0;
        right: 0;
        cursor: pointer;
        color: #fff;
        font-weight: bold;
        background-color: #333333;
        padding-left: 4px;
        padding-right: 4px;
        border-radius: 50%;
    }