/* Custom Stylesheet */
/**
 * Use this file to override Materialize files so you can update
 * the core Materialize files in the future
 *
 * Made By MaterializeCSS.com
 */

body{
  width: 100%;
}

#nav-mobile{
  font-family: 'Abril Fatface', cursive;
}

ul{
  font-family: 'Abril Fatface', cursive;
}

.logo{
  font-family: 'Abril Fatface', cursive;
  cursor: pointer;
}

 .top{
  font-family: 'Abril Fatface', cursive;
   text-align: center;
   color: white;
   font-size: 28px;
   padding-top: 10px;
   padding-bottom: 20px;
   margin: 0 20px;
 }

 .instruction{
   font-size: 20px;
   color: white;
   width: 80%;
   margin: 0 auto;
   padding-bottom: 20px;
 }
 
 .content {
  position: relative;
  border-bottom: 2px solid rgb(68, 141, 201);
}
 .header {
  background: rgb(68, 141, 201);
  z-index: 0;
  position: relative;
  border-bottom: 2px solid rgb(68, 141, 201);
  z-index: 1;
}

 .circle-border {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  bottom: -30px;
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  border: 3px solid rgb(68, 141, 201);
  z-index: 0;
}
.circle {
  width: 60px;
  height: 60px;
  background: white;
  border-radius: 50%;
  bottom: -32px;;
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 30px;
  line-height: 60px;
  z-index: 2;
}

#budget-options{
  margin-top: 20px;
}

#addChipsBtn{
  border: 1px solid rgb(145, 201, 238);
}

#closeBtn{
  border: 1px solid rgb(145, 201, 238);
}

.icon-block {
  padding: 0 15px;
}
.icon-block .material-icons {
	font-size: inherit;
}
.budget-box{
  width: 90%;
  overflow: hidden;
  background: skyblue;
  margin: 20px auto ;
  padding: 10px;
}

.container ul{
  padding: 0px;
  margin: 0px;
}
.container ul li{
  list-style: none;
  float: left;
  width: 30%;
  height: 300px;
  background: white;
  margin: 30px 40px 40px 40px;
   
}
.container ul li:hover{
  opacity: 0.9;
}

.title{
  width: 100%;
  font-size: 25px;
  font-family: 'Amaranth', sans-serif;
}
 
h4{
  font-family: 'Amaranth', sans-serif;
}

#ThankYou{
  padding: 15px;
  font-size: 20px;
  font-family: 'Abril Fatface', cursive;
  background-color: rgba(56, 250, 120, 0.849);
}