/*
    title.css
    web-communication.eu | 14/06/2017
    Copyright 2017 web-communication.eu
*/


.half {
	position:					relative;
	margin:						0 auto;
	width:						100%;
	background:  #000 url('../images/screenk.jpg');
	padding: 200px 0;
	background-position: -100px -150px;
	/*
	background-position: 		center;
	-webkit-background-size:	cover;
	-moz-background-size: 		cover;
	-o-background-size: 		cover;
	background-size: 			cover;
	*/
	overflow: hidden;
}


.half .content-right { 
    position:						absolute;
    top: 							0;
	right:							-15%;
	width: 							70%;
	height: 						100%;
	background: 					#eee;
	padding:    					100px 0 0 100px;
	
	-ms-transform: 					skew(-40deg);/* IE 9 */
	-webkit-transform: 				skew(-40deg);
	   -moz-transform: 				skew(-40deg);
	     -o-transform: 				skew(-40deg);
			transform: 				skew(-40deg);
}


.half .content-left { 
    position:						absolute;
    top: 							0;
	left:							-15%;
	width: 							60%;
	height: 						100%;
	background: 					#fff;
	padding:    					100px 0 0 230px;
	
	-ms-transform: 					skew(40deg);/* IE 9 */
	-webkit-transform: 				skew(40deg);
	   -moz-transform: 				skew(40deg);
	     -o-transform: 				skew(40deg);
			transform: 				skew(40deg);
}




.half .topic {
	margin: 					0;
	padding: 					0;
	font-family:         		'Verdana'; 
	width: 						70%;
	padding: 					20px;
	
	
	
	-ms-transform: 					skew(40deg); /* IE 9 */
	-webkit-transform: 				skew(40deg);
	   -moz-transform: 				skew(40deg);
	     -o-transform: 				skew(40deg);
			transform: 				skew(40deg);
	
}

.half .topic .bg {
	padding: 0;
}

.half .topic p {
    font-size:		            18px; 
	font-weight:    		    normal;
	color: 						#000; 
	padding: 					5px 2px;
	
}

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

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

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

/* responsive */	

@media only screen and (max-width: 1135px) {
	
	
	
}

@media only screen and (max-width: 1280px) {
	
	.half .topic h1 {
		font-size: 				24px; 
		
	}
	
}

@media only screen and (min-width: 1441px) {
	/*
	.title {
		width: 			1440px;
	}
*/
}	
@media only screen and (min-width: 1441px) and (max-width: 1919px){
	/*
	.title {
		width: 			1440px;
	}
*/
	.title .topic {
		padding: 					120px 300px;
	}
}	

@media only screen and (min-width: 1920px) {
	
	.title .topic {
		padding: 					120px 450px;
	}
}