@media screen {

	/* cookie bar codefog/contao-cookiebar */
	.cookiebar {
		background: var(--theme-color1) !important;
		color: #fff !important;
		z-index: 2;
		position: fixed;
		right: 0;
		bottom: 20px;
		left: 20px;
		width: calc(100% - 20 * 2px);
		box-sizing: border-box;
		filter: drop-shadow(0px 6px 20px rgba(0, 0, 0, 0.4));
	}

	.cookiebar--active{
		display: block !important;
	}

	#cookiebar-text {
		margin: 1rem auto;
		font-size: 1em;
		text-align: left;
	}
	
	.cookiebar__message {
		margin: 0;
	}

	#cookiebar-text a{
		color: #fff !important;
		text-decoration: none !important;
	}


	/* 
	 * Button style is applied from link-button, navigation.css.
	 *
	/* .cookiebar__button,
	.cookiebar button,
	.cookiebar button.big-btn {
		float: right;
		width: auto;
		color: #fff;
		border-radius: 0;
		text-transform: uppercase;
		font-size: 0.95rem;
		font-weight: 700;
		background-color: var(--theme-color1);
	}
	.cookiebar__button:hover,
	.cookiebar button:hover {
		color: #000;
		background-color: var(--theme-color1);
	} */

	.cookbar_wrap {
		margin: 30px 0 5px;
		text-align: center;
	}

	#cookie_close {
		position: absolute;
		top: 0.5rem;
		right: 0.5rem;
		width: 1.5rem;
		height: 1.5rem;
		cursor: pointer;
		display: none;
	}
	
	#cookie_close::after {
		content: '✕';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		display: inline-block;
		font-size: 1rem;
		line-height: 1;
	}
}



/* Media Query
---------------------*/

/* Mobile-landscape (and larger) lansacape */
@media only screen and (min-width: 480px) {
}


/* min-width:768px Tablet-portrait (and larger) */
@media only screen and (min-width: 768px) {
	.cookiebar {
		bottom: 40px;
		left: 40px;
		width: calc(100% - 40 * 2px);
	}	
	
	.cookbar_wrap {
		display: flex;
		align-items: center;
		margin: 20px 0 5px;
	}

	.cookbar_wrap button {
		margin: 0;
	}
}


/* Tablet-landscape (and larger) for width 960px */
@media only screen and (min-width: 992px) {
}

/* min-width:1100 */
@media only screen and (min-width:1100px) {
}

/* min-width:1300 Laptops (and langer) for width 1200px */
@media only screen and (min-width:1300px) {
}