body,html,p,a,h1,h2,h3,h4,h5{
  margin:0;
  padding:0;
  text-decoration: none;
}
*{font-family: 'Open Sans', sans-serif;}

.clr{
  clear: both;
  float: none;

}
#topbar-home{
  background:#27ae60;
  font-size:18px;
  padding:20px 0;
  padding:20px 0;
  color:#fff;
}
#back-btn{
  display:inline-block;
  padding:0 20px;
  color:#fff;
}
#name{
  text-align: center;
  letter-spacing: 1px;
}
#title{
  display: inline-block;
  text-align:center;
  letter-spacing: 1px;
}
#options-btn{
  padding:0 20px;
  float:left;
  color:#fff;
}
#content{
  margin-top:30px;
  box-sizing: border-box;
  border:6px solid #fff;;
}
#content a{
  width:100%;
  padding:20px 0;
  box-sizing: border-box;
  color:#fff;
  display: inline-block;
  font-size: 20px;
  letter-spacing: 1px;
  word-spacing: 3px;
  text-align: center;
  border:2px solid #fff;

}

#form1 input[type='text']{
  border:none;
  font-size: 16px;
  box-sizing: border-box;
  width:100%;
  color: #3e3e3e;
  padding:6px 12px;
  border:1px solid #ddd;
  margin-bottom: 15px;
}
#form1 input[type='submit']{
  color:#fff;
  padding:8px 0;
  text-align: center;
  border:none;
  width: 100%;
  font-size:16px;
  background:#27ae60;
  letter-spacing: 2px;
  border-radius: 4px;
}
#result{
  color:#202020;
  font-size: 20px;
  margin-top:40px;
  text-align: center;
  font-weight: 300;
}

#drawer{
  width:200px;
  height:90vh;
  float:left;
  background:#202020;
  margin-left:-200px;
  transition: all 0.5s ease;

}
#btn-op{

  position: absolute;
  top:5;
  left:5;
  border:none;
  background:none;
  font-size:25px;
  color:#fff;
}
#drawer a{
  width:100%;
  padding:10px 0;
  display:block;
  text-align:center;
  font-size:15px;
  color:#fff;
}
#road-trip{background:rgb(239, 28, 28);}
#electricity{background:#129CF3;}
#emi{background:#AA5FFC;}
#bmi{background:#2c3e50;}
#income{background:#16a085;}

#credit{
  background:#27ae60;
  box-sizing: border-box;
  padding:4px 8px !important;
  font-size:13px;
  border:25px solid #202020;
  display: block;
  border-radius: 6px !important;
}
