/*==== ABOUT ==== */
.about{
display:flex;
justify-content:center;
align-items:center;
box-sizing:border-box;
width:100%;
height:800px;
background-color:#313333;
}

.about-wrapper{
box-sizing:border-box;
width:1200px;
z-index:999;
display:flex;
flex-wrap:wrap;
flex-direction:column;
height:700px;
}
		
	.image-wrapper
	{
	display:flex;
	justify-content:center;
	align-items:center;
	height:600px;
	width:600px;
	margin:auto 0px;
	background-color:white;
	}
		.image-wrapper img
		{
		height:100%;
		width:100%;
		transform:skew(0deg);
		}
		
	.promise
	{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	height:600px;
	width:580px;
	margin:auto 0px;
	padding:20px;
	background-color:#313333;
}


		.text-promise
		{
		height:60px;
		width:600px;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1.2rem;
		line-height:1.8rem;
		color:orange;
		text-align:center;
		margin:auto;
		display:flex;
		align-items:center;
		justify-content:center;
		}
	
	
		.para
		{
		display:flex-start;
		justify-content:center;
		align-items:center;
		height:500px;
		width:500px;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1.2rem;
		line-height:1.6rem;
		color:gray;
		margin:10px;
		}
















/*MOBILE*/

@media screen and (max-width:768px)
{
.about{
width:100%;
height:1100px;
}


.about-wrapper{
box-sizing:border-box;
width:400px;
height:1100px;
z-index:999;
flex-wrap:wrap;
flex-direction:row;
justify-content:center;
align-items:center;
margin:0px auto;
background-color:#313333;
}

.image-wrapper
	{
	display:flex;
	justify-content:center;
	align-items:center;
	height:300px;
	width:300px;
	background-color:white;
	border-radius:10px;
	}




	.image-wrapper img
		{
		height:100%;
		width:100%;
		}



	.promise
	{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	height:680px;
	width:100%;
	}

	.text-promise
		{
		height:200px;
		width:100%;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1.6rem;
		line-height:1.8rem;
		color:orange;
		text-align:center;
		margin:auto;
		display:flex;
		align-items:center;
		justify-content:center;
		}

	
	.para
		{
		justify-content:center;
		height:800px;
		width:100%;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1rem;
		line-height:1.2rem;
		color:gray;
		margin:auto;
		}

}



/*TABLET*/
@media screen and (min-width:768px) and (max-width:1024px)
{

.about{
box-sizing:border-box;
width:100%;
height:900px;
}



.about-wrapper{
display:flex;
justify-content:center;
height:900px;
z-index:999;
display:flex;
flex-wrap:wrap;
flex-direction:row;
margin:auto;
background-color:#313333;
}

.image-wrapper
	{
	display:flex;
	justify-content:center;
	align-items:center;
	height:400px;
	width:400px;
	background-color:white;
	border-radius:10px;
	}



.image-wrapper img
		{
		height:100%;
		width:100%;
		}

.promise
	{
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	height:480px;
	width:600px;
	}

	.text-promise
		{
		margin:0px auto;
		height:30px;
		width:500px;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1rem;
		color:orange;
		display:flex;
		align-items:center;
		justify-content:center;
		}

	
	.para
		{
		display:flex-start;
		justify-content:center;
		align-items:center;
		height:400px;
		width:100%;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1rem;
		line-height:1.4rem;
		color:gray;
		margin:auto;
		padding:20px;
		}

}





/*PC*/
@media screen and (min-width:1024px) and (max-width:1680px)
{

.about{
box-sizing:border-box;
width:100%;
height:700px;
background-color:#313333;
}



.about-wrapper{
height:100%;
z-index:999;
display:flex;
width:1000px;
flex-wrap:wrap;
flex-direction:column;
margin:auto;
background-color:#313333;
}

.image-wrapper
	{
	display:flex;
	justify-content:center;
	align-items:center;
	height:380px;
	width:380px;
	margin:auto;
	background-color:white;
	}



.image-wrapper img
		{
		height:100%;
		width:100%;
		}

.promise
	{
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	height:560px;
	width:600px;
	margin:100px 0px;
	}

	.text-promise
		{
		height:50;
		width:600px;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1rem;
		color:orange;
		margin:0px auto;
		}

	
	.para
		{
		display:flex-start;
		justify-content:center;
		align-items:center;
		height:400px;
		width:600px;
		font-family:"Trebuchet MS",sans-serif;
		font-size:1rem;
		line-height:1.4rem;
		color:gray;
		margin:0px auto;
		padding:30px;
		}

}