/**********************
 * Jacobingvarsson.com - global.css
 * Author: Les Creatives Sthlm AB
 * Date: 2013-08-28
 * Copyright © 2013
 **********************/

/**********************
 * INIT
 **********************/
html,body,div,span,p,a,del,em,img,ol,ul,li,fieldset,form,label {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
ol,ul {list-style: none;}
q {font-style: italic;color: #333;}
p{ margin: 0 0 20px 0;}
em {font-style: italic;}

/**********************
 * BASIC
 **********************/
html,body {font: 13px 'Open Sans', Arial, sans-serif;color:#f4f4f4;background-color:#181818;}
h1{ font-family: 'Open Sans', sans-serif; font-size:20px; font-weight:600; line-height:1.2em; margin:0 0 20px 0;color:#ebebeb; text-transform:uppercase;letter-spacing:0.1em}
h2 { font-family: 'Open Sans', sans-serif; font-size:15px; font-weight:600; line-height:1.2em; margin:0 0 20px 0;color:#ebebeb; text-transform:uppercase;}
h3, h4, h5 { font-family: 'Open Sans', sans-serif; font-size:13px; font-weight:600; line-height:1.2em; margin:0 0 20px 0;color:#ebebeb; text-transform:uppercase;}
a {color:#c7c00f;text-decoration:none;}
a:hover {color:#c7c00f;text-decoration:underline;}
::selection {background:#c7c00f; color:#fff;}
::-moz-selection {background:#c7c00f;color:#fff;}

/**********************
 * MENU COLUMN
 **********************/
#menu {position:fixed;top:0;left:0;width:120px;min-height:100%;margin:0;padding:0;background-color:#181818;z-index:10;overflow:hidden}
#logo {position:relative;margin:20px 20px 40px 20px;padding:0;overflow:hidden}
/* Navigation */
#nav {font-size: 14px; font-weight:600;color:#9a9a9a}
#nav li {position:relative;height:15px;margin:0 0 10px 0;padding:0;overflow:hidden}
#nav a {position:relative;padding:0 0 0 20px;color:#9a9a9a;text-decoration:none;background:transparent url("../files/assets/menu-bg.png") no-repeat scroll 0px 35px}
#nav a:hover {color:#9a9a9a;text-decoration:none;background-position:0px -17px}
#nav li.selected a, #nav li.selected a:hover {position:relative;color:#c7c00f;text-decoration:none;background-position:0px 3px}
#loader {position:relative;width:50px;margin:40px 0 10px 20px;padding:5px;overflow:hidden;background-color:#c7c00f;color:#181818;font-size:11px}

/**********************
 * CONTENT COLUMN
 **********************/
#content {position:absolute;top:0;left:-500px;width:380px;min-height:100%;margin:0;padding:0;background-color:#181818;z-index:9;overflow:hidden;opacity:.85; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";}
#content .ct {position:relative;margin:0;padding:20px;display:none;}
#content .ct .title1 {position:relative;margin:0 0 40px 0;padding:0;height:105px;font-size:32px;font-weight:400;line-height:1em;color:#c7c00f; letter-spacing:0.1em}
#content .ct .thumb {position:relative;margin:130px 0 0 0;}
#content .ct .thumb li {position:relative;width:120px;height:120px;margin:0 0 30px 210px;border:1px solid #f4f4f4;}
#content .ct .articleDate {position:relative;width:50%;margin:0;padding:5px 0 40px 0;border-top:1px dotted #ebebeb;font-size: 11px;font-style:italic;}

/**********************
 * ELEMENTS FIXED
 **********************/
/* Extra center*/
#extra {position:fixed;top:0;left:0;width:100%;height:100%;margin:0;padding:0;z-index:8;overflow:hidden;display:none;}
#extra.content {top:60%;left:50%;width:300px;height:240px;margin:-120px 0 0 120px;}
#extra.start {top:60%;left:50%;width:600px;height:240px;margin:-120px 0 0 -240px;}
#extra.start h1 {font-size:80px;font-weight:400;line-height:1em;color:#c7c00f;margin:0 0 10px 0;}
#extra.start h2 {font-size:40px;font-weight:400;line-height:1.1em;color:#ebebeb;margin:0;text-transform:none;}
#extra .trackPlay { position:absolute;height:100px;width:350px;top:0;left:0;margin:0;padding:0;background:transparent url("../files/assets/listen-btn.png") no-repeat scroll 0px 0px;cursor:pointer;}
#extra .trackPause { position:absolute;height:100px;width:350px;top:0;left:0;margin:0;padding:0;background:transparent url("../files/assets/pause-btn.png") no-repeat scroll 0px 0px;cursor:pointer;}
#extra .trackPlay:hover, #extra .trackPause:hover {background-position:0px -80px}
#extra.start .trackPlay, #extra.start .trackPause {left:295px;}
/* Social footer */
#social {position:fixed;bottom:40px;right:40px;width:200px;height:70px;margin:0;padding:0;z-index:8;overflow:hidden;text-align:right;opacity:.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";}