/*******************************************************/
/* font-size:16px - not supported in Internet Explorer */
/* font-size:2.5em - supported in all browsers         */
/*******************************************************/                                                 

/* Ids (#) are to be used only once in your html layout. Classes (.) can be used multiple times. */

@media all {
 * {
    /* Clears the below default settings for all browsers */
    margin: 0;
    padding: 0;
    border: 0;
   }

 html, body {
     width: 100%; 
     max-width: 100%; 
   } 
}

html
{
 overflow-y:scroll; /* include vertical scroll bar even if scroll not required to small height of page*/
}

body
{
font-family: Verdana, San-Serif;
font-size:0.8em;
text-align:left;
background-color: white;
/* color: #666666; */ /* blackish color */
color: #454545; /* blackish color */
/*
  overflow: hidden;
  *overflow: visible;
  zoom: 1;
*/
}

#search-button-input
{
 border-top:thin solid #e5e5e5;
 border-bottom:thin solid  #e5e5e5;
 border-left:0;
 border-right:thin solid  #e5e5e5;

 /*box-shadow:0px 1px 1px 1px #e5e5e5;*/
 /* background-color: #FFE0B2; */
 background-color: #E6EDFF;

 float:right;
 height:29px;
 width:40px; 
}


#search-text-input
{
 border-top:thin solid  #e5e5e5;
 border-right:0;
 border-bottom:thin solid  #e5e5e5;
 border-left:thin solid  #e5e5e5;
 /*box-shadow:0px 1px 1px 1px #e5e5e5;*/
 /*background-color: #FFE0B2; */

 background-color: #E6EDFF;

 /* font-family: Tahoma, sans-serif; */
 font-family: verdana, san-Serif;
 font-size: 1.2em;
 font-style:italic;
 float:right;
 height:29px;
 outline:0;
 padding:.4em 0 .4em .6em;
 width:250px;

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}


input[type="checkbox"] {
  margin-top: 2px;
  margin-bottom: 2px;
  margin-right: 2px;
  margin-left: 2px
  line-height: normal;
}

input[type="checkbox"] {
  /*width: 4em;
  height: 4em;*/
  border:1px solid; /* Border width, style */
}

input[type="checkbox"][disabled],
input[type="checkbox"][readonly] {
  /* background-color: transparent; */
}

select {
    padding:3px;
    margin: 0px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    border: 1px solid #fff;

    /*
    -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    */
    /*
    background: #f8f8f8;
    color:#888;
    */

    display: inline-block;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    cursor:pointer;
}
         
#button-holder
{
 background-color: #FFE0B2;
 border-top:thin solid #e5e5e5;
 border-bottom:thin solid  #e5e5e5;
 border-left:0;
 border-right:thin solid  #e5e5e5;
 /*box-shadow:1px 1px 1px 1px #e5e5e5;*/
 cursor:pointer;
 float:left;
 height:27px;
 text-align:center; 
 width:40px; 
}

#search-button-input img
{
 height:15px;
 width:15px;  
}
         
#button-holder img
{
 margin-top: 5px;
 margin-bottom: 5px;
 margin-right: 1px;
 margin-left: 1px;
 width:15px; 
}

div.container
{
 /*width: 1366px;*/
 /*width: 1280px;*/
 width: 1024px;
 margin-left: auto;
 margin-right: auto;
}

#Processing 
{
z-index: 99999;
position: fixed;
top: 0px;
left: 0px;
bottom: 0;
right: 0;
width: 100%;
height: 100%;

/* 
text-align: center;
font-size: 1.5em;
font-weight: bolder;
*/

filter: alpha(opacity=70);    
opacity: 0.7;
display: none;
border-style: none;
/* background-color: #ccc; */
/* background-color:#666666; */
/* background-color: white; */
background-color: #F8F8F8;
background-image: url("../images/processing10.gif"); 
background-repeat: no-repeat;
background-attachment: scroll;
background-position: center, center;
}

fieldset 
{   
  display: block;
  margin-left: 2px;
  margin-right: 2px;
  padding-top: 0.35em;
  padding-bottom: 0.625em;
  padding-left: 0.75em;
  padding-right: 0.75em;

  border:1px solid #82CAFA; 
 /* border:1px solid #DBDBE6; */
}

div.mycontent01 
{   
 width: 95%; 
}

.enabled01 {
 background-color:white;
 font-family: verdana, sans-serif;

 /* Sets the width of the textarea to the size of the box */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 display:block;/*reset from inline*/
 width:100%;
 margin:0;/*remove defaults*/
 padding:4px;
 /*    background:#EEF;*/
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.enabled02 {
 background-color:white;
 font-family: verdana, sans-serif;
 margin:0;/*remove defaults*/
 padding:4px;
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.enabled03 {
 background-color:white;
 font-family: verdana, sans-serif;
 /*font-size:1.2em;*/
 font-size: 14px;
 margin:0;/*remove defaults*/
 padding:4px;
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.enabled04 {
 /* May not be in use - was shopping list "add item" button */
 font-family: verdana, sans-serif;
 margin:0;/*remove defaults*/
 padding:4px;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

}

.readOnly01 {

 /*  CSS Styling is now case-sensitive - Mar 14, 2017 */
 /* Created readOnly01 and readonly01. Will eventually remove readonly01 after reviewing code */

 background-color:#dddddd;
 font-family: verdana, sans-serif;

 /* Sets the width of the textarea to the size of the box */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 display:block;/*reset from inline*/
 width:100%;
 margin:0;/*remove defaults*/
 padding:4px;
 /*    background:#EEF;*/
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.readonly01 {

 /*  CSS Styling is now case-sensitive - Mar 14, 2017 */
 /* Created readOnly01 and readonly01. Will eventually remove readonly01 after reviewing code */

 background-color:#dddddd;
 font-family: verdana, sans-serif;

 /* Sets the width of the textarea to the size of the box */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 display:block;/*reset from inline*/
 width:100%;
 margin:0;/*remove defaults*/
 padding:4px;
 /*    background:#EEF;*/
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.readOnly02 {
 /*  CSS Styling is now case-sensitive - Mar 14, 2017 */
 /* Created readOnly02 and readonly02. Will eventually remove readonly02 after reviewing code */

 background-color:#dddddd;
 font-family: verdana, sans-serif;
 margin:0;/*remove defaults*/
 padding:4px;
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}

.readonly02 {
 /*  CSS Styling is now case-sensitive - Mar 14, 2017 */
 /* Created readOnly02 and readonly02. Will eventually remove readonly02 after reviewing code */

 background-color:#dddddd;
 font-family: verdana, sans-serif;
 margin:0;/*remove defaults*/
 padding:4px;
 border:1px solid #333;
 overflow-y:auto;/*resets IE*/
 overflow-x:hidden;/*resets IE*/

 -webkit-appearance: none; /* Format buttons in Safari */
  border-radius: 0; /* Format buttons in Safari */
}


div.MyMsg
{
 /*font-size:1.0em;*/
 font-size: 14px;
 font-weight:bold;
 clear: both;
 width: 100%;
 height: 10px; 
 text-align:center;
 /* color:black; */
 color:green;
 padding-bottom:5px;
}

div.MyMsg01
{
 /*font-size:1.0em;*/
 font-size: 14px;
 font-weight:bold;
 clear: both;
 width: 100%;
 height: 10px; 
 text-align:center;
 color:red;
 padding-bottom:5px;
}

div.header01 
{   
 float: left;
 width: 20%;/* 20% as the remainder % will be used by other divs */
 padding-top:15px;
 padding-bottom:0px;
 background-color:inherit;

}

div.header02 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 background-color:inherit;
 padding-top:0px;
 padding-bottom:0px;
 padding-left:10px;
 padding-right:10px;
}

div.header03 
{   
 float: left;
 width: 40%;
 /*text-align: justify;*/

 text-align: right;

 padding-top:5px;
 padding-bottom:0px;
 background-color:inherit;

}

div.header04 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:5px;
 padding-bottom:2px;
}

div.header05 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:5px;
 padding-bottom:0px;
}

div.header05 label.lblClass01 
{
 font-weight:bold;
 /* color:blue; */
 /* color:#3333FF; */
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.header05 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.header05 a:hover
{
 text-decoration:underline;
}

div.header05 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.header05 a:visited
{
 /* color:blue; */
 color:#3333FF;

}

div.header06 
{   
 float: left;
 width: 40%; /* % as the remainder % will be used by other divs */
 padding-top:15px;
 padding-bottom:0px;
 background-color:inherit;
}

.InputClass01
{
 font-family: verdana, sans-serif;
 font-size: 1.5em;
 font-style:italic;
 border-style:none;
 background-color: #E6EDFF;
 width: 250px;
 border-radius: 10px; 

 -webkit-appearance: none; /* Format buttons in Safari */
}

.InputClass02
{
 font-family: verdana, sans-serif;
 /* color: black; */
 color: #454545; /* blackish */
 background: #E6EDFF;
 border: 2px outset white;
 border-radius: 2px;
 width: 160px;
 font-weight: bold;
 padding: 5px;

 -webkit-appearance: none; /* Format buttons in Safari */
}

.InputClass03
{
 font-family: verdana, sans-serif;
 color: white;
 background: #E6EDFF;
 border: 2px outset white;
 border-radius: 2px;
 width: 160px;
 font-weight: bold;
 padding: 5px;

 -webkit-appearance: none; /* Format buttons in Safari */
}

.InputClass04
{
 font-family: verdana, sans-serif;
 /* font-size: 1.2em; */
 font-size: 15px;
 font-weight: bold;
 /* color: black; */
 color: #454545; /* blackish */
 background: #E6EDFF;

 /* The border property is a shorthand for the following individual border properties: border-width, border-style (required), border-color */
 border: 2px outset white;

 border-radius: 2px;
 width: 30px;
 height: 30px;
 padding: 5px;

 -webkit-appearance: none; /* Format buttons in Safari */
}

.InputClass05
{
 font-family: verdana, sans-serif;
 /* color: black; */
 color: #454545; /* blackish */
 background: white; 
 border-style:none;

 /*border: 2px outset black;*/
 /*border-radius: 2px;*/
 width: 150px;
 font-weight: bold;
 padding: 5px;
 text-align: center;

 -webkit-appearance: none; /* Format buttons in Safari */
 border-radius: 0; /* Format buttons in Safari */
}

.InputClass06
{
 font-family: verdana, sans-serif;
 /* color: black; */
 color: #454545; /* blackish */
 background: #E6EDFF;
 border: 1px outset white;
 border-radius: 2px;
 /*width: 150px;*/
 font-weight: bold;
 padding: 5px;

 -webkit-appearance: none; /* Format buttons in Safari */
}

.InputClass07
{
 font-family: verdana, sans-serif;
 /* color: black; */
 color: white;
 background: #E6EDFF;
 border: 1px outset white;
 border-radius: 2px;
 /*width: 150px;*/
 font-weight: bold;
 padding: 5px;

 -webkit-appearance: none; /* Format buttons in Safari */
}

div.content01 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:0px;
 padding-bottom:0px;
 /* background-color:inherit;
 background-color:red; */
}

div.content02 
{   
 float: right;
 width: 20%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:0px;
 padding-bottom:0px;
 /* background-color:inherit; */
 min-height: 800px; /* Set minimum height as page widens on iPad if height is less than 800px */
}

div.content02 img
{
 margin-right: 0px;
 margin-top: 0px;
 margin-bottom: 0px;
 margin-left: 0px;

  display: block; /* Centre image */
  margin-left: auto; /* Centre image */
  margin-right: auto; /* Centre image */
}

div.content03 
{   
 float: left;
 width: 80%;
 /*height:250px;*/
 text-align: justify;
 padding-top:0px;
 padding-bottom:0px;
 /* background-color:inherit;
 background-color:yellow; */
}

div.content04 
{   
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 height:250px; 
 padding-top:0px;
 padding-bottom:0px;
}

div.content05 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 /* height:70px; */
 height:100px;
 padding-top:0px;
 padding-bottom:0px;
}

div.content05 img
{
 margin-right: 0px;
 margin-top: 4px;
 margin-bottom: 0px;
 margin-left: 0px;

  display: block; /* Centre image */
  margin-left: auto; /* Centre image */
  margin-right: auto; /* Centre image */
}

div.content06 
{   
 float: left;
 width: 80%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:0px;
 padding-bottom:0px;
 min-height: 800px; /* Set minimum height as page widens on iPad if height is less than 800px */
}

div.content07 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 height:25px; 
 padding-top:0px;
 padding-bottom:0px;
 background-color:inherit;
}


div.content08 
{   
 float: left;
 width: 100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 padding-top:0x;
 padding-bottom:0px;
 margin-top:0px;
 margin-bottom:10px;

 border-color: blue;
 /* border-color: #E6EDFF; */
 border-style: solid;
 border-width: 2px 0px 1px 0px;
}

div.footer01 
{   
 clear: both;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 /*height:10px; */
 /* font-size:0.9em; */
 font-size:11px; 
 text-align:center;
 padding-top:5px;
 padding-bottom:5px;
}

div.footer02 
{   
 clear: both;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 /*height:10px;*/ 
 text-align:center;
 padding-top:5px;
 padding-bottom:5px;
}

div.footer02 label.lblClass01 
{
 /* font-size:inherit; */
 font-size:11px; 
 font-weight:bold;
 /* color:blue; */
 /*color:#3333FF;*/
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.footer02 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.footer02 a:hover
{
 text-decoration:underline;
}

div.footer02 a:link
{
 /*color:blue;*/
 color:#3333FF;
}

div.footer02 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.footer03 
{   
 float: left;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-top:5px;
 padding-bottom:5px;
 text-align: center;
}

.imageBox01 
{
          display: inline-block; 
         /* border: 1px solid grey; */
         border:0px;
         /* background: silver; */ 
 padding-top:5px;
 padding-bottom:5px;
 padding-left:2px;
 padding-right:2px;

         text-align: center; 
         /* font-size: 10px; */
}
 

#mycontainer {
 float: left;
/* border: 1px solid black;
 border-style: solid none solid none; 
 border-style: solid solid solid solid; */

 border: none;
 padding-top:2px;
 padding-bottom:2px;
 padding-left:10px;
 padding-right:10px;
 width:100%;
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 /* height: 100%; */
 /*background-color:inherit;*/
}

#mymenusidebar {
/* NOT USED */
 float: left;
 border-radius: 5px; 
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 margin-right: 1px;
 margin-top: 1px;
 margin-bottom: 1px;
 margin-left: 1px;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 15%;
 height: 250px;
 background-color:inherit;
}

#mycontent {
/* NOT USED */
 float: right;

 border-radius: 5px; 
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 margin-right: 1px;
 margin-top: 1px;
 margin-bottom: 1px;
 margin-left: 1px;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 83%; /* Borders takes additonal 1% */ 
 height: 250px;
 /* padding-left: 1px; */
 background-color:inherit;
}


div.mybox01
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 border-radius: 5px; 
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 15%;
 min-height: 250px;
 float: left;
}

div.mybox02
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 border-radius: 5px; 
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 65%;
 min-height: 250px;
 float: left;
}

div.mybox03
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 width: 50%;
 float: left;
}

div.mybox03 label.lblHeader01 
{ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox03 label.lblHeader02 
{ 
 font-size: 14px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}


div.mybox04
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 25%;

 float: left;
}

div.mybox04 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox04 label.lblHeader02 
{   
 /* width: 25%; */
 font-weight:bold;
 text-align: left;
 padding-right:0px;
 display: inline-block;
}

div.mybox05
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 width: 50%;
 float: right;
}

div.mybox05 label.lblHeader01 
{ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox06
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 33.33%;

/*
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
*/

 float: left;
}

div.mybox06 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox06 label.lblHeader02 
{   
 /* width: 25%; */
 font-weight:bold;
 text-align: left;
 padding-right:0px;
 display: inline-block;
}


div.mybox07
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 30%;

 float: left;
}

div.mybox08
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 40%;

 text-align:center;

 float: left;
}

div.mybox09
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 100%;

 float: left;
}

div.mybox09 label.lblHeader01 
{ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox09 label.lblHeader02 
{ 
 font-size: 14px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox09 label.lblHeader03 
{
 font-size: 14px;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox09 label.lblHeader04 
{
 font-size: 14px;
 font-weight:700;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox10
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 /*width: 300px;*/
 float: left;

 border-radius: 5px; 
 border-top: 0px solid #82CAFA;
 border-right: 0px solid #82CAFA;
 border-bottom: 0px solid #82CAFA;
 border-left: 0px solid #82CAFA;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;

}

div.mybox10 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox10 label.lblHeader02 
{   
 /* width: 25%; */
 font-weight:bold;
 text-align: left;
 padding-right:0px;
 display: inline-block;
}

div.mybox10 img
{
 /* Sets image size */
 max-width: 260px;
 max-height: 260px;
 min-width: 260px;
 min-height: 260px;
}


div.mybox11A
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 border-top: 0px solid #82CAFA;
 border-right: 0px solid #82CAFA;
 border-bottom: 0px solid #82CAFA;
 border-left: 0px solid #82CAFA;

 padding-right: 1px;
 padding-top: 1px;
 padding-bottom: 1px;
 padding-left: 1px;

 width: 40%;

 /* text-align:center; */
 float: left;
}

div.mybox11A img
{
 /* Sets image size */
 max-width: 260px;
 max-height: 260px;
 min-width: 260px;
 min-height: 260px;


 border-radius: 5px; 
 border-top: 0px solid #82CAFA;
 border-right: 0px solid #82CAFA;
 border-bottom: 0px solid #82CAFA;
 border-left: 0px solid #82CAFA;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 margin-right: 0px;
 margin-top: 4px;
 margin-bottom: 0px;
 margin-left: 0px;

 /* display: block;*/ /* Centre image */
 /* margin-left: auto;*/ /* Centre image */
 /* margin-right: auto;*/ /* Centre image */
}

div.mybox11B
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 60%;

 /*text-align:center;*/
 float: left;
}

div.mybox11B label.lblHeader01 
{
 font-size: inherit;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}


div.mybox12
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 25%;
 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 float: left;
}

div.mybox12 label.lblHeader01 
{ 
 /* width: 0%; */ /* Width of labels */
 font-size: 14px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox12 label.lblHeader02 
{ 
 /* width: 0%; */ /* Width of labels */
 font-size: 14px;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox12 label.lblHeader03 
{ 
 /* width: 0%; */ /* Width of labels */
 font-size: 12px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox12 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox12 a:hover
{
 text-decoration:underline;
}

div.mybox12 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox12 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox13
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 50%;
 float: left;
}

div.mybox13 label.lblHeader01 
{
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox13 label.lblHeader02 
{ 
 font-size: 16px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox13 label.lblHeader03 
{
 font-size: 14px;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox13 label.lblHeader04
{ 
 font-size: 14px;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;
 float: left;
}

div.mybox14 label.lblHeader01 
{
 font-size: 12px;
 font-family: inherit;
 font-style: normal;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14 label.lblHeader02 
{ 
 font-size: 16px;
 font-family: inherit;
 font-style: normal;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14 label.lblHeader03 
{
 font-size: 10px;
 font-family: inherit;
 font-style: normal;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14 label.lblHeader04 
{
 font-size: 12px;
 font-family: inherit;
 font-style: normal;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14 label.lblHeader05 
{
/*
NOT USED
 font-size: 12px;
 font-family: inherit;
 font-style: normal;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
*/
}

div.mybox14 label.lblHeader06 
{
 font-size: 14px;
 font-family: inherit;
 font-style: normal;
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox14 label.lblHeader07 
{ 
 font-size: 14px;
 font-family: inherit;
 font-style: normal;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox15
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;
 float: left;
}

div.mybox15 label.lblHeader01 
{
 font-size: 12px;
 font-family: inherit;
 /*font-style: normal;*/
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox15 label.lblHeader02 
{
 font-size: 14px;
 font-family: inherit;
 /*font-style: normal;*/
 font-weight: normal;
 text-align:left;
 padding-right:5px;
 display: inline-block;
}

div.mybox15 label.lblHeader03 
{
 font-size: 14px;
 font-family: inherit;
 /* font-style: normal; */
 font-weight: bold;
 text-align:left;
 padding-right:5px;
 display: inline-block;
}


div.mybox15 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox15 a:hover
{
 text-decoration:underline;
}

div.mybox15 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox15 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox16
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 100%;
 float: left;

 border-radius: 5px; 
 border-top: 0px solid black;
 border-right: 0px solid black;
 border-bottom: 0px solid black;
 border-left: 0px solid black;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;

}

div.mybox16 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */
 font-size: 12px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
 word-wrap: break-word;
}

div.mybox16 label.lblHeader02 
{ 
 width: 100%; /* Width of labels */
 font-size: 14px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
 word-wrap: break-word;
}

div.mybox16 label.lblHeader03 
{ 
 width: 100%; /* Width of labels */
 font-size: 16px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
 word-wrap: break-word;
}

div.mybox16 img
{
 /* Sets image size */
 max-width: 260px;
 max-height: 260px;
 min-width: 260px;
 min-height: 260px;

}

div.mybox16 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox16 a:hover
{
 text-decoration:underline;
}

div.mybox16 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox16 a:visited
{
 /* color:blue; */
 color:#3333FF;
}


div.mybox17
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 33.33%;

/*
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
*/

 float: left;

}


div.mybox18
{
 /* DON'T ADD ANY LABELS TO THIS DIV. I AM USING IT TO POSITION IN RECIPEVIEW.PHP. IT SEEMS ADDING A LABEL WILL OVERWRITE THE LABELS NESTED WITHIN THIS DIV */

 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;
 float: left;
}

div.mybox19
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 50%;
 float: left;

 border-radius: 5px; 
 border-top: 0px solid black;
 border-right: 0px solid black;
 border-bottom: 0px solid black;
 border-left: 0px solid black;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;

}

div.mybox19 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */
 font-size: 16px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox19 label.lblHeader02
{ 
 width: 100%; /* Width of labels */
 font-size: 16px;
 font-family: inherit;
 font-weight:bold;
 text-align:right;
 padding-right:10px;
 display: inline-block;
}

div.mybox19 img
{
 /* float: right; */ /* right position image */
}

div.mybox19 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox19 a:hover
{
 text-decoration:underline;
}

div.mybox19 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox19 a:visited
{
 /* color:blue; */
 color:#3333FF;
}


div.mybox20
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 border-radius: 5px; 
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 100%;
 float: left;
}

div.mybox21
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 20%;

 float: left;
}

div.mybox21 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox21 label.lblHeader02 
{   
 /* width: 20%; */
 font-weight:bold;
 text-align: left;
 padding-right:0px;
 display: inline-block;
}


div.mybox22
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 50%;

 float: left;
}

div.mybox22 label.lblHeader01 
{   
 /* width: 50%; */
 font-weight:bold;
 text-align: left;
 padding-right:0px;
 display: inline-block;
}

div.mybox23
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 border-radius: 5px; 
 border-top: 0px solid black;
 border-right: 0px solid black;
 border-bottom: 0px solid black;
 border-left: 0px solid black;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 width: 65%;
 float: left;
}

div.mybox24
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 40%;
 float: left;
}

div.mybox25
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 100%;
 float: left;
}


div.mybox26
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 100%;
 float: left;

 /*min-width: 260px; */ /* Same as img */ 
 min-height: 260px; /* Same as img */

 border-radius: 5px; 
 border-top: 0px solid black;
 border-right: 0px solid black;
 border-bottom: 0px solid black;
 border-left: 0px solid black;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
 margin-right: 0px;
 margin-top: 4px;
 margin-bottom: 0px;
 margin-left: 0px;
 text-align: center; /* Center image */
}

div.mybox26 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */
 font-size: 12px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox26 label.lblHeader02 
{ 
 width: 100%; /* Width of labels */
 font-size: 14px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox26 label.lblHeader03 
{ 
 width: 100%; /* Width of labels */
 font-size: 16px;
 font-family: inherit;
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox26 img
{
 /* Sets image size */
 max-width: 260px;
 max-height: 260px;
 min-width: 260px;
 min-height: 260px;
}

div.mybox26 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox26 a:hover
{
 text-decoration:underline;
}

div.mybox26 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox26 a:visited
{
 /* color:blue; */
 color:#3333FF;
}


div.mybox27
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;
 float: left;
}

div.mybox27 label.lblHeader01 
{
 font-size: 12px;
 font-family: inherit;
 /*font-style: normal;*/
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mybox27 label.lblHeader02 
{
 font-size: 14px;
 font-family: inherit;
 /*font-style: normal;*/
 font-weight: normal;
 text-align:left;
 padding-right:5px;
 display: inline-block;
}

div.mybox27 label.lblHeader03 
{
 font-size: 12px;
 font-family: inherit;
 /* font-style: normal; */
 font-weight: bold;
 text-align:left;
 padding-right:5px;
 display: inline-block;
}

div.mybox27 label.lblHeader04 
{
 font-size: 14px;
 font-family: inherit;
 /*font-style: normal;*/
 font-weight: bold;
 text-align:left;
 padding-right:5px;
 display: inline-block;
}

div.mybox27 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox27 a:hover
{
 text-decoration:underline;
}

div.mybox27 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox27 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox28
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 0px;
 padding-bottom: 0px;
 padding-left: 5px;
 width: 100%;
 float: left;
}

div.mybox29
{
 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

}

div.mybox29 label.lblHeader01 
{
 /* font-family: rockwell; */
 text-align: center;
 /*font-size: x-large; */
 font-size: 14px; 
 font-weight: bold;
 font-style: normal;
 /* margin-top: 10px;
 margin-bottom: 10px; */
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.mybox29 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mybox29 a:hover
{
 text-decoration:underline;
}

div.mybox29 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox29 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.mybox30
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 16.66%;

 margin-top: 5px;
 margin-bottom: 5px;

/*
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
*/

 float: left;

}

div.mybox31A
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 float: left;
 width: 15%;
 text-align: center;
 padding-top:2px;
 padding-bottom:2px;
 padding-right:2px;
 padding-left:2px;
}

div.mybox31B
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 float: left;
 width: 85%;
 text-align: left;
 padding-top:2px;
 padding-bottom:2px;
 padding-right:2px;
 padding-left:2px;
}

div.mybox32
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;
 float: left;
}
div.myheader01 
{   
 float: left;
 width: 95%; /* 95% as the other 5% will be used for 'sign out' */
}

div.myheader02 
{   
 float: left;
 width: 100%;
}

div.mylayout01 
{   
 float: left;
 width: 100%;
}

div.mylayout01 label.lblHeader01 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:bold;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mylayout01 label.lblHeader02 
{   
 /*width: 200px;  Width of labels */ 
 font-weight:bold;
 text-align:right;
 padding-right:5px;
 padding-left:4px;
 display: inline-block;
}

div.mylayout01 label.lblHeader03 
{   
 width: 180px; /* Width of labels */ 
 font-weight:bold;
 text-align:right;
 vertical-align:25px;
 padding-right:10px;
 display: inline-block;
}

div.mylayout01 label.lblHeader04 
{ 
 width: 100%; /* Width of labels */ 
 font-weight:normal;
 text-align:left;
 padding-right:10px;
 display: inline-block;
}

div.mylayout01 label.lblHeader05 
{   
 font-weight:bold;
 text-align:right;
 padding-right:2px;
 display: inline-block;
}

div.mylayout01 label.lblHeader06 
{   
 /*width: 200px;  Width of labels */ 
 font-weight:normal;
 text-align:right;
 padding-right:5px;
 padding-left:4px;
 display: inline-block;
}

div.mylayout02 
{   
 float: left;
 width: 100%;
 padding-right: 10px;
}

div.mylayout02 label.lblBase01 
{   
 width: 100%; 
 font-weight: normal;
 text-align: right;
 display: inline-block;
}

div.mylayout02 label.lblBase02
{   
 width: 100%; 
 font-weight: normal;
 text-align: left;
 display: inline-block;
}

div.mylayout03 
{   
 float: left;
 width: 100%;
 padding-right: 0px;
}

div.mylayout04 
{
 float: left;
 width: 100%;
 text-align: left;
}

div.mylayout05 
{
 float: left;
 width: 100%;
 text-align: center;
 padding-top:10px;
 padding-bottom:10px;
 display: inline;
}

div.mylayout06 
{   
 /*float: left;*/
 width: 100%;
 text-align: justify;
}

div.mylayout07 
{
 float: left;
 width: 100%;
 text-align: left;
 padding-left: 20px;
}

.lblDynamic01
{   
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 /*margin-top: 10px;
 margin-bottom: 10px;*/
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

.lblDynamic02XXXXXX
{   

/* TO BE DELETED. WAS SAME AS lblDynamic01 */

 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 /*margin-top: 10px;
 margin-bottom: 10px;*/
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

.lblDynamic02 
{   
/*width: 400px;*/ /* Width of labels */ 
 font-weight:normal;
 text-align:left;
/*padding-right:10px;*/
 display: inline-block;
}

div.mylayout08 
{
 float: left;
 width: 100%;
 text-align: center;
 padding-top:1px;
 padding-bottom:1px;
}

div.mylayout09 
{   
 float: left;
 width: 100%;
 border-radius: 5px; 
 border-top: 0px solid black;
 border-right: 0px solid black;
 border-bottom: 0px solid black;
 border-left: 0px solid black;
 padding-right: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 padding-left: 2px;
}

div.mylayout10 
{
 float: left;
 width: 100%;
 padding-top:2px;
 padding-bottom:2px;
}

div.mylayout10 label.lblHeader01 
{   
 width: 150px;  /* Width of labels */ 
 font-weight:bold;
 text-align:right;
 padding-right:10px;
 padding-left:4px;
 display: inline-block;
}

div.mylayout10 label.lblHeader02 
{   
 font-weight:bold;
 text-align:right;
 padding-right:4px;
 padding-left:4px;
 display: inline-block;
}

div.mylayout11 
{
 float: left;
 width: 100%;
 text-align: left;
}

div.mylist01 th 
{   
 /* color: black; */
 color: #454545; /* blackish */
 background: #E6EDFF;
 text-align:left;
}

div.mylist01 tr
{   
 /* background-color: #FFFFFF;  White */;
 background-color: inherit;
}

div.mylist01 tr:hover {
 /* DOES NOT WORK IN IE */
 background-color: #ddf; 
}

div.mylist01 table 
{
 width:100%;
 font-size:1.0em;
}

div.mylist01 table a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mylist01 table a:hover
{
 text-decoration:underline;
}

div.mylist01 table a:link
{
 /* color: black; */
 color: #454545; /* blackish */
 color: blue;
}

div.mylist01 table a:visited
{
 /* color: black; */
 color: #454545; /* blackish */
 color: blue;
}

div.mymenu01
{
 /*font-size: 1.5em;*/
 font-weight: bold;
}

div.mymenu01 label.lblClass01 
{
 color: blue;
 /*font-size:inherit; 
 font-weight:bold;*/
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.mymenu01 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.mymenu01 a:hover
{
 text-decoration:underline;
}

div.mymenu01 a:link
{
 /* color: black; */
 color: #454545; /* blackish */
 color: blue;
}

div.mymenu01 a:visited
{
 /* color: black; */
 color: #454545; /* blackish */
 color: blue;
}

div.mymenu02
{
 font-weight:normal;
}

div.layout_login_plain01 
{   
 width: 100%;
 text-align: center;
}

div.layout_login_plain01 label 
{   
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login_plain01 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.layout_login_plain01 a:hover
{
 text-decoration:underline;
}

div.layout_login_plain01 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain01 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain02 
{   
 width: 100%;
 text-align: center;
}

div.layout_login_plain02 label 
{   
 font-family: inherit;
 font-weight: 400;
 font-size: 18px;
 font-style: normal;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login_plain03 
{   
 width: 100%;
 text-align: left;
}

div.layout_login_plain03 label 
{   
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login_plain03 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.layout_login_plain03 a:hover
{
 text-decoration:underline;
}

div.layout_login_plain03 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain03 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain04 
{   
 width: 100%;
 text-align: center;
}

div.layout_login_plain04 label 
{   
 font-family: inherit;
 font-weight: bold;
 font-size: 14px;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login_plain04 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.layout_login_plain04 a:hover
{
 text-decoration:underline;
}

div.layout_login_plain04 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain04 a:visited
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain05 
{   
 width: 100%;
 text-align: center;
}

div.layout_login_plain05 label 
{   
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login_plain05 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.layout_login_plain05 a:hover
{
 text-decoration:underline;
}

div.layout_login_plain05 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_login_plain05 a:visited
{
 /* color:blue; */
 color:#3333FF;
}


div.layout_login {
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

 text-align: center;
}

div.layout_login label 
{   

 /* NOT USED */

 font-weight:bold;
 margin-top: 1.5em;
 margin-left: 8.5em; 
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 250px;
 padding: 15px 25px;
	
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 color: #9d9e9e;
 text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	
 background: #fff;
 border: 1px solid #fff;
 border-radius: 5px;
	
 box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);

 -webkit-appearance: none; /* Format buttons in Safari */
}


div.layout_login01 {
 width: 100%;
 text-align: left;
}

div.layout_login01 label 
{   

 /* NOT USED */

 font-weight:bold;
 margin-top: 1.5em;
 margin-left: 8.5em; 
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login01 input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 500px;
 padding: 15px 25px;
	
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 color: #9d9e9e;
 text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	
 background: #fff;
 border: 1px solid #fff;
 border-radius: 5px;
	
 box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);

 -webkit-appearance: none; /* Format buttons in Safari */
}


div.layout_login02 {
 width: 100%;
 text-align: left;
}

div.layout_login02 label 
{   

 /* NOT USED */

 font-weight:bold;
 margin-top: 1.5em;
 margin-left: 8.5em; 
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_login02 input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 230px;
 padding: 15px 25px; /* padding: 25px 50px - top and bottom paddings are 25px, right and left paddings are 50px */
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 color: #9d9e9e;
 text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	
 background: #fff;
 border: 1px solid #fff;
 border-radius: 5px;
	
 box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);

 -webkit-appearance: none; /* Format buttons in Safari */
}

div.layout_login03 {
 width: 100%;
 text-align: center;
}

div.layout_login03 label.lblHeader01 {
 font-weight: normal;
 font-size: 14px;
 font-style: normal;
}

div.layout_login04 {
 width: 100%;
 text-align: center;
}

div.layout_login04 input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 500px;
 padding: 15px 25px;
	
 font-family: inherit;
 font-weight: 300;
 font-size: 14px;
 color: #9d9e9e;
 text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	
 background: #fff;
 border: 1px solid #fff;
 border-radius: 5px;
	
 box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
 -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);

 -webkit-appearance: none; /* Format buttons in Safari */
}

div.layout_plain01
{   
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 width: 100%;
 text-align: center;
 overflow:hidden; /* Prevents background color from overflowing to other divs */
 /* background-color: #DBDBE6;
 background-color: #C9D2D2; */
 background-color: #E6EDFF;
}

div.layout_plain01 label 
{
 /* font-family: rockwell; */ 
 font-size: x-large; 
 font-weight: bold; 
 font-style: normal;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain02
{
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 /*padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;*/
 width: 100%;
 text-align: left;
 overflow:hidden; /* Prevents background color from overflowing to other divs */
 background-color: #E6EDFF;
}

div.layout_plain02 label 
{
 /* font-family: rockwell; */ 
 font-size: x-large; 
 font-weight: bold; 
 font-style: normal;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain03
{   
 width: 100%;
 height: 300px;
 text-align: left;
}

div.layout_plain04
{
 padding-right: 5px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

}

div.layout_plain04 label.lblHeader01 
{
 /* font-family: rockwell; */
 text-align: center;
 font-size: x-large; 
 font-weight: bold;
 font-style: normal;
 /* margin-top: 10px;
 margin-bottom: 10px; */
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain04 label.lblHeader02 
{
 text-align: left;
 font-size: 14px; 
 font-weight: normal;
 font-style: normal;
 /* margin-top: 10px;
 margin-bottom: 10px; */
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain04 label.lblHeader03
{
 text-align: left;
 font-size: 14px; 
 font-weight: bold;
 font-style: normal;
 /*margin-top: 10px;
 margin-bottom: 10px;*/
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain05
{
 padding-right: 5px;
 padding-top: 0px;
 padding-bottom: 0px;
 padding-left: 5px;
 width: 100%;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */

}

div.layout_plain05 label.lblHeader01 
{
 text-align: left;
 font-size: 14px; 
 font-weight: normal;
 font-style: normal;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain05 label.lblHeader02
{
 text-align: left;
 font-size: 14px; 
 font-weight: bold;
 font-style: normal;
 margin-top: 10px;
 margin-bottom: 10px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain05 label.lblHeader03 
{
 text-align: left;
 font-size: 12px; 
 font-weight: normal;
 font-style: normal;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain05 label.lblHeader04
{
 text-align: left;
 font-size: 14px; 
 font-weight: normal;
 font-style: normal;
 margin-top: 5px;
 margin-bottom: 5px;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}

div.layout_plain05 a
{
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

div.layout_plain05 a:hover
{
 text-decoration:underline;
}

div.layout_plain05 a:link
{
 /* color:blue; */
 color:#3333FF;
}

div.layout_plain05 a:visited
{
/* color:blue; */
 color:#3333FF;
}

div.layout_plain05 label.lblHeader05 
{
 text-align: left;
 font-size: 14px; 
 font-weight: normal;
 font-style: normal;
 text-align: center;
 display:block; /* Needed to position label because you can't apply top or bottom values to an inline element */
}


div.button_login
{   
 width: 100%;
 text-align: center;
}

div.button_login input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 250px;
 padding: 15px 25px;
	
 font-family: inherit;
 font-weight: 300;
 font-size: 18px;
 color: #fff;
 text-shadow: 0px 1px 0 rgba(0,0,0,0.25);
	
 background: #56c2e1;
 border: 1px solid #46b3d3;
 border-radius: 5px;
 cursor: pointer;
	
 box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -moz-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -webkit-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);

 -webkit-appearance: none; /* Format buttons in Safari */
}

div.button_type01
{   
 width: 100%;
 text-align: center;
}

div.button_type01 input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 125px;
 padding: 15px 25px;
	
 font-family: inherit;
 font-weight: 300;
 font-size: 18px;
 color: #fff;
 text-shadow: 0px 1px 0 rgba(0,0,0,0.25);
	
 background: #56c2e1;
 border: 1px solid #46b3d3;
 border-radius: 5px;
 cursor: pointer;
	
 box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -moz-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -webkit-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);

 -webkit-appearance: none; /* Format buttons in Safari */
}


div.button_type02
{   
 width: 100%;
 text-align: center;
}

div.button_type02 input 
{   
 margin-top: 10px;
 margin-bottom: 10px;
 width: 100px;
 padding: 5px 10px; /* padding: 25px 50px - top and bottom paddings are 25px, right and left paddings are 50px */
	
 font-family: inherit;
 font-weight: 300;
 font-size: 16px;
 color: #fff;
 text-shadow: 0px 1px 0 rgba(0,0,0,0.25);
	
 background: #56c2e1;
 border: 1px solid #46b3d3;
 border-radius: 5px;
 cursor: pointer;
	
 box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -moz-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
 -webkit-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);

 -webkit-appearance: none; /* Format buttons in Safari */
}

div.myphotooutput01
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 padding-top:2px;
 padding-bottom:2px;
 padding-left:2px;
 padding-right:2px;
 width: 155px;
 height: 155px;
 float: left;
}

div.myphotooutput01 img
{
 /* Sets image size */
 max-width: 150px;
 max-height: 150px;
 min-width: 150px;
 min-height: 150px;

}



div.myphotooutput02
{
 /* For example, if you want two bordered boxes side by side, it can be achieved through setting box-sizing to "border-box". 
    This forces the browser to render the box with the specified width and height, and place the border and padding inside the box.
 */

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
 border-top: 1px solid #82CAFA;
 border-right: 1px solid #82CAFA;
 border-bottom: 1px solid #82CAFA;
 border-left: 1px solid #82CAFA;
 padding-top:2px;
 padding-bottom:2px;
 padding-left:2px;
 padding-right:2px;
 width: 100px;
 height: 100px;
 float: left;
}

div.myphotooutput02 img
{
 /* Sets image size */
 max-width: 95px;
 max-height: 95px;
 min-width: 95px;
 min-height: 95px;
}


.modalDialog {
	position: fixed;
	/*font-family: Arial, Helvetica, sans-serif;*/
        /*font-family: Verdana, San-Serif;*/
        font-size: 12px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99900;
	opacity:0;

	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;

	pointer-events: none;
}

.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}

.modalDialog > div {
	width: 500px;
	position: relative;
	margin: 10% auto;
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background: #fff;
        background: -moz-linear-gradient(#fff, #FFFFE0); /* For Firefox 3.6 to 15 */
	background: -webkit-linear-gradient(#fff, #FFFFE0); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#fff, #FFFFE0); /* For Opera 11.1 to 12.0 */
        background: linear-gradient(#fff, #FFFFE0); /* Standard syntax */
}

.close {
	background: #606061;
	color: #FFFFFF;
	line-height: 25px;
	position: absolute;

	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}

.close:hover { background: #00d9ff; }

hr.linestyle01 {
    display: block;
    height: 0px;
    width:100%;
    border: 0;
    /* border-top: 1px dotted #82CAFA */
    /* border-top: 1px dotted #DBDBE6; */
    /* border-top: 1px dotted #E6EDFF; */
    border-top: 1px dotted grey;
}

hr.linestyle02 {
    display: block;
    height: 0px;
    width:100%;
    border: 0;
    /* border-top: 1px solid #82CAFA */
    /* border-top: 1px solid #DBDBE6; */
    /* border-top: 1px solid #E6EDFF; */
    border-top: 1px solid grey;
}

hr.linestyle03 {
    display: block;
    height: 0px;
    width:100%;
    border: 0;
    /* border-top: 1px dashed #82CAFA */
    /* border-top: 1px dashed #DBDBE6; */
    /* border-top: 1px dashed #E6EDFF; */
    border-top: 1px dashed grey;
}

/**********************************************************************************/
.static_rating
{
 float:left;
}

/* :not(:checked) is a filter, so that browsers that don’t support :checked don’t 
   follow these rules. Every browser that supports :checked also supports :not(), 
   so it doesn’t make the test unnecessarily selective */

.static_rating:not(:checked) > input 
{
 position:absolute;
/* top:-9999px; */
 clip:rect(0,0,0,0);
}

.static_rating:not(:checked) > label {
    float:right;
    width:0.9em;
    padding:0em .1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:default;
    font-size:170%;
    line-height:1.2;
/*    color:#ddd; */
/*    color:white; */
-webkit-filter:grayscale(75%); /* supported by modern browsers */
opacity: 0.2;

    /* text-shadow:1px 1px #bbb, 2px 2px #666, .1em .1em .2em rgba(0,0,0,.5);*/
}

.static_rating:not(:checked) > label:before 
{
 /* content: '\2605'; */ /* this generated content color is not changing when using Chrome on Android */
 content: url(images/star1.gif);
}

.static_rating > input:checked ~ label 
{
 /* color: #f70; */
 -webkit-filter:grayscale(0%); /* supported by modern browsers */
 opacity: 1;
 /* text-shadow:1px 1px #c60, 2px 2px #940, .1em .1em .2em rgba(0,0,0,.5);*/
}

/* The below is the same as above '.static_rating > input:checked ~ label ' */
/* .static_rating input[type=radio]:checked ~ label { */
/* color: #f70; */
/* opacity: 1; */
/* } */ 

.static_rating > label:active
{
 position:relative;
 top:2px;
 left:2px;
}
/**********************************************************************************/

/*----- Tabs -----*/
.tabs {
    width:100%;
    display:inline-block;
}
 
/*----- Tab Links -----*/
/* Clearfix */
.tab-links:after {
     display:block;
     clear:both;
     content:'';
}

.tab-links li {
     margin:0px 5px;
     float:left;
     list-style:none;
}

.tab-links a {
     padding:9px 15px;
     display:inline-block;
     border-radius:3px 3px 0px 0px;
     background-color: #E6EDFF;
     font-size:14px;
     font-weight:bold;
     color:#4c4c4c;
     -webkit-transition: all linear 0.15s; /* Safari */
     transition:all linear 0.15s;
     text-decoration:none;
}
 
.tab-links a:hover {
     background:#a7cce5;
     text-decoration:none;
}
 
li.active a {
     background:#E6EDFF;
     color:#4c4c4c;
}

li.active a:hover {
     background:#a7cce5;
     color:#4c4c4c;
}

li.inactive {
     padding:9px 15px;
     display:inline-block;
     border-radius:3px 3px 0px 0px;
     font-size:14px;
     font-weight:bold;
     -webkit-transition: all linear 0.15s; /* Safari */
     transition:all linear 0.15s;
}
 
/*----- Content of Tabs -----*/
.tab-content {
     padding:15px;
     border-radius:3px;
     box-shadow:-1px 1px 1px rgba(0,0,0,0.15);
     background:#fff;
}
 
.tab {
     display:none;
}
 
.tab.active {
     display:block;
}

/**********************************************************************************/