{
	font-family: Poppins, sans-serif;
	padding: 0;
}


nav ul{
	list-style:none;
	float:right;
	padding:0;
	display:flex;
}
	
div.title{
  display: flex;
	padding: 10px;
  height: 40px; 
 
}

nav{ 

   background: rgba(0,0,0,0.0);
   width: 100%;
   float:left;
}

nav ul li a {
	line-height: 80px;
	color: #b3b3b3;
	padding: 12px 30px;
	text-decoration:none;
	font-size: 20px;
	text-transform:upper;
}

nav ul li a:hover{
	background: #545454;
	border-radius: 6px;
	background: rgba(0,0,0,0.8);
	transition:2s;
	width:20%;

}
ion-icon{
	color: white;
}

div p {
	font-size: 15px;
	color: black;
	font-weight:400;
	margin-right:15px;
	float:left;
}

.ft-right ul li a{
	line-height: 80px;
	color: #b3b3b3;
	padding: 12px 30px;
	text-decoration:none;
	font-size: 20px;
	text-transform:upper;

}

.logo{
	height: 60%;
}




.h3{
	font-size:20px;
	color:white;

}
	

	.slider-frame{
    overflow: hidden;
    height: 400px;
    width: 700px;
    margin-left: auto;
    margin-right: auto;
  }

 .TITLE{
 align-text: center;	
 } 
 .TITLE h1{

	 font-size:40px;
    text-align: center;
    font-family: sans-serif;
    font-weight: lighter;
    letter-spacing: 5px;
    padding-top: 30px;
    color: white;
   
}

.TITLE h2 {
	
	 font-size: 20px;
    text-align: center;    
    font-family: cursive;
    font-weight: lighter;
    letter-spacing:3px;
    padding-top: 20px;
    color: white;
   
   
}
 
  /*---------- Ang mahirap na SLIDE ANIMATION --------------*/
 
 
  @keyframes slide_animation{
      0% {left:0px;}
      10% {left:0px;}
      20% {left:1200px;}
      30% {left:1200px;}
      40% {left: 2400px;}
      50% {left: 2400px;}
      60% {left: 1200px;}
      70% {left: 1200px;}
      80% {left: 0px;}
      90% {left: 0px;}
      100% {left:0px;}
  }
 
  @-webkit-keyframes slide_animation{
      0% {left:0px;}
      10% {left:0px;}
      20% {left:1200px;}
      30% {left:1200px;}
      40% {left: 2400px;}
      50% {left: 2400px;}
      60% {left: 1200px;}
      70% {left: 1200px;}
      80% {left: 0px;}
      90% {left: 0px;}
      100% {left:0px;}
  }
 
  .slide-images{
      width: 3600px;
      height: 800px;
      margin: 0 0 0 -2400px;
      position: relative;
      -webkit-animation-name: slide_animation;
      animation-name: slide_animation;
      -webkit-animation-duration: 33s;
      animation-duration: 33s;
      -webkit-animation-iteration-count: infinite;
      animation-iteration-count: infinite;
      -webkit-animation-direction: alternate;
      animation-direction: alternate;
      -webkit-animation-play-state: running;
      animation-play-state: running;
  }
 
  .img-container{
      height: 670px;
      width: 1200px;
      position: relative;
      float: left;
      box-sizing: content-box;
      justify-content: center;
  }

.img-container h2{
	position: absolute;
	top: 300px;


}
.img-container p{
	 position: absolute;
	 top: 300px;
    background:rgba(0, 0, 0, 0.6);
    width: 51%;
    height: 10.5%;
    color: white;

	
}


#footer {
  background: black;
  color: white;
  padding: 20px 0;
  height: 100%;
}
#footer .column {
  display: flex;
  justify-content: space-between;
  align-items: middle;
}
#footer .ft-left h4 {
  display: inline-block;
  vertical-align: middle;
  font-family: "";
  font-weight: 400;
  font-size: 40px;
  margin: 0;
}
#footer .ft-left .ft-logo {
  max-width: 70px;
  vertical-align: middle;
  margin-right: 15px;
}
#footer .ft-right {
  text-align: right;
}
#footer .ft-right p {
  margin: 0;
  font-size: 14px;
}
#footer .ft-nav {
  margin: 0 0 15px 0;
  padding: 0;
  list-style-type: none;
}
#footer .ft-nav li {
  display: inline-block;
  margin-left: 50px;
  vertical-align: middle;
  font-family: "Oswald";
  font-size: 18px;
}
#footer .ft-nav li a {
  transition: all 0.2s ease;
}
#footer .ft-nav li a:hover {
  color: #211d18;
}

div .last2 p a:hover{
	font-size: 15px;
	transition: 1s;
	color:red;
}



.container_f{
	display: flex;
	color: white;
}

.right{
padding-left: 50%;
}