
/* -------------------------------------------------- */
/*	OVERRIDES
/* -------------------------------------------------- */

article {
	text-align: center;
}

section.color article,
section.background article {
	max-width: 400px;
	margin: auto;
}

section#projects h2 {
	margin: 0 auto;
}

/*
section#projects.carousel button.prev {
	left: calc(15px + var(--menu-width));
}
*/

/*
section#projects.carousel .list,
section#projects.carousel nav {
	padding-left: calc(-15px + var(--menu-width));
}
*/

section#projects.carousel button.prev {
	left: calc(15px + var(--menu-width));
}

/* -------------------------------------------------- */
/*	BACKGROUND
/* -------------------------------------------------- */

/*
section#model.background {
	background-image: url("/content/background/model");
	background-repeat: no-repeat;

	-webkit-background-position: center;
	   -moz-background-position: center;
	     -o-background-position: center;
	    -ms-background-position: center;
	        background-position: center;

	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
	    -ms-background-size: cover;
	        background-size: cover;
}
*/

section#posts.background {
	background-image: url("/content/background/code");
	background-repeat: no-repeat;

	-webkit-background-position: 67% 50%;
	   -moz-background-position: 67% 50%;
	     -o-background-position: 67% 50%;
	    -ms-background-position: 67% 50%;
	        background-position: 67% 50%;

	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
	    -ms-background-size: cover;
	        background-size: cover;
}

section#demo.background {
	background-image: url("/content/background/demo");
	background-repeat: repeat;

	-webkit-background-position: center;
	   -moz-background-position: center;
	     -o-background-position: center;
	    -ms-background-position: center;
	        background-position: center;

	-webkit-background-size: contain;
	   -moz-background-size: contain;
	     -o-background-size: contain;
	    -ms-background-size: contain;
	        background-size: contain;
}

/* -------------------------------------------------- */
/*	PROJECTS
/* -------------------------------------------------- */

section#projects .list > * > * {
	width: 100%;
	margin-bottom: 10px;
	text-align: center;
}

section#projects .thumb:before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	background-image: url("/content/svg/lock");
	background-repeat: no-repeat;

	-webkit-background-position: center;
	   -moz-background-position: center;
	     -o-background-position: center;
	    -ms-background-position: center;
	        background-position: center;

	-webkit-background-size: 15%;
	   -moz-background-size: 15%;
	     -o-background-size: 15%;
	    -ms-background-size: 15%;
	        background-size: 15%;

	filter:
		invert(44%)
		sepia(11%)
		saturate(2757%)
		hue-rotate(238deg)
		brightness(93%)
		contrast(90%);
}

section#projects .thumb .icon {
	position: absolute;
	top: 0;
	left: 0;

	width: calc(100% - 64px);
	height: calc(100% - 64px);

	margin: 32px;

	background-repeat: no-repeat;

	-webkit-background-position: center;
	   -moz-background-position: center;
	     -o-background-position: center;
	    -ms-background-position: center;
	        background-position: center;

	-webkit-background-size: contain;
	   -moz-background-size: contain;
	     -o-background-size: contain;
	    -ms-background-size: contain;
	        background-size: contain;
}
