/* Reset */
	*,html,body { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { border:0; font-size:100%; font:inherit; vertical-align:baseline; margin:0; padding:0; }
    ol, ul { list-style:none; }
    blockquote,q { quotes:none; }
    blockquote:before,blockquote:after,q:before,q:after { content:none; }
    table { border-collapse:collapse; border-spacing:0; }
    
    /* Styles */
	body {
		background-color: #F7F7F7;
		margin: 0;
		color: black;
		font-size: 11px;
		font-family: 'Roboto', sans-serif;
		font-weight: 300;
		text-align: center;
		overflow-x: hidden!important;
	}


	a { color: #fff; text-decoration: none; position: relative; }
	a:hover:before { clip: rect(0, 190px, 190px, 0); }

	a:before {
	  position: absolute;
	  left: 0;
	  top: 0;
	  content: attr(data-content);
	  display: inline-block;
	  color: rgb(255,233,0);
	  width: 100%;
	  clip: rect(0, 0, 0, 0);
	  -webkit-transition: clip cubic-bezier(0.65, 0.46, 0.45, 0.94) 500ms;
	  transition: clip cubic-bezier(0.65, 0.46, 0.45, 0.94) 500ms;
	}

	.blackLinks, .blackLinks a, .blackLinks div { color: #666!important; }
	.blackLinks a:before { color: #01aef2!important; }

	#fullpage article { color: #fff; position: relative; }

	#fullpage .firstcapital {
		background-attachment: scroll;
    	background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}

	#fullpage .firstcapital:after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 69%, rgba(0,0,0,0.8) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(69%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.8)));
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 69%,rgba(0,0,0,0.8) 100%);
		background: -o-linear-gradient(top, rgba(0,0,0,0) 69%,rgba(0,0,0,0.8) 100%);
		background: -ms-linear-gradient(top, rgba(0,0,0,0) 69%,rgba(0,0,0,0.8) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,0) 69%,rgba(0,0,0,0.8) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
	}

	#fullpage article img,
	#fullpage article .playground {
		max-width: 100vw;
		max-height: 90vh;
		position: relative;
  		top: 50%;
		transform: translateY(-50%);
		border-radius: 5px;
		overflow: hidden;
	}

	#fullpage article .playground { overflow: hidden; }

	#fullpage article { background: #232323; }

	#fullpage #logo { padding-top: 50vh; position: relative; }

	#fullpage #logo svg {
	    left: 50vw;
	    position: absolute;
	    text-align: center;
	    top: 50vh;
	    transform: translate(-50%, -50%);
	    width: 300px;
	}

	#fullpage #footer { max-height: 100vh; position: relative; top: 50%; transform: translateY(-50%); color: #666; font-size: 4em; }
	#fullpage #footer a { color: #666; }

	#fullpage #footer span {
	    background: #666;
	    border-radius: 100%;
	    color: #f7f7f7;
	    display: inline-table;
	    font-size: 17px;
	    height: 30px;
	    margin-bottom: 20px;
	    padding: 5px 10px;
	    width: 30px;
	}

	.slidebtn {
	    height: 70px;
	    margin: 0 auto;
	    overflow: hidden;
	    width: 150px;
	}

	#gofurther .slidebtn {
	    height: 120px;
	    margin: 0 auto;
	    overflow: hidden;
	    width: 150px;
	    font-size: 2em;
	}

	.slidebtn a {
	  color: white;
	  text-decoration: none;
	  text-align: center;
	  display: block; /* important */
	}

	.slidebtn, 
	.firstText, 
	.secondText {
	  -webkit-transition: 0.3s;
	  -moz-transition: 0.3s;
	  -ms-transition: 0.3s;
	  -o-transition: 0.3s;
	  transition: 0.3s;     
	}

	.firstText { transform: translate3d(0, 0, 0); }
	.slidebtn:hover .firstText { transform: translate3d(0, -5px, 0); }
	#gofurther .slidebtn:hover .firstText { transform: translate3d(0, -10px, 0); }

	.secondText { transform: translate3d(0, 50px, 0); font-size: 20px; }
	.slidebtn:hover .secondText { transform: translate3d(0, -7px, 0); }
	#gofurther .slidebtn:hover .secondText { transform: translate3d(0, -17px, 0); }


	header, footer {
		position: fixed;
		z-index: 9999;
		top: 0;
		left: 0;
	}

	header {
		width: 100%;
		text-align: left;
	}

	header nav {
		position: fixed;
		top: 20px;
		left: 20px;
		font-size: 2.5em;
		font-weight: 400;
		font-style: italic;
	}

	header nav div { cursor: pointer; color: #fff; }

	header nav li a { color: #01AEF2; } 
	header nav ul li { opacity: 0; }

	header nav:hover + ul > li:nth-child(2) ,
	header nav ul:hover > li:nth-child(2),
	header nav:hover + ul > li:nth-child(3),
	header nav ul:hover > li:nth-child(3),
	header nav:hover + ul > li:nth-child(4),
	header nav ul:hover > li:nth-child(4),
	header nav:hover + ul > li:nth-child(5),
	header nav ul:hover > li:nth-child(5),
	header nav:hover + ul > li:nth-child(6),
	header nav ul:hover > li:nth-child(6) {
	    -webkit-animation: SideSlideIn .7s ease-in-out;
	    animation: SideSlideIn .7s ease-in-out; 
	    animation-fill-mode: forwards;
	}

	header nav:hover + ul > li:nth-child(2),
	header nav ul:hover > li:nth-child(2) {
	    animation-delay: 0.1s;
	}

	header nav:hover + ul > li:nth-child(3),
	header nav ul:hover > li:nth-child(3) {
	    animation-delay: 0.2s;
	}

	header nav:hover + ul > li:nth-child(4),
	header nav ul:hover > li:nth-child(4) {
	    animation-delay: 0.3s;
	}

	header nav:hover + ul > li:nth-child(5),
	header nav ul:hover > li:nth-child(5) {
	    animation-delay: 0.4s;
	}

	header nav:hover + ul > li:nth-child(6),
	header nav ul:hover > li:nth-child(6) {
	    animation-delay: 0.5s;
	}

	footer #socialism { position: fixed; bottom: 20px; left: 20px }

	footer #socialism li { opacity: 0; display: inline-block; }

	footer #socialism li:nth-child(1),
	footer #socialism li:nth-child(2),
	footer #socialism li:nth-child(5),
	footer #socialism li:nth-child(6) {
		-webkit-animation: slideIn .7s ease-in-out;
	    animation: slideIn .7s ease-in-out;
	    animation-fill-mode: forwards;
	}

	footer #socialism li:nth-child(2) { animation-delay: 0.1s; }
	footer #socialism li:nth-child(5) { animation-delay: 0.2s; }
	footer #socialism li:nth-child(6) { animation-delay: 0.3s; }


/*
	#fullpage article ul {
		font-size: 2.5em;
		position: absolute;
		top: 5vh;
		left: 70vw;
		height: 90vh;
		padding-left: 5vw;
		text-align: center;
		display: block;
	} */

	#fullpage article ul {
	    display: block;
	    font-size: 2.5em;
	    height: auto;
	    left: 0;
	    position: absolute;
	    text-align: center;
	    top: 50vh; /* -1vh */
	    width: 100vw;
	}

	#fullpage article ul li { padding: 10px; display: inline-block; }
	#fullpage article ul li:first-child { padding-top: 0; }

	/* fullpage control buttons */
 	#fullpage article ul li:nth-child(1),
	#fullpage article ul li:nth-child(2),
	#fullpage article ul li:nth-child(3),
	#fullpage article ul li:nth-child(4) { opacity: 0; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8); }

	#fullpage article a:hover + ul > li:nth-child(1),
	#fullpage article ul:hover > li:nth-child(1),
	#fullpage article .playground:hover + ul > li:nth-child(1),
	#fullpage article a:hover + ul > li:nth-child(2),
	#fullpage article ul:hover > li:nth-child(2),
	#fullpage article .playground:hover + ul > li:nth-child(2),
	#fullpage article a:hover + ul > li:nth-child(3),
	#fullpage article ul:hover > li:nth-child(3),
	#fullpage article .playground:hover + ul > li:nth-child(3),
	#fullpage article a:hover + ul > li:nth-child(4),
	#fullpage article ul:hover > li:nth-child(4),
	#fullpage article .playground:hover + ul > li:nth-child(4) {
	    -webkit-animation: slide-fade-in .7s ease-in-out;
	    animation: slide-fade-in .7s ease-in-out; 
	    animation-fill-mode: forwards;
	}

	#fullpage article a:hover + ul > li:nth-child(2),
	#fullpage article ul:hover > li:nth-child(2),
	#fullpage article .playground:hover + ul > li:nth-child(2) {
	    animation-delay: 0.1s;
	}

	#fullpage article a:hover + ul > li:nth-child(3),
	#fullpage article ul:hover > li:nth-child(3),
	#fullpage article .playground:hover + ul > li:nth-child(3) {
	    animation-delay: 0.2s;
	}

	#fullpage article a:hover + ul > li:nth-child(4),
	#fullpage article ul:hover > li:nth-child(4),
	#fullpage article .playground:hover + ul > li:nth-child(4) {
	    animation-delay: 0.3s;
	}

	/* navigation dots */
	#fp-nav { position: fixed; z-index: 100; margin-top: -32px; top: 50%; opacity: 1; -webkit-transform: translate3d(0,0,0); }

	#fp-nav.right { right: 17px; }
	#fp-nav.left { left: 17px; }
	.fp-slidesNav{ position: absolute; z-index: 4; left: 50%; opacity: 1; }
	.fp-slidesNav.bottom { bottom: 17px; }
	.fp-slidesNav.top { top: 17px; }
	#fp-nav ul, .fp-slidesNav ul { margin: 0; padding: 0; }
	#fp-nav ul li, .fp-slidesNav ul li { display: block; width: 14px; height: 13px; margin: 7px; position:relative; }
	.fp-slidesNav ul li { display: inline-block; }

	#fp-nav ul li a, .fp-slidesNav ul li a {
	    display: block;
	    position: relative;
	    z-index: 1;
	    width: 100%;
	    height: 100%;
	    cursor: pointer;
	    text-decoration: none;
	}

	#fp-nav ul li a.active span,
	.fp-slidesNav ul li a.active span,
	#fp-nav ul li:hover a.active span,
	.fp-slidesNav ul li:hover a.active span {
	    height: 12px;
	    width: 12px;
	    margin: -6px 0 0 -6px;
	    border-radius: 100%;
	 }

	#fp-nav ul li a span,
	.fp-slidesNav ul li a span {
	    border-radius: 50%;
	    position: absolute;
	    z-index: 1;
	    height: 4px;
	    width: 4px;
	    border: 0;
	    background: #F4F4F4;
	    left: 50%;
	    top: 50%;
	    margin: -2px 0 0 -2px;
	    -webkit-transition: all 0.1s ease-in-out;
	    -moz-transition: all 0.1s ease-in-out;
	    -o-transition: all 0.1s ease-in-out;
	    transition: all 0.1s ease-in-out;
	}

	#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span{ width: 10px; height: 10px; margin: -5px 0px 0px -5px; }

	#fp-nav ul li .fp-tooltip {
	    position: absolute;
	    top: -2px;
	    color: #F4F4F4;
	    font-size: 14px;
	    font-family: arial, helvetica, sans-serif;
	    white-space: nowrap;
	    max-width: 220px;
	    overflow: hidden;
	    display: block;
	    opacity: 0;
	    width: 0;
	}

	#fp-nav ul li:hover .fp-tooltip, #fp-nav.fp-show-active a.active + .fp-tooltip {
	    -webkit-transition: opacity 0.2s ease-in;
	    transition: opacity 0.2s ease-in;
	    width: auto;
	    opacity: 1;
	}

	#fp-nav ul li .fp-tooltip.right { right: 20px; }
	#fp-nav ul li .fp-tooltip.left { left: 20px; }


	#fp-nav ul li:first-child a,
	#fp-nav ul li:last-child a { visibility: hidden; }

	#fp-nav ul > li:first-child a:after {
		font-family: 'FontAwesome';
		content: "\f015";
		visibility: visible;
		color: #F4F4F4;
	}

	#fp-nav ul > li:last-child a:after {
		font-family: 'FontAwesome';
		content: "\f067";
		visibility: visible;
		color: #F4F4F4;
	}

	#fp-nav ul > li:first-child a:active:after, 
	#fp-nav ul > li:last-child a:active:after { color: #F4F4F4; }

/* arrow scroll down */
	[data-moveDownicon]:before { font-weight: normal; content: attr(moveDownicon); }

	.moveDownarrow {
	  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2hldnJvbl90aGluX2Rvd24iIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiBmaWxsPSJ3aGl0ZSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTE3LjQxOCw2LjEwOWMwLjI3Mi0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwYzAuMjcsMC4yNjgsMC4yNzEsMC43MDEsMCwwLjk2OWwtNy45MDgsNy44M2MtMC4yNywwLjI2OC0wLjcwNywwLjI2OC0wLjk3OSwwbC03LjkwOC03LjgzYy0wLjI3LTAuMjY4LTAuMjctMC43MDEsMC0wLjk2OWMwLjI3MS0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwTDEwLDEzLjI1TDE3LjQxOCw2LjEwOXoiLz48L3N2Zz4=);
	  background-size: contain;
	  background-repeat: no-repeat;
	}

	.moveDownlink {
	  cursor: pointer;
	  height: 60px;
	  width: 80px;
	  margin: 0px 0 0 -40px;
	  line-height: 60px;
	  position: absolute;
	  left: 50%;
	  bottom: 0px;
	  color: #FFF;
	  text-align: center;
	  font-size: 70px;
	  z-index: 100;
	  text-decoration: none;
	  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
	  -webkit-animation: moveDown 2s ease-in-out infinite;
	  -moz-animation: moveDown 2s ease-in-out infinite;
	  animation: moveDown 2s ease-in-out infinite;
	}

	#loading {
	    background: rgba(245, 245, 245, 1);
	    bottom: 0;
	    height: 100vh;
	    left: 0;
	    position: fixed;
	    right: 0;
	    top: 0;
	    width: 100vw;
	    z-index: 99999999;
	}

	#loader { position: relative; text-align: center; top: 40vh; }

	.sbloogo { -webkit-animation: bounce 1s infinite; animation: bounce 1s infinite; }

	.shadow {
		width: 50px;
		height: 5px;
		border-radius: 50%;
		background-color: rgba(0,0,0,.4);
		margin: 0 auto;
		-webkit-animation: bounceshadow 1s infinite;
				animation: bounceshadow 1s infinite;
	}

	.xlink { font-size: 3em; }

	.xquote { padding-bottom: 150px; }
	.xquote h1 { font-size: 3em; font-style: italic; font-family: Georgia, "Times New Roman", sans-serif }
	.xquote cite { font-size: 1.5em; }

	.xtext h1 { font-size: 3em; }
	.xtext div { font-size: 14px; }

	.xphotoset {
		box-shadow: 
				1px 1px 0px #fff,
                2px 2px 0px rgba(0,0,0,1),
                3px 3px 0px #fff,
                4px 4px 0px rgba(0,0,0,1),
                5px 5px 0px #fff,
                6px 6px 0px rgba(0,0,0,1);
	}

	/* Single Page */
	#single { background-color: #232323; color: #fff; }

	#single img,
	#single .playground {
		max-width: 100vw;
		max-height: 95vh;
		border-radius: 5px;
	}

	#single .post { padding: 20px 0 0; }

	#single #logo svg {
		width: 150px;
		margin: 10px auto;
		text-align: center;
	}

	#single .description {
    	font-family: "Times New Roman",TimesNewRoman,Times,Georgia,serif;
    	font-size: 1rem;
    	letter-spacing: 0.5px;
    	line-height: 1.4;
    	margin: 30px auto 0;
    	max-width: 415px;
    	text-align: center;
    	width: 88%;
	}

	#single #more {
    	color: #aaa;
    	font-size: 2em;
    	padding: 20px;
	}

	#single #meta { margin: 0 auto 20px; }
	
	#single #meta li {
		display: inline-block;
		padding: 20px;
		font-size: 1em;
		border: 1px solid #333;
		border-left: none;
		margin: 30px 0;
	}

	#single #meta li:first-child { border-left: 1px solid #333; }

	#single #meta .fa { margin-right: 5px; }


	#single #share { margin: 30px 0; }

	#single #share li {
		display: inline-block;
		padding: 20px;
		font-size: 2em;
		border: 1px solid #333;
		border-left: none;
	}

	#single #share li:first-child { border-left: 1px solid #333; }

	#single #notes {
	    background-color: #333;
	    border: 1px solid #444;
	    color: #666;
	    display: inline-block;
	    font-size: 2em;
	    height: 80px;
	    margin: 30px auto;
	    overflow: hidden;
	    padding: 27px 0;
	    text-align: center;
	    width: 80px;
	}

	#single #likeityo li { display: inline-block; }

	#single #likeityo #like, 
	#single #likeityo #reblog {
	    font-size: 20px;
	    height: 30px;
	    padding: 0 30px;
	    vertical-align: calc(60px);
	}

	#single #likeityo #reblog {
    	display: inline-flex;
    	font-size: 23px;
    	padding: 0 20px;
	}

	#single .xtext {
		width: 666px;
		margin: 0 auto;
		text-align: left;
		padding: 50px 0;
	}

	#single .xquote {
		margin: 50px auto;

		max-width: 100vw;
		max-height: 95vh;
		border-radius: 5px;
		padding: 25vh 0;
	}

	.tvision {
		position: relative;
		width: 750px;
		background: #333;
		border-radius: 4px;
		padding: 20px;
		color: rgba(0,0,0, .8);
		text-shadow: 0 1px 0 #fff;
		line-height: 1.5;
		margin: 60px auto;
	}

	.twision {
		width: 750px;
		background: #333;
		border-radius: 4px;
		padding: 20px;
		text-shadow: 0 1px 0 #fff;
		margin: 0 auto;
		box-shadow: 0 7px 1px rgba(0,0,0,.5);
	}


	.tvision:before, 
	.tvision:after {
		z-index: -3;
		position: absolute; 
		content: "";
		bottom: 15px;
		left: 10px;
		width: 50%; 
		top: 80%;
		max-width:300px;
		background: rgba(0, 0, 0, 0.7); 
		box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
		transform: rotate(-3deg);
	}

	.tvision:after {
		transform: rotate(3deg);
		right: 10px;
		left: auto;
	}

	#shortcutshow {
		position: fixed;
		bottom: 20px;
		right: 20px;
		font-size: 1em;
		color: wheat;
		cursor: pointer;
	}

	#shortcutshow span { vertical-align: super; }

	#shortcutshow .fa { font-size: 2em; }

	.keyboardshortcuts {
		background: #181818;
		display: none;
		color: wheat;
	 	font-family: 'PT Sans', sans-serif;
		font-size: 15px;
		-webkit-font-smoothing: antialiased;

		position: fixed;
		width: 100vw;
		height: 100vh;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}

	.key-wrapper { position: relative; top: 15vh; left: 50vh; }

	.key-wrapper h3 {
		font-size: 2em;
  		text-align: left;
		margin-bottom: 40px;
		color: wheat;
	}

	.row {text-align: left;}

	.key {
	  margin: 3px 1px;
	  width: 50px;
	  height: 50px;
	  border: 2px solid #333;
	  border-radius: 5px;
	  display: inline-block;

	  line-height: 52px;
	  text-align: center;
	  text-transform: uppercase;
	}

	.k32 { width: 127px; }

/* animations */
	.slide-fade-in {
	    -webkit-animation: slide-fade-in 1s ease;
	    -o-animation: slide-fade-in 1s ease;
	    -ms-animation: slide-fade-in 1s ease;
	    -moz-animation: slide-fade-in 1s ease;
	    animation: slide-fade-in 1s ease;
	}

	#logofooter {
	    animation-fill-mode: forwards;
	    left: 50%;
	    margin: 0 auto;
	    opacity: 0;
	    display: none;
	    position: fixed;
	    text-align: center;
	    bottom: 20px;
	    transform: translate3d(-50%, -5%, 0);
	    width: 150px;
	}

	.jumpin {
		-webkit-animation: slideMeIn 1s ease;
	    animation: slideMeIn 1s ease;
	    display: block!important;
	}

	/* slide fade in */
	@keyframes slide-fade-in {
	    0% { opacity: 0; transform: translate3d(0, 50px, 0); }
	    100% { opacity: 1; transform: translate(0, 0, 0);  }
	}

	@keyframes slideIn {
	    0% { opacity: 0; transform: translate3d(0, 150px, 0); }
	    100% { opacity: 1; transform: translate(0, 0, 0);  }
	}

	@keyframes slideMeIn {
	    0% { opacity: 0; transform: translate3d(-50%, 150px, 0); }
	    100% { opacity: 1; transform: translate(0, 0, 0);  }
	}

	@keyframes SideSlideIn {
	    0% { opacity: 0; transform: translate3d(-150px, 0, 0); }
	    100% { opacity: 1; transform: translate(0, 0, 0);  }
	}

	/* arrow Srcroll Down */
	@keyframes moveDown {
	  0% { transform: translate(0, -20px); opacity: 0; }
	  50% { opacity: 1; }
	  100% { transform: translate(0, 10px); opacity: 0; }
	}

	/* loader */
	@keyframes bounceshadow {
	  0%, 20%, 50%, 80%, 100% { width: 50px; }
	  40% { width: 20px; }
	  60% { width: 30px; }
	}

	@keyframes bounce {
	  0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
	  40% { transform: translateY(-50px); }
	  60% { transform: translateY(-10px); }
	}