@charset "utf-8";
/* CSS Document */

body, html { padding: 0; 
	         margin: 0; 
			 width: 100%;		 
} 

body { font-size: 15px;  
	   padding: 0; 
	   margin: 0; 
	   width: 100%; 
	   height: 100vh;
	   background-color: #1a4a5c;
	   background-image: url('img/background_pattern.png'); 
	   background-repeat: no-repeat; 
	   background-attachment: fixed;
	   background-position: center; 
	   background-size: cover;
	   position: relative; 
	   /*line-height: 32px; 
	   font-family: 'Poppins_Regular';*/
}

@font-face {
	  font-family: 'Libertad_ExtraBold';
	  src: url('fonts/libertad_extrabold.ttf');  
}

@font-face {
	  font-family: 'Libertad_Medium';
	  src: url('fonts/libertad_medium.ttf');  
}


.outer { display: table;
		 position: absolute;
		 top: 0;
		 left: 0;
		 height: 100%;
		 width: 100%;
}

.middle { display: table-cell;
          vertical-align: middle;
}

.inner { margin-left: auto;
         margin-right: auto; 
		 text-align: center; padding-left: 15px; padding-right: 15px;
         /*whatever width you want*/
}

.logo-img { width: 130px; }

.social-container { margin-top: 16px; }
.social-img { width: 50px; }


div.title { color: #be9446; 
            font-size: 47px; 
			font-family: 'Libertad_ExtraBold'; 
			line-height: 55px;
}

div.desc { color: #fff;
           font-size: 12.5px; 
		   font-family: 'Libertad_Medium';
}

.logo { left: 50%; 
        transform: translateX(-50%); 
		position: absolute; 
		top: 50px; 
		margin: 0; 
}

.copyright { left: 50%; 
             transform: translateX(-50%); 
		     position: absolute; 
		     bottom: 30px; 
		     margin: 0;
			 color: #4d8999; 
			 font-size: 10px; 
			 letter-spacing: 3px;
			 font-family: 'Libertad_Medium'; 
			 text-align: center;
}

.social-container a { margin-left: 6px; margin-right: 6px; }



@media screen and (max-width : 768px)
{
div.title { font-size: 38px;  
			line-height: 46px;
}

div.desc { color: #fff;
           font-size: 11px; 
}
.social-img { width: 45px; }
.social-container a { margin-left: 3px; 
                      margin-right: 3px; 
}
}


@media screen and (max-width : 580px)
{
div.title { font-size: 30px; 
			line-height: 40px;
}
div.desc { color: #fff;
           font-size: 10.5px; 
}
}

@media screen and (max-width : 480px)
{
div.title { font-size: 30px; 
			line-height: 28px; 
			margin-bottom: 10px;
}
.social-img { width: 43px; }
}


/*.content { 
  position: absolute;
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  text-align: center; 
  color: #fff;
}
.title1 { font-size: 45px; font-family: 'Helvetica_hv'; }
.title2 { font-size: 22px; font-family: 'Helvetica_roman'; }
.footer { position: absolute;
		  left: 50%; 
		  transform: translateX(-50%);  
		  bottom: 50px; 
		  text-align: center; 
		  display: inline-block; 
		  color: #fff; 
		  font-family: 'Helvetica_roman'; font-size: 21px;
}
.garis { position: absolute;
		  left: 50%; 
		  transform: translateX(-50%); border: 2px solid #fff; width: 35px; margin-top: 15px; margin-bottom: 15px; }  */