/*Body*/
body {margin: 0;
  padding: 0;
/*this is how to cover the entire page*/
  height: 100vh; 
  width: 100%;
/*this is how to cover the entire page*/ 
  background-color: #1B1B15; 
  color: white;
  overflow-x: hidden;
  position: relative;
}

/*arrow button*/
.goback {position: absolute;
  right: 29%;
  top: 15px;
  border: none;
  font-size: 30px;
  color: yellow;
  background-color:rgba(255, 255, 255, 0);
}

/*marquees*/

.marquee1 {background: #000036;
  background: linear-gradient(0deg, rgba(0, 0, 54, 1) 19%, rgba(65, 65, 150, 1) 65%, rgba(0, 0, 54, 1) 94%);
  width: auto;
}

.marquee2 {background: #000036;
  background: linear-gradient(0deg, rgba(0, 0, 54, 1) 19%, rgba(176, 176, 176, 1) 56%, rgba(89, 0, 0, 1) 87%);
  width: auto;
  height: 25px;
}



/*Header Font*/
header {
  font-family: "Imbue", serif;
  font-weight: 800;
  font-style: normal;
  color:white;
}

/*h2 tag Font*/
h2 {
  font-family: "Playfair Display", serif;
  font-weight: 800;
  font-style: normal;
}

/*p tag Font*/
p {
  font-family: "Yantramanav", sans-serif;
  font-weight: 300;
  font-style: normal;
}

/*All*/
#all {height: auto;
  max-width: 130vh;
  background-color: #5F5F5E;
}

/*grid container*/
#container {background-color: rgba(255, 255, 255, 0);
  display: grid;
  grid: 125px 300px 300px 100px / repeat( 2, 155px) auto 270px;
  gap: 4px;
  padding: 2px;
  text-align: center;
  height:auto;
}

/*grid items*/
#container > div {background-color: Teal;
  overflow: hidden;
}

/*CATEGORY*/
.item1 {grid-row: 1 / span 4;
  border-radius: 15px 30px 0px 0px;
  display: flex;
  flex-direction: column;
}

.gory{background: green;
  border-bottom: 2px solid black;
  box-sizing:border-box;
  height: 45px;
  text-align: center;
  text-transform: uppercase;
  width: auto;
}

.ad1{background: purple;
  border: 2px solid black;
  height: 100px;
  margin-top: 5px;
  width: auto;
}

/*HEADER*/
.item2 {grid-column: 2 / span 2;
}

.item3 {grid-column: 4 / span 1;
  grid-row: 1 / span 2;
  border-radius: 15px 15px 0px 0px;
  display: flex;
  flex-direction: column;
}

.item4 {grid-column: 2 / span 2;
  display: flex;
  flex-direction: column;
}

.item10 {display: flex;
  justify-content: flex-end;
}

