﻿/* RESET CSS */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1.25}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

/* MAIN SITE CSS */
html { overflow-y: scroll; }
html, body { margin: 0; padding: 0; height: 100%; }
body { background: #fff url(Images/application_bg.jpg) repeat-x; font-size: 12px; font-family: "lucida grande", "Segoe UI", arial, verdana, "lucida sans unicode", tahoma, sans-serif; color: #333333; }

table { border-collapse: collapse; }
table tr, table td { vertical-align:middle; }

img { border: 0; }
img.disabled { opacity: 0.5; }

button { padding: 5px; }
button.nostyle {
    display: inline;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    vertical-align: top;
}

p { margin: 20px 0px; }
form { margin: 0; padding: 0; border: none; }
b, strong, .bold { font-weight: bold; }

ul { list-style-type: disc; display: block; padding: 0 0 0 40px; }

blockquote { margin-left: 25px; float: left; padding: 10px; border: 1px solid #ccc; background: #fff; }

a { text-decoration: none; color: #333333; outline: none; }
a:visited { text-decoration: none; color: #333333; }
a:hover { text-decoration: underline; color: #000000; }
a:focus { -moz-outline-style: none; }
a.selected { background: #fff; font-weight: bold; border: 1px solid #ccc; padding: 2px; }

.tip { margin: 10px 10px 25px 10px; text-align: center; font-weight: bold; }

.tooltip { position: relative; cursor: help; }
.tooltip .extra { 
    display: none;
    z-index: 10; position: absolute; left: 100%; top: 50%; padding: 14px 20px; margin-top: -41px; margin-left: 7px;
    color:#111; border:1px solid #DCA; background:#fffAF0;
    white-space: nowrap;
    border-radius:4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;
}

.tooltip .callout {
    z-index:20; position:absolute; top:30px; left:-12px; width: 12px; height: 22px; display:block;
    border:0; background: url(Images/tooltip_callout.gif) no-repeat center center;
}

.tooltip:hover .extra{
    display:block;
}
   
fieldset { padding: 10px; margin: 10px 0; border: 1px solid #ccc; }

h2 { line-height: normal; font-weight: bold; text-transform: lowercase; text-align: center; font-size: 32px; font-family: "lucida grande", "Segoe UI", arial, verdana, "lucida sans unicode", tahoma, sans-serif; margin: 0 0 25px 0; padding: 0px; }
h2 span { font-weight: normal; padding: 0px 2px; }

h3 { margin: 10px 0px; font-weight: bold; display: block; }

h4 { font-weight: normal; text-transform: lowercase; font-size: 20px; font-family: "lucida grande", "Segoe UI", arial, verdana, "lucida sans unicode"; text-align: center; margin: 0 0 15px 0; padding: 0px; }
h4 span { font-weight: bold; padding: 0px 2px; }

hr { border: none; color: #ccc; background-color: #ccc; height: 1px; margin: 0 0 20px 0; padding: 0; }
.ui-accordion hr { margin: 10px 0px; }

small { color: #777; font-size: 11px; }

.ui-button.block { display: block; box-sizing: border-box; width: 100%; padding: 15px; }

.tags span { display: block; margin: 5px 10px 5px 0; padding:3px; background: #ddd; border: 1px solid #ccc; float: left; cursor: default; }

#pageWrapper { min-width: 1000px; }
#pageHeader {
    position: relative;
    height: 41px;
    background: url(Images/shiptrack_logo_small_greenbg.gif) left center no-repeat;
    padding-right: 5px;
    overflow: visible;
    z-index: 500;
}
#userActionPanel { width: 250px; float: right; line-height: 20px; text-align: right; }
#pageHeader .notification { position: absolute; width: 600px; height: 30px; margin-left: -300px; margin-top: -15px;  top: 50%; left: 50%; text-align: center; font-weight: bold; font-size: 20px; text-transform: uppercase; }

#passportWrapper { height: 20px; position: relative; overflow: visible; cursor: pointer; z-index: 500; }
#passportWrapper ul { background: #fff; border: 1px solid #aaa; border-top: none; position: absolute; top: 20px; right: -1px; width: 248px; display: none; list-style-position: inside; list-style-type: none; margin: 0px; padding: 0px; z-index: 500; }
#passportWrapper:hover { background: #efefef; border-right: 1px solid #aaa; border-left: 1px solid #aaa; }
#passportWrapper:hover ul { display: block; }
#passportWrapper li a { display: block; padding: 15px; text-align: center; text-decoration: none; }
#passportWrapper li a:hover { background-color: #fff; border-left: 5px solid #87AEC5; }
#passportWrapper li.title { background-color: #87AEC5; border: 1px solid #779EB5; padding: 10px; text-align: left;  }
#passportWrapper li.command { background-color: #eee; }
#passportWrapper li.command a { padding: 20px; }
#passportWrapper li.command a:hover { background-color: #eaeaea; border: none; }

#appNavigation { height: 59px; margin: 3px 10px 0px 10px; overflow: hidden; }
#appNavigation table { border-left: 1px solid #ccc; }
#appNavigation td { border: none; padding: 5px; margin: 0px; font-size: 10px; width: 200px; border-right: 1px solid #ccc; }
#appNavigation td .header { text-transform: lowercase; font-weight: bold; font-size: 15px; margin: 0px; text-align: left; display: block; font-family: verdana, Arial, Helvetica; padding: 0px; }
#appNavigation td .header2 { font-weight: normal; }
#appNavigation td:hover { background-color: #efefef; }
#appNavigation td a { display: block; }
#appNavigation td a:hover { text-decoration:none; }
#appNavigation td.current { border-top: 4px solid #87AEC5; }

#moduleContainer { padding: 0 25px 25px 25px; }
#moduleNavigation { height: 35px; z-index: 400; position: relative; }
#moduleNavigation ul.mainnav { list-style-type: none; margin: 0; padding: 0; font-weight: bold; height: 35px; position: relative; }
#moduleNavigation ul.mainnav>li { display: block; float: left; position: relative; margin: 0 3px 0 3px; border: 1px solid #676767; border-top: none; padding: 10px; background: #d9d9d9 url(Images/modlink_shadow.gif) repeat-x top; height: 15px; }
#moduleNavigation ul.mainnav>li.current, #moduleNavigation ul.mainnav>li:hover { background: #d9d9d9; }

#moduleNavigation ul.subnav { list-style-type: none; display: none; border: 1px solid #ccc; margin: 0; padding: 0; font-weight: bold; position: absolute; top: 36px; left: -1px; z-index: 400; background: #fff;  }
#moduleNavigation ul.subnav>li { white-space: nowrap; padding: 15px; z-index: 400; position: relative; }
#moduleNavigation ul.subnav>li.current { background: #f9f9f9; border-left: 4px solid #779EB5; padding-left: 11px; }

#moduleNavigation ul.mainnav>li:hover ul.subnav { display: block; }

#moduleContent { margin: 25px 0; }

.panel { padding: 10px; border: 1px solid #ccc; background-color: #efefef; position: relative; z-index: 1; }
.full { min-width: 100px; }
.medium { width: 1000px; margin: 0 auto; }
.regular { width: 750px; margin: 0 auto; }
.small { width: 500px; margin: 0 auto; }
.tiny { width: 350px; margin: 0 auto; }
.tiny select { width: 325px; }

.panel .tabControls { position: absolute; right:0px; top: -1px; list-style-type: none; padding: 0px; margin: 0px; }
.panel .tabControls li { float: left; margin: 0px 10px 0px 0px; border: 1px solid #ccc; background: #fff; padding: 10px 10px; }
.panel .tabControls li .sprite { margin: 0px; }

.template { display: none; width: 0; height: 0; }
.header { padding: 10px 0; font-weight: bold; text-align: center; }

.imageBox { background: #fff; padding: 5px; margin: 5px; border: 1px solid #ccc; float: left; }
.imageBox img { border: none; margin: 0; }

.infoPanel { background: #fff url(Images/info_icon_64.png) no-repeat 5px center; padding: 10px 10px 10px 80px; border: 1px solid #ccc; min-height: 54px; margin-bottom: 25px; }
.infoPanel h2 { color: #555; font-size: 32px; text-align: left; margin: 0 0 5px 0; }

.feature { display: block; border: 1px solid #ccc; padding: 10px; height: 75px; margin: 10px 0 0 0; background: #fff; }
.feature:hover { text-decoration: none; background-color: #c6f796; }
.feature h2 { font-size: 24px; text-align: left; margin: 0 0 5px 0; }
.feature img { margin-right: 15px; width: 64px; height: 64px; }

div.error, span.error, li.error, small.error { color: #ff0000; }

.notice { margin: 10px 0 }
.notice.success { text-align: center; border: 1px solid #ccc; background-color: #efe; padding: 10px; }
.notice.warning { background: #ff5; text-align: center; border: 1px solid #ccc; padding: 10px; }
.notice.info { background: #efefef; text-align: center; border: 1px solid #ccc; padding: 10px; }

.noResults { margin: 0px auto; border: 1px solid #cc9; padding: 10px; width: 530px; background: #fff; text-align: center; font-weight: bold; font-size: 14px; }

.ajaxLoader { width: 220px; height: 19px; margin: 25px auto; background: url(Images/ajax_loader.gif) no-repeat center center; }
.ajaxLoader.inline {
    margin: 0;
    display: inline-block;
}

.ajaxLoaderSmall { width: 16px; height: 16px; margin: 10px auto; background: url(Images/ajax_loader_small.gif) no-repeat center center; }
.pageNumberWrapper { text-align: center; word-spacing: 5px; padding: 20px; }
.pageNumberWrapper img { margin-left: -5px; }

#listControlWrapper 
{ 
    background: #e5e5e5 url(Images/datagrid_header_bg.gif) repeat-x top left;
    border: 1px solid #ccc; 
    margin: 0px 0px 10px 0px;
    text-align: right;
    padding: 5px;
}
#listControlWrapper > h1 { float: left; color: #999; font-weight: bold; }

.button { margin-bottom: 10px; }
.buttonContainer { text-align: center; padding-top: 10px; }

.sortable { list-style-type: none; margin: 0; padding: 0; width: 100%; cursor: move; }
.sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 12px; height: 18px; }
.sortable li span { position: absolute; margin-left: -1.3em; }

#selectCustomerDialog select { width: 315px; margin: 0px 0px 15px 0px; }

/* Style Shortcuts */

.fl { float: left; }
.fr { float: right; }

.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }

.w50 { width: 50px; }
.w100 { width: 100px; }
.w150 { width: 150px; }
.w200 { width: 200px; }
.w250 { width: 250px; }

/* Forms */

.timeBox { width: 175px; text-align: center; }
.dateBox { width: 70px; text-align: center; }

input:focus {
    outline-width: 0;
}

select { margin: 2px 0px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; height: 25px; padding: 0px; }
input[type='number'],
input[type='text'] { font-size: 12px; height: 13px; padding: 4px; background: #fff url(Images/topfade.gif) repeat-x; border: 1px solid #b9b9b9; }
    input[type='number'].tiny,input[type='text'].tiny { width: 50px; }
    input[type='number'].xs,input[type='text'].xs { width: 75px; }
    input[type='number'].sm,input[type='text'].sm { width: 100px; }
    input[type='number'].md,input[type='text'].md { width: 200px; }
    input[type='number'].lg,input[type='text'].lg { width: 300px; }
input[type='password'] { font-size: 12px; height: 13px; padding: 4px; background: #fff url(Images/topfade.gif) repeat-x; border: 1px solid #b9b9b9; }
input[type='file'] { width:100%; border:1px solid #ccc; background:#fff; padding: 2px 0; }
textarea { font-size: 12px; padding: 5px; background: #fff url(Images/topfade.gif) repeat-x; border: 1px solid #b9b9b9; }
button.full, input.full, textarea.full {
    box-sizing: border-box;
    width: 100%;
}

input[type='text'].full,
input[type='number'].full {
    height: 28px;
}

                                                                                                                         

form .full { padding: 5px; margin: 0px; border: 1px solid #b9b9b9; background: #fff url(Images/topfade.gif) repeat-x; }
form .full input[type='text'], .full input[type='password'] { border: none; height: 20px; font-size: 14px; background-color: transparent; background-image: none; width: 100%; padding: 0px; }
form input[type='submit'].full,
form button[type='submit'].full { width: 100%; display: block; padding: 20px 0 20px 0; margin: 10px 0 0 0; font-weight: bold; }

label { font-weight: bold; padding: 0 0 5px 2px; display: block; font-size: 14px; margin-top: 10px; }

table.form th { vertical-align: top; padding: 7px 5px 0 5px; font-weight: bold; }
table.form td { vertical-align: middle; padding: 3px 0px; }
table.form input { margin: 2px; }
table.form select { margin: -2px 2px 2px 2px; }

.small table.form th { width: 125px; }
.small table.form input[type='text'], .small table.form input[type='password'], .small table.form textarea { width: 250px; }
/*.small table.form select { width: 258px; }*/

.regular table.form th { width: 125px; }
.regular table.form input[type='text'], .regular table.form input[type='password'], .regular table.form textarea, .regular table.form select { width: 500px; max-width: 100%; box-sizing: content-box; }


.tiny table.form th { width: 125px; }
.tiny table.form input[type='text'], .tiny table.form input[type='password'] { width: 150px; }

.filterContainer { margin: 15px auto 5px auto; border: 1px solid #ccc; padding: 10px; width: 530px; background: #fff; }
.filterContainer img { margin: 5px 0 0 5px; }
.filterContainer th { border-bottom: 1px solid #ccc; }
#searchQueryFilter { width: 490px; }
#SearchTerm { width: 490px; }

.searchFilter { padding: 5px 5px; margin-bottom: 10px; border: 1px solid #ccc; background: #efefef; height: 15px; }
.searchFilter span { cursor: pointer; float: left; margin-right: 10px; }

/* Sprites */

.sprite { width: 16px; height: 16px; border: none; margin-right: 4px; vertical-align: top; overflow: hidden; background-image: url(Images/sprites_16.gif); }
.spriteLoader { width: 16px; height: 16px; border: 0; margin-right: 4px; vertical-align: top; overflow: hidden; background-image: url(Images/ajax_loader_small.gif); }

.s_tools { background-position: -442px -425px; }
.s_excel { background-position: -0px -646px; }
.s_gear { background-position: -425px -425px }
.s_xbutton { background-position: -561px -272px; }
.s_manblksuit { background-position: -510px -680px; }
.s_edit { background-position: -17px -187px; }
.s_key { background-position: -272px -459px; }
.s_screenDots { background-position: -459px -527px; }
.s_xinfo { background-position: -34px -289px; }
.s_addCustomer { background-position: -408px -680px; }
.s_addUser { background-position: -238px -459px; }
.s_magnifyingSml { background-position: -476px -493px; }
.s_magnifyingMd { background-position: -595px -493px; }
.s_sortUp { background-position: -340px -255px; }
.s_sortDown { background-position: -408px -255px; }
.s_editCustomer { background-position: -391px -680px; }
.s_editKey { background-position: -221px -459px; }
.s_removeRound { background-position: -595px -510px; }
.s_removeRoundSmall { background-position: -663px -510px; }
.s_goToFirst { background-position: -527px -255px; }
.s_goToLast { background-position: -578px -255px; }
.s_addShipment { background-position: -425px -187px; }
.s_manifest { background-position: -85px -238px; }
.s_addManifest { background-position: -51px -238px; }
.s_manageManifest { background-position: -34px -238px; }
.s_printEmpty { background-position: -510px -561px; }
.s_printFull { background-position: -595px -561px; }
.s_printFormEmpty { background-position: -629px -561px; }
.s_printFormFull { background-position: -612px -561px; }
.s_sort { background-position: -272px -663px; }
.s_redx { background-position: -51px -289px; }
.s_greenCheck { background-position: -17px -680px; }
.s_returnList { background-position: -357px -510px; }
.s_returnIcon { background-position: -663px -493px; }
.s_addReturn { background-position: -0px -510px; }
.s_reconcileReturn { background-position: -34px -510px; }
.s_routeList { background-position: -221px -170px; }
.s_actionMenu { background-position: -323px -425px; }
.s_reconcile { background-position: -238px -238px; }
.s_redeliver { background-position: -357px -187px; }
.s_recollect { background-position: -374px -187px; }
.s_shipmentList { background-position: -476px -187px; }
.s_manifestList { background-position: -187px -238px; }
.s_report { background-position: -527px -119px; }
.s_packageReceived { background-position: -493px -187px; }
.s_customerDirectory { background-position: -204px -170px; }
.s_uploadCustomers { background-position: -340px -697px; }
.s_addButton { background-position: -170px -680px; }
.s_details { background-position: -0px -340px; }
.s_bookmarkSmall { background-position: -544px -170px; }
.s_controlPanel { background-position: -459px -527px; }
.s_changeCustomer { background-position: -340px -680px; }
.s_assumeIdentity { background-position: -85px -697px; }
.s_salesInformation { background-position: -170px -646px; }
.s_flagGreen { background-position: -255px -408px; }
.s_flagBlue { background-position: -221px -408px; }
.s_flagYellow { background-position: -340px -408px; }
.s_flagRed { background-position: -357px -408px; }
.s_flagGrey { background-position: -238px -408px; }
.s_imageFolder { background-position: -0px -425px; }
.s_upgradeArrow { background-position: -374px -68px; }
.s_requiredField { background-position: -340px -391px; }
.s_requiredField.valid { background-position: -629px -663px; }
.s_shipments { background-position: -527px -187px; }
.s_returns { background-position: -323px -510px; }
.s_manifests { background-position: -102px -238px; }
.s_dropDown { background-position: -629px -221px; }
.s_warningGear { background-position: -340px -425px; }
.s_filter { background-position: -51px -663px; }
.s_mapEdit { background-position: -425px -510px; }
.s_mapWarning { background-position: -391px -510px; }
.s_archive { background-position: -187px -425px; }
.s_assignUser { background-position: -340px -680px; }
.s_health { background-position: -51px -17px; }
.s_inbox { background-position: -646px -442px; }
.s_inboxFull { background-position: -527px -442px; }
.s_inboxGo { background-position: -391px -442px; }
.s_warning { background-position: -408px -391px; }
.s_error { background-position: -289px -391px; }
.s_info { background-position: -391px -391px; }
.s_followupReminder { background-position: -136px -408px; }
.s_merge { background-position: -442px -51px; }
.s_excel { background-position: -663px -306px; }
.s_lockSmall { background-position: -272px -493px; }
.s_lockLargePlus { background-position: -255px -493px; }
.s_documentCollection { background-position: -459px -340px; }
.s_star { background-position: -136px -629px; }
.s_starAdd { background-position: -34px -629px; }
.s_map { background-position: -476px -510px; }
.s_barcode { background-position: -476px -85px; }
.s_mapError { background-position: -391px -510px; }
.s_editSeries { background-position: -85px -680px; }
.s_flagReview { background-position: -493px -646px; }
.s_shipmentApproval { background-position: -493px -187px; }
.s_salesReport { background-position: -561px -221px; }
.s_assignSalesUser { background-position: -629px -629px; }
.s_removeSalesUser { background-position: -595px -629px; }
.s_manageContacts { background-position: -51px -0px; }
.s_invoice { background-position: -102px -340px; }
.s_invoiceFolder { background-position: -170px -425px; }
.s_addDocument { background-position: -17px -306px; }
.s_emailSend { background-position: -629px -493px; }

.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

.spacer { height: 5px; }

.s_toggleCheck { background-position: -170px -612px; cursor: pointer; }
.s_toggleCheck.checked { background-position: -17px -680px; }

.loading::after {
    display: block;
    background: rgba(255, 255, 255, 0.9) url(Images/ajax_loader.gif) center center no-repeat;
    content: ' ';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
}
.sprite.loading { background-position: 0px 0px; background-image: url(Images/ajax_loader_small_dark.gif); }

.ui-datepicker-trigger { background-position: -289px -204px; background-image: url(Images/sprites_16.gif); cursor: pointer; vertical-align: text-bottom; margin: 0 0 0 5px; }

.layoutGrid th { width: 130px; text-align: right; text-transform: uppercase; font-weight: bold; color: #777; padding: 5px; padding-right: 15px; margin: 0px; }
.layoutGrid td.spacer { height: 20px; }

/* DATAGRID */

.datagrid { margin: 0px; width: 100%; }
.datagrid td { padding: 5px 10px; margin: 0; border: 1px solid #CCCCCC; text-align: left; }
.datagrid tr:hover { background: #efefef; }
.datagrid tr th { border: 1px solid #CCCCCC; padding: 10px; margin: 0px; text-align: left; background: #e5e5e5 url(Images/datagrid_header_bg.gif) repeat-x top left; text-transform: none; font-weight: normal; color: #333; }
.datagrid .totalrow .empty { border: none; }
.datagrid .totalrow .total { background: #fff; }
.datagrid tfoot td { border: 1px solid #CCCCCC; background: #e5e5e5 url(Images/datagrid_header_bg.gif) repeat-x top left; }
.datagrid .nobreak { white-space: nowrap; }
.datagrid .controls { white-space: nowrap; width: 1%; }
.datagrid .hidden { display: none; }

.dropdown { display: inline-block; position: relative; }
.dropdown .menu { display: none; box-sizing: border-box; position: absolute; right: 0; top: 100%; background: #efefef; border: 1px solid #ccc; padding: 10px; margin-top: 5px; z-index: 10; }
.dropdown .menu.visible { display: block; }
.dropdown .menu::after { display: block; content: " "; position: absolute; bottom: 100%; right: 4px; border: 5px solid transparent; border-bottom-color: #ccc; }
.dropdown .menu .menu-item { display: block; white-space: nowrap; }
.dropdown .menu .menu-item + .menu-item { margin-top: 10px; }

.deven { background: #C9E1B3; }
.deven.disabled { background: #b2bca9; }
.deven.partial { background: #55C2C2; }
.deven.completed { background: #88c255; }
.deven.error { background: #c26055; color:#efefef; }
.deven.error a { color: #efefef; }
.deven.warning { background: #d3d749; }
.dodd { background: #DEF9C6; }
.dodd.disabled { background: #c5d0bb; }
.dodd.partial { background: #5FC8D4; }
.dodd.completed { background: #99d45f; }
.dodd.error { background: #d4685f; color:#efefef; }
.dodd.error a { color: #efefef; }
.dodd.warning { background: #e6ea50; }

.deven.error:hover { background: #555; }
.dodd.error:hover { background: #555; }

.swatch { position: relative; display: inline-block; width: 10px; height: 10px; padding: 0px; margin: 0px 5px 0px 0px; border: 1px solid #aaa; vertical-align: top; }
.swatch .h1 { position: absolute; height: 100%; width: 50%; left: 0px }
.swatch .h2 { position: absolute; height: 100%; width: 50%; right: 0px }

.gridColorKeyWrapper { padding: 5px 0 15px 1px; font-size: 0.8em; }
.gridColorKeyWrapper span { padding: 0px 10px; }

/* Autocomplete: */
.autocomplete-w1 { background:url(Images/shadow.png) no-repeat bottom right; position:absolute; top:0px; left:0px; margin:8px 0 0 6px; /* IE6 fix: */ _background:none; _margin:0; }
.autocomplete { border:1px solid #999; background:#FFF; cursor:default; text-align:left; max-height:350px; overflow:auto; margin:-6px 6px 6px -6px; /* IE6 specific: */ _height:350px;  _margin:0; _overflow-x:hidden; }
.autocomplete .selected { background:#F0F0F0; }
.autocomplete div { padding:2px 5px; white-space:nowrap; }
.autocomplete strong { font-weight:normal; color:#3399FF; }

/* Styles for validation helpers */
.field-validation-error { color: #ff0000; }
.field-validation-valid { display: none; }
.input-validation-error, input.input-validation-error { border: 1px solid #ff0000; background-color: #ffeeee; }
.validation-summary-errors { font-weight: bold; color: #ff0000; margin-bottom: 20px; }
.validation-summary-valid { display: none; }

/* css for timepicker */
.ui-timepicker-div { margin: 5px; padding: 5px; background: #efefef; border: 1px solid #ccc; }
.ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
.ui-timepicker-div dl{ text-align: left; }
.ui-timepicker-div dl dt{ height: 25px; }
.ui-timepicker-div dl dd{ margin: -25px 0 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui_tpicker_time { font-weight: bold; }

#remoteContentModal { padding: 0px; margin: 0px; overflow: hidden; }
.ui-dialog iframe { width: 100%; height: 100%; }

#errorConsole {
    position: absolute;
    left: 10px;
    bottom: 10px;
    right: 10px;
    z-index: 99999;
}

.steps {
    box-sizing: border-box;
    display: table;
    width: 100%;

    padding: 0;
}

.steps li {
    display: table-cell;
    padding: 25px 0;
    background: #b9b9b9;
    text-align: center;

    color: #777;

    border-top: 5px solid #efefef;
    border-bottom: 5px solid #efefef;
}

.steps li.done {
    color: white;
    background-color: green;
}

    .steps li.done::before {
        content: "✔";
        display: inline-block;
        margin-right: 5px;
    }

    .steps li.active {
        color: black;
        background-color: white;
        border: 5px solid white;
        outline: 1px solid black;
    }

.prompt-panel {
    background: #fff;
    border: 1px solid #ccc;
    padding: 10px;
}

    .prompt-panel p {
        margin: 0 0 10px 0;
    }

.quick-map-container {
    width: 100%;
    height: 70vh;
    border: 1px solid #efefef;
    canvas

{
    outline: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); /* mobile webkit */
}

}

.inline-map-container {
    width: 100%;
    height: 50vh;
    border: 1px solid #ccc;
    canvas

{
    outline: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); /* mobile webkit */
}

}

.quick-map-container {
    width: 100%;
    height: 70vh;
    border: 1px solid #efefef;
}

    .quick-map-container canvas {
        outline: none;
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
        /* mobile webkit */
    }

.inline-map-container {
    width: 100%;
    height: 50vh;
    border: 1px solid #ccc;
}

    .inline-map-container canvas {
        outline: none;
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
        /* mobile webkit */
    }

.map-tag {
    position: absolute;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-bottom: 5px solid #727cf5;
    color: #fff;
    text-align: center;
    margin-top: -5px;
}

    .map-tag div.label {
        position: absolute;
        top: 100%;
        left: -250px;
        right: -250px;
        pointer-events: none;
        margin-top: 4px;
    }

        .map-tag div.label span {
            padding: 2px 5px;
            border-radius: 3px;
            background: #727cf5;
        }

.map-pin {
    position: absolute;
    border-radius: 50%;
    background: #fff;
    width: 28px;
    height: 28px;
    font-size: 12px;
    text-align: center;
    overflow: visible;
    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
    margin-top: -26px;
    opacity: 0.5;
    white-space: nowrap;
}

    .map-pin i {
        font-size: 14px;
        line-height: 28px;
    }

    .map-pin div.compass {
        border: 5px solid transparent;
        border-bottom-color: darkslategrey;
        width: 0px;
        height: 0px;
        position: absolute;
        left: 14px;
        bottom: 28px;
        margin-left: -5px;
        margin-bottom: 2px;
        transform-origin: 5px 26px;
    }

    .map-pin div.label {
        position: absolute;
        bottom: 100%;
        left: -250px;
        right: -250px;
        margin-bottom: 8px;
        pointer-events: none;
    }

        .map-pin div.label span {
            padding: 2px 5px;
            border-radius: 3px;
        }

    .map-pin.clickable {
        cursor: pointer;
    }

    .map-pin::after {
        position: absolute;
        content: '';
        width: 0px;
        height: 0px;
        bottom: -23px;
        left: 4px;
        border: 10px solid transparent;
        border-top: 17px solid #fff;
        z-index: -1;
    }

    .map-pin.pin-primary {
        background: #727cf5;
        color: #fff;
    }

        .map-pin.pin-primary::after {
            border-top-color: #727cf5;
        }

        .map-pin.pin-primary div.label span {
            background: #727cf5;
        }

    .map-pin.pin-success {
        background: green;
        color: #fff;
    }

        .map-pin.pin-success::after {
            border-top-color: green;
        }

        .map-pin.pin-success div.label span {
            background: green;
        }

    .map-pin.pin-secondary {
        background: #ccc;
        color: #333;
    }

        .map-pin.pin-secondary::after {
            border-top-color: #ccc;
        }

        .map-pin.pin-secondary div.label span {
            background: #ccc;
        }

    .map-pin.pin-red {
        background: #ea1921;
        color: #fff;
    }

        .map-pin.pin-red::after {
            border-top-color: #ea1921;
        }

        .map-pin.pin-red div.label span {
            background: #ea1921;
        }

    .map-pin.faded {
        opacity: 0.7;
    }

    .map-pin.active {
        opacity: 1;
    }

    .nowrap {
        white-space: nowrap;
    }

    .line-through {
        text-decoration: line-through !important;
    }

        .line-through td {
            text-decoration: line-through !important;
        }

.badge {
    padding: 2px 5px;
    background: #efefef;
    font-weight: bold;
}

.ql-editor {
    background: white;
}

em { font-style: italic; }