body{
    margin:0;
    padding:0;
   font-family:sans-serif;
   background:url("abc.gif");
 
}
* {
	box-sizing: border-box;
  }
  
  /* Create three equal columns that floats next to each other */
  .column {
	float: left;
	width: 33.33%;
	padding: 10px;
	height: 300px; /* Should be removed. Only for demonstration */
  }
  
  /* Clear floats after the columns */
  .row:after {
	content: "";
	display: table;
	clear: both;
  }
.column {
	float: left;
	width: 33.33%;
	padding: 10px;
	height: 300px; /* Should be removed. Only for demonstration */
  }
  
 
#header{
height:100vh;
background:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),url(img/fd.jpg);
background-position:center;
background-size:cover;
background-attachment:fixed;


}
.profile-img{
	border-color:black;
	border-radius:0px;
	width:300px;
	margin:auto;
	border-radius: 50%;
}
.hoo{
	color:white;
}
.nbv{
	color:white;
}
.user-box
{
top:50%;
left:50%;
transform:translate(-50%,-50%);
position:absolute;
}
.user-box img{
border-radius:50%;
width:250px;
border:2px solid red;
}
.user-box h1{
color:white;
font-weight:bold;
margin:10px;
}
.user-box p{
color:white;
}
.scroll-btn
 { bottom:30px;
position:absolute;
left:50%;
transform:translateX(-59%);
border:2px solid white;
padding:10px 10px 10px;
border-radius:30px;
}

  .scroll-bar span
 {
  border: 2px solid white;
  font-size:10px;
  border-radius:30px;
  }
 
 .scroll-bar{
 animation:mover 1s infinite alternate;
 }
 @keyframes mover{
  0%{transform:translateY(0);}
  100%{transform:translateY(10px);}

 }
 .kick
 {
	 background-color:gray;
 }

.about
{padding-top:100px;
 margin-bottom:50px;
}
.profile-img{
height:400px;
}
   
   .nav-bar{
   top:0;
   position:stickly;
   z-index:2;
   }
   .navbar{
    background-color:black;
	}
 .navbar-brand
 {
 height:50px;
 }
     .nav-bar.fa-bars
	 {
	 
	 font-size:35px;
	 color:green; 
	 }
    
	  .navbar-toggler
	  {
	  
	  outline:none!important;
	  
	  }
	  .navbar-nav{
	  float:right;
	  text-align:right;
	  }
	  
	  .nav-link
	  {
	   color:white!important;
	  }


.skill-bar p
{margin-bottom:6px;
font-weight:600;
}
.progress
{
border-radius:16px!important;
margin-bottom:10px;
}

.progress-bar{
border-radius:16px;
background:green !important;
}
.resume{
	margin-top:-50px;
	padding-top:50px;
	padding-bottom:30px;
	background-color:#f9f9f9
}
.resume h3
{ margin-bottom:50px;
}

  .timeline
  {
	  list-style-type:none;
	  position:relative;
  }
  .timeline:before
  {
	  content:'';
	  background-color:black;
	  display:inline-block;
	  position:absolute;
	  left:29px;
	  width:2px;
	  height:100%;
	  z-index:1;
  }
  .timeline lighter{
	  margin-top:20px;
	  margin-bottom:20px;
	  margin-left:20px;
	  background-color:black;
  }
  .timeline li h4
  {
	  background-color:yellow;
	  padding: 5px 0 5px 20px;
	 color:black;
	  font-size:15px;
  }
  .timeline li:before{
	   content:'';
	  background-color:black;
	  display:inline-block;
	  position:absolute;
	  border-radius:56px;
	  border:3px solid red;
	  left:20px;
	  width:20px;
	  height:20px;
	  z-index:1;
  }
	.services{
		padding-top:50px;
		padding-bottom:50px;
	}
	.services h1{
		margin-bottom:15px;
		
	}
	.services-box{
		background:#f9f9f9;
		padding:10px;
		margin-top:20px;
		border-top-right-radius:50px;
		border-bottom-left-radius:50px;
		
	
	}
	.services-box. fa
	{ margin:0px;
	font-size:20px;
	}
	.services-box span{
		margin:3px;
		font-size:20px;
		font-weight:bold;	
	}
	.services-box p{
		font-size:15px;
		margin-top:20px;
		color:#777;
	}
	
	
	.services-box:hover{
	
	    background:#f9f9f9;
		padding:10px;
		color:red;
		margin-top:20px;
		border-top-right-radius:0px;
		border-bottom-left-radius:0px;
		border-bottom-right-radius:50px;
		border-top-left-radius:50px;
		
		transform:1px;
		
		
	}
	
	.services-box:hover p
	{
		color:#fff;
	}
		
	.contact{
		
	padding-top:50px;
background:linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url(img/shv.jpg);
background-position:center;
background-size:cover;
background-attachment:fixed;
color:white;

	}
	
	.contact .row
	{
		padding:30px 0;
		font-size:22px;
	}
	
	.contact.contact .col-md-4.fa
	{padding:10px;
	font-size:40px;
	}
	
	.contact-btn{
		padding:10px 25px 10px 25px;
		margin:5px;
		border-radius:30px;
		border:2px solid red;
		background:transparent;
		
	}
	
	.contact-btn:focus
	{
		box-shadow:none!important;
	}
		
		.contact .btn:hover{
			border:2px solid black;
			background-color:black;
			transform:0.6s;
			
		}
		
		
		.contact .btn .fa{
			margin-right:10px;
		}
		.footer{
			background-color:black;
			height:50px;
			margin-top:50px;
			color:#fff;
			padding-top:10px;
		}
		
		.fa-heart-o{
			color:red;
		}
		
		h1,h2,h3{
			color:blue;
		}
		
		
		table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
      td {
  padding: 5px;
  text-align: left;
}
		
		.nbv{
			color:black;
			font-family:bold;
			text-decoration:underline ;
			text-align:center;
			
		}