.container {
    display: grid;
    grid-template-columns: fit-content(400px) auto;
    padding: 50px;   /* (optional) space between areas */
}

/* assign your elements to the areas you defined in the grid-template rule: */
header { 
    grid-column-start: span 2;
    text-align: center;
    color:white;
}
aside { 
    background-color: #2c1454;
    text-align: left;
    color:white;
    left: 0px;
    margin: 10px;
}
main { 
    background-color: #984090;
    text-align: center;
    color:white;
    border-style: solid;
    border: 18px;
    border-color: #2c1454;
    padding: 18px;
    
}
footer { 
    grid-column-start: span 2;
    text-align: center;
    color: white;
    margin: 9px 0;
}

.inmainindex {
    display: inline-grid;
    grid-template-columns: auto fit-content(350px) auto;
}
idx1 {grid-column-start: span 3; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
idx2 {border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px; vertical-align: text-bottom;}
idx3 {border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; height:350px; width:350px;}
idx4 {border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; padding: 3px; vertical-align: text-bottom;}
idx5 {grid-column-start: span 3; border-radius: 9px; border: 21px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; display: inline-block; }

.inmain {
    display:grid;
    grid-template-columns: auto;
}
m1 {grid-column-start: span 1; height: 33; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m2 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m3 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m4 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m5 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m6 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m7 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
m8 {grid-column-start: span 1; border-radius: 9px; border: 3px; border-style: solid; border-color: #1d0042; margin: 6px; text-align: center; padding: 3px;}
  

.bt:link, .bt:visited {
  background: #984090;
  color: #7EF0F1;
  border: 3px;
  border-style: solid;
  border-color: #1d0042;
  border-radius: 9px;
  padding: 5px 10px;
  text-align: left;
  text-decoration: none;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 5px;
}

.bt:hover, .bt:active {
  color: #7EF0F1;
  background: #1d0042;
  border-style: solid;
  border-color: #984090;
  border-radius: 9px;
  text-align: left;
  
}

.btb:link, .btb:visited {
  background: #984090; 
  border-radius: 9px;
  color: #7EF0F1;
  border: 3px;
  border-style: solid;
  border-color: #1d0042;
  padding: 5px 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
}

.btb:hover, .btb:active {
  color: #7EF0F1;
  background: #1d0042;
  border-radius: 9px;
  border-style: solid;
  border-color: #984090;
}

h1 {
  font-family: "League Spartan", sans-serif;
  font-weight: bold;
  font-style: normal;
  text-transform: uppercase;
  font-size: 303%;
}

h2 {
  background-color: rgb(32 64 148);
  border: 6px;
  border-color: #1d0042;
  border-style: solid;
  text-align: center;
  font-family: "League Spartan", sans-serif;
  font-weight: bold;
  font-style: normal;
  text-transform: uppercase;
  padding: 9px;
  margin: 9px;
}

#bli {
  height: 20px;
  width: 150px;
}


.imgContainer{
    float:left;
}

html {
  height: 100%;
  width: 100%;
  text-align: left;
  background-image: url("images/stars3.gif");
  background-repeat: repeat;
  background-color: #1d0042;
  position: relative;
  font-family: "Comic Relief";
  font-weight: 400;
  font-style: normal;
}

#albumCover {
  height: 300px;
  width: 300px;
  text-align: left;
}