/*************************************************/
/* MASTER - Google Fonts *************************/
@import url('https://fonts.googleapis.com/css?family=Roboto');

/*************************************************/
/* REBRAND: Green Colors *************************/
/*   - Energetic Green: #99CC99                  */
/*   - Community Green: #33CC66                  */
/*   - Public Green:    #009966                  */
/*   - Law Green:       #006633                  */
/*   - Old Blue:        #587EAE                  */

/*Gr color variables*/
:root {
    --grPrimaryBlue: #0058AA;
}

/*************************************************/
/* MASTER - Html Tags ****************************/
html, form { height: auto; }
body { background-color: #fff; font-family: 'Roboto', sans-serif; font-size: 14px; height: 100%; line-height: normal !important; margin: 0; }
h2 { font-size: 16px; font-weight: bold; line-height: 1.5; margin: 0 0 10px 0; }
hr { margin: 10px 0; }
img { border: none; }
a { color: #000; font-family: 'Roboto', sans-serif; font-size: 14px; text-decoration: underline; }
a:hover { /*background-color: #000; color: #fff;*/ text-decoration: none; }
fieldset { border: none; }
input, select, textarea { font-family: 'Roboto', sans-serif; font-size: 14px; }
input[type='button'], input[type='submit'], button { background-color: #e8e8e8; border: 1px solid #a9a9a9; border-radius: 3px; color: #000; cursor: pointer; padding: 4px 8px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
input[type='button']:hover, input[type='submit']:hover, button:hover { background-color: #dcdcdc;  }
input[type='button']:disabled, input[type='submit']:disabled, select:disabled, textarea:disabled { background-color: #dcdcdc; border: 1px solid #999; color: #808080; cursor: not-allowed; }
p { margin-top: 0; margin-bottom: 10px; }
table { border: none; margin: 0; padding: 0; width: 100%; }
.aspNetHidden { display: none; }
 
/*************************************************/
/* MASTER - FRAME ********************************/
.Frame-Exterior { border: none; height: calc(100% - 68px); min-width: 990px; padding-top: 50px; _width: 990px; }
/* JV 9/11/2014 changed height percent from 100 to 94. At 100, div was creating unnecessary overflow/scrollbar */
.Frame-Body { border: none; margin: 0; height: 100%; }
.Frame-Tbl { border: none; display: flex; flex-direction: row; align-items: stretch; height: 100%; margin: 0; padding: 0; min-height: 400px; width: 100%; _height: 400px;}
.Frame-Tbl .Lft { flex: 0 0 auto; align-self: stretch; background: #F5F5F5 url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/lft-bg.png') repeat-y right top; border: none; box-sizing: border-box; height: auto; min-height: 100%; padding: 10px 0; margin: 0; width: 200px; }
.Frame-Tbl .Bdy { flex: 1 1 auto; align-self: stretch; border: none; box-sizing: border-box; min-width: 0; padding: 10px 10px 40px; height: auto; min-height: 100%; margin: 0; width: auto; }
.Frame-Tbl .Bdy .Title { font-size: 24px; line-height: 1.5; min-height: 38px; padding: 10px 0; margin-bottom: 15px; }
.Frame-Tbl .Bdy .Title a { font-size: 24px !important; text-decoration: none; }
.Frame-Tbl .Bdy .Title .Dates { color: #666; font-size: 12px; font-weight: normal; }
.Frame-Tbl .Bdy .Title .Dates a { font-size: 12px !important; font-weight: normal; }
@media screen and (-webkit-min-device-pixel-ratio:0) { .Frame-Tbl .Bdy .Title .Dates { margin-top: 2px; } }     /* Chrome Hack for Kerning... */
.Frame-Tbl .Bdy .Title span:not(.Hdn) { color: #666; font-size: 14px; font-weight: normal; line-height: 1.5; margin-right: 0.5em; display: inline-block; }
.Frame-Tbl .Bdy .Title .Editable { font-size: 24px !important; }
.Frame-Tbl .Bdy .Title .Editable span { color: #000; font-size: 24px !important; }

/*************************************************/
/* MASTER DEFAULT VIEW - FRAME ********************************/
.Frame-Body .DetailTitle { font-size: 24px; height: 38px; padding: 20px 0px 0px 20px; }
.Frame-Body .DetailTitle a { font-size: 24px !important; text-decoration: none; }
.Frame-Body .DetailTitle .Dates { color: #666; font-size: 12px; font-weight: normal; }
.Frame-Body .DetailTitle .Dates a { font-size: 12px !important; font-weight: normal; }
@media screen and (-webkit-min-device-pixel-ratio:0) { .Frame-Body .DetailTitle .Dates { margin-top: 2px; } }     /* Chrome Hack for Kerning... */
.Frame-Body .DetailTitle span { color: #666; font-size: 14px; font-weight: normal; }
.Frame-Body .DetailTitle .Editable { font-size: 24px !important; }
.Frame-Body .DetailTitle .Editable span { color: #000; font-size: 24px !important; }

.Frame-Footer {
    background-color: #000;
    border: none;
    color: #fff;
    line-height: 30px;
    margin: 0;
    padding: 0;
    position: fixed;
    bottom: 0;
    vertical-align: middle;
    width: 100%;
    z-index: 2000;
}
#kModalSessionWarning div { text-align: center; position: relative; top: 40%; transform: translateY(-40%); }
 
/*************************************************/
/* LEFT MENU *************************************/
.Lft-Btn { background-color: #F5F5F5; border: 1px solid #CCC; border-radius:5px; display: block; margin: 0 10px; padding: 10px 0; text-align: center; text-decoration: none; width: 180px; }
.Lft-Btn:hover { background-color: #fff; border: 1px solid #666; color: #000; }
.Lft-Btn-Sel { background-color: #fff; border: 1px solid #666; border-radius:5px; color: #000; display: block; margin: 0 10px; padding: 10px 0; text-align: center; text-decoration: none; width: 180px; }
.Lft-Btn-Sel:hover { background-color: #fff; border: 1px solid #666; color: #000; cursor: default; }
.Lft-Sep { border-bottom: 1px solid #CCC; margin: 0 10px 10px; padding: 10px 0 0; } 
.Lft-Nav { display: block; margin: 0 10px; padding: 10px 0 10px 10px; text-decoration: none; cursor: pointer !important; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 170px; }
.Lft-Nav:hover { background-color: #CCC; color: #000; }
.Lft-Nav-Sel { background: transparent url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/lft-sel-arrow.png') no-repeat 178px 4px !important; display: block; letter-spacing: 0; margin: 0 0 0 10px; padding: 10px 0 10px 10px; font-weight: bold; text-decoration: none; cursor: pointer; } 
li > .Lft-Nav-Sel { width: 162px; } 
span.Lft-Nav-Sel > a, span.Lft-Nav > a  { text-decoration: none; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;margin: 0;padding: 0;display: block;width: 150px;}
a.Lft-Nav-Sel { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.Lft-Nav-Sel:hover { background-color: transparent; color: #000; } 
 
/*************************************************/
/* CONTROL - MENU ********************************/
.Mnu-NavGlobal { background-color: #6d6d6d; height: 50px; width: 100%; position: fixed; z-index: 2000; white-space: nowrap; -moz-box-shadow: 0 5px 5px #888; -webkit-box-shadow: 0 0 5px #888; box-shadow: 0 0 5px #888; display: inline-block; min-width: 990px; _width: 990px; }
.Mnu-Pages { float: left; margin: 5px 0 0; overflow: visible; }
.Mnu-Alert { background-color: #ff3939; border-radius: 3px; margin: 5px 0 0 10px; padding: 6px 8px; border: none; cursor: pointer; }
.Mnu-Alert i { font-size: 18px; color: #fff; }
.Mnu-User { float: right; padding: 0; width: 275px; margin-right: 12px; }
.Mnu-User .Img { border: solid 1px #fff; height: 30px; margin-top: 1px; width: 30px; }
.Mnu-User .Icon { margin-top: 3px; }
.Mnu-Logo { border: none; float: left; background-color: transparent; margin: 10px 5px 0 10px; }
.Mnu-Logo img { height: 30px; width: 30px; }
.Mnu-User .FA i { font-size: 30px; }
.Mnu-Pages .SearchLt { width: 50%; margin: 2px 0 5px; }
.Mnu-Pages .SearchRt { width: 50%; text-align: center; }
ul#kMenuUser > li.k-first.k-last { float: right; }
.Mnu-User .rnw-count { right: 4px !important; top: 2px !important; }

/*************************************************/
/* CONTROL - SUB TITLE/MENU **********************/
.SubMnu-Btn-Mobile {
    background: #e8edf4;
    background: -moz-linear-gradient(top, #fefeff 0%, #e8edf4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefeff), color-stop(100%,#e8edf4));
    background: -webkit-linear-gradient(top, #fefeff 0%,#e8edf4 100%);
    background: -o-linear-gradient(top, #fefeff 0%,#e8edf4 100%);
    background: -ms-linear-gradient(top, #fefeff 0%,#e8edf4 100%);
    background: linear-gradient(to bottom, #fefeff 0%,#e8edf4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefeff', endColorstr='#e8edf4',GradientType=0 );
    cursor: pointer;
    border: 1px solid #4d4d4d;
    border-radius: 3px;
    padding: 4px 8px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.SubMnu-Btn-Mobile-Desktop { float: right; position: absolute; right: 10px; margin-top: -44px; }

.TopNavBtn { background: #efefef; border: solid 1px #999; border-radius: 3px; cursor: pointer; float: right; font-size: 15px; height: 30px; margin-left: 20px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.TopNavBtn div { text-align: center; padding: 7px 10px 0 10px; }
.TopNavBtnIcon { background-position: 8px center; background-repeat: no-repeat; background-size: 16px; }
.TopNavBtnIcon div { text-align: center; padding: 7px 10px 0 30px; }
.TopNavBtnSearch { background: transparent; border: none; }
.TopNavBtnLft, .TopNavBtnLftLg { border-top-right-radius: 0; border-bottom-right-radius: 0; width: 75px; }
.TopNavBtnRgt, .TopNavBtnRgtLg { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: none; margin-left: 0; width: 75px; }
.TopNavBtnLftLg, .TopNavBtnRgtLg { width: 150px; }
.TopNavBtnSel { background: #dedede; font-weight: bold; }
.TopNavTxt { float: right; font-size: 15px; margin: 0 0 0 20px; padding-top: 8px; }

/*************************************************/
/* CONTROL - ACTION MENU *************************/
.ActionMnu { position: absolute; background-color: #fff; border: 1px solid #c5c5c5; border-radius: 3px; margin-top: 32px; right: 0;  z-index: 2000 !important; width: 200px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.ActionMnu .Item, .ActionMnu-Mobile .Item { border-bottom: 1px solid #c5c5c5; cursor: pointer; padding: 8px 10px 6px; min-height: 18px; vertical-align: middle; }
.ActionMnu .Item .FA16, .ActionMnu-Mobile .Item .FA16 { margin-right: 5px; }
.ActionMnu .Item a, .ActionMnu-Mobile .Item a { text-decoration: none !important; }
.ActionMnu .Item span, .ActionMnu-Mobile .Item span { display: block; float: left; margin-top: 2px; }
.ActionMnu .Item img, .ActionMnu-Mobile .Item img { float: left; margin-right: 10px; vertical-align: middle; }
.ActionMnu .Last, .ActionMnu-Mobile .Last { border-bottom: none; }
.ActionMnu-Mobile { position: absolute; background-color: #fff; border: 1px solid #c5c5c5; border-radius: 3px; margin-top: 50px; margin-left: 150px;  z-index: 2000; width: 200px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
#kendoActionMenu .k-popup { top: 10px; right: 10px; border-radius: 3px; text-align: left; min-width: 142px; }
#kendoActionMenu > li > .k-link { color: #000; font-weight: normal; font-size: 15px; padding: 0.4em 0.7em 0 0.5em; display: inline-block; }
#kendoActionMenu .k-icon { color: #000; }
/* Submenu rows: block width so focus rings wrap the full row (not a clipped L-shape on inline-block) */
#kendoActionMenu .k-group .k-item > .k-link { display: block; width: 100%; box-sizing: border-box; }
#kendoActionMenu .k-group .k-item > .k-link:focus-visible {
    outline: none !important;
    box-shadow: inset 0 0 0 3px #000000 !important;
}
#kendoActionMenu .k-group .k-first { margin-top: 0; border-top: solid 1px #dededb !important; }
#kendoActionMenu i { width: 16px; margin-right: 10px; }

/*************************************************/
/* SECTION - HOME ********************************/
.Home-Tp { background-color: #fff; clear: both; float: none; min-height: 400px; _height: 400px; }
.Home-Bt { clear: both; padding: 10px; min-height: 400px; _height: 400px; }
.Home-Bt .Issues { background-color: #567dab; color: #fff; margin-top: 10px; padding: 5px; }
.Home-Bt .Issues a { color: #fff; }
.Home-Bt .Issues a:hover { background-color: #fff; color: #567dab; }

/*************************************************/
/* SECTION - NOTIFICATIONS ***********************/
.kModalNotificationOptions table { margin: 0; padding: 0; }
#kModalNotificationOptions .Checkboxes { margin-bottom: 5px; }
#kModalNotificationOptions .Checkboxes input { margin-right: 5px; }
#tdMapContainer { height: 530px; /*padding-left: 15px;*/ }
#tdMapContainer #mapForFilters { height: 100%; width: 100%; }
#tdMapContainer .leaflet-control-layers-scrollbar { overflow: auto; }
.leaflet-control-attribution a { font-size: 11px; }
#dFilterByRadius select { margin-left: 5px; width: 150px; }
.NotificationCreate .Subj { width: 500px; }
.NotificationCreate .BodyE { height: 200px; vertical-align: top; width: 500px; }
.NotificationCreate .BodyP { height: 100px; vertical-align: top; width: 500px; }
.PublishBtn { background: #666; background-image: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/mobile/lite/thik/648-paper-airplane@3x.png');  background-position: right 15px center; background-repeat: no-repeat; background-size: 16px; border-radius: 3px; color: #fff; cursor: pointer; font-size: 15px; text-align: center; padding: 10px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.PublishLaterBtn { width:100%; margin-top: 15px; background: #efefef; border-radius: 3px; color: #000; border-style: solid;  border-color: #666; cursor: pointer; font-size: 15px; text-align: center; padding: 8px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.MessageDraftBtn {
    background: #fff !important;
    background-position: right 15px center !important;
    background-size: 16px !important;
    border-radius: 3px !important;
    color: #000000 !important;
    border: 1px solid #b3b3b3 !important;
    cursor: pointer !important;
    font-size: 15px !important;
    text-align: center !important;
    padding: 10px !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}
.ScheduledMessageBtn {
    background: #efefef !important;
    background-position: right 15px center !important;
    background-size: 16px !important;
    border-radius: 3px !important;
    color: #666 !important;
    border: 1px solid #b3b3b3 !important;
    cursor: pointer !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-align: center !important;
    padding: 10px !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}

#kModalNotificationPreview_Content { height: 770px;  }
#iOSPreview { background-image: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/console/notification-iphone-lockscreen.jpg'); float: left; font-family: 'Proxima Nova' !important; height: 600px; width: 460px; }
#iOSPreview .Notification { margin: 325px 40px 0 35px; }
#iOSPreview .Header { background-color: #C7C6C7; color: #5E5A5C; font-size: 12px; height: 17px; padding: 8px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
#iOSPreview .Header .AppIcon { height: 18px; margin-right: 8px; width: 18px; float: left; }
#iOSPreview .Header .AppName { text-transform: uppercase; margin-top: 3px; display: block; float: left; }
#iOSPreview .Header .Time { float: right; margin-top: 2px;padding-right: 5px; }
#iOSPreview .Content { background-color: #BCBABC; color: #000; font-size: 15px; padding: 10px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-top-left-radius: 0; border-top-right-radius: 0; }
#iOSPreview .Content .NotifTtl { padding-bottom: 3px; font-weight: bold; width: 180px; overflow: hidden; height: 17px; white-space: nowrap; }
#iOSPreview .Content .NotifMsg { padding-bottom: 3px; height: 65px; overflow: hidden; }
#iOSPreview .Content .More { color: #5E5A5C; font-size: 12px; padding-top: 3px; }

.AndLocked { background-image: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/console/notification-android-lockscreen.png'); float: left; height: 600px; width: 460px; }
.AndLocked .Notification { margin: 388px 44px 0; }
.AndLocked .Content, .AndUnlocked .Content { background-color: #fff; font-size: 17px; padding: 10px 5px 10px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.AndLocked .Content .AppIcon, .AndUnlocked .Content .AppIcon { height: 50px; margin-right: 12px; width: 50px; float: left; }
.AndLocked .Content .AppName, .AndUnlocked .Content .AppName { color: #000; display: block; float: left; font-size: 17px; margin-top: 5px; width: 225px; }
.AndLocked .Content .Time, .AndUnlocked .Content .Time { color: #616161; float: right; font-size: 13px; margin: 8px 5px 0 0; text-align: right; width: 65px; }
.AndLocked .Content .NotifMsg, .AndUnlocked .Content .NotifMsg { color: #616161; float: left; font-size: 14px; height: 20px; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 290px; }

.AndUnlocked { background-image: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/console/notification-android-unlocked.png'); float: left; height: 600px; margin-left: 20px; width: 460px; }
.AndUnlocked .Notification { margin: 160px 44px 0; }
.AndUnlocked .Content .NotifMsg { color: #616161; float: left; font-size: 15px; height: 58px; margin-top: 4px; overflow: hidden; white-space: normal; width: 290px; }

#WebPreview { background-image: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/console/notification-chrome-desktop-half.png'); background-position: bottom right; float: left; height: 600px; width: 950px; }
#WebPreview .Content { color: #000; left: 305px; margin: 0; height: 234px; overflow: hidden; padding: 0; position: absolute; top: 314px; width: 630px; }
#WebPreview .Content .AppIcon { height: 140px; left: 0; position: absolute; top: 0; width: 140px; }
#WebPreview .Content .Message { height: 204px; left: 150px; overflow: hidden; position: absolute; top: 15px; width: 465px; }
#WebPreview .Content .NotifTtl { font-size: 16px; padding-right: 60px; margin-bottom: 10px; max-height: 40px; overflow: hidden; text-overflow: ellipsis; }
#WebPreview .Content .NotifMsg { font-size: 14px; height: 135px; overflow: hidden; text-overflow: ellipsis; }
#WebPreview .Content .More { color: #5E5A5C; height: 20px; left: 0; position: absolute; bottom: 0; }

/*************************************************/
/* SHARED - Tables (Data) ************************/
.Index-Tbl { border: none; margin: 0; padding: 0; }
.Index-Tbl td, .Index-Tbl th { padding: 5px; }
.Index-Tbl td, .Index-Tbl th, .Index-Tbl td a, .Index-Tbl th a, .Index-Tbl select, .Index-Tbl textarea, .Index-Tbl input { color: #000; font-size: 14px; }
.Index-Tbl td a:hover { background-color: transparent; }
.Index-Tbl .Hdr td, .Index-Tbl .Hdr th { background-color: #000; border: solid 1px #000; color: #fff; font-weight: bold; text-align: left; }
.Index-Tbl .Hdr td a, .Index-Tbl .Hdr th a { color: #fff; }
.Index-Tbl .Hdr td a:hover, .Index-Tbl .Hdr th a:hover { background-color: transparent; }
.Index-Tbl .Alt td { background-color: #eee; }
.Index-Tbl .Pgr td { background-color: #999; border: solid 1px #666; padding: 0; text-align: right; }
.Index-Tbl .Pgr td td span { background-color: #fff; color: #4875b0; display: block; font-weight: bold; padding: 2px 10px; text-align: center; width: 10px; }
.Index-Tbl .Pgr td td a { background-color: #ccc; color: #000; display: block; padding: 2px 10px; text-align: center; width: 10px; }
.Index-Tbl div.Locale { clear: both; display: none; margin-top: 5px; }
.Index-Tbl span.Locale { display: block; float: left; width: 125px; }
.Detail-Tbl td, .Detail-Tbl th { padding: 0; }
.GridIcon { cursor: pointer; font-size: 18px; max-height: 16px; margin-top: -3px; }
.GridIconTxt { cursor: pointer; max-height: 16px; margin-top: -3px; margin-right: 10px; }
.DataRowItem { padding: 5px; }
.DataRowItem a:hover { background-color: transparent; color: #000; }
.DataRowItemAlt { background-color: #eee; padding: 5px; }
.DataRowButton { margin-top: 20px; text-align: center; }
.DataRowButton input[type='button'] { width: 125px; }
.BtnSm input[type='button'] { width: 75px; }
.CountBadge { background-color: #666; color: #fff; border-radius: 3px; display: none; font-weight: normal; margin-left: 12px; padding: 0 6px; }

/*************************************************/
/* CONTENT FRAME *********************************/
.Content-Frame { min-width: 780px; _width: 780px; }
@media only screen and (max-device-width : 1024px) { .Content-Frame { min-width: 240px !important; } }

.Content-Frame .TopNav { margin-top: -44px; position: absolute; right: 10px; }
.Content-Frame .TopNav a { color: #000; text-decoration: underline; }
.Content-Frame .TopNav a:hover { background-color: transparent; text-decoration: none; }
.Content-Frame .Editable { cursor: pointer; }
.Content-Frame .Editable img { margin: 1px 0 0 10px; }
.Content-Frame .Editable i { margin-left: 5px; position: relative; bottom: 1px; }
.Content-Frame .Editable:hover { border: 1px solid #DEDEDE; border-radius: 3px; color: #444 !important;  padding: 2px 6px 0 4px; margin-left: -5px; margin-right: -6px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.Content-Frame .EditableNoBdr { cursor: pointer; margin: 1px 0 0; }
.Content-Frame .EditableNoBdr img { vertical-align: middle; }
.Content-Frame .EditableNoBdr i { margin-left: 5px; position: relative; bottom: 1px; }
.Content-Frame .EditableNoBdr:hover {color: #444 !important; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.Content-Frame .Coordinates { border: 1px solid #D5AA00; background-color: #FFCC00; padding: 5px; font-size: 14px; }
.Content-Frame .MapCreate { float: left; font-size: 12px; width: 100%; }
.Content-Frame .MapCreate .Locate { padding-bottom: 5px; }
.Content-Frame #divMapContainer { box-sizing: border-box; padding: 153px 10px 102px 312px; height: 100vh; _height: 600px; width: 100%; position: absolute; top: 0; left: 0; z-index: 0; }
.Content-Frame #divMapContainer #divReports { float: left; height: 100%; width: 270px; overflow-x:hidden; overflow-y:auto }

/*************************************************/
/* Issue Index ***********************************/
#csRequestDashboard.noHeight { height: 0; overflow-y: hidden; }

#divAddtlData {
    box-sizing: border-box;
    height: 132px;
    width: 100%;
    overflow-y: auto;
    padding: 5px;
    border: 1px solid #6d6d6d;
    border-radius: 3px;
}
/*************************************************/
/* Issue Detail **********************************/
.imgDetailLg, .divNoImage {
    height: 240px;
    width: 240px;
}
.divNoImage { background-color: #ddd; text-align: center; }
.icoNoImage { color: #fff; font-size: 100px; margin-top: 70px; }
.divThumbs { display: flex; flex-wrap: wrap; }
.Thumb { margin: 5px 5px 0 0; }
.Thumb img { height: 50px; width: 50px; object-fit: cover; }
.Thumb i { color: #999; font-size: 50px; }
.ReportItems fieldset { clear: both; display: block; margin: 0 0 10px; padding: 0; }
.ReportItems label { display: block; margin-bottom: 5px; }
.ReportItems input { width: 99% !important; }
.ReportItems input[type='radio'] { width: auto !important; float: left; clear: both;}
.ReportItems input[type='radio'] + label { display: inline-block; float: left; }
.ReportItems input[type='checkbox'] { width: auto !important; float: left; }
.ReportItems input[type='file'] { width: 70% !important; }
.ReportItems select { width: 100% !important; }
.ReportItems textarea { width: 99% !important; }
.ReportItems #fileUpload1, .ReportItems #fileUpload2, .ReportItems #fileUpload3 { width: 80%; }
.ReportItems #fileUpload2, .ReportItems #fileUpload3 { margin-top: 5px; }
.ReportItems #fileUpload2, .ReportItems #fileUpload3 { margin-top: 5px; }
.ReportItems #divButton { display: none; }
.ReportItems #divPrefill { display: none; }

#spanMetricsTitle, #spanAppStoreTitle {font-size: 24px;height: 38px;padding-bottom: 10px;color: #000;}
#spanIssueIndexTitle {font-size: 20px;height: 38px;padding-bottom: 10px;color: #000;}
#divFilterCtxMenu, #divFilterCtxMenuDash { display: none; position: absolute; z-index: 1000; }
#divCommentsCanned .k-combobox .k-input { float: none !important; }
#kComboCannedResponse-list li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#NoCannedResponseMsg { padding: 5px 10px; }
.Floating-SubMnuContainer .SubMenu { visibility: hidden;}
.Floating-SubMnuContainer:hover .SubMenu { visibility: visible;}
.SubMenu {display:flex; flex-direction: column; width:100px; position:absolute; z-index:1000; right:5px; top:20px;}
.SubMenu label { background-color: #EEE; text-align: left; padding-left: 10px;}
.SubMenu label:hover { background-color: #CCC;}

/*************************************************/
/* Issue Create **********************************/
#divContactInit.Hdn + #divContactDone { margin-top: 0; border-top: none; }
#divContactSearchDialog .k-dropdown { width: 29%; }
#divContactSearchDialog .k-autocomplete { width: 69%; }
#divContactCreateDialog label:first-child { position: absolute; padding: 6px 0; }
#divContactCreateDialog .DataRowItem input { margin-left: 90px; }
#divContactCreateDialog .UserInput { width: 76%; }
#divContactCreateDialog input[type="checkbox"] { position: relative; top: 2px; }
fieldset div { display: inline-block; padding-top: 3px; }

/*************************************************/
/* SHARED - Content Sections *********************/
.DetailBlock { border: 1px solid #ccc; border-radius: 3px; padding: 10px; -moz-border-radius: 3px; -webkit-border-radius: 3px; min-width: 240px; _width: 240px; }
.BlockTitle { background: #eee; border: none; color: var(--grPrimaryBlue); font-size: 15px; font-weight: bold; margin: -10px -10px 0; padding: 5px 10px; }
.BlockTitle a { float: right; font-size: 14px; font-weight: normal; }
.BlockTitle a:hover { background: transparent; color: var(--grPrimaryBlue); }
.BlockDiv { border-top: 1px solid #dedede; margin-top: 10px; overflow-wrap: break-word; padding-top: 10px; }
.BlockDiv span a:hover { background: transparent; }
.BlockRow { padding-top: 5px; }
.Block1st { margin-top: 10px; overflow-wrap: break-word; }
.Block1st.scrollable { overflow-y: auto; margin: 0 -10px -10px; padding: 10px; }
.BlockLabel { display: inline-block;width: 15%; min-width: 100px;vertical-align: top; }
.BlockInput { display: inline-block; }
.BlockBreadcrumb { border-bottom: 1px solid #dedede; overflow-wrap: break-word; font-style: italic; padding-top: 10px; margin-bottom: 15px; }
.Content-Frame .SubSection { display: none; }
.UserInput { border: 1px solid #999; border-radius: 3px; padding: 5px 8px; width: 100%; -moz-border-radius: 3px; -webkit-border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/*************************************************/
/* CONTROL - Logs ********************************/
.Logs .Index { border: solid 1px #666; }
.Logs .Hdr, .Logs .Hdr td { background-color: #666; color: #fff; font-weight: bold; }
.Logs .NoData { background-color: #dedede; display: block; padding: 5px; }

.Comments .Img, .Notes .Img { border-radius: 3px; height: 32px; margin-right: 5px; width: 32px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.Comments .Date, .Notes .Date { padding-left: 10px; color: #666; font-size: 13px; }
.Comments .Text, .Notes .Text { margin-top: 5px; }
.Comments .Edit, .Comments .Delete, .Notes .Edit, .Notes .Delete, .Comments .Private, .Comments .Internal { margin-left: 15px; }

/*************************************************/
/* CONTROL - ReportsNearby ***********************/
#divIssuesAsList .Alt { background-color: #f5f5f5 }
.NearbyReportItem { cursor: pointer; margin-bottom: 10px; }
.NearbyReportItem, .NearbyReportItem a { font-size: 13px; }
.NearbyReportItem a:hover { background-color: transparent; color: #000; }
.NearbyReportItem .ReportType { margin-bottom: 1px; padding-top: 3px; }
.NearbyReportItem .ReportType a { font-size: 14px;  }
.NearbyReportItem .Image {  float: left; margin-right: 5px;  height: 60px; width: 60px; }
.NearbyReportItem .DateCreated { margin-bottom: 2px; }

/*************************************************/
/* ESCALATION ********************************/
.WideBlock { max-width: 1600px !important; }

/*************************************************/
/* MAPPING CALLOUT *******************************/
#MapInfoBubble img { float: left; margin-right: 9px; border: 1px solid #ccc; height: 60px; width: 60px; } 
#MapInfoBubble { margin: 0; padding: 12px; background: url('https://d2p5liwq1c5kwh.cloudfront.net/x/images/bg-map-infobubble.png') bottom center no-repeat; position: absolute; width: 356px; height: 84px; z-index: 2000; display: none; } 
#MapInfoBubble p { font-size: 14px !important; height: auto !important; margin: 0; padding: 0; } 
#MapInfoBubble p a { font-size: 14px !important; } 
#MapInfoBubble p a:hover { background-color: transparent; }
#MapInfoBubble p.Title { margin-bottom: 5px; } 
#MapInfoBubble p.Title a { color: #000; font-weight: bold; text-decoration: none; } 
#MapInfoBubble a.Details { margin: 2px 2px 0 0; min-height: 0; padding: 3px 0 2px; clear:none; float: right; width: 75px; text-align: center; color: #000; font-size: 11px !important; font-weight: bold; text-decoration: none; } 

/*************************************************/
/* PLUGIN - Issue Filter *************************/
.IssueFilterHdr { background-color: #FFCD4B; color: #000; padding: 5px 10px; margin-bottom: 5px; position: relative; z-index: 1 }
.IssueFilterHdr a { color: #000; }
.IssueFilterHdr a:hover { background-color: transparent; color: #000; text-decoration: none; }
.IssueFilterHdr .Param {
    border: solid 1px rgba(255, 255, 255, .5);
    cursor: pointer;
    float: left;
    margin-right: 20px;
    padding: 3px 6px;
    background-color: #FFDA7A;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}
.IssueFilterHdr .Param-Gold { color: #333;background-color: #FFBD11; }
.IssueFilterHdr .Param-Gold:hover {background-color: #FFDA7A;}
.IssueFilterHdr .Param-Ui {
    position: relative;
    padding: 3px 6px;
    line-height: normal;
    float: left;
    margin-right: -.1em;
    text-decoration: none !important;
    cursor: pointer;
    text-align: center;
    zoom: 1;
    overflow: visible;
    border: 1px solid rgba(255, 255, 255, .5);
}
.IssueFilterHdr .ItemTxt { float: left; margin-right: 20px; margin-top: 5px; }
.IssueFilterHdr .ItemTxtRt { float: right; margin-left: 20px; margin-top: 5px; }
.IssueFilterOptions { margin: 0 0 0 0; width: 100%; }
.IssueFilterOptions th { padding: 0 15px 10px; text-align: left; }
.IssueFilterOptions td {
    font-size: 12px;
    text-align: left;
    vertical-align: top;
    border-left: 1px solid #8f8f8f;
    padding: 0 15px;
    min-width: 100px;
}
.IssueFilterOptions th:first-child, .IssueFilterOptions td:first-child { padding-left: 0; border: none; }
.IssueFilterOptions th:last-child, .IssueFilterOptions td:last-child { padding-right: 0; }
.IssueFilterOptions ul { list-style: none; margin: 0px; padding: 0px; }
.IssueFilterOptions input[type="checkbox"], .IssueFilterOptions input[type="radio"] { margin-left: 0; cursor: pointer; }
.IssueFilterOptions input + label { position: relative; bottom: 2px; cursor: pointer; }
.IssueFilterOptions .FilterItem0 { float: left; width: 220px; }
.IssueFilterOptions .MetricsFilterItems .FilterItem0 { float: left; width: 305px; }
.IssueFilterOptions .FilterItem1 { float: left; width: 130px; }
.IssueFilterOptions tbody td { padding-bottom: 20px; }
.csIEColumns { columns: 2; float: left; position: relative; margin-right: 20px; -webkit-columns: 2; -moz-columns: 2; }
.ComboBoxFilter { display: flex; padding: 10px 5px 0 0; }
.ComboBoxFilter span { flex-grow: 1; }
.ComboBoxFilter i { padding-top: 2px; }
.ComboBoxFilter i.fa-grip-lines { float: left; margin-right: 7px; }

.ColumnFilter { font-size: 12px; cursor: grab; }
.ColumnFilter:active { cursor: grabbing; }
.ColumnFilter * { cursor: inherit; }
.ColumnFilter.dragging { background-color: #fff; opacity: 0.7; cursor: grabbing; }
.ColumnFilter.dragging .fa-trash-alt { display: none; }
.ColumnFilter.dragging * { cursor: grabbing; }

body:last-child .k-list-scroller .k-list li.k-item { white-space: normal !important; }
.k-combobox .k-state-hover > input { margin-right: 25px; }

/* Date Filter ***********************************/
.ovDateControl { display: grid; grid-template-columns: auto 1fr; row-gap: 5px; column-gap: 10px; align-items: center; }

.ovDateControl .k-dropdown { display: block; height: 32px; width: auto; background: none; }
.ovDateControl .k-dropdown .k-dropdown-wrap { border: solid 2px #b2b2b2; background: none; }
.ovDateControl .k-dropdown .k-dropdown-wrap.k-state-focused { border-color: #b2b2b2; }

.ovDateControl .k-datepicker { height: 32px; background: none; }
.ovDateControl .k-datepicker .k-picker-wrap { background: none; border: solid 2px #b2b2b2; }
.ovDateControl .k-datepicker .k-picker-wrap > input { margin: 0; background: none; }
.ovDateControl .k-datepicker .k-picker-wrap:not(.k-state-hover) .k-select { background-color: #fff; background-image: none; }

/*************************************************/
/* Status Types **********************************/
.Submitted, .Received, .Draft, .SUBMITTED, .RECEIVED, .DRAFT {
    background-color: #C2E8F8 !important;
    color: #000 !important;
    padding: 5px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}
.InProcess, .OnHold, .ReferredToDept, .Published, .INPROCESS, .ONHOLD, .REFERREDTODEPT, .PUBLISHED {     
    background-color: #FEE7AA !important;
    color: #000 !important;
    padding: 5px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important; 
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}
.Closed, .Cancelled, .NotAnIssue, .CouldNotVerify, .Duplicate, .Archived, .CLOSED, .CANCELLED, .NOTANISSUE, .COULDNOTVERIFY, .DUPLICATE, .ARCHIVED {     
    background-color: #E0E0E0 !important;
    color: #000 !important;
    padding: 5px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important; 
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
}
.SubmittedBG, .ReceivedBG, .SUBMITTEDBG, .RECEIVEDBG { background-color: #007EB2; color: #fff; }
.InProcessBG, .OnHoldBG, .ReferredToDeptBG, .INPROCESS, .ONHOLDBG, .REFERREDTODEPTBG { background-color: #EEAC00; color: #fff; }
.ClosedBG, .CancelledBG, .NotAnIssueBG, .CouldNotVerifyBG, .DuplicateBG, .CLOSEDBG, .CANCELLEDBG, .NOTANISSUEBG, .COULDNOTVERIFYBG, .DUPLICATEBG { background-color: #333; color: #fff; }

/*************************************************/
/* JQuery UI - Overrides *****************************/
.cs-ui-state-active { background: #eee; font-weight: bold; }
.cs-ui-button, .cs-ui-context-menu-item { line-height: 1.5;display: inline-block;position: relative;padding: 3.5px 10px; margin-right: -.3em;text-decoration: none !important;cursor: pointer;text-align: center;zoom: 1;overflow: visible;border: 1px solid #c5c5c5;}
#listView, #mapView { border-color: #ccc; }
#mapView { border-left: 1px solid transparent; }
.cs-ui-corner-left {border-top-left-radius: 3px;border-bottom-left-radius: 3px;}
.cs-ui-corner-right {border-top-right-radius: 3px;border-bottom-right-radius: 3px; border-left: 1px solid transparent;}
.cs-ui-corner-top { border-top-right-radius: .3em; border-top-left-radius: .3em;border-bottom: 1px solid transparent;}
.cs-ui-corner-bottom { border-bottom-right-radius: .3em; border-bottom-left-radius: .3em; }

/*************************************************/
/* LEAFLET - Overrides ***************************/
.leaflet-popup-content { font-family: 'Roboto', sans-serif; }
.leaflet-tile:active { cursor: move; }
.leaflet-drag-target:hover { cursor: move !important; }
.leaflet-map-pane:focus { cursor: move; }
.leaflet-dragging { cursor: move !important; }

/*************************************************/
/*** KBARTICLES **********************************/
#spnKbCountDraft { background-color: #007EB2; border-radius: 2px; color: #fff; margin-right: 5px; padding: 3px 6px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
#spnKbCountPublished { background-color: #EEAC00; border-radius: 2px; color: #fff; margin-right: 5px; padding: 3px 6px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
#spnKbCountArchived { background-color: #333; border-radius: 2px; color: #fff; margin-right: 5px; padding: 3px 6px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.kbArticleItem { float: left; width: 100%; padding-bottom: 10px; border-bottom: 1px solid #ccc; margin-top: 10px;}
.kbVoteCount { background-color: #ccc; border-radius: 2px; float: left; text-align: center; padding: 5px 10px; width: 45px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.kbSummaryContainer { display: block; margin-left: 75px; }
.kbHeader { font-size: 16px; font-weight: bold; margin-top: 10px; }
.kbSummary { display: none; }
.kbTitle { color: #0077CC; text-decoration: none; }
.kbTitle:hover { color: #1a9fff; }
.kbSummaryText { margin-top: 5px; }
.kbAttributes { margin-top: 5px; }
.kbCategory { font-weight: bold; }
#divSearch { display: none; }
.kbSearchInput { overflow: hidden; }
.kbSearchInput input { float: right; margin-left: 10px; padding: 3px 10px; }
.kbSearchInput span { display: block; overflow: hidden; }
.kbSearchInput span input { border-radius: 2px; box-sizing: border-box; width: 100%; border: 1px solid #999; padding: 5px 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px;  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.kbMediaItems a { text-decoration: none; }
#csTextArticle { max-height: 500px;overflow-y: auto; }
.KbMediaLnk { float: left; }
.KbMediaLnk img { vertical-align: middle; width: 20px; height: 20px; border: 1px solid black; }
.KbMediaTxt { float: left; margin: 3px 0 0 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 190px; }

/*************************************************/
/*** METRICS *************************************/
.metrics-section { font-weight: bold; margin: 15px 0 10px; }

/* WCAG 1.4.12: Text Spacing - Metrics page section headers need proper spacing */
#divMetrics .Section > div[style*="font-weight: bold"],
#divMetrics .Section > div:first-child {
    line-height: 1.5;
    margin-bottom: 12px;
    padding-top: 8px;
}

.fixed-filter-bar { position: fixed; top: 55px; width: 87.5%; z-index:1000 }

/*************************************************/
/*** BADGES **************************************/
.TitleBadgeGrn { background-color: #A6DBA6; border: solid 1px #009900; border-radius: 3px; color: #000 !important; display: inline-block; margin-left: 20px; padding: 5px 10px; position: relative; top: -4px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.TitleBadgeOng { background-color: #FFDBA6; border: solid 1px #FF9900; border-radius: 3px; color: #000 !important; display: inline-block; margin-left: 20px; padding: 5px 10px; position: relative; top: -4px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.DateEscalated { background-color: #FFDBA6; padding: 4px 8px; }

/*************************************************/
/*** FIELD WORKER APP ****************************/
.lstUpdatedMbl { display: block; margin-top: 2px; margin-bottom: 5px; }

/*************************************************/
/*** INBOUND QUEUE *******************************/
#queueListView { border-color: transparent; height: 75vh;  overflow-y: scroll; overflow-x: auto; }
.queueItem { cursor: pointer; }
.queueItem:hover { background-color: #f5f5f5; }
.queueItemSelected { background-color: #cccccc; }
.queueItemSelected:hover { background-color: #cccccc !important; }
.contactThumb { border: 1px #ccc solid; height: 30px;  width: 30px; }
.attachmentItem { cursor: pointer; display: inline; margin-right: 10px; }
.replyQueueItem { width: 150px; }
.subjectElip { display: -webkit-box; margin: 0; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.senderClass { font-weight: bold; margin-bottom: 5px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 400px; }
.attachmentItem > i { font-size: 30px; vertical-align: top; }
.attachmentItem > img { width: 30px; height: 30px; }

/*************************************************/
/*** ICON PICKER *********************************/
#kModalIconPicker { overflow: auto; }
#aSelectIconTxt { display: none; position: relative; bottom: 3px; }
#aChangeIconTxt { margin-left: 10px; position: relative; bottom: 3px; }
#aClearIconTxt { margin-left: 10px; position: relative; bottom: 3px; }
#aSelectIconTxtChannel { display: none; position: relative; bottom: 3px; }
#aChangeIconTxtChannel { margin-left: 10px; position: relative; bottom: 3px; }
#aClearIconTxtChannel { margin-left: 10px; position: relative; bottom: 3px; }
.IconPickerBox { height: 50px; width: 50px; float: left; text-align: center; margin: 0 5px 5px 0; border: solid 1px #000; padding-top: 10px; }
.IconPickerBox:hover { background-color: var(--grPrimaryBlue) !important }
.IconPickerBox-Sel { background-color: var(--grPrimaryBlue) !important }

/*************************************************/
/*** CREATE AN SR FAB ****************************/
.modal-wrapper { position: fixed; right: 0; height: 100%; top: 0; width: 400px; background-color: #f5f5f5; z-index: 4000; -webkit-box-shadow: -1px 4px 10px -6px rgba(166,166,166,1); -moz-box-shadow: -1px 4px 10px -6px rgba(166,166,166,1); box-shadow: -1px 4px 10px -6px rgba(166,166,166,1); }
.request-button { height: 50px; width: 50px; background-color:  var(--grPrimaryBlue); z-index: 1000; display: flex; align-items: center; justify-content: center; position: fixed; bottom: 32px; right: 15px; border-radius: 60px; cursor: pointer; border: 1px solid #FFFFFF; }
.close-button { margin-left: 20px; margin-top: 20px; height: 25px; width: 25px; display: flex; text-decoration: none; align-items: center; justify-content: center; border-radius: 29px; position: absolute; right: 0; z-index: 3000; margin-right: 13px; }
.modal-background { position: fixed; background-color: black; top: 0; bottom: 0; right: 0; left: 0; z-index: 3000; opacity: 0.5; }
#modalBg { display: none; }
#modal { display: none; }
.k-listview { color: #000000 !important; }
.floating-menu-icon-main, .floating-menu-icon { cursor: pointer; }

/*************************************************/
/* LEAFLET - Overrides ***************************/
.leaflet-popup-content { font-family: 'Roboto', sans-serif; }
.leaflet-tile:active { cursor: move; }
.leaflet-drag-target:hover { cursor: move !important; }
.leaflet-map-pane:focus { cursor: move; }
.leaflet-dragging { cursor: move !important; }

/*************************************************/
/* SERVICE REQUEST TAGS **************************/
.sr-tag {
    height: auto;
    min-height: 22px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 12px;
    color: var(--grPrimaryBlue);
    border: 1px solid var(--grPrimaryBlue);
    border-radius: 2px;
    display: inline-block;
    cursor: default;
}
.sr-tag span {
	vertical-align: middle;
	line-height: 22px;
}
.sr-tag-unselect {
	padding-left: 5px;
	font-size: 12px;
	cursor: pointer;
}

/*************************************************/
/* GRID - PAGER **************************/
.k-pager-wrap {
    display: flex !important;
    background-color: #f5f5f5 !important; 
    border-radius: 4px !important; 
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    align-items: center !important;
    gap: 0 !important;
}

.k-pager-wrap .k-pager-nav-wrap {
    order: 2 !important;
    margin-left: auto !important;
}

.k-pager-wrap .k-pager-info {
    order: 1 !important;
    margin-left: 10px !important;
}

.k-pager-wrap .k-pager-first {
    margin-left: 3px !important;
}

.k-grid-pager .k-link { 
    color: #000 !important; 
}
.k-grid-pager .k-state-selected { 
    background-color: var(--grPrimaryBlue) !important; 
    border-color: #DDD !important;
    border-radius: 0 !important;
    margin: 0 !important;
    margin-right: 0 !important;
    position: relative !important;
    z-index: 2 !important;
}

.k-pager-numbers .k-link,
.k-pager-nav {
    background-color: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    min-width: 30px !important;
    height: 30px !important;
    line-height: 28px !important;
    text-align: center !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.k-pager-numbers .k-state-selected {
    color: white !important;
    font-weight: bold !important;
    min-width: 30px !important;  
    height: 31px !important;
    box-sizing: border-box !important;
}

.k-pager-info {
    margin-right: 10px !important;
}

.k-pager-numbers {
    display: flex !important;
    margin: 0 !important;
    gap: 0 !important;
}

.k-pager-numbers .k-link:not(:first-child),
.k-pager-nav + .k-pager-nav,
.k-pager-numbers + .k-pager-nav,
.k-pager-nav + .k-pager-numbers {
    margin-left: -1px !important;
}

.k-pager-wrap .k-pager-nav:hover,
.k-pager-numbers .k-link:hover {
    background-color: lightgray !important;
    color: #000 !important;
    position: relative !important;
    z-index: 1 !important;
}

.k-pager-wrap .k-pager-nav.k-pager-first {
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

.k-pager-wrap .k-pager-nav.k-pager-last {
    border-top-right-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
}

/*************************************************/
/* SHARED - Common *******************************/
#divGlobalMessage {
    border-radius: 3px;
    bottom: 30px;
    display: none;
    font-size: 16px;
    left: 15px;
    right: 15px;
    position: fixed;
    z-index: 2147483647;
}
#divGlobalMessage .Icon { font-size: 19px; position: absolute; top: 10px; right: 13px; }
#divGlobalMessage a { font-size: 16px;}

.ButtonLg {  width: 150px; }
.ButtonSm {  width: 100px; }
.MessageRed { background-color: #EDA6A6; border: solid 1px #990000; color: #990000; display: block; margin-bottom: 10px; padding: 10px; }
.MessageOng { background-color: #FFDBA6; border: solid 1px #FF9900; color: #000; display: block; margin-bottom: 10px; padding: 10px; }
.MessageBlu { background-color: #78Dfff; border: solid 1px #007EB2; color: #000; display: block; margin-bottom: 10px; padding: 10px; } 
.MessageGrn { background-color: #A6DBA6; border: solid 1px #009900; color: #000; display: block; margin-bottom: 10px; padding: 10px; }
.NoData { color: #990000; display: block; margin-bottom: 10px; padding: 5px; }
.NoticeRed, .Red, .NoticeRed a, .Red a, .MessageRed a { color: #990000 !important; }
.NoticeOng, .Ong, .NoticeOng a, .Ong a { color: #FF9900 !important; }
.NoticeBlu, .Blu, .NoticeBlu a, .Blu a { color: #007EB2 !important; }
.NoticeGrn, .Grn, .NoticeGrn a, .Grn a { color: #009900 !important; }
.Alt { background-color: #DEDEDE; }
.Box20 { border: 1px solid #999999; border-radius: 4px; display: inline-block; margin: 2px 0 -2px 0; height: 20px; width: 20px; }
.Ctr { text-align: center; }
.Blk { display: block; }
.Hdn { display: none; }
.HdnImp { display: none !important; }
.Ptr { cursor: pointer; }
.Icon18 { max-width: 18px; _width: 18px; }
.Selected { background-color: #dcdcdc !important; }
.FA20 { color: #000; cursor: pointer; font-size: 20px; }
.FA16 { color: #000; cursor: pointer; font-size: 16px; }
.FA14 { color: #000; cursor: pointer; font-size: 14px; }
.FltL { float: left; }
.FltR { float: right; }
.Footnote { color: #666; display: block; font-size: 11px; padding: 3px 0 0; }
.Footnote a { color: #666; font-size: 11px; }
.Input { color: #000; display: block; float: left; width: auto; }
.Input a { color: #000; cursor: pointer; }
.Input a:hover { color: #000; }
.Label { color: #000; display: block; float: left; width: 275px; }
.Label-Sm, .Label-Md { color: #000; display: block; float: left; width: 125px; }
.Label-Md { width: 200px; }
.ImgSm { border: 1px #ccc solid; height: 30px; width: 30px; }
.NoBdr { border: none !important; }

.M0 { margin: 0 !important; }
.MB0 { margin-bottom: 0 !important; }
.ML0 { margin-left: 0 !important; }
.MR0 { margin-right: 0 !important; }
.MT0 { margin-top: 0 !important; }

.M5 { margin: 5px !important; }
.MB5 { margin-bottom: 5px !important; }
.ML5 { margin-left: 5px !important; }
.MR5 { margin-right: 5px !important; } 
.MT5 { margin-top: 5px !important; }

.M10 { margin: 10px !important; }
.MB10 { margin-bottom: 10px !important; }
.ML10 { margin-left: 10px !important; }
.MR10 { margin-right: 10px !important; }
.MT10 { margin-top: 10px !important; }

.M15 { margin: 15px !important; }
.MB15 { margin-bottom: 15px !important; }
.ML15 { margin-left: 15px !important; }
.MR15 { margin-right: 15px !important; }
.MT15 { margin-top: 15px !important; }

.M20 { margin: 20px !important; }
.MB20 { margin-bottom: 20px !important; }
.ML20 { margin-left: 20px !important; }
.MR20 { margin-right: 20px !important; }
.MT20 { margin-top: 20px !important; }

.M25 { margin: 25px !important; }
.MB25 { margin-bottom: 25px !important; }
.ML25 { margin-left: 25px !important; }
.MR25 { margin-right: 25px !important; }
.MT25 { margin-top: 25px !important; }

.P0 { padding: 0 !important; }
.PB0 { padding-bottom: 0 !important; }
.PL0 { padding-left: 0 !important; }
.PR0 { padding-right: 0 !important; }
.PT0 { padding-top: 0 !important; }

.P5 { padding: 5px !important; }
.PB5 { padding-bottom: 5px !important; }
.PL5 { padding-left: 5px !important; }
.PR5 { padding-right: 5px !important; } 
.PT5 { padding-top: 5px !important; }

.P10 { padding: 10px !important; }
.PB10 { padding-bottom: 10px !important; }
.PL10 { padding-left: 10px !important; }
.PR10 { padding-right: 10px !important; }
.PT10 { padding-top: 10px !important; }

.P15 { padding: 15px !important; }
.PB15 { padding-bottom: 15px !important; }
.PL15 { padding-left: 15px !important; }
.PR15 { padding-right: 15px !important; }
.PT15 { padding-top: 15px !important; }

.P20 { padding: 20px !important; }
.PB20 { padding-bottom: 20px !important; }
.PL20 { padding-left: 20px !important; }
.PR20 { padding-right: 20px !important; }
.PT20 { padding-top: 20px !important; }

.P25 { padding: 25px !important; }
.PB25 { padding-bottom: 25px !important; }
.PL25 { padding-left: 25px !important; }
.PR25 { padding-right: 25px !important; }
.PT25 { padding-top: 25px !important; }

.Wrap { white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */ white-space: -webkit-pre-wrap; /*Chrome & Safari */  white-space: -pre-wrap;      /* Opera 4-6 */ white-space: -o-pre-wrap;    /* Opera 7 */ white-space: pre-wrap;       /* css-3 */ word-wrap: break-word;       /* Internet Explorer 5.5+ */ word-break: break-all; white-space: normal; }
.TextAlt, .TextAlt a { color: #666; }
.TextAlt a:hover { background-color: transparent; text-decoration: none; }
.FormError, .FormErrorRb { border: 2px solid #990000 !important; }
.FormErrorRb { border-radius: 4px; padding: 5px 0 0 3px; }
.W100 { width: 100px; }
.W100P { width: 100%; }
.W125 { width: 125px; }
.W150 { width: 150px; }
.Gry { color: #999; }

/*************************************************/
/* FontAwesome Tweaks ****************************/
.fa-caret-up, .fa-caret-down, .fa-caret-right, .fa-caret-left { margin-right: 5px; }

/*************************************************/
/* Clear Fixes [ SHOULD BE LAST ] ****************/
.Cf:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.Cf { zoom: 1; }

.profileGrid {
    display: grid;
    grid-template-columns: minmax(min-content, max-content) auto;
    padding: 0px 25px 25px 25px;
}
.profileGrid-Feed {
    display: flex;
    padding: 0px 20px 20px 20px;
    justify-content: space-between;
    gap: 20px;
}
.TwoColGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}
@media only screen and (max-width: 1400px) {
    .TwoColGrid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
    }
}
.profileSection {
    display: flex;
    flex: 1;
    flex-direction: column;
    background-color: #F5F5F5;
    border: 1px solid #ccc;
    margin: 6px;
    min-height: 76vh;
    border-radius: 5px;
    width:310px;
    min-width: fit-content;
    padding: 0 35px 35px 35px;
}
.profileSection > * {
    align-self: center;
}
.profileSection-Feed {
    display: flex;
    flex-direction: column;
    background-color: #F5F5F5;
    border: 1px solid #ccc;
    min-height: 73vh;
    border-radius: 5px;
    width: 35%;
    padding: 0px 30px 30px 30px;
    box-sizing: border-box;
}
    .profileSection-Feed > * {
        align-self: center;
    }
.profileSectionContactInfo-Feed {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 20px 12px;
    line-height: 21px;
    margin-top: 20px;
    width: 530px;
}
.profileSectionContactInfoGrid-Feed {
    display: grid;
    grid-template-columns: 40px 220px;
}

.profileSectionContactTelephoneList-Feed {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 10px;
}
    .profileSectionContactInfoGrid-Feed > div:nth-child(-n+2) {
        margin-bottom: 20px;
    }
    .profileSectionContactInfoGrid-Feed > div {
        margin-bottom: 20px;
    }

.profileSection-Demographics {
    display: flex;
    flex-direction: column;
    background-color: #F5F5F5;
    border: 1px solid #ccc;
    border-radius: 5px;
    min-height: 73vh;
    width: 25%;
    padding: 0px 30px 30px 30px;
    box-sizing: border-box;
}

.profileSectionContactInfoGridBirthday-Feed {
    display: grid;
    grid-template-columns: 40px auto;
    margin-top: 12px;
}

.profileSectionContactInfo {
    display: grid;
    grid-template-columns: auto auto;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 12px;
    font-size: 18px;
    line-height: 21px;
    margin-top: 30px;
    padding-top: 30px;
}
    .profileSectionContactInfo > div:nth-child(-n+2) {
        margin-bottom: 24px;
    }

    .profileSectionContactInfo > div {
        margin-bottom: 24px;
    }
.profileSectionContactInfoGridEmail-Feed {
    display: grid;
    grid-template-columns: 40px auto;
    margin-top: 12px;
}
.profileSectionContactInfoEmail {
    display: flex;
    align-items: center;
}
    .profileSectionContactInfoEmail .fa-badge-check {
        margin-left: 5px;
        margin-right: -7px;
    }

    .profileSectionContactInfoEmail .fa-pencil {
        font-size: 16px;
        padding-left: 15px !important; 
        padding-right: 5px;
    }
span#memberEmail {
    line-height: 16px;
    overflow: hidden;
    white-space: nowrap;
    max-width: 475px;
    text-overflow: ellipsis;
    display: inline-block;
}
.hasI {
    justify-self: center;
    margin-right: 11px;
}
.profilePictureFrame {
    background: white;
    padding: 8px;
    margin-top: 50px;
    border-radius: 2px;
} 
 .profilePictureFrame img {
   width:100px;
   height:100px;
}
.profilePictureFrame-Feed {
    background: white;
    padding: 8px;
    margin-top: 20px;
    border-radius: 2px;
}

    .profilePictureFrame-Feed img {
        width: 100px;
        height: 100px;
    }
#divDetails .fa-pencil {
    color: lightgray;
    padding-left: 10px;
    padding-right: 5px;
}

#divAddresses .fa-pencil {
    color: lightgray;
    padding-left: 10px;
    padding-right: 5px;
}

.h-list {
    padding-left: unset;
    margin: 10px 25px;
}
.h-list > li {
    padding-bottom: 5px;
}
#addAddress {
    color: initial;
    float: right;
    font-weight: initial;
}
#addAddress:hover{
    cursor:pointer;
    text-decoration:underline;
}

#addMember {
    color: initial;
    float: right;
    font-weight: initial;
}

    #addMember:hover {
        cursor: pointer;
        text-decoration: underline;
    }

#addAlternateContact {
    color: initial;
    float: right;
    font-weight: initial;
}

    #addAlternateContact:hover {
        cursor: pointer;
        text-decoration: underline;
    }

.createContactLink {
    color: initial;
    float: right;
    font-weight: initial;
}

    .createContactLink:hover {
        cursor: pointer;
        text-decoration: underline;
    }

#addressesListShort, #addressesListFull {
    display: grid;
    grid-template-columns: auto auto auto;
    padding: 12px;
    font-size: 14px;
    line-height: 21px;
}
    #addressesListShort > div, #addressesListFull > div {
        margin-bottom: 15px;
        border-bottom: 1px solid #ccc;
        padding: 0 5px 6px 5px;
    }
#addressList-Feed {
    padding: 16px 0px;
}
.profileAddressList {
    width: 512px;
    padding: 12px 21px 0px 21px;
}
.profileMemberSearchList {
    width: 100%;
}
#memberList-Search {
    padding: 16px 0px;
}
.addressesItemName {
    display: grid;
    grid-template-columns: auto 85px;
    font-size: 14px;
    line-height: 21px;
    margin-top: 8px;
}

.memberItemName {
    display: grid;
    grid-template-columns: auto 85px;
    font-size: 14px;
    line-height: 21px;
    margin-top: 8px;
}

.alternateContactItemName {
    display: grid;
    grid-template-columns: auto 85px;
    font-size: 14px;
    line-height: 21px;
    margin-top: 8px;
}

#externalActivitiesListFull {
    display: grid;
    grid-template-columns: 20% 59% 15% 2% 2% 2%;
    padding: 12px;
    font-size: 14px;
    line-height: 21px;
}

#externalActivitiesListFull > div {
    margin-bottom: 15px;
    border-bottom: 1px solid #ccc;
    padding: 0 5px 6px 5px;
}

.tooltip:hover .tooltiptext, .tooltip:hover .tooltiptext-left, .tooltip:hover .tooltiptext-top {
    visibility: visible;
    opacity: 1;
}

.tooltip {
    position: relative;
    display: inline-block;
/*    border-bottom: 1px dotted black;*/
}

.tooltiptext {
    visibility: hidden;
    min-width: max-content;
    background-color: #ccc;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    top: -5px;
    right: 105%;
    opacity: 0;
    transition: opacity 1s;
    font-family: Roboto, sans-serif;
}

.tooltiptext-left {
    visibility: hidden;
    min-width: max-content;
    background-color: #ccc;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    top: -5px;
    left: 105%;
    opacity: 0;
    transition: opacity 1s;
    font-family: Roboto, sans-serif;
}

.tooltiptext-top {
    visibility: hidden;
    min-width: max-content;
    background-color: #ccc;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 105%;
    opacity: 0;
    transition: opacity 1s;
    font-family: Roboto, sans-serif;
}

.tooltiptext > span , .tooltiptext-left > span , .tooltiptext-top > span {
    padding: 0 10px;
    text-align: center;
}

.moreBtn {
    position: relative;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    padding: 7px 40px;
}
.panelButton {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    padding: 7px 40px;
    font-family: Roboto, sans-serif;
}
.srDesc {
    width: 100%;
}
.srItemToolTip {
    padding: 13px;
    margin: 13px;
    display: flex;
    justify-content: space-between;
    align-content: center;
    background-color: #FAFAFA;
    border: 1px solid #C4C4C4;
    border-radius: 5px;
    cursor: pointer;
}

    .srItemToolTip * {
        align-self: center;
    }
    .srItemToolTip img {
        width: 50px;
        height: 50px;
    }
.srItem img {
    width:50px;
    height:50px;
}
.msgTable {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 45px;
}
.msgTable-Feed {
    border-collapse: separate;
    border-spacing: 0;
    width: 350px;
    margin-bottom: 45px;
}
#CnTFull, #srListFull {
    width: 100%;
}

#msgPanel button {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    padding: 7px 40px;
}
.msgTable tr:hover {
    background: #ccc;
    cursor: pointer;
}
#CnTshort tr:hover, #CnTFull tr:hover {
    cursor: default;
    background: whitesmoke;
}
.msgTable td {
    border-bottom: solid 1px #CCCCCC;
    padding: 6px 15px;
}
#CnTFull td, #srListFull td {
    padding: 6px 20px;
}

.modalBackdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) repeat scroll 0% 0%, transparent none repeat scroll 0% 0%;
}
.middleModal {
    display: flex;
    justify-content: center;
    align-items: center;
}
#msgModal {
    background: #fff;
    position: fixed;
    z-index: 99999;
    width: 50vw;
}
#msgBody {
    padding: 5px 10px;
    margin: -1px -10px 0;
    background: #fff;
    height: 50vh;
}
.SRHover {
    position: relative;
}
.emptyAddress {
    text-align: center;
}

.SRC-invalid {
    color: #c00;
    /*font-size: 20px;*/
    background-color: #f5f5f5;
}

.SRC-valid {
    color: var(--grPrimaryBlue);
    /*font-size: 20px;*/
    background-color: #f5f5f5;
}

.SRC-optional {
    color: #999999;
    /*font-size: 20px;*/
    background-color: #f5f5f5;
}

/*Assets*/
.leaflet-map-custom-doticon {
    background-color: #FF505F;
    border-radius: 50%;
    height: 14px !important;
    width: 14px !important;
    display: inline-block;
}

.leafletDotSelected {
    height: 22px !important;
    width: 22px !important;
    box-shadow: 0px 0px 0px 9px rgba(0,0,0,1);
    -webkit-box-shadow: 0px 0px 0px 9px rgba(0,0,0,1);
    -moz-box-shadow: 0px 0px 0px 9px rgba(0,0,0,1);
}

#asset-emptyPanel {
    width: 300px;
    cursor: pointer;
    padding: 8px 10px 7px;
    border-radius: 4px;
    border: 1px solid #ccc;
    background-color: white;
    font-weight: 400;
    z-index: 401;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#asset-zoomedOutPanel {
    width: 300px;
    cursor: pointer;
    padding: 8px 10px 7px;
    border-radius: 4px;
    border: 1px solid #ccc;
    background-color: white;
    font-weight: 400;
    z-index: 401;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#asset-controlContainer {
    display: flex;
    flex-direction: column;
    width: 300px;
    z-index: 999;
    position: absolute;
    top: 5px;
    margin-top: 0;
    left: calc(50% - 150px);
    color: black;
}

#AssetMapRedoSearch {
    display: flex;
    align-items: center;
    position: relative;
    margin: auto;
    width: 200px;
    cursor: pointer;
    padding: 8px 10px 7px;
    color: white;
    border-radius: 20px;
    background-color: #1493e7;
    z-index: 401;
    margin-top: 6px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#AssetMapRedoSearch span {
    width: 100%;
    text-align: center;
    display: block;
}

.assetCardItem {
    display: grid;
    grid-template-columns: 60% 40%;
    align-content: center;
    height: 35px;
    border: 2px solid lightgrey;
    border-radius: 5px;
    margin: 8px;
    margin-left: 0;
    padding: 12px 15px;
    color: black;
    white-space: nowrap;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently*/
}

.assetCardItemLabels {
    word-break: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
}

.asset-button {
    display: flex;
    justify-content: center;
    align-items: center;
    justify-self: center;
    width: 50px;
    cursor: pointer;
    color: #fff;
    background-color: #757575;
    margin: 0;
    padding: 5px;
    border-radius: 4px;
}

#assetTitle {
    font-weight: bold;
}

#assetCardContainer {
    height: 335px;
    width: 0;
    cursor: pointer;
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

    #assetCardContainer::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

#crMap {
    width: 100%;
}

#mapGrid {
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
/*Activity Feed*/
.ActivityFeedPanel {
    min-height: 73vh;
    background-color: #F5F5F5 !important;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 30px;
    width: 40%;
    box-sizing: border-box;
}

.ActivityFeedPanel-PageControls {
    position: absolute;
    bottom: 30px;
    left: 30px;
}
.ActivityFeedPanel-PageNumbers {
    display: inline-block;
}
.ActivityFeedPanel-PageNumber {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 0 2px;
    border: 1px solid #DDD;
    border-radius: 2px;
    font-size: 1rem;
    line-height: 25px;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}
.ActivityFeedPanel-PageNumber:hover {
   background: lightgray;
}
.ActivityFeedPanel-PageActive {
    background: var(--grPrimaryBlue);
    color: white;
}
.ActivityFeedPanel-Search {
    display: block;
    margin: auto;
    padding-bottom: 0;
}
.ActivityFeedPanel-SearchControls{
    position:relative;
    border-bottom: 1px solid #000;
}
.ActivityFeedPanel-Search p {
    font-size: 22px;
    margin-bottom: 15px;
}
#ActivityFeedPanel-SearchBoxButton {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    cursor: pointer;
}
#ActivityFeedPanel-SearchBox {
    width: 100%;
    background: transparent;
    border: none;
    box-sizing: border-box;
    border-radius: 3px;
    height: 27px;
    padding-left: 25px;
}
    #ActivityFeedPanel-SearchBox:focus {
        outline: none;
        border: none;
    }

.ActivityFeedPanel-ItemImg {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ActivityFeedPanel-ItemTitle {
    font-size: 16px;
}
    .ActivityFeedPanel-ItemTitle span {
        font-size: 14px;
    }
.ActivityFeedPanel-ItemSubtitle {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.ActivityFeedPanel-Feed {
    overflow-y: auto;
    margin: auto;
    margin-bottom: 29px;
    margin-top: 2px;
    min-height: 608px;
}

.ActivityFeedPanel-FeedItem {
    display: grid;
    grid-template-columns: 65px 75% auto auto;
    border-bottom: 1px solid #DDD;
    padding: 10px 0;
    line-height: 22px;
}
.ActivityFeedPanel-FeedItem:last-child {
    border-bottom: initial;
}
.ActivityFeedPanel-FeedItem:hover {
    background: #ccc;
    cursor: pointer;
}

/*** Related Requests ***/

.ovRelatedRequestItem { display: flex; align-items: center; }

.ovRelatedRequestItem a {
    display: flex;
    flex-grow: 1;
    gap: 10px;
    padding: 10px 8px;
    border-radius: 3px;
    text-decoration: none;
}
.ovRelatedRequestItem a:hover { background-color: #ddd !important; }
.ovRelatedRequestItem a > div { flex-grow: 1; text-align: right; }
.ovRelatedRequestItem img { height: 20px; width: 20px; }

.ovRelatedRequestItem i { font-size: 16px; }
.ovRelatedRequestItem .tooltiptext { top: -267%; right: -133%; }

#divRelatedRequestResults .DataRowItem {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 10px;
}
#imgRelatedRequest { width: 20px; height: 20px; }

/***/
.reportHeader {
    display: flex;
    align-items: center;
    padding-bottom: 14px;
    margin-bottom: 21px;
    border-bottom: 2px solid black;
}

.reportCustomerImage {
    display: inline-block;
    margin-right: 30px;
}

    .reportCustomerImage img {
        height: 40px;
        width: 40px;
    }

.reportHeaderDescription {
    position: absolute;
    top: 0px;
    left: 55px;
}

.reportTableSection{
}
.reportTable {
    border-collapse: collapse;
}
    .reportTable * {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        vertical-align: baseline;
        padding: 3px 0px;
        font-size: 12px;
    }

tr.border_bottom td {
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #D8D8D8;
}
.reportHeaderTitle {
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
}

.reportHeaderDates {
    font-size: 12px;
    display: inline;
}

    .reportHeaderDates div {
        display: inline-block;
        min-width: 139px;
    }

.ContactDetailDeactivateOptions {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: initial !important;
    cursor: pointer;
}

    .ContactDetailDeactivateOptions:hover {
        text-decoration: auto !important;
    }

.memberSelectInput {
    margin-top: -1px;
    vertical-align: middle;
}

.Bg-Initial {
    background: initial !important;
}

.MergedFieldSticker {
    display: inline-flex;
    height: 14px;
    border-radius: 3px;
    padding: 5px 6px;
    padding-left: 7px;
    margin-left: 10px;
    font-size: 12px;
    color: #ffffff;
    background: var(--grPrimaryBlue);
}

.MergedEmailOverflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .MergedEmailOverflow:hover {
        word-break: break-all;
        text-overflow: clip;
        white-space: normal;
    }
.showMergedEmails {
    margin-top: 5px;
}

/*New Side Nav */
/*Begin*/
#csSharedSideNav {
    margin: 0 12px;
}

.Floating-SubMnuContainer .SubMenu { visibility: hidden;}
.Floating-SubMnuContainer:hover .SubMenu { visibility: visible;}
.csSharedSideNav-subMenu { display: flex; flex-direction: column; width: 100px; position: absolute; z-index: 1000; right: 5px; top: 20px; padding: 15px 10px 5px 10px; margin-right: -10px; }
.csSharedSideNav-subMenu label { background-color: #EEE; text-align: left; padding-left: 10px; }
.csSharedSideNav-subMenu label:hover { background-color: #CCC;}
.Floating-SubMnuContainer .csSharedSideNav-subMenu { visibility: hidden;}
.Floating-SubMnuContainer:hover .csSharedSideNav-subMenu { visibility: visible;}

.csSharedSideNav-title {
    font-size: 22px;
    margin: 12px 12px 5px 12px;
    line-height: 30px;
}

.csSharedSideNav-content {
    margin: 0 12px;
}

.csSharedSideNav-menuLabelHeader {
	height: 20px;
	cursor: auto;
	display: inline-block;
	margin-top: 15px;
}

.csSharedSideNav-menuLabel {
    height: 36px;
    line-height: 36px;
    border-radius: 50px;
    border: 2px solid white;
    padding: 0 20px;
    cursor: auto;
}

/*csSharedSideNav-content-menuItem-flex*/
.csSharedSideNav-menuItem {
    position:relative;
    display: grid;
    grid-template-columns: auto 30px;
    align-items: center;
    height: 36px;
    line-height: 36px;
    border-radius: 50px;
    border: 2px solid white;
}

    .csSharedSideNav-menuItem:hover {
        border: 2px solid rgba(228, 230, 232, 1);
    }

    .csSharedSideNav-menuItem a {
        display: block;
        text-decoration: none;
        padding: 0 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.csSharedSideNav-menuItem-ellipsis {
    display: flex !important;
    justify-content: center;
    align-items: center;
    color: var(--grPrimaryBlue);
    border-radius: 100%;
    width: 24px;
    height: 24px;
    margin-right: 6px;
    padding: 0 !important;
}

.csSharedSideNav-ellipsis-menuContainer {
    cursor: pointer;
}

    .csSharedSideNav-ellipsis-menuContainer:hover .csSharedSideNav-menuItem-ellipsis {
        background: var(--grPrimaryBlue);
        color: white;
    }

.csSharedSideNav-ellipsis-clicked {
    cursor: pointer;
    background: var(--grPrimaryBlue) !important;
    color: white !important;
}

.csSharedSideNav-selected {
    display: block;
    cursor: pointer;
}

.csSharedSideNav-selected-border {
    border: 2px solid var(--grPrimaryBlue) !important;
}

.srIndex-navigator-container {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    width: 300px;
    margin: 0px;
    padding: 10px 0;
    gap: 9px;
    border-bottom: 1px solid #ccc;
}

.srIndex-navigators {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 38px;
    height: 38px;
    cursor: pointer;
    background: #F7F8F9;
    color: var(--grPrimaryBlue);
    font-size: 16px;
    border-radius: 100%;
    text-decoration: none;
}

.srIndex-navigators-selected {
    background: var(--grPrimaryBlue);
    color: #fff;
}
/*END*/

.slideInCards {
    animation: .5s slideInCards forwards;
    margin-right: 4px;
}
.slideInMap {
    animation: .5s slideInMap forwards;
}
.slideOutCards {
    animation: .5s slideOutCards forwards;
}
.slideOutMap {
    animation: .5s slideOutMap forwards;
}
@keyframes slideInCards {
    0% {
        width: 0
    }

    100% {
        width: 25%
    }
}

@keyframes slideInMap {
    0% {
        width: calc(100% - 4px)
    }

    100% {
        width: calc(75% - 4px)
    }
}

@keyframes slideOutCards {
    0% {
        width: 25%
    }

    100% {
        width: 0
    }
}

@keyframes slideOutMap {
    0% {
        width: calc(75% - 4px)
    }

    100% {
        width: 100%
    }
}

.moreOptionsMAUI {
    width: 100px;
    height: fit-content;
    position: absolute;
    background-color: #EFEFEF;
    text-align: left;
    border-radius: 2px;
    padding: 7px 12px;
    z-index: 1;
    display: none;
    right: 3%;
    margin-top: 20px;
    box-shadow: 0px 3px 4px 0px #0000000D;
    border: 1px solid #DEDEDB
}


.kendo-style-wrapper {
    position: relative;
    border : 2px solid #b2b2b2;
    padding: 2px;
    border-radius: 4px;
    background-color: #fff;
    font-size: 14px;
}

.kendo-textbox{
    border: none;
    outline: none;
    width: calc(100% - 22px);
    margin: 0;
    padding: 4px;
    font-size: inherit;
}

.kendo-clear-button{
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
    border: none;
    background-color: transparent;
    cursor: pointer;
}

.kendo-clear-button:hover{
    color:#000;
}

.input-group {
    display: flex;
    align-items: center; 
    gap: 10px; 
}

.input-with-footnote {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.icon-preview-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 14px;
}
.Footnote .footnote-link {
    margin-left: 3px; 
}
.input-with-validation {
    display: flex;
    align-items: center;
}

#validationIcon {
    margin-left: 10px;
    font-size: 16px;
    font-weight: bold;
}
.MAUI-button:disabled {
    background-color: #ccc;
    color: #666;
    cursor: not-allowed;
    border: 1px solid #aaa;
}
.custom-checkbox {
    appearance: none;
    -webkit-appearance: none;
    display: block;
    height: 14px;
    width: 14px;
    position: relative;
    background: #fff;
    border: 3px solid black;
    border-radius: 10%;
    cursor: pointer; 
    margin-left: 8px;
    margin-bottom: 4px;
}

.custom-checkbox:checked {
    background-color: var(--grPrimaryBlue);
    border-color: var(--grPrimaryBlue); 
}

.custom-checkbox:checked::before {
    content: '';
    position: absolute;
    left: 4px;
    width: 5px;
    height: 10px;
    border-style: solid;
    border-color: #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.custom-checkbox:focus {
    outline: none;
}

.textWrapper {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    font-size: 18px;
    line-height: 1.2em;
    /*font-family: Arial,Helvetica,sans-serif;*/
    color: #000;
    background-color: #c8c8c8;
}

.dropZoneElement {
    position: relative;
    display: inline-block;
    background-color: #c8c8c8;
    border: 1px solid #000;
    height: 485px;
    text-align: center;
    width: calc(100% - 2px);
}

.k-widget.k-upload {
    display: none;
}

#divImportComplete {
    height: 600px;
    /*position: relative;*/
}

#divColumnMapping, #divChannelsPanel {
    height: 500px;
    margin: 0px 80px;
}

#divTable {
    height: 430px;
    overflow-x: auto;
    display: flex;
}

#divChannels {
    height: 310px;
    overflow-y: auto;
}

.importResults {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

#divLoading {
    height: 600px;
    position: relative;
}

#divContactLoading {
    height: 40px;
    position: relative;
}

.tblMapping {
    border-spacing: 0px;
    margin-left: 0px;
    margin-right: 20px;
    max-width: 228px;
    display: inline-block;
}

    .tblMapping td {
        padding: 5px;
        min-width: 228px;
        max-width: 228px;
        width: 228px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis !important;
        border: 1px solid #000000;
    }

    .tblMapping thead td {
        text-align: center;
        font-weight: bold;
        vertical-align: middle;
        height: 60px;
    }

    .tblMapping tbody td {
        margin-top: -20px;
        border-top: none;
        height: 40px;
    }

.dataCell {
    padding: 5px !important;
    border-top: none !important;
    text-align: left !important;
    font-weight: normal !important;
    vertical-align: top !important;
    height: auto !important;
}

.channelCell {
    text-align: left;
    /*width: 50%;*/
    margin: auto;
}

.resultsList {
    list-style-type: none;
    font-size: large;
}

    .resultsList > li {
        padding-bottom: 10px;
    }

.import-contact-footnotes {
    display: flex;
    justify-content: flex-start;
    color: gray;
    font-size: small;
}
.fa-pencil {
    cursor: pointer;
    font-size: 16px;
}

.defaultPhone {
    font-size: 5px;
    position: absolute;
    margin-left: -12px;
    margin-top: 8px;
}

.defaultAddress {
    font-size: 5px;
    position: absolute;
    margin-left: -12px;
    margin-top: 8px;
}

input:invalid {
    box-shadow: none;
}

.hasI {
    font-size: 16px;
}

.Submitted, .Received, .Draft, .SUBMITTED, .RECEIVED, .DRAFT {
    background-color: #C2E8F8 !important;
    color: #000 !important;
    padding: 0px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 100px !important;
}

.InProcess, .OnHold, .ReferredToDept, .Published, .INPROCESS, .ONHOLD, .REFERREDTODEPT, .PUBLISHED {
    background-color: #FEE7AA !important;
    color: #000 !important;
    padding: 1px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 100px !important;
}

.Closed, .Cancelled, .NotAnIssue, .CouldNotVerify, .Duplicate, .Archived, .CLOSED, .CANCELLED, .NOTANISSUE, .COULDNOTVERIFY, .DUPLICATE, .ARCHIVED {
    background-color: #E0E0E0 !important;
    color: #000 !important;
    padding: 1px 10px !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 100px !important;
}

.label {
    display: inline-block;
    width: 150px;
    color: black;
    margin-bottom: 10px;
}

.input-field {
    margin-left: 10px;
    width: 70%;
}

.input-field-short {
    margin-left: 3px;
    width: 50%;
}

.TextRed {
    color: #CC0000;
}

.input-container input {
    margin-right: 10px;
}

.title-left {
    align-self: flex-start;
    text-align: left;
    font-size: 22px;
    margin-bottom: 15px;
    margin-top: 33px;
}

.input-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
}

.label-left {
    margin-right: 10px;
    width: 100px;
    text-align: left !important;
}

.input-field2 {
    width: 250px;
    margin-left: auto;
}

.listMemberFullName {
    font-size: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.listMemberEmail {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 36px;
}

.selectable {
    cursor: pointer;
}

.selected {
    background-color: #f0f0f0;
}

.scrollable {
    width: 700px;
    height: 450px;
    overflow: auto;
}

.profileContent {
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 1700px) {
    .profileContent {
        width: 1700px;
    }
}

@media screen and (max-height: 750px) {
    .profileContent {
        height: 750px;
    }
}

/*************************************************/
/* ACCESSIBILITY - Toggle Switches ***************/
/* Accessible read-only toggle switch for Console */
.cs-toggle-readonly {
    display: inline-block;
    cursor: default;
    outline: none;
}

/* Only show focus indicator for keyboard navigation, not mouse clicks */
.cs-toggle-readonly:focus-visible {
    outline: 2px solid #0058AA;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Fallback for older browsers that don't support :focus-visible */
.cs-toggle-readonly:focus:not(:focus-visible) {
    outline: none;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .cs-toggle-readonly:focus-visible {
        outline: 3px solid;
        outline-offset: 3px;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .cs-toggle-readonly {
        transition: none;
    }
}

/*************************************************/
/* METRICS - Statistics Kendo grid **************/
/* Header row remains in DOM for screen readers; visually matches legacy layout (no column titles). */
#kendoGrid-Stats.k-grid .k-grid-header {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
/*************************************************/
/* ACCESSIBILITY - Toggle Switches ***************/
/* Accessible read-only toggle switch for Console */
.cs-toggle-readonly {
    display: inline-block;
    cursor: default;
    outline: none;
}

    .cs-toggle-readonly:focus {
        outline: 2px solid #0058AA;
        outline-offset: 2px;
        border-radius: 2px;
    }

/* High contrast mode support */
@media (prefers-contrast: high) {
    .cs-toggle-readonly:focus {
        outline: 3px solid;
        outline-offset: 3px;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .cs-toggle-readonly {
        transition: none;
    }
}