@import url('content.css');

/* body */
body {
  color:                  #ffffff;
  background-color:       #ffffff;
  font-size:              70%;
  padding-top:            8px;
  padding-left:           64px;
  }

div.Clearing {
  height:                 1px;
  font-size:              1px;
  clear:                  both;
  }
 
/* top */ 
div#Top {
  width:                  765px;
  overflow:               visible;
}
  
/* logo */  
div#Logo {
  float:                  left;
  overflow:               visible;
  font-size:              0.9em;
  color:                  #8f8f8f;
}
div#Logo a {
  font-size:              1.0em;
  color:                  #cfa913;
}
div#Logo a.Active,
div#Logo a:hover,
div#Logo a:active {
  font-size:              1.0em;
  color:                  #8f8f8f;
}
div#Logo a img {
  margin:                 0px 4px 0px 4px;
}

/* topnavi */
div#TopNavi {
  float:                  right;
  color:                  #8b8b8b;
  margin:                 4px 0px 0px 0px;
  text-align:             right;
}
div#TopNavi a {
  font-size:              0.9em;
  color:                  #cfa913;
  margin:                 0px 1px 0px 1px;
}

/* firstnavi */  
div#FirstNavi {
  width:                  765px;
  height:                 32px;
  background-image:       url('../images/layout/bg.firstnavi.gif');
  background-repeat:      no-repeat;
  overflow:               hidden;
  margin:                 4px 0 0 0;
}
div#FirstNavi ul {
  list-style-type:        none;
  display:                inline;
}
div#FirstNavi li {
  float:                  left;
}
div#FirstNavi li a {
  margin-top:             5px;
  padding:                7px 9px 6px 9px;
  display:                block;
}
div#FirstNavi li a:hover,
div#FirstNavi li a:active {
  color:                  #cfa913;
  text-decoration:        none;
}
div#FirstNavi li.Active {
  background-color:       #a8a8a8;
  border-top:             1px solid #cfa913;
}
div#FirstNavi li.Active a {
  margin-top:             0px;
  padding:                10px 16px 7px 16px;
  border-top:             1px solid #ffffff;
}
div#FirstNavi li.Active a:hover,
div#FirstNavi li.Active a:active {
  color:                  #ffffff;
}
div#FirstNavi li.Div {
  margin-top:             11px;
  padding:                0px;
  float:                  left;
}
  
/* secondnavi */  
div#SecondNavi {
  background-color:       #a8a8a8;
  width:                  765px;
  border-bottom:          1px solid #ffffff;
  height:                 32px;
  clear:                  both;
}
div#SecondNavi ul {
  list-style-type:        none;
  display:                inline;
}
div#SecondNavi li {
  float:                  left;
  }
div#SecondNavi a {
  margin-left:            4px;
  margin-top:             9px;
  padding-left:           6px;
  padding-right:          6px;
  display:                block;
}
div#SecondNavi li a:hover,
div#SecondNavi li a:active {
  color:                  #4d4d4d;
  text-decoration:        none;
}
div#SecondNavi li.Active {
}
div#SecondNavi li.Active a {
  border-bottom:          1px solid #4d4d4d;
  color:                  #4d4d4d;
}
div#SecondNavi li a.Letter {
  border:                 0px solid red;
  margin:                 8px 1px 0 10px;
  padding:                0;
  width:                  16px;
  height:                 18px;
  background-repeat:      no-repeat;
  background-position:    top left;
}
div#SecondNavi li a.Letter:hover,
div#SecondNavi li a.Letter:active,
div#SecondNavi li.Active a.Letter {
  background-position:    bottom left;
}

/* illustration */
div#Illustration {
  border-top:             1px solid #171f5f;
  width:                  765px;
  height:                 135px;
  overflow:               hidden;
}  

/* main */  
div#Main {
  width:                  765px;
  background-color:       #8b8b8b;
  clear:                  both;
  border-top:             1px solid #ffffff;
  overflow:               visible;
}
  
/* headline */ 
div#Headline {
  margin-left:            87px;
  border-left:            1px solid #ffffff;
  padding:                28px 0px 10px 28px;
}
div#Headline h1 {
  color:                  #cfa913;
  font-size:              1.8em;
  font-weight:            normal;
  margin-bottom:          0;
}
div#Headline h2 {
  color:                  #ffffff;
  font-size:              1.8em;
  font-weight:            normal;
  margin-bottom:          0;
}

/* article */  
div.Article {
  background-color:       #474c75;
  margin-left:            87px;
  border-left:            1px solid #ffffff;
  border-top:             1px solid #ffffff;
}
div.Article h1.Title {
  float:                  left;
  color:                  #cfa913;
  font-size:              1.6em;
  font-weight:            normal;
  margin:                 6px 0px 0px -130px;
  width:                  120px;
  text-align:             right;
  display:                inline;
  overflow:               hidden;
}
div.Article div.Content {
  padding:                10px 0px 20px 28px;
  width:                  600px;
}
div.Article a {
  text-decoration:        underline;
}
div.Article div.Author a {
  text-decoration:        none;
}
div.Article h3 a {
  text-decoration:        none;
}
div.Article div.Content h1 a {
  float:                  right;
  color:                  #ffffff;
  font-size:              0.9em;
  font-weight:            normal;
  text-decoration:        underline;
}
div.Article div.Content a.Image {
  float:                  right;
  margin:                 4px 0 0 0;
}
div.Article div.Content div.Image {
  float:                  right;
  margin:                 -16px 0 0 0;
  width:                  100px;
}
div.Article div.Content div.Image a.Icon {
  display:                block;
  width:                  18px;
  height:                 18px;
  float:                  left;
  margin:                 2px;
}
div.Article div.Content div.Image a.IconPhoto:hover,
div.Article div.Content div.Image a.IconPhoto:active {
  background-position:    bottom left;
}
div.Article div.Content div.Image a.IconAudio:hover,
div.Article div.Content div.Image a.IconAudio:active {
  background-position:    bottom left;
} 
div.Article div.Content div.Image a.IconVideo:hover,
div.Article div.Content div.Image a.IconVideo:active {
  background-position:    bottom left;
} 
div.Article div.Content div.Image a.IconText:hover,
div.Article div.Content div.Image a.IconText:active {
  background-position:    bottom left;
}   
  
/* subnavi */
div#SubNavi {
  background-color:       #a8a8a8;
  width:                  765px;
  border-top:             1px solid #ffffff;
  height:                 38px;
}
div#SubNavi ul {
  list-style-type:        none;
  display:                inline;
}
div#SubNavi li {
  margin:                 12px 0px 0px 12px;
  float:                  left;
}
div#SubNavi a {
  display:                block;
}
div#SubNavi img {
  margin:                 0px 6px 0px 0px;
}
div#SubNavi li.Copyright {
  margin:                 12px 16px 0px 0px;
  float:                  right;
}
  
/* footer */
div#Footer {
  background-color:       #ffffff;
  width:                  765px;
  clear:                  both;
  border-top:             1px solid #ffffff;
  background-image:       url('../images/layout/bg.footer.gif');
  background-repeat:      no-repeat;
  overflow:               visible;
}

/* form */
form#SearchForm {
  margin:                 8px 0px 0px 0px;
  text-align:             left;
}
form#SearchForm input.Text {
  margin:                 2px 0px 0px 0px;
  font-size:              1.0em;
  border:                 2px solid #cccccc;
  color:                  #4d4d4d;
  float:                  left;
  width:                  120px;
}
form#SearchForm input.Button {
  margin:                 2px 0px 0px 0px;
}
    
/* media */
div.Media {
  padding:              6px 0 6px 0;
}
div.Media a {
  text-decoration:      underline;
}

/* article */
div.Article div.Author {
  padding:                10px 0px 20px 28px;
  width:                  600px;
}
div.Article div.Content p {
  margin:                 0 0 8px 0;
}
div.Article div.Content div.Gallery {
  padding:              6px 0 6px 0;
  border-bottom:        0px dotted #b4babd;
}
div.Article div.Content div.Gallery a.Image {
  float:                left;
  display:              block;
  margin:               0 8px 0 0;
}
div.Article div.Content div.Gallery a {
  text-decoration:      underline;
}
div.Article a.print {
  background: transparent url(../images/print.gif) no-repeat 0 0;
  padding: 1px 8px 1px 16px;
  text-decoration: none;
}

/* video */
div.Video {
  background-color: #474c75;
  margin: 0;
  padding: 16px;
}
div.video-container {
  background-color: #000;
  border: 1px solid #fff;
  width: 640px;
}
div.video-teaser {
  float: left;
  margin: 0 10px 0 10px;
  padding: 3px;
  width: 190px;
}
div.video-teaser-details {
  float: left;
  margin: 0 10px 0 10px;
  padding: 3px;
  width: 293px;
}
div.video-teaser a.thumb,
div.video-teaser-details a.thumb {
  border: 1px solid #fff;
  float: left;
}
div.VideoHeadline h1 {
  color:#CFA913;
  font-size:1.8em;
  font-weight:normal;
  margin: 20px 0 0 20px;
  padding: 0;
}

#wrapper {
  width:320px;
  height:196px;
  background-color:red;
}