/*************************/
/* BEGIN HEADER ELEMENTS */



  /* Name and Account */
  #page-header div.pre-title { 
    font: bold 12px "Arial Narrow", "Franklin Gothic Medium", Arial;
    white-space: nowrap;
	  overflow: hidden;
  }
  #page-header div.title { 
    font: bold 15px "Arial Narrow", "Franklin Gothic Medium", Arial; 
    white-space: nowrap;
	  overflow: hidden;
	  /* max-width:300px;  TODO: Portrait collision with search input */
	  text-overflow: ellipsis;
    float:left;
  }






/* BEGIN HEADER NAME/APPICON */
  #ph-name {
    float:left;
    padding:0 3px;
    margin:4px 5px 0px 18px;
    display:block;
  }
    #ph-name div.pre-title,
    #ph-name div.title { 
      white-space: nowrap;
	    overflow: hidden;
	    max-width:400px;  /* Portrait avoid collision with search input */
	    text-overflow: ellipsis;
    }
    /*#ph-name div.pre-title { 
      font: bold 13px "Arial Narrow", "Franklin Gothic Medium", Arial;
    }
    #ph-name div.title { 
      font: bold 17px "Arial Narrow", "Franklin Gothic Medium", Arial; 
    }*/
  #app-icon {
    width:44px;
    height:28px;
    padding:0;
    margin:1px 10px 0 8px;
    border:1px solid transparent;
    border-radius:5px;
    -webkit-filter: brightness(100%);
  }
    #app-icon:hover {
      border:1px solid #ccc;
      -webkit-filter: brightness(75%);
    }
/* END HEADER NAME/APPICON */


/** BEGIN NOTES **/
  #ph-notes {
    float:right;
    padding:6px 15px 0 5px;
    margin:0px 0px;
    display:inline-block;
    opacity:0.8;
  }
    #notesicon {
      display:block;
      position: relative;
      height: 32px; width: 32px;
      padding:0 4px 0 4px;
      z-index:999;
      background-image: url('img/11compose@3x.png');
      background-repeat:no-repeat;
      background-size: 26px;
      background-position:right 7px center;
      cursor:pointer;
      margin:0 8px 0 0;
    }
/** END NOTES **/


/* BEGIN CART/CHECKOUT */
  #ph-checkout {
    float:right;
    border-left:1px solid #ccc;
    padding:0 15px;
    margin:4px 5px;
    display:block;
  }
  #ph-cart {
    float:right;
    border-left:1px solid #ccc;
    padding:0 15px;
    margin:6px 5px 0px 5px;
    display:block;
  }
  .cart-hover { cursor:pointer; color:#ddd;}
/* END CART/CHECKOUT */


/* BEGIN ACCOUNT */
  #ph-account {
    float:right;
    border-left:1px solid #ccc;
    padding:0 5px 0 15px;
    margin:4px 5px 0px 5px;
    display:block;
    cursor:pointer;
  }
/* END ACCOUNT */


/* BEGIN ARC */
  #ph-prefs {
    float:right;
    padding:10px 20px 5px 15px;
    padding:2px 8px 0 6px;
    margin:4px 5px;
    display:block;
    /*font: bold 17px "Arial Narrow", "Franklin Gothic Medium", Arial;*/ 
    cursor:pointer;
  }
  #prefs-icon {
    display:block;
    position: relative;
    height: 28px; width: 28px;
    padding:0 0px 0 0px;
    z-index:999;
    background-image: url('/a/css/img/11gear@3x.png');
    background-repeat:no-repeat;
    background-size: 26px;
    background-position:left 0px top;
    cursor:pointer;
    margin:0 5px 0 0;
  }
    #prefs-icon.prefA {
      background-image: url('/a/css/img/11gearA@3x.png');
    }
    #prefs-icon.prefR {
      background-image: url('/a/css/img/11gearR@3x.png');
    }
    #prefs-icon.prefC {
      background-image: url('/a/css/img/11gearC@3x.png');
    }

/* END ARC */
  
/* END HEADER ELEMENTS */
/***********************/


/*************************/
/* BEGIN FOOTER ELEMENTS */

#page-footer div.footer-left {
  font: normal 11px Verdana;
  line-height:22px;
  position: relative;
  float: left;
  padding: 0 1em; 
}
#page-footer div.footer-right {
  font: normal 11px Verdana;
  position: relative;
  padding: .4em 2em; 
  float: right;
}
#page-footer a {
  font: normal 11px Verdana;
	color: #fff;
	text-decoration: none;
}
  #page-footer a:hover {
	  text-decoration: underline;
  }
  #page-footer.system-stopped {
	  background-color:indianred;
  }
    #page-footer.system-stopped div.stop-msg {
      font: normal 11px Verdana;
      position: relative;
      float: left;
      padding: .4em 1em; 
      font-style:italic;
    }
/* END FOOTER ELEMENTS */
/***********************/





/* BEGIN SEARCH */

  #ph-search {
    float:right;
    display:inline-block;
    padding:4px 4px;
    margin:0px 0px;
  }
    #ph-search input[type="search"] {
      font:13pt sans-serif;
      padding:3px 5px;
      min-width:300px;
      margin:0;
	    border: none;
	    border-radius: 6px;
	    outline: none;
	    background-color: #fff;
    }
    #search-submit {
      cursor:pointer; 
      width:36px; 
      height: 29px; 
      line-height:29px; 
      font-size:12pt; 
      color: #444;  
      border: 1px solid #222; 
      border-radius: 2px; 
      margin:0;
      padding:0;
    }
      #submit-submit:hover {
          background-color: #357AE8; 
      }
  #search-icon {
    display:block;
    position: relative;
    height: 32px; width: 34px;
    padding:0 4px 0 4px;
    z-index:999;
    background-image: url('/a/css/img/11search@3x.png');
    background-repeat:no-repeat;
    background-size: 26px;
    background-position:right 7px center;
    cursor:pointer;
    margin:0 8px 0 0;
  }
  #searchlist-textbox {
    font:12pt sans-serif;
    letter-spacing:1px;
    padding:3px 5px;
    min-width:300px;
  }
  #search-form div.search-explain {
    font-size:9pt;
    margin-top:2px;
  }
  #ph-searchresult {
    float:right;
    position:relative;
    top:30px;
    right:-45px;
    bottom:auto;
    left:auto;
    background-color:#047;
    background-color:#c60;
    font:10pt sans-serif;
    padding:3px 8px;
    text-align:right;
    z-index:9999;
  }
/* END SEARCH */




/* END HEADER ELEMENTS */
/***********************/