#friendsDialog {
  min-width : 247px;
	padding-bottom : 15px;
	font-family: Merriweather serif;
	background:#001600;
	box-shadow : 0px 1px 21px rgba(0, 0, 0, 0.25);
	z-index:10;
	border-radius:5px;
}

#btnCloseFriendDialog {
  width : 52px;
  height : 24px;
}

#btnCloseFriendsDialogError {
  width : 56px;
  height : 24px;
}

#btnCareerOpenSocial {
  top : 70px;
	left : 1246px;
	position : absolute;
}

#btnGameModeSelectOpenSocial {
  top : 268px;
	left : 1157px;
	position : absolute;
}

#btnUserFrameOpenSocial {
  left : 1657px;
	top : -13px;
	position : absolute;
}

.btnOpenSocial {
	width : 56px;
	height : 34px;
}

#tblFriends h3 {
	color : #adadad;
}

#tblFriends p {
	color : #adadad;
}

#tblFriends th {
	color : #adadad;
}

#tblFriends td,#tblFriends th {
	padding-right : 30px;
}

#tblFriends td p {
	margin-bottom : 4px;
}

#tblFriends th {
	text-align : left;
}

.friendsListUsername {
	cursor : pointer;
}
#friendsDialogLoadingAnimation {
	width : 19px;
	height : 20px;
	position : absolute;
	top : 8px;
	left : 73px;
}

#lblFriendsDialogTitle {
	font-size : 18px;
	font-family : Red Rose, cursive;
	color : #E0C34D;
	margin-top : 5px;
	text-align : center;
}

#btnCancelAddSocial {
	width : 78px;
	height : 24px;
}

#divFriendsControls {
  width : 180px;
  padding-bottom : 25px;
	background:#1c261c;
	height : auto;
	border-radius:15px;
}

#divFriendsDetailedStatus, #friendsDialogError {
  width : 231px;
  padding : 15px;
	border: 2px solid #242e24;
	background:#1c261c;
	border-radius:15px;
	position : absolute;
	z-index : 2;
}

#friendsDialogError {
	width : 195px;
}

#divFriendsDetailedStatus p {
  font-size : 14px;
  margin : 18px 0px 0px 38px;
	font-family : Roboto, sans-serif;
	text-align : left;
	color : #6e736e;
}

#friendsDialogError p {
  font-size : 14px;
	font-family : Roboto, sans-serif;
	text-align : center;
	color : #6e736e;
}

#friendsDialogError h1 {
  font-size : 16px;
  margin : 10px 0px 0px 0px;
	font-family : Red Rose, cursive;
	color : white;
	display:block;
	text-align : center;
}

#divFriendsDetailedStatus h1 {
  font-size : 16px;
  margin : 0px 0px 0px 80px;
	font-family : Red Rose, cursive;
	color : white;
	display:block;
}

#lblDetailedStatusOnline {
	font-family: monospace, monospace;
}
#btnRemoveFriend {
	width : 30px;
	height : 25px;
	top : 48px;
	left : 10px;
  position : absolute;
}
#btnAddSocial {
	width : 42px;
	height : 24px;
}

#divSocialLocationCheckBox {
  width : 100px;
  margin : auto;
  z-index : 1;
}

#divSocialFriendStatus {
  padding:5px;
  height : 130px;
  border:solid #a5a564 1px;
  margin:auto;
  overflow-y:scroll;
  overflow-x:hidden;
  border-radius:15px;
  background:#0b1f00;
  font-size : 15px;
}
#divSocialContent {
  padding-left:15px;
  padding-right:15px;
  margin-top:32px;
}

#lblSocialFriendsShare {
  margin-bottom:10px;
  color:#adadad;
  text-align:center;
  font-size : 16px;
}

#inSocialFriendUser {
  width:80%;
  display:block;
  background:#925e43;
  outline:none;
  margin:auto;
  margin-top: -10px;
}
#btnSocialJoinFriend {
  margin-top:10px;
  display:block;
  background:#E0C34D;
}
#lblSocialJoinFriend {
  font-size : 12px;
  font-family : Roboto, sans serif;
  font-weight : 500;
  color : #0C1000;
}

#lblJoinableSessionInfo {
  margin:10px 0 0 0;
  padding-top:15px;
  border-top:solid black 15px;
  text-align:left;
  border-radius:10px;
}

#inSocialAddFriend {
  margin-top:10px;
  display:block;margin:auto;background:#E0C34D;
}

#btnFriendsDetailedStatusClose
{
  width : 56px;
  height : 24px;
}

#connectingToSessionOverlay {
	width : 100%;
	height : 100%;
	z-index : 99;
	position : absolute;
	top : 0px;
	left : 0px;
	margin : 0;
	background : rgba(0,0,0,0.4);
	display : flex;
	justify-content: center;
	align-items : center;
}

#connectingSessionOverlayTitleBox {
	width: 216px;
	height : 102px;
}

#connectingSessionOverlayTitleBox img {
	width : 28px;
	height : 27px;
	display : block;
	margin : auto;
	margin-top : 67px;
}

body:has(.midRes) {
  #btnCloseFriendsDialogError {
    width :  calc(56px*1.24);
    height : calc(24px*1.24);
  }
  #friendsDialog {
    min-width : 306px;
    padding-bottom : 19px;
    box-shadow : 0px 1px calc(21px*1.24) rgba(0, 0, 0, 0.25);
  }
  #lblFriendsDialogTitle {
	  font-size : 22px;
  }
  #btnCareerOpenSocial {
    top : 87px;
	  left : 1545px;
  }
  #btnGameModeSelectOpenSocial {
    top : 332px;
    left : 1434px;
  }
  #btnUserFrameOpenSocial {
    left : 2055px;
	  top : -16px;
  }
  .btnOpenSocial {
    width : 69px;
    height : 42px;
  }
  #tblFriends td,#tblFriends th {
	padding-right : 37px;
  }
  #tblFriends td p {
  	margin-bottom : 5px;
  }
  #divFriendsControls {
    width : 223px;
    padding-bottom : 31px;
  }
  #divFriendsDetailedStatus, #friendsDialogError {
    width : 286px;
    padding : 18px;
  }
  #friendsDialogError {
	  width : 242px;
  }
  #divFriendsDetailedStatus p {
    font-size : 17px;
    margin : 18px 0px 0px 47px;
  }
  #friendsDialogError p {
    font-size : 17px;
  }
  #friendsDialogError h1 {
    font-size : 20px;
    margin : 12px 0px 0px 0px;
  }
  #divFriendsDetailedStatus h1 {
    font-size : 20px;
    margin : 0px 0px 0px 99px;
  }
  #btnRemoveFriend {
    width : 37px;
    height : 31px;
    top : 60px;
    left : 12px;
  }
  #btnAddSocial {
    width : 52px;
    height : 30px;
  }
  #divSocialLocationCheckBox {
    width : 124px;
  }
  #divSocialFriendStatus {
    height : 161px;
    padding:5px;
    font-size : calc(15px*1.24);
  }
  #divSocialContent {
    padding-left:19px;
    padding-right:19px;
    margin-top:40px;
  }
  #lblSocialFriendsShare {
    margin-bottom:12px;
    font-size : calc(16px*1.24);
  }
  #inSocialFriendUser {
   margin-top: -12px;
  }
  #btnSocialJoinFriend {
   margin-top:12px;
  }
  #lblSocialJoinFriend {
    font-size : 15px;
  }
  #lblJoinableSessionInfo {
    margin:12px 0 0 0;
    padding-top:19px;
  }
  #inSocialAddFriend {
    margin-top:12px;
  }
  #btnFriendsDetailedStatusClose
  {
    width : 69px;
    height : 30px;
  }
  #btnCloseFriendDialog {
    width : 64px;
    height : 30px;
  }
  #connectingSessionOverlayTitleBox {
    width: 268px;
    height : 126px;
  }
}

body:has(.highRes) {
  #btnCloseFriendsDialogError {
    width :  calc(56px*1.48);
    height : calc(24px*1.48);
  }
  #friendsDialog {
    min-width : 366px;
    padding-bottom : 22px;
    box-shadow : 0px 1px calc(21px*1.48) rgba(0, 0, 0, 0.25);
  }
  #lblFriendsDialogTitle {
	  font-size : 27px;
  }
  #btnCareerOpenSocial {
    top : 104px;
	  left : 1844px;
  }
  #btnGameModeSelectOpenSocial {
    top : 397px;
    left : 1712px;
  }
  #btnUserFrameOpenSocial {
    left : 2452px;
	  top : -19px;
  }
  .btnOpenSocial {
    width : 83px;
    height : 50px;
  }
  #tblFriends td,#tblFriends th {
	  padding-right : 44px;
  }
  #tblFriends td p {
  	margin-bottom : 6px;
  }
  #divFriendsControls {
    width : 266px;
    padding-bottom : 37px;
  }
  #divFriendsDetailedStatus, #friendsDialogError {
    width : 342px;
    padding : 22px;
    border: 3px solid #242e24;
  }
  #friendsDialogError {
    width : 289px;
  }
  #divFriendsDetailedStatus p {
    font-size : 21px;
    margin : 27px 0px 0px 56px;
  }
  #friendsDialogError p {
    font-size : 21px;
  }
  #friendsDialogError h1 {
    font-size : 24px;
    margin : 15px 0px 0px 0px;
  }
  #divFriendsDetailedStatus h1 {
    font-size : 24px;
    margin : 0px 0px 0px 118px;
  }
  #btnRemoveFriend {
    width : 44px;
    height : 37px;
    top : 71px;
    left : 15px;
  }
  #btnAddSocial {
    width : 62px;
    height : 36px;
  }
  #divSocialLocationCheckBox {
    width : 148px;
  }
  #divSocialFriendStatus {
    height : 192px;
    padding : 7px;
    border:solid #a5a564 2px;
    font-size : calc(15px*1.48);
  }
  #divSocialContent {
    padding-left:22px;
    padding-right:22px;
    margin-top:47px;
  }
  #lblSocialFriendsShare {
    font-size : calc(16px*1.48);
    margin-bottom:15px;
  }
  #inSocialFriendUser {
    margin-top: -15px;
  }
  #btnSocialJoinFriend {
    margin-top:15px;
  }
  #lblSocialJoinFriend {
    font-size : 18px;
    letter-spacing : 1px;
  }
  #lblJoinableSessionInfo {
    margin:15px 0 0 0;
    padding-top:19px;
  }
  #inSocialAddFriend {
    margin-top:15px;
  }
  #btnFriendsDetailedStatusClose
  {
    width : 83px;
    height : 36px;
  }
  #btnCloseFriendDialog {
    width : 77px;
    height : 36px;
  }
  #connectingSessionOverlayTitleBox {
    width: 320px;
    height : 151px;
  }
}