@charset "UTF-8";
/* CI4DJ Parts - CSS for Mobile */

@media (max-width: 767px){

	#cookie-law .cookie-info-box{
		width: 90vw;
	}

	#cookie-law .cookie-info-box a.cookie-info-button{
		font-size: 13px;
	}
	
	.push-top{
		position: relative;
		display: block;
		width: 100vw;
		height: 70px;
		background-color: rgba(0,0,0,0);
		opacity: 0;
	}
	
	.header{
		position: fixed;
		display: block;
		width: 100vw;
		height: 70px;
		top: 0;
		left: 0;
		border: none;
		border-bottom: 1px solid rgb(139,139,139);
		background-color: rgba(33,33,33,0.9);
		backdrop-filter: none;
		z-index: 888;
	}
	
	.header .logo{
		position: absolute;
		display: block;
		width: auto;
		height: 40px;
		padding: 0;
		border-right: none;
		top: 15px;
		left: 15px;
	}

	.header .logo .img{
		position: relative;
		display: block;
		width: auto;
		height: 40px;
	}

	.header .logo .img svg{
		position: relative;
		display: block;
		width: auto;
		height: 100%;
	}
	
	.header .navigate{
		position: absolute;
		display: none;
		width: auto;
		height: 100%;
		padding: 20px 60px 20px 60px;
		top: 0;
		right: 0;
		/*border-left: 1px solid rgb(139,139,139);*/
	}

	.m-toggle{
		position: fixed;
		display: block;
		width: 45px;
		height: 27px;
		right: 15px;
		top: 21.5px;
		transform: none;
		z-index: 998;
	}
	
	.burger-menu ul{
		position: absolute;
		display: block;
		width: auto;
		height: auto;
		top: 180px;
		right: 30px;
		z-index: 997;
		margin: 0;
		padding: 0;
	}
	
	.footer{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 60px 30px 60px 30px;
		background-color: rgb(33,33,33);
		z-index: 556;
	}

	.footer .main{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}

	.footer .main .logo{
		position: relative;
		display: block;
		width: auto;
		height: 45px;
		margin: 0 0 60px 0;
	}

	.footer .main .logo svg{
		position: relative;
		display: block;
		width: auto;
		height: 100%;
	}

	.footer .main .links{
		position: relative;
		display: block;
		width: auto;
		height: auto;
		margin: 0 0 30px 0;
	}

	.footer .main .links ul{
		position: relative;
		display: block;
		width: auto;
		height: auto;
		padding: 0;
		margin: 0;
	}

	.footer .main .links ul li{
		position: relative;
		display: inline-block;
		width: auto;
		height: auto;
		margin: 0 15px 10px 0;
	}

	.footer .main .links ul li a{
		position: relative;
		display: block;
		width: auto;
		height: auto;
		font-size: 12px;
		font-weight: 300;
		text-transform: uppercase;
		text-decoration: none;
		color: rgb(139,139,139);
		padding: 0 15px 0 0;
		border-right: 1px solid rgb(139,139,139);
		transition: all .2s ease;
	}

	.footer .main .links ul li:last-child a{
		border-right: none;
	}

	.footer .main .links ul li a:hover{
		color: rgb(255,255,255);
	}

	.footer .main .social-icons{
		position: relative;
		display: block;
		width: auto;
		height: 50px;
		bottom: 0;
		right: 0;
	}

	.footer .main .social-icons ul{
		position: relative;
		display: block;
		width: auto;
		height: 50px;
		padding: 0;
		margin: 0;
	}

	.footer .main .social-icons ul li{
		position: relative;
		display: inline-block;
		width: 50px;
		height: 50px;
		margin: 0 15px 0 0;
	}

	.footer .main .social-icons ul li a{
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
	}

	.footer .main .social-icons ul li a img{
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}

	.footer .main .social-icons ul li a img#facebook{
		transform: rotate(180deg);
		animation: animfacebook 4s infinite linear;
	}

	@keyframes animfacebook {
		from {transform: rotate(180deg);}
		to {transform: rotate(539deg);}
	}

	.footer .main .social-icons ul li a img#instagram{
		transform: rotate(0deg);
		animation: animinstagram 4s infinite linear;
	}

	@keyframes animinstagram {
		from {transform: rotate(0deg);}
		to {transform: rotate(359deg);}
	}

	.footer .main .social-icons ul li a img#youtube{
		transform: rotate(-90deg);
		animation: animyoutube 4s infinite linear;
	}

	@keyframes animyoutube {
		from {transform: rotate(-90deg);}
		to {transform: rotate(269deg);}
	}

	.footer .main .social-icons ul li a svg{
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
}



