/*
Theme Name: Akimm Uncode
Description: Child theme for Uncode theme
Author: Akimm
Author URI: https://www.akimm.be
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/


/* ================================================================================ */
/* COLORS  */
/* -------------------------------------------------------------------------------- */
/* Paint / Pro:		#ED1C24 */
/* Style:			#A29061 */
/* Color:			#6BC7BC */
/* Design:			#858CC5 */



/* ================================================================================ */
/* SISTER LINKS ON MOBILE */
/* -------------------------------------------------------------------------------- */
#menu-secondarymenu-1 li:nth-last-child(-n+4) .fa{
	display: none;
}
#menu-secondarymenu-1 li:nth-last-child(-n+4){
	display: block;
	width: fit-content;
	margin: 1em 0 0 0;
	padding: 0 1.2em 0 .8em;
	letter-spacing: 0.04em;
	transform: translateX(-55px) skewX(-34deg);
	transition: all .7s ease-in-out;
	border-radius: 1px;
}
#menu-secondarymenu-1 li:nth-last-child(4){
	margin-top: 2em;
}
#menu-secondarymenu-1 li:nth-last-child(-n+4) a, #menu-secondarymenu-1 li:nth-last-child(-n+4) a:hover, #menu-secondarymenu-1 li:nth-last-child(-n+4) a:visited, #menu-secondarymenu-1 li:nth-last-child(-n+4) a:active {
	display: inline-block;
	padding: 0 20px 0 65px;
	line-height: 2.6em;
	color: #fff;
	text-decoration: none;
	transform: skewX(34deg);
}
#menu-secondarymenu-1 li:nth-last-child(4) {
	background-color: #ED1C24;
}
#menu-secondarymenu-1 li:nth-last-child(3) {
	background-color: #A29061;
}
#menu-secondarymenu-1 li:nth-last-child(2) {
	background-color: #6BC7BC;
}
#menu-secondarymenu-1 li:nth-last-child(1) {
	background-color: #858CC5;
}


/* Hide items on desktop */
@media (min-width: 960px) {
	#menu-secondarymenu li:nth-last-child(-n+4){
		display: none;
	}
}



/* ================================================================================ */
/* SISTER LINKS ON DESKTOP */
/* -------------------------------------------------------------------------------- */
#sister-links {
	display: none;
}
@media (min-width: 960px) {
	#sister-links{
		display: flex;
		text-transform: uppercase;
		position: fixed;
		top: 220px;
		left: 50px;
		z-index: 5000;
		flex-direction: column;
		flex-wrap: wrap;
	}
	ul.sister-links {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	ul.sister-links li {
		position: relative;
		height: 30px;
		width: fit-content;
		margin: 0 0 10px 0;
		letter-spacing: 0.04em;
		transform: translateX(-100%) skewX(-34deg);
		transition: all .7s ease-in-out;
		display: block;
		border-radius: 1px;
		box-shadow: 2px 2px 4px rgba(0,0,0,.25);
	}
	ul.sister-links li a, ul.sister-links li a:hover, ul.sister-links li a:visited, ul.sister-links li a:active {
		display: inline-block;
		padding: 0 140px 0 65px;
		line-height: 30px;
		color: #fff;
		text-decoration: none;
		transform: skewX(34deg);
		transition: all .7s ease-in-out;
	}
	ul.sister-links li .stamp {
		margin: 0;
		position: absolute;
		top: -5px;
		right: 2px;
		transform: skewX(34deg) scale(0.75);
		transition: all .7s ease-in-out;
	}
	ul.sister-links li .stamp path {
		transition: all .5s ease-in-out .2s;
	}
	ul.sister-links li:hover {
		transform: translateX(-100px) skewX(-34deg);
	}
	ul.sister-links li:hover a, ul.sister-links li:hover a:hover, ul.sister-links li:hover a:visited, ul.sister-links li:hover a:active {
		padding-right: 20px;
	}
	ul.sister-links li:hover .stamp {
		right: -45px;
	}
	ul.sister-links li.krea-style {
		background-color: #A39160;
	}
	ul.sister-links li.krea-color {
		background-color: #6BC7BC;
	}
	ul.sister-links li.krea-projects {
		background-color: #ED1C24;
	}
	ul.sister-links li.krea-design {
		background-color: #858CC5;
	}
	ul.sister-links li svg.stamp path {
		fill: #fff;
	}
	ul.sister-links li.krea-style:hover svg.stamp path {
		fill: #A39160;
	}
	ul.sister-links li.krea-color:hover svg.stamp path {
		fill: #6BC7BC;
	}
	ul.sister-links li.krea-projects:hover svg.stamp path {
		fill: #ED1C24;
	}
	ul.sister-links li.krea-design:hover svg.stamp path {
		fill: #858CC5;
	}
}