/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}
h1 {
  color: rgb(255, 149, 202);
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.clearfix::after {
    content:"";
    display: table;
    clear:both;
}
    body {
  background-color: rgb(255, 224, 245); /* For browsers that do not support gradients */
  background-repeat: no-repeat;
  background-position: top;
  background-image: linear-gradient(to bottom, rgb(255, 223, 235),rgb(255, 195, 255), lightblue);
}
 
    #mainbody {
        background-color: rgb(255, 255, 255); /* The .9 at the end is the opacity */
        width: 1000px;
         margin: 50px 50px;
         padding: 25px;
        border: 5px solid rgb(190, 206, 255);
        border-radius: 15px;
        justify-content:center;
    }
   
    .center {
        text-align: center;
    }
    .wrapper {
    max-width: 100%;
    padding: 5px;
    margin: auto;
    flex-flow: row wrap;
}

.box {
    text-align: justify;
    font-size: 15px;
}

.float-right {
    float: right;
    margin:10px 0 10px 20px;
    width: 225px;
    border-radius: 8px;
}

.float-left {
    float: left;
    margin:25px 20px 5x 0px;
    width: 250px;
    border-radius: 8px;
}

.float-corner{
    float: left;
    margin:10px -45px 10px 0px;
    width: 250px;

    border-radius: 8px;
}

.fixed-image {
    position:fixed;
    right:-25px;
    bottom:0px;
    z-index: index 250px;
    max-height: 400px;
}

.listing-section {
  padding: 0 30px; /* ensures content is at least 30px away from edges */
}

.listing-container {
  display: flex;
  align-items: center; /* vertically centers image with the UL only */
  gap: 10px;
}

.list-bullets {
  list-style: disc;   /* restore bullets */
  padding-left: 50px; /* browser default-ish bullet indentation */
  margin:  0;      /* default margin for UL */
}

.center-img img {
  max-width: 200px;
  width: 100%;
  height: auto;
  display: block;
}