/* main iphone CSS document */
* { margin: 0; padding: 0 }
a img, img { display: block; border: none }
body { color: #fff; font-size: 15px; font-family: arial, helvetica, sans-serif; font-style: normal; background: #000 }
a { color: #000; text-decoration: none }
.box, .article1 { background: #fff; margin: 0 0 5px 9px; padding: 3px; width: 294px; border: solid 1px #fff; -webkit-border-radius: 4px  }
/* construct main box with large image */
/* use border-radius for corner images */
.box, .article1 { background: #fff; margin: 0 0 5px 9px; padding: 3px; width: 294px; border: solid 1px #fff; -webkit-border-radius: 4px }
/* safari supports multiple background images on the same element - yippee */
/* make whole box clickable so we have to use an anchor to hold everything*/
p.click { margin: 0 }
p.click a { padding: 5px 42px 5px 6px }
.big p.click a { display: block }
p.click strong, .big p.click span { display: block }
p.click img { margin: 0 11px 0 0 }
.big p.click img { margin: 0 }
/* turn anchor into a table so text and images can be vertically aligned easily*/
/* this also means the image can be removed and text will fill the gap nicely */
p.click a { display: block }
p.click img, p.click span { display: table-cell; vertical-align: middle }
.big p.click span { padding: 0 }
/* advertisement image*/
p.ad { text-align: center; margin: 8px 0 }
p.ad img { margin: auto }
/* different coloured background for flere box */
.flere { margin-bottom: 0 }
.flere, .bg2 { background: #d0d0c2; border: solid 1px #d0d0c2 }
.flere p { color: #fff; background: url("/grafik/ver3/common/iphone/pil_flere.gif") no-repeat 260px 50% }
.flere p a { color: #fff }
p.click span { padding: 3px 0 4px }
/* bg2 = a background color of #dodoc2 as in boxes under gallerier heading */
.bg2 p { color: #000; background: url("/grafik/ver3/common/iphone/pil.gif") no-repeat 260px 50% }
p.click em { font-style: normal; display: table }
/* default article CSS .article1 (one)*/
.article1 { color: #000; margin-top: 5px }
.article1 p { margin: 0 0 9px }
.story p { margin: 0 4px 15px 6px }
.article1 h3 { margin: 0 4px 0 6px }
.story { padding: 32px 0 17px }
p.author_link { margin: 0 9px 0 5px; padding: 17px 0 6px; border-top: 1px solid #9a9a9a }
/* toggle box */
.toggle { margin-bottom: 0; padding: 0 3px }
.toggle p.click a { padding: 0 48px 0 6px }
/* ...... gallerier article CSS  - .g = gallerier........*/
.g { margin-top: 5px }
.g p, .g h2 { margin: 5px 6px }
/* gallery articles with large image */
.g p.img { margin: 0 0 9px }
/* flere2 has left and right arrows */
.left, .right { position: absolute; top: 5px; left: 5px; width: 34px; height: 24px }
.right { left: 255px }