/*!
Theme Name: Galerie_Drei Mobile
Theme URI: http://underscores.me/
Author: preggnant agency
Author URI: http://www.preggnant.com
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: galerie_drei
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Galerie_Drei is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
*/
html{

}
body,html{
    max-width:100%;
}
body{
    min-height:100vh;
    display:flex;
    flex-direction:column
}
a{
    background-color:transparent
}
b{
    font-weight:bolder
}
img{
    border-style:none
}
input{
    font-family:inherit;
    font-size:100%;
    line-height:1.15;
    margin:0
}
input{
    overflow:visible
}
[type=button],[type=reset],[type=submit]{
    -webkit-appearance:button
}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{
    border-style:none;
    padding:0
}
[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{
    outline:1px dotted ButtonText
}
[type=checkbox],[type=radio]{
    box-sizing:border-box;
    padding:0
}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{
    height:auto
}
[type=search]{
    -webkit-appearance:textfield;
    outline-offset:-2px
}
[type=search]::-webkit-search-decoration{
    -webkit-appearance:none
}
::-webkit-file-upload-button{
    -webkit-appearance:button;
    font:inherit
}
template{
    display:none
}
[hidden]{
    display:none
}
p, .paragraph, .item{
    margin-top:0;
    margin-bottom:1.5em
}

em,i{
    font-style:italic
}
address{
    margin:0 0 1.5em
}
var{
    font-family:Monaco,Consolas,"Andale Mono","DejaVu Sans Mono",monospace
}
.site-title{
    font-family:akzidenz-grotesk-medium!important
}
@font-face{
    font-family:akzidenz-grotesk-regular;
    src:url(https://drei.cologne/wp-content/uploads/fonts/AkzidenzGroteskBE-Regular.woff2) format('woff2'),url(//wp-content/uploads/fonts/AkzidenzGroteskBE-Regular.woff) format('woff')
}
@font-face{
    font-family:akzidenz-grotesk-medium;
    src:url(https://drei.colognehttps://drei.cologne/wp-content/uploads/fonts/AkzidenzGroteskBE-Md.woff2) format('woff2'),url(/wp-content/uploads/fonts/AkzidenzGroteskBE-Md.woff) format('woff')
}
html{
    box-sizing:border-box
}
*,:after,:before{
    box-sizing:inherit
}
body{
    background:#fff;
    font-family:akzidenz-grotesk-regular!important
}
ul{
    margin:0!important;
    padding:0!important
}
ul{
    list-style:none
}
img{
    height:auto;
    max-width:100%
}
input[type=button],input[type=reset]{
    background-color:transparent;
    padding:0;
    z-index:-10
}
input[type=submit]{
    background-color:#00f;
    color:#ffff;
    padding:10px 15px 9px 15px;
    cursor:pointer;
    border:none!important;
    margin:0 0 0 5px
}
.search-submit{
    display:none
}
input[type=button]:hover,input[type=reset]:hover,input[type=submit]:hover{
    border-color:none
}
input[type=button]:active,input[type=button]:focus,input[type=reset]:active,input[type=reset]:focus,input[type=submit]:active,input[type=submit]:focus{
    border-color:none!important;
    outline:0!important
}
::placeholder{
    color:#00f;
    padding:2px 0 0 2px
}
[type=search]::-webkit-search-cancel-button{
    display:none
}
input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=range],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week]{
    color:#00f;
    border:1px solid #00f;
    padding:9px;
    width:30vw
}
input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=range]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus{
    color:#00f;
    border-color:none!important;
    outline:0!important
}
.main-nav{
    background-color:#fff;
    display:flex;
    position:fixed;
    top:0;
    left:0;
    justify-content:space-between;
    align-items:center;
    min-width:100vw;
    z-index:100000000;
    flex-wrap:wrap
}
.main-nav input[type=checkbox]{
    display:none
}
.main-nav .hamburger-menu{
    width:50px;
    height:40px;
    position:relative;
    top:10px;
    right:10px;
    cursor:pointer;
    display:none;
    z-index:1000000;
    background-image:url(https://drei.cologne/wp-content/themes/galerie_drei_mobile/images/hamburger_icon_draw.svg);
    background-repeat:no-repeat
}
.main-nav__items{
    display:block;
    position:absolute;
    top:8vh;
    left:0;
    width:100vw;
    height:100vh;
    background:#fff;
    transition:max-height .5s;
    max-height:0;
    min-height:0;
    overflow:hidden;
    z-index:100
}
.main-nav .hamburger-menu{
    display:block
}
#check-box-dropdown:checked~.main-nav__items{
    max-height:inherit;
    max-height:inherit;
    font-size:1.5em;
    padding: 80px 4vw;
    top:0;
    font-family:akzidenz-grotesk-medium!important

}

.item-artist{
	font-size:1.5em;
	font-family:akzidenz-grotesk-medium!important
}

.menu-item{
    padding:0;
    font-family:akzidenz-grotesk-medium!important
}
a[href*="//"]:not([href*="drei.cologne"]){
    color:#00f
}
.page-template-news-page a{
    color:inherit!important
}
.paragraph a{
    color:#00f
}
a{
    color:inherit;
    text-decoration:none
}
a:visited{
    color:none
}
a:active,a:focus,a:hover{
    color:inherit;
    text-decoration:none
}
a:focus{
    outline:thin dotted
}
a:active,a:hover{
    outline:0
}
a{
    display:-webkit-inline-box;
    transform-origin:center center
}
a:hover{
    animation-play-state:running
}
@keyframes shake-little{
    2%{
        transform:translate(0,1px)
    }
    4%{
        transform:translate(0,1px)
    }
    6%{
        transform:translate(1px,1px)
    }
    8%{
        transform:translate(0,0)
    }
    10%{
        transform:translate(1px,0)
    }
    12%{
        transform:translate(1px,1px)
    }
    14%{
        transform:translate(0,0)
    }
    16%{
        transform:translate(1px,0)
    }
    18%{
        transform:translate(0,1px)
    }
    20%{
        transform:translate(0,1px)
    }
    22%{
        transform:translate(1px,1px)
    }
    24%{
        transform:translate(0,1px)
    }
    26%{
        transform:translate(0,0)
    }
    28%{
        transform:translate(1px,0)
    }
    30%{
        transform:translate(1px,0)
    }
    32%{
        transform:translate(0,1px)
    }
    34%{
        transform:translate(0,1px)
    }
    36%{
        transform:translate(0,0)
    }
    38%{
        transform:translate(1px,1px)
    }
    40%{
        transform:translate(1px,0)
    }
    42%{
        transform:translate(0,1px)
    }
    44%{
        transform:translate(0,1px)
    }
    46%{
        transform:translate(0,0)
    }
    48%{
        transform:translate(0,1px)
    }
    50%{
        transform:translate(0,1px)
    }
    52%{
        transform:translate(1px,1px)
    }
    54%{
        transform:translate(0,0)
    }
    56%{
        transform:translate(0,0)
    }
    58%{
        transform:translate(0,0)
    }
    60%{
        transform:translate(0,1px)
    }
    62%{
        transform:translate(0,0)
    }
    64%{
        transform:translate(1px,0)
    }
    66%{
        transform:translate(0,1px)
    }
    68%{
        transform:translate(0,0)
    }
    70%{
        transform:translate(1px,1px)
    }
    72%{
        transform:translate(1px,0)
    }
    74%{
        transform:translate(0,1px)
    }
    76%{
        transform:translate(0,1px)
    }
    78%{
        transform:translate(1px,0)
    }
    80%{
        transform:translate(1px,0)
    }
    82%{
        transform:translate(0,0)
    }
    84%{
        transform:translate(1px,0)
    }
    86%{
        transform:translate(0,0)
    }
    88%{
        transform:translate(0,0)
    }
    90%{
        transform:translate(1px,1px)
    }
    92%{
        transform:translate(1px,1px)
    }
    94%{
        transform:translate(1px,0)
    }
    96%{
        transform:translate(1px,0)
    }
    98%{
        transform:translate(0,0)
    }
    0%,100%{
        transform:translate(0,0) rotate(0)
    }
}
header{
}
.main-navigation{
    clear:both;
    display:block;
    float:left;
    width:100%
}
.main-navigation ul{
    display:none;
    list-style:none;
    margin:0;
    padding-left:0
}
.main-navigation ul ul{
    box-shadow:0 3px 3px rgba(0,0,0,.2);
    float:left;
    position:absolute;
    top:100%;
    left:-999em;
    z-index:99999
}
.main-navigation ul ul ul{
    left:-999em;
    top:0
}
.main-navigation ul ul li.focus>ul,.main-navigation ul ul li:hover>ul{
    left:100%
}
.main-navigation ul ul a{
    width:200px
}
.main-navigation ul li.focus>ul,.main-navigation ul li:hover>ul{
    left:auto
}
.main-navigation li{
    float:left;
    position:relative
}
.main-navigation a{
    display:block;
    text-decoration:none
}
.menu-toggle{
    display:block
}
@media screen and (min-width:37.5em){
    .menu-toggle{
        display:none
    }
    .main-navigation ul{
        display:block
    }
}
.site-main.post-navigation{
    margin:0 0 1.5em;
    overflow:hidden
}
#content[tabindex="-1"]:focus{
    outline:0
}
.site-content:after,.site-content:before,.site-footer:after,.site-footer:before,.site-header:after,.site-header:before{
    content:"";
    display:table;
    table-layout:fixed
}
.site-content:after,.site-footer:after,.site-header:after{
    clear:both
}
#nav_menu-2,#nav_menu-3{
    font-family:akzidenz-grotesk-medium!important
}
.overlay{
    height:100%;
    width:0;
    position:fixed;
    z-index:1;
    left:0;
    top:0;
    background-color:#fff;
    overflow-x:hidden;
    transition:.5s
}
.overlay-content{
    position:relative;
    top:25%;
    width:100%;
    text-align:center;
    margin-top:30px
}
.overlay a{
    padding:8px;
    text-decoration:none;
    color:#000;
    display:block;
    transition:.3s
}
.overlay a:focus,.overlay a:hover{
    color:#f1f1f1
}
.menu-open{
    width:200px;
    padding:0 0 60px 20px;
    text-align:center
}
.size-post-thumbnail{
    padding:8px 0 8px 0;
    width:100%
}
#content{
    margin: 80px 4vw;
}
#title{
    padding:10px 0
}
.titelschrift{
    padding:0 0 10px 0;
    font-family:akzidenz-grotesk-medium!important

}
.titelschrift p{
    margin:0!important
}
.logo{
    font-family:akzidenz-grotesk-medium!important;
    font-size:1.5em;
    z-index:1000000;
    margin: 0 0 0 4vw;

}

h1{
    font-family:akzidenz-grotesk-medium!important;
    font-size: inherit !important;
    z-index:1000000
}

.item{
}

.row{
    margin:0!important
}

@keyframes left{
    0%{
        left:-15%
    }
    40%{
        left:1%
    }
    100%{
        left:-15%
    }
}
@keyframes right{
    0%{
        right:-15%
    }
    50%{
        right:1%
    }
    100%{
        right:-15%
    }
}
@keyframes animation-left{
    0%{
        left:-45%
    }
    50%{
        left:-150px
    }
    100%{
        left:-20%
    }
}
@keyframes animation-right{
    0%{
        right:-45%
    }
    50%{
        right:-150px
    }
    100%{
        right:-20%
    }
}
@keyframes animation-bottom{
    0%{
        bottom:-25%
    }
    50%{
        bottom:-100px
    }
    100%{
        bottom:-20%
    }
}
.collapsible{
    cursor:pointer;
    width:100%;
    border:none;
    text-align:left;
    outline:0;
    padding:0 0 10px 0;
    color:#00f;
    background: none;
}
.collapsible:after{
    content:'✗';
    color:#000;
    float:right;
    -ms-transform:rotate(-60deg);
    transform:rotate(-60deg)
}
.actives:after{
    content:"\2212";
    color:red
}
.site-footer{
    position:fixed;
    bottom:5%
}
.site-info{
    width:100vw;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-left:-20px!important
}
.social-media{
    padding-right:5%
}
.page-content{
    margin:1.5em 0 0
}
.page-links{
    clear:both;
    margin:0 0 1.5em
}
.page-content .wp-smiley{
    border:none;
    margin-bottom:0;
    margin-top:0;
    padding:0
}
embed,object{
    max-width:100%
}
.chocolat-open{
    overflow:hidden
}
.chocolat-overlay{
    height:100%;
    width:100%;
    position:fixed;
    left:0;
    top:0;
    z-index:10;
    background-color:#fff;
    display:none
}
.chocolat-content{
    position:fixed;
    top:50%;
    left:50%;
    z-index:14;
    text-align:left
}
.chocolat-content .chocolat-img{
    position:absolute
}
body.chocolat-open>.chocolat-overlay{
    z-index:15
}
body.chocolat-open>.chocolat-content{
    z-index:17
}
.chocolat-in-container .chocolat-content,.chocolat-in-container .chocolat-overlay{
    position:absolute
}
.chocolat-in-container{
    position:relative
}