/* ***************************************************** */
/*    Roger Waller's Website - STYLES                    */
/*                                                       */
/*    Created By: Leo Marin/Marin-Enterprises.com        */
/*    Date:       01/23/08                               */
/*                                                       */
/*    Filename:   InStyle.css                            */
/*                                                       */
/*    Notes:      [02/01/2008] Amended Youtube class.    */
/*                 Padding on the bottom changed from    */
/*                 1 to 2, to match length with          */
/*                 featured colleagues section.          */
/* ***************************************************** */

/* margin size of the page body to 0 pixels */
body {
      margin: 0
     }

/* all headings (h1 through h6) in a black sans-serif font. */
h1, h2, h3, h4, h5, h6 {
                        color: black; 
                        font-family: sans-serif
                       }

/* head selector: Format applied to (rw_logo.gif). Left margin has been set to 10px. 
   Object is floated left.
*/
#head {
       margin-left: 10px; 
       float:left
      }

/* head_address selector: Formats address information such as location, city, 
   state, and zip code. 14px sized font, sans-serif font family, font boldened, left
   margin set to 10px, text is centered, bottom border is a solid blue 1px thick, and
   object is floated clear off other objects.
*/
#head_address {
               font-size: 14px;
               font-family: sans-serif;
               font-weight: bold;
               margin-left: 10px;
               text-align: center;
               border-bottom: 1px solid blue;
               float: clear
              }

/* head_contact selector: Format applied to email, phone and fax information. Position 
   is relative, 14px sized font, sans-serif font family,left margin is set to 0, 
   top margin has been pushed up by 10px, font boldened, text is centered, and 
   no text-decoration applied to links.
*/
#head_contact {
                position: relative;
                font-size: 14px;
                font-family: sans-serif;
                margin-left: 0px;
                margin-top: -10px;
                font-weight: bold;
                text-align: center;
                text-decoration: none
               }
/* anouncement selector: format applied to rectangular message holding anouncements, 
   messages, bulletins. Position is absolute, left margin is set to 155px, top 
   margin is set 10px, objects are floated left, width is set to 43%, 
   height is 50px minimum, boldened font, sans-serif font family, background color is blue, 
   font color is white, surrounded by a 1px solid black border, all content 
   is aligned vertically to the top, and cell space has been set to 0.
*/

#anouncements {
               position: absolute;
               margin-left: 155px;
               margin-right:15px;
               margin-top: 10px;
               float: clear;
               width: auto;
               height: 50px;
               font-weight: bold;
               font-family: sans-serif;
               background-color: blue;
               color: white;
               border: 1px solid black;
               vertical-align: top; 
               cellspacing: 0;
               colspan: 5
              }

/* office_header selector: Format applied to the office hours header. Position
   is absolute, the left margin has been set to 610px, with the top margin
   set to 10px, top vertical alignment of text, a width of 37%, 
   height of 50px, sans-serif font family, boldened font, background color is blue, 
   text color is white, and it is surrounded by a 1px solid black border.
*/
#office_header {
                position: absolute;
                margin-left: 635px;
                margin-top: 1000px;
                vertical-align: top;
                width: 350px;
                height: 50px;
                font-family: sans-serif;
                font-weight: bold;
                background-color: blue;
                color: white;
                border: 1px solid black;
                cellspacing: 0
               }

#bio {
               position: absolute;
               margin-left: 255px;
               margin-top: 10px;
               float: left;
               width: 620px;
               height: 50px;
               font-weight: bold;
               font-family: sans-serif;
               background-color: blue;
               color: white;
               border: 1px solid black;
               vertical-align: top; 
               cellspacing: 0
     }

/* Youtube class: Formatted to have a light blue background color, color
   of text is white, vertically aligned to the top, width 100%, height
   is set to auto, text is centered, and it has a padding of 5px.
*/
.youtube {
         background-color: lightblue;
         color: white;
         vertical-align: top;
         width: 100%;
         height: 500px;
         text-align: left;
         padding: 4 0 2 0;
         float: left
         }

.featured {
          background-color: lightblue;
          color: white;
          align: center;
          vertical-align: top;
          width: 100%;
          height: auto;
          text-align: left;
          padding: 2 0 0 0;
          float: left
          }

.featured_w {
          background-color: white;
          color: black;
          vertical-align: top;
          width: 100%;
          height: auto;
          text-align: left;
          padding: 0;
          float: left;
          font-size: 10px
          }

.blue_hdr {
            background-color: blue;
            color: white;
            vertical-align: top;
            width: 100%;
            height: auto;
            text-align: left;
            padding: 5px;
            float: clear
            }

.crimson_hdr  {
            background-color: crimson;
            color: white;
            align: center;
            vertical-align: top;
            width: 100%;
            height: auto;
            text-align: left;
            font-weight: bold;
            padding: 10 0 0 0;
            float: clear
           }  

.beige_box {
            background-color: beige;
            color: black;
            vertical-align: top;
            width: 100%;
            height: auto;
            text-align: left;
            padding: 5px
            }

/* links selector: position absolute (0,0), 100px width, top margin set to 0px, 
   and size of font is 8pts 
*/
#links {
        position: absolute; 
        text-align: center;
        left: 15px; 
        top: 0px;
        width: 125px;
        margin-top: 155px;
        font-size: 8pt
       }

/* Block-level elements of Links within the Links selector, font color is white,
   sans-seri font, blue background, normal links (no decoration), overall padding
   of 2px, no margins, surrounded by a 5px solid blue border. 
*/
#links a {
          display: block;
          color: white;
          font-family: sans-serif;
          background-color: blue;
          text-decoration: none;
          padding: 2px;
          margin: 2px;
          border: 5px solid blue
         }

/* Mouse over the link causes a 5px inset black border to appear and turns the
   font color cyan.
*/
#head_contact a:hover {text-decoration: underline}

#links a:hover {
                border: 5px inset black;
                color: black;
                background-color: cyan
               }

/* Active Link produces a 5px inset black border and maintains the font color cyan. */
#links a:active {
                 border: 5px inset black;
                 color: black;
                 background-color: cyan
                }
/* link properties for the rest that are within the body text. */
#links_body {
             font-family: sans-serif;
             font-weight: bold;
             color: blue;
             text-decoration: none;
             padding: 5px;
             float: clear;
             border: none
            }

#message_form {
               position: absolute;
               margin-left: 200px; 
               margin-top: 70px;
               float:left
              }