/*
* 130920 edit jannis - blockquote optimization
* 130909 edit Jannis - add Grid Corners
* 130823 edit Jannis - some fixes on the tiles behavior
* 130923 edit Jannis - moved some styles over to article.css
* 130923 edit Konstantin - some fixes on blockquote
* 130923 edit Konstantin - style for footnotes provided by CKEditor
* 130923 edit Konstantin - include Buenard font as substitute for missing Arapey bold weight
* 131209 edit Konstantin - add vCard styles
* 131210 edit Jannis - large fonts for vCard
*/

/*
* TYPOGRAPHY AND GLOBAL STYLES
* ---------------------------------------------------------------------------
*/
i, cite, em, var, address, dfn {
	font-style: italic;
}

strong, b {
	font-weight: 700;
	font-family: 'Buenard', Times, serif;
	line-height: 1;
}

blockquote p {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 0.05rem;
	line-height: 140%;
	margin-bottom: 0;
	display: block;
}
blockquote {
	padding-top:0.5rem;
	/* prevents cut off letter problem in webkit */
	display: inline-block;
	/* prevents column-break */
	position: relative;
	/* provides consistent positioning of generated child content  */
}
blockquote p:before {
	content: '”';
	font-family: 'Arapey', serif;
	font-size: 900%;
	position: absolute;
	color: #999;
	margin-top: 2.1rem;
	margin-left: -.3rem;
	opacity: .25;
}
blockquote p:after {
	content: '“';
	font-family: 'Arapey', serif;
	font-size: 900%;
	position: absolute;
	color: #999;
	margin-top: 2.2rem;
	opacity: .25;
	margin-left: -2.7rem;
}

.drop-caps {
	font-size: 3.4rem;
	display: inline-block;
	line-height: 3.4rem;
	float: left;
	margin-top: -0.35rem;
	height: 2.4rem;
	margin-right: 0.25rem;
}

sup {
	font-size: 66.66%;
	vertical-align: .25em;
	line-height: 100%;
}
sub {
	font-size: 80%;
	line-height: 115%;
	display: inline-block;
}
.footnote {
	font-size: 86.36%;
	line-height: 1.22em;
}
.align-left {
	text-align: left;
}
.align-center {
	text-align: center;
}
.align-right {
	text-align: right;
}

.text-white {
	color: #FFF;
}

.uppercase {
	text-transform: uppercase;
}

.bolder {
	font-weight: 600;
}

.rteindent1 {
	margin-left: 2rem;
}

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

.external-link {
	border-bottom: 2px solid;
	border-color: #333;
}
.external-link:hover {
	border-color: #999;
}

/* --------------------------------------------
* ARTICLE LAYOUT
* --------------------------------------------
*/
/* Set wrapper to screen height */
.node--view-mode-full {
	min-height: 100vh;
	height: 100vh;
}

/* --------------------------------------------
* VARIOUS FIELDS & VIEWS
* --------------------------------------------
*/
.field-label-above .field-label {
	clear: both;
}
.field-type-addressfield .field-items div,
.field-type-addressfield.field-label-inline div.field-label {
	float: left;
	margin-right: .25em;
}
.field-name-field-project-completion-year span,
.toc-label,
.read-more-link,
.text-button {
	display: inline-block;
	color: white;
	text-transform: uppercase;
	letter-spacing: .1rem;
	padding: 6px 12px 6px 15px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: .05rem;
	line-height: 115%;
	background: #333;
}
.read-more-link {
	margin-top: 2.666rem;
}
.group-project-competition div, .group-project-realization div:not(.field-label) {
	float: left;
}
.group-project-competition div + .field-name-field-competition-date:before {
	content: '\00a0';
}
.group-project-competition div + .field-name-field-competition-rank:before {
	content: ',\00a0';
}
.group-project-realization div + .field-name-field-realization-end:before {
	content: '–';
}
.group-building-data p {
	margin-bottom: 0 !important;
}
.view-tiles .exposed-input {
	margin-bottom: 0;
	padding: 2.4rem .8rem;
	font-family: 'Open Sans', sans-serif;
	font-size: 28px;
	font-weight: 400;
	line-height: 1.75;
	text-transform: uppercase;
	letter-spacing: .06rem;
	text-align: center;
}
.view-tiles .exposed-input span:first-child {
	display: inline-block;
}
.view-tiles .exposed-input span:last-child {
	background: #000;
	color: #fff;
	padding: 5px 15px;
	-webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}
.view-jobs .views-row article > h2 {
	display: none;
}
.view-jobs .view-empty {
	padding: 1.25em;
	font-size: 1.25rem;
}
/* --------------------------------------------
* MAPS
* --------------------------------------------
*/
.group-project-data .field-type-geofield .geofieldMap { width:100%; height:100%; overflow:hidden; position:relative;}
.leaflet-marker-pane > .leaflet-marker-icon:first-child { z-index: 100 !important; }
.leaflet-tile-pane { filter: grayscale(1) contrast(1.25); }
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
	background: #111;
	color: #fff;
}
.leaflet-popup-content-wrapper {
	border-radius: 0;
}
.leaflet-container {
	font-size: initial;
	line-height: initial;
	font-family: 'Open Sans', arial, sans-serif;
}
.leaflet-popup {
	max-width: 24em;
}
.leaflet-popup-content {
	color: #FFF;
	font-family: 'Open Sans', sans-serif !important;
	font-size: 12px !important;
	text-transform: uppercase;
	letter-spacing: 0.075em;
	line-height: 1.44;
}
.leaflet-popup-content .name {
	font-weight: 700 !important;
}
.leaflet-popup-content a {
	color: inherit;
}
.leaflet-popup-content a:hover {
	color: #CCC;
}
.node-location .leaflet-popup-content-wrapper,
.node-location .leaflet-popup-tip {
	background: #dc0000;
}

/* --------------------------------------------
* PROJECTS GRID
* --------------------------------------------
*/
.view-tiles .views-row {
	margin: 0;
	padding: 0;
	float: left;
	width: 25%;
	padding-top: 25%;
	box-sizing: border-box;
	position: relative;
}
.info-panel,
.image-panel {
	position: absolute;
	left: 5%;
	top: 5%;
	width: 90%;
	height: 90%;
	overflow: hidden;
}
.info-panel {
	background: #FFF;
	z-index: 5;
	-webkit-transition: 360ms opacity cubic-bezier(0.2, 0, 0.8, 1);
	-moz-transition: 360ms opacity cubic-bezier(0.2, 0, 0.8, 1);
	-ms-transition: 360ms opacity cubic-bezier(0.2, 0, 0.8, 1);
	-o-transition: 360ms opacity cubic-bezier(0.2, 0, 0.8, 1);
	transition: 360ms opacity cubic-bezier(0.2, 0, 0.8, 1);
}
/* css-variables-driven */
:root {
    --grid-space: 10%;
}
.info-panel,
.image-panel {
	left: calc(var(--grid-space) / 2);
    top: calc(var(--grid-space) / 2);
    width: calc(100% - var(--grid-space));
    height: calc(100% - var(--grid-space));
}
.info-panel {
	opacity: 0;
	-webkit-transform: scale3d(1, 1, 1);
	-moz-transform: scale3d(1, 1, 1);
	-ms-transform: scale3d(1, 1, 1);
	-o-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	transform-origin: center;
	-webkit-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-moz-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-ms-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-o-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
}
.view-tiles .views-row:hover .info-panel {
	opacity: 1;
	-webkit-transform: scale3d(1.1, 1.1, 1);
	-moz-transform: scale3d(1.1, 1.1, 1);
	-ms-transform: scale3d(1.1, 1.1, 1);
	-o-transform: scale3d(1.1, 1.1, 1);
	transform: scale3d(1.1, 1.1, 1);
}
.info-panel div {
	text-align: center;
}
.info-panel .head {
	/* word-break: break-word; */
}
.info-panel .headline {
	margin-top: 0;
	margin-bottom: 0;
}
.info-panel .subhead {
	font-size: 1rem;
	margin-top: 5%;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.info-panel .field-content {
	display: flex;
    flex-direction: column;
    justify-content: center;
	height:100%; width:100%;
}
.info-panel .field-content a {
	padding: 5%; /* to compensate upscaling on hover */
}
.info-panel a:hover {
	color: #000;
}
.info-panel .category {
	text-align: center;
	margin-top: 7.5%;
	-webkit-transform: translateY(1.5rem);
	-moz-transform: translateY(1.5rem);
	-ms-transform: translateY(1.5rem);
	-o-transform: translateY(1.5rem);
	transform: translateY(1.5rem);
	-webkit-transition: 360ms transform ease-in-out;
	-moz-transition: 360ms transform ease-in-out;
	-ms-transition: 360ms transform ease-in-out;
	-o-transition: 360ms transform ease-in-out;
	transition: 360ms transform ease-in-out;
}
.info-panel .category span {
	color: white;
	text-transform: uppercase;
	padding: 4px 8px;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: .05rem;
	background: #333;
	-webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}
.view-tiles .views-row:hover .info-panel .category {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
}
.image-panel {
	background: #DDD;
}
.view-tiles .views-field img {
	display: block;
	position: absolute;
	left: 0%;
	top: 0%;
	height: 100%;
	width: 100%;
	opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
	-moz-transform: scale3d(1, 1, 1);
	-ms-transform: scale3d(1, 1, 1);
	-o-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-moz-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-ms-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	-o-transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
	transition: 360ms transform ease-in-out, 360ms opacity ease-in-out;
}
.view-tiles .views-row:hover img {
	opacity: 0;
	-webkit-transform: scale3d(1.1, 1.1, 1);
	-moz-transform: scale3d(1.1, 1.1, 1);
	-ms-transform: scale3d(1.1, 1.1, 1);
	-o-transform: scale3d(1.1, 1.1, 1);
	transform: scale3d(1.1, 1.1, 1);
}

/* Corner Marker */

/* Projects */
.view-tiles .image-panel:after{
	content: "";
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoAgMAAADxkFD+AAAAA3NCSVQICAjb4U/gAAAACVBMVEX///////////+OSuX+AAAAA3RSTlMAVf8QuIJCAAAACXBIWXMAAAsSAAALEgHS3X78AAAAGHRFWHRDcmVhdGlvbiBUaW1lADA2LjA5LjIwMTNsEb8dAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAAHRJREFUGJVNkbERwDAIxOyGITxN5mEaD5EGpkw47jlRqZANPGv9tZ+lsjt43kEP0c6UbJmST6Zkz4xRJVvhlSrZC2PUlq3xSm3ZG2PUkk14pZbswiBCwDN8hhZsjHEwJEbnQlgTyyMSBoX4ECqi5gFwlj7WBwPkhNGOv6TcAAAAAElFTkSuQmCC);
	width: 20px; height: 20px;
	position: absolute;
}
/* Projects */
.view-tiles .node-project .image-panel:after{
	background-position: left bottom;
	right: 0; top:0;
}
/* News */
.view-tiles .node-article .image-panel:after{
	background-position: right bottom;
	left: 0; top:0;
}
/* Quarterly */
.view-tiles .node-quarterly .image-panel:after{
	background-position: right top;
	left: 0; bottom:0;
}

.view-tiles .node-article.type-publikationen .image-panel:after, 
.view-tiles .node-article.type-ausstellungen .image-panel:after, 
.view-tiles .node-article.type-jobs .image-panel:after{
	background-position: left top;
	left: auto; top:auto;
	right: 0; bottom:0;
}

/* --------------------------------------------
* 'TABLE OF CONTENT' STYLE VIEWS
* --------------------------------------------
*/

.view.toc {
	position: absolute;
	left: 5%;
	top: 5%;
	right: 5%;
	bottom: 100px;
}

.toc .view-content,
.field-name-field-quarterly-nodes {
	max-width: 45.5rem; /* = column-width + -gap */
	margin: 0 auto;
}
.view-header,
.toc-header {
	text-align: center;
	margin-bottom: 3rem;
}
.toc-header h2,
.toc .view-header h2 {
	margin-bottom: 1rem;
}
.toc h5 {
	border-top: 2px solid #333;
	padding-top: .476rem;
	margin-top: 0;
	margin-bottom: 0;
}
.toc .view-content,
.field-name-field-quarterly-nodes {
	font-size: 85%;
	line-height: 115%;
}
.toc .views-row {
	margin-bottom: 0.476rem;
	display: inline-block;
	float: none;
	width: 100%;
}
.view-quarterly.toc .views-row,
.field-name-field-quarterly-nodes .field-item {
	margin-bottom: 1rem;
}
.toc .views-field-field-headline,
.field-name-field-quarterly-nodes .field-name-field-headline {
	line-height: 110%;
	padding: .25rem 0;
	margin: 0;
}
.toc .views-field-term-node-tid-i18n,
.toc .views-field-counter,
.toc .view-grouping .grouping-header,
.field-name-field-quarterly-nodes .field-type-taxonomy-term-reference {
	font-family: 'Open Sans', sans-serif;
	font-size: 75%;
	text-transform: uppercase;
	letter-spacing: .05rem;
	height: 1rem;
}
.toc .views-field-field-rich-image,
.field-name-field-quarterly-nodes .field[class*="rich-image"] {
	width: 40%;
	float: left;
	padding: .9rem .667rem 0 0;
}
.toc .views-field-field-rich-image img,
.field-layout-toc .field[class*="rich-image"] img {
	width: 100%;
	height: auto;
}
.toc .views-field-counter {
	float: right;
	padding-top: .5rem;
	line-height: 1.333rem;
}
.node-quarterly .toc .views-field-counter {
	padding-top: 0;
	line-height: 1rem;
}
.toc .view-grouping {
	margin-bottom: 2rem;
}
.toc .view-grouping .grouping-header {
	text-align: center;
}

/* --------------------------------------------
* QUARTERLY
* --------------------------------------------
*/

.view-quarterly.magazine,
.view-quarterly.magazine > .view-content,
.view-quarterly.magazine > .view-content > .views-row {
	height: 100%;
}
.view-quarterly.magazine .views-row {
	display: none;
}
.view-quarterly.magazine .section-1 .views-row {
	display: block;
}
/* Cover */
.cover .view-content {
	width. 100%;
	height: 100%;
}

/* Should there be a preloading animation? */
/*
.spinner {
width: 50px;
height: 50px;
background: url(images/spinner.gif) center center no-repeat;
position: fixed;
top: 50%;
left: 50%;
margin-top: -25px;
margin-left: -25px;
border-radius: 25px;
}
*/


/* --------------------------------------------
* TEAM
* --------------------------------------------
*/

.page-office #page {
	margin: 0;
}
.vcard p, .vcard span {
	font-size: 1.75rem;
	line-height:2.25rem;
	margin-bottom:0;
	font-family: 'Open Sans',sans-serif;
	font-weight: 300;
}
.vcard span {
	/*white-space: nowrap;*/
	display:block;
}
.vcard abbr {
	display: inline;
}
.vcard #download {
	font-family: 'Open Sans', sans-serif;
	font-size: 75%;
	text-transform: uppercase;
	letter-spacing: .05rem;
	margin: 1rem 0;
}

@media (min-width: 520px)  {
	.vcard p, .vcard span {
		font-size: 3.75rem;
		line-height:4.5rem;
	}
	.vcard span {
		display:inline-block;
	}
	.vcard span::after {
		content: '\00a0/\00a0';
	}
	.vcard span:last-of-type::after {
		content: '';
	}
}

/* --------------------------------------------
* AWARDS
* --------------------------------------------
*/

.view-awards > .view-content {
	display: table;
}
.view-awards > .view-content .views-row {
	display: table-row;
}
.view-awards > .view-content .views-field {
	display: table-cell;
	vertical-align: middle;
}


/*
* ADMIN + DEBUGGING
* ---------------------------------------------------------------------------
*/
.edit-link {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;
	padding: 4px 12px;
}
.edit-link a {
	font-family: "Open Sans";
	font-size: 55%;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: #FFF;
	text-shadow: 1px 1px 1px #444;
}
.edit-link a:hover {
	color: #FFF;
	text-shadow: 1px 1px 1px #111;
}
pre.debug {
	font-family: monospace;
	font-size: 13px;
	line-height: 1.5em;
	color: #009;
	position: absolute;
	right: 0;
	top: 0;
	max-width: 900px;
	background: #FFF;
	opacity: .88;
	z-index: 999;
}
