/*
	CONTAINERS
	---------------------------------------------------------------------
	Containers are used to set a max width of a component.

	[Functions]

	* All containers are centered by default
	* Centering can be turned off with "no-center" class
	* Height stretching can be turned off with "fit-content" class

	[Don't do's]

	* Don't add extra classes
	* Don't add any padding or margins to the component

*/

.container--no-center { margin: 0; }
.container--large { max-width: 1140px; width: 100%; height: 100%; }
.container--main { max-width: 860px; width: 100%; height: 100%; }
/*.container--main { max-width: 730px; width: 100%; height: 100%; }*/
.container--sidebar { width: 300px; height: 100%; }
.container--social-icons { width: 50px; height: 100%; }

.grid.grid-spacing--1 { margin-top: -10px; margin-left: -10px; }
.grid.grid-spacing--1 > [class^='grid-cell'] { padding-top: 10px; padding-left: 10px; }

.grid.grid-spacing--2 { margin-top: -20px; margin-left: -20px; }
.grid.grid-spacing--2 > [class^='grid-cell'] { padding-top: 20px; padding-left: 20px; }

.grid.grid-spacing--3 { margin-top: -30px; margin-left: -30px; }
.grid.grid-spacing--3 > [class^='grid-cell'] { padding-top: 30px; padding-left: 30px; }

.grid.grid-spacing--4 { margin-top: -40px; margin-left: -40px; }
.grid.grid-spacing--4 > [class^='grid-cell'] { padding-top: 40px; padding-left: 40px; }

/*
								[[MODIFIERS]]
	=====================================================================
*/

/* Padding modifiers */
.padding-0--all { padding: 0px !important; }
.padding-0--vertical { padding-top: 0px !important; padding-bottom: 0px !important; }
.padding-0--horizontal { padding-left: 0px !important; padding-right: 0px !important; }
.padding-0--top { padding-top: 0px !important; }
.padding-0--bottom { padding-bottom: 0px !important; }
.padding-0--left { padding-left: 0px !important; }
.padding-0--right { padding-right: 0px !important; }

.padding-1--all { padding: 10px; }
.padding-1--vertical { padding-top: 10px; padding-bottom: 10px; }
.padding-1--horizontal { padding-left: 10px; padding-right: 10px; }
.padding-1--top { padding-top: 10px; }
.padding-1--bottom { padding-bottom: 10px; }
.padding-1--left { padding-left: 10px; }
.padding-1--right { padding-right: 10px; }

.padding-2--all { padding: 20px; }
.padding-2--vertical { padding-top: 20px; padding-bottom: 20px; }
.padding-2--horizontal { padding-left: 20px; padding-right: 20px; }
.padding-2--top { padding-top: 20px; }
.padding-2--bottom { padding-bottom: 20px; }
.padding-2--left { padding-left: 20px; }
.padding-2--right { padding-right: 20px; }

.padding-3--all { padding: 30px; }
.padding-3--vertical { padding-top: 30px; padding-bottom: 30px; }
.padding-3--horizontal { padding-left: 30px; padding-right: 30px; }
.padding-3--top { padding-top: 30px; }
.padding-3--bottom { padding-bottom: 30px; }
.padding-3--left { padding-left: 30px; }
.padding-3--right { padding-right: 30px; }

.padding-4--all { padding: 40px; }
.padding-4--vertical { padding-top: 40px; padding-bottom: 40px; }
.padding-4--horizontal { padding-left: 40px; padding-right: 40px; }
.padding-4--top { padding-top: 40px; }
.padding-4--bottom { padding-bottom: 40px; }
.padding-4--left { padding-left: 40px; }
.padding-4--right { padding-right: 40px; }

/* Margin modifiers */
.margin-0--all { margin: 0px; }
.margin-0--vertical { margin-top: 0px; margin-bottom: 0px; }
.margin-0--horizontal { margin-left: 0px; margin-right: 0px; }
.margin-0--top { margin-top: 0px; }
.margin-0--bottom { margin-bottom: 0px; }
.margin-0--left { margin-left: 0px; }
.margin-0--right { margin-right: 0px; }

.margin-1--all { margin: 10px; }
.margin-1--vertical { margin-top: 10px; margin-bottom: 10px; }
.margin-1--horizontal { margin-left: 10px; margin-right: 10px; }
.margin-1--top { margin-top: 10px; }
.margin-1--bottom { margin-bottom: 10px; }
.margin-1--left { margin-left: 10px; }
.margin-1--right { margin-right: 10px; }

.margin-2--all { margin: 20px; }
.margin-2--vertical { margin-top: 20px; margin-bottom: 20px; }
.margin-2--horizontal { margin-left: 20px; margin-right: 20px; }
.margin-2--top { margin-top: 20px; }
.margin-2--bottom { margin-bottom: 20px; }
.margin-2--left { margin-left: 20px; }
.margin-2--right { margin-right: 20px; }

.margin-3--all { margin: 30px; }
.margin-3--vertical { margin-top: 30px; margin-bottom: 30px; }
.margin-3--horizontal { margin-left: 30px; margin-right: 30px; }
.margin-3--top { margin-top: 30px; }
.margin-3--bottom { margin-bottom: 30px; }
.margin-3--left { margin-left: 30px; }
.margin-3--right { margin-right: 30px; }

.margin-4--all { margin: 40px; }
.margin-4--vertical { margin-top: 40px; margin-bottom: 40px; }
.margin-4--horizontal { margin-left: 40px; margin-right: 40px; }
.margin-4--top { margin-top: 40px; }
.margin-4--bottom { margin-bottom: 40px; }
.margin-4--left { margin-left: 40px; }
.margin-4--right { margin-right: 40px; }

/* Negative margins */

.margin-n1--all { margin: -10px; }
.margin-n1--vertical { margin-top: -10px; margin-bottom: -10px; }
.margin-n1--horizontal { margin-left: -10px; margin-right: -10px; }
.margin-n1--top { margin-top: -10px; }
.margin-n1--bottom { margin-bottom: -10px; }
.margin-n1--left { margin-left: -10px; }
.margin-n1--right { margin-right: -10px; }

.margin-n2--all { margin: -20px; }
.margin-n2--vertical { margin-top: -20px; margin-bottom: -20px; }
.margin-n2--horizontal { margin-left: -20px; margin-right: -20px; }
.margin-n2--top { margin-top: -20px; }
.margin-n2--bottom { margin-bottom: -20px; }
.margin-n2--left { margin-left: -20px; }
.margin-n2--right { margin-right: -20px; }

.margin-n3--all { margin: -30px; }
.margin-n3--vertical { margin-top: -30px; margin-bottom: -30px; }
.margin-n3--horizontal { margin-left: -30px; margin-right: -30px; }
.margin-n3--top { margin-top: -30px; }
.margin-n3--bottom { margin-bottom: -30px; }
.margin-n3--left { margin-left: -30px; }
.margin-n3--right { margin-right: -30px; }

.margin-n4--all { margin: -40px; }
.margin-n4--vertical { margin-top: -40px; margin-bottom: -40px; }
.margin-n4--horizontal { margin-left: -40px; margin-right: -40px; }
.margin-n4--top { margin-top: -40px; }
.margin-n4--bottom { margin-bottom: -40px; }
.margin-n4--left { margin-left: -40px; }
.margin-n4--right { margin-right: -40px; }

/* Navigation */
/*.navigation { position: fixed; top: 0; left: 0; right: 0; box-shadow: none; transition: box-shadow 0.3s ease-in-out; overflow: hidden; z-index: 10; }*/

.logo { -webkit-box-sizing: border-box; box-sizing: border-box; min-height: 0; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; }
.logo img { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; }
.logo--navigation-regular { height: 100%; width: 100%; }
.logo--navigation-regular img { height: 45px;  }

.keyword {}
.keyword:before { content: "#"; color: hsl(0,0%,90%); margin-right: 2px; font-weight: normal; }

.dummy { height: 300px; }

.fill { width: 100%; height: 100%; background: gray; }

.loading { padding-bottom: 120px; background: lightgray; }

.image { position: relative; }

.line-through { position: relative; z-index: 1; }
.line-through:after {
	z-index: 0;
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	border-top: 1px solid;
	width: 100%;
	/*transform: translateY(-50%);*/
}


#socialIcons { }
.social-icons { width: 50px; }
.social-icon { display: -webkit-box; display: -ms-flexbox; display: flex; width: 50px; height: 50px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.comments-dummy { height: 600px; border: dotted 1px gray; }

.enumerate { counter-reset: position; }
.enumerate__item { display: -webkit-box; display: -ms-flexbox; display: flex; }
.enumerate__item:before {
    counter-increment: position;
    content: counter(position);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25px;
            flex: 0 0 25px;
    height: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.enumerate__item:before {
	background-color: hsl(358,57%,44%);
	color: hsl(0,0%,99.3%);
	font-weight: bold;
	font-size: 1.1rem;
	margin-right: 10px;
}

/*.enumerate__item--wide:before {
	margin-right: 15px;
}
*/
.enumerate__item--gray:before {
	background-color: hsl(0,0%,27%);
}

.gallery-preview { }
.gallery-preview--container { height: 180px; position: relative; }
.gallery-preview--container:not(:first-child) { margin-top: -180px; }

.gallery {}
.gallery__actions {}
.gallery__action {}
.gallery__button {  }

.icon { display: block; text-align: center; }
.icon--small { width: 35px; line-height: 35px; }
.icon--large { width: 50px; line-height: 50px; }
.icon--xsmall { width: 25px; line-height: 25px; }


.opacity-20 { opacity: 0.2; }
.opacity-60 { opacity: 0.6; }

.quote { display: -webkit-box; display: -ms-flexbox; display: flex; }
.quote:before {
	content: "\e803";
	font-family: "fontello";
	font-size: 2.5rem;
	opacity: 0.125;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	padding-right: 30px;
}

.link:after {
	content: "»";
	margin-left: 5px;
}

.ad-text--icon {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.ad-text--icon:before {
	font-family: "fontello";
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	padding-right: 10px;
	opacity: 0.3;
}

@media screen and (max-width: 1365px) {
	.content--branding { margin-top: 0 !important; }
	.branding { display: none; }
}

.branding > ins { display: block; width: 100%; height: 100%; }


@media screen and (min-width: 1366px) {
	body:not(.with-branding) .content--branding { margin-top: 0 !important; } 
	#branding-placeholder { display: block !important; }
	body.with-branding {}
	.branding { display: none; }
	body.with-branding .branding { display: block; position: fixed; top: 0; bottom: 0; left: 50%; width: 1920px; z-index: -1; background-repeat: no-repeat; background-position: top center; background-attachment: fixed; transform: translateX(-50%);  -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); }

	body.with-branding .content--branding { max-width: 1080px; position: absolute;  left: 50%; transform: translateX(-50%);  -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); }
	body.with-branding .navigation-container { padding-left: 0 !important;  }
	body.with-branding .branding-padding--no-vertical { padding-top: 0 !important; padding-bottom: 0 !important; }
	body.with-branding .branding-padding--no-top { padding-top: 0 !important; }
	body.with-branding .branding-padding--no-bottom { padding-bottom: 0 !important; }
	body.with-branding .branding-padding--no-horizontal { padding-left: 0 !important; padding-right: 0 !important; }
	body.with-branding .branding-padding--no-left { padding-left: 0 !important; }
	body.with-branding .branding-padding--no-right { padding-right: 0 !important; }
	body.with-branding .branding-padding--no-all { padding: 0 !important; }
}

.cookies-notification {
	z-index: 9;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
}

.desaturate { -webkit-filter: saturate(0); filter: saturate(0); }

body:not(.show-sidebar-spacer) .sidebar-spacer { display: none; }
body.show-sidebar-spacer .sidebar-spacer { display: block; }

.navigation.is_stuck:after {
    content: "";
    width: 100%;
    height: 3px;
    position: absolute; /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.25)),to(rgba(0,0,0,0)));
	background: -o-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

@media screen and (max-height: 700px) {
	.soft-news:nth-child(n+5) {
		display: none;
	}
}

.navigation { position: absolute; top: 0; left: 0; right: 0; z-index: 10; }

.nav-stuck { position: fixed; }

.navigation-bar--top { height: 60px; }
.navigation-bar--bottom { height: 37px; }



.lazyComponent { background-size: contain; background-repeat: no-repeat; background-position: center center; background-color: rgb(153,153,153); }
.lazyComponent.no-placeholder { opacity: 0; }

.stack { position: relative; width: 100%; height: 100%; }
.stack-container { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }

.preview .preview-overlay { opacity: 0; transition: opacity .15s; cursor: pointer; }
.preview:hover .preview-overlay { opacity: 1; transition: opacity .15s; }
.preview-overlay {  }

.overlay-banner-wrapper { position: fixed; z-index: 30; top: 0; bottom: 0; left: 0; right: 0; background: white; display: none; }

.overlay-banner-container { max-width: 640px; width: 100%; height: 100%; padding: 10px; display: flex; align-items: center; justify-content: center; flex-direction: column; }

.overlay-banner-close { color: rgb(176,48,52); font-weight: bold; font-size: 1.5rem; }
.overlay-banner-close span:after { content: "»"; padding-left: 3px; }

.overlay-banner-header { text-align: right; padding-top: 20px; order: 2; }


.overlay-banner-content { padding-top: 10px; order: 1; }
.overlay-banner-content a {}

.overlay-banner-content img { }