/* HEADER */

div#header {
  margin          : 10px 0px 0px 0px ;
  width           : 100%             ;
  background      : #215e21          ;
  color           :  white           ;
  border-top      : solid #000000 1px;
  border-left     : solid #000000 1px;
  border-right    : solid #000000 1px;
  overflow        : auto             ;
}

/* line 1 inside header */

p#line1 {
  font-family     : Arial            ;
  font-weight     : bold             ;
  font-size       : xx-large         ;
  line-height     : 25%              ;
  text-align      : right            ;
  margin          : 25px 30px 25px 0px  ;
}

/* line 2 inside header */

p#line2 {
  font-family     : Arial            ;
  font-weight     : bold             ;
  font-size       : x-large          ;
  line-height     : 25%              ;
  text-align      : right            ;
  margin          :  0px 0px 25px 0px;
}

/* NAV BAR */

div#navbar {
  height          : 30px             ;
  width           : 100%             ;
  text-align      : center           ;
  border          : solid #000000 1px;
  background      :  teal            ;
  color           : #ffffff          ;
}

/* horizontal list inside nav bar */

div#navbar ul {
  margin          : 0px              ;
  padding         : 0px              ;
  font-family     : Arial            ;
  font-size       : x-small          ;
  background      :  teal            ;
  color           : #ffffff          ;
  line-height     : 30px             ;
  white-space     : nowrap           ;
}

/* list elements inside nav bar */

div#navbar li {
  list-style-type : none             ;
  display         : inline           ;
}

div#navbar li a {
  text-decoration : none             ;
  padding         : 7px 10px 7px 10px;
  background      :  teal            ;
  color           : white            ;
}

div#navbar li a:link    {
  background      :  teal            ;
  color           : white            ;
}

div#navbar li a:visited {
  background      :  teal            ;
  color           : white            ;
}

div#navbar li a:hover   {
  background      : #215e21          ;
  color           : #ffffff          ;
}

/* CONTENT BOX */

div#content {
  margin          : 20px auto        ;
  border          : solid #000000 1px;
  width           : 750px            ;
}

/* major heading elements inside content box */

div#content p.major {
  text-align      : left             ; 
  font-family     : Arial            ; 
  font-size       : large            ;
  font-weight     : bold             ; 
  background      : white            ;
  color           : black            ; 
  margin-right    : 40px             ; 
  margin-bottom   :  0px             ;
  margin-left     : 10px             ;
  margin-top      : 10px             ;
}

/* regular text elements inside content box */

div#content p.section {
  text-align      : left             ; 
  font-family     : Arial            ; 
  font-size       : small            ; 
  background      : white            ;
  color           : black            ; 
  margin-right    : 40px             ; 
  margin-bottom   :  0px             ;
  margin-left     : 10px             ;
  margin-top      : 10px             ;
}

/* small text elements inside content box */

div#content p.small {
  text-align      : left             ; 
  font-family     : Arial            ; 
  font-size       : x-small          ; 
  background      : white            ;
  color           : black            ; 
  margin-right    : 40px             ; 
  margin-bottom   :  0px             ;
  margin-top      : 10px             ;
}

div#content a {
  text-decoration : none             ;
}

div#content li a {
  text-decoration : none             ;
}

div#content ul {
  list-style-type : circle           ;
}

div#content li {
  font-family     : Arial            ;
  font-size       : small            ; 
  line-height     : 20px             ;
  background      : white            ;
  color           : black            ;
  margin-right    : 20px             ;
}

/* LEFT-SIDE INNER CONTENT BOX */

div#content-left  {
  margin          : 10px             ;
  float           : left             ;
  border-right    : solid #000000 1px;
  width           : 525px            ;
}

/* list elements inside left-side inner content box */

div#content-left ul {
  list-style-type : circle           ;
}

div#content-left li {
  font-family     : Arial            ;
  font-size       : small            ; 
  line-height     : 20px             ;
  background      : white            ;
  color           : black            ;
  margin-right    : 20px             ;
}

div#content-left a {
  text-decoration: none;
}

/* RIGHT-SIDE INNER CONTENT BOX */

div#content-right {
  margin          :   5px 0px 5px 0px;
  float           : right            ;
  width           : 200px            ;
}

/* regular text elements inside content box */

div#content-right a {
  text-decoration: none;
}

/* list elements inside right-side inner content box */

div#content-right ul {
  list-style-type : none             ;
  text-indent     : -40px            ;
}

div#content-right li {
  font-family     : Arial            ;
  font-size       : x-small          ; 
  line-height     : 10px             ;
  background      : white            ;
  color           : black            ;
}

/* FOOTER */

div#footer {
  margin          : 10px 0px  0px 0px;
  border          : solid #000000 1px;
  width           : 100%             ;
  background      :  teal            ;
  color           : white            ;
  overflow        : auto             ;
}

/* link elements inside footer */

div#footer a {
  text-decoration : none             ;
  background      :  teal            ;
  color           : white            ;
}

/* paragraph elements inside footer */

div#footer p {
  font-family     : Arial            ; 
  font-size       : small            ; 
  margin-left     : 20px             ;
}

/* for Engineer as Hero, tables */

table.movies { 
  font-family    : Arial   ;
  font-size      : small   ;
  color          : black   ;
  border         : solid teal 1px;
  border-collapse: collapse;
  margin         : 5px     ;
}

td.movieHeader {
  font-family    : Arial   ;
  font-size      : small   ;
  color          : black   ;
  border         : solid teal 1px;
  border-collapse: collapse;
  margin         : 5px     ;
}

td.movieBody {
  font-family    : Arial   ;
  font-size      : small   ;
  color          : black   ;
  border         : solid teal 1px;
  margin         : 5px     ;
}

td.movieBodySmall {
  font-family    : Arial   ;
  font-size      : x-small ;
  color          : black   ;
  border         : solid teal 1px;
  margin         : 5px     ;
}

td.movieBodySmall a {
  text-decoration: none;
}

/* For the Fastener Design Manual, figures and captions */

div.figure-left {
  float      : left            ;
  width      : 20%              ;
  border     : thin silver solid;
  margin     : 0.5em            ;
  padding    : 0.5em            ;
}

div.figure-left p {
  text-align : center           ;
  font-style : italic           ;
  font-size  : smaller          ;
  text-indent: 0                ;
}

div.figure-right {
  float      : right            ;
  width      : 20%              ;
  border     : thin silver solid;
  margin     : 0.5em            ;
  padding    : 0.5em            ;
}

div.figure-right p {
  text-align : center           ;
  font-style : italic           ;
  font-size  : smaller          ;
  text-indent: 0                ;
}

/* for quotes */

div.quote {
  border     : thin teal solid  ;
  margin     : 0.5em            ;
  padding    : 0.5em            ;
}

div.quote p {
  font-size  : smaller          ;
  text-indent: 0                ;
}

