/*
 * Style File: mavsgLyout01.css
 * Sets in detail the css property  html tags
 * for the 
*/

body {
	background: #FFFFFF;
}
/* Set properties for all hs's tags */
h1, h2, h3, h4, h5 {
  color: #000000;
  font-size:1.5em;
  font-family:Arial, sans-serif, Verdana, Tahoma;
  font-weight:bold;
  text-align:center;
  margin:0.1em 0em;
  Padding:0em;
}

/* */
h1 {
  font-size:1.8em;
}
h2 {
  font-size:1.5em;
}
h3 {
  font-size:1.1em;
}
h4 {
  font-size:0.9em;
}

h5 {
  font-size:0.7em;
}

/* */
#syb_imageLogo {
	position:relative;
	top:7px;
	left:0px;
  margin:0px;
  padding:0px;
  width:100%;
  height:160px;
  background-image:url("../img/mavsgLogo_R.jpg");
	background-repeat:no-repeat;
  background-position:top center;
}

/* style for inserting a line with blueLine image. */
div.syb_blueLine01 {
  margin:10px 0px; 
  padding:0px;
  width:100%; 
  height:3px;
  background-image:url("../img/blueLine_3x9.jpg");
	background-repeat:repeat-x;
  background-position:top left;
}


/*

*/
#syb_initMsg {
  position: relative;
  left:0px;
  top: 0px;
  text-align:center;
  line-height:1.8em;
  height:auto;
  width:100%;
  border:0px dashed #8DCB41;
  font-family:Arial, sans-serif, Helvetica;
  font-size: 1em;
}

/* List (UL tag) with blue dots for the home page */
#syb_textList01 {
  font-family:Verdana, 'Lucida Grande', Arial, Tahoma, sans-serif,'Courier New';
  font-weight:normal;
  font-size:0.8em;
  letter-spacing:0em;
  line-height:1.2em;
  text-align:justify;
  list-style:disc url("../img/blueDot_5x5.jpg") outside;
  position:relative;
  left:0.8em;
  top:10px;
	white-space:normal;
	word-spacing:normal;
  margin:0em;
  padding:0em;
}

/* IMPORTANT: For MS IE ver 7 (at least). We need to set the left
 * margin to 1.8em otherwise our blue dot will no be shown.
 * We set bottom marging to 1.2em to give more space between list items 
 */
#syb_textList01 li {
  padding:0px;
  margin:0em 0em 0.8em 1.8em;
}

/* It Formats a page content text by preserving
 * the white spases with 'white-space:pre;' and
 * places text in the middle. For poems
 */
p.syb_preservSpaceMid {
  height:auto;
  width:100%;
  border:0px dashed #8DCB41;
  font-family:Verdana, 'Lucida Grande', Arial, Tahoma, sans-serif, Helvetica,'Courier New';
  font-size:0.8em;
  font-weight:normal;
  letter-spacing:0em;
  line-height:1.8em;
  white-space:pre;
  text-align:center;
  position: relative;
  left:0px;
  top:0px;
}

span.syb_italicText01 {
  font-style:italic;
  font-weight:normal
}

/* Redefined h3 for page title */
h3.syb_pageTittle01 {
  text-align:justify;
}

/* Redefined h4 for paragraph title */
h4.syb_paraTittle01, h5.syb_paraTittle01 {
  text-align:left;
  margin:0.4em 0em;
}

/* Redefined h4 for paragraph title no. 2 left aligh */
h4.syb_paraTittle02, h5.syb_paraTittle02 {
  text-align:left;
  margin:0.4em 0em;
}

/* It Formats a paragraph content. The 1st line is
 * indented with white spases by 'text-indent:1.5em;'
 * Provides a blank line after at the end of paragraph
 * by using  margin-bottom
 */
p.syb_parText01 {
  height:auto;
  width:100%;
  border:0px dashed #8DCB41;
  font-family:Verdana, 'Lucida Grande', Arial, Tahoma, sans-serif, Helvetica,'Courier New';
  font-size:0.8em;
  font-weight:normal;
  font-style:normal;
  letter-spacing:0em;
  line-height:1.6em;
  white-space:normal;
  text-align:left;
  text-indent:1.5em;
  margin:0px;
  padding:0px;
  margin-bottom:0.7em; 
  position:relative;
  left:0px;
  top:0px;
}


/*
 * We require to place some text in the left side and an image in
 * the right side. i.e. side by side.
 *
 * The div tag that uses "syb_textAndImg" must wrap the syb_leftText0 tag. e.g.
 * 
 * <!-- <div id="syb_textAndImg"> -->
 *   <!-- <div id="syb_leftText02"> -->
 *      ...
 *      ...
 *   <!-- </div> -->
 * <!-- </div> -->
 * 
 * This id selector adds the image as a backgoumd to the 
 * right side of the div tag that uses this selctor 
 */
div.syb_textAndImg02 {
  border:0px solid purple;
  height:auto;
  position:relative;
  left:0px;
  top:0px;
	background-image:none;  /* Img is added in html file. */
	background-repeat:no-repeat;
  background-position:top right;
}

/* General Table properties */     
div.syb_addTbl {
  font-family:sans-serif, Verdana, Tahoma, Arial, 'Courier New';
  font-weight:normal;
  font-size:0.8em;
  line-height:1.4em;
  background:#ECECEC;
  border:1px solid #FFCC33;
  width:100%;
  height:auto;
  position:relative;
  left:0px;
  top:10px;
  padding:0px;
  margin:0px;
}
/* 1st. Column property */
div.syb_col01 {
  border:0px solid green;
  width:30%;
  height:auto;
  position:relative;
  left:10px;
  top:0px;
  padding:0px;
  margin:0px;
}
/* 2nd. Column property */
div.syb_col02 {
  border:0px solid red;
  width:30%;
  height:auto;
  position:absolute;
  left:220px;
  top:0px;
}
/* 3er. Column property */
div.syb_col03 {
  border:0px solid aqua;
  width:28%;
  height:auto;
  position:absolute;
  left:425px;
  top:0px;
}

/* IMPORTANT: For Firefox ver. 2.0.04 (at least). We need to set the list
 * image and type property to none; to avoid that list items (li) display
 * a marker/bullet. In MS IE 7 these properties are set to none by default.
 */
ul {
list-style-image:none; list-style-type:none;
}

div.syb_addTbl_print {
  width:50%;
  height:auto;
  position:relative;
  left:0px;
  top:0px;
  display:none;
}     
     
div.syb_col01_print {
  width:100%;
  position:relative;
  left:20px;
  top:0px;
}

/* 
 * Table for the Asbestos Conference printing
 * NOTE: The properties 'border-collapse:separate;' and
 *  'border-spacing:20px 10px;' work fine for the FireFox browser,
 * but not for MS IE.
*/
table.syb_tformTbl01 {
  line-height:1.8em;
  position:relative;
  left:0px;
  top:0px;
  display:table;
}
/* Add separation for 2nd. column. We use 2 spaces (&#32;) to
 * separate the 1st and 2nd column of the table.
 *
 * NOTE: In the 2nd column; the properties 'position:relative;', 'left:10px;'
 * and 'top:0px;' work fine for MS IE, but not for FireFox browser.
 */
table tr td + td, td.syb_222 {
  white-space:pre;
}

/* */
table tr td.syb_hideMe {
  visibility:hidden;
}