* {
	background: #fbfaf1;


}

.inline-container {
		display: grid; border-width: 1px 0 0 1px;
		/*grid-template-columns: 220px 220px 220px 220px 220px 220px 220px;*/
		grid-template-columns: repeat(7, 1fr);
		/*align-items: stretch;*/
}
img {
    
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

div {
  	background: #f5f4e8;
  	font-size: 20px;
  	font-family: ibm-plex-mono, sans-serif;
    font-style: normal;

  	}
.bold {
	font-size: 25px;
	font-family: 'ibm plex mono bold'
}

.item {
  border: 1px solid #3c3b46;
  border-top: 2px solid #3c3b46;
  padding: 0px;
  font-size: 20px;
	
}
* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}
body{
	font-family:'ibm-plex-mono', sans-serif;
	font-weight: 400;
	font-size: 16px;
	text-align: center;
	font-style: normal;
}


main{
	margin: 8rem auto;
	max-width: 80%;
	text-align: left;
	font-family:'ibm-plex-mono', sans-serif;
	font-weight: 400;
	font-size: 16px;
	font-style: normal;
}

h1,h2 {
	font-family: 'ibm-plex-mono', sans-serif;
	font-weight: normal;
	text-align: center;
}
h3,h4,h5 {
	font-family: 'ibm-plex-mono', sans-serif;
	font-weight: normal;
	text-align: left;
    font-size: 16px;

}

h1{
	font-size: 5rem;
	
}


h2 {
	font-size: 2rem;
	
}
h3 {
	font-size: 1.75rem;
}
 
h4{
	font-size: 1.75rem;
}

h5{
	font-size: 1.75rem;
}

@media screen and (max-width: 1300px) {
	.inline-container{
		grid-template-columns: repeat(5, 1fr);
	}
	h1{
		font-size: 4rem;
	}
	h2{
		font-size: 1.5rem;
	}
	h3{
		font-size: 2rem;
	}
	h4{
		font-size: 2rem;
	}
	h5{
		font-size: 2rem;
	}
	

	.bold {
	    font-size: 20px;
	    font-family: 'ibm plex mono bold';
		height:  75px;
	}
	.img {
		height: 100px;
	}
	.item {
  border: 1px solid #3c3b46;
  border-top: 2px solid #3c3b46;
  padding: 0px;
  font-size: 15px;
}



@media screen and (max-width: 400px) {
	.inline-container{
		grid-template-columns: repeat(3, 1fr);
	}
	h1{
		font-size: 2rem;
	}
	h2{
		font-size: .5rem;
	}
	h3{
		font-size: 1rem;
	}
	h4{
		font-size: 1rem;
	}
	h5{
		font-size: 1rem;
	}
	.item{
		font font-size: 7px;
		font-family: ibm-plex-mono, sans-serif;
        font-style: normal;
        height: 90px;
	}

	.bold {
	    font-size: 10px;
	    font-family: 'ibm plex mono bold';
		height:  50px;
	}
	.img {
		height: 50px;
	}
	body{
		font-family:'ibm-plex-mono', sans-serif;
	font-weight: 400;
	font-size: 5px;
	text-align: center;
	font-style: normal;

}
.item {
  border: 1px solid #3c3b46;
  border-top: 2px solid #3c3b46;
  padding: 0px;
  font-size: 6px;
	
}

@media print {


.color{
	width: 100px;
	height: 100px;
	margin: 10px;
}

.palette{
	display: flex;
}

.primary{
	flex: 2;
	background: #3c3b46;
}

.secondary, .tertiary{
	flex: 1;
}

.secondary{
	background: #f5f4e8;
}

.tertiary{
	background: #1a135f;
}
.tertiary{
	flex: 2;
}