body
{
   font-weight: normal;
   font-size: 13px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
}
#wb_Text2 
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #000000;
   border-radius: 0px;
   flex-grow: 1;
   flex-shrink: 1;
   align-self: auto;
   padding: 0 0 0 10px;
   margin: 0;
   text-align: left;
}
#wb_Text2 div
{
   text-align: left;
}
#FlexContainer1
{
   display: flex;
   position: relative;
   height: 45px;
   padding: 10px 10px 10px 10px;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: flex-start;
   align-content: flex-start;
   margin: 0;
   box-sizing: border-box;
   font-size: 0;
}
#FlexContainer3
{
   display: flex;
   position: relative;
   padding: 0;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#wb_PanelMenu1 a, #PanelMenu1_markup li a
{
   display: block;
   text-align: center;
   vertical-align: middle;
}
#wb_PanelMenu1
{
   margin: 4px 0 0 4px;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: flex-start;
}
#PanelMenu1_markup
{
   display: none;
   margin: 0;
   padding: 0;
}
#PanelMenu1_panel #PanelMenu1_markup
{
   display: block;
}
#PanelMenu1_markup ul
{
   list-style: none;
   list-style-type: none;
   margin: 0;
   padding: 0;
}
#PanelMenu1_markup li a, #PanelMenu1_markup li a:hover
{
   padding: 10px 10px 10px 10px;
   box-shadow: none;
}
#PanelMenu1_markup .divider
{
   height: 1px;
   margin: 9px 0;
   overflow: hidden;
   background-color: #FFFFFF;
}
#PanelMenu1_panel
{
   display: none;
   position: fixed;
   top: 0;
   height: 100%;
   width: 160px;
   z-index: 9999;
}
#PanelMenu1_markup li a
{
   color: #000000;
   border: 1px solid #FFFFFF;
   background-color: #CCCCCC;
   font-family: Arial;
   font-weight: bold;
   font-size: 13px;
   font-style: normal;
   text-decoration: none;
   text-transform: none;
}
#wb_PanelMenu1 a
{
   color: #F7F7F7;
   border: 1px solid #2E2E2E;
   border-radius: 12px;
   background-color: #1C3A5C;
   font-family: Arial;
   font-weight: bold;
   font-size: 13px;
   font-style: normal;
   text-decoration: none;
   text-align: center;
   text-transform: none;
}
#PanelMenu1_markup li a:hover
{
   color: #000000;
   background-color: #D3D3D3;
   border: 1px solid #CCCCCC;
}
#PanelMenu1_markup li a .icon
{
   fill: currentColor;
   margin-right: 4px;
   height: 16px;
   width: 16px;
   vertical-align: middle;
}
#PanelMenu1_markup li a:hover .icon
{
   fill: currentColor;
}
#wb_PanelMenu1 a:hover
{
   color: #F7F7F7;
   background-color: #1C3A5C;
   border: 1px solid #2E2E2E;
}
#PanelMenu1_panel
{
   background-color: #CCCCCC;
   overflow-y: auto;
}
#PanelMenu1
{
   line-height: 37px;
   width: 110px;
   height: 37px;
   position: absolute;
   z-index: 999;
}
#Table2
{
   border-radius: 0px;
   border: 1px solid #E5E7EB;
   background-color: #F5F5F5;
   background-image: none;
   border-collapse: separate;
   border-spacing: 1px;
   margin: 0;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
}
#Table2 td, #Table2 th
{
   padding: 0;
}
#Table2 p, #Table2 ul
{
   margin: 0;
   padding: 0;
}
#Table2 .cell0
{
   background-color: transparent;
   background-image: none;
   border: 2px #C0C0C0 solid;
   text-align: left;
   vertical-align: top;
   width: 96px;
   height: 100px;
   font-size: 0;
}
#Table2 .cell1
{
   background-color: transparent;
   background-image: none;
   border: 2px #C0C0C0 solid;
   text-align: left;
   vertical-align: top;
   height: 100px;
   font-size: 0;
}
#Table2 .cell2
{
   background-color: transparent;
   background-image: none;
   border: 2px #C0C0C0 solid;
   text-align: center;
   vertical-align: middle;
   width: 96px;
   height: 100px;
   font-size: 0;
}
#wb_Image2
{
   margin: 0;
   vertical-align: top;
}
#Image2
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: inline-block;
   width: 96px;
   height: 100px;
   vertical-align: top;
}
#wb_Image3
{
   margin: 0;
   vertical-align: top;
}
#Image3
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: inline-block;
   width: 96px;
   height: 100px;
   vertical-align: top;
}
#wb_Image4
{
   margin: 0;
   vertical-align: top;
}
#Image4
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: inline-block;
   width: 96px;
   height: 100px;
   vertical-align: top;
}
#wb_Image7
{
   margin: 0;
   vertical-align: top;
}
#Image7
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: inline-block;
   width: 95px;
   height: 100px;
   vertical-align: top;
}
#FlexContainer2
{
   display: flex;
   position: relative;
   padding: 10px 10px 10px 10px;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#wb_LayoutGrid2
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: rgba(255,255,255,0.39);
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
   margin-right: auto;
   margin-left: auto;
   max-width: 1024px;
}
#LayoutGrid2
{
   box-sizing: border-box;
   padding: 2px 15px 2px 15px;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid2 > .row
{
   margin-right: -15px;
   margin-left: -15px;
}
#LayoutGrid2 > .row > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#LayoutGrid2 > .row > .col-1
{
   float: left;
}
#LayoutGrid2 > .row > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   width: 100%;
   text-align: center;
}
#LayoutGrid2:before,
#LayoutGrid2:after,
#LayoutGrid2 .row:before,
#LayoutGrid2 .row:after
{
   display: table;
   content: " ";
}
#LayoutGrid2:after,
#LayoutGrid2 .row:after
{
   clear: both;
}
@media (max-width: 480px)
{
#LayoutGrid2 > .row > .col-1
{
   float: none;
   width: 100%;
}
}
#FlexContainer4
{
   display: flex;
   position: relative;
   padding: 10px 10px 10px 10px;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#wb_Image6
{
   margin: 0;
   vertical-align: top;
}
#Image6
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: inline-block;
   width: 95px;
   height: 100px;
   vertical-align: top;
}
#wb_LayoutGrid1
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: rgba(255,255,255,0.39);
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
   margin-right: auto;
   margin-left: auto;
   max-width: 1024px;
}
#LayoutGrid1
{
   box-sizing: border-box;
   padding: 2px 15px 2px 15px;
   margin-right: auto;
   margin-left: auto;
}
#LayoutGrid1 > .row
{
   margin-right: -15px;
   margin-left: -15px;
}
#LayoutGrid1 > .row > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#LayoutGrid1 > .row > .col-1
{
   float: left;
}
#LayoutGrid1 > .row > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   width: 100%;
   text-align: center;
}
#LayoutGrid1:before,
#LayoutGrid1:after,
#LayoutGrid1 .row:before,
#LayoutGrid1 .row:after
{
   display: table;
   content: " ";
}
#LayoutGrid1:after,
#LayoutGrid1 .row:after
{
   clear: both;
}
@media (max-width: 480px)
{
#LayoutGrid1 > .row > .col-1
{
   float: none;
   width: 100%;
}
}
#FlexContainer7
{
   display: flex;
   position: relative;
   padding: 10px 10px 10px 10px;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#wb_Text4 
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #000000;
   border-radius: 0px;
   flex-grow: 1;
   flex-shrink: 1;
   align-self: auto;
   padding: 0;
   margin: 0;
   text-align: left;
}
#wb_Text4
{
   color: #000000;
   font-family: "Comic Sans MS";
   font-weight: 400;
   font-size: 13px;
   line-height: 19px;
}
#wb_Text4 p, #wb_Text4 ul
{
   margin: 0;
   padding: 0;
}
#wb_Image5
{
   height: 100%;
   margin: 0;
   vertical-align: top;
}
#Image5
{
   border: 0px solid #000000;
   border-radius: 0px;
   box-sizing: border-box;
   padding: 0;
   display: block;
   width: 100%;
   height: 100%;
   vertical-align: top;
   object-fit: contain;
}
#wb_Divider1
{
   clear: both;
   position: relative;
   table-layout: fixed;
   display: table;
   text-align: center;
   width: 100%;
   background-color: rgba(255,255,255,0.39);
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   margin: 0;
   margin-right: auto;
   margin-left: auto;
   max-width: 1024px;
}
#Divider1
{
   box-sizing: border-box;
   padding: 2px 15px 2px 15px;
   margin-right: auto;
   margin-left: auto;
}
#Divider1 > .row
{
   margin-right: -15px;
   margin-left: -15px;
}
#Divider1 > .row > .col-1
{
   box-sizing: border-box;
   font-size: 0;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px;
   position: relative;
}
#Divider1 > .row > .col-1
{
   float: left;
}
#Divider1 > .row > .col-1
{
   background-color: transparent;
   background-image: none;
   border: 0px solid #FFFFFF;
   border-radius: 0px;
   width: 100%;
   text-align: center;
}
#Divider1:before,
#Divider1:after,
#Divider1 .row:before,
#Divider1 .row:after
{
   display: table;
   content: " ";
}
#Divider1:after,
#Divider1 .row:after
{
   clear: both;
}
@media (max-width: 480px)
{
#Divider1 > .row > .col-1
{
   float: none;
   width: 100%;
}
}
#DividerLine1
{
   border-color: #E5E7EB;
   border-style: solid;
   border-bottom-width: 4px;
   border-top: 0;
   border-left: 0;
   border-right: 0;
   height: 0 !important;
   line-height: 0 !important;
   margin: 0;
   padding: 0;
}
#HorizontalLine1
{
   border-color: #E5E7EB;
   border-style: solid;
   border-bottom-width: 4px;
   border-top: 0;
   border-left: 0;
   border-right: 0;
   height: 0 !important;
   line-height: 0 !important;
   margin: 0;
   padding: 0;
}
#HorizontalLine2
{
   border-color: #E5E7EB;
   border-style: solid;
   border-bottom-width: 4px;
   border-top: 0;
   border-left: 0;
   border-right: 0;
   height: 0 !important;
   line-height: 0 !important;
   margin: 0;
   padding: 0;
}
#txtDevName
{
   box-sizing: border-box;
   line-height: 16px;
   margin: 0;
   border: 0px solid #CCCCCC;
   border-radius: 4px;
   background-color: transparent;
   background-image: none;
   color: #808080;
   font-family: Arial;
   font-weight: normal;
   font-style: normal;
   font-size: 11px;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
   text-align: center;
   padding: 0;
}
#txtDevName:focus
{
   border-color: #66AFE9;
   box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(102,175,233,0.60);
   outline: 0;
}
#FlexContainer8
{
   display: flex;
   position: relative;
   padding: 2px 0 2px 0;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #DDDDDD;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#FlexContainer5
{
   display: flex;
   position: relative;
   padding: 2px 0 0 0;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#FlexContainer6
{
   display: flex;
   position: relative;
   padding: 0 0 2px 0;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-around;
   align-items: center;
   align-content: flex-start;
   margin: 0;
   background-color: transparent;
   background-image: none;
   border: 0px solid #CCCCCC;
   border-radius: 0px;
   box-sizing: border-box;
   font-size: 0;
}
#Editbox1
{
   box-sizing: border-box;
   line-height: 16px;
   margin: 0;
   border: 0px solid #CCCCCC;
   border-radius: 4px;
   background-color: transparent;
   background-image: none;
   color: #808080;
   font-family: Arial;
   font-weight: normal;
   font-style: normal;
   font-size: 11px;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
   text-align: center;
   padding: 0;
}
#Editbox1:focus
{
   border-color: #66AFE9;
   box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(102,175,233,0.60);
   outline: 0;
}
#Title
{
   box-sizing: border-box;
   line-height: 19px;
   margin: 0;
   border: 0px solid #CCCCCC;
   border-radius: 4px;
   background-color: transparent;
   background-image: none;
   color: #FFFFFF;
   font-family: Arial;
   font-weight: bold;
   font-style: normal;
   font-size: 16px;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
   text-align: left;
   padding: 4px 4px 4px 4px;
}
#Title:focus
{
   border-color: #66AFE9;
   box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075), 0px 0px 8px rgba(102,175,233,0.60);
   outline: 0;
}
#btnAddHomeScr
{
   border: 0px solid #306096;
   border-radius: 12px;
   background-color: transparent;
   background-image: none;
   color: #306096;
   font-family: Arial;
   font-weight: normal;
   font-style: normal;
   font-size: 12px;
   padding: 1px 6px 1px 6px;
   text-align: center;
   text-decoration: underline;
   flex-grow: 0;
   flex-shrink: 0;
   align-self: auto;
   -webkit-appearance: none;
   margin: 0;
}
#btnAddHomeScr:focus
{
   outline: 0;
}
/* ================================================================
   Do not display the splash screen again during this browser-tab
   session.
   ================================================================ */
.PickupSplashAlreadyShown #PickupSplashScreen
{
    display: none !important;
}


/* ================================================================
   Pickups Opening Splash Screen
   ================================================================ */

#PickupSplashScreen
{
    position: fixed;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background: #2B2B2B;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    z-index: 99999;

    opacity: 1;
    visibility: visible;

    transition:
        opacity 0.6s ease,
        visibility 0.6s ease;
}


/* ================================================================
   Hide Splash Screen
   ================================================================ */

#PickupSplashScreen.PickupSplashHidden
{
    opacity: 0;
    visibility: hidden;
}


/* ================================================================
   Truck Travel Area
   ================================================================ */

.PickupTruckRoad
{
    position: relative;

    width: 90%;
    max-width: 700px;

    height: 180px;

    overflow: hidden;
}


/* ================================================================
   Truck Image
   ================================================================ */

#PickupDeliveryTruck
{
    position: absolute;

    left: -150px;
    bottom: 10px;

    width: 133px;          /* 30% smaller */

    height: auto;

    animation:
        PickupTruckMove 4s ease-in-out forwards,
        PickupTruckBounce .30s ease-in-out infinite alternate;
}


/* ================================================================
   Splash Text
   ================================================================ */

#PickupSplashMessage
{
    margin-top: 15px;

    font-size: 24px;
    font-weight: bold;

    color: white;

    text-align: center;
}


/* ================================================================
   Truck Driving Animation
   ================================================================ */

@keyframes PickupTruckMove
{
    0%
    {
        left: -150px;
    }

    100%
    {
        left: calc(100% - 133px);
    }
}


/* ================================================================
   Truck Bounce
   ================================================================ */

@keyframes PickupTruckBounce
{
    from
    {
        transform: translateY(0px);
    }

    to
    {
        transform: translateY(-7px);
    }
}


/* ================================================================
   Mobile Devices
   ================================================================ */

@media (max-width:500px)
{

    .PickupTruckRoad
    {
        height:150px;
    }

    #PickupDeliveryTruck
    {
        left:-120px;
        width:100px;
    }

    #PickupSplashMessage
    {
        font-size:20px;
    }

    @keyframes PickupTruckMove
    {
        0%
        {
            left:-120px;
        }

        100%
        {
            left:calc(100% - 100px);
        }
    }

}

  body {
    margin: 0;
    padding: 0;
  }

  /* Full-screen wrapper to position the box in top 1/3 of screen */
  #a2hsWrapper {
    display: none;             /* hidden by default */
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99998;
    background: rgba(0,0,0,0.2); /* optional translucent background */
    justify-content: center;   /* horizontal centering */
    align-items: flex-start;   /* push box toward top */
    padding-top: 15%;          /* moves box down ~top 1/3; adjust as needed */
  }

  #a2hsPrompt {
    background: #555555;       /* dark gray */
    color: #ffffff;
    border: 2px solid #000000; /* solid border */
    border-radius: 12px;
    padding: 20px;
    width: 80%;
    max-width: 400px;
    box-sizing: border-box;
    text-align: left;
    box-shadow: 0 8px 20px rgba(0,0,0,0.25);
    font-family: Arial, sans-serif;
    z-index: 99999;
  }

  #a2hsPrompt button {
    display: block;
    margin: 12px auto 0 auto; /* center button horizontally */
    padding: 10px 16px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    background: #007aff;
    color: #fff;
  }