/*
 * This is the widget css style file developed for the prototype demo and
 * is used with the media-queries css file to achieve responsive web design.
 * (see also https://www.sitepoint.com/series/understanding-responsive-web-design/)
 *
 * RBoz 6/19/17
 *
 * color: #5ad3fa; Aenvision Blue
 * color: #fab252; Aenvision Yellow
 * color: #a1df82; Aenvision Green
 *
 */

/*
 * Responsive web design
 * The following code chooses image loading based on screen size to save bandwidth:
 *   img <img src="smallRes.jpg" data-fullsrc="largeRes.jpg">
 */
 
{font-size: 100%;}

.div_z1_msg {
        z-index: 1;
        position: absolute;
        left: 30%; 
        top: 20%;
        width: 40%; 
        height: 20%; 
        max-height: 200px;
        background-color: lightskyblue; 
        color: black;      
        margin-left: 5%; 
        margin-top: 5%;
        margin-right: 5%;
        margin-bottom: 5%;
        text-align: center;
        border: 10px solid lightskyblue; /* border: 1px dashed #999966;*/
}
    
.div_z1_warn {
        z-index: 1;
        position: absolute;
        left: 30%; 
        top: 20%;
        width: 40%; 
        height: 20%; 
        max-height: 200px;
        background-color: salmon; 
        color: black;      
        margin-left: 5%; 
        margin-top: 5%;
        margin-right: 5%;
        margin-bottom: 5%;
        text-align: center;
        border: 10px solid salmon;
}    
/*
input[type=submit] { 
	color: white;
	background: #5ad3fa;
  border-radius: 10px;
  font: 100%;	
}
*/
.input-submit-send { 
	color: white;
	background: #5ad3fa; 
  border-radius: 10px;
  Height: auto;
  font: 100%;	
}

.input-submit-go { 
	color: white;
	background: #5ad3fa;
  border-radius: 10px;
  font: 100%;	
}

.input-submit-close-msg { 
	color: white;
	background: deepskyblue;
  border-radius: 10px;
  font: 100%;	
}

.input-submit-close-warn { 
	color: white;
	background: red;
  border-radius: 10px;
  font: 100%;	
}

img  
{
   max-width: 90%; /* lets browser resize image */
   height: auto;
}

.title_logo_img  
{
   max-width: 125%; 
   height: auto;
}

.oscar_img  
{
   max-width: 100%;
   vertical-align: center; 
   height: auto;
}


.user_guide_img  
{
   max-width: 100%; 
   height: auto;
}


.title_td {
 font-weight: bold;
 font-family: helvetica;
 font-size: 100%;
 width: 50%;
 vertical-align: center;
 color: white;
 text-align: center;
 background-color: gray;
/*  border-bottom: 1px solid #F0F0F0; */
 padding-top: 1%;
 padding-right: 1%;
}

.oscar_image_td {
 font-weight: bold;
 font-family: helvetica;
 font-size: 100%;
 width: 50%;
 vertical-align: center;
 color: white;
 text-align: center;
 background-color: gray;
/*  border-bottom: 1px solid #F0F0F0; */
 padding-top: 1%;
 padding-right: 1%;
 padding-bottom: 1%;
 padding-left: 1%;
}

.terms_tr {
	height: 50%;
/*	line-height: 100%; */

}

.terms_td {
 font-weight: bold;
 font-family: helvetica;
 font-size: 150%;
 width: 90%;
 vertical-align: top;
 color: white;
 text-align: left;
 background-color: white;
/*  border-bottom: 1px solid #F0F0F0; */
 padding-top: 1%;
 padding-right: 1%;
 padding-left: 10%;
 height: 50%;
}




.heading_td {
 vertical-align: center;
/* background-color: #a1df82; */
	background-color: white;
/*  border-bottom: 1px solid #F0F0F0; */
 padding-top: 0%;
 padding-right: 0%;
}

.heading_p {
	font-weight: bold;
	font-family: helvetica;
	font-size: 190%;
	max-width: 100%;
	/* padding-right: 5%; */
	color: gray;
	text-align: center;
}

.form_td {
	background-color: #F0F0F0; /* was lightgray */
	padding-left: 5%;
	max-width: 75%;
}

.guide_td {
	background-color: #F0F0F0; /* was lightgray */
	padding-left: 2%;
	padding-top: 2%;
	padding-right: 2%;
	padding-bottom: 2%;
	max-width: 90%;
}

.form_text_td {
/* background-color: #F0F0F0; */
 background-color: white;
 padding-left: 2%;
 text-align: left;
}

hr {
margin-top: 0%;
margin-left: 0%;
margin-right: 0%;
margin-bottom: 0%;

}


.terms_div {
    overflow: auto;
    max-width: 100%;
    padding-left: 0%;
    height: 100px;

}

.guide_div {
    overflow: auto;
    max-width: 100%;
    padding-left: 2%;
    Padding-top: 1%;
    Padding-bottom: 1%;
    height: 300px;
  /*  background: #F9F9F9; */
  	background: white;

}

.main_table { 
 /* background:url(../img/Logo_transparency.jpg);
    background-repeat:no-repeat;
    background-position: top center; */
    border: 0px solid black;
    max-width: 95%;
    margin: 0px auto;
    border-collapse: collapse;
    }


.report_h2 {
font-weight: bold;
font-family: helvetica;
/* font-size: 320%; */
font-size: 280%;
/* color: #5ad3fa; Aenvision Blue */
/* color: #fab252; Aenvision Yellow */
color: #a1df82; /* Aenvision Green */
}

   
small {
font-weight: normal; font-family: helvetica; font-size: 8pt;
color: #B2B2B2;
}


select {
	font-size: 100%;
	font-weight: normal;
	font-family: helvetica;
	max-width: 75%; 
}


input {
  font-size: 18pt;
  font-weight: normal;
	font-family: helvetica; 
}


.form_p {
font-weight: normal;
font-family: helvetica;
font-size: 150%;
max-width: 100%;
padding-right: 5%;
padding-left: 0%;

}

.form_text_p {
font-weight: normal;
font-family: helvetica;
font-size: 130%;
max-width: 100%;
color: dimgray;
margin-top: 0%;
margin-left: 5%;
margin-right: 2%;
margin-bottom: 4%;

}

.form_text_p_bttm {
font-weight: normal;
font-family: helvetica;
font-size: 130%;
max-width: 100%;
color: dimgray;
margin-top: 0%;
margin-left: 5%;
margin-right: 2%;
margin-bottom: 0%;

}



p {
font-weight: normal;
font-family: helvetica;
font-size: 150%;
max-width: 90%;
}


.p_scrolling {
font-weight: normal;
font-family: helvetica;
font-size: 100%;
max-width: 90%;
color: #B2B2B2;
}

.p_scroll_guide {
font-weight: normal;
font-family: helvetica;
font-size: 150%;
/* max-width: 90%; */
color: #B2B2B2;
}

.p_prod_guide {
font-weight: normal;
font-family: helvetica;
font-size: 100%;
/* max-width: 90%; */
color: #B2B2B2;
}

.title_h3 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 200%;
	padding: 0% 0% 0% 0%;
	text-align: center;
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
}

.title_h1 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 300%;
	padding: 0% 0% 0% 0%;
	text-align: center;
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
}
.subtitle_h1 {
	font-weight: normal;
	font-family: helvetica;
	font-size: 215%;
	padding: 0% 0% 0% 0%;
	text-align: center;
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
}

h3 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 24pt;
	padding: 0% 0% 0% 0%;
	
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
}

.email_form_h3 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 250%;
	padding: 0% 0% 0% 0%;
	color: white;
	margin-top: 1%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 0%;
}

.email_form_p {
	font-weight: bold;
	font-family: helvetica;
	font-size: 150%;
	padding: 1% 1% 1% 1%;
	color: white;
	margin-top: 1%;
	margin-left: 2%;
	margin-right: 2%;
	margin-bottom: 1%;
	text-align: left;
}

.email_form_p_right {
	font-weight: bold;
	font-family: helvetica;
	font-size: 150%;
	padding: 1% 1% 1% 1%;
	color: white;
	margin-top: 1%;
	margin-left: 10%;
	margin-right: 5%;
	margin-bottom: 1%;
	text-align: left;
}

.email_form_td {
	font-weight: bold;
	font-family: helvetica;
	font-size: 150%;
	padding: 0% 0% 0% 0%;
	color: white;
	margin-top: 0%;
	margin-left: 10%;
	margin-right: 10%;
	margin-bottom: 0%;
	text-align: left;
}
.white_h3 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 24pt;
	padding: 0% 0% 0% 0%;
	
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
	color: white;
}

.alert_h3 {
	font-weight: bold;
	font-family: helvetica;
	font-size: 24pt;
	padding: 0% 0% 0% 0%;
	
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
	color: #fab252;
}

.small_h3 {
	font-weight: normal;
	font-family: helvetica;
	font-size: 18pt;
	padding: 0% 0% 0% 0%;
	margin-top: 2%;
	margin-left: 0%;
	margin-right: 0%;
	margin-bottom: 2%;
}


.center  {text-align: center;}

/*
	Classes for the report table 
 */
.report_th {
 font-weight: bold;
 font-family: helvetica;
 font-size: 100%;
 width: 12.5%;
 text-align: center;
 background-color: white;
 border-bottom: 1px solid #F0F0F0; 
}
.report_th_r {
 font-weight: bold;
 font-family: helvetica;
 font-size: 100%;
 width: 12.5%;
 vertical-align: center;
 text-align: right;
 background-color: white;
 border-bottom: 1px solid #F0F0F0; 
 padding-top: 3%;
 padding-right: 1%;
}


.report_off {
 width: 12.5%;
 text-align: center;
 background-color: white;
 border-bottom: 1px solid #F0F0F0;
}

.report_on_1 {
 width: 12.5%;
 text-align: center;
 background-color: LIGHTBLUE;
/* border-bottom: 1px solid #F0F0F0; */
}

.report_on_2 {
 width: 12.5%;
 text-align: center;
 background-color: SKYBLUE;
/* border-bottom: 1px solid #F0F0F0; */
}

.report_on_3 {
 width: 12.5%;
 text-align: center;
 background-color: DEEPSKYBLUE;
/* border-bottom: 1px solid #F0F0F0; */
}

/* End of report table classes ------------------------------- */

.pc30 {width: 30%;}
.pc10 {width: 10%;}
.pc20 {width: 20%;}
.lb {background: lightblue;}
.lg {background: lightgrey;}
.tbg {background: silver;}
.logo {verticle-align: bottom;}

body {
/*
background-image:url('../img/Street_People.jpg');
background-repeat:no-repeat;
background-position: top 10% left 20%;
background-attachment: scroll;
*/
background-color: white;
font-size: 100%;

/*
margin-top: 0px;
margin-left: 200px;
margin-right: 350px;
margin-bottom: 0px;

margin-top: 0px;
margin-left: 1%;
margin-right: 0%;
margin-bottom: 0px;
*/
}


/*
The following is the content from the PAM.CSS file

Available Classes
_________________________________
menus
menu
tbl_div
tbl_main
help_para
edit_para
edit_PageTitle
edit_H1
edit_H2
edit_WarningTest
edit_ErrorText
edit_links
error_links
edit_success
edit_TblCell
edit_TblForm
edit_Label
edit_SuccessTbl
edit_SuccessHead
about_title
about_date
report_para
report_PageTitle
report_H1
report_H2
report_WarningTest
report_ErrorText
report_links
report_success
report_TblCell
report_TblForm


*/


/*
The a.menus definitions define the "menus" class used in the TemplateHeader.php
*/
/* a.menus{color:Peachpuff !important;text-decoration:none;font:bold} */
a.menus:hover{color:#ffffff !important; text-decoration:none;font:bold}
a.menus:link{color:#ffffff !important; text-decoration:none;font:bold}
a.menus:visited{color:#ffffff !important; text-decoration:none;font:bold}
a.menus:active{color:#ffffff !important; text-decoration:none;font:bold}

/*
 * <a> tag link pseudo classes 
 */
a:link {color: black; text-decoration: underline;}
a:visited {color: black; text-decoration: none;}
a:hover {color: blue; text-decoration: underline;}
a:active {color: black; text-decoration: none;}


/*
The menu class defines the appearance of items that appear in the drop down menu
defined in the TemplateHeader.php file.
*/
.menu
  { 
    font-size:100%;
    position: absolute;
//    visibility: hidden;
//    background-color: rgb(204, 102, 0);
//    background-color: goldenrod;
//    background-color: lightgrey;
    background-color: cornflowerblue;
  }


/*
The "tbl_div" selector defines the style for the div tag that surrounds a table
with a scroll bar.

*/
.tbl_div {
  overflow: auto;
  height: 300px; /* typically overridden inline */
  width: 100%; /* typically overridden inline */ 
  background-color: white;
  BORDER-BOTTOM: white 1px solid;
  BORDER-RIGHT: white 1px solid;
  BORDER-TOP: white 1px solid;
  BORDER-LEFT: white 1px solid;
}

/*
The "tbl_div_ns" selector defines the style for the div tag that surrounds a table, no
auto scroll

*/
.tbl_div_ns {
//  overflow: auto;
//  height: 300px; /* typically overridden inline */
  width: 100%; /* typically overridden inline */ 
  background-color: white;
  BORDER-BOTTOM: white 1px solid;
  BORDER-RIGHT: white 1px solid;
  BORDER-TOP: white 1px solid;
  BORDER-LEFT: white 1px solid;
}


/*
The "tbl_main" selector defines the style for the Main Work Space table

*/
.tbl_main {
  background-color: lightgrey;
  width: 100%;
  height: 82%;
  border-width: 0;
  padding: 5;
  border-spacing: 0;
}


/*
The "help_para" selector defines the style for text on the help page
*/
.help_para {
  color: black; /* font color */
  font-family: Arial;
  font-weight: normal;
  font-size: large;
}

/*
The "edit_PageTitle" class selector defines the style for text on edit pages  
The "report_PageTitle" class selector defines the style for text on report pages
*/
.edit_PageTitle, .report_PageTitle 
{
  color: white; /* font color */
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_H1" class selector defines the style for text on edit pages  
The "report_H1" class selector defines the style for text on report pages
*/
.edit_H1, .report_H1
{
  color: white; /* font color */
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_H2" class selector defines the style for text on edit pages  
The "report_H2" class selector defines the style for text on report pages
*/
.edit_H2 , .xreport_H2
{
  color: white; /* font color */
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_para" class selector defines the style for text on edit pages  
The "report_para" class selector defines the style for text on report pages
*/
.edit_para, .report_para
{
  color: white; /* font color */
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_WarningText" class selector defines the style for warning text on edit pages 
The "report_WarningText" class selector defines the style for text on report pages
*/
.edit_WarningText, .report_WarningText 
{
  color: Orange; /* font color */
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_ErrorText" class selector defines the style for error text on edit pages 
The "report_ErrorText" class selector defines the style for text on report pages
*/
.edit_ErrorText, .report_ErrorText
{
  color: red; /* font color */
  font-weight: bold;
  font-family: Arial;
}


/*
The "edit_links" class selector defines the style for links on edit pages 
The "report_links" class selector defines the style for text on report pages
*/
.edit_links, .report_links
{
  color: steelblue; /* rgb(204, 102, 0) is that orange-ish color of PAM Header/Footer Background */
  font-weight: bold;
  font-family: Arial;
}


/*
The "error_links" class selector defines the style for links in edit_ErrorText
*/
.error_links {
  color: red; 
  font-weight: bold;
  font-family: Arial;
}

/*
The "edit_success" class selector defines the style for "operations completed 
successfully" messages on edit pages 
*/
.edit_success {
  color: forestgreen; /* font color */
  font-weight: bold;
  font-family: Arial;
}


/*
The "about_title" class selector defines the style for titles on the About page
*/
.about_title {
  color: black; /* font color */
  font-weight: bold;
  font-family: Arial;
  font-size: x-large;
}


/*
The "about_date" class selector defines the style for dates on the About page
*/
.about_date {
  color: black; /* font color */
  font-weight: bold;
  font-family: Arial;
  font-size: large;
}


/*
The "edit_TblCell" class selector defines the style for cells (<td> tags) on 
edit page tables  
The "report_TblCell" class selector defines the style for cells (<td> tags) on 
report page tables
*/
.edit_TblCell, .report_TblCell
{
  color: black; /* font color */
  font-weight: normal;
  font-family: Arial;
  font-style: normal;
  vertical-align: top;
  padding: 2;
}



/*
The "edit_TblForm" class selector defines the style for 'form' tables on edit 
page tables  
The "report_TblForm" class selector defines the style for 'form' tables on 
report page tables
*/
.edit_TblForm, .report_TblForm
{
  vertical-align: top;
  text-align: left;
  border-style: solid;
  border-width: 0;
  padding: 2;
  
}

/*
The "edit_Label" class selector defines the style for 'form' tables on edit 
page tables  
*/
.edit_Label
{
  vertical-align: top;
  text-align: right;
  font-weight: bold;
  color: black;
  font-family: Arial;
  font-style: normal;
  padding: 2;
  
}
/*The "edit_SuccessTbl" class selector defines the style for the tables on the successful data entered page.
*/
.edit_SuccessTbl
{
background-color: white; 
width: 100%;
border-width:1px;
border:1px solid black;
padding:5;
border-spacing:0;
}

/*The "edit_SuccessHead" class selector defines the text style of the success table headings.*/
.edit_SuccessHead
{
height: 50px;
text-align:center;
vertical-align:bottom;
}