<!DOCTYPE html>
<html>
<head>
<title>Registration</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="bootstrap.css">
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style type="text/css">
.form-control
{
width: 50px;
}
</style>
</head>
<script type="text/javascript">
</script>
<body>
<div class="container">
<div class="panel panel-info">
<div class="panel-heading">
<center><strong><h2>Register</h2></strong></center>
</div>
<div class="panel-body">
<form method="post" role="form">
<div class="row">
<div class="form-group col-xs-7">
<div class="inner-addon left-addon">
<span class="glyphicon glyphicon-user"></span>
<input type="text" class="form-control" name="" placeholder="Fullname">
</div>
</div>
<div class="form-group col-xs-3">
<div class="inner-addon left-addon">
<span class="glyphicon glyphicon-envelope"></span>
<input type="text" class="form-control" name="" placeholder="Email address">
</div>
</div>
<div class="form-group col-xs-7">
<div class="inner-addon left-addon">
<span class="glyphicon glyphicon-earphone"></span>
<input type="text" class="form-control" name="" placeholder="Mobile number">
</div>
</div>
<div class="form-group col-xs-3">
<div class="inner-addon left-addon">
<input type="date" class="form-control" name="">
</div>
</div>
<div class="form-group col-xs-7">
<div class="inner-addon left-addon">
<span class="glyphicon glyphicon-map-marker"></span>
<input type="text" class="form-control" name="" placeholder="Address">
</div>
</div>
<div class="form-group col-xs-3">
<select class="form-control" style="width: 100px;" >
<option>State</option>
<option>Gujrat</option>
<option>Maharashtra</option>
<option>Goa</option>
<option>Rajasthan</option>
</select>
</div>
<div class="form-group col-xs-7">
<div class="inner-addon left-addon">
<input type="password" class="form-control" name="" placeholder="Create password">
</div>
</div>
<div class="form-group col-xs-3">
<select class="form-control" style="width: 100px;" >
<option>City</option>
<option>Ahmedabad</option>
<option>Mumbai</option>
<option>Kolkata</option>
<option>Delhi</option>
<option>Banglore</option>
<option>Chennai</option>
</select>
</div>
<div class="form-group col-xs-7">
<div class="inner-addon left-addon">
<input type="password" class="form-control" name="" placeholder="Confirm password">
</div>
</div>
<div class="form-group col-xs-3">
<strong>Gender</strong>
<input type="radio" name="gender">Male
<input type="radio" name="gender">Female
</div>
</div>
<div class="form-group ">
<center>
<button class="btn"><span style="color: white;">Register</span></button>
</center>
</div>
</form>
</div>
<div class="panel-footer">
<center>by registerting you are agree to our <a href="#">Privacy policy</a></center><br>
<center>Already have an account ? <a href="#">Log in</a></center>
</div>
</div>
</body>
</html>
https://i.sstatic.net/ubT6W.png
After upgrading my PC from Windows 7 to Windows 10, the CSS and Bootstrap styles applied to my HTML page disappeared. I continued to use the same browser and WAMP server that I had used on Windows 7, but the styling was lost. Is there a way to resolve this issue and make my program look the same as it did on Windows 7? I have also included a picture for reference.