@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');

/***{border:2px solid red;}**/

body{
	margin:0;
	font-family:"Manrope", "Ubuntu", sans-serif;
	 overflow-x: hidden!important;
	 background: #fff !important;
}

h1 {
	font-size: calc(25px + (59 - 25) * ((100vw - 300px) / (1600 - 300)))!important;
	font-weight: 900!important;
	color: #626071!important;
}

h2 {
	font-size: calc(28px + (46 - 28) * ((100vw - 300px) / (1600 - 300)))!important;
	font-weight: 900!important;
	color: #626071!important;
}

h3 {
	font-size: 18px!important;
	font-weight: 700!important;
	color: #626071!important;
	padding: 6% 0 0 0;
}

h4 {
	font-size: 16px!important;
	font-weight: 700!important;
	color: #626071;!important;
	padding: 10px 0;
}


.title {
	text-align: center;
	padding: 4.8% 0 1.5% 0;
}

.subtitle {
	font-size: 18px;
	font-weight: 400;
	color: #454256;
	text-align: center;
	padding: 0 0 1% 0;
}

p {
	font-size: 17px;
	font-weight: 400;
	color: #454256;
	line-height: 1.2;
}

.under {
	font-size:15px;
}


#error-page {
background: #fff !important;
position:fixed !important;
position:absolute;
text-align:center;
top:0;
right:0;
bottom:0;
left:0;
z-index:99999;
}
#error-inner {
margin: auto;
}
#error-inner h1 {
text-transform:uppercase;color:white;margin-top:100px;font-size:20px;
}
.pesan-eror{
width:200px;
height:200px;
margin:0 auto 40px;
background:transparent;
color:#626071;
font-size:100px;
line-height:200px;
-moz-border-radius-topleft: 75px;
-moz-border-radius-topright:75px; 
-webkit-border-top-left-radius:75px;
-webkit-border-top-right-radius:75px; 
  border-top-left-radius:95px;
border-top-right-radius:95px; 
  border-bottom-left-radius:14px;
border-bottom-right-radius:14px;
position:relative;
  animation-name: floating;
	-webkit-animation-name: floating;

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes floating {
	0% {
		transform: translateY(0%);	
	}
	50% {
		transform: translateY(8%);	
	}	
	100% {
		transform: translateY(0%);
	}			
}

@-webkit-keyframes floating {
	0% {
		-webkit-transform: translateY(0%);	
	}
	50% {
		-webkit-transform: translateY(8%);	
	}	
	100% {
		-webkit-transform: translateY(0%);
	}			
}
.pesan-eror::after {
content:" ";
width:0;
height:0;
bottom:-30px;
border-color:#B3ADFD transparent transparent;
border-style:solid;
border-width:20px 20px 0;
position:absolute;
left:40%;
}
.balik-home {
  position:relative;
  margin:60px auto;
  display:block;
  padding:10px 15px 10px 15px;
  font-size:20px;
  border:0;
  color:#fff;
  border-radius:30px;
  outline:none;
  width:250px;
  height:50px;
  cursor:pointer;
  background-color: #06C387;
  box-shadow: 0 4px 8px rgba(0,0,0,.25);
}

.balik-home:hover {
  background:none;
  
}

.balik-home:after,.balik-home:before {
  position:absolute;
  background:#05ECA3;
  content:"";
  width:0%;
  height:100%;
  bottom:0px;
  left:0;
  z-index:-999999999;
  border-radius:30px;
  
}

.balik-home:before {
  background:#06C387;
  width:100%;
}

.balik-home:hover:after {
  width:100%;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}


.balik-home a{
	text-decoration: none!important;
	color: #fff!important;
}

.back-button {
	background: transparent;
	border: 0;
	color: #1988FF;
	font-size:30px;
	margin-top: 100px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.back-button:hover {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	color: #85D4FF;
	
}

a, button {
    display: block;
	outline: none!important;
}