/* CSS Document Copyright 2011 MS Dept of Information Technology Services */

/* SITE COLORS ---- Rich Gold #d29e17, Dark Navy-like Blue #17356b; for Banking.  Vibrant Blue #008fdb, Navy #661220 for MREC. */
/* -webkit=Safari and older versions of Chrome, Chrome 12 standard.  -moz=older versions of Firefox, Firefox 5 Standard.  -o=Opera, Opera 11.50 Standard.  -khtml=Konqueror */

body {
    margin: 16px 0 10px 0; /* top margin allows the shadow to show well, bottom provides space for footer to begin. */
    padding: 0;
    text-align: center;
    font: 12px Arial, Verdana, Helvetica, sans-serif;
    color: #000;
    background-color: #fff;
}

/*  Fixes the page jumping in Firefox  */
html {
    min-height: 100%;
    margin-bottom: 1px;
}

/* Sets everything to 0 due to some browsers automatically adding padding and margins */
* {
    margin: 0;
    padding: 0;
}

/* BEGIN Headings */
/* For 18px, bold text, left aligned for page titles*/


h1 {
    color: #000000;
    background-color: #fff;
    text-indent: 0;
    text-align: left;
    padding: 0;
    margin: 0;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 25px;
    font-weight: bold;
}

/* For Paragraph Titles 15pxt, Bold text, Special Effects left aligned, Bottom 0  */
h2 {
    text-indent: 0;
    text-align: left;
    padding: 0;
    margin-bottom: 0;
    font: 15px Arial, Verdana, Helvetica, sans-serif;
    font-weight: bold;
    color: #000000;
    background-color: transparent;
}

.boxthick h2 {
    color: #fff;
    background-color: transparent;
    position: relative; /* IMPORTANT!  Only IE6, needs this for titles to display, otherwise they are a no show! */
    margin-top: -25px;
    margin-bottom: 15px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -khtml-box-shadow: 0;
    box-shadow: none;
    font: 18px Arial, Helvetica, sans-serif;
}

/* May not need for Applications  */
.boxthin h2 {
    color: #17356b;
    background-color: #fff; /* position: relative; */ /*  Doesn't seem to be needed anywhere */ /* margin-top: -25px; */
    margin-bottom: 10px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -khtml-box-shadow: 0;
    box-shadow: none;
    font: 18px Arial, Helvetica, sans-serif;
}


/* For Paragraph Titles 14px, bold text, left aligned */
h3 {
    color: #000000;
    background-color: transparent;
    text-indent: 0;
    text-align: left;
    padding: 0;
    font: 14px Arial, Verdana, Helvetica, sans-serif;
    font-weight: bold;
}

.inline h3 {
    display: inline;
}

/* Black text, For 12px, bold text, left aligned, Bottom 0 */
h4 {
    color: #000000;
    background-color: transparent;
    text-indent: 0;
    padding: 0;
    margin: 0;
    font: 12px Arial, Verdana, Helvetica, sans-serif;
    font-weight: bold;
}

/* For 12px, normal text, no align */
h5 {
    color: #000000;
    background-color: transparent;
    text-indent: 0;
    padding: 0;
    font: 12px Arial, Verdana, Helvetica, sans-serif;
}

/*  #000000; For 9pt, normal text, centered TOP NAV WRITTEN OUT */
h6 {
    color: #764A1D;
    background-color: transparent;
    text-indent: 0;
    text-align: center;
    padding: 0;
    margin: 0;
    font: 11px Arial, Verdana, Helvetica, sans-serif;
}

/* END Headings */

/* The WRAP and WRAPINSIDE give the look of a graphically designed look and feel. */
/* WRAP is the thicker outside border of the website/application and includes a shadow all the way around the "box. */
#wrap {
    border: 6px solid #008fdb; /* COLOR OF BORDER!  CHANGE HERE IF COLOR IS CHANGING! */
    width: 960px;
    background-color: #fff;
    color: #000;
    margin: 0 auto;
    padding-bottom: 9px;
    padding-top: 9px;
    -moz-border-radius: 8px;
    -o-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px;
    -moz-box-shadow: 0 0 15px #fff;
    -webkit-box-shadow: 0 0 15px #fff;
    -o-box-shadow: 0 0 15px #fff;
    -khtml-box-shadow: 0 0 15px #000;
    box-shadow: 0 0 15px #000;
}

/* WRAPINSIDE is the thinner inside border of the website/application. */
#wrapinside {
    border: 1px solid #008fdb; /*  COLOR OF BORDER!  CHANGE HERE IF COLOR IS CHANGING! */
    border-top: none; /* Removed as top border was showing just above the image header border */
    width: 940px;
    background-color: transparent;
    color: #000;
    margin: 0 auto;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    border-bottom-left-radius: 0;
}

/* HEADERBOX provides a border of color, along with a slight blurred shadow for the HEADER image of the website/application. */
.headerbox {
    border: 2px solid #661220; /* COLOR OF BORDER!  CHANGE HERE IF BORDER COLOR IS CHANGING! */
    background-color: #fff;
    color: #000;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px #888;
    -o-box-shadow: 0 0 5px #888;
    -khtml-box-shadow: 0 0 5px #888;
    box-shadow: 0 0 5px #888;
    overflow: hidden;
}

.headerbox #header-main {
    background: url(../images/admin_header.png) no-repeat center center;
    width: 936px;
    height: 74px;
    display: block;
    text-align: center;
    padding: 10px;
}
.headerbox #header-main #header-logo {
}

/* Used for adding spacing along the inside wall of the wrapper for display.  .Net will likely handle this in the Application. */
#content {
    padding: 17px 10px 10px 10px;
    text-align: left; /* background-color: #fff; */ /*  Had to comment this out so that the inner wrapper corners would show up */
    color: #000; /* width: ?px; once DIVs are determined */
}

/* used to denote in Text where the FOOTER COMPONENTS will be located. */
#footer {
    color: #000;
    background-color: transparent;
}

/* CLEARBOTH, CLEARLEFT AND CLEARRIGHT are used to CLEAR FLOATS when used. */

.clearboth {
    clear: both;
}

.clearleft {
    clear: left;
}

.clearright {
    clear: right;
}

/*  BOXES for Login, Forms, and other uses.  Various Widths.  Height adjusts to content.  */

/* Used only for Chrome and Opera fixes, will not display in Firefox and IE9 - Will remove once Chrome and Opera have been corrected. */
.top {
    display: none;
}

/*  BEGIN code for Boxes, Thick Top and Thin Boxes  */
/*  Box with Thick Top  */
.boxthick {
    border: 1px solid #661220; /* COLOR OF BORDER!  CHANGE HERE AND NEXT LINE IF CHANGING! */
    border-top: 30px solid #661220; /* COLOR OF TOP THICK BORDER!  CHANGE HERE AND TOP LINE IF CHANGING! */
    background-color: #fff;
    color: #000; /*padding: 10px; 		padding-top: 0; 		margin:  1.20em; 		float: left;*/
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -khtml-box-shadow: 0 0 6px #000;
    box-shadow: 0 0 6px #000;
}

/*  Box with Top Thin Border  */
.boxthin {
    border: 1px solid #661220; /* COLOR OF BORDER!  CHANGE HERE IF BORDER COLOR IS CHANGING! */
    background-color: #fff;
    color: #000;
    padding: 1.5em 0;
    margin: 0 auto;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -khtml-box-shadow: 0 0 6px #000;
    box-shadow: 0 0 6px #000;
    margin-bottom: 10px;
}

/* Size of Boxes */

/*  Box 250px Wide  */
.box250 {
    width: 250px;
}

/*  Box 450px Wide with Equal Thin Borders  */
.box450 {
    text-align: center;
    border: 1px solid #90262E; /* COLOR OF BORDER!  CHANGE HERE IF BORDER COLOR IS CHANGING!  #ccc; */
    width: 450px;
    background-color: #fff; /*  COLOR OF BACKGROUND - CURRENTLY WHITE */
    color: #000; /* COLOR OF TEXT - CURRENTLY BLACK */
    padding: 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -khtml-box-shadow: 0 0 6px #000;
    box-shadow: 0 0 6px #000;
}
/*  Box Header 450px Wide with Equal Thin Borders. Use it along with box450  */
.box450Header {
    border: 1px solid #90262E; /* COLOR OF BORDER!  CHANGE HERE AND NEXT LINE IF CHANGING!  #ccc; */
    width: 455px;
    height: 18px;
    background-color: #90262E; /*  COLOR OF BACKGROUND - CURRENTLY WHITE */
    color: #fff; /* COLOR OF TEXT - CURRENTLY BLACK */
    padding: 5px;
    padding-left: 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
    font-family: Arial;
    font-size: 15px;
    font-weight: bolder;
    left: -11px;
    top: -12px;
}
.box700Header {
    background-color: #90262E;
    border: 1px solid #90262E;
    border-radius: 6px 6px 0 0;
    color: #FFFFFF;
    font-family: Arial;
    font-size: 15px;
    font-weight: bolder; /*height: 40px;*/
    left: 0;
    padding: 6px 6px 6px 2px;
    position: relative;
    top: -5px;
}
.box700HeaderNew {
    border: 1px solid #90262E; /* COLOR OF BORDER!  CHANGE HERE AND NEXT LINE IF CHANGING!  #ccc; */
    width: 685px;
    height: 20px;
    background-color: #90262E; /*  COLOR OF BACKGROUND - CURRENTLY WHITE */
    color: #fff; /* COLOR OF TEXT - CURRENTLY BLACK */
    padding: 6px;
    padding-left: 2px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
    font-family: Arial;
    font-size: 15px;
    font-weight: bolder;
    left: -4px;
    top: -12px;
}

/*  Box 550px Wide  */
.box550 {
    text-align: center;
    border: 1px solid #90262E; /* COLOR OF BORDER!  CHANGE HERE IF BORDER COLOR IS CHANGING!  #ccc; */
    width: 550px;
    background-color: #fff; /*  COLOR OF BACKGROUND - CURRENTLY WHITE */
    color: #000; /* COLOR OF TEXT - CURRENTLY BLACK */
    padding: 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -o-box-shadow: 0 0 6px #000;
    -khtml-box-shadow: 0 0 6px #000;
    box-shadow: 0 0 6px #000;
}

/*  Box 700px Wide  */
.box700 {
    width: 90%; /*width: 700px;*/
}
/*  Box 700px Wide  */
.box740 {
    width: 740px;
}
/*  Box 750px Wide  */
.box750 {
    width: 750px;
}
/*  Box 850px Wide  */
.box850 {
    width: 850px;
}
/*  Box 850px Wide  */
.box900 {
    width: 900px;
}

/*  END code for Boxes  */

/* Cool Raised Drop Shadow Box used to Highlight information for User */

.drop-shadow {
    position: relative; /*float:left;*/ /*width: 60%;  /* width: 40%; */
    padding: 1em; /*margin:2em 10px 4em; */
    background: #fff;
    text-align: center; /*  added this  */
    font-size: 12px; /*  added this  */
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - no pseudo-elements needed */

.raised {
    border: solid 1px #ccc; /* #ccc; #e0e0e0; added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - Width 250px - no pseudo-elements needed */

.raised250 {
    width: 250px; /* added for square boxesr */
    text-align: left; /* added */
    border: solid 1px #ccc; /* added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - Width 350px - no pseudo-elements needed */

.raised350 {
    width: 350px; /* added for square boxesr */
    text-align: left; /* added */
    border: solid 1px #ccc; /* added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - Width 450px - no pseudo-elements needed */

.raised450 {
    width: 450px;
    border: solid 1px #ccc; /* added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - Width 650px - no pseudo-elements needed */

.raised650 {
    width: 650px;
    border: solid 1px #ccc; /* added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Raised shadow - Width 860px - no pseudo-elements needed - For Admin Image */

.raised860 {
    width: 860px;
    border: solid 1px #ccc; /* added for IE8 and older */
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* End Raised Drop Shadow Box code */
.sectionPanel {
    page-break-inside: avoid;
    width: 94%;
    padding-top: 4px;
    padding-bottom: 12px;
    padding-left: 10px;
    text-align: left;
    vertical-align: middle;
    clear: both;
    display: block;
    margin-top: 5px;
    margin-bottom: 5px;
}

.sectionHeader {
    width: 100%;
    clear: both;
    position: relative;
    text-align: center;
    display: block;
}

.subsectionHeader {
    width: 100%;
    clear: both;
    position: relative;
    text-align: center;
    display: block;
    margin-top: 10px;
}

.sectionContent {
    width: 100%;
    clear: both;
    position: relative;
    display: block;
}
.interior {
    position: relative;
    width: 94%;
    border: solid 1px black;
    background-color: #FBFBB5;
    padding-top: 4px;
    padding-bottom: 5px;
    padding-left: 2px;
    text-align: left;
    margin: 0 auto;
    vertical-align: middle;
}
.paddedParagraphs p {
    padding: 5px;
}

#wrap {
    border: 6px solid #7F8588;
}
.headerbox {
    border: 2px solid #535A63;
}
#wrapinside {
    border: 1px solid #C1C4C5;
}