/* *************************************************************************
 *                                                                         *
 * Provides 'Condisline' decorative styling for the Survey System          *
 *                                                                         *
 * Version: $Id: surveys_standard.css,v 1.2 2005/08/24 06:39:17 simonm Exp $ *
 *                                                                         *
 ************************************************************************* */

/* **********************************************************************
 * ******************************************************************** *
 * ************* L A Y O U T  &  D E C O R A T I O N ****************** *
 * ******************************************************************** *
 ********************************************************************** */

/* **********************************************************************
                          ELEMENT'S
 ********************************************************************** */
/* body {background: #FEAE1C; color: white; margin: 0; padding: 0;} */
body {background: #FFFFFF; color: white; margin: 0; padding: 0;}
h1 {letter-spacing: 0.1em; font-size:1.9em; font-family:verdana, arial, helvetica, sans-serif; color: #446; padding: 0.25em 0.33em 0.125em; border-bottom: 5px double #557; border-top: 3px double #CCF;}
h2 {letter-spacing: 0.1em; font-size:em; font-family:verdana, arial, helvetica, sans-serif; color: #446; padding: 0.25em 0.33em 0.125em; border-bottom: 5px double #557; border-top: 3px double #CCF;}
h3 {letter-spacing: 0.1em; font-size:1.2em; font-family:verdana, arial, helvetica, sans-serif; color: #446; padding: 0.25em 0.33em 0.125em; border-bottom: 5px double #557; border-top: 3px double #CCF;}
h4 {letter-spacing: 0.1em; font-size:1.2em; font-family:verdana, arial, helvetica, sans-serif; color: #446; padding: 0.25em 0.33em 0.125em; border-bottom: 5px double #557; border-top: 3px double #CCF;}

a {
    font-size:11px;
    font-family:verdana, arial, helvetica, sans-serif;
    font-weight:600;
    text-decoration:none;
    }

#note_header a:visited { color:white; }
#note_header a:link { color:white; }
#note_header a:hover { background-color:#09c; }

#section_header a:visited { background-color: #E7EFF7; color:#07a; }
#section_header a:link { background-color: #E7EFF7; color:#07a; }
#section_header a:hover { text-decoration: underline;}

#header a:visited { background-color: #ffc0ff; color:#07a; font-family: Arial, sans-serif; letter-spacing: 0.2em; border-bottom: 5px double #557; font-size: 0.8em;}
#header a:link { background-color: #ffc0ff; color:#07a; font-family: Arial, sans-serif; letter-spacing: 0.2em; border-bottom: 5px double #557; font-size: 0.8em;}
#header a:hover { background-color:#09c; }

a:link {color:blue;}
a:visited {color:blue;}
/* a:hover {background-color:#E7EFF7;} */
a:hover {text-decoration: underline;}

a img { border-width: 0px; }

/* **********************************************************************
                          CLASSES
 ********************************************************************** */
.inputText { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: none; border-style: solid; border: 1px black; color: black; background-color: white; }
.inputSelect { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: none; border-style: solid; border: 1px black; color: black; background-color: white; }
.inputButton { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none; border-style: solid; border: 1px;}
.inputButtonAnswered { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: grey; text-decoration: none; border-style: dotted; border: 1px;}
.maintenanceTable table{ border-style: solid; border: 1px; }
.title { color:#000; font-size:14px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600;}

.invisibleList { list-style: none; width:auto; height:auto; margin: 0.164em;}
.leftAlign { text-align: left; }
.rightAlign { text-align: right; }
.centerAlign { text-align: center; }

.formElementLeft {text-align: left; color:black; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.formElementBlackLeft {text-align: left; color:black; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.formElementLightBlueLeft {text-align: left; color:#09c; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.formElementRight {text-align: right; color:black; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.formElementCenter {text-align: center; color:black; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}

.error {color:red; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.warning {color:grey; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}

.lastElement { border: 1px; }
.disabled {color:silver; font-size:11px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}

.menuHR { width: 10%; }

/* #07a */
.breadcrumbs {color: black; font-size:10px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.breadCrumbData {color:blue; font-size:10px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}

.preview {color:#7C98A6; font-size:12px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}
.preview_disabled {color:grey; font-size:10px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600;}

.section_header { font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 1em; background-color: #FFC0FF; }

div.hr { width:100px; margin-top: 5px; border-bottom:1px #ccc; }
div.hr hr { display: none; }

/* **********************************************************************
                          LAYOUT ID'S
 ********************************************************************** */
#breadcrumbs {
    position:absolute;
    top:10px;
    left:5px;
    height: 20px;
    width:auto;
    text-align: left;
    border: 0px dotted #ccc;
}

#preview {
    position:absolute;
    top:10px;
    right:5px;
    height: 20px;
    width:auto;
    text-align: right;
    border: 0px dotted #ccc;
}

#answers {text-align: center; color:black; font-size:10px; font-family:verdana, arial, helvetica, sans-serif; font-weight:600; text-decoration:none;}

#survey_history {text-align: center; color:black; font-size:10px; font-family:verdana, arial, helvetica, sans-serif; text-decoration:none; border: 0px;}

#header { position:absolute left: 0em; top:0em; height:3em; margin: 0; font-family: Arial, sans-serif; font-size: 0.75em; letter-spacing: 0.2em; padding: 0.25em 0.33em 0.125em; border-bottom: 1px #E1E8EF; color: white; background-color: #003A7B; }
#header_center {position:absolute; top:7px; left: 50%; height:auto; }
#header_left { float:left; height:auto; }
#header_right { float:right; height:auto; }

#centeredContent {
    width: 420px;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-right: auto;
    margin-left: auto;
    /* opera does not like 'margin:20px auto' */
    background: white;
    border: 2px solid #0B0884;
    text-align:center;
    /* part 2 of 2 centering hack */
    width: 400px; /* ie5win fudge begins */
    voice-family: "\"}\"";
    voice-family:inherit;
    width: 370px;
    }


html>body #centeredContent {
    width: 370px; /* ie5win fudge ends */
    }



#leftContent {
    position:absolute;
    width: 50px;
    margin-top: 20px;
    height:auto;
    border: 0px;
    width: 45px; /* ie5win fudge begins */
    voice-family: "\"}\"";
    voice-family:inherit;
    width: 45px;
    }


html>body #leftContent {
    width: 45px; /* ie5win fudge ends */
    }


#leftcontent {
        position: absolute;
        left:25px;
        top:100px;
        width:auto;
        background:#E7EFF7;
        border:0px;
        }

#rightcontent {
        position: absolute;
        right:18px;
        top:100px;
        width:auto;
        background:#E7EFF7;
        border:0px;
        }

#leftContentNote {
    clear:both;
    width: auto;
    height:auto;
    padding: 10px;
    margin-top: 0px;
    margin-bottom: 10px;
    margin-right: auto;
    margin-left: 0px;
    background: #FFFFFB;
    border: 2px solid #0B0884;
    }

#rightContentNote {
    clear:both;
        min-width: 85px;
    width: auto;
    height:auto;
    padding: 10px;
    margin-top: 0px;
    margin-bottom: 10px;
    margin-right: auto;
    margin-left: 0px;
    background: #FFFFFB;
    border: 2px solid #0B0884;
    }


#centeredBackground {
    position:relative;
    width: 100%;
    height: 400px;
    padding: 40px 2px 2px 2px;
    margin-top: 3px;
    margin-bottom: 3px;
    margin-right: auto;
    margin-left: auto;
    /* opera does not like 'margin:20px auto' */
    background: #E7EFF7;
    border: 2px solid #0B0884;
    /* part 2 of 2 centering hack */
    width: 100%; /* ie5win fudge begins */
    voice-family: "\"}\"";
    voice-family:inherit;
    width: 99.5%;
    padding: 60px 10px 10px 10px;
    }

html>body #centeredBackground {
    width: 96%; /* ie5win fudge ends */
    }

/* DBDBFD */
/* #main { position:relative; left: 0em; top:0em; width: 95%; padding: 0.66em; border-width: 0px; background-color: #FEAE1C; } */

/* #main { position:relative; left: 0em; top:0em; width: 95%; padding: 0.66em; border-width: 0px; background-color: #FFFFFF; } */
#main { position:absolute; left: 0px; top:41px; width: 95%; padding: 0.66em; border-width: 0px; background-color: #FFFFFF; }
#section { position:relative; border-width: 1px; width:100%; margin: 0.44em; padding:0; background-color: white; }
#section_header { float:left; border-width: 1px; margin: 5px 5px 5px 5px; width:40%; background: #E7EFF7;}
#section_header_right { float:right; border-width: 0px; margin: 5px 5px 5px 5px; width:10%; background: white;}
#section_header_centered { 	margin-right: auto;	margin-left: auto; border-width: 0px; margin-top: 5px; margin-top: 5px; width:10%; background: white;}
#note_level { position:relative; border-width: 0px; width:100%; margin: 0em; padding:0; background-color: white; }
#note_container { float:left; border-width: 1px; width:25%; margin-left: 0.44em; margin-bottom: 1em; padding: 0.44em 0.44em 0.44em; border-style: none; background-color: white; }
#note { position:relative; border-width: 1px; width:100%; padding-bottom: 1em; font-family: Arial, sans-serif; font-size: 0.88em; border-width: 0px; background-color: #E7EFF7; border: 1px #003A7B;}
#note_answered { position:relative; border-width: 1px; width:100%; padding-bottom: 1em; font-family: Arial, sans-serif; font-size: 0.88em; border-width: 0px; background-color: #E7E3E3; }
#note_header { font-size: 12px; width: 200px; font-weight: bold; letter-spacing: 0.1em; padding: 0.1em; border: 0px 0px 1px 0px; background-color: #003A7B; color: white;}
#note_footer { position:absolute; bottom:0; left:0; margin-bottom: 0.5em; text-align: center; width:100%; border: 0px; background-color: #E7EFF7; }
#note_footer_answered { position:absolute; bottom:0; left:0; margin-bottom: 0.5em; text-align: center; width:100%; border: 0px; background-color: #E7E3E3; }





/* **********************************************************************
 * ******************************************************************** *
 * ********************* O N L Y  L A Y O U T ************************* *
 * ******************************************************************** *
 ********************************************************************** */

/* **********************************************************************
                          LAYOUT ID'S
 ********************************************************************** */
#left_list { float:left; text-align: left; width: 100%; margin-bottom: 2em; border-width: 0px; }
#centre_list { float:left; text-align: center; width: 200px; margin-bottom: 2em; border-width: 0px; }

span#label {font-weight: bold;}
#label_left { width:auto; text-align: left; border-width: 0px; }
#label_middle { text-align: center; border-width: 0px; }
#label_right {width:auto; text-align: right; border-width: 0px; }

/* **********************************************************************
                          LAYOUT CLASSES
 ********************************************************************** */
.Spacer { clear: both; font-size: 1px; border-width: 0px; }



/* **********************************************************************
                          ELEMENT'S
 ********************************************************************** */
div {border: 1px solid #335;}
p {margin: 1em 0; padding: 0;}
ul {list-style: none; padding-left: 0.164em;}
ul#offset {list-style: none;  padding-left: 1em;}
ul#left_list {list-style: none;  padding-left: 1em;}

h1, h3, h4 {font-family: Arial, sans-serif; font-style: italic; font-weight: normal; margin: 0; text-transform: lowercase;}


/* **********************************************************************
                          COMMON BACKOFFICE
 ********************************************************************** */
 .text12Red { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #cc0000; text-decoration: none }
 .text10White { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: normal; color: #FFFFFF; text-decoration: none }
 .text14BoldWhite {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration: none }
 .link10BoldWhite { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: underline }
 .text12BoldRed { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #cc0000; text-decoration: none }

 span#whiteLabel { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFFFFF; text-decoration: none; }

#header { position:absolute left: 0em; top:0em; height:3em; margin: 0; font-family: Arial, sans-serif; font-size: 0.75em; letter-spacing: 0.2em; padding: 0.25em 0.33em 0.125em; border-bottom: 1px #E1E8EF; color: white; background-color: #003A7B; }
#BackOfficeHeader a:visited { color:white; font-family: Verdana, Arial, Helvetica, sans-serif;  font-size: 0.8em;}
#BackOfficeHeader a:link { color:white; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.8em;}
#BackOfficeHeader a:hover { text-decoration: underline;}

#BackOfficeHeader {
    position:absolute;
    top:0px;
    left:0px;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    /* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
    height:35px; /* 35px(height) + 00px (border) + 0px (padding) = 35px */
    border-style:solid;
    border-color:black;
    border-width:0px 0px 1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
    line-height:11px;
    color: white;
    background-color: #003A7B;

/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity.
Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it.
IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style
declaration. The incorrect IE5/Win value is above, while the correct value is
below. See http://glish.com/css/hacks.asp for details. */
    voice-family: "\"}\"";
    voice-family:inherit;
    height:35px; /* the correct IE5/Win height  35px(height) - 00px (border) - 0px (padding) = 35px */
    }
/* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct
length values to user agents that exhibit the parsing error exploited above yet get
the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#BackOfficeHeader {height:35px;}