@charset "utf-8";
/* CSS Document */
/**
 * Circular menu v2
 */
* { margin: 0; padding: 0; }
html { font: 100%/1.3 Century Gothic, Verdana, sans-serif; }
body { overflow: hidden; min-width: 20em; background:url(imagini/bg.png); background-repeat:repeat;}
.menuopt { display: none; }
.circle, .circle:before, .circle:after { border-radius: 50%; }
nav {
	margin: 5em auto;
	min-width: 16em; width: 50%; max-width: 40em;
}
nav ul {
	position: relative;
	padding: 50%;
	max-width: 0; max-height: 0;
	box-shadow: 0 0 .5em rgba(0,0,0,.5);
	list-style: none;
	background: white;
}
nav li {
	position: absolute;
	transition: 2s;
}
.slice {
	overflow: hidden;
	position: absolute;
	top: 0; left: 0;
	width: 50%; height: 50%;
	transform-origin: 100% 100%;
}
.unsel {
	top: 34%; left: 34%;
	width: 32%; height: 32%;
	box-shadow: 0 0 .75em;
	background:url(imagini/centru.png);
}
.chmdl { transform: skewX(50deg); }
.chtzl { transform: rotate(40deg) skewX(50deg); }
.prfch { transform: rotate(80deg) skewX(50deg); }
.rchch { transform: rotate(120deg) skewX(50deg); }
.siteael { transform: rotate(160deg) skewX(50deg); }
.soib { transform: rotate(-160deg) skewX(50deg); }
.substa { transform: rotate(-120deg) skewX(50deg); }
.substc { transform: rotate(-80deg) skewX(50deg); }
.substo { transform: rotate(-40deg) skewX(50deg); }
.magnifiable { height: 100%; }
nav label { cursor: pointer; }
.slice label {
	display: block;
	width: 200%; height: 200%;
	transform: skew(-50deg) rotate(-70deg);
	box-shadow: 0 0 .1em black;
	opacity: .5;
	color: transparent;
	font-size: .8em;
	line-height: 1.9;
	text-align: center;
	text-decoration: none;
	transition: 1s;
}
.slice label:before {
	position: absolute;
	top: 10%; left: 10%;
	width: 80%; height: 80%;
	border-radius: 50%;
	box-shadow: 0 0 1em rgba(0,0,0,.5);
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: 35% 35%;
	content: '';
}
.slice label:hover { opacity: 1; }
.dark label:hover { color: white; }
.light label:hover { color: black; }
.unsel label {
	display: block;
	height: 100%;
	background: radial-gradient(rgba(0,0,0,.5), transparent 50%);
}
.chmdl label, .ochmdl:checked ~ nav .unsel { background: #f4f5fa; }
.chtzl label, .ochtzl:checked ~ nav .unsel { background: #ffeb98; }
.prfch label, .oprfch:checked ~ nav .unsel { background: #ffb038; }
.rchch label, .orchch:checked ~ nav .unsel { background: #d3a573; }
.siteael label, .ositeael:checked ~ nav .unsel { background: #d9e260; }
.soib label, .osoib:checked ~ nav .unsel { background: #833a68; }
.substa label, .osubsta:checked ~ nav .unsel { background: #b1001d; }
.substc label, .osubstc:checked ~ nav .unsel { background: #ec0404; }
.substo label, .osubsto:checked ~ nav .unsel { background: #ef6982; }
.chmdl label:before { background-image: url(imagini/chmdl.png); background-size: auto; }
.chtzl label:before { background-image: url(imagini/chtzl.png); background-size: auto; }
.prfch label:before { background-image: url(imagini/prfch2.jpg); background-size: auto;  }
.rchch label:before { background-image: url(imagini/rchch.jpg); background-size: auto;}
.siteael label:before { background-image: url(imagini/siteael2.png); background-size: auto; }
.soib label:before { background-image: url(imagini/soib.jpg); background-size: auto;}
.substa label:before { background-image: url(imagini/substa.png); background-size: auto;}
.substc label:before { background-image: url(imagini/substc.png); background-size: auto;}
.substo label:before { background-image: url(imagini/substo.jpg); background-size: auto;}
.slice label:hover:after { opacity: 0; }
.ochmdl:checked ~ nav .chmdl { transform: skewX(50deg) scale(1.25); }
.ochtzl:checked ~ nav .chtzl { transform: rotate(40deg) skewX(50deg) scale(1.25); }
.oprfch:checked ~ nav .prfch { transform: rotate(80deg) skewX(50deg) scale(1.25); }
.orchch:checked ~ nav .rchch { transform: rotate(120deg) skewX(50deg) scale(1.25); }
.ositeael:checked ~ nav .siteael { transform: rotate(160deg) skewX(50deg) scale(1.25); }
.osoib:checked ~ nav .soib { transform: rotate(-160deg) skewX(50deg) scale(1.25); }
.osubsta:checked ~ nav .substa { transform: rotate(-120deg) skewX(50deg) scale(1.25); }
.osubstc:checked ~ nav .substc { transform: rotate(-80deg) skewX(50deg) scale(1.25); }
.osubsto:checked ~ nav .substo { transform: rotate(-40deg) skewX(50deg) scale(1.25); }
.ochmdl:checked ~ nav .chmdl label, 
.ochtzl:checked ~ nav .chtzl label, 
.oprfch:checked ~ nav .prfch label, 
.orchch:checked ~ nav .rchch label, 
.ositeael:checked ~ nav .siteael label, 
.osubsto:checked ~ nav .substo label {
	box-shadow: 0 0 .45em rgba(0,0,0,.5);
	opacity: 1; color: black;
}
.osoib:checked ~ nav .soib label , 
.osubsta:checked ~ nav .substa label, 
.osubstc:checked ~ nav .substc label {
	box-shadow: 0 0 .45em rgba(0,0,0,.5);
	opacity: 1; color: white;
}
@media (min-width: 25em) { .slice label { font-size: 1em; line-height: 2.3; } }
@media (min-width: 35em) { .slice label { font-weight: 700; line-height: 2.7; } }