/*To add this to a page, use <link href="FILEPATH.css" rel="stylesheet" type="text/css" media="all">*/

html { /*somehow, this keeps the column on short pages in the same place as the column on pages long enough to require a scrollbar. better reading experience*/
  overflow-x: hidden;
  margin-right: calc(-1 * (100vw - 100%));
}

body { /*background color, font*/
background-color: #F3C6D1;
background-repeat: repeat;
background-attachment: fixed;
font-family: "basiic.tff";
}

@font-face {
    font-family: 'oswald';
    src: url('fonts/basiic.ttf');
}

html, body, div, span, applet, object, iframe, h2, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    font-family: oswald;
    vertical-align:baseline
} 

h1, h3, strong {
    color:#e06d8a;
}


.midcolumn { /*the main body of the this-style page, it doesn't go in a row it just encloses all the content*/
border: 6px hidden #e06d8a;
margin: auto;
margin-top: 20px;
width: 80%;
padding: 10px;
background-color: transparent;
}

.row { /*base of the row-column system. you might find success adding 'width' to this*/
  display: flex;
  width: 100%
}

.column { /*columns for the system. this is pre set up to have 3 fit alongside each other, you WILL need to fuck with this to get it to do what you want*/
  flex: 60%;
  padding-left: 10px;
  padding-right: 1px;
  position: relative; 
  border: 8px double #E896AB;
  margin: 2px;
  background-color: white;
}

.column2 { /*columns for the system. this is pre set up to have 3 fit alongside each other, you WILL need to fuck with this to get it to do what you want*/
  flex: 0%;
  padding-left: 10px;
  padding-right: 1px;
  position: sticky; 
  border: 8px double #E896AB;
  background-color: white;
  width: 256px;
  height: auto;
}


.edgecolumn {
  flex: 20%;
  padding-left: 10px;
  padding-right: 1px;
  position: relative; 
  border: 8px double #E896AB;
  margin: 10px;
  font-size: 14px;
  background-color: white;
}

marquee {
    display: inline-block;
    width: -webkit-fill-available;
}