@CHARSET "UTF-8";

/* ----- MENU ELEMENT ----- */
#kr3m .kr3m-elem.menu {
	position: relative;
	width: 120px;
	height: 120px;

	box-shadow: none;
	font-size: 16px;
	color: #b80000;
	
	background: #fff url("../img/menu-spritesheet.png") no-repeat;
	background-position: 0 0;
}

	#kr3m .kr3m-elem.menu.m1 { background-position: -126px 0; }
	#kr3m .kr3m-elem.menu.m1.active { background-position: -126px -120px; }
	#kr3m .kr3m-elem.menu.m2 { background-position: -252px 0; }
	#kr3m .kr3m-elem.menu.m2.active { background-position: -252px -120px; }
	#kr3m .kr3m-elem.menu.m3 { background-position: -378px 0; }
	#kr3m .kr3m-elem.menu.m3.active { background-position: -378px -120px; }
	#kr3m .kr3m-elem.menu.m4 { background-position: -504px 0; }
	#kr3m .kr3m-elem.menu.m4.active { background-position: -504px -120px; }
	#kr3m .kr3m-elem.menu.m5 { background-position: -630px 0; }
	#kr3m .kr3m-elem.menu.m5.active { background-position: -630px -120px; }
		
	#kr3m .kr3m-elem.menu > span {
		position: absolute;
		left: 12px;
		bottom: 8px;
	}

		#kr3m .kr3m-elem.menu.m0 > span {
			visibility: hidden;
		}

	#kr3m .kr3m-elem.menu > a {
		display: inline-block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	
		border: 0px #db7f7f solid;
	
		transition: all 0.2s ease;
	}

		#kr3m .kr3m-elem.menu > a:hover,
		#kr3m .kr3m-elem.menu > a:focus,
		#kr3m .kr3m-elem.menu > a.active {
			border-width: 6px;
		}

		#kr3m .kr3m-elem.menu.m0 > a {
			border-width: 0px;
		}

	#kr3m .kr3m-elem.menu.active {
		color: #FFF;
		background-color: #b80000;
	}

		#kr3m .kr3m-elem.menu.active > a {
			border-width: 6px;
			border-color: #fff;
		}


/* ----- SOCIAL-MEDIA ELEMENT ----- */
#kr3m .kr3m-elem.socialmedia {		
	margin: 0 -6px -6px 0;
	width: 126px;
	height: 126px;
	
	background-color: transparent;
	box-shadow: none;
}

	#kr3m .kr3m-elem.socialmedia > a {
		display: block;
		float: left;
		margin: 0 6px 6px 0;
		width: 57px;
		height: 57px;

		background: transparent url("../img/menu-spritesheet.png") no-repeat;
		box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.25);
	}

	#kr3m .kr3m-elem.socialmedia > a.facebook { background-position: -756px 0; }
	#kr3m .kr3m-elem.socialmedia > a.twitter { background-position: -819px 0; }
	#kr3m .kr3m-elem.socialmedia > a.gplus { background-position: -756px -63px; }
	#kr3m .kr3m-elem.socialmedia > a.news { background-position: -819px -63px; }


/* ----- TEXT ELEMENT ----- */
#kr3m .kr3m-elem.text {
			
}

	#kr3m .kr3m-elem.text a {
		text-decoration: underline;
	}


/* ----- IMAGE ELEMENT ----- */
#kr3m .kr3m-elem.image {
	background-image: url("../img/loader-redbg.gif");
	background-position: center center;
	background-repeat: no-repeat;
}

	#kr3m .kr3m-elem.image.no-loader {
		background-image: none;	
	}

	#kr3m .kr3m-elem.image .image {
		display: inline-block;
		width: 100%;
		height: 100%;
		
		background-position: center center;
		background-repeat: no-repeat;
		box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.25);
	}


/* ----- ROTATION ELEMENT ----- */	
#kr3m .kr3m-elem.rotation {
	position: relative;
	
	background-color: transparent;
	box-shadow: none;
}

	#kr3m .kr3m-elem.rotation .state {
		position: absolute;
		display: none;
		
		backface-visibility: hidden;
		outline: 1px solid transparent;
	}
	
	#kr3m .kr3m-elem.rotation .state:first-child {
		display: block;
	}
	
	#kr3m .kr3m-elem.rotation.cuberotate-hover .state {	
		cursor: pointer;
	}


/* ----- ROTATIONCONTROL ELEMENT ----- */
#kr3m .kr3m-elem.rotationcontrol {
	position: relative;
	margin: 0 -6px -6px 0;
	
	background-color: transparent;
	box-shadow: none;
}

	#kr3m .kr3m-elem.rotationcontrol .control {
		margin: 0 6px 6px 0;
		float: left;
		
		cursor: pointer;
	}

	/* Hacky, but meh... */
	#kr3m .kr3m-elem.rotationcontrol.w1 { width: 63px; }
	#kr3m .kr3m-elem.rotationcontrol.w2 { width: 126px; }
	#kr3m .kr3m-elem.rotationcontrol.w3 { width: 189px; }
	#kr3m .kr3m-elem.rotationcontrol.w4 { width: 252px; }
	#kr3m .kr3m-elem.rotationcontrol.w5 { width: 315px; }
	#kr3m .kr3m-elem.rotationcontrol.w6 { width: 378px; }
	#kr3m .kr3m-elem.rotationcontrol.w7 { width: 441px; }
	#kr3m .kr3m-elem.rotationcontrol.w8 { width: 504px; }


/* ----- CONTACTFORM ELEMENT ----- */
#kr3m .kr3m-elem.contactform {
	
}

	#kr3m .kr3m-elem.contactform form {
		/*padding: 0 4px;*/ 
	}

	#kr3m .kr3m-elem.contactform .formelem {
		padding: 6px 0 0 6px;
		min-width: 240px;
		min-height: 30px;
	}


/* ----- DOWNLOAD ELEMENT ----- */
#kr3m .kr3m-elem.download {
	
}

	#kr3m .kr3m-elem.download .icon {
		float: left;
		margin: 4px;
		margin-right: 8px;
		width: 48px;
		height: 48px;

		background-position: 0 0;
	}

		#kr3m .kr3m-elem.download .icon > div {
			width: 100%;
			height: 100%;
			opacity: 0;
			
			background-position: -48px 0;

			transition: opacity 0.2s ease;	
		}
	
			#kr3m .kr3m-elem.download:hover .icon > div {
				opacity: 1;
			}
		
		#kr3m .kr3m-elem.download .icon.pdf,
		#kr3m .kr3m-elem.download .icon.pdf > div {
			background-image: url("../img/icon-pdfdownload.png");
		}

	#kr3m .kr3m-elem.download a {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}	
	
	#kr3m .kr3m-elem.download h1,
	#kr3m .kr3m-elem.download h2,
	#kr3m .kr3m-elem.download h3 { padding-bottom: 0px; margin-bottom: -6px; }
