@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

*,body{padding: 0; margin:0;display: block;
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: white;
}
.hidden{display:none;}
body{width: 100%; background-color: #292c36; }

.font {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}




.page{width:100%; display:flex; flex-direction: column; align-items: center;}
.page-title{width:90%; text-align: center; font-weight: 800; font-size: xx-large; color: white;}
.page-sub-title{width: 90%; text-align: center; font-weight: 600; font-size: large; color: white; margin-top: 50px; margin-bottom: 20px;}
.page-paragraph{width: 90%; text-align: center; color: white; margin-top: 10px; margin-bottom: 10px;}
.page-paragraph a{display: inline; font-weight: bold;}

.story-page{width: 100%;display: flex;flex-direction: column;align-items: center; }
.story-title{max-width:100%;font-weight: 800; font-size:xx-large;}
.story-collection{font-weight: bold;}
.story-icon-container{margin-bottom: 70px; margin-top:10px; display:flex; flex-direction:row; justify-content:center;}
.story-icon-container img{width:30px; height:30px; margin:10px;}
.story-paragraph{line-height:40px; margin-bottom: 70px; font-weight: bold; font-size: large; width: 900px; color: #939396; text-align: left;}
@media(max-width: 500px){
  .story-title{font-size: x-large;}
  .story-collection{font-size: medium}
  .story-paragraph{font-size: medium;}
}

@media(max-width:950px){
  .story-paragraph {width: 90%;}
}

.text{font-weight: 800; font-size: large; width: 100%; text-align: center;}