<STYLE TYPE="TEXT/CSS">
/* Below are dependant on the forms fields not changing. */
body, html {
  height: 100%;
  margin: 0;
}

/* ===== Anchor-safe offsets (kept in sync by JS) ===== */
:root{
  --bar1-h: 0px;   /* #fixed_bar_1_title */
  --bar2-h: 0px;   /* #fixed_bar_2_menu  */
  --tabs-h: 0px;   /* #fixed_bar_5_calendar_tabs */
  --top-offset: calc(var(--bar1-h) + var(--bar2-h) + var(--tabs-h) + 12px);

  --leftbar-w: 0px; /* #fixed_bar_3_left_side_vertical width when it overlaps */
  --left-offset: var(--leftbar-w);
}

/* Smooth scrolling for in-page anchors */
html { scroll-behavior: smooth; }

/* Tell the browser to leave room when jumping to #hash targets */
html{
  scroll-padding-top: var(--top-offset);
  scroll-padding-left: var(--left-offset);
}

/* Make the targets themselves keep distance from fixed bars */
[id], [name]{
  scroll-margin-top: var(--top-offset);
  scroll-margin-left: var(--left-offset);
}

/* Ensure content is not hidden *behind* fixed bars during normal scroll */
.body_section{
  padding-top: var(--top-offset);
  /* Because your left bar is `position: fixed; width:20vw`, it overlays content.
     Give the main content a left pad equal to the live sidebar width. */
  padding-left: var(--left-offset);
}

/* Top fixed-bar attributes. */
#fixed_bar_1_title, #fixed_bar_2_menu, #fixed_bar_3_left_side_vertical, #fixed_bar_4_bottom, #fixed_bar_5_calendar_tabs, #pop_up_window {
  overflow: visible;
  color: white;
  background-color: #19004d;
  text-align: justify;
  position: fixed;
  width: 100%;
  padding: 0;
  margin: 0;
  left: 0;
  z-index: 1;  /* Must be greater than scrolled content area */
}

/*-------------------------
   TOP: fixed_bar_1_title => Menu and title 
---------------------------*/
#fixed_bar_1_title {
  top: 0;
  z-index: 2;  /* Must be greater than nearby elements such as fixed_bar_2_menu */
}

/*-------------------------
   2ND ROW: fixed_bar_2_menu => contact|sign-in/out links|time
---------------------------*/
#fixed_bar_2_menu {
   vertical-align: middle;
   text-align: center;
   font-size: calc(1vw + 1vh);
}    

/*-------------------------
 LEFT BAR: Fixed-Left Side bar with options.
---------------------------*/
#fixed_bar_3_left_side_vertical {
  overflow: hidden;
  color: white;
  text-align: justify;
  position: fixed;
  height: 100%;
  width: 20vw;
  top: 0;
  left: 0;
  z-index: 1;  /* Must be greater than scrolled content area */
}
/*-------------------------
BOTTOM: Icon BUTTONS In Mobile View
---------------------------*/
#fixed_bar_4_bottom {
   display: none; /* Invisible by default */
   vertical-align: middle;
   text-align: center;
   bottom: 0;

   word-spacing: 20vw;
   font-size: calc(2vw + 2vh);   
}

/* Fixed-Top-Bar tabs; Also see calendar_tabs */
#fixed_bar_5_calendar_tabs {
  display: inline-block;
  overflow: hidden;
  background-color: black;
  z-index: 1;  /* Must be greater than nearby elements such as fixed_bar_2_menu */
  height: 5vh;
  margin: 0;
  padding: 0;
  /* Width set in calendar_alerts_script.js */
}

/* 3RD ROW:  Used for calendar tabs PKA: calendar_tabs*/
#fixed_bar_5_calendar_tabs div  {
   overflow: hidden;
   background-repeat: no-repeat;
   background-size: cover;
   font-size: 1.5em;
   height: 100%;
   width: 8vw;
   display: inline-block;
}
.vertical_centered
{
   vertical-align: -50%;
}


/* BOTTOM: Button Section */
#forms_buttons_section {
   position: fixed;
   vertical-align: middle;
   text-align: center;
   background-color:white;
   font-size: calc(2vw + 2vh);   
   width: 100%;
   z-index: 1;
}

.post_forms_buttons_section {
   font-size: calc(1vw + 1vh);   
}

#list_view_table, #calendar_view, #fixed_bar_4_bottom_bg
{
  position:absolute;
}
#fixed_bar_4_bottom_bg
{
   height: 200px;
}

/* pop up window used for description information html */
#pop_up_window {
   background-color: white;
   color: navy;
   font-size: 1.5em;
   text-align: left;
   height: 100%;
   width: 100%;
   display: none;
   overflow: scroll;
   padding: 1em;
   margin: 0;
   z-index: 10;
   opacity: 0.90; /*transparency*/
}

/* This is a styles object that calls pop up windows in #pop_up_window */
#popup_event_onload {
}   

/* Use this on an element inside another [parent] container for vertical alighment*/
.vertical_centered_child {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

hr {
  display: block;
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}

hr.divider {
  border-top: .1px solid white;
}

.body_section {
  position: static;
  width: 100%;
  z-index: 1;  /* An element with greater stack order is always in front of an element with a lower stack order. */
}


/* CSS reminder: period/dot/'.<class-name>'=> class; Hash/'#<id-name>'=>TAG-ID */


/* Default anchor attributes */

 a:link {color:#8000ff;}
 a:visited {color: #8000ff;}
 a:hover, :visited:hover {color: purple; }
/*  a:visited {color: #bf80ff;} */
/*  a:active, :visited:active {color: #9933ff;} */
/*  a:hover, :visited:hover {color: purple; } */

a.dark_bg_menu_anchor:link {color: #ccccff;}
a.dark_bg_menu_anchor:visited {color: #ccccff;}
a.dark_bg_menu_anchor:hover {color: white;}


.ch { cursor:hand; }

.triangle-right {
   width: 0;
   height: 0;
   border-top: 25px solid transparent;
   border-left: 50px solid RebeccaPurple;
   border-bottom: 25px solid transparent;
}

.circle {
  height: 50px;
  width: 50px;
  background-color: #555;
  border-radius: 50%;
}

#TopBar1Links
{
    COLOR: white;
    FONT-SIZE:  calc(1vw + 1vh);
}


.TopBarTable
{
    top: 200px;
    width: "100%";
}

.TopBar1
{
    BACKGROUND-COLOR: #19004d;
    width: 100vw;
}

.TopBar1Text
{
    COLOR: white;
    FONT-SIZE:  calc(1.5vw + 1.5vh);
}

.TopBar2
{
    BACKGROUND-COLOR: #280080;
    height:3vh;
    width: 3vw;
}
.TopBar2Text
{
    COLOR: white;
    FONT-SIZE: 18pt;
}
.SideBarTop
{
    BACKGROUND-COLOR: #661aff;
    BACKGROUND-IMAGE: none;
    BACKGROUND-REPEAT: repeat;
    COLOR: white;
    FONT-SIZE: 14pt;
    TEXT-ALIGN: top
}
.SideBarBottom
{
    BACKGROUND-COLOR: #661aff;
    BACKGROUND-IMAGE: none;
    TEXT-ALIGN: top
    vertical-align: text-top;
}
.SideBarTopText
{
    COLOR: #B0C4DE;
    FONT-SIZE: 16pt;
    FONT-WEIGHT: bold;
    TEXT-ALIGN: center
}
.SideBarBottomText
{
    BACKGROUND-COLOR: transparent;
    BACKGROUND-IMAGE: none;
    BACKGROUND-REPEAT: repeat;
    COLOR: white;
    FONT-SIZE: 16pt;
    FONT-WEIGHT: bold;
    TEXT-ALIGN: center
}
.ServicesTable
{
    BACKGROUND-COLOR: #2F4F4F;
    BACKGROUND-IMAGE: none;
    BACKGROUND-REPEAT: repeat;
    height:250px;
    width:200px;
    COLOR: white;
    FONT-SIZE: 14pt;
    TEXT-ALIGN: center
}
.LinkTextTop, .LinkText, .LinkTextConfig
{
    FONT-SIZE: calc(.8vw + .8vh);
    FONT-WEIGHT: bold;
}

.LinkTextCreateAcct
{
    FONT-SIZE:  calc(1.5vw + 1.5vh);
}


.LinkTextCurrent
{
    COLOR: white;
    FONT-SIZE: 14pt;
    FONT-WEIGHT: bold;
}
.BodyTextHeader
{
    COLOR:DARKBLUE;
    FONT-SIZE: 22;
    FONT-WEIGHT: bold;
}
.BodyText
{
    COLOR:#483D8B;
    FONT-SIZE: 20;
}
.errorlist 
{
    COLOR:red;
    font-size: 2vmin;
}

div.div_shadow_base {
   vertical-align: middle;
   text-align: left;
   box-shadow: 2px 2px 1px grey;
   color: #5c5c8a;
   padding: calc(.2vw + .2vh);
   font-size: calc(1vw + 1vh);
   display: block;
   margin: auto;
}

div.div_long_oneline1 {
   background-color: #b3b3ff;
   color: #0000e6;
}

div.div_long_oneline2 {
   background-color: #8080ff;
}

/* Note: Padding between table-cells is controlled by the table-CELLPADDING and CELLSPACING attribute */
.td_shadow_base {
   vertical-align: middle;
   text-align: center;
   box-shadow: 2px 2px 1px grey;
   color: #5c5c8a;
   padding: calc(.2vw + .2vh);
   font-size: calc(1vw + 1vh);
}

#policy_example_table {
   color: navy;
   font-size: calc(.65vw + .65vh);
}
.gen_gray_text_small, gen_gray_text_small, gray_text, .gen_gray_text_med, gen_gray_text_med, .gen_gray_text_large, gen_gray_text_large {
   color: gray;
}

gen_red_text_med {
   color: red;
}

.gen_gray_text_small, gen_gray_text_small {
   font-size: calc(.75vw + .75vh);
}

.gen_gray_text_med, gen_gray_text_med, gen_red_text_med, gen_white_text_med {
   font-size: calc(1vw + 1vh);
}

.help_img
{
  max-width: 100%;
}

.gen_purple_text_med, gen_purple_text_med {
   color: #661aff;
   font-size: calc(1vw + 1vh);
}

.gen_medgray_text_med, gen_medgray_text_med {
   color: #4d5656;
   font-size: calc(1vw + 1vh);
}
.gen_medgray_text_large, gen_medgray_text_large {
   color: #4d5656;
   font-size: calc(1.75vw + 1.75vh);
}

.gen_lightgray_text_med, gen_lightgray_text_med {
   color: #7B7D7D;
   font-size: calc(.85vw + .85vh);
   display: inline;
}

.gen_lightgray_text_large, gen_lightgray_text_large {
   color: #7B7D7D;
   font-size: calc(1.25vw + 1.25vh);
}

.gen_blue_text_large, gen_blue_text_large,.gen_blue_text_med, gen_blue_text_med, .gen_blue_text_small, gen_blue_text_small {
   color: blue;
}

.gen_blue_text_large, gen_blue_text_large {
   font-size: calc(1.25vw + 1.25vh);
}

.gen_blue_text_med, gen_blue_text_med {
   font-size: calc(.85vw + .85vw);
}

.gen_blue_text_small, gen_blue_text_small {
   font-size: calc(.75vw + .75vh);
}

.gen_green_text_large, gen_green_text_large,.gen_green_text_med, gen_green_text_med {
   color: green;
}
.gen_green_text_large, gen_green_text_large {
   font-size: calc(1.25vw + 1.25vh);
}

.gen_green_text_med, gen_green_text_med {
   font-size: calc(1vw + 1vh);
}

.gen_white_text_large, gen_white_text_large {
   color: white;
   font-size: calc(1.25vw + 1.25vh);
}

.gen_red_text_large, gen_red_text_large {
   color: red;
   font-size: calc(1.25vw + 1.25vh);
}

.gen_gray_text_large, gen_gray_text_large {
   font-size: calc(1.25vw + 1.25vh);
}

.welcome_text, .welcome_text_med {
   color: lightgray;
   font-size: calc(2vw + 2vh);
}

.welcome_text_med {
   font-size: calc(1vw + 1vh);
}

.TopBar2 {
   vertical-align: middle;
   text-align: center;
   color: white;
   font-size: calc(1vw + 1vh);
   background-color: #280080;
}    

.td_table_heading, .td_heading_medium {
   color: white;
   background-color: #47476b;
}

/* Standard font sizes defined */
.td_heading_medium {
   font-size: calc(0.75vw + 0.75vh);
}

.td_true_false, .td_time, .td_10_percent {
   width: 10vw;
}

.td_phone, .td_15_percent {
   width: 15%;
}

.td_date, .td_name, .td_20_percent {
   width: 20%;
}

.td_25_percent {
   width: 25%;
}

.td_email, .td_policy_name, .td_30_percent {
   width: 30%;
}

.td_summary_small, .td_40_percent {
   width: 40%;
}

.td_50_percent {
   width: 50%;
}

.td_summary, .td_descriptions, .td_70_percent {
   width: 60%;
}

.td_policies {
    /* text-align: left; */
    font-size: calc(.75vw + .75vh);
}

div.heading_large_font {
    font-size: calc(2vw + 2vh);
}

.font_medium {
    font-size: calc(.75vw + .75vh);
}

.font_small {
    font-size: calc(.5vw + .5vh);
}

/* Standard font attributes defined */
.font_gray {
   color: gray;
}

.font_dark_steel {
   color: #47476b;
}

div.div_small_font {
   padding: calc(.10vw + .10vh);
   font-size: calc(0.65vw + 0.65vh);
}

div.div_med_font {
   padding: calc(.15vw + .15vh);
   font-size: calc(0.75vw + 0.75vh);
}

div.div_table_heading {
   color: white;
   background-color: #47476b;
}

.font_color_white,font_color_white, gen_white_text_med , gen_white_text_small  {
   color: white;
}
.font_color_black,font_color_black {
   color: black;
}
.font_color_red,font_color_red {
   color: red;
}
.font_color_blue,font_color_blue {
   color: blue;
}

/*----------------------------------------------------------------------------*/

div.div_scroll_container, div.div_scroll_container_form
{
   overflow: visible;
   width: 80vw;
   height: 80vh;
}

div.div_scroll_container
{
   height: 90vh;
}



td.td_menu_row {
   text-align: center;
   height: 10vh;
   background-color: darkgray;
   /*#9999bb;*/
}

/* Prevent underline on top and bottom button links */
.button_link {
    text-decoration: none !important;
    color: white;
}

.font_left_align {
    text-align: left;
}

/*----------------------------------------------------------------------------*/
/*----------------------------DROP-DOWN MENU----------------------------------*/
/*----------------------------------------------------------------------------*/
/* The parent container <div> - needed to position the dropdown content */
/*------------------------MENU---------------------------------*/
.title_text {
    color: white;
    font-size: calc(2vw + 2vh);
    position: relative;
    display: inline-block;
    padding: 1vh 0 0 0;
}

/* Dropdown Content (Hidden by Default) */
#dropdown_content {
    display: none;
    font-size: 3vmin;
    min-width: 25vw;
    opacity: 0.90; /*transparency*/
    word-spacing: 0;
    position: absolute;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.8);
    overflow: hidden;
    z-index: 5;
}

/* Links inside the dropdown */
#dropdown_content a {
    text-decoration: none;
    display: block;
    background-color: lavender;
    text-align: left;
    padding: 3%;
    z-index: 5;
}
/* Change bg color of dropdown links on hover */
#dropdown_content a:hover {background-color: white;}

/* Onclick/focus or Onhover, show (block => make visible) "dropdown_content" menu  */
#menu_button:focus #dropdown_content {
    display: block;
}

hr.menu {
   margin: 1%;
   background-color: lavender;
}

/* DT: Only visible on large displays */
#date_and_time_string {
    color: white;
    font-size: calc(1vw + 1vh);
    display: inline;
    vertical-align: middle;
}

.spaced_container {
   display: inline;
}
/* style="color:green;font-size:32px;background:Aquamarine" */
button.button_base, .button_save, .button_delete, .button_create, .button_green, .button_yellow, .button_red {
    margin: calc(1vw + 1vh);
    width: 20vw;
    font-size: calc(1.25vw + 1.25vh);
    background: #cce0ff;
    color:blue;
}

button.button_green, button.button_save, button.button_create  {
    width: 18vw;
    color:green;
}

button.button_yellow {
    width: 18vw;
    color:yellow;
}

button.button_red {
    width: 18vw;
    color:#ac3939;
}

button.button_delete, .button_red {
    background: #ecc6c6;
    color:#ac3939;
}

button.button_test {
    width: 5vw;
    background: #cce0ff;
    color:blue;
}

.td_paypal {
   vertical-align: middle;
   text-align: center;
   width: 6vw;
   font-size: calc(1vw + 1vh);
   box-shadow: 3px 3px 3px grey;
   color: blue;
}

.paypal_button {
    font-size: calc(.75vw + .75vh);
    background: #cce0ff;
    color:blue;
    width:  7vw;
    box-shadow: 3px 3px 2px grey;
    margin: 5px;
}

input, select, .input_50vw, .input_5vw .input_10vw {
    font-size: calc(1vw + 1vh);
    background: #cce0ff;
    color:navy;
    width: 20vw;
}

.input_5vw {
    width: 5vw;
}

.input_10vw {
    width: 10vw;
}

.input_50vw {
    width: 50vw;
}

.input_75vw {
    width: 75vw;
}

.input_100vw {
    width: 100vw;
}

textarea {
    font-size: calc(1vw + 1vh);
    background: #c2c2d6;
    color:#7575a3;
    resize: none;
    height: 8vh;
    width: 65vw;
}

input[type="checkbox"] {
    width: 3vw;
    height: 3vh;
}

input[type="radio"] {
    width: 1vw;
    height: 1vh;
}

.mobile_visible_only, .mobile_visible_only_cell, .hidden_section  {
  display: none;
}

.visible_block_section  {
    display: block;
}

.mobile_invisible_inline, .visible_inline_section {
     display: inline;
}

/* Below IDs much change if the contact form changes */
#id_carrier_gateway_opt_choice, #id_cal_summ_notif_freq {
    list-style-type: none;
    text-align: left;
}

/* Landing Page */
button.button_landing_page {
    margin: calc(1vw + 1vh);
    width: 40vw;
    height: 5vh;
    font-size: calc(1.5vw + 1.5vh);
    background: #cce0ff;
    color:blue;
}

.td_shadow_base_landing_page {
   box-shadow: 4px 4px 2px gray;
   padding: calc(1vw + 1vh);
}

.img_landing_page 
{
    width: 350px;
}

img.checkbox_img_med
{
    width: 30px;
}

.landing_page_top_bar
{
    BACKGROUND-COLOR: #19004d;
    width: 100vw;
    height: 2vh;
}
.landing_page_top_bar_row2
{
    BACKGROUND-COLOR: #280080;
    height: 5vh;
    width: 100vw;
}

checkbox_ascii_icon
{
    font-weight: bold;
    font-size: calc(1.25vw + 1.25vh);
}

div.div_scroll_landing_page
{
   overflow: scroll;
   width: 98vw;
   height: 65vh;
}

.div_landing_page_features, .div_landing_page_usecases, .div_landing_page_img
{
    display: table-cell;
    width:30vw; 
    background-color: #e6ffe6;
    text-align: left;
    vertical-align: middle; 
    padding:30px;
}
.div_landing_page_usecases
{
    background-color: #e6e6ff;
}
.div_landing_page_img
{
    background-color: #e6e7e9;
}

.error_message
{
    background-color: #fffae6;
}

.img_pics {
    width: 50%;
}

.weekday_img {
    width: 100%;
}
.weekday_div {
  position: relative;
  text-align: center;
  color: black;
}
.inner_div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* Below is used when a "screen" height is < 700px, such as phones AND tablets */
/*----------------------------------------------------------------------------*/
@media screen and (max-height: 700px) {

    #img_and_title_table, 
    .login_status
    {
        display: none;
    }    
    .img_picsx {
        width: 0%;
        height: 0%;
        display: none;
    }
   div.div_scroll_container
   {
      width: 91vw;
      height: 91vh;
   }
}

/*----------------------------------------------------------------------------*/
/*--@media only screen and (max-width: 1200px), screen and (max-height: 700px) {-*/
/* Below is used when a "screen" width is < 1200px, such as phones */
@media only screen and (max-width: 1200px) {
    div.div_shadow_base, td.td_shadow_base {
       font-size: calc(2vw + 2vh);
    }
    div.heading_large_font {
        font-size: calc(3vw + 3vh);
    }
    td.td_policies {
        text-align: center;
        font-size: calc(1vw + 1vh);
    }
    
    .TopBar1Text {
       font-size: calc(3vw + 3vh);
    }
    
    .title_text {
       font-size: calc(3.5vw + 3.5vh);
       padding: 2vh 0 0 0;
    }
    
    #dropdown_content {
        font-size: 5vmin;
        min-width: 50vw;
        opacity: 0.85; /*transparency*/
     }
     
    .SideBarTop, .SideBarBottom, .SideBarTopText, .SideBarBottomText, 
    .LinkTextCurrent, #hrLine, .menu_separators, .dark_bg_menu_anchor,
    .subtitle, .login_status, #img_and_title_table, 
    #extras_bottom, #fixed_bar_2_menu, #policy_example_table, .div_landing_page_img, #fixed_bar_3_left_side_vertical
    {
        display: none;
    }    

    .img_pics {
        width: 0%;
        height: 0%;
        display: none;
    }
    div.div_scroll_container_form
    {
       width: 100vw;
       height: 55vh;
    }
    
    div.div_scroll_container
    {
       width: 100vw;
       height: 65vh;
    }
    
    /* Make visible */
    #date_and_time_mobile {
        display: inline;
    }
    
    .top_title_bar_mobile, .subtitle {
       display: block;
       font-size: calc(1.5vw + 1.5vh);
    }
    
    #fixed_bar_4_bottom {
       word-spacing: 10vw;
       font-size: calc(5vw + 5vh);   
       display: block;
    }
    
    
    .mobile_visible_only_cell {
           display: table-cell;
    }
    .mobile_visible_only {
           display: inline;
    }
    .mobile_invisible, .mobile_invisible_inline {
           display: none;
    }

    button.button_base {
        width: 25vw;
        margin: calc(.5vw + .5vh);
    }
    input, select, textarea {
        font-size: calc(2vw + 2vh);
        width: calc(92vw);
    }

    textarea {
        height: 20vh;
    }
    .input_50vw, .input_5vw, .input_10vw  {
        width: 90vw;
        font-size: calc(2vw + 2vh);
    }
    .help_img
    {
     max-width: 100%;
    }
    .paypal_button {
        width:  20vw;
    }
    input[type="radio"] {
        width: 5vw;
        height: 5vh;
    } 

    /* Basic Text color&size Tags */
    .gen_gray_text_small, gen_gray_text_small,.gen_blue_text_small, gen_blue_text_small, .td_paypal, .post_forms_buttons_section,
    {
       font-size: calc(1.5vw + 1.5vh);
    }
    
    .gen_medgray_text_med, gen_medgray_text_med
    {
       font-size: calc(1.75vw + 1.75vh);
    }
    
    .LinkTextCreateAcct, .welcome_text_med, .gen_gray_text_med, gen_gray_text_med,  gen_medgray_text_large,
    gen_lightgray_text_med, gen_blue_text_med, .gen_blue_text_med, gen_blue_text_med,
    .gen_green_text_med, gen_green_text_med,gen_red_text_med, .gen_purple_text_med, gen_purple_text_med,
    gen_white_text_med, #date_and_time_string
    {
        font-size:  calc(2vw + 2vh);
    }
    .welcome_text, .gen_blue_text_large, gen_blue_text_large, gen_lightgray_text_large, 
    .gen_gray_text_large, gen_gray_text_large, .gen_green_text_large, gen_green_text_large, 
    .gen_red_text_large, gen_red_text_large, .gen_white_text_large, gen_white_text_large
    {
       font-size: calc(3vw + 3vh);
    }
    button.button_landing_page {
        width: 60vw;
    }
    .button_create {
        margin: calc(1vw + 1vh);
        width: 80vw;
        font-size: calc(3vw + 3vh);
    }
    button.button_test {
       width: 10vw;
       margin: calc(1vw + 1vh);
       width: 40vw;
       font-size: calc(2vw + 2vh);
    }
    img.checkbox_img_med
    {
        width: 30px;
    }
    checkbox_ascii_icon
    {
        font-weight: bold;
        font-size: calc(3vw + 3vh);
    }
    .div_landing_page_features, .div_landing_page_usecases
    {
        display: block;
        width: 85vw; 
    }
    #list_view_table, #calendar_view, #fixed_bar_4_bottom_bg
    {
        width: 100vw;
    }
    
    #fixed_bar_5_calendar_tabs div  {
      width: 30vw;
      font-size: 4vw;
    }

   .vertical_centered
   {
      vertical-align: -30%;
   }
	/*----------------------------------------------------------------------------*/
	/* Below is used when a "screen" width is < 1200px, such as phones */
	@media (orientation: landscape) {

	   .vertical_centered
	   {
	      vertical-align: 0%;
	   }	 

      /* Fixed-Top-Bar tabs; Also see calendar_tabs */
      #fixed_bar_5_calendar_tabs {
        height: 10vh;
        /* Width set in calendar_alerts_script.js */
      }
      #fixed_bar_5_calendar_tabs div  {
        font-size: 3vw;
      }
	}

}
</STYLE>
