body{
	overflow-x: hidden; 
}
.detailProjectBox2{
    width: 80%;
    margin: 0 auto;
    position: relative;
    padding-top: 35px;
    padding-bottom: 35px;
    padding-right: 10%;
}
.colImage{
	float: right;
}
.colImage img{
	border:20px solid #fbfaf8;
	width: 100%;
	height: auto;
}
.colText{
	position: relative;
    left: 10%;
    top: 95px;
    z-index: 10;
}
.colText p{
	background: rgba(255,255,255, 0.9);
	padding: 20px;
	color: #909090;
	text-align: justify;
	font-weight: lighter;
	margin-bottom: 2px;
	width: 80vh;
}
.colText h2{
	margin-left: 20px;
	font-size: 2.275rem;
}


/*  #################################   MOBILE CSS   ##########################  */

@media screen and (min-width: 1025px) and (max-width: 1366px){  
	.colText{
		top: 40px;
	}
}

/*  Landscape tablets 1024px */
@media (max-width: 1024px) {
	.detailProjectBox2 {
    	width: 90%;
    	padding-right: 0;
    }
    .colText {
	    position: relative;
	    left: 0;
	    top: 45px;
	    z-index: 99;
	    width: 70%;
	}
	.colText p{
		padding: 15px;
	}
	.colText h2{
		font-size: 32px;
	}
}	
/*  Landscape phones and portrait tablets */
@media (max-width: 768px) {
	.colImage{
		float: none;
		text-align: center;
	}
	.colImage img{
		width: 100%;
		height: auto;
	}
	.colText {
	    position: relative;
	    left: 0;
	    top: 0;
	    z-index: 0;
	    width: 100%;
	    padding-bottom: 15px;
	}
	.colText p{
		padding: 0;
		width: auto;
	}
	.colText h2{
		margin: 0;
		text-align: center;
		padding-bottom: 10px;
	}
	.detailProjectBox2{
		width: 100%;
		padding-right: 0;
	}
}
