/*
Dunkles Grün (Schrift auf Karte) #109a89
Helles Grün (Hintergrund) #f2f9f9

*/




*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  font-family: 'Oswald', sans-serif;
  font-size: 100%;
  letter-spacing: 0px;
  line-height: 120%;
  margin:0;
  padding:0;
  width:100%;
  background-color: #f2f9f9;
}

h1{
 color: #767676;
 font-weight:normal; 
}
.index-h{
  max-width:1200px;
  width:100%;
  margin:0 auto;
}
.title-h{
	padding:15px;
}
.title-h img{
	width:300px;
}
.memeimg-h{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.working, .texting{
	padding:15px;
	max-width:550px;
}
.working{
  width:100%;
  max-width:550px;
}
.working img{
	width:100%;
}
.texting{
  width:100%;
  max-width:500px;
}
.meme-select{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;	
  justify-content: space-between;
}
.select-h{
  width:47%;
  flex-wrap: wrap;
  padding-top:0px;
  padding-bottom:30px;
}
.select-h img{
	width:100%;
	cursor:pointer; 
}

.myform{
  font-size:100%;
}
.frm-control{
  width:100%;
  margin-bottom:3px;
  font-size:120%;
  font-family: 'Oswald', sans-serif;
  padding:5px;
  
}
textarea.frm-control{
  min-height:100px;
}
.smalltext{
  margin:0;
  padding:0;
  font-size:80%;
  color:grey;
  margin-bottom:15px;
}
.button{
  display:block;
  margin-bottom:3px;
  font-family: 'Oswald', sans-serif;
  background-color: #109a89;
  color:#ffffff; 
  font-size:150%;
  padding:10px 15px;
  cursor:pointer;  
  margin-top: 30px;
}


.gallery-h{
  max-width:1400px;
  margin: 0 auto; 
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content:space-around;
  justify-content: center;
}
.gallery-img{
  max-width:350px;
  padding:15px 15px 0 15px;
}
.gallery-img img{
	width:100%;
}
.yourcard-h{
	position:relative; 
	width:100%; 
	margin: 25px auto;  
	padding: 25px;
	max-width: 550px;
}
.yourcard-h .title-h{
	margin-bottom: 30px;
}
.yourcard{
	position:relative; 
}
.mainimage{
	width:100%; 
  box-shadow: 3px 3px 9px 1px rgba(0,0,0,0.5);
}
.sujetimg{
	border:1px solid #B6B6B3;
}

.share-link{
	position:absolute; 
	top:-7px;
	right:0px;
	padding:0;
	margin:0; 
	text-align:right;
	opacity: 0.5;
}
.shareimg{
	width:40px !important;
}



/* Footer */
 

/* Responsive */
@media only screen and (max-width: 1230px) {
  body::before,
  body::after {
    content: '';
    position: fixed;
    top: 0;
    right: 0;
    border-color: transparent;
    border-style: solid;
  }

  body::before {
    border-width: 1.5em;
  }

  body::after {
    border-radius: 0.4em;
    border-width: 1.35em;
    border-right-color: black;
    border-top-color: black;
  }
  body{
    margin:0;
    padding:0;
  }
  .user-letter, .basket-counter{
    top:0.5vw;
  }
  
  .index-h{
  max-width:100%;
  width:100%;
  margin:0 auto;
}
.working{
  width:100%;
  max-width:100%;
}
  
}
@media only screen and (max-width: 1050px) {
  body::after {
    border-right-color: red;
    border-top-color: red;
  }
  body{
  }
  
}

@media only screen and (max-width: 800px) {
   body::after {
    border-right-color: yellow;
    border-top-color: yellow;
  }
  body{
  }
  
}

@media only screen and (max-width: 720px) {
   body::after {
    border-right-color: blue;
    border-top-color: blue;
  }
  body{
  }
 
}
@media only screen and (max-width: 620px) {
	
  .product-text h2{
    padding-top:50px;
  }
  .aktion-h .product-text h2{
    padding-top:70px;
  }
	
}

@media only screen and (max-width: 550px) {
  body::after {
    border-right-color: pink;
    border-top-color: pink;
  }
  body{
  }
 
}
@media only screen and (max-width: 440px) {
   body::after {
    border-right-color: green;
    border-top-color: green;
  }
  body{
  }
  
}
@media only screen and (max-width: 350px) {
	body::after {
     border-right-color: brown;
     border-top-color: brown;
    }
	body{
    }
  
}
