/* Screen CSS for johantheorin.com
   Author: Republic Factory <www.republic.se>
   ----------------------------------------------------*/

html     { background: #141619; font: normal 12px/19px "Courier New", Courier, monospace; color: #E8E8E8; }
/*div { border: 1px solid red; } */

/* =LAYOUT
   ----------------------------------------------------*/
#wrapper { width: 960px; margin: 15px auto; }
#header  { position: relative; width: 960px; height: 174px; background: url(../images/bg-header.jpg) no-repeat 0 0; }
#logo    { position: absolute; left: 211px; top: 18px; }

#background  { text-align: left; width: 960px; height: 505px; background: url(../images/bg-content.jpg); padding-top: 30px; }
#content     { padding: 0px 30px 0 80px; width: 780px; height: 500px; overflow: auto;}
#content img { float: right; margin: 20px 0 20px 40px; padding: 0; }

#col1        { float: left; width: 250px; margin-right: 40px; }
#col2        { float: left; width: 230px; margin-right: 20px; display: inline;}
#col3        { float: left; width: 230px; }
#col2 p, #col3 p  { margin-left: 10px; }

#footer   { width: 950px; margin-top: 10px; color: #444; text-align: center; font-size: 10px;}
#footer a { color: #444; }

#content img.right{margin:0 0 10px 40px; padding:0;}

#start #content { overflow: hidden; }
#start #content img.right{margin:0 0 10px 0px; padding:0;}



/* =TYPOGRAPHY
   ----------------------------------------------------*/
h1        { font-size: 15px; color: #fff; margin: 16px 0 1em 0; letter-spacing: 6px; }
h1.normal { letter-spacing: 1px; }
p         { font-size: 13px; line-height: 1.5; color: #f0f0f0; margin-bottom: 1em; }
a         { color: #E8E8E8; }
strong    { color: #fff; }


/* =NAVIGATION
   ----------------------------------------------------*/
#nav                  { position: absolute; top: 138px; z-index: 500; text-align: left; display: inline;}

#nav-omjohan          { margin-left: 134px; }
#nav-johansoland      { margin-left: -21px; }
#nav-olandskvartetten { margin-left: 14px; }
#nav-foljmed          { margin-left: -5px; }

#nav li           { float: left; background: url(../images/bg-menu-omjohan.gif) no-repeat 0 0;
                    width: 200px; padding: 12px 0 0 0; margin-right: 20px; display: inline;
                    font: bold 13px "Courier New", Courier, monospace; color: #000; cursor: hand;}

#nav a            { color: #000; text-decoration: none; }
#nav .active a    { color: #000; text-decoration: none; }
#nav a:hover      { color: #000; text-decoration: none; }

#nav li li         { background: none; padding: 0px; margin: 0; width: 200px; display: none; }
#nav li li a       { color: #000; text-decoration: none; cursor: hand; }
#nav ul ul         { margin: 12px 0 0 0; }
#nav ul ul a       { display: block; margin: 0 0 0 43px; padding: 7px 0 7px 0;}
#nav ul ul a:hover { color: #E20526; }


/* =CONTENT
   ----------------------------------------------------*/
#content div#karta img { float: none; margin-left: 50px; }
#content div#karta p   { text-align: center; }
#content div#karta a   { color: #CC6600; font-weight: bold; }