*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
}
body{
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    padding: 30;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-image: url(https://img.freepik.com/free-vector/blue-white-gradient-abstract-background_53876-60241.jpg?t=st=1730900187~exp=1730903787~hmac=f2fd7db162dda8433fa3c4815b487fb11f10e951f60095de4f9e984b7e3f2d36&w=740);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    
}
.heading{
    color: rgb(0, 0, 0);
    font-weight: 800;
    font-size:30px;
   text-align: center;
   margin-bottom: 4%;
   text-decoration:2px underline;
}

img{
    border-radius: 15px;
}

form{
    padding: 30px;
    box-shadow: 5px 5px 5px rgb(0, 44, 102);
    border-radius: 20px;
    max-width: 600px;
    width: 100%;
    color: rgb(0, 0, 0);
    background-color:transparent;
    background-image: url(https://img.freepik.com/free-vector/blue-white-gradient-abstract-background_53876-60241.jpg?t=st=1730900187~exp=1730903787~hmac=f2fd7db162dda8433fa3c4815b487fb11f10e951f60095de4f9e984b7e3f2d36&w=740);
    margin: 0 auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

form h2{
   color: black;
    font-size: 1.5em;

    margin-bottom: 15px;
}
label{
    font-weight: 800;
    display: block;
    font-size: 18px;
    text-decoration:3px underline;
    margin-bottom:5px ;
    color: rgb(0, 0, 0);
}
input{
    border: none;
    width:100%;
    padding:12px;
  margin-bottom: 20px;
  color: rgb(255, 255, 255);
  outline:none;
  background-color: black;
  box-shadow: 5px 5px 5px rgb(0, 44, 102);
  border-radius: 5px;
  font-size: 1rem;
  transition: border 0.3s;
box-shadow: 5px black;

}
textarea{
    border: none;
    width:100%;
    padding:12px;
    color: rgb(255, 255, 255);
    margin-bottom: 20px;
    background-color:rgb(0, 0, 0) ;
    outline:none;
    box-shadow: 5px 5px 5px rgb(0, 44, 102);
    border-radius: 5px;
    font-size: 1rem;
    transition: border 0.3s;
  box-shadow: 5px black;
}
.image{
    border: none;
    margin-bottom: 15px;
    outline:none;
    border-radius: 5px;
    font-size: 1rem;
  box-shadow: 5px black;
}
#image{
    background-color: black;
    color: rgb(255, 255, 255);
}
 
.btn>button{
color: rgb(0, 0, 0);
padding: 10px;
font-size: 28px;
font-weight: 900;
text-decoration: none;
background-image: url(https://img.freepik.com/free-vector/blue-white-gradient-abstract-background_53876-60241.jpg?t=st=1730900187~exp=1730903787~hmac=f2fd7db162dda8433fa3c4815b487fb11f10e951f60095de4f9e984b7e3f2d36&w=740);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
box-shadow: 5px 5px 5px rgb(0, 44, 102);
border-radius: 5px;
border: none;
cursor: pointer;
}
.btn>button:hover{
    text-decoration: underline;
}
button{
font-size: xx-large;

width: 100%;
}

#resumeoutput{
margin-top: 5px;
background-color: transparent;
padding: 20px;
border-radius: 10px;
box-shadow: 5px 5px 5px rgb(0, 44, 102);
max-width: 100%;
}

#resumeoutput h2{
    color: black;
    font-size: 30px;
    font-weight: 800;
    margin-bottom: 20px;
    text-align: center;
    text-decoration:3px underline;
}
#reumeoutput p{
    font-size: 1.1rem;
    line-height: 1.1rem;
    margin-bottom: 15px;
}
#resumeoutput strong{
    color: black;
    font-weight: 900;
    text-decoration:1px underline;
}
body::before{
    content: '';
    position: absolute;
    background-color:linear-gradient(120dag, white , skyblue);
    z-index: -1;
    filter: blur(100px);
}
#resumeoutput>#image{
    border: 3px solid black;
    object-fit: cover;
    box-shadow: 2px 2px 2px black(0,0,0,0.5);
    border-radius: 500%;
    margin: 0;
    display: block;
    text-align: left;
    }
#resumeoutput>#editresume{
    color: rgb(0, 0, 0);
padding: 10px;
font-size: 20px;
font-weight: 600;
text-decoration: none;
background-image: url(https://img.freepik.com/free-vector/blue-white-gradient-abstract-background_53876-60241.jpg?t=st=1730900187~exp=1730903787~hmac=f2fd7db162dda8433fa3c4815b487fb11f10e951f60095de4f9e984b7e3f2d36&w=740);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
box-shadow: 5px 5px 5px rgb(0, 44, 102);
border-radius: 5px;
border: none;  
margin-top: 3%;
cursor: pointer;
}
#resumeoutput>#editresume:hover{
    text-decoration: underline;
}
#shareablelink-container{
    background:transparent;
    box-shadow: 5px 5px 5px rgb(0, 44, 102);
    border-radius: 13px;
    padding: 1px;
}

#shareablelink-container>h2{
    color: black;
    margin-top: 5px;
    font-size: 21px;
    font-weight: 600;
    margin-bottom: 13px;
    text-align: center;
    text-decoration: underline;
}
#shareablelink>a{
align-items: center;
justify-content: center;
text-align: center;
font-size: 20px;
}
#shareablelink:hover{
text-decoration: none;
color: rgb(0, 0, 172);
}
#downloadpdf{
    color: rgb(0, 0, 0);
    padding: 10px;
    font-size: 20px;
    font-weight: 600;
    text-decoration: none;
    background: transparent;
    border: none;  
    margin-top: 1%;
    cursor: pointer;

}
#downloadpdf:hover{
    text-decoration: underline;
}