/**
 * responsive.cascade.css is for styles that will cascade and uses
 * min-width only media queries.
 *
 * All the other responsive stylesheets use a stacking method (by
 * default that is, you can change the media queries in theme settings),
 * however this uses a waterfall method so we can leverage the cascade
 * and inheritance for all browsers that support media queries, regardless
 * of screen size.
 *
 * NOTE: this file will NOT load by default, you need to enable it
 * in theme settings under "Global Settings".
 *
 * Usage: you must set the breakpoints manually.
 */


/* Add any valid CSS declarations */
html, body, .texture-overlay {
height: 100%;
width: 100%;
display: table;
}

#mmenu_right {
z-index: 999;
top: 88px;
}
.not-front h1#page-title {
display: none;
}
.node-type-page h1#page-title {
display: block !important;
}
#header, .content-inner {
background: url(../images/column_bg.png) repeat !important;
}
#header {
position: fixed;
top: 0;
width: 100%;
max-height: 88px;
overflow: hidden;
z-index: 300;
}
#columns {
/*height: 85%;
position: relative;
overflow: hidden;
top: 80px;*/
padding-top: 108px;
}
#footer {
position: fixed;
bottom: 0;
width: 100%;
height: 5%;
overflow: hidden;
z-index: 300;
}
#page, .header-inner, .block-inner {
background: none !important;
}

.front header.node-header,
.page-taxonomy-term header.node-header {
display: none;
}
.views-field-nothing {
text-align: center;
}
.flexslider, #main-content .node-teaser, .node .node-title, .field-type-image figure {
background: none;
border: none;
}
..attribute-creator {
display: none;
}
.ia-l .field-type-image figure, .iat-l .field-type-image figure, article .field-type-image {
border: none;
margin: none;
width: 100%;
}
.image-style-fullsize {
width: 100%;
max-width: 100%;
}
.field-name-field-image,
.ia-l .field-type-image figure, .iat-l .field-type-image figure,
article .field-type-image {
margin: 0;
padding: 0;
}
.field-type-image figure img {
margin: 0;
max-height: 90vh;
padding: 0;
width: auto;
float: right;
}
table.cols-3 td {
text-align: center;
width: 33.3333%;
}
h1, h2, h3, h4 {
line-height: 1.5em;
}
iframe {
max-width: 100%;
}
.flex-direction-nav a {
    border: 1px solid #fff;
    border-radius: 50px;
    line-height: 40px;
    color: #ffffff;
    padding: 10px;
}

.flex-direction-nav .flex-next,
.flex-direction-nav .flex-prev {
text-align: center !important;
color: #ffffff;
}
.flex-direction-nav a::before,
.flex-direction-prev a::before {
color: #ffffff !important;
}
li.flexslider-views-slideshow-main-frame-row,
li.flexslider-views-slideshow-main-frame-row .views-field-field-image {
position: relative;
}
li.flexslider-views-slideshow-main-frame-row .views-field-title {
text-align: right;
width: auto;
padding: 10px 30px;
background: rgba(0, 0, 0, 0) url("../images/column_bg.png") repeat scroll 0 0;
position: absolute;
bottom: 60px;
right: 0px;
font-size: 2em;
}
.flexslider .slides > li {
/*z-index: 1 !important;*/
}
.flexslider .slides img {
    margin: 0 auto;
    max-width: 100%;
	width: auto !important;
	max-height: 80vh;
}
#page {
height: 100%;
display: table;
}
.two-sidebars .content-inner {
box-sizing: border-box;
    display: table;
    float: left;
    padding: 20px;
    width: 80%;
}
#main-content, .block-inner, .pane-inner, .menu-wrapper, .branding-elements, .breadcrumb-wrapper, .attribution, .at-panel .rounded-corner, .block-panels-mini > .block-title, div.messages {
margin: 0px;
}

#site-name {
padding: 0px 0px 0px 20px;
font-weight: bold !important;
}

.header-inner {
padding: 0px 0px 0px 10%;
}

.view .item-list ul li {
width: 33.3333%;
margin: 0px !important;
padding: 10px;
box-sizing: border-box;
float: left;
position: relative;
list-style: none !important;
}

.view .item-list ul li img {
width: 100%;
position: relative;
}

.view .item-list ul li .views-field-field-image,
.view .item-list ul li .views-field-field-vimeo-video {
position: relative;
width: 100%,
max-width: 100%;
}
.view .item-list ul li .views-field-title {
position: absolute;
bottom: 20%;
padding: 10px 30px;
background: rgba(0, 0, 0, 0) url("../images/column_bg.png") repeat scroll 0 0;
text-align: right;
width: auto;
right: 10px;
}

a:hover, a.active:hover, a:focus, a.active:hover, i.icon-plus:hover, .mm-listview .mm-next:hover {
text-decoration: none;
background: #07049d;
color: #ffffff !important;
}
.mm-listview .mm-next:hover span,
.mm-listview .mm-next:hover i,
.mm-next:hover::after {
color: #ffffff !important;
}
.mm-next:hover::after,
.mm-prev:hover::before {
border-color: #ffffff !important;
}
a.mmenu-mm-subopen:hover {
background: none !important;
color: #000000 !important;
}

@media only screen and (min-width:769px)  {
.group-medien { 
width: 70%; 
float: left;
text-align: center;
margin-rifght: 2%;
overflow: hidden;
}
.group-infos {
width: 28%;
float: right;
}
.node-type-page #content,
.page-contact #content {
padding-left: 20%;
padding-right: 20%;
}
}

@media only screen and (max-width:768px) {
.group-medien, .group-infos {
width: 100%;
float: none;
}
#branding {
max-width: 70%;
width: 70% !important;
float: left !important;
}
.region-header {
max-width: 60px;
width: 60px;
clear: none !important;
float: right !important;
}
.header-inner {
padding: 0 0 0 10px !important;
}
#site-name {
padding: 0 !important;
}
h1#site-name {
font-size: 2.4em;
}

}

@media only screen and (min-width:220px) and (max-width:360px)  {

.field-type-image figure {
margin: 0 0 20px 0;
max-width: 100%;
}
#header {
height: 80px;
}
h1, h2, h3, h1#site-name {
font-size: 1.4em;
}

li.flexslider-views-slideshow-main-frame-row .views-field-title {
display: none;
}

.group-medien .field-type-image figure {
width: 100% !important;
max-width: 100% !important;
margin: 0 0 20px 0 !important;
padding: 0;
}
.two-sidebars .content-inner {
    width: 100%;
}
}


@media only screen and (min-width:320px) and (max-width: 767px) {

.field-type-image figure {
max-width: 100%;
}

h1#site-name {
font-size: 1.6em;
}
#header {
height: 80px;
}

.group-medien .field-type-image figure {
width: 100% !important;
max-width: 100% !important;
margin: 0 0 20px 0 !important;
padding: 0;
}
li.flexslider-views-slideshow-main-frame-row .views-field-title {
bottom: 10px;
font-size: 1em;
} 

.node-page .field-type-image figure {
max-width: 50%;
}

}


@media only screen and (min-width:768px) {

.field-type-image figure {
max-width: 100%;
}
.group-medien .field-type-image figure {
width: 100% !important;
max-width: 100% !important;
margin: 0 0 20px 0 !important;
}

.node-page .field-type-image figure {
max-width: 50%;
}

}

/* Desktops/laptops and up
@media only screen and (min-width:1025px) {
}
 */