/************************************************
Name: Sam Merrill
File Name: style.css (MerrillSLab8)
Description: This is the stylesheet for the index
  page. This addes background images to the body
  and buttons, sets the font family, colors
  of text, background colors to classes, and a
  custom border image for the image slideshow.
  It uses flex column dislay to output in a more
  visually appealin manner.
************************************************/
body{
    background-image: URL("https://i0.wp.com/imgs.screencaps.us/198/6-castleinthesky/full/castleinthesky-disneyscreencaps.com-10254.jpg?ssl=1");
    background-size: cover;
    background-repeat: no-repeat; 
    font-family: Copperplate Gothic Light;
    /*background-position: center;*/
}
header {
    color: #ffffff;
    background-color: #494949a0;
    border-radius: 4px; 
    display: flex;
    justify-content: space-between;

}
header a {
    text-decoration: none;
    color: inherit;
}
header a:hover{
    text-decoration: underline;
}
.pictures {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}
.pictures img{
    width: 450px;
    height: 450px;
    border-radius: 4px;
    border: 25px solid;
    border-image: url('images/goldframe.png') 265 round;
}
.title {
    text-align: left;
    padding-left: 15px;
}
.info {
    text-align: right;
    padding-right: 15px;
}
.buttons {
    width: 275px;
    text-align: center;
    color: #ffffff;
    background-color: #494949a0;
    border-radius: 4px;
    padding: 15px 0px 15px 0px;
    margin: 5px 0px 5px 0px;
}
.buttons button {
    color: #ffffff;
    background-image: URL("https://images.squarespace-cdn.com/content/v1/55afbaf2e4b07b89d11cad60/1612045757745-KZA12M253582MO9ATQY7/image-asset.jpeg?format=750w");
    background-repeat: no-repeat;
    background-size: cover;
   /* background-color: #3b3b3bce;*/
    border-radius: 4px; 
    width: 100px;
    height: 25px;
}
footer {
    width: 35%;
    margin: 0 auto;
    color: #ffffff;
    background-color: #6a8b44a6;
    border-radius: 4px; 
    text-align: center;
}