/*NEW CSS*/
/***********************************************/
/* Core Page Divs                              */
/***********************************************/


/*Main div that houses all others, the background image is part of this*/
body
{
    background-image: url("../images/BG.png");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    z-index: -200;
}

/*This is the transparent box around the content, this will adjust and always be centered based on screen 
    resolution until reaching the minimum width of 922px, in which in becomes locked in at that size*/
#wrapper{
	width:922px;
	background-image: url("../images/wrapperBG.png");
	background-repeat:repeat-y;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	margin-top: 0px;
	padding-bottom: 15px;	
	position: relative;
	z-index: 0;	
}

/***********************************************/
/* Header                                      */
/***********************************************/

/*Duplicate of head, in legacy CSS this housed banner, search, and other elements not used here. Left in 
    because it will be much easier to make changes if anything is added at a later date*/
#topcontent
{
	height: 100px;
}	

/*This is the header. Contains the logo, eforms name, and nav bar*/
#head {
	height:100px;
	width: 921px;
	margin-left:auto;
	margin-right:auto;
	margin-top: 0px;
	position: relative;
	display: block;
    top: 0px;
    left: 0px;
}

/*Sets styles for each of the header tags. Due to site accessibility standards for 508 compliance these
    must be nested in decreasing order on a page (h3 inside of h2 inside of h1) so they don't necessarily
    decrease in size like you may expect, but are written so that the pages will follow these standards
    but maintain the look desired*/
h1{
	font-size:1.75em;
	margin-top:30px;
	color: #000;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #841935;
	padding-bottom: 5px;

}
h2{
	font-size:1.0em;
	padding: 0px;
	color: #73142D;
	margin: 0px;
} 

h3{
	font-size:1.4em;
	margin-top:10px;
	margin-bottom: 2px;
	color: #434343;
	padding-bottom: 2px;
}

h4{
	font-size:1.2em;
	color: #3d3d3d;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 7px;
}

h5{
	font-size:1.2em;
	color: #3d3d3d;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #841935;
	padding-bottom: 5px;
}

/*eForms center name, in this case "DGO eForms Center*, uses .png image*/
#headerText {
	position: absolute;
	top: 15px;
	right: 195px;
	width: 325px;
	}

/*The DMME logo, uses .png image*/
#logo {
	position: absolute;
	top: -4px;
	left: 25px;
	width: 235px;
	font-size: 12px;
	z-index: 2000;
    height: 116px;
}
	

/***********************************************/
/* Menu                                        */
/***********************************************/

/*The welcome and description for the ctlMainMenu*/
#mainmenutopleft
{
    text-align: center;
	width: 55%;
	float: left;
	padding: 20px;
}

/*Picture on top right of ctlMainMenu*/
#mainmenutopright
{
	width: 35%;
	float: right;
	margin-top: 45px;
	padding: 5px;
}

/*Container for each of the categories for eForms. Currently this is set to display 3 categories per row
    and the div style is cleared after each 3 inside of the ctlMainMenu. The width here can be adjusted
    and this can be changed easily*/
.menulist
{
    text-align: Left;
	width: 30%;
	float: left;
    margin-top: 0px;
	padding-left: 20px;
}

/*Nav bar buttons are turned on/off. An example being "Back to Search" only appears at certain times, so the 
    unordered list style is set to none, otherwise the space that the linkbutton text normally occupies would
    still exist, causing empty spaces to show up in the nav bar where those button would normally be*/
.menulist ul
{
    list-style-type: none;
}

/*Navigation bar background image*/
#menu_box 
{
    background-image: url("../images/navbar.png");
    background-position:center;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 10px;
	margin-bottom: 0px;
	width: 899px;
	top: 50px;
	position: relative;
	z-index: 1000;
}

/*Sets the font and positioning for nav bar*/
#menu {
	width:880px;
	height:51px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 0px;
	padding-right: 35px;
	padding-bottom: 0px;
	padding-left:0px;
	font-family:Arial, Helvetica, sans-serif;
}

/*Sets style for individual list items inside the ul*/
#menu li {
	float:right;
	display:inline;
	text-align:center;
	position:relative;
	margin-top:0px;
	margin-right:0px;
	color: #696969;
	border:none;
	padding-top: 17px;
	padding-right: 15px;
	padding-bottom: 4px;
	padding-left: 0px;
	font-size:12px;
}

/*Sets hyperlink style for a href links*/
#menu li a { 
	color: #2e3e3e;
	display:block;
	outline:0;
	text-decoration:none;
}

/*Changes color when hovering over nav bar links*/
#menu li a:hover { 
	color: Blue;
	display:block;
	outline:0;
	text-decoration:underline;
}



/***********************************************/
/* Body                                        */
/***********************************************/

/*This is the box that all content is displayed upon*/
#contentcover {
	display: block;
	background-image:url("../images/ContentArea.png");
	background-position:center;
	margin-top:0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	min-width: 890px;
	max-width: 890px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
	}

/*Container which all controls are loaded into. dvContent is housed inside of this on frmMain*/
#bottomcontent{
	padding-right: 0px;
	padding-left: 0px;
	line-height: 22px;
	font-size: 14px;
	z-index: 0;
	position: relative;
	}
	
/***********************************************/
/* Display Screens                             */
/***********************************************/

/*Typically houses error labels, headers on Display screens*/
.displayscreencenter
{
    text-align: center;
	width: 98%;
	float: left;
	padding: 10px;
}

/*Generic container for display screens*/
.displaycontainer
{
    line-height: 27px;
    width: 90%;
    padding: 5px 10px;
    margin: 0px auto;
    clear: both;
}

/*Splits the display screen into the left third of the screen*/
.displaytopleft
{
    text-align: right;
    font-weight: bold;
    width: 30%;
	float: left;
}

/*Splits the display screen into the right two thirds of the screen*/
.displaytopright
{
    text-align: left;
    font-weight: bold;
	width: 65%;
	float: right;
}

/*Used for the buttons at the bottom of an eForm. This centers the buttons, so there is no need for
    colSpans to be used to control the location any longer*/
.displayscreenbuttons
{
    text-align: center;
	width: 98%;
	line-height: 30px;
	float: left;
	padding: 10px;
}

/*Bolded label*/
.displaylabel
{
    font-weight: bold;
    text-align: left;
    font-size: 14px;
}

/*Non-bolded label*/
.standardlabel
{
    text-align: left;
    font-size: 14px;
}

/*Header for an information box. Creates a gray background, with a centered bolded headline*/
.infoboxheader
{
  background-color: #ccc;
	color: #000;
	text-align: center;
    font-weight: bold;
    font-size: 16px;
	padding: 5px 0px;
	width:100%;
	position: relative;	
}

/*Standard div, only with an outlined box. Used to better separate the sections*/
.infoboxBaseFile
{
    position: relative;
    width:98%;
    text-align: left;
	font-size: 14px;
	padding: 20px 5px 20px 5px;
	line-height: 22px;
    margin: 15px auto;
    border: solid 1px #d3d3d3;
}

/*Standard div, only with an outlined box. Used to better separate the sections*/
.infobox
{
    position: relative;
    width:90%;
    text-align: left;
	font-size: 14px;
	padding: 5px 5px 5px 5px;
	line-height: 22px;
    margin: 15px auto;
    border: solid 1px #d3d3d3;
}
#infobox {

}

/*Infobox class floated to the left and right */
.infoboxleft
{
    width: 45%;
    float: left;
    padding: 20px;
}

.infoboxright
{
    width: 45%;
    float: right;
    padding: 20px;
}

/***********************************************/
/* Buttons                                     */
/***********************************************/

/*Gray button with rounded corners and specified padding. DO NOT DEFINE BUTTON WIDTH MANUALLY. This style
    assigns a specified padding based on the containing text of the button, making all buttons uniform*/
.btncls
{
	background: #ffffff;
    background-image: -webkit-linear-gradient(top, #ffffff, #ced3d6);
    background-image: -moz-linear-gradient(top, #ffffff, #ced3d6);
    background-image: -ms-linear-gradient(top, #ffffff, #ced3d6);
    background-image: -o-linear-gradient(top, #ffffff, #ced3d6);
    background-image: linear-gradient(to bottom, #ffffff, #ced3d6);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: Arial;
    color: #444444;
    font-size: 12px;
    padding: 3px 12px 3px 12px;
    border: solid #393c3d 1px;
    text-decoration: none;
}

/*Changes color upon hovering*/
.btncls:hover {
  background: #d4d8db;
  text-decoration: none;
}

.btncls:disabled {
  background: #ffffff;
  color: #d0d0d0;
  text-decoration: none;
}

/***********************************************/
/* Search Screens                              */
/***********************************************/

/*Mainly used for error labels and headers*/
.searchscreencenter
{
    text-align: center;
	width: 98%;
	float: left;
	padding: 10px;
}

/*Clears all previous positioning regarding floats inside of the containing div*/
.inputwrap
{
    clear:both;
}

/*Clears all previous positioning regarding floats inside of the containing div*/
.inputwrapRb
{
    clear:both;
}

/*Clears all previous positioning regarding floats inside of the containing div*/
.inputwraptextleft
{
    clear:both;
}

.inputwraptextleft label {
    display: inline-block;
    font-weight: bold;
    width: 150px;
    text-align: right;
}

/*Inputwrap with small indentation*/
.inputwrapsmall
{
    clear:both;
}

.inputwrapsmall label {
    display: inline-block;
    font-weight: bold;
    width: 80px;
    text-align: right;
}

/*THIS PREVENTS HAVING TO USE   50 TIMES IN A ROW TO ADJUST SPACING!!!!!
    This is used to align labels and their corresponding elements. By assigning a total width to the label that is
    greater than the label text, and then right aligning the text, you ensure that whatever element that follows
    the label (textbox, radio button, etc) will be aligned correctly. Otherwise you will end up with staggered
    elements. This may not work in all cases, for example if you have a label and it's text is greater than 300px, 
    then a separate class must be created. Or if you have a smaller label, you may want to decrease the width
    property here*/
.inputwrap label {
    display: inline-block;
    font-weight: bold;
    width: 300px;
    text-align: right;
}

/*In asp.net the text beside a radio button is treated as a label, so if you use the above class, each radio button
    will have 300px of space between them. For labels on radio buttons, you must define the label style directly on
    the page in the element itself, and then use the following class for the radio buttons themselves.
    An example is in ctlOmisSecurityEmails.ascx*/
.inputwraprb label {
    display: inline-block;
    text-align: right;
    width:195px;
}

/*Input wrap class floated to the left and right */
.inputwrapleft
{
    width: 45%;
    float: left;
    padding: 20px;
}

.inputwrapright
{
    width: 45%;
    float: right;
    padding: 20px;
}


.inputwrapleft label {
    display: inline-block;
    font-weight: bold;
    width: 150px;
    text-align: right;
}

.inputwrapright label {
    display: inline-block;
    font-weight: bold;
    width: 150px;
    text-align: right;
}

.floatleft {
    width: 43%;
    float: left;
    padding: 20px;
    margin-left: 30px;
}

.floatright {
    width: 43%;
    float: right;
    padding: 20px;
}


/*Certain search screens require screens to be split. This is the container for the left/right elements
    directly below*/
.searchtopcontainer
{
    line-height: 27px;
    width: auto;
    padding: 5px 10px;
    clear: both;
}

.searchtopleft
{
    text-align: right;
    font-weight: bold;
    width: 30%;
	float: left;
	
}

.searchtopright
{
    text-align: left;
    font-weight: bold;
	width: 65%;
	float: right;
}

/***********************************************/
/* Tables                                      */
/***********************************************/

/*All of the following pertain to the datagrids that are used throughout eForms, not just specifically
    ones on search screens. The key thing to remember with the tables is that you must set the styles for
    the header, item, alternatingItem, etc. individually*/
.searchtable
{
    text-align: Left;
	width: 90%;
	float: left;
	margin-left: 45px;
    margin-top: 15px;
}

.searchtable label
{
    margin-left: 100px;
    margin-right: 10px;
    font-weight: bold;
}

.stbl {
	background: #f5f5f5;
	margin: 0px auto;	
	text-align: left;
	width: 100%;
}	

.stbl td {
	position: relative;
	font-size: 12px;
	padding: 5px 5px 5px 5px;
	line-height: 14px;
    margin: 1px 1px 1px 1px;
    border: solid 1px #dedede;
}

.stblHead {
	background-color: #aaaaaa;
	color: #000;
	border-top: solid 1px #dedede;
	border-right: solid 1px #dedede;
	border-bottom: solid 1px #dedede;
	border-left: solid 1px #dedede;
    font-weight: bold;
    font-size: 14px;
	padding: 10px 0px;
	position: relative;	
}

.stblHead a 
{
    text-decoration: none;
    color: Blue;
    padding: 5px 0px;
}

.stblHead a:hover
{
    text-decoration: underline;
    color: Navy;
}

.stblFooter {
	background-color: #aaaaaa;
	color: #000;
	border-top: solid 1px #dedede;
	border-right: solid 1px #dedede;
	border-bottom: solid 1px #dedede;
	border-left: solid 1px #dedede;
    font-weight: bold;
    font-size: 14px;
	padding: 10px 0px;
	position: relative;	
}

.stblItem, .stblAltItem
{
    font-size: smaller;
}

.stblItem
{
    background-color: #ffffff;
}

.stblAltItem
{
    background-color: #dddddd;
}




/***********************************************/
/* Miscellaneous                               */
/***********************************************/

/*These pertain to CSS that is specific to this instance, in this case: DA Intranet Eforms*/

#dgomainleft
{
    text-align: left;
    width: 46%;
	float: left;
    line-height:25px;	
}

#dgomainright
{
    text-align: left;
	width: 46%;
	float: right;
}

/*Further splits the omismainleft div into another two halves*/
#dgosubleft
{
    text-align: left;
    width: 35%;
	float: left;
}

#dgosubright
{
    text-align: left;
	width: 63%;
	float: right;
}

/*Aligns the labels and textboxes just as the inputwrap label, only with different widths*/
#dgosubleft label 
{
    display: inline-block;
    font-weight: bold;
    width: 70px;
    text-align: right;
}

#dgosubright label 
{
    display: inline-block;
    font-weight: bold;
    width: 75px;
    text-align: right;
}


.inputwrapleftDGO
{
    width: 50%;
    float: left;
    padding: 0px;
}

.inputwraprightDGO
{
    width: 43%;
    float: right;
    padding: 20px;
    vertical-align:top;
}


.inputwrapleftDGO label {
    display: inline-block;
    font-weight: bold;
    width: 170px;
    text-align: right;
}

.inputwraprightDGO label {
    display: inline-block;
    font-weight: bold;
    width: 150px;
    text-align: right;
}


.alignedlabelsmall
{
    display: inline-block;
    width: 50px;
    font-weight: bold;
    text-align: right;
}

.alignedlabellarge
{
    display: inline-block;
    width: 75px;
    font-weight: bold;
    text-align: right;
}

.DGOinfobox
{
    position: relative;
    width:90%;
    text-align: left;
	font-size: 14px;
	padding: 5px 5px 5px 5px;
	line-height: 18px;
    margin: 15px auto;
    border: solid 1px #000;
}

.ajax__calendar_container
{
    z-index:2000 ;
}

/***mds 5/18/15**/
#tablemainleft
{
    text-align: left;
    width: 515px;
	float: left;
    line-height:25px;	
}

#tablemainright
{
    text-align: left;
	width: 375px;
	float: right;
}
/**mds 5/18/15*/


/***********************************************/
/* Footer                                      */
/***********************************************/

/*Much of the footer CSS is not needed for the eForms. I copied over what I had wrote for the intranet/internet
    in case it was ever needed in the future. It's just setting fonts, colors, widths, etc. Very simple.*/
#footer
{
    text-align: center;
	font-size:0.7em;
	color: #464646;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.5em;
	padding-left: 0px;
	padding-top: 10px;
	margin-bottom: 20px;
	clear: both;
	padding-right: 0px;
	list-style-type: none;
	text-align:center;
}

#footer a{
	color: blue;
	text-decoration: none;
	margin-bottom: 5px;
}

#footer li{
	margin-left: -35px;
	list-style-type: none;
}

#footer a:hover{
	color: #841935;
	margin-bottom: 5px;
}

.footer_bold{
	color: #841935;
	font-weight: bold;
	font-size: 1.2em;
}

	
#footer-topstate
	{
	padding-left: 25px;
	margin: 0px;
	padding-top: 0px;
	float: left;
	}
	
#footer-bottom{
	width: 100%;
	}	
	
#footer-info{
	float: right;
	width: 48%;
	}	
	
.strong{
	font-weight:bold;
}
.small{
	font-size: 11px;
	margin-top: 5px;
	margin-bottom: 0px;
	clear: both;
	float: left;
	width: 100%;
	line-height: 15px;
}

.attention{
	color: #841935;
	font-weight: bold;
}


/***********************************************/
/* Previous Eforms CSS                         */
/***********************************************/

/*Old schtuff*/

.formerror {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: red;
}
.formtext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}
.tablehead {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}
.tableheadsmall {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: bold;
}
.formfields {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	font-weight: normal;
}
.formtextNormal {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
}
.navbar {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}
.mainmenutext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.copyright {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
}
 a:visited  {
              	color : DarkBlue;
}
 a:link {
              	color : Blue;
}
 a:hover  {
              	color : Red;
}.asterisk {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #7a142d;
}










/*END NEW CSS*/





/*OLD CSS*/

/*
    .FormError {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: red;
}
.FormText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}
.TableHead {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}
.TableHeadSmall {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: bold;
}
.FormFields {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	font-weight: normal;
}
.FormTextNormal {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
}
.NavBar {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}
.MainMenuText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.Copyright {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
}
 a:visited  {
              	color : Navy;
}
 a:link {
              	color : Blue;
}
 a:hover  {
              	color : Red;
}.Asterick {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #7a142d;
}
.BtnCls
{
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 11px;
	behavior: url(includes/Button.sct);
	color: black;
	filter: progid:DXImageTransform.Microsoft.Gradient (GradientType=0,StartColorStr= 'MistyRose' ,EndColorStr= '#cc9999' );
	border-top: linen 1px solid;
	border-left: linen 1px solid;
	border-right: wheat 1px solid;
	border-bottom: wheat 1px solid;
}
    */
  .tablestyle 
{
    border-spacing: 1px;
    border-collapse: collapse;
    border: 1px;
    margin: 5px auto;
    width: 100%;
}

.tablestyle td 
{
    padding: 5px;
    width:150px;
    border: solid 1px #dedede;
}