styles.css

@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css');

/* this is the background/parent div of the preloder*/
.preloader{
  width:100%;
  height:100%;
  background-color: #3a7ab1;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
/* the percentage shown in preloader*/
.preloader .status h1{
  font-size: 3000%;
  font-weight: bold;
  color: #FFFFFF;
  top:50%;
  left: 50%;
  position:fixed;
  transform: translate(-50%,-50%);
}
/* the navbar parent div*/
#navbar {
  background-color: #FFFFFF;
}
/* Objects inside the navbar*/
.navbar-objects{
  color:#0d6efd;
  font-family:Cursive;
  font-weight: bold;
}
/* the glyphicons in the navbar*/
.icon{
  color:#0d6efd;
}
/* on hover in the navbar tabs*/
.li-navbar:hover{
  background-color: #0d6efd;
}
.li-navbar:hover span{
  color:white;
}
/* the homw page*/
#home-background{
  background-image: url(home-background.jpg);
  width: 100%;
  height:100vh;
  text-align:center;
  position: relative;
  float: none;
}
/* just to hide everything during preloader animation*/
.everything{
  visibility: hidden;
}
/* Hi, there*/
#home-header{
  overflow:hidden;
  color:White;
  font-size:700%;
  display: none;
}
/* welcome to websitename */
#home-h2{
  transform: translate(0%, -50%);
  color:white;
  display: none;
}
/* the div indicating to scroll down to view more*/
.scroll-down {
  color:white;
  font-size: larger;
  position:absolute;
  bottom: 15%;
  text-align: center;
  left:43%;
}
/*parent class in the reader*/
.reader{
  height: 100vh;
  width: 100%;
  position:relative;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 3%;
  font-family: sans-serif;
}
/* the tabs in the reader*/
.Reader-tabs{
  color:#FFFFFF;
}
#text-i,#pdf-i{
  background-color: #ECECEC;
  border-radius: 10px;
}
/* radio button to input gender*/
#gender-input1{
  margin-top: 1%;
}
/*submit buttons in reader for text input and pdf input*/
.btn-t,.btn-p{
  width:100%;
  background-color: #0d6efd;
  color:#FFFFFF;
}
/* the input file button that will be visible to the user*/
#stylefileinput{
  background-color: gray;
  color: white;
  padding: 0.5rem;
  font-family: sans-serif;
  border-radius: 0.3rem;
  cursor: pointer;
  margin-top: 1rem;
  width: 100%;
  text-align: center;
}