-----------main start-----------*/
#main{
 margin-left: 80px;
}
header, footer{
	background-color: black;
	color: white;
	text-align: center;

}
 #main input[type='button']{
    background-color: #008CBA;
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    
    width: 200px;
	transition: ease-in-out, width .50s ease-in-out;
    font-family: 'Montserrat', sans-serif;
    font-size: 25px; 
  }
 #main input[type='button']:hover {
    background-color: #4CAF50;
    color: white;
    width: 300px;
    border-left: 3px solid red;
 	 outline: none;
 	 color: green;
}
/*-------------main end-----------*/
/* ------------nav start------------ */
nav button{
	background-color:yellowgreen;
	border: none;
	color:white;
	padding: 8px 16px;
	border-radius:2px;
	font-size:14px;
}
nav button:hover{
	background-color: orange;
}
/* ------------nav end------------ */

/*-----------expenditure page start----------*/

/*-----------who-------------*/
#exp1{
	display: none;
}

 input[type='text'], input[type = 'number']{
 	background: none;
 	text-align: center;
	border-radius: 5px;
	padding: 10px;
	width: 200px;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom:1px solid #eee;
	transition: ease-in-out, width .50s ease-in-out;
    font-family: 'Montserrat', sans-serif;
    font-size: 25px; 

}
   div  {
   	  color:#348097;
      font-family: 'Montserrat', sans-serif; 
      font-size: 40px;
   }

 input[type='text'], input[type='number']:focus{
 	 width: 350px;
 	 border-bottom: 3px solid blue;
 	 outline: none;
 	 color: green;
 	}
/*--------------who end-------------*/

  /*----------what start -------------*/
#exp2{
  display: none;
}
#exp2 input[type = 'text']{

}
/*-------------what end-----------*/

/*-----------how much start--------------*/
#exp3{
  display: none;
}
/*--------------how much end-----------*/

/* ------done/more start--------- */
#exp4{
  display:none;
}

#exp4 p{
  font-size:20px;
  text-align:center;
  color:red;
}

#exp4 input[type='button'], #inc3 input[type = 'button']{
     background-color: #008CBA;
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer; 
    width: 200px;
}
/*-----------done/more end---------*/

/*-----------Income page start---------*/
/*-----------Source start---------*/
#inc1{
  display: none;
}
#inc1 p{
    margin: 10px;
}
#inc1 input[type="button"]{
    border: none;
    border-radius: 100px;
    width: 33%;
    height: 45px;
    font-size: 20px;
}
#inc1 input[type="button"]:focus{
    background-color: aqua;
}
/*------------Source end----------*/
/*-----------iAmnt start----------*/
#inc2{
  display: none;
}
/*----------iAmnt end-------------*/
/*----------iDone start---------------*/
#inc3{
  display: none;
}
/* ----------iDone end-------------- */
/* -----------Income page end------------- */

/*----------Insights page start---------  */
#table{
	display: none;
}
/*
#exp2 input[type="button"]{
	 background-color: #008CBA;
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
/*--------avatar start--------*/
/*
button img{
  width:120px;
  height:120px;
  border-radius:80px;
}