.dsfOverlay
{
  position: fixed;
  z-index:101;
}
.dsfMessage
{
  margin-top: 2px;
  margin-bottom: 4px;
  padding: 10px 18px;
  background-color: #ffffff;
  font-size: 11px;
  font-family: Arial,Helvetica,sans-serif;
  color: #ffffff;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0,0,0,.28);
  opacity: .9;
}
.dsfMsgHead
{
  padding: 10px;
  color: #545454;
  font-size: 14px;
}
.dsfMessage img[title="Dismiss"]
{
  background: url(../images/NotificationClose.png) no-repeat center center / 10px 10px;
  width: 10px;
  height: 10px;
  padding-left: 10px;
  box-sizing: border-box;
  padding:20px
}
.dsfMessage 
{
  color: #333333;
}
.dsfMessageDetail 
{
  margin-top: 5px;
  border-radius: 5px;
  border-top: 0;
  background-color: transparent;
  clear: both;
  overflow: hidden;
  padding: 4px;
}
#CommIndicator 
{
  right: 0;
  margin: auto;
}
.dsfMessage img
{
  padding: 20px;
}


/***** Mobile Social Share *****/
#SocialMediaWidgetContainer
{
  left: 0 !important;
  margin: auto;
  right: 0;
  box-shadow: 0 0 0 8000px rgba(0,0,0,.5);
}

.SocialMediaWidgetContainerMBR
{
  background-color:#ffffff;
  box-shadow:0 2px 8px rgba(0,0,0,.5);
}

.SocialMediaWidgetContainerMBR a
{
  touch-action: manipulation;
}

.TopBarTextMBR
{
  text-shadow:none;
}

.TopBarMBR
{
  box-shadow:none;
  background-color:#2f76bc;
  color:#ffffff;
}


/***** PROFILE *****/
.SlimProfile
{
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}
.SlimProfile p.Field input[type=button]
{
  display: block;
  max-width: 180px;
  width: auto;
  padding: 0.75rem 1.25rem;
  font-size: 14px;
}
.SlimProfile p.Field input[type=button][value="Edit Photo"]
{
  width: 100%;
}

.SocialProfileBody {
  overflow: auto !important;
}


/***** COMM CENTER & Breifcase *****/
.NavContainer1,
#ListFrame
{
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  display: block;
}
.NavContainer1
{
    margin: 1.5rem auto 0;
    background: none;
    border-bottom: 1px solid #ccc;
    padding: 0 0 0.5rem;
}
.NavContainer1 .Mail-NavTab,
.NavContainer1 .Connect-NavTab, 
.NavContainer1 .vCard-NavTab, 
.NavContainer1 .Chat-NavTab
{
  font-size: 0.9rem;
  height: auto;
  background: transparent;
  border: none;
  color: #666;
  text-align: left;
  padding: 5px 12px;  
  width: auto;
  -webkit-transition: width ease .3s;
  -moz-transition: width ease .3s;
  transition: width ease .3s;
}
.NavContainer1 .Mail-NavTabHighlight,
.NavContainer1 .Connect-NavTabHighlight, 
.NavContainer1 .vCard-NavTabHighlight, 
.NavContainer1 .Chat-NavTabHighlight
{
  font-size: 0.9rem;
  height: auto;
  background: transparent;
  color: #2F76BC;
  text-align: left;
  padding: 5px 12px;  
  width: auto;
  -webkit-transition: width ease .3s;
  -moz-transition: width ease .3s;
  transition: width ease .3s;
  border-bottom: 4px solid #2F76BC;
  border-top: none;
  border-left: none;
  border-right: none;
}
.SubNavContainer
{
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  background: transparent;
  padding: 1rem 0 1.5rem;
}
.SubNavTitle
{
  top: 4px;
  display: flex;
  float: none;
}
.SubNavFilter 
{
  position: relative;
}
.SubNavFilter:after
{
  content: "";
  border-top: 7px solid #666;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  position: absolute;
  right: .75rem;
  top: .75rem;
  -webkit-transition: top ease .3s, right ease .3s;
  -moz-transition: top ease .3s, right ease .3s;
  transition: top ease .3s, right ease .3s;
}
.SubNavFilter select
{
  padding: .5rem .5rem .5rem 0.25rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; 
  -webkit-transition: padding ease .3s;
  -moz-transition: padding ease .3s;
  transition: padding ease .3s;
}
.SubNavFilter select::-ms-expand
{
  display: none;
}
.SubNavRefresh
{
  margin: 8px 10px 0 0;
  -webkit-transition: margin ease .3s;
  -moz-transition: margin ease .3s;
  transition: margin ease .3s;     
}
.SubNavLink
{
  padding: 10px 10px 0;
  display: inline-block;
  -webkit-transition: padding ease .3s;
  -moz-transition: padding ease .3s;
  transition: padding ease .3s;   
} 
.SubNavLinkHighlight
{
  padding: 9px 7px 0 10px;
  display: inline-block;
  -webkit-transition: padding ease .3s;
  -moz-transition: padding ease .3s;
  transition: padding ease .3s;  
}
.ResultContainer 
{
  position: relative;
}
.Photo
{
  width: 50px;
  height: 50px;
  outline: none;
}
.Photo img
{
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: 1px solid #e0e0e0;
}
.DetailTitle
{
  margin: 5px 0 0 77px;
}
.DetailDate
{
  margin: 15px 5px 0 0; 
}
.DetailDelete
{
  margin: 0 5px 0 0;
}
.ItemContainer0
{
  padding: .5rem 0;
}
.IsOnline1,
.IsOnline0
{
  /* to add light green in the background replace transparent with rgba(4, 199, 75, 0.05) */
  background: transparent; 
  position: relative;
}
.IsOnline1:after
{
  content: "";
  background: #089c08;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 50px;
  border: 1px solid #fff;
  position: absolute;
  top: 13px;
  left: 50px;
}
.IsOnline0:after
{
  content: "";
  background: #d7efd7;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 50px;
  border: 1px solid #fff;
  position: absolute;
  top: 13px;
  left: 50px;
}
.vCardContainer img
{
  padding: 0;
  border-radius: 50px;
  border: 1px solid #ddd;
  margin: 0 0.5rem 0 0;
}
.ItemContainer1 .MsgStatus,
.ItemContainer0 .MsgStatus
{
  height: 10px;
  margin: 5px 0px 0px 77px;
  float: none;
}
#PrivateChatHelper
{
  visibility: hidden;
}


/***** ACHIEVEMENTS *****/
.spListBody
{
  max-width: 1200px;
  width: 100%;
  margin: 1.5rem auto 0;
}
.spListTitle
{
  border-bottom: 1px solid #ccc;
  padding: 0 .5rem 0.5rem;
  font-size: 18px;
  font-weight: 300;
  color: #333;  
}
.spListModeBtn
{  
  padding: 10px;
  background-color: transparent;
  -webkit-transition: background-color ease .3s;
  -moz-transition: background-color ease .3s;
  transition: background-color ease .3s;    
}
.spListModeBtn:hover
{
  background-color: #c0c0c0;
}
.spListModeBtnSel
{
  padding: 10px;
  background-color: #e0e0e0;
}
.spListCount
{
  color: #808080;
}
#spBadgeList
{
  padding: 1rem 0 0;
}
.spBadgeListItem0,
.spBadgeListItem1
{
  display: flex;
  align-items: center;
}
.spBadgeListItemTitle
{
  color: #444;
  padding: 0;
  margin: 0 0 0 0.7rem;
  font-size: 0.8rem;
}




/***** MEDIA QUERIES *****/
@media screen and (max-width: 639px)
{
  * input,
  * select,
  select,
  input
  {
    font-size:16px !important;
  }

  #twitterBottom input[type="text"]
  {
    width:40%;
  }
  .SubNavFilter select
  {
    padding: .5rem 1.5rem .5rem 0.25rem;
  }  
}

@media screen and (max-width: 480px)
{
  .NavContainer1
  {

  }   
  .NavContainer1 .Mail-NavTab,
  .NavContainer1 .Mail-NavTabHighlight,
  .NavContainer1 .Connect-NavTab, 
  .NavContainer1 .Connect-NavTabHighlight, 
  .NavContainer1 .vCard-NavTab, 
  .NavContainer1 .vCard-NavTabHighlight, 
  .NavContainer1 .Chat-NavTab,
  .NavContainer1 .Chat-NavTabHighlight
  {

  } 
  .SubNavFilter select
  {
    width: 100%;
    margin: 1rem 0 0.5rem;
  }  
  .SubNavFilter:after
  {
    top: 3rem;
    right: 17%;
  }  
  .SubNavFilter
  {
    float: none;
    margin: 0 0.5rem;
    display: inline-block;
    width: 85%;
  }  
  .SubNavRefresh
  {
    margin: 1.6rem 0.5rem 0 0;
    float: none;
    display: inline-block;    
  } 
}

@media screen and (max-width: 300px)
{
  .NavContainer1 .Mail-NavTab,
  .NavContainer1 .Mail-NavTabHighlight,
  .NavContainer1 .Connect-NavTab, 
  .NavContainer1 .Connect-NavTabHighlight, 
  .NavContainer1 .vCard-NavTab, 
  .NavContainer1 .vCard-NavTabHighlight, 
  .NavContainer1 .Chat-NavTab,
  .NavContainer1 .Chat-NavTabHighlight
  {
    width: 100%;
    height: 19px;
  }  
  .SubNavFilter
  {
    width: 80%;
  }  
  .SubNavFilter:after
  {
    right: 22%;
  }  
  .NavContainer1
  {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden; 
  }  
}