* {
    margin:0; padding: 0; border: 0;
    box-sizing: border-box;
}
/* default styles for the root/html */
:root {
    font-size: 62.5%; /*16px * .625 = 10px root font size */

    /* css variables for site colors */
    --color-bg1: #EEE5E9;
    --color-bg2: #EFC88B;
    --color-font1: #222222;
    --color-accent1: #CF5C36;
}















img {
    
    float: bottom; 
    float: right;
    border: 4px solid grey;
    border-radius: 5px;
    width: 20vh;
}

article {
    background-image: url(../images/skate.jpeg); background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(187, 187, 187, 0.6);
    height: 100%;
    padding: 12px;
    padding-left: 20px;
    border: 4px solid rgb(9, 32, 97);
    border-radius: 10px;
    font-size: 18px;
 
}

aside {
    border: 4px solid rgb(9, 32, 97);
    padding: 12px;
    border-radius: 10px;
    background-image: url(../images/forrest.jpeg); background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(187, 187, 187, 0.7);
    
}




header {
    border: 4px solid rgb(9, 32, 97);
    padding: 12px;
    border-radius: 10px;
    box-shadow: inset 0 0 0 1000px rgba(187, 187, 187, 0.6);
    background-image: url(../images/texture.jpg)
}


#side-bar {
    font-size: 20px;
    color: rgb(31, 19, 19);
    border: 4px solid rgb(9, 32, 97);
    padding-bottom: auto;

    padding-right: 0px;

    border-radius: 10px;


    background-color: ivory;
}
a {
    font-size: 16px;
}
a:hover {
    color: rgb(60, 60, 82);
    font-size: 20px;
}

p {
  font-size: 20px;
  font-family: sans-serif;
  font-weight: bolder;
  margin-bottom: 5px;
}

dd {
    font-size: 16px;
    font-family: sans-serif;
}

h2 {
    font-size: 25px;
    font-family: 'Courier New';
    text-shadow:2px 2px rgb(175, 168, 69);
    background-color:rgb(219, 205, 157) ;
    box-sizing: border-box;
    text-align: center;
    border: 4px solid rgb(9, 32, 97);
    border-radius: 5px;
    margin-bottom: 5px;
}
h3 {
    font-size: 25px;
    font-family: 'Courier New';
    text-shadow:2px 2px rgb(175, 168, 69);
    background-color:rgb(219, 205, 157) ;
    box-sizing: border-box;
    text-align: center;
    border: 4px solid rgb(9, 32, 97);
    border-radius: 5px;
    margin-bottom: 5px;
}

.bar{

}
.bar > h3:first-child{
    padding: 0px;
    margin-bottom: 5px;
}


#side-bar a {
    
    display: grid;
    
    border: 4px solid rgb(9, 32, 97);
    border-radius: 5px;
    color: rgb(78, 67, 67); 
    background-color: rgb(190, 176, 165);
    text-align: center; 

  }
 
aside dd {
    font-size: 16px;
    font-weight: 500;

}

#links nav {
    background-color: lightgray;
}

#phoenix {
    border: 4px solid rgb(9, 32, 97);
    background-image: url(/images/skull.png),
        url(/images/fire.gif),
        linear-gradient(to bottom, rgb(89, 57, 104), rgb(37, 7, 7));
    background-repeat: no-repeat,
        no-repeat,
        no-repeat;
        width: 100%; height: 65vh;
    background-position: center;
    background-size: cover;
    border-radius: 10px;
    height: 100%;
  }

  footer {
    border: 4px solid rgb(9, 32, 97);
    padding: 3px;
    border-radius: 10px;
    background-color: rgb(187, 187, 187);
    height: 100%;
    
}

  footer h3 {
    color: rgb(0, 0, 0);

    margin-bottom: 5px;
    font-size: 15px;
    text-shadow: none;
    
}

footer p {
    font-size: 15px;
}
footer a {
    font-size: 15px;
}

#wings h3{
    border: 4px solid rgb(9, 32, 97);
    background-image: url(/images/wings.png), repeating-linear-gradient(90deg,
     rgb(59, 37, 66) 30px, rgb(59, 37, 66) 30px,
    lightblue 50px, lightblue 50px);
    background-size: 869px 260px;
    background-position: center;
    width: 100%; height: 40vh;
    border-radius: 10px;
    
}