/**
Links:
file:///media/hd/chrigu/Projects/EternalGrind/designs/take1/index.html#menu
http://blog.svbtle.com/

https://www.freshdesignweb.com/jquery-css3-menu/
http://blog.templatemonster.com/2014/10/13/hidden-flyout-shopping-cart-menu-with-css3/
http://blog.templatemonster.com/demos/hidden-flyout-shopping-cart-menu-with-css3/demo/index.html
http://www.aaronkharris.com/we-need-to-rethink-employee-compensation

*/

html {
	font-family:sans-serif;
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
}

body {
	font-family:'Montserrat', Helvetica, Avenir, Arial, sans-serif;
	font-weight:400;
	background-color:#fff;
	margin:0;
}

article,figure,footer,header,main,nav,section,summary {
  display:block;
}

a {
	color: #4D4D4D;
	background:transparent;
}

a:focus {
	outline:thin dotted;
}

a:active, a:hover {
	outline :0;
}

h1 {
  font-size:25px;
  font-weight:700;
  margin:.67em 0;
}



p {
  font-size: 18px;
  line-height: 1.5;
  margin-top: 20px;
  margin-bottom: 20px;
  color: #4D4D4D;
  font-family: 'Cantarell', 'Helvetica', 'Avenir', 'Arial', sans-serif;
  font-weight: 400;
  letter-spacing: -0.5px;
}

b, strong {
  font-weight:700;
}

code, pre {
  font-family:monospace, serif;
  font-size:1em;
}

pre {
  white-space:pre-wrap;
  border:none;
  border-top:1px solid #e4e4e4;
  border-bottom:1px solid #e4e4e4;
  background-color:#fafafa;
}

q {
  quotes:\201C \201D \2018 \2019;
}

blockquote {
	color: #4D4D4D;
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 5px;
  padding: 0.5em 10px;
}
blockquote:before {
  color: #ccc;
  content: "\201C";
  font-size: 3em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}
blockquote cite {
	color: #999999;
	font-size: 14px;
	display: block;
	margin-top: 5px;
	margin-left: 2em;
}
 
blockquote cite:before {
	content: "\2014 \2009";
}

small
{
  font-size:80%;
}

sub, sup {
  font-size:75%;
  line-height:0;
  position:relative;
  vertical-align:baseline;
}

sup {
  top:-.5em;
}

sub {
  bottom:-.25em;
}

img {
  border:0;
}

hr {
  -moz-box-sizing:content-box;
  box-sizing:content-box;
  background-color:#f4f3f3;
  border:0;
  clear:both;
  width:50%;
  height:5px;
  color:#f4f3f3;
  margin:0 auto;
}



/****************************************************************
 * Content
 */
article h1, article h2, article h3, article p, article ul, article table, article blockquote {
  padding-left:10px;
  padding-right:10px;
  max-width:600px;
  margin:20px auto;
}

h1.article_title {
  font-size: 40px;
  line-height: 35px;
  margin-bottom: 15px;
  margin-top: 0px;
}

article.post p {
  margin-top: 20px;
  margin-bottom: 20px;
  -webkit-font-smoothing: antialiased;
}

time.article_time {
  max-width:600px;
  text-transform:uppercase;
  display:block;
  opacity:0.1;
  font-weight:700;
  font-size:14px;
  color:#1d1d1d;
  -webkit-font-smoothing:antialiased;
  transition-property:all;
  transition-duration:.5s;
  -webkit-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -moz-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -ms-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -o-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  margin:0 auto 5px;
}

time.article_time:hover {
	opacity:0.8;
}


/****************************************************************
 * Header and Footer
 */
#header figure {
/*
	margin: 0 0;
	height: 200px;
	background: url('imgs/panorama.jpg') no-repeat center center fixed;
*/
}

#footer {
	padding-top: 20px;
  padding-bottom: 20px;
  color: #f0f0f0;
  text-align: center;
}

#footer a {
  display: inline-block;
  font-weight: 700;
  font-family: 'freight-sans-pro', sans-serif;
  font-size: 17px;
  letter-spacing: -1px;
  text-transform: uppercase;
  text-decoration: none;
  opacity:0.1;
  color:#1d1d1d;
  -webkit-font-smoothing: antialiased;
  transition-property:all;
  transition-duration:.5s;
  -webkit-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -moz-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -ms-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  -o-transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
  transition-timing-function:cubic-bezier(0.165,0.63,0.14,0.82);
}

#footer a:hover {
	opacity:0.8;
	text-decoration: underline;
}


/****************************************************************
 * Menu
 */
nav#slide-menu {
	position: fixed;
	top: 0px;
	right: -250px;
	bottom: 0;
	display: block;
	float: right;
	height: 100%;
	z-index: 10;
	
	background-color: #f4f3f3;
  border-left: 1px solid #D7D5D5;

	-moz-transition: all 300ms;
	-webkit-transition: all 300ms;
	transition: all 300ms;
}

nav#slide-menu > ul {
		display: block;
		margin: 60px 0;
		padding: 0;
		list-style: none;

		-moz-transition: all 300ms;
		-webkit-transition: all 300ms;
		transition: all 300ms;
}

nav#slide-menu > ul li {
			color: #4D4D4D;
			padding: 6px 30px;
			
			text-align: right;
}

nav#slide-menu > ul li:hover {
			background-color: #D7D5D5;
}
nav#slide-menu > ul li.title {
	text-transform: uppercase;
}
nav#slide-menu > ul li.title:hover {
	background-color: #f4f3f3;
}

nav#slide-menu > ul li a {
	color: #4D4D4D;
	cursor: pointer;
	width: 100%;
	height: 100%;
	display: inline-block;
}

nav#slide-menu > ul li a:hover {
	background-color: #D7D5D5;
}

body.menu-active nav#slide-menu { 
	right: 0px; 
}
body.menu-active nav#slide-menu ul { 
	right: 0px; 
	opacity: 1; 
}

div.menu-trigger {
		position: fixed;
		top: 20px;
		right: 20px;
		width: 28px;
	  height: 28px;
	  z-index: 11;
	  
		cursor: pointer;
		background: transparent url('imgs/menu.png') no-repeat;
}



/****************************************************************
 * Misc
 */
#topspacer {
	height: 80px;
	width: 100%;
}