nav{
   background-color:rgb(28, 28, 112);
   border-style: solid;
   border-color: rgba(0, 0, 0, 0.933);
   border-radius: 10px;
   margin-top: 5px;
   margin-left: 2px;
   margin-right: 2px;
    
}

nav ul  {
   list-style-type: none ;
   margin : 0;
   padding : 0;
   display: flex;
   overflow: hidden;
}

nav ul li a {
   display: block;
   color : white;
   text-decoration: none;
   padding: 10px 17px;
   text-decoration: none; 
   font-weight:bold;
   
}
nav ul li:hover{
   background-color: rgb(16, 16, 15);
   border-radius: 10px;
   text-transform: uppercase;
   cursor: context-menu;
}

.skill {
   padding-top: 0%;
   padding-right: 0%;
   text-align: center;
   margin-right: 86%;
   margin-left: 5vh;
   font-size: 40px;
   border-radius: 10px;
   color: white;
   border: solid;
   border-color: rgb(165, 193, 240);
    
}

.line{
   margin-top: 15vh;
   height: 5px;
   /* background-color: blue; */
   background: #2A7B9B;
   background: linear-gradient(90deg, rgb(4, 4, 239) 0%, rgb(41, 19, 241) 50%, rgb(4, 32, 171) 100%);
   border-radius: 10px;
   margin-left: 4vb;
   margin-right: 4vb;
}


.section-title {
   margin-top: 150px;
   display: flex;
   align-items: center;
   gap: 20px;
   color: white;
   font-size: 26px;
   letter-spacing: 2px;
}

.section-title::before,

.section-title::after {
  content: "";
  flex: 1;
  height: 3px;    
  background: linear-gradient(
    to right,
    transparent,
    #1a13e0,
    transparent
  );
}

.skills-wrapper {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 0px;
   margin-left: 80px;
   padding-right: 10px;
   margin-right: 250px;
   
}

.skill-section h3 {
   margin-top: 50px;
   color: #7aa2ff;
   margin-bottom: 20px;
   
}

.skills-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(12px, 1fr));
  row-gap: 10px;
  column-gap: 10px;

}

.skill-card {
   height: 42px;                 /* controls card height */
   padding: 0 12px;              /* horizontal padding only */
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 200px;
   font-size: 15px;
   color: white;

   border-radius: 20px;
   border: 1px solid #7aa2ff;
   background: transparent;
}
.skill-card:hover {
  box-shadow: 0 0 10px #2104dd;
}

.proj {
   border: solid;
   border-color: white;
   margin-left: 40%;
   margin-top: 20px;
   margin-right: 40%;
   height: 100px;
   align-items: center;
   text-align: center;
}
.proj .projBox {
   color: white;
}