/*
    angleshape.css
    eastwestmoto.com | 21/01/2018
    Copyright 2018 web-communication.eu
*/


.angleshape {
	position:					relative;
	margin:						0 auto;
	width:						100%;
	text-align: 				center;
}

.triangle-box {
	position: 					relative;
	overflow: 					hidden;
}

.triangle-box div {
	float: 						left;
}


/*Down-left*/
.triangle-down-left {
    width: 						50%;
    height: 					0;
	padding-right:				50%;
    padding-bottom: 			5%; 
    overflow: 					hidden;
}

.triangle-down-left:after {
	content: 					"";
    display: 					block;
    width: 						0;
    height: 					0;
    margin-left:				-1000px; 
    margin-bottom:				-100px; 
    border-left: 				1000px solid transparent; 
    border-right: 				1000px solid transparent; 
    border-bottom: 				100px solid #FFFFFF; 
}

/*Down-right*/
.triangle-down-right {
    width: 						50%;
    height: 					0;
	padding-right:				50%;
    padding-top: 				5%; 
    overflow: 					hidden;
}

.triangle-down-right:after {
	content: 					"";
    display: 					block;
    width: 						0;
    height: 					0;
    margin-top:					-100px; 
    border-left: 				1000px solid transparent; 
    border-bottom: 				100px solid #FFFFFF; 
}









.angleshape .topic {
	margin: 					0;
	padding: 					180px 500px;
	font-family:         		'Verdana'; 
	
}

.angleshape .topic .bg {
	background: 			rgba(255,255,255,.7);
	padding: 25px 0;
}

.angleshape .topic p {
    font-size:		            16px; 
	font-weight:    		    normal;
	color: 						#000; 
	line-height: 				22px;
	padding: 					10px 60px;
	
}

.angleshape .topic h1 {
	font-family: 				'Michroma', sans-serif; 
	color:              		#000; 
	z-index: 10;
}

.angleshape .topic h2 {
	font-family: 				'Michroma', sans-serif;
	/*font-size:   		        18px;*/  
	color:              		#000; 
}

.angleshape .line {
	width: 						10%;
	margin: 					10px auto;
	position: 					relative;
	border-bottom: 				2px solid #ff00ff;
}

/* responsive */	

@media only screen and (max-width: 1135px) {
	
	.angleshape .topic {
		padding: 					130px 200px;
	}
	
}

@media only screen and (min-width: 1136px) and (max-width: 1280px) {
	
	.angleshape .topic {
		padding: 					140px 250px;
	}
	
}

@media only screen and (min-width: 1281px) and (max-width: 1440px) {
	
	.angleshape .topic {
		padding: 					150px 300px;
	}
	
}

@media only screen and (min-width: 1441px) and (max-width: 1680px) {
	
	.angleshape .topic {
		padding: 					160px 400px;
	}
}	