body{font-family: monospace; text-align: center; background-color: #620d69;}
img{object-fit: scale-down; max-width: 100%;}
p{font-family: monospace; text-align: center; font-size: 18px;}
.big{font-size: 60px; color: plum; font-family: monospace;}
.left{text-align: left;}
.right{text-align: right;}
.tab{text-indent: 40px;}
.h{margin: 0;}
.htwo{margin-top: -0.5em;}
.hthree{margin-top: 0.5em;}
.hside{padding-left: 0.2em;}
.floatimage{margin: 0; margin-top: 0.44em; margin-right: 10px; float: left;}
a:hover{color: rgb(203, 132, 203);}
a{color: plum; text-align: center;}
.cat{color: plum; font-family: monospace; font-size: 18px;}
.b{border-style: dashed; border-radius: 1px; border-color: #d85db1;}
.fluffyb{border-style: solid; border-radius: 3px; border-width: 4px; border-color: violet;}
hr{height:3px; border-width:3; color:violet; background-color:violet; margin-left: 1em; margin-right: 1em;}
.r{float: right; vertical-align:middle;}
.l{float: left; vertical-align:middle;}

.center{
    margin: 0; 
    padding: 0; 
    position: relative; 
    top: 25%;
} 

.container > div {
    padding: 5px;
    background-color: #553558;
}

.container {
    padding: 10px;
    padding-left: 10px;
    padding-top: 10px;
    display: grid;
    position: relative;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    /*grid-template-columns: repeat(auto-fit, minmax(0px, 1fr));*/
    /*grid-template-areas:
    't t t t t t t b b'
    't t t t t t t b b'
    'a d d d c c c b b'
    'a d d d c c c b b'
    'a d d d c c c b b'
    'a d d d c c c b b'
    'a d d d c c c b b'
    'a d d d c c c b b'
    'a d d d c c c b b';*/
    column-gap: 10px;
    row-gap: 10px;
    width: auto;
    height: 700px;
    background-color: #3a0040;
    /*justify-content: space-between;*/
}
.item1{
    grid-area: t;
    overflow: hidden;
    min-height: 135px;
    grid-column-start: 1;
    grid-column-end: 7;
    grid-row-start: 1;
    grid-row-end: 3;
}
.item2{
    grid-area: c;
    overflow: hidden;
    grid-column-start: 5;
    grid-column-end: 7;
    grid-row-start: 3;
    grid-row-end: 9;
}
.item3{
    grid-area: b;
    overflow: scroll;
    grid-column-start: 7;
    grid-column-end: 9;
    grid-row-start: 1;
    grid-row-end: 9;
}
.item4{
    grid-area: a;
    overflow: scroll;
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 3;
    grid-row-end: 9;
}
.item5{
    grid-area: d;
    overflow: hidden;
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 3;
    grid-row-end: 9;
}

.rock{font-family: Rockstar;}
.windows{font-family: Windows7; font-size: 15px;  color: white; text-shadow: 0 0 3px black, 0 0 5px black;}

@font-face {
  font-family: Rockstar;
  src: url(/Cat3Takover/Rockstar-ExtraBold.otf);
}
@font-face {
    font-family: Windows7;
    src: url(/Cat3Takover/segoeui.ttf);
  }