@import url('https://fonts.googleapis.com/css?family=Architects+Daughter');

/* Polaroid Listenelement */

ul.polaroid{
max-width:100%;
margin: 2em auto;
}
ul.polaroid li {
position: relative;
display:inline-block;
background-color:white;
background: linear-gradient(110deg, white, oldlace);
box-shadow:4px 4px 15px gray;
max-width:250px;
vertical-align:top;
list-style:none;
margin:0;
transition: all ease 0.6s;
}
ul.polaroid li:hover {
z-index:998;
transform: scale(1.1) rotate(0deg);
}
ul.polaroid a {
text-decoration:none;
font-family:'Architects Daughter';
color:dimgray;
}
ul.polaroid img {
max-width:90%;
height:auto;
margin:5% 5% 0 5%;
}
ul.polaroid span{
display:inline-block;
width:90%;
min-height:54px;
margin: 0 5% 5% 5%;
text-align:center;
}


/* Vortaeuschung eines zufaelligen Winkels */

.polaroid li:nth-child(2n+1) {
transform: rotate(-2deg);
}
.polaroid li:nth-child(3n+2) {
transform: rotate(1deg);
}
.polaroid li:nth-child(4n+3) {
transform: rotate(4deg);
}
.polaroid li:nth-child(5n+4) {
transform: rotate(-6deg);
}
.polaroid li:nth-child(6n+5) {
transform: rotate(4deg);
}

/* Figure und Figcaption */

figure a img:hover {
transform: scale(1); transition: all 0.5s ease-out;
/* Nur fuer diese Seite */
}

figure.polaroid{
background-color:white;background: linear-gradient(110deg, white, oldlace);
box-shadow:4px 4px 15px gray;
max-width:250px;
vertical-align:top;
transform:rotate(0.0deg);
transition:all ease 0.6s;
}
figure.polaroid:hover {
transform: scale(1.1) rotate(0deg);
}
figure.polaroid a {
text-decoration:none;
font-family:'Architects Daughter';
color:dimgray;
}
figure.polaroid img {
max-width:90%;
height:auto;
margin:5% 5% 0 5%;
}
figure.polaroid figcaption{
width:90%;
min-height:52px;
margin: 0 5% 5% 5%;
text-align:center;
font-family:'Architects Daughter';
color:dimgray;
}
.polacenter{
margin-left:auto;
margin-right:auto;
display:block;
}

/* Polaroid Mini */
ul.polaroidmini{
max-width:550px;
margin-left:auto;
margin-right:auto;
}
ul.polaroidmini li {
list-style:none;
max-width: 130px;
display:inline-block;
background-color:white;
background:linear-gradient(110deg, white, oldlace);
box-shadow: 4px 4px 15px gray;
vertical-align: top;
margin:1px;
position:relative;
}
ul.polaroidmini img {
max-width: 90%;
height: auto;
margin: 5% 5% 0 5%;
}
ul.polaroidmini span {
font-family:'Architects Daughter';
display: inline-block;
width: 90%;
min-height: 25px;
margin: 0 5% 5% 5%;
text-align: center;
font-size:1.2em;
line-height:0.9em;
}
ul.polaroidmini li:first-child {
background-color:goldenrod;
background:linear-gradient(110deg, goldenrod, orange);
color:white;
}
ul.polaroidmini li.effects{
position: relative;
transform: rotate(4deg);
transition: all ease 0.6s;
}
ul.polaroidmini li.effects:hover{
transform: scale(1.4) rotate(0deg);
z-index: 999;
}
.polaroidmini li.effects.soundso:nth-child(2n+1){
transform: rotate(8deg);
background-color:white;
background:linear-gradient(110deg, white, oldlace);
color:dimgray;
}
.polaroidmini li.effects.soundso:nth-child(3n+2){
transform: rotate(-8deg);
}
.polaroidmini li.effects.soundso:nth-child(5n+3){
transform: rotate(5deg);
}
.polaroidmini li.effects.soundso:nth-child(7n+5){
transform: rotate(-1deg);
}
.polaroidmini li.effects.soundso:nth-child(11n+7){
transform: rotate(4deg);
}
ul.polaroidmini li.effects.soundso:hover {
transform: scale(1.4) rotate(0deg);
z-index: 999;
}