@font-face {
  font-family: 'icons';
  src:  url('fonts/icomoon.eot?r3p9w8');
  src:  url('fonts/icomoon.eot?r3p9w8#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?r3p9w8') format('truetype'),
    url('fonts/icomoon.woff?r3p9w8') format('woff'),
    url('fonts/icomoon.svg?r3p9w8#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

body { padding-top:74px; }
body.admin-bar #frictional-bar { top:32px; }
#frictional-bar { position:absolute; top:0; left:0; width:100%; background:#000; display:table; list-style:none; border-bottom:1px solid #333; padding:12px; box-sizing:border-box; }
#frictional-bar li { display:table-cell; vertical-align:middle; position:relative; }
#frictional-bar li:nth-child(1) { width:21%; }
#frictional-bar li:nth-child(1) .logo { width:140px; float:left; }
#frictional-bar li:nth-child(1) a:hover { opacity:0.8; }
#frictional-bar li:nth-child(1) .logo img { float:left; }
#frictional-bar li:nth-child(1) .toggle-menu { width:24px; height:24px; display:none; color:#fff; font-size:24px; position:absolute; top:18px; right:18px; font-family:icons; cursor:pointer; line-height:24px; }
#frictional-bar li:nth-child(1) .toggle-menu::before { content:"\e903"; }
#frictional-bar li:nth-child(2) { width:58%; text-align:center; }
#frictional-bar li:nth-child(2) a { display:inline-block; margin:0 30px; font-family:'Fira Sans'; font-weight:bold; color:#fff; font-size:12px; line-height:16px; padding:2px 0; position:relative; text-transform:uppercase; }
#frictional-bar li:nth-child(2) a:hover { opacity:0.8; }
#frictional-bar li:nth-child(2) a.penumbra, #frictional-bar li:nth-child(2) a.soma { top:-8px; }
#frictional-bar li:nth-child(3) { width:21%; text-align:right;	 }
#frictional-bar li:nth-child(3) a { width:36px; height:36px; font-family:icons; color:#fff; font-size:24px; margin-left:6px; }
#frictional-bar li:nth-child(3) a:hover { opacity:0.8; }
#frictional-bar li:nth-child(3) a.discord::before { content:"\e900"; }
#frictional-bar li:nth-child(3) a.facebook::before { content:"\e901"; }
#frictional-bar li:nth-child(3) a.instagram::before { content:"\e902"; }
#frictional-bar li:nth-child(3) a.tumblr::before { content:"\e904"; }
#frictional-bar li:nth-child(3) a.twitter::before { content:"\e905"; }
#frictional-bar li:nth-child(3) a.twitch::before { content:"\e907"; }
@media screen and (max-width: 1200px){
	#frictional-bar li:nth-child(2) a { margin:0 20px; }
}
@media screen and (max-width: 1000px){
	body { padding-top:60px; }
	#frictional-bar { padding:0; }
	#frictional-bar li { display:block; }
	#frictional-bar li:nth-child(1) { text-align:center; width:100%; }
	#frictional-bar li:nth-child(1) .logo { width:100px; position:relative; left:50%; margin:12px 0 12px -50px; }
	#frictional-bar li:nth-child(1) .toggle-menu { display:block; }
	#frictional-bar li:nth-child(2) { width:100%; float:left; display:none; }
	#frictional-bar li:nth-child(2) a { width:100%; float:left; margin:0; border-bottom:1px solid #333; padding:12px 0; font-size:14px; }
	#frictional-bar li:nth-child(2) a:first-child { border-top:1px solid #333; }
	#frictional-bar li:nth-child(2) a br { display:none; }
	#frictional-bar li:nth-child(2) a.penumbra, #frictional-bar li:nth-child(2) a.soma { top:initial; }
	#frictional-bar li:nth-child(3) { display:none; }
}
@media screen and (max-width: 782px){
	body.admin-bar #frictional-bar { top:46px; }
}
