.main-1{
	position:relative;
}

.main-1 h1{
	background-image:url(/img/title_home1.png);
	background-size:100% 100%;
	display:table;
	color:#fff;
	font-size:48px;
	padding:10px 20px;
	margin-top:80px;
}

.main-1 h1 i{
	font-style:normal;
	font-size:38px;
}

.main-1 p{
	background-image:url(/img/paragraph.png);
	background-size:100% 100%;
	display:table;
	font-size:27px;
	color:#084668;
	padding:42px 78px 50px;
	line-height:38px;
}

.main-1 p i{
	font-size:18px;
}


.main-1 .photo-frame{
	position:absolute;
	left:0;
	top:0;
	transform:rotate(-5deg);
}

.main-2{
	position:relative;
	display:inline-block;
	width:100%;
	margin-bottom:160px;
}

.about{
	padding:100px 0;
	position:relative;
}

.main-2 .photo-frame,
.about .photo-frame{
	transform:rotate(1deg);
	position:absolute;
	right:70px;
}

.main-2 .photo-frame{
	top:-90px;
}

.main-2 p,
.about p{
	float:left;
	font-size:22px;
	color:#084668;
	padding:34px 150px 50px 60px;
	line-height:31px;
	text-align:right;
	background-image:url(/img/paragraph-2.png);
	background-size:100% 100%;
}

.about p b{
	font-weight:normal;
	background-image:url(/img/title_home4.png);
	background-size:100% 100%;
	display:inline-block;
	padding:5px;
	margin-right:-5px;
}

.main-2 p b{
	font-family:Aspaklarya;
	display:inline-block;
	margin:20px 0;
	font-size:38px;
}

.main-2 p i,
.about p i{
	font-size:18px;
}

.about>span{
	display:inline-block;
	width:100%;
	text-align:left;
}

.about>span>a{
	background-color:#084668;
	color:#fff;
	font-size:28px;
	border-radius:27px;
	padding:11px 30px 12px;
	text-decoration:none;
	font-weight:500;
	margin:15px 0 0 200px;
	display:inline-block;
	transition:background-color 0.2s ease;
	cursor:pointer;
}

.about>span>a:hover{
	background-color:#05283b;
}

.compass>div{
	position:relative;
	width:700px;
	display:inline-block;
}

.compass>div a{
	display:inline-block;
	position:absolute;
	height:65px;
}

.compass>div a:active{
	background-color:rgba(255,255,255,0.5);
}

.compass>div a:nth-child(1){
	left:50%;
	margin-left:-52px;
	width:145px;
	top:0;
}

.compass>div a:nth-child(2){
	top:42%;
	right:0;
	width:140px;
}

.compass>div a:nth-child(3){
	top:43%;
	left:0;
	width:215px;
}

.compass>div a:nth-child(4){
	left:50%;
	margin-left:-70px;
	width:215px;
	bottom:0;
}

@media only screen and (max-width:1200px){
	.main-1{
		height:auto!important;
	}

	.main-1 h1{
		font-size:18pt;
		margin:0 0 10pt;
		display:inline-block;
	}

	.main-1 p{
		padding:10%;
    	font-size:15pt;
		line-height:21pt;
	}

	.main-2{
		margin-bottom:20pt;
	}

	.compass>div{
		width:100%;
	}

	.compass>div img{
		width:100%;
	}

	.about{
		padding:5% 0;
	}

	.about>span>a{
		margin:0 10%;
    	width:80%;
		padding:10pt 0;
    	text-align:center;
		font-size:18pt;
	}

	.main-2 p, .about p{
		padding:5%;
    	font-size:14pt;
		line-height:18pt;
		background:#fff;
		border-radius:12pt;
	}
}