body {
    
font-family: 'Oswald', sans-serif !important;
    background: #ECECEC !important;

}


a:hover{
text-decoration: none !important;

}

header{
position: fixed;
z-index: 999;
top: 0
}

#mob-pag-bttns{
display:none;
}

#mob-menu{
float: right !important;
margin-right: -20px
}

@viewport {
   width: device-width;
   user-zoom:fixed;
}

#site-title{

margin-top: 4px !important;
}

.masonrytext {
display:none;
}


p{
color: #000000 !important;

}

.float {
position:relative;
float:right;
width: 100%
}

#nextAlbum{
position:absolute;
right:25px;

}

#albums{
    margin: 1.5em 1.5em;
margin-top: 7em;
/* 
width: 98%;
margin: 1.5em auto; */
}

nav li{
margin-right: 0px !important;
margin-left: 35px !important;

}

h1.site{
letter-spacing: 0.5em !important;
font-size: 1.2em !important;
font-weight: 600 !important;

}

.k-nav-list {
  	float: right;
   letter-spacing: 0.2em !important;
   font-weight: 400 !important;
font-family: 'Quattrocento Sans', sans-serif !important;
    
}

/* Navigation Ende */

#abouttext{
margin-top: 7em;

 max-width: 300px;
}


#abouttext h1{
font-family: 'Oswald', sans-serif !important;
letter-spacing: -1px;
text-transform: uppercase;
font-weight: 300;
}

/* Image-Hover */

#album-intro {
    background-color: #ECECEC !important;
    bottom: 0 !important;   
    left: 0 !important;    
    
}

#albumcategory{ 

font-size: 2em !important;
color: #000000 !important;
 line-height: 0 !important;
 text-transform: uppercase;
font-weight: 600;

}  

#album-intro p{
}


/* Masonry */



/* Image-Hover  END*/









@media only screen and (min-width: 900px) {
  
    .wrap{
position: absolute !important;    
bottom: 0 !important;    
left: 0 !important;    

}

.masonry{
    padding: 0;
    -moz-column-gap: 1.75em;
    -webkit-column-gap: 1.75em;
    column-gap: 1.75em;
    font-size: .85em;
}


.item {
       display: inline-block;
    background: #ECECEC;
    padding: 0em;
    margin: 0 0 1.5em;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;

}






#albums{
    margin: 1.5em 1.5em;
margin-top: 9.5em;
/* 
width: 98%;
margin: 1.5em auto; */
}

#abouttext{
margin-top: 9.5em;
 max-width: 100%;

}
 
.in{
    margin: 1.5em 1.5em;
}

#itemcontainer {
    position: relative;
}

.TTmasonryimage {
opacity: 1;
   display: block;
  width: 100%;
  height: auto;
}

.middlePORTRAIT {
  position: absolute;
  top: 0em;
  bottom: 0em;
  left: 0em;
  right: -0.01em;

  opacity: 0;
  background-color: #EC644B;
  
 
}

.middleCOMMERCIAL {
  position: absolute;
  top: 0em;
  bottom: 0em;
  left: 0em;
  right: -0.01em;

  opacity: 0;
  background-color: #008CBA;
 
}

.middleEDITORIAL {
  position: absolute;
  top: 0em;
   bottom: 0em;
  left: 0em;
  right: -0.01em;

  opacity: 0;
  background-color: #4ECDC4;
  
}

#itemcontainer:hover .middlePORTRAIT {
  opacity: 1;
}

#itemcontainer:hover .middleEDITORIAL {
  opacity: 1;
}

#itemcontainer:hover .middleCOMMERCIAL {
  opacity: 1;
}

.masonrytext {
opacity: 1;
  color: white;
 
  position: absolute;
bottom: 1em;
left: 1em;   
right: 1em;
font-size: 1.8em; 
text-transform: uppercase;
 line-height: 1;

 /*
 border-style: solid;
padding: 0.2em;
*/
 
}    

#masonrycategory{ 

font-weight: 600;


}  
 
 

#lane .cell {
    padding: 0 1.5em 0 0 !important;
} 

  
    .masonry {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
    }

#albums{
    margin: 1.5em 1.5em;
margin-top: 4.5em;
/* 
width: 98%;
margin: 1.5em auto; */
}


#abouttext{
margin-top: 4.5em;
 max-width: 100%;

}


#album-intro .wrap {
    padding: 40px 40px 0px 25px !important;


}



@media only screen and (min-width: 1100px) {
    .masonry {
        -moz-column-count: 4;
        -webkit-column-count: 4;
        column-count: 4;
    }
.masonrytext {
display:inline;
}

    
}

@media only screen and (min-width: 1440px) {
    .masonry {
        -moz-column-count: 5;
        -webkit-column-count: 5;
        column-count: 5;
    }

    

}
