@import url('djb-fonts.css');

html
{
	overflow-y:scroll;
	overflow-x:hidden;
}
html.modal
{
	overflow-y:hidden;
}
body
{
	margin:0;
	padding:0;
	
	background-color:#e4e4e4;

	font-family:'Kobern Regular',kobernregular,sans-serif;
	color:#444440;
	
	-webkit-font-smoothing:antialiased;
}

body a
{
	color:#444440;
}
body a:hover
{
	color:#190100;
}

body *
{
	box-sizing: border-box;
    -moz-box-sizing: border-box;
}
body.no-transition *,
#page-article.no-transition
{
	transition:none !important;
	-webkit-transition:none !important;
}
.clear:after,
.line:after
{
	content:'';
	display:table;
	clear:both;
}
#loading
{
	display:none;
	position:fixed;
	top:50%;
	left:50%;
	margin:-9px 0 0 -33px;
	width:67px;
	height:19px;
}
#unsupported
{
	position:absolute;
	top:50%;
	width:100%;
	margin-top:-100px;
	text-align:center;
}


/*	overlays (dimm/sign-in/settings/search)
*/

#page-fixed,
div.modal
{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	overflow:visible;
}
html:not(.scroll) #page-fixed
{
	position:relative; /* no smoothing */
}
div.modal
{
	display:none;
	opacity:0;
	background-color:rgba(228,228,228,.5);
	
	height:100%;
	z-index:2000;
	
	transition:
		transform .3s ease 0s,
		opacity .4s linear 0s;
	-webkit-transition:
		-webkit-transform .3s ease 0s,
		opacity .4s linear 0s;
		
	overflow-y:auto;
	
	font-size:20px;
}
#modal
{
	background-color:rgba(253,245,245,.95);
}
html.sidebar #page-dimm
{
	transform:translateX(300px);
	-webkit-transform:translateX(300px);
}
#page-dimm.sidebar
{
	opacity:1;
	cursor:pointer;
}	

#page-signin,
#page-settings
{
	background-color:rgba(253,245,245,.95);
	font-size:20px;	
	
	transition:opacity .2s linear 0s;
	-webkit-transition:opacity .2s linear 0s;
}
html.modal div.modal
{
	opacity:1;
}
div.modal.hide
{
	opacity:0 !important;
}
div.modal > *:not(a)
{
	width:90%;
	margin:20px auto;
	margin:20px auto 0 auto;
}
html.hd div.modal > *:not(a)
{
	width:860px;
}
.modal > div.line
{
	border-top:1px solid #E4E4E4;
}
div.modal a.close
{
	display:block;
	position:fixed;
	right:20px;
	top:9px;
	width:40px;
	height:40px;
	
	background:transparent url(../media/overlay-close.svg) no-repeat 50% 50%;
}
#page-signin a.close:hover
{
	opacity:.5;
}
.modal > .title,
.modal > .head > .title,
#page-signin .loading
{
	padding:0;
	margin:85px auto 50px auto;
	text-align:center;
}
#signin 
{
	margin-top:30px;
	padding-top:30px;
	border-top:1px solid #E4E4E4;
	text-align:center;
}
#page-signin.loading #signin,
#page-signin:not(.loading) > .loading
{
	display:none;
}
#signin input,
#profile a.button,
#page-article a.button,
#page-article input.button
{	
	display:block;
	margin:20px auto;
	width:212px;
	height:44px;

	padding:0px 10px 4px 10px;
	background-color:transparent;

	border:1px solid #1A1919;
	border-radius:8px;
	
	font-family:'Kobern Regular',kobernregular,sans-serif;
	font-size:16px;
	
	-webkit-appearance:none;
}
#signin > div
{
	display:none;
}		
#signin.signin > div.social,
#signin.signin > div.login,
#signin.signin > div.forgot,
#signin.signup > div.login,
#signin.email > div.email,
#signin.forgot > div.email,
#signin.reset > div.rset,
#signin.pass > div.pw,
#signin.news > div.email
{
	display:block;
}
#signin input.twitter
{
	background-color:#3EAEEF;
	border-color:#3EAEEF;
	color:white;
	cursor:pointer;
}
#signin input.facebook
{
	background-color:#315C99;
	border-color:#315C99;
	color:white;
	cursor:pointer;
}
#signin input[type=submit]
{
	border-color:#E4E4E4;
	color:#1A1919;
	cursor:pointer;

	background-color:#E4E4E4;
	box-shadow:0 1px 1px rgba(0,0,0,.14);
}
#signin input[type=submit].busy
{
	border-color:transparent;
	background:transparent url(../media/loading.gif) no-repeat 50% 50%;
	background-size:67px 19px;
	box-shadow:none;
}
#signin input.error, #signin .caption.error
{
	border-color:#F44336;
	color:#F44336;
}
#signin .caption.error
{
	margin-top:-10px;
}
#signin a.caption
{
	text-decoration:none;
}
#connecting
{
	display:block !important;
	margin:40px auto 10px auto;
	width:67px;
	height:19px;
}

#page-settings > div:not(.head)
{
	border-top:1px solid #E4E4E4;
	padding:19px 0 1px 0;
}
#page-settings > .head
{
	text-align:center;
}
#page-settings .head .avatar
{
	margin:auto;
	width:60px;
	height:60px;
	border-radius:30px;
	background:white none no-repeat 50% 50%;
	background-size:cover;
}
#page-settings .head .title
{
	margin-bottom:30px;
}
#page-settings .head .name
{
	margin:14px 0 18px 0;
}
#page-settings > div:not(.head) > .title
{
	color:#05A9F5;
	margin-bottom:20px;
}
#page-settings div.intro
{
	margin-bottom:20px;
}
#page-settings > div:last-child
{
	padding-bottom:100px;
}
#page-settings > div > ul,
#vote
{
	display:block;
	margin:0;
	padding:0;
	list-style:none;
	line-height:30px;
}
#vote li
{
	clear:left;
	font-size:20px !important;
}
#page-settings li,
#vote li
{
	margin-bottom:12px;
}
#page-settings li .caption,
#vote li .caption
{
	padding-left:10px;
	font-size:14px;
}
.checkbox
{
	float:left;
	margin-right:12px;
	width:30px;
	height:30px;
	background:transparent url(../media/checkbox.svg) no-repeat 0 0;
	cursor:pointer;
}
.checkbox.checked
{
	background-position:0 100%;
}
.checkbox > input
{
	visibility:hidden;
}
#page-settings a,
#comments a.submit
{
	color:#05A9F5;
	text-decoration:none;
}
#page-settings a.edit
{
	font-size:14px;
}
#page-settings div.account li
{
	margin-bottom:6px;
}
#page-settings div.account li.divider
{
	border-top:1px dashed #E4E4E4;
}
li.email > a.edit,
li.email.connected span.caption,
li.email.pw:not(.connected),
li.social strong,
li.social.connected a
{
	display:none;
}
li.email.connected > a.edit,
li.email span.caption,
li.social.connected strong,
li.social a
{
	display:inline-block;
}
#page-settings input[type=text],
#comments textarea
{
	width:180px;
	padding:0 5px;
	
	background-color:transparent;
	border:1px solid #1A1919;
	border-radius:6px;
	
	font-family:'Kobern Regular',kobernregular,sans-serif;
	font-size:20px;
	line-height:26px;
}

#page-settings div.sample
{
	margin-bottom:15px;
	
	width:185px;
	height:110px;
	padding-top:28px;
	
	border:1px solid #1A1919;
	border-radius:8px;
	
	text-align:center;
	font-size:18px;
	line-height:17px;

	opacity:.25;
}
#page-settings div.sample.active
{
	opacity:1;
}
#page-settings div.sample.all div:first-child
{
	line-height:16px;
}
#page-settings div.design li
{
	float:left;
	width:215px;
}

#page-search
{
	background-color:rgba(255,255,255,.95);
	z-index:1900;
}
/* 
#search
{
	width:100%;
	margin:100px 0 50px 0;
	
	border:none;
	border-bottom:1px solid #e4e4e4;
	background-color:transparent;

	font-family:'Kobern Light',kobernlight,sans-serif;
	font-size:64px;
	line-height:90px;
	text-transform:uppercase;
	
	-webkit-appearance:none;
	outline:none;
}
 */
#page-search .result
{
	clear:both;
	margin-bottom:90px;
	font-size:17px;
	line-height:20px;

	cursor:pointer;
}
#page-search .result .media
{
	float:left;
	width:207px;
	height:115px;
	margin:0 22px 80px 0;

	border-radius:8px;
	box-shadow:0 1px 2px rgba(0,0,0,.5);
	
	background:#d8d8d8 none no-repeat 50% 50%;
	background-size:cover;
}


/*	main layout
*/

#page-body
{
	position:relative;
	margin:0 auto;
	width:970px;
	
	/* transform-origin:100% 50%; */
	transition:
		transform .3s ease 0s,
		opacity .5s linear 0s;
	-webkit-transition:
		-webkit-transform .3s ease 0s,
		opacity .5s linear 0s;

/* 
	overflow:hidden;
	background-color:#232020;
 */
 	/* background-color:rgba(250,0,0,.2); */
}
html.article #page-body
{
	opacity:0;
}
html.sidebar #page-body
{
	transform:translateX(300px);
	-webkit-transform:translateX(300px);
}
#page-body.hidden,
#article-seo
{
	display:none;
}


/*	page header, menu
*/


/* 2017 page header (fixed bar)
*/
#header
{
	position:fixed;
	left:0;
	top:80px;
	width:100%;
	z-index:2000;
	pointer-events:none;
}
#header.fixed
{
	top:20px;
}
#header a
{
	outline:none;
}
#header > .bar
{
	position:relative;
	width:550px;
	max-width:100%;
	max-height:64px;
	margin:0 auto;
	padding-top:64px;
	
	background-color:black;
	pointer-events:auto;
	
	transition:max-height .4s ease 0s;
	-webkit-transition:max-height .4s ease 0s;
	
	overflow:hidden;
	
	box-shadow:0 1px 0 rgba(0,0,0,.15);
}
#header .bar.expanded
{
	max-height:400px;
}
#header .bar > a,
#header .bar .search > a
{
	display:block;
	position:absolute;
	top:0;
	padding:16px 15px;
	height:64px;
	color:white;
	text-decoration:none;
}
#header .bar a svg path,
#header .bar a svg rect
{
	fill:#ffffff;
}
#header .bar a svg circle
{
	stroke:#ffffff;
}
#header .bar a:not(.menu):not(.social):hover
{
	color:#cdcdcd;
}
#header .bar a:hover:not(.menu):not(.social) svg path,
#header .bar a:hover:not(.menu):not(.social) svg rect
{
	fill:#cdcdcd;
}
#header .bar a:hover:not(.menu):not(.social) svg circle
{
	stroke:#cdcdcd;
}
#header .bar a.search
{
	right:0;
	padding:10px !important;
}
#header .bar a.close
{
	left:50%;
	transform:translate(-50%,-100%);
	line-height:32px;
	height:64px;
	
	transition:transform .25s cubic-bezier(.54,.49,.59,1.35) .5s;
	-webkit-transition:-webkit-transform .25s cubic-bezier(.54,.49,.59,1.35) .5s;
}
html.article #header .bar a.close
{
	transform:translate(-50%,0);
}
#header div.search
{
	display:none;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
html.search #header div.search
{
	display:block;
}
#header div.search a.reset
{
	right:0;
	padding:19px !important;
}
#sponsored,
#header > .bar.sponsored .logo svg:first-child
{
	display:none;
}
#sponsored
{
	margin-top:4px;
}
#header > .bar.sponsored #sponsored
{	
	display:block;
}
#header > .bar.sponsored .playing
{
	left:84px;
}
#search
{
	width:100%;
	height:64px;
	padding:0 23px;
	
	border:none;
	background-color:#383838;

	font-family:'Kobern Light',kobernlight,sans-serif;
	font-size:24px;
	line-height:64px;
	/* text-transform:uppercase; */
	
	color:white;
	-webkit-appearance:none;
	outline:none;
}
#header .logo .playing
{
	display:none;
	position:absolute;
	left:58px;
	top:15px;

	width:30px;
	height:33px;
	background:transparent url(../media/sound-2017.gif) no-repeat 50% 50%;
}
html.playing #header .logo .playing
{
	display:block;
}



#header .bar div.menu
{
	top:64px;
	margin:0 12px;
	/* padding-top:64px; */
	border-top:2px solid #2b2b2b;
	opacity:0;
	
	transition:opacity .5s ease 0s;
	-webkit-transition:opacity .5s ease 0s;
}
#header .bar.expanded div.menu
{
	opacity:1;
}
#header a.menu
{
	display:block;
	width:100%;
	padding:0 8px;
	line-height:40px;
	height:40px;
	text-decoration:none;
	color:white;
	
	
}
#header a.menu:hover
{
	background-color:#2b2b2b;
}
#header a.menu.selected
{
	color:#05A9F5;
}
#header a.settings > span
{
	color:#A5A4A4;
	float:right;
	cursor:pointer;
}
#header a.settings > span:hover
{	
	color:#05A9F5;
}
#header .bar.user .signin,
#header .bar:not(.user) .signout
{
	display:none;
}
#header #social
{
	padding:12px 8px;
}
#header #social a
{
	background-image:url(../media/socials-2017.svg);
}

/*	hide previous design (until removed)
*/
#djb,
#page-menu,
#page-header,
#page-sidemenu
{
	opacity:0;
	pointer-events:none;
}
#result
{
	margin-top:190px;
}




#page-header
{
	position:absolute;

	left:0;
	top:134px; 
	top:114px;
	
	width:100%;
	min-width:970px;
	height:60px;

	text-align:center;
	overflow:hidden;

	z-index:1000;
}
html.scroll #page-header
{
	position:fixed;
}
html #page-header.fixed
{
	position:fixed;
	top:0px;
}
#page-sidemenu
{
	position:fixed;
	left:0;
	top:0;
	
	transform:translateX(-100px);
	-webkit-transform:translateX(-100px);

	transition:none;
	-webkit-transition:none;
	
	width:60px;
	height:60px;
	background:transparent url(../media/djb-icon.svg) no-repeat 50% 50%;
	
	z-index:1001;

	transition:transform .2s ease 0s;
	-webkit-transition:-webkit-transform .2s ease 0s;
	
	cursor:pointer;
}
#page-sidemenu .playing
{
	display:none;
	position:absolute;
	top:21px;
	right:-8px;
	width:17px;
	height:17px;
	background:transparent url(../media/article-type.svg) no-repeat 100% 0;
}
html.playing:not(.sidebar) #page-sidemenu .playing
{
	display:block;
}
#page-sidemenu.fixed
{
	transform:translateX(0);
	-webkit-transform:translateX(0);

	transition:transform .4s cubic-bezier(.54,.49,.59,1.35) 0s;
	-webkit-transition:-webkit-transform .4s cubic-bezier(.54,.49,.59,1.35) 0s;
	
}
#page-menu
{
	transition:transform .3s ease 0s;
	-webkit-transition:-webkit-transform .3s ease 0s;
	height:100%;
}
#page-header.fixed #page-menu
{
	background-color:rgba(228,228,228,.9);
}
html.sidebar #page-sidemenu,
html.sidebar #page-header
{
	transform:translate(300px,0) !important;
	-webkit-transform:translate(300px,0) !important;
	
	transition:transform .3s ease 0s;
	-webkit-transition:-webkit-transform .3s ease 0s;
}
#page-header.fixed.sidebar
{
	transition:transform .3s ease 0s;
	-webkit-transition:-webkit-transform .3s ease 0s;
}
#page-header .menu
{
	margin:auto;
	width:310px;
	padding-top:16px;

	opacity:1;
}
#page-header.fixed .menu
{
	transition:transform .2s ease .15s;
	-webkit-transition:-webkit-transform .2s ease .15s;
}
#page-header a:not(.author)
{
	display:inline-block;
	width:100px;
	
	text-decoration:none;
	color:#9A9999;
	text-align:center;
}
#page-header a.selected,
#page-header a:hover
{
	color:#190100;
}
#page-header a.search
{
	display:none;
	position:absolute;
	right:0;
	top:0;
	width:60px;
	height:60px;
	background:transparent url(../media/search.svg) no-repeat 50% 50%;
}
html:not(.mobile) #page-header.fixed a.search
{
	display:block;
}


/*	side-bar
*/

#page-sidebar
{
	position:fixed;
	left:0;
	top:0;
	width:300px;
	min-height:110%; /*	keep viewport maximized on mobile webkit */
	padding:7px;

	background-color:white;
	
	transform:translateX(-300px);
	-webkit-transform:translateX(-300px);

	transition:transform .3s ease 0s;
	-webkit-transition:-webkit-transform .3s ease 0s;
	
	z-index:100;
}
#page-sidebar.active
{
	position:absolute;
}
html.sidebar #page-sidebar
{
	transform:none;
	-webkit-transform:none;
}

#page-sidebar > .djb
{
	position:absolute;
	left:0;
	top:0;

	width:300px;
	height:60px;

	background-color:white;

	z-index:100;
}
#page-sidebar > .djb > div
{
	margin:0 7px;
	width:286px;
	height:60px;
	background:white url(../media/djb-logo.svg) no-repeat 50% 50%;
	
	border-bottom:1px solid #444444;
}
#page-sidebar.active > .djb
{
	position:fixed;
}
#page-sidebar div.menu
{
	margin-top:63px;
	padding:0 7px;
	
	font-size:20px;
	line-height:28px;
}
#page-sidebar .header
{
	margin-bottom:4px;
	font-size:20px;
	color:#05A9F5;
}
#page-sidebar .menu a
{
	display:block;
	text-decoration:none;
	color:#9A9999;
}
#page-sidebar .menu .sub
{
	margin:8px 0;
	padding:4px 0 10px 0;
	border:1px solid #f2f2f2;
	border-left:none;
	border-right:none;
}	
#page-sidebar .menu .sub a
{
	font-size:16px;
	color:#444440;
}
#page-sidebar .menu a > .small
{
	font-size:12px;
	line-height:1;
}
#page-sidebar .menu a:hover,
#page-sidebar .menu a.selected,
#notifications li.article:hover
{
	color:#190100;
}

#social
{
	padding:7px;
}
#social a
{
	display:block;
	float:left;
	margin-right:15px;
	width:40px;
	height:30px;
	background:transparent url(../media/socials.svg) no-repeat 0 0;
}
#social a:hover
{
	background-position:0 50%;
}
#social a.soundcloud
{
	background-position:-40px 0;
}
#social a.instagram
{
	background-position:-80px 0;
}
#social a.facebook
{
	background-position:-120px 0;
}
#social a.soundcloud:hover
{
	background-position:-40px 50%;
}
#social a.instagram:hover
{
	background-position:-80px 50%;
}
#social a.facebook:hover
{
	background-position:-120px 50%;
}

#profile
{
	margin-top:6px;
	
	border-top:1px solid #444444;
	/* background-color:#FDF5F5; */
	
	color:#666560;
	font-size:14px;
	line-height:17px;
}
#profile > div
{
	padding:8px;
	background-color:#FDF5F5;
	border-bottom:1px solid #E6E5E2;
}
#profile .signin
{
	padding:28px 10px;
}
#profile.login .signin,
#profile:not(.login) .user
{
	display:none;
}
#profile .user
{
	position:relative;
	padding:18px 15px 15px 50px; 
}
#profile .user .avatar
{
	position:absolute;
	left:8px;
	top:15px;
	width:30px;
	height:30px;
	border-radius:15px;
	background:white none no-repeat 50% 50%;
	background-size:cover;
}
#profile .user .name
{
	font-size:20px;
	color:#444440;
}
#profile .user .edit
{
	display:block;
	margin-top:10px;
	color:#05A9F5;
	text-decoration:none;
}
#profile .user .edit:hover,
#page-settings a:hover,
#page-header a.search:hover,
#page-article .author a.follow:hover
{
	opacity:.65;
}
#profile .signout
{
	text-decoration:none;
}

#profile a.button,
#page-article a.button,
#page-article input.button
{
	background:#05A9F5;
	border-color:#05A9F5;
	color:#FFFFFF;
	
	line-height:36px;
	text-align:center;
	text-decoration:none;
	
	box-shadow:0 1px 1px rgba(0,0,0,.14);
}

#notifications
{
	margin:0;
	padding:0;
	list-style:none;
}
#notifications li
{
	position:relative;
	padding:11px 15px 11px 8px;
	margin-top:2px;
	background-color:#FDF5F5;
	border-bottom:1px solid #E6E5E2;
	
	transition:transform .2s ease 0s;
	-webkit-transition:-webkit-transform .2s ease 0s;
}
#notifications li:not(.article)
{
	color:white;
	background-color:#05A9F5;
}
#notifications li.article:hover
{
	cursor:pointer;
	color:black;
}
#notifications li.remove
{
	transform:translateX(-100%);
	-webkit-transform:translateX(-100%);
}
#notifications li .head
{
	margin-bottom:3px;
	font-family:'Kobern Black',kobernblack,sans-serif;
	font-size:16px;
	line-height:19px;
	color:#c5c2c2;
	text-transform:uppercase;
}
#notifications li .title
{
	text-transform:uppercase;
}
#notifications li a.close
{
	position:absolute;
	right:5px;
	top:5px;
	width:10px;
	height:10px;
	background:transparent url(../media/notification-close.svg) no-repeat 50% 50%;
}
#notifications li:not(.article) a.close
{
	background-image:url(../media/notification-close-white.svg);
}
#notifications li a.close:hover
{
	opacity:.6;
}

/*	sidebar audio player
*/
#page-player
{
	display:none;
	position:relative;
	padding:5px 1px;
	border-bottom:2px solid #2b2b2b;
}
#page-player.active
{
	display:block;
}
#page-player > *
{
	float:left;
	vertical-align:middle;
}
#page-player a.play
{
	display:block;
	width:30px;
	height:30px;
	background:transparent url(../media/play-sidebar-2017.svg) no-repeat 0 0;
}
#page-player a.play.playing
{
	background-position:0 100%;
}
#page-player a:hover
{
	opacity:.6;
}
#page-player .time
{
	margin-top:9px;
	width:40px;
	line-height:12px;
}
#page-player > .progress
{
	position:relative;
	margin-right:8px;
	width:calc(100% - 150px);
	height:30px;
	cursor:pointer;
}
#page-player > .progress .bar
{
	position:absolute;
	left:0;
	top:13px;
	height:4px;
	width:100%;
	min-width:1px;
	background-color:#E4E4E4;
}
#page-player .bar.progress
{
	background-color:#F44336;
	border-right:1px solid #F44336;
}
#page-player .bar.loaded
{
	width:0;
	background-color:#05A9F5;
}
#page-player a.link
{
	margin:7px 0 0 7px;
	width:17px;
	height:17px;
	background:transparent url(../media/article-type-2017-menu.svg) no-repeat 100% 0;
}	


/*	main page (grid)
*/

#djb
{
	position:relative;
	width:310px;
	margin:96px auto 110px auto;
	margin:76px auto 100px auto;  /* 40 px less header spacing */
	padding-bottom:8px;
	
	border-bottom:1px solid #979797;
}
#djb > img
{
	display:inline-block;
}

#grid
{
	position:relative;
}
.line
{
	margin:0 0 78px 0;
	position:relative;
}
.line.paging
{
	margin-bottom:0;
}
.line.advert
{
	background-color:#d8d8d8;
	/* min-height:250px; */
}
html.mobile .advert
{
	width:320px;
	margin:0px auto;
}
@media (max-width:350px) {
	html.mobile #page-article .advert {
		margin-left:-15px;
		margin-right:-15px;
	}
}

.donate
{
	margin:-20px 0 30px 0;
	background-color:#05A9F5;
	border-radius:4px;
	padding-left:20px;
	line-height:40px;
	
	font-family:'Kobern Medium',kobernmedium,sans-serif;
	color:white;
}
.donate a.button
{
	display:block;
	float:right;
	margin:4px 6px 0 0;

	padding:0 30px;
	border-radius:5px;
	background-color:white;

	color:#05A9F5;
	line-height:32px;
	text-decoration:none;
	
	box-shadow:0 1px 1px rgba(0,0,0,.1);
}
.donate a.button:hover
{
	opacity:.9;
}

#paging
{
	display:block;
	margin:20px auto;
	width:150px;
	height:60px;
	
	border:1px solid rgb(164,164,164);
	border-radius:8px;
	
	background:transparent url(../media/more.svg) no-repeat 50% 14px;
	
	text-align:center;
	font-size:11px;
	line-height:85px;
	text-decoration:none;
}
.line.loading #loading
{
	position:absolute;
	top:29px;
}

.item
{
	position:relative;
	float:left;
	width:310px;
	cursor:pointer;
	
	transition:opacity .2s linear 0s;
	-webkit-transition:opacity .2s linear 0s;
}
.item:hover,
.result:hover
{
	opacity:.85;
}
@-moz-document url-prefix()
{ 
	/*	firefox exception: don't fade on hover, there's a display bug (because of the transform:translateY?) */
	.item:hover { opacity:1; }
}
.item:not(:first-child)
{
	margin-left:20px;
}
.item > div
{
	position:relative;
	width:100%;
}
.item .media
{
	margin-bottom:7px;
	min-height:270px;
	background-color:#D8D8D8;
	overflow:hidden;
}
.item .media > div
{
	position:absolute;
	left:-25px;
	top:-25px;
	right:-25px;
	bottom:-25px;
	
	background:transparent none no-repeat 50% 50%;
	background-size:cover;
	
}
.item .meta,
#article-header .meta,
#comments .meta,
#page-search .meta
{
	font-size:12px;
	color:#666560;
}
.item .meta .hypes,
#article-header .hypes,
#page-article .meta .hypes
{
	padding-left:15px;
	background:transparent url(../media/star.svg) no-repeat -1px 100%;
}
.item .meta .hyped,
#article-header .hyped,
#page-article .meta .hyped
{
	color:#05A9F5;
	background-position:-1px 0;
}
.item .meta .bookmarked,
.item .meta .mediatype
{
	display:block;
	float:right;
	margin-left:3px;
	width:17px;
	height:17px;
	background:transparent url(../media/bookmarked.svg) no-repeat 0 0;
}
.item .meta .mediatype
{
	background-image:url(../media/article-type-2017.svg);
	background-position:0 0;
}
.item .meta .mediatype.audio
{
	background-position:100% 0;
}
.item .title,
.modal > .title,
.modal > .head > .title,
#page-settings .head .title,
#page-search .title
{
	padding:7px 0;
	
	font-family:'Kobern Light',kobernlight,sans-serif;
	text-transform:uppercase;
	font-size:24px;
	line-height:22px;
	color:#190100;
}
.title.all,
.title.bold
{
	font-family:'Kobern Black',kobernblack,sans-serif;
}
.title.classic,
.title.all > div:first-child
{
	font-family:'ITCLubalinGraphW01-Bk',itc_lubalin_graphregular,sans-serif;	
}
.title.all > div:nth-child(2)
{
	/* line height correction for the kobern black line in mixed font titles */
	margin:-3px 0 2px 0;
}
.title.modern,
.title.all > div:nth-child(n+3),
.title.all > div:last-child
{
	font-family:'Kobern Light',kobernlight,sans-serif;
}
/* html:not(.mobile) .item .title > div */
html:not(.mobile) .item .title.all > div
{
	font-family:'Kobern Light',kobernlight,sans-serif;
}

.item .title > div
{
	display:inline;
}
.item .title > div:after,
.result .title > span:after
{
	content:' ';
}
.item .title > em,
.item .title > a.mediatype
{
	display:none;
}
.item .short
{
	font-size:17px;
	line-height:20px;
}

/*	header item
*/
.item.head
{
	width:970px;
}
.item.head .title
{
	padding:10px 0;
	font-size:38px;
	line-height:36px;
}
.item.head .media
{
	width:970px;
	height:492px;
}

/*	1+2 cols line
*/
.line.left .item:first-child,
.line.right .item:last-child
{
	width:640px;
}

/*	2-item line
*/
.line.center .item
{
	width:475px;
}


/*	article UI
*/

#article-header
{
	position:absolute;
	left:0;
	top:0;
	height:60px;
	width:100%;
	text-align:center;
	
	transform:translateY(-100px);
	-webkit-transform:translateY(-100px);
}
#article-header .meta
{
	position:absolute;
	left:60px;
	top:14px;
	height:32px;
	padding-left:10px;

	border-left:1px solid #1A1919;

	line-height:30px;
	color:#666560;
}
html.playing:not(.sidebar) #article-header .meta
{
	left:78px;
}
#article-header .meta a.author,
#page-article .meta a.author
{
	display:inline-block;
	color:#666560;
	text-decoration:none;
}
#article-header .meta .avatar,
#comments .avatar
{
	float:left;
	margin:2px 8px 0 0;
	width:28px;
	height:28px;
	border-radius:15px;
	background:#c5c2c2 none no-repeat 50% 50%;
	background-size:cover;
}
#article-header .meta a.author span.follow,
#page-article .meta a.author span.follow
{
	display:none;
}
#article-header .meta a.author:hover > .follow,
#page-article .meta a.author:hover > .follow
{
	color:#05a9f5;
}
#article-header .meta a.author:hover span.follow,
#page-article .meta a.author:hover span.follow
{
	/* display:inline; */
}
#article-header a.close
{
	line-height:52px;
	color:#444440;
}
#article-header a.close.page span.article
{
	display:none;
}
#article-header a.close:hover
{
	color:#190100;
}
html.article #article-header
{
	transform:translateY(0);
	-webkit-transform:translateY(0);

	transition:transform .25s cubic-bezier(.54,.49,.59,1.35) .5s;
	-webkit-transition:-webkit-transform .25s cubic-bezier(.54,.49,.59,1.35) .5s;
}

/*	main article layout
*/
#page-article
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	min-height:100%;

	background-color:#ECEAEA;
	
	transform:translateY(100%);
	-webkit-transform:translateY(100%);
	
	transition:transform .5s ease 0s;
	-webkit-transition:-webkit-transform .4s ease 0s;
}
html.article #page-article
{
	transform:none !important;
	-webkit-transform:none !important;
	
	transition:transform .4s ease .25s;
	-webkit-transition:-webkit-transform .4s ease .25s;
}
html.article.sidebar #page-article
{
/* 
	transition:transform .3s ease 0s;
	-webkit-transition:-webkit-transform .3s ease 0s;
 */
	
	transform:translate(300px,0) !important;
	-webkit-transform:translate(300px,0) !important;
}
#page-article.sidebar
{
	transition:transform .3s ease 0s !important;
	-webkit-transition:-webkit-transform .3s ease 0s !important;
}

html.article #page-menu .menu
{
	transform:translateY(-50px);
	-webkit-transform:translateY(-50px);
}
#page-article.active
{
	position:absolute;
}
#page-article article > div
{
	position:relative;
}

/*	article head 
*/
#page-article .head
{
	width:100%;
	background:#D8D8D8 url(../media/djb-bg.svg) no-repeat 50% 50%;
	overflow:hidden;
}
#page-article .head.no-logo
{
	background-image:none;
}
#page-article.page .head
{
	/* background-color:#05a9f5; */
}
#page-article .head .media
{
	opacity:1;
	
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:transparent none no-repeat 50% 50%;
	background-size:cover;

}
#page-article .head .caption
{
	position:absolute;
	left:15px;
	bottom:5px;
	color:white;
	text-shadow:1px 1px 0 rgba(0,0,0,.5);
}
#page-article .head .hd:not(.loading)
{
	transition:opacity .4s ease 0s;
	-webkit-transition:opacity .4s ease 0s;
}
#page-article .head .hd.loading
{
	opacity:0;
}
#page-article .head .play
{
	position:absolute;
	left:50%;
	top:50%;
	margin:-41px 0 0 -41px;
	width:82px;
	height:81px;
	cursor:pointer;
	background:transparent url(../media/play.svg) no-repeat 0 0;
}
#page-article .head .play.playing
{
	background-position:0 100%;
}
#page-article .head .waveform
{
	position:absolute;
	left:50%;
	margin-left:-498px;
	bottom:40px;

	width:998px;
	height:60px;
	line-height:60px;
	
	cursor:pointer;
}

#page-article .head .waveform.active
{
/* 
	transition:height .4s ease 0s;
	-webkit-transition:height .4s ease 0s;
 */
}
#page-article .head .waveform > div
{
	display:inline-block;
	vertical-align: bottom;
	height:0;
	width:3px;
	background-color:white;
	box-shadow:1px 1px 0px rgba(0,0,0,.4);
	
	transition:height .4s ease .6s;
	-webkit-transition:height .4s ease .6s;
}
#page-article .head .waveform:not(.active) > div
{
	/* height:2px !important; */
}
#page-article .head .waveform > div.on,
#page-article .head .waveform > div.over
{
	background-color:#F44336;
}
#page-article .head .waveform > div.on.over
{
	background-color:white;
}
#page-article .head .waveform > div:not(.first)
{
	margin-left:2px;
}
#page-article .head .waveform > span
{
	position:absolute;
	left:0;
	bottom:-14px;

	color:white;
	line-height:12px;
}
#page-article .head .waveform > span.time
{
	left:0;
}
#page-article .head .waveform > span.duration
{
	left:auto;
	right:0;
}
	

#page-article article > .title,
#page-article article > .head > .title
{
	margin:45px auto 12px auto;

	font-size:64px;
	line-height:56px;
	text-align:center;
	text-transform:uppercase;

	color:#190100;
}
#page-article > article > .title
{
	width:870px;
}
#page-article.page article > .title,
#page-article.page article > .meta,
#page-article.page article > #bookmark
{
	display:none;
}
#page-article #bookmark
{
	display:block;
	margin:20px auto 0 auto;
	width:45px;
	height:45px;
	background:transparent url(../media/bookmark.svg) no-repeat 100% 0;
}
#page-article .head #bookmark
{
	background-position:0 0;
}
#page-article #bookmark.active
{
	background-position:100% 100%;
}
#page-article .head #bookmark.active
{
	background-position:0 100%;
}
#page-article article > .meta
{
	/* display:none; */
	margin-bottom:45px;
	text-align:center;
}
#page-article article > .meta .hypes
{
	display:inline-block;
	line-height:18px;
}
#page-article .sponsor
{
	margin:2px 0 10px 0;
	text-align:center;
}
#page-article .sponsor img
{
	margin-top:5px;
	display:inline-block;
	max-width:150px;
}

/* title on header */
#page-article article > .head > .title
{
	position:absolute;
	top:50%;
	width:80%;
	margin:0 10%;

	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);

	color:white;
	text-shadow:0 2px 1px rgba(0, 0, 0, 0.5);	
}
#page-article .head > .sponsor
{
	position:absolute;
	bottom:15px;
	width:100%;
}

/*	body, share etc
*/
#page-article .body
{
	width:970px;
	margin:auto;
}
#page-article .body > div
{
	position:relative;
	width:100%;
	min-height:176px;
}
#page-article .body > div:not(.text):not(.end)
{
	border-top:1px solid #c6c6c6;
	text-align:center;
}
#page-article .end
{
	background:transparent url(../media/article-end.svg) no-repeat 50% 50%;
}
#page-article .body > .share
{
	padding-top:52px;
	font-size:12px;
	/* text-align:center; */
}
article > .share
{
	margin-bottom:45px;
	font-size:12px;
	text-align:center;
}
#page-article .share a,
#page-article .comments a:not(.submit)
{
	display:inline-block;
	width:90px;
	color:#666560;
	text-decoration:none;
}
#page-article .share a.active
{
	color:#05A9F5;
}
#page-article .share a > i,
#page-article .comments a > i
{	
	display:block;
	margin:auto;
	width:40px;
	height:40px;
	background:transparent url(../media/article-icons.svg) no-repeat 0 0;
}
#page-article .share a.hype.active > i
{
	background-position:0 100%;
}
#page-article .share a.bookmark > i
{
	background-position:-40px 0;
}
#page-article .share a.bookmark.active > i
{
	background-position:-40px 100%;
}
#page-article .share a.share > i
{
	background-position:-80px 0;
}
#page-article div.share > .popover
{
	position:absolute;
	top:-50px;
	margin:-19px 0 0 19px;
	padding:0 10px;
	height:60px;
	background-color:black;
	box-shadow:-1px 1px 1px rgba(0,0,0,.45);
	
	transition:opacity .2s linear 0s;
	-webkit-transition:opacity .2s linear 0s;
}
#page-article div.share > .popover.remove
{
	opacity:0;
}
#page-article div.share > .popover:after
{
	content:'';
	display:block;
	position:absolute;
	bottom:-13px;
	left:26px;
	width:15px;
	height:13px;
	background-image:url(../media/popover-arrow.svg);
	box-shadow:-1px -1px 1px rgba(0,0,0,.45);
}
#page-article div.share > .popover > a
{
	display:block;
	float:left;
	width:40px;
	height:30px;
	margin:15px 5px;

	background:transparent url(../media/socials.svg) no-repeat 0 100%;
}
#page-article div.share > .popover > a.facebook
{
	background-position:-120px 100%;
}	

#page-article .comments
{
	padding-top:44px;
	background-color:#f4f0f0;
}
#page-article .comments a.header
{
	width:120px;
}
#page-article .comments a.header >i
{
	background-position:100% 0;
}
#comments
{
	width:90%;
	padding:40px;
	margin:30px auto 0 auto;
	border-top:1px solid #E6E5E2;
	text-align:left;
}
.comment
{
	position:relative;
	padding-left:46px;
	min-height:30px;
	margin-bottom:40px;
	overflow:hidden;
}
#comments textarea
{
	width:85%;
	height:65px;
	font-size:16px;
	line-height:21px;
	margin-right:10px;
}
#comments .comment > .avatar
{
	position:absolute;
	left:0;
	top:0;
	float:none;
	margin:0;
}
#comments .meta
{
	margin-top:-4px;
}
#comments .meta a.close
{
	display:inline-block;
	vertical-align:middle;
	margin-left:5px;
	width:10px;
	height:10px;
	background:transparent url(../media/notification-close.svg) no-repeat 50% 50%;
}

#related
{
	text-align:left;
}
#related > .line:first-child
{
	margin-top:0;
}
#page-article .inline-media
{
	position:relative;
	overflow:hidden;
	width:100%;
	text-align:center;
}

.footer
{
	padding:60px 0 5px 0;
	color:#9A9999 !important;
	text-align:center;
}
.footer .logo
{
	opacity:.25;
}
.footer a,
.footer a:hover
{
	color:#9A9999;
	text-decoration:none;
}

/*	article typography
*/

/* #page-article a:not(.button):not(.author):hover, */
#page-article a:not(.author):hover,
.footer a:hover
{
	opacity:.6;
}
#page-article .text,
#page-article .text *:not(blockquote):not(.streamer):not(.caption):not(.black):not(.button):not(.avatar):not(.meta):not(strong):not(b):not(option)
{
	/*	force uniform type in text body
	*/
	font-family:'Kobern Regular',kobernregular,sans-serif !important;
	font-size:20px !important;
	line-height:28px !important;

	background-color:transparent !important;
}
#page-article .text *:not(.streamer):not(.caption):not(.button):not(blockquote):not(option)
{
	color:#444440 !important;
}
#page-article .text a:not(.follow):not(.button):hover
{
	color:#190100 !important;
}
#page-article .caption, .caption
{
	font-size:12px !important;
	color:#666560;
}
#page-article strong,
#page-article b
{
	/*	force uniform type in text body
	*/
	font-family:'Kobern Medium',kobernmedium,sans-serif !important;
	font-weight:normal; !important;
	font-size:20px !important;
	line-height:28px !important;

	background-color:transparent !important;
}
#page-article p img,
#page-article .text iframe
{
	display:block;
	margin:auto;
	max-width:100%;
}
#page-article p img
{
	height:auto;
}
 
#page-article .text .advert.halfpage
{
	float:right;
	margin: 10px 0 10px 30px;
}

#page-article .text blockquote,
#page-article .related blockquote,
#page-article em.streamer
{
	display:block;
	clear:both;
	margin:35px 80px;
	
	font-family:'Kobern Light',kobernlight,sans-serif;
	font-style:normal;
	font-size:64px;
	line-height:77px;
	text-align:center;
	
	color:#190100;
}
#page-article .related blockquote
{
	color:#C5C2C2;
	line-height:62px;
	text-transform:uppercase;
}
#page-article blockquote.short
{
	display:none;
}

#page-article .authors
{
	padding:50px 0;
}
#page-article .authors .author
{
	float:left;
	width:50%;
	padding-right:33px;
	margin-bottom:20px;
}
#page-article .authors .author .avatar
{
	float:left;
	width:74px;
	height:74px;
	margin-right:13px;
	border-radius:36px;
	background:#c5c2c2 none no-repeat 50% 50%;
	background-size:cover;
}
#page-article .authors .author .bio
{
	line-height:14px;
}
#page-article .authors .author a,
#page-article .authors .author a > span
{
	color:#05a9f5;
	text-decoration:none;
}
#page-article em.secure
{
	padding-top:80px;
	background:transparent url(../media/secure.svg) no-repeat 50% 0;
}
#page-article .contact
{
	background:transparent url(../media/contact.jpg) no-repeat 50% 65%;
	background-size:870px 238px;
}
#page-article a.button
{
	margin:40px auto;
	padding-left:30px;
	background:#05A9F5 url(../media/mail.svg) no-repeat 15px 50%;
	line-height:38px;
}
#page-article input.button
{
	cursor:pointer;
}
#page-article a.button:hover,
#page-article input.button:hover
{
	opacity:.85;
}

#page-article a.buttonNoMail {
	background-image:none;
	padding-left:0;
}
#page-article .contact a.button
{
	margin-bottom:280px;
}
#page-article .address
{
	float:left;
	width:33%;
}
#page-article .address .black
{
	font-family:'Kobern Black',kobernblack,sans-serif !important;
}
#page-article form.paypal
{
	display:block;
	text-align:center;
	line-height:12px;
}
#page-article form.paypal select
{
	background-color:transparent;
	border:1px solid #C6C6C6;
	display:block;
	margin:23px auto;
}
#page-article form.paypal:after
{
	display:inline-block;
	content:'';
	width:83px;
	height:21px;
	background:transparent url(../media/PP_logo_h_200x51.png) no-repeat 50% 50%;
	background-size:contain;
}

#vote
{
	display:block;
	margin:12px 0 40px 0;
}
#vote:after
{
	display:block;
	content:' ';
	clear:both;
}



/*	small screen devices
*/

@media (max-width:1023px)
{
	/*	everything below 1024
	*/

	body
	{
		/* height:auto !important; */
	}

 	html:not(.sidebar) #page-fixed
 	{
/* 
 		transform:translateY(0) !important;
 		-webkit-transform:translateY(0) !important;
 */
 	}
	
	#page-body,
	#page-header
	{
		width:100%;
		min-width:0 !important;
	}
	
	#page-body,
	#page-article
	{
		/*	prevent ads from running outside viewport on mobile */
		max-width:100%;
		overflow:hidden;
	}
	
	.line
	{
		margin:0;
	}

	.item
	{
		width:100% !important;
		margin:0 !important;
		/* min-height:350px; */
		
	}
	.item:hover
	{
		opacity:1;
	}
	.item > .media
	{
		width:100% !important;
		min-height:350px;
		height:auto !important;
	}
	
	article p > img
	{
		max-width:100%;
		height:auto !important;
	}
}

@media (min-width:650px) and (max-width:1023px)
{
	/*	ipad alike portrait
	*/
	
	/* #page-signin > *:not(a) */
	div.modal > *:not(a)
	{
		width:80%;
	}

	#page-body,
	#page-article .body
	{
		max-width:80%;
	}
	.item
	{
		margin-bottom:78px !important;
	}
	#page-article > article > .title
	{
		margin:20px auto;
		width:90%;
	}	
	#page-article .authors .author
	{
		width:100%;
	}
}

@media (max-width:650px)
{
	/*	mobile
	*/
	
	#header,
	#header.fixed
	{
		top:0;
	}
	#page-article,
	#page-fixed
	{
		padding-top:64px;
	}
	#djb
	{
		display:none;
	}
	#result
	{
		margin-top:100px;
	}
	#page-search .result
	{
		margin-bottom:50px;
	}
	#page-search .result .media
	{
		float:none;
		margin:0 0 10px 0;
	}
	
	html #page-header.fixed #page-menu
	{
		background-color:transparent;
	}
	#page-header.fixed .menu,
	#article-header .meta,
	#article-header a.close .text
	{
		display:none;
	}
	#page-header.fixed
	{
		overflow:visible;
	}
	#page-header a:not(.author) 
	{
		width:85px;
	}
 
 	#page-menu .menu
 	{
		transition:opacity .3s linear 0s;
		-webkit-transition:opacity .3s linear 0s;
	} 	
 	
	html.article #page-menu .menu
	{
	
		transform: translateY(0);
		opacity:0;
	}
	html.article #page-article
	{
		-webkit-transition:-webkit-transform .4s ease .35s;
	}
	
	#page-sidemenu
	{
		background-image:url(../media/djb-icon-mobile.svg);
		background-position:14px 18px;
		background-position:10px 13px;
	}
	#page-sidemenu .playing
	{
		width:20px;
		height:20px;
		top:22px;
		right:-12px;

		background-image:url(../media/article-playing-mobile.svg);
	}

	#page-signin
	{
		overflow:scroll;
		-webkit-overflow-scrolling: touch;
	}

	/* #page-signin > *:not(a) */
	.modal > *:not(a)
	{
		width:90%;
	}
	
	#page-settings .account strong
	{
		display:block;
	}
	#page-settings .account a.edit
	{
		display:block;
		margin-top:-5px;
	}
/* 
	#page-signin .title	
	{
		margin:15px auto;
	}
 */
	
	html.article #page-sidemenu
	{
		/* opacity:.5; */
		display:none;
	}
	#djb
	{
		transform:scale(.8);
		-webkit-transform:scale(.8);
	}
	
	.item > .media
	{
		margin-bottom:0;
		background-color:black;
	}
	.item > .media > div:first-child
	{
		opacity:.5;
		transition:opacity 1s linear 0s;
		-webkit-transition:opacity 1s linear 0s;
	}
	.item > .media > div.viewport
	{
		opacity:1;
	}
	.item > .title
	{
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		-webkit-transform:translateY(-50%);
		
		max-width:100%;
		overflow:hidden;
		
		padding:0 10% !important;
		
		color:white;
		text-align:center;
		font-size:30px !important;
		line-height:28px !important;
		text-shadow:0 2px 1px rgba(0,0,0,.5);
	}
	.item > .title > div
	{
		display:block;
	}
	.item .title > a.mediatype
	{
		display:inline-block;
		margin-top:15px;
		width:50px;
		height:50px;
		background:transparent url(../media/article-type-mobile.svg) no-repeat 0 0;
	}
	.item .title > a.mediatype.audio
	{
		background-position:100% 0;
	}
	
	/*	list item title typography
	*/
	.item > .title.all,
	.item > .title.bold
	{
		font-family:'Kobern Black',kobernblack,sans-serif;
	}
	.item > .title.classic,
	.item > .title.all > div:first-child
	{
		font-family:'ITCLubalinGraphW01-Bk', Helvetica, Arial, sans-serif;
	}
	.item > .title.modern,
	.item > .title.all > div:nth-child(n+3)
	{
		font-family:'Kobern Light',kobernlight,sans-serif;
	}
	
	
	
	.item > .meta,
	.item > .short
	{
		display:none;
	}
	
	#article-header a.close
	{
		position:absolute;
		left:0;
		width:60px;
		height:60px;
		background:transparent url(../media/article-close.svg) no-repeat 0 0;
		
		transition:none;
		-webkit-transition:opacity .4s linear 0s;
	}
	#article-header a.close.dark
	{
		background-position:0 100%;
	}
	#article-header a.close.fade
	{
		opacity:0;
		transition:opacity .4s linear 0s;
		-webkit-transition:opacity .4s linear 0s;
	}
	#page-article .body
	{
		width:100%;
		padding:0 15px;
	}
	#page-article .head
	{
		height:250px !important;
		background-size:500px 500px;
	}

	#page-article .head .waveform
	{
		margin-left:-145px;
		bottom:35px;

		width:290px;
		height:40px;
		line-height:40px;
	}
	#page-article .head .play
	{
		margin-top:-55px;
	}

	#page-article #bookmark
	{
		margin-top:0;
		width:30px;
		height:30px;
		background-size:60px 60px;
	}
	#page-article > article > .meta
	{
		display:block;
		padding:5px 5%;
		text-align:center;
		color:#666560;
	}
	#page-article .meta .avatar
	{
		display:none;
	}
	#page-article .meta .hypes
	{
		background-position:-1px -13px;
	}
	#page-article .meta .hyped
	{
		background-position:-1px 3px;
	}
	#page-article .title,
	#page-article blockquote,
	#page-article em.streamer
	{
		font-size:30px !important;
		line-height:28px !important;
	}
	article > .title.all:not(.single) > div:first-child
	{
		line-height:26px !important;
	}
	#page-article > article > .title
	{
		margin:20px auto 0 auto;
		width:90%;
	}
	#page-article .text blockquote,
	#page-article .related blockquote,
	#page-article em.streamer
	{
		margin:30px;
	}
	#page-article .body > .share > .popover
	{
		margin-top:-80px;
		height:auto;
		width:70px;
	}
	#comments
	{
		padding:20px 0;
	}
	#related .item > .media > div:first-child
	{
		opacity:1;
	}

	#page-article .authors
	{
		padding:30px 0;
	}
	#page-article .authors .author
	{
		width:100%;
	}
	#page-article .authors .author .meta
	{
		line-height:18px !important;
	}
	#page-article .authors .author .meta > span:before
	{
		content:'';
		display:block;
	}
	#page-article .contact
	{
		background-position:50% 25%;
	}
	#page-article .contact a.button
	{
		margin-bottom:200px;
	}
	#page-article .address
	{
		margin:5px 0;
		width:100%;
	}
	
	
}

#social .social.twitter {
	display: none;
}