body{
    background:
    repeating-linear-gradient(
        90deg,
        #d8cfbd 0px,
        #d8cfbd 40px,
        #cfc5b1 40px,
        #cfc5b1 80px
    );

    font-family: Verdana, sans-serif;
    margin:0;
}

#container{
    width:1000px;
    margin:30px auto;

    background:#8a6248;

    border:8px solid #6d4a36;
    border-radius:35px;

    padding:20px;
}

#navbar{
    background:transparent;
}

#navbar ul{
    list-style:none;
    display:flex;
    gap:15px;
    padding:0;
}

#navbar a{
    color:#f8f0e5;
    text-decoration:none;
    font-weight:bold;
}

.banner{
    width:350px;
    margin:0 auto 25px auto;

    background:#a57a5d;

    color:white;

    padding:20px;

    border-radius:20px;

    text-align:center;
}

main{
    background:#f7f0e5;

    border-radius:20px;

    padding:25px;

    color:#5c4335;
}

.banner h1{
  margin:0;
  color:white;
}

#flex{
    display:flex;
    gap:20px;
}

#sidebar{
    width:220px;

    background:#f7f0e5;

    border-radius:20px;

    padding:15px;

    color:#6d4a36;
}

#sidebar h3{
    margin-top:0;
}

#sidebar a{
    display:block;

    text-decoration:none;

    color:#6d4a36;

    background:#e8d4c0;

    padding:10px;

    margin-bottom:8px;

    border-radius:10px;
}

#sidebar a:hover{
    background:#d8c1aa;
}

main{
    flex:1;

    background:#f7f0e5;

    border-radius:20px;

    padding:25px;
}

.bannerimg{
    display: block;
    margin: 0 auto;

    width: 100%;
    max-width: 700px;

    border-radius: 15px;
}
.avatar{
    width:180px;
    height:180px;

    object-fit:cover;

    border-radius:15px;

    display:block;
    margin:0 auto 15px auto;
}

ul {
  list-style-type:none;
  padding-left:0;
  
}
li a {
  display:inline-block;
  margin:10px;

}

li a:hover{
  transform:rotate(-5deg);
}


#rightbar{
  width:250px;
}
.widget{
  background:#f7f0e5;
  border-radius:15px;
  padding:15px;
  margin-bottom:15px;
  color:#6d4a36;
}

.calendar{
  width:100%;
  text-align:center;
  
}

.calendar td,
.calendar th{
  padding:4px;
}