/*
    features.css
    attoverticale.de | 27/01/2019 | CSS
    (c) Copyright 2019 web-communication.eu
*/



.features {
	position:					relative;
	margin: 					0 auto;
	width:						100%;
	max-width:					960px;
	background:					#FFccFF;
	padding: 					0;
	text-align: 				center;
	overflow: 					hidden;
	font-size: 					0;
}

.features .container {
	width: 						100%;
	display: 					inline-block;
	padding:					50px 0;
	/*margin-bottom: 50px;*/
	background:					#FFccFF;
}

.features .column {
	position:					relative;
	float: 						left;
	text-align: 				center;
	width:						10%;
	margin-left: 				4%;
	padding: 					0;
	overflow: 					hidden;
	
	background: #ccc;
	/*
	 border-radius:             40px;
    -moz-border-radius:        40px;
    -webkit-border-radius:     40px;*/
	
	/* border:5px solid #fff;
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box;     
    box-sizing: border-box; */
}

.features .column a {
	display:					block;
	text-decoration:			none;
}



.features img {
	width: 						100%;
	display: 					block;
}

.features img { 
	transition: all .4s ease-in-out; 
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
}
.features img:hover { 
	-webkit-transform: scale(1.1); 
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.features .topic {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 25%;
	background: rgba(0,0,0,.5);
	display:					block;
	padding: 10px;
	text-align: left;
}


.features .topic h1 {
	font-family: Verdana, 'sans serif';
	font-size: 14px;
	font-weight: bold;
	color: #fff;
}

.features .topic p {
	font-family: Verdana, 'sans serif';
	font-size: 12px;
	font-weight: normal;
	color: #fff;
}

.features .price {
	position: absolute;
	top: 10px;
	right: 10px;
	text-align: right;
	font-family: Verdana, 'sans serif';
	font-size: 12px;
	font-weight: bold;
	color: #fff;
}


/* responsive */

@media only screen and (max-width: 760px) {
	
	.features .container {
		padding:						0;
		padding-top:					5%;
	}
	.features .column {
		width:						40%;
		margin: 					5%;
		margin-top:					0;
	}
	
}


@media only screen and (min-width: 320px) and (max-width: 480px) {
/*
	.imgline .column {
		
		width:						100%;
		margin:		 				0;
		
		 border:3px solid #fff;
   
	}
	
	.imgline .container {
		width: 						98%;
	}
	
	.imgline .topic {
		height: 28%;
	}
	*/
}



@media only screen and (min-width: 481px) and (max-width: 720px) {
		/*
	.imgline .column {
		
		width:						50%;
		margin:		 				0;
		
	 border:3px solid #fff;
  
	}
	
	.imgline .container {
		width: 						98%;
	}
	
	.imgline .topic {
	display: none;
	}
	*/
}

@media only screen and (min-width: 721px) and (max-width: 860px) {
	/*
	.imgline .topic {
	display: none;
	}
*/
}	

@media only screen and (min-width: 721px) and (max-width: 989px) {
	/*
.imgline .column {
		
		width:						50%;
		margin:		 				0;
		
 border:3px solid #fff;
    
	}
	
	.imgline .container {
		width: 						98%;
	}
	*/
}	

@media only screen and (min-width: 990px) and (max-width: 1366px) {
	/*
.imgline .column {
		
		 border:3px solid #fff;
  
	}
	*/
}