*
{
  margin:0px;
  padding:0px;
}
body{
  margin: 0;
  padding: 0;
  border:0;
  width: 100%;
  font-family: sans-serif;
}



.mr-5
{
font-size:15px;
padding-left:30px;
color:black;
font-weight:bold;

}

.ml-3
{

font-weight:bold;
}

.head
{

    padding:0px;
    margin:0px;
    border: 0px;
    width: 100%;
   
  background-image:url(a5.png);
  background-attachment:fixed;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;

  
}

#word
{
  margin-top:30px;
margin-bottom:40px;
}

.col-md-8 h1
{


margin-left:50px;
color:white;
font-size:60px;




}

#img1
{

   margin-top: 50px;
   width:300px;
   height:400px;
   
   
}



.about
{

   
 padding-bottom:101px;
}

.aboutme
{
  margin:10px;
  margin-top:20px;
  font-style:italic;
  opacity:80%;
  background-color:#EDEDED;
  font-size:23px;
  margin-bottom:150px;

}



.section-title {
  text-align: center;
  padding-bottom:10px;
}

.section-title h2 {
  font-size: 35px;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom:10px;
  position:relative;
  color:black;
}

.section-title h2::before {
  content: '';
  position:absolute;
  display: block;
  width: 120px;
  height:3px;
  background:#ddd;
  bottom: 3px;
  left: calc(50% - 60px);
}

.section-title h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 40px;
  height: 4px;
  background:#2962FF;
  bottom: 0;
  left: calc(50% - 20px);
}

.section-title p
{
  padding-top:20px;
  font-size:20px;
}



  
.col-md-8 ul
{
list-style-type:none;
display:inline-block;
}

#image
{
 
 margin-top:-70;
 margin-bottom:40px;
 box-shadow: 6px 6px 3px grey;
}
.biod
{



}
.empty
{

  width:100%;
  height:100px;
  background-color:white;


}
.glyphicon 
{
  color:#2979FF;
}

.xdd
{
 padding-top:30px;
 text-align:center; 
 padding-bottom:100px;
 color:black;
 font-size:25px;
}

.col-md-8 
{   
  
  font-size:25px;
  float:left;
  color:black;

}

.col-md-8 li
{ 

   padding:5px;

}

.skill
{
  margin-top:300px;


}

.col-md-3 img
{
  margin:auto;
  margin-bottom:30px;
}

  


#image1 img
{
  height:100px;
}

#email
{
  color:#2979FF;
  font-style:italic;
  font-size:20px;
}
//icons

.icons {
  margin: 100px auto;
  text-align: center;
}

.icon {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 5px;
  border-radius: 50%;
  
  -webkit-transition: opacity .25s ease-in-out;
  
  background-size: 60%;
  background-position: center center; 
  background-repeat: no-repeat;
}

.icon:hover{
  -webkit-animation:vibration 0.5s infinite;
  opacity: 0.6;
}

.icon-ig {
  background-image: url("https://i.imgur.com/v2vc2NV.png");
  background-color: hsl(360, 90%, 40%);
}

.icon-gp {
  background-image: url("https://i.imgur.com/J6LeoUb.png");
  background-color:white;
}

.icon-fb {
  background-image: url("https://i.imgur.com/HujNYDb.png");
  background-color: hsl(230, 50%, 40%);
}

.icon-in {
  background-image: url("https://i.imgur.com/2Y9rW1r.png");
  background-color: hsl(220, 60%, 50%);
}

.icon-tw {
  background-image: url("https://i.imgur.com/7ZgkBfy.png");
  background-color: hsl(200, 90%, 60%);
}

#follow
{ 
  padding-top:30px;
  color:white;
  font-size:30px;
  font-family: "Times NewRoman";
}
$moveBy: 2px;
    
@-webkit-keyframes vibration{
  0%     {left:-$moveBy; top:-$moveBy;}
  12.5%  {left:$moveBy; top:0px;}
  25.0%  {left:-$moveBy; top:$moveBy;}
  37.5%  {left:0px; top:-$moveBy;}
  50.0%  {left:0px; top:$moveBy;}
  62.5%  {left:$moveBy; top:-$moveBy;}
  75.0%  {left:-$moveBy; top:0;}
  87.5%  {left:$moveBy; top:$moveBy;}
  100%   {left:0px; top:$moveBy;}
}
@-webkit-keyframes chgop {
  0%   {opacity: 1.0}
  100% {opacity: 0.6}
}

footer
{ 
   
  
  height:200px;
  width:100%;
  padding:0px;
    margin:0px;
    border:0px;
    width:100%;
  background-image:url(a5.png);
  background-attachment:fixed;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
}

.icons

{
  padding-top:70px;
}



.nav {
  height: 50px;
    top:0;
  position: sticky;
  z-index: 2;
  width:100%;
  background-color:#2979FF;
  opacity:90%;


}

.nav:hover
{
  opacity:100%;
}
.nav > .nav-header {
  display: inline;
}

.nav > .nav-header > .nav-title {
  display: inline-block;
  font-size: 22px;
  color:#ffffff;
  
  font-family:Georgia;
  padding: 10px 10px 10px 10px;
}

.nav > .nav-btn {
  display: none;
}

.nav > .nav-links {
  display: inline;
  float: right;
  font-size: 18px;
}

.nav > .nav-links > a {
  display: inline-block;
  padding: 13px 10px 13px 10px;
  text-decoration: none;
  color:#ffffff;
}

.nav > .nav-links > a:hover {
  background-color: rgba(0, 0, 0, 0.3);
}

.nav > #nav-check {
  display: none;
}

@media (max-width:600px) {
  .nav > .nav-btn {
    display: inline-block;
    position: absolute;
    right: 0px;
    top: 0px;
  }
  .nav > .nav-btn > label {
    display: inline-block;
    width: 50px;
    height: 50px;
    padding: 13px;

  }
  .nav > .nav-btn > label:hover,.nav  #nav-check:checked ~ .nav-btn > label {
    background-color: rgba(0, 0, 0, 0.3);
  }
  .nav > .nav-btn > label > span {
    display: block;
    width: 25px;
    height: 10px;
    border-top: 2px solid #eee;
  }
  .nav > .nav-links {
    position: absolute;
    display: block;
    width: 100%;
    background-color:#2979FF;
    opacity:80%;
    height: 0px;
    transition: all 0.3s ease-in;
    overflow-y: hidden;
    top: 50px;
    left: 0px;
  }
  .nav > .nav-links > a {
    display: block;
    width: 100%;
  }
  .nav > #nav-check:not(:checked) ~ .nav-links {
    height: 0px;
  }
  .nav > #nav-check:checked ~ .nav-links {
    height: calc(100vh - 50px);
    overflow-y: auto;
  }
}


#per
{

  font-size:15px;
  color:black;  
  font-style:italic;


}

#per1
{
   font-size:15px;
   color:#2979FF;
}

#per2
{   
   margin-top:4px;
   font-size:14px;
   font-weight:bold;
}

#per3
{
 font-size:13px;
 
}

#logo
{
 height:400;
 width:400;
}

#certi
{ margin-top:10px;
  font-style:italic;
  font-weight:bold;
  color:gray;
}

//scroll

.scroll {
 
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  
}
.box span {
  width: 25px;
  height: 25px;
  display: block;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(45deg);
  margin: -10px;
  animation: animate 2s infinite;

}

.box span:nth-child(2) {
  animation-delay: -0.2s;
}

.box span:nth-child(3) {
  animation-delay: -0.4s;
}

@keyframes animate {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
    transform: rotate(45deg) translate(10px, 10px);
  }
  100% {
    opacity: 0;
  }
}


//setting

#pt
{
  color:black;
 margin-bottom:60px;
}
#ps
{ 
  color:black;
  margin-bottom:40px;
}
#pq
{
  color:black;
}
#buttoncolor
{
  background-color:#2979FF
}

#fncolor
{
  color:#2979FF
}