@import url('https://fonts.googleapis.com/css?family=Josefin+Sans|Libre+Baskerville|Montserrat|Open+Sans&display=swap');
body{
  background-image: linear-gradient(#E2E1E4,#E2E1E4);
}
.navbar{
  background-color: rgb(80, 26, 189);
  }
.contactnav{
  color: black;
border: 1.5px DodgerBlue solid;
border-radius: 20px;
}
.contactnav:hover{
  color: grey;
}
.skillcol:hover{
  background-color:#dedede;
  transition: 0.5s;
  box-shadow: 10px 10px 10px 0px darkgrey;
}
.skillcol{
  font-size: 2vw;
}
.nav-link{
  color: black;
  transition-delay: 10s;
}
#mypic{
  width:20%;
}
.socialicons{
  width: 2.5vw;
  transition-delay: 3s;
}
.skillicons{
  width:10vw;
}
label{
  font-family: 'Libre Baskerville', serif;
}
.head1{
  
font-family: 'Times New Roman', Times, serif;
color:white;
  font-size: 5vw;
}
.c2{
    background-color:black;
    padding-left: 0;
        line-height:5vw;
        
}
.row{
  background-color:#E2E1E4;
}
.col{
  padding: 0;
  margin: 0;
}
.fancy {
  line-height: 0.3;
  text-align: center;
  font-size: 20px;
}
.fancy span {
  display: inline-block;
  position: relative;
}
.fancy span:before,.fancy span:after {
  content: "";
  position: absolute;
  height: 5px;
  border-bottom: 1px solid white;
  border-top: 1px solid white;
  top: 0;
  width: 40vw;
}
.fancy span:before {
  right: 100%;
  margin-right: 15px;
}
.fancy span:after {
  left: 100%;
  margin-left: 15px;
}
#contact{
  padding-left: 20px;
  text-align: center;
  background-color:whitesmoke;
  color:black;
  padding-top: 30px;
  padding-bottom: 10px;
}
#about{
font-family: '', sans-serif;
}
#education{
  color:white;
}
#education,#courses,#skills{
  background-color:black;
  padding: 30px;
  font-family: '', sans-serif; 
  font-size: 1.6vw;
  color:#5e5e5e
  transition: 0.3s;
}
#education,#courses,#skills{
  box-shadow: 10px 10px 10px 0px rgb(19, 18, 18);
  margin-bottom: 3vw;
  margin-right: 4vw;
  transition: 0.3s;
  background-color: #0a0909;
}
.about{
  font-size: 2.3vw;
  font-family: 'Montserrat', sans-serif;
  color: #5e5e5e;
  letter-spacing: 0.3vw;
}
.btn {
  background-color: DodgerBlue;
  border: none;
  color: white;
  cursor: pointer;
  font-size: 20px;
  width:100%;
}
.btn:hover{
  transition: 0.3s;
  width: 50%;
}
.portimage{
  float: right;
  height: 200px;
}
hr{ 
    background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}
::-webkit-scrollbar {
  width: 12px;
}

/*Scroll Bar*/
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 20px;
}
::-webkit-scrollbar-thumb {
  background: rgb(95, 95, 95); 
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: #3d2323; 
}
html, body {
  max-width: 100%;
  overflow-x: hidden;
}