@media screen and (max-width: 1023px) {
.card-title{font-size:22px}
	.handwerker-1{ 
		background-image: url("../images/taurus-crosstrainer.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}

	.handwerker-2{ 
		background-image: url("../images/kettler-ergometer.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}

	.handwerker-3{ 
		background-image: url("../images/laufband.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}
	.handwerker-4{ 
		background-image: url("../images/taurus-crosstrainer.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}

	.handwerker-5{ 
		background-image: url("../images/taurus-crosstrainer.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}
	.handwerker-6{ 
		background-image: url("../images/taurus-crosstrainer.jpg");
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-color:#ffffff;
	}
}


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

.handwerker-1{ 
	background-image: url("../images/taurus-crosstrainer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}

.handwerker-2{ 
	background-image: url("../images/kettler-ergometer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}

.handwerker-3{ 
	background-image: url("../images/laufband.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}
.handwerker-4{ 
	background-image: url("../images/taurus-crosstrainer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}

.handwerker-5{ 
	background-image: url("../images/taurus-crosstrainer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}
.handwerker-6{ 
	background-image: url("../images/taurus-crosstrainer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-color:#000000;
}
}

.button-card:hover {
  color: #FFFFFF;
  background-color: #baaf9d;
}

.button-card{
  color: #baaf9d;
  background-color: #FFFFFF;
  border-style: default;
  border-radius: 30px 30px 30px 30px;
  padding: 10px 20px 10px 20px;
}
.col-sm-4{border:5px solid #fff;}

/* Card anordnung bis 768px einzelanzeige mittig */
@media screen and (max-width: 1023px) {

.startcard{
max-width: 1140px;
  }

}
@media screen and (min-width: 1024px) {
  .startcard{
     max-width: 1140px;
	 margin-top:5%;
  }
}

.card-title{
	color:#000000;
	text-transform: uppercase;
}
.card-title{
  font-size: 36px;
}
@media screen and (max-width:366px){ 
	.card-body{
		margin:80% 0 0 0px;
		padding-top:20px;
		color:#fff;
		text-align:center;
		background:#ff8f15;
		height:300px;
	}
	.card-body:hover{	
	}
	 .col-sm-4{
        margin-left:20px;
		margin-right:20px;
		padding-right: 0;
		padding-left: 0;
	}
	
}
@media screen and (min-width: 367px) and  (max-width:575px){ 
	.card-body{
		margin:80% 0 0 0px;
		padding-top:20px;
		color:#fff;
		text-align:center;
		background:#ff8f15;
		height:260px;
	}
	.card-body:hover{	
	}
	 .col-sm-4{
                  margin-left:20px;
		  margin-right:20px;
		  padding-right: 0;
		  padding-left: 0;
	}
	
}
@media screen and (min-width: 576px) and (max-width: 766px) {
	.card-body{
		margin:60% 0 0 0px;
		padding-top:20px;
		color:#fff;
		text-align:center;
		background:#ff8f15;
		height:410px;
	}

	.card-body:hover{	
	}
	.col-sm-4{
                  margin-left:0px;
		  margin-right:0px;
		  padding-right: 0;
		  padding-left: 0;
	}
}

@media screen and (min-width:767px) and (max-width: 1023px) {
	.card-body{
		margin:80% 0 0 0px;
		padding-top:20px;
		color:#fff;
		text-align:center;
		background:#ff8f15;
		height:350px;
	}

	.card-body:hover{
	}
	.col-sm-4{
                  margin-left:0px;
		  margin-right:0px;
		  padding-right: 0;
		  padding-left: 0;
	}
	.handanni {
		  display: inline-block;
		  }
	.handanni:before {
		  content: "";
		  position: absolute;
		  z-index: -1;
		  top: 0;
		  left: 12px;
		  right: 12px;
		  bottom: 0;
		 /* background-color:rgba(34,136,161,0.9);*/
		  background-color:rgba(255,164,31,0.9);
		  border:0px solid #fff;	  
}
}



@media screen and (min-width:1024px){
	.card-body{
		margin:14px;
		padding-top:20px;
		min-height:330px;
		opacity: 0;
		transition: 0.7s;
		transform: translateY(20px);
		color:#ffffff;
		text-align:center;
	}

	.card-body:hover{
		opacity:1;
		transform: translateY(0px);
	}
	.handanni {
		  display: inline-block;
		  vertical-align: middle;
		  -webkit-transform: translateZ(0);
		  transform: translateZ(0);
		  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
		  -moz-osx-font-smoothing: grayscale;
		  position: relative;
		  background:;
		  -webkit-transition-property: color;
		  transition-property: color;
		  -webkit-transition-duration: 0.3s;
		  transition-duration: 0.3s;
	}
	.handanni:before {
		  content: "";
		  position: absolute;
		  z-index: -1;
		 top: 12px;
		  left: 12px;
		  right: 12px;
		  bottom: 12px;
		  background-color:rgba(255,164,31,0.9);
			border:6px solid #ff8f15;
		  -webkit-transform: scale(0);
		  transform: scale(0);
		  -webkit-transition-property: transform;
		  transition-property: transform;
		  -webkit-transition-duration: 0.3s;
		  transition-duration: 0.3s;
		  -webkit-transition-timing-function: ease-out;
		  transition-timing-function: ease-out;
	}
	.handanni:hover, .handanni:focus, .handanni:active {
	  color: white; 
	}
	.handanni:hover:before, .handanni:focus:before, .handanni:active:before {
	  -webkit-transform: scale(1);
	  transform: scale(1);
	}
}