html {
  background-image: url("image/bg.jpg");
  background-size: 100% auto;
  overflow-x: hidden;
  background-color: #d8d3cf;
font-family: IMFellDWPica; 
color: 493028;
}
nav {
position:relative;
text-align:center;
display:flex;
  max-width:1100px;
  margin:2vw auto 0 auto;
}
nav a, nav a:visited {
border:clamp(1px, 0.7vw, 8px) solid black;
font-size: clamp(5px, 3vw, 30px);
padding: clamp(1px, 1.2vw, 12px)  clamp(1px, 3vw, 30px);
line-height: clamp(5px, 10vw, 105px);
color:#493028;
text-decoration: unset;
  font-weight:bold;
}
nav a:hover, nav a:visited:hover {
background-color:linen;
border-radius:7px;
}
#border1, #border2, #border3 {
display:inline;
  flex:1;
}
#border1 a { border-image: url("image/button1.PNG") 20; }
#border2 a { border-image: url("image/button2.PNG") 20; }
#border3 a { border-image: url("image/button3.PNG") 20; }

h1{ 
font-size: clamp(5px, 4.6vw, 48px); 
background-color:linen;
  border-radius:0.4vw;
display:inline-block;
}
p { font-size: clamp(5px, 3vw, 30px); }
p a, .artistgroups a, .friends a {
  font-weight:bold;
  color: #b14427;
}
p a:hover, .artistgroups a:hover, .friends a:hover {
  background-color:linen;
  border-radius:0.3vw;
}
hr {
border:none;
border-top: 3px dotted #725045;
  opacity:100;
width: 90%;
margin-left: 0;
}
main {
  text-align:center; 
  max-width:1200px;
  margin:0 auto;
}
@font-face { 
font-family: IMFellDWPica; 
src: url('image/IMFellDWPica.woff'); 
}