/*  DO NOT MAKE CHANGES TO THE STYLESHEET.CSS FILE !!!!  */ /*  changes should only be made to the php file that generates this css file. */   

body
{
    margin            : 0px; 
    background-color  : #dddddd;   /*#3D5B98;*/

}


a,p,td,th          {font-family      : arial,verdana,sans-serif; border  :none;}

.center            { text-align      : center; }


dl
{
    margin            :  5px;
    padding           :  5px;
}

dt
{
    font-weight       :  bold;
    margin-top        :  5px;
}

dd
{
    padding           :  5px;
}


.nobreak, .nobreak td
{
    white-space       : nowrap;
}


.msg_info, 
.msg_warn, 
.msg_good,
.msg_error 
{ 
    overflow          : auto;
    padding           : 10px;
    font-size         : 10pt;
    font-weight       : normal;

}



.msg_error
{
    color             : #CC0000;
    background-color  : #FFCCCC;

}

.msgwarning, 
.msg_warn
{ 
    color             : black;
    background-color  : #FFFF00;
    border            : 1px goldenrod solid;

}

.msgsuccess, 
.msg_good
{
    color             : #008000;
    background-color  : #DDFFDD;
    border            : 1px green solid;
}

.msg_info
{ 
    color             : #000099;
    background-color  : #cbdbf8;
    border            : 1px navy solid;
}


.msg_info img, 
.msg_warn img, 
.msg_good img,
.msg_error img 
{ 
    float:left;
}



.tiny
{
    font-weight       : normal;
    font-size         : 8pt;
    line-height       : 120%;
}


.bodytext
{
    font-family       : arial,verdana,sans-serif;
    font-weight       : normal;
	color             : black;
    background-color  : white;
}

.grey, .gray        { color            : #555555; }
.red                { color            : #FF0000; }
.yellow             { color            : yellow;  }
.new                { background-color : yellow;  }
.hilite             { background-color  : yellow; }


.price
{
    color             : green;
    font-weight       : bold;
}  

span.form_data, div.form_data
{
    background-color  : #DDDDDD;
}


input[type="file"] 
{
    border             : 1px solid #000;
    background-color   : #FFF;
    color              : #AAA;
}


    input[type=radio]:checked + div          /* this hilites the entire radio button description when checked */
    {
            color               : #000000;
            background-color    : #E3F9F0;
    }




    input[type=radio],
    input[type=radio] + div                   /* this puts a border around the entire radio button description */
    {
            display             : inline-block;
            background-color    : inherit;
            vertical-align      : top;
            border-radius       : 10px;
            border-color        : #CCCCCC;
            border-style        : solid;
            border-width        : 1px;
            max-width           : 85%;
            padding             : 2px;
            margin              : 2px;
            overflow            : auto;
            color               : #888888;
            white-space         : normal;
    }

    label
    {
              white-space       : nowrap;        /* this keeps the radio buttons with their labels */
    }

    label .moreinfo
    {
              white-space       : normal;        /* this allows moreinfo text within a label to wrap */
    }




#banner_ad,
#top_bnnr
{
    width               : 100%;
    clear               : both;
  /*box-shadow          : 2px 2px 2px #AAA;*/
    background-color    : white;    /*#3D5B98;*/
    text-align          : center;
}

#top_bnnr a.moreinfo
{
    font-size           : xx-small;
/*  color               : #dddddd;    white;*/
}




#box
{ 
    border-style      : solid; 
	border-color      : navy; 
	background-color  : #FFFFFF; 
	border-width      : 2px 2px 2px 2px;  
	padding           : 10px; 
}

#box2
{ 
    border-style      : solid; 
    border-color      : navy; 
    background-color  : #FFFFFF; 
    border-width      : 2px;  
    padding           : 0px; 
}

#box1
{
    border-style      : solid; 
    border-color      : navy; 
    background-color  : #FFFFFF; 
    border-width      : 1px;  
    padding           : 0px; 
    vertical-align    : top;
}

.boxnav
{ 
    border-style      : solid; 
    border-color      : #0055F0; 
    background-color  : #EFEFEF; 
    background-image  : url(/v2/themes/simple_blue/images/boxes/box7_mid.gif); 
    background-repeat : repeat-y;
    border-width      : 0px;  
    padding-left      : 7px; 
    padding-right     : 7px; 
    margin            : 0px;
    vertical-align    : top;
    font-size         : 10px;
}

#boxgrad
{
    border-style      : solid; 
	border-color      : navy; 
	background-color  : #FFFFFF;
	border-width      : 1px;  
	padding           : 1px; 
	vertical-align    : top;
}


/* label above content/input for responsive small screens*/
/* same label data is shown in 'left' column */

span.primary_info_label  
{
    display           : none;
}

.infoview input, 
.infoview textarea,
.infoview select
{
	padding           : 5px;
	border-radius     : 3px;
	border-style      : solid;
	border-color      : #ddd;
	/*font-size         : larger;*/
}

span.label_text
{
    font-weight       : bold;
}

.infoview .primary_info td,
.infoview .primary_info th
{
    background-color   : #f4f4f4;
}

div.infoview
{
    background-color  : #DDD;
}

td.infoview, div.infoview td
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    background-color  : #FFF;     /*#F7F7F7;*/
	text-align        : left;
	vertical-align    : top;
	min-width         : 66%;
    border-style      : solid;
    border-color      : #FFFFFF;  /*#F7F7FF;*/
    border-width      : 0;
    padding           : 7px 5px 7px 5px;
}

td.infoview span.data
{
    font-weight       : bold;
    color             : black;
    display           : inline-block;
    background-color  : #eee;
    border            : 1px #aaa solid;
    padding           : 5px;
}

th.infoview, div.infoview th.left
{ 
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    font-weight       : bold;
    color             : steelblue;      /*steelblue; */
    background-color  : #FFF;           /*#F7F7FF;             */
    text-align        : right;
    vertical-align    : text-top;
    max-width         : 34%;
    border-style      : solid;
    border-color      : #dddddd;  /*#F7F7FF;*/
    border-width      : 0 1px 0 0;
    padding           : 7px 4px 7px 0;
}

hr.infoview,   div.infoview hr
{
    height            : 1px;
    border-style      : solid;
    border-color      : steelblue;
}

.infoviewX td
{
    background-color  : #eeeeee;
}


.infoviewx table
{
    background-color  : white;
    border            : 2px solid steelblue;;
    width             : 100%;
    border-collapse   : collapse;
}

.infoviewhead, div.infoview .head
{
    background-color  : #DDD;
    font-weight       : bold;
}


th.infoviewhead, #giftshop #form th.infoviewhead , div.infoview th.head
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 16pt;
    font-weight       : bold;
    font-variant      : normal;
    color             : steelblue;
    background-color  : #DDD;
    text-align        : left;
  /*text-transform    : uppercase;*/
    padding           : 15px 0 1px 7px;

}

.sidebar .box_top
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 12pt;
    font-weight       : bold;
    font-variant      : normal;
    color             : steelblue;
    text-align        : center;
    text-transform    : uppercase;
    padding           : 15px 7px;
    background-color  : #CCC;    /*#DDD;*/    /*#4271BD;       */
    border-color      : #CCC;       
    border-width      : 0 0 1px 0; 
    border-style      : solid;      
    box-shadow        : 2px 2px 2px #AAA;
}


.sidebar .box_mid
{ 
    background-color  : #FFFFFF;
    background-repeat : repeat-y;
    padding           : 7px; 
    margin            : 0 0 15px 0;
    vertical-align    : top;
    font-size         : 10px;
    box-shadow        : 2px 2px 2px #AAA;
    text-align        : center;
    border-left       : 2px #ddd solid;
}



.sidebar .box_bottom
{
     display           : none;
}


td.infoviewhead, div.infoview td.head
{
    background-color  : steelblue;
    height            : 1px;
}

th.infoviewsubhead, div.infoview th.subhead  
{
    background-color  : #EDEDED;
    color             : steelblue;
    height            : 12px;
    font-size         : 10pt;
    font-weight       : normal;
    font-variant      : normal;
    text-align        : left;
    text-transform    : uppercase;
    border-width      : 0 0 1px 0; 
    border-style      : solid; 
    border-color      : steelblue; 
}



.moreinfo
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 8pt;
    color             : #555555;
} 


div.coordbox
{ 
    border-color      : #FFD700;
    border-style      : solid;
    border-width      : 2px;
    background-color  : white;
    font-weight       : bold;

}


.coordmode
{ 
    background-color  : #FFD700 !important;
    font-weight       : bold !important;
}

form.coordmode
{
    display           : inline; 
}


a.coordmode:link
{
    color             : black;
    text-decoration   : none;
    text-align        : right;
}


a.coordmode:visited  
{
    color            : black;
    text-decoration  : none;
}

a.coordmode:hover
{
    color             : black;
    text-decoration   : underline;
}
a.coordmode:hover
{
    color             : black;
    text-decoration   : underline;
}

.coordbutton, .coordbuttonvw
{
    font-family       : Arial, Helvetica, sans-serif; 
    font-size         : 12px; 
	color             : #000;                          /*#FFD700; */
    background-color  : #FFD700; /* #F4DB9F; */ 
	border-color      : #000000 #777777 #777777 #000000; 
	border-style      : solid; 
    border-width      : 1px 2px 2px 1px;
    text-decoration   : none;
    text-align        : center;
    margin            : auto;
    display           : inline-block;
}

.coordbutton:hover, .coordbuttonvw:hover
{
    background-color  : white;
    text-decoration   : underline;
}



.coordmenubutton
{
    font-family       : Arial, Helvetica, sans-serif; 
    font-size         : 10px; 
    font-weight       : normal;
    color             : #FFD700; 
    background-color  : #FFD700; /*#dab900;*/
    border            :  #E1B500 #C69E00 #C69E00 #E1B500; 
    border-style      : solid; 
    border-width      : 1px 4px 4px 1px;
    width             : 50px;
    margin            : 3px 1px;
    padding           : 3px;
}

.coordmenubutton a
{
    font-family       : Arial, Helvetica, sans-serif; 
    font-size         : 10px; 
    font-weight       : normal;
    text-decoration   : none;
	color             : #000000; 
    background-color  : #FFD700; /*#dab900;*/
}


.coordmenubutton a:hover
{
    border            :  #6F5800 #9F8000 #9F8000 #6F5800; 
}


.coordbutton        {width             : 120px;}
.coordbuttonvw      
{
    width             : 70px;
    margin            : 1px;
}



.coordbuttonmenu
{
    font-family         : Arial, Helvetica, sans-serif; 
    font-size           : 12px; 
    color               : #000000;
    background-color    : #FFD700; 
    border              : #666666; 
    border-style        : solid; 
    border-top-width    : 1px; 
    border-right-width  : 3px; 
    border-bottom-width : 3px; 
    border-left-width   : 1px; 
    width               : 40px;
}

#coord_menu table.logoncount_table
{
    float               : right;
    white-space         : nowrap;
    border-collapse     : collapse;
}



ul.task
{
    padding-left      : 0;
    margin            : 0 0 0 15px;  
    width             : auto;
}

li.task_need, 
li.task_filled, 
li.task_info,
li.task_private
{
    padding           : 0 0 4px 0;
}


.task_need
{
    color             : red;
    font-family       : verdana, arial,sans-serif;
    font-size         : 7pt;
    text-decoration   : none;
}

a.task_need:hover
{
    text-decoration   : underline; 
}

li.task_need
{
    list-style        : circle;    
    padding-left      : 0;
    margin-left       : 0;
    width             : auto;
}

.need_name
{
    font-weight     : bold;
    display         : inline-flex;
}



.task_filled
{
    color             : green;
    font-family       : verdana, arial,sans-serif;
    font-size         : 7pt;
    text-decoration   : none;
}

a.task_filled:hover   {text-decoration : underline;}
li.task_filled        {list-style      : disc; }


.task_info
{
    color             : blue;
    font-family       : verdana, arial,sans-serif;
    font-size         : 7pt;
    text-decoration   : none;
}

a.task_info:hover     {text-decoration : underline; }
li.task_info          {list-style      : square;    }
a.task_addnew_coord   {background     : yellow; }


a.task_addnew
{
    color             : blue;
    font-family       : verdana, arial,sans-serif;
    font-size         : 8pt;
    text-decoration   : none;
}

a.task_addnew:hover    {color         : red; }


.task_private
{
    color             : purple;
    font-family       : verdana, arial,sans-serif;
    font-size         : 7pt;
    text-decoration   : none;
}

a.task_private:hover   {text-decoration : underline; }


.task_pending
{
    color             : gray;
    font-family       : verdana, arial,sans-serif;
    font-size         : 7pt;
    text-decoration   : none;
}



a.task_pending:hover   {text-decoration : underline;}



#need_view_toggle .active
{
    /* calendar3  */
    background-color   : yellow;
}



#need_ad_box
{
    width              : max-content;
    max-width          : 400px;
    background-color   : #C4FFC4;
    border             : 1px green solid;
    padding            : 3px;
}


.calendar_container
{
    background-color  : white;
    overflow          : hidden
}

.list_container
{
    background-color  : white;
}


/*
.list_container table.calendar_nav
{
     max-width        : 500px;
     margin           : auto;
}
*/

.list_container table.calendar
{
     max-width        : 300px;
     margin           : auto;
   /*background-color : orange;*/

}


table.calendar 
{
    width             : 100%;
    border            : 1px solid #aaaaaa;
    border-collapse   : collapse;
  /*background-color  : white;*/
    background-color  : #eeeeee;
    margin            : auto;
}


tr.dow th 
{
    background-color  : #CCCCCC;
    width             : 100px;
    height            : 15px;
    vertical-align    : top;
    border            : solid 1px #aaaaaa;    
    font-size         : 8pt;             
}


td.day_active, td.day_today, td.day_inactive, td.day_placeholder
{
    height            : 100px;
    vertical-align    : top;
    border            : solid 1px #aaaaaa;
    width             : 14%;
    max-width         : 15%;
    min-width         : 14%;
}

td.day_active         { background-color : white;      }
td.day_placeholder    { background-color : #EEEEEE; }
td.day_inactive       { background-color : #DDDDDD;    }
td.day_today          { background-color : #FFFFb8;       
                        border           : solid 2px #999999;                }


td.cal_datenum
{ 
    color             : black;
    text-align        : left;
    width             : 98px;
    font-family       : verdana, arial, sans-serif;
    font-weight       : bold;
    font-size         : 8pt;
    padding-left      : 3px;
}

td.cal_datenum span.dim
{ 
    color             : #aaaaaa;
}



td.fontmonth
{ 
    color             : black;
    font-size         : 25pt;             /*20pt;*/
    font-family       : arial,verdana,sans-serif;
    font-weight       : bold;
    padding           : 0 10px;
}

td.fonttitle
{
    color             : white;
    font-size         : 16pt;
    font-family       : arial,verdana,sans-serif;
    font-weight       : bold;
    background-color  : #C0C0C0;
}

td.fontusername
{
    color             : black;
    font-size         : 8pt;
    font-family       : arial,verdana,sans-serif;
    font-weight       : normal;
}


.fontzz
{
    color          : yellow;
    font-size      : 8pt;
    font-family    : arial,verdana,sans-serif;
    font-weight    : normal;
}

a.fontzz   
{
    color           : navy;
    font-size       : 8pt;
    font-family     : arial,verdana,sans-serif;
    font-weight     : normal;
    text-decoration : none;
}


a.fontzz:hover        {text-decoration : underline; }
a.fontzz:active       {text-decoration : underline;	}


.leftbar
{ 
    background-color  : white;
    border            : 1px;
}

table.datasection 
{
              width  : 100%;
            padding  : 0px;
       border-style  : solid; 
       border-color  : navy; 
       border-width  : 0;      /*2px 2px 2px 2px;  */
     vertical-align  : top;
    border-collapse  : collapse;
   background-color  : #FFFFFF;
   box-shadow        : 2px 2px 2px #AAA;
}


table.data 
{
    background-color  : #FFFFFF;
    margin            : 20px;
    border-style      : solid; 
    border-color      : navy; 
    border-width      : 2px 2px 2px 2px;  
    vertical-align    : top;
    border-collapse   : collapse;
}


table.summary
{
    width             : 300px;
}


table.summary th
{
    text-align        : left;
    padding           : 0 10px;
    font-weight       : normal;
    width             : 200px;
}


table.summary td
{
    text-align        : right;
    padding           : 0 10px;
    border-style      : solid; 
    border-color      : #dddddd; 
    border-width      : 0 0 0 1px;  
    width             : 100px;
}

table.grid th
{
    text-align        : left;
    padding           : 0 10px;
    font-weight       : normal;
}


table.grid td
{
    text-align        : left;
    padding           : 0 10px;
    border-style      : solid; 
    border-color      : #dddddd; 
    border-width      : 0 0 0 1px;  
    white-space       : nowrap;
}


table.tiny 
{
    border-collapse   : collapse;
}


table.tiny th
{
    font-size         : 8px;   
    text-align        : right;
    padding           : 0 3px;
}

table.tiny td
{
    font-size         : 8px;
    text-align        : center;    /*left;*/
    border-width      : 0 1px;
    border-color      : #555555;
    border-style      : dotted;
    padding           : 0 3px;
}






.xbutton
{
    font-family       : Arial, Helvetica, sans-serif; 
    font-size         : 12px; 
    color             : steelblue; 
    background-color  : #DDD; 
    border            : steelblue; 
    border-style      : solid; 
    border-top-width  : 1px; 
    border-right-width  : 1px; 
    border-bottom-width : 1px; 
    border-left-width   : 1px; 
}

.x2button
{ 
    background-color  : steelblue;
    color             : #DDD; 
    font-weight       : bold;
    background-image  : url(/v2/themes/simple_blue/images/buttongradient2.gif);
}

.button
{ 
    font-weight         : bold;
    color               : white;
    background-color    : green;      
  /*background-image    : url(/v2/themes/simple_blue/images/buttongradient2.gif);*/
    border-radius       : 7px;
    border-color        : white; 
    border-style        : solid; 
    border-top-width    : 1px; 
    border-right-width  : 2px; 
    border-bottom-width : 2px; 
    border-left-width   : 1px; 
}


button.button:focus
{ 
    background-color  : white; 
}


.button_single
{
       margin            : 0;
       padding           : 7px;
       color             : white !important;   
       text-align        : center;
       vertical-align    : top;
       font-family       : Verdana,Arial, Helvetica, sans-serif;
       font-weight       : bold;
       background-color  : green;
       border-radius     : 7px;
     /*max-width         : 30%;*/
       min-width         : 30%;
       text-decoration   : none;
}

 a.button_single:hover
{
       color             : white !important;   
       background-color  : green !important;
       text-decoration   : none  !important;
}

.button_primary
{
       margin            : 0;
       padding           : 7px;
       color             : white;
       text-align        : center;
       vertical-align    : top;
       font-family       : Verdana,Arial, Helvetica, sans-serif;
       font-weight       : bold;
       background-color  : green;
       border-radius     : 7px;
       max-width         : 30%;
       float             : right;
       text-decoration   : none;
}

.button_secondary
{
       margin            : 0;
       padding           : 7px;
       color             : green;
       text-align        : center;
       vertical-align    : top;
       font-family       : Verdana,Arial, Helvetica, sans-serif;
       font-weight       : normal;
       background-color  : #eeeeee;
       border-radius     : 7px;
       max-width         : 30%;
       float             : left;
       text-decoration   : none;
}


div.button_month_nav
{
       margin            : 2px;
       padding           : 10px 2px;
       color             : white;          /*#B8CBE7;*/ 
       font-size         : 12px;
       text-align        : center;
       vertical-align    : top;
       font-family       : Verdana,Arial, Helvetica, sans-serif;
       font-weight       : bold;             /*normal;*/
       background-color  : #4271BD;          /*#00D500;*/
       border-radius     : 3px;
       text-decoration   : none;
       max-width         : 200px;            /*100px;*/
}

div.button_month_nav_disabled

{
       margin            : 2px;
       padding           : 10px 2px;
       color             : white;
       font-size         : 12px;
       text-align        : center;
       vertical-align    : top;
       font-family       : Verdana,Arial, Helvetica, sans-serif;
       font-weight       : bold;
       background-color  : lightgray;
       border-radius     : 3px;
       text-decoration   : none;
       max-width         : 200px;
}

a.button_month_nav
{
       text-decoration   : none;
}



#main_content_wrapper
{
    background-color    : #efefef;   /*#3D5B98;*/
  /*margin-top          : 30px;*/
    overflow            : hidden;
}


#main_content_wrapper .BAN468
{
    margin-top          : 70px;
}

#main_content_wrapper .BAN730
{
    margin-top          : 115px;
}

#main_content_wrapper .SQ125
{
    margin-top          : 0px;
}

#main_content
{
    /*box-shadow     : 2px 2px 2px #aaa;*/
    /*border-left    : 1px solid #aaa;*/
    padding          : 0 10px;
    background-color : #efefef;
}


    td.sidebar 
    {
        width              : 220px;
        vertical-align     : top;
      /*background-color   : #C0C0C0;*/
        padding-right      : 15px; 
      /*border-style       : solid;*/
        border-width       : 0;
      /*border-right-width : 1px;*/
      /*border-color       : #A0A0A0;*/
        border-color       : #C0C0C0;
    }


.sidebar .box_mid a
{
    color             : black;  /*steelblue;*/
    font-family       : verdana, arial,sans-serif;
    font-size         : 10pt;
}

.sidebar .box_mid a:hover
{
    background-color  : #DDDDDD;
    text-decoration   : underline;
}

.sidebar .box_mid a:active
{
    text-decoration   : none;
}

.sidebar .box_mid ul
{
    list-style-position : outside;
    list-style-type   : disc;
    padding-left      : 0;
    margin-left       : 20px;  
    margin-top        : 0px;
    margin-bottom     : 0px;
}

.sidebar .box_mid li
{
    color             : steelblue;
    margin-left       : 0;
    padding           : 0;
    text-indent       : 1px;
}


             					  
#box li               { padding      : 5px; }             				


#menu_icon_bar
{
    width             : auto;
/*  background-image  : url(/v2/themes/simple_blue/images/buttongradient2.gif);  */
/*  background-repeat : repeat-x;  */
/*  background-color  : #BFD3EE;   */
    background-color  : #DDDDDD;      /*#4682B4;*/
    height            : 66px;
  /*overflow          : auto;*/
}

div.icon_hilite
{
     height           : 15px;
     clear            : both;
     background-color : #FFFFFF;
}

/* ***********
#icon_bar
{
    width             : auto;
    background-image  : url(/v2/themes/simple_blue/images/buttongradient2.gif);
    background-repeat : repeat-x;
    background-color  : #BFD3EE;
    overflow          : auto;
}
********** */


#icon_bar ul
{
    list-style        : none;
    padding           : 0.1em 0;
    margin            : 0;
    width             : auto;   /*710px;*/
    white-space       : nowrap;

/*  background-image  : url(/v2/themes/simple_blue/images/buttongradient2.gif);  */
/*  background-repeat : repeat-x;  */
/*  background-color  : #BFD3EE;   */

}

#icon_bar ul li
{
    display           : inline;
    white-space       : nowrap;
    float             : left; 
    width             : 16.5%;

    border-width      : 1px 1px 0 0;
    border-style      : solid;
    border-color      : #AAA;

/*  background-image  : url(/v2/themes/simple_blue/images/buttongradient2.gif); */
/*  background-repeat : repeat-x; */
/*  background-color  : #BFD3EE;  */

/*  background-color  : #4682B4;  */  /*#BFD3EE;*/

} 

#icon_bar ul li a
{
    color             : navy;
    font-size         : 8pt;
    font-family       : arial,verdana,sans-serif;
    font-weight       : normal;
    text-align        : center;
    text-decoration   : none;
    display           : block;
  /*width             : 100px;
    border-color      : #88A9DA; 
    border-style      : solid; 
    border-width      : 0 1px 0 1px; */
    margin            : 0;
    white-space       : nowrap;
}

#icon_bar ul li a:hover
{
    text-decoration    : none;
    background-color   : #aaaaaa;  /*#4682B4;*/   /*#88A9DA;*/
}

#icon_bar ul li a img
{
    height             : 50px;
}

#icon_bar .icon_hilite
{
    background-color   : white;   /*#4682B4;*/
}




#coord_menu
{
    width            : 100%;
    background-color : #FFD700;
    margin-top       : 3px;
    padding          : 0;
    white-space      : nowrap;
}

#coord_menu div.left
{
    font-weight     : bold;
    text-align      : left;
    float           : left;
    background-color : #FFD700;
    width           : 100px;
}

#coord_menu div.middle  
{
    text-align      : center;
    background-color : #FFD700;
    width           : auto;
    padding         : 0 0 30px 0;

}

#coord_menu div.right
{
    text-align      : right;
    float           : right;
    background-color : #FFD700;
    width           : 300px;
}


#coord_menu ul
{
    padding         : 0.2em 0;
    margin          : 0;
    width           : 100%;
    list-style-type : none;
    color           : #000;
    background-color : #FFD700;
    white-space     : nowrap;
}

#coord_menu ul li
{
    display         : inline;
}

#coord_menu ul li a
{
    
    text-decoration   : none;
    font-family       : Arial, Helvetica, sans-serif; 
    font-size         : 10px; 
    font-weight       : normal;
    color             : #000; 
    background-color  : #FFD700; 
    border            :  #E1B500 #C69E00 #C69E00 #E1B500; 
    border-style      : solid; 
    border-width      : 1px 2px 2px 1px;
    width             : 50px;
    margin            : 3px 1px;
    padding           : 3px;
}

#coord_menu ul li a:hover
{
    text-decoration   : underline;
    background-color  : white;
}



.menu_count
{
       border-radius   : 50%;
       background-color: #4271BD;
       color           : white;
       font-size       : 10px;
       padding         : 2px;
       width           : 13px;
       height          : 13px;
       display         : inline-block;
       text-align      : center;
}








/*  ----------------- */
/*  header and footer */
/*  ----------------- */



#header_fixed
{
    position            : fixed;
    top                 : 0;
    width               : 100%;
    background-color    : white;
    z-index             : 99;
    box-shadow          : 2px 2px 2px #AAA;
}

#header_not_fixed
{
    top                 : 0;
    width               : 100%;
    background-color    : white;
    z-index             : 99;
    overflow            : auto;
}

#content_fixed
{
    margin              : 200px;
}

#content_not_fixed
{
    margin              : 0;
}


a.head1
{
    color             : black;
    font-size         : 8pt;
}

a.head2
{
    color             : white;
    font-size         : 8pt;
}

td.head1
{
    background-color  : white;
    color             : #4682B4;
    font-size         : 14pt;
}

td.head2
{
    background-color  : #dddddd;
    color             : black;
    font-size         : 18pt;
}

td.head3
{
    background-color  : #dddddd;
    color             : black;
    font-size         : 8pt;
}

.headusername
{
    background-color  : white;
    color             : #B22222;
    font-weight       : bold;
    font-size         : 10pt;
    padding           : 0 5px;
}

#foot
{
    background-color  : #dddddd;     /*#6E6E6E;*/
    padding           : 15px 0;
    color             : #888;      /*#000000;   */
    font-family       : arial,verdana,sans-serif;
    font-size         : 8pt;
    text-align        : center;

}

#foot a
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 8pt;
    text-align        : center;
    text-decoration   : none;
    color             : #000;
    font-weight       : bold;
}

#foot a:hover
{
    text-decoration   : underline;
}


#share_box_footer
{
    background-color  : #fffccc;
    font-size         : 7pt;
    text-align        : center;
    border            : 2px solid black;
}


#giftshop td
{
    vertical-align    : bottom;
}


#giftshop img.card
{
    height            : 110px;
    width             : auto;
}

#giftshop img.bigcard
{
    border-color      : #DDDDDD; 
    border-style      : solid; 
    border-width      : 1px; 
    margin            : 0 20px 0 0;
    max-width         : 350px;
}


#giftshop #form th
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    font-weight       : bold;
    color             : steelblue; 
    background-color  : #FFFFFF;           
    text-align        : right;
    vertical-align    : text-top;
    text-transform    : uppercase;
}

#giftshop #form  td
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    background-color  : #FFFFFF;
    text-align        : left;
    vertical-align    : top;
    border-style      : solid;
    border-color      : #F7F7FF;
    border-width      : 0 0 1px 0;
}

#giftshop  th
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    font-weight       : bold;
    color             : steelblue; 
    background-color  : #FFFFFF;           
    text-align        : left;
    vertical-align    : text-top;
}

#giftshop  td
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    background-color  : #FFFFFF;
    text-align        : left;
    vertical-align    : top;
  /*padding           : 0 0 0 10px;*/
    padding           : 10px;
    border-style      : solid;
    border-color      : #F7F7FF;
    border-width      : 0 0 1px 0;
}


#giftshop  table.card_words td
{
    text-align        : center;
}

#giftshop  table.card_words th
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    font-weight       : bold;
    color             : steelblue; 
    background-color  : #DDD;
    vertical-align    : text-top;
    text-align        : center;
}



#giftshop  #envelope
{
    padding           : 0 3px;
    border-color      : #AAAAAA;
    border-style      : solid;
    border-width      : 1px;
    width             : 650px;
    border            : solid 1px #000000;
    background-color  : #FFFFFF;
}

#giftshop  #envelope span.form_data      
{
    background-color  : #FFFFFF;
}



#giftshop  #env_to
{
    padding           : 3px;
    margin-left       : 200px;
    margin-top        : 50px;
    margin-bottom     : 20px;
    clear             : left;
    font-family       : sans-serif;
    font-size         : 14px;
    width             : 300px;
}

#giftshop  #env_return
{
    padding           : 1px;
    margin-left       : 1px;
    float             : left;
    clear             : left;
    font-family       : sans-serif;
    font-size         : 12px;
    width             : 300px;
}

#giftshop  #env_stamp
{
    float             : right;
    padding           : 1px;
    width             : 76px;
}

#giftshop  #env_stamp img
{
    width             : 70px;
}



div.breadcrumbs
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    color             : steelblue; 
    background-color  : #DDD;
    border-style      : solid;
    border-color      : navy;
    border-width      : 0 0 1px 0;
    padding           : 3px 0 2px 5px;

}



.breadcrumbs, .breadcrumbs a
{
    font-family       : arial,verdana,sans-serif;
    font-size         : 9pt;
    color             : steelblue; 
    background-color  : #DDD;
    text-decoration   : none;
}

.breadcrumbs a:hover
{
    text-decoration   : underline;
}

tr.row00,
tr.row00 th,
tr.row00 td
{
    font-family       : arial,verdana,sans-serif;
    background-color  : #E5E5FF;  
    vertical-align    : top;
    text-align        : left;
    font-size         : 12px;
    font-weight       : bold;
    border-color      : #AAAAAA;
    border-style      : solid;
    border-width      : 1px 0;
}


tr.row1
{
    font-family       : arial,verdana,sans-serif;
    background-color  : white; 
    text-align        : left;
    font-size         : 12px;
}

tr.row0
{
    font-family       : arial,verdana,sans-serif;
    background-color  : #EEEEEE;
    text-align        : left;
    font-size         : 12px;
}

tr.row0 td, tr.row1 td
{
    padding           : 0 3px;
    border-color      : #DDDDDD;
    border-style      : solid;
    border-width      : 0 1px;
    white-space       : nowrap;
}


/*   FORM STYLING  */




fieldset
{ 
    background-color  : #efefef;
    position          : relative; 
 /* margin            : 1em 10px 0 10px; */
    padding           : 1.75em 0; 
} 

fieldset legend 
{
  /*position          : absolute; */
    top               : -.5em; left: .5em;
    font-family       : arial;
    font-weight       : bold;
    font-size         : 12pt;
    color             : #000000;
    text-transform    : uppercase;
  /*padding           : 0;  */
}


fieldset label 
{
    display           : block;
    float             : left;
    text-align        : right;
    width             : 150px;
    font-family       : arial;
    font-weight       : bold;
    color             : navy;
    font-size         : 10pt;
    margin            : 0 10px 0 0;
}


fieldset span.moreinfo
{
    display           : block;
    float             : left;
    text-align        : left;
    font-size         : 9pt;
    color             : #555555;
    font-family       : arial;
}


fieldset .datablock
{
    display           : block;
    float             : left;
    text-align        : left;
    font-size         : 10pt;
    color             : #000000;
    font-family       : arial;
}


   .year_same
    {
              background-color   : initial;
              color              : initial;
    }

   .year_different
    {
              background-color   : yellow;
              color              : black;
    }



    .latestnews_title 
    {
        font-family  : arial;
        font-size    : 10pt;
        font-weight  : bold;
        color        : navy;
    }

    .latestnews_time
    {
        font-family  : arial;
        font-size    : 7pt;
        color        : 888888;
    }

    .latestnews_txtbody
    {
        font-family  : arial;
        font-size    : 8pt;
        color        : black;
        display      : table;
        table-layout : fixed;
        width        : 95%;
        word-wrap    : break-word;
    }

    .card,
    .news_story_wrapper
    {
         clear            : both;
         float            : left;
         background-color : white;
         border           : 1px solid #aaaaaa;
         width            : 100%;
         margin           : 10px 0;
         padding          : 10px 0;

    }

    .card_title,
    .card_author,
    .news_title,
    .news_author 
    {
        display       : block;
        font-family   : helvetica,arial,verdana,sans-serif;
        font-size     : 13pt;
        font-weight   : bold;
        color         : black;
        text-align    : left;
    }

    .card_icon,
    .news_icon
    {
        font-size        : 25pt;
        font-family      : helvetica,arial,verdana,sans-serif;
        text-transform   : uppercase;
        font-weight      : bold;
        display          : block;
        float            : left;
        margin           : 0 10px;
        background-color : #a7a7ad;
        border-radius    : 50%;
      /*border-color     : #a7a7ad;*/
      /*border-style     : solid;  */
        height           : 40px;
        width            : 40px;
        text-align       : center;
        color            : white;
    }

    .card_icon img,
    .news_icon img
    {
        height           : 30px;
        width            : 30px;
      /*background-color : #7be3f9;*/
      /*border-radius    : 50%;*/
        border-style     : hidden;
        padding          : 5px;
      /*margin           : -5px;*/
    }
					 
    .card_date,
    .news_date
    {
          display       : block;
          font-family   : helvetica,arial,verdana,sans-serif;
          font-size     : 8pt;
          font-weight   : normal;
          color         : #777777;  /*#999999;*/
          text-align    : left;
    }

    .card_body,
    .news_text
    {
          display      : table;
          table-layout : fixed;
          clear        : both;
          float        : left;
          width        : 95%;
          font-family  : helvetica,arial,verdana,sans-serif;
          font-size    : 12pt;
          font-weight  : normal;
          color        : black;
          text-align   : left;
        /*display      : inline-block;*/
        /*word-break   : break-all;*/
          margin       : 20px 0 0 10px;
          word-wrap    : break-word;
    }
					 
    .card_head,
    .news_head
    {
          float         : left;
          width         : 100%;
          margin        : 0 10px;
    }

    .card_buttons
    {
          float         : right;
          padding-right : 10px;
    }

    .invalid,
    input.invalid,
    textarea.invalid

    {
          border           : 2px solid red;
          background-color : #FFCCCC;
    }

    span.email_error
    {
          color            : #CC0000;
          background-color : #FFCCCC;
    }



/*  ----------------------------------------- */
/*  the elements in this section are for use  */
/*  on a small screen, like a phone           */
/*  HIDE these elements from the normal page  */
/*  they will be made visible by another      */
/*  stylesheet (like: stylesheet_mobile.css)  */
/*  when appropriate                          */
/*  ----------------------------------------- */

#menu_mobile
{
    display          : none;
}

#sponsor_mobile
{
    display          : none;
}

a.task_addnew_small img
{
    display         : none;
} 


#share_box_footer
{
    display           : none;
}

/*  ----------------------------------------- */
/*  end of hidden elements for mobile devices */
/*  ----------------------------------------- */



/* -------------------------------------*/
/* VISIBLE ONLY ON CERTAIN SIZE SCREENS */
/* -----------  W I P  -----------------*/
/* -------------------------------------*/
/* xsmall = < 768px                     */
/* small  = 768px - 991px               */
/* medium = 992px - 1199px              */
/* large  = > 1200px                    */
/* -------------------------------------*/


/*  XSMALL  */

@media screen 
   and (max-width: 768px) 
{
    .display-small,
    .display-medium,
    .display-large      {display      : none;   }
    span.display-xsmall {display      : inline; }
    div.display-xsmall  {display      : block;  }
}


/*  SMALL  */

@media screen 
   and (min-width: 768px)
   and (max-width: 991px) 
{
    .display-xsmall,
    .display-medium,
    .display-large      {display      : none;   }
    span.display-small  {display      : inline; }
    div.display-small   {display      : block;  }
}


/*  MEDIUM  */

@media screen 
   and (min-width: 992px)
   and (max-width: 1199px) 
{
    .display-xsmall,
    .display-small,
    .display-large      {display      : none;   }
    span.display-medium {display      : inline; }
    div.display-medium  {display      : block;  }
}


/*  LARGE  */

@media screen 
   and (min-width: 1200px)
{
    .display-xsmall,
    .display-small,
    .display-medium     {display      : none;   }
    span.display-large  {display      : inline; }
    div.display-large   {display      : block;  }
}


// A2HS code from https://gist.github.com/jsanta/9745813617f78bc6a21ce5a24fb0039e

      .ad2hs-prompt {
        background-color: rgb(59, 134, 196); /* Blue */
        border: none;
        display: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        font-size: 16px;
        position: absolute;
        margin: 0 1rem 1rem;
        left: 0;
        right: 0;
        bottom: 0;
        width: calc(100% - 32px);
      }
      
      .ios-prompt {
        background-color: #fcfcfc;
        border: 1px solid #666;
        display: none;
        padding: 0.8rem 1rem 0 0.5rem;
        text-decoration: none;
        font-size: 16px;
        color: #555;
        position: absolute;
        margin: 0 auto 1rem;
        left: 1rem;
        right: 1rem;
        bottom: 0;
      }