@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400&display=swap');


body {
	font-family: 'Poppins', sans-serif;
	overflow: hidden;
	padding:0;
	margin:0;
}

h2 {
	font-weight: 200;
	text-transform: uppercase;
	border-bottom: 1px solid black;
}



/*  playground specifics */

cavnas { 
	width:100%;
	height:100%;
}

ul {
	padding:0;
	margin:0;
}

section {
	position: absolute;
	top:5vh;
	right:5vh;
	width:350px;
	margin-top: auto;
	max-height:90vh;
	overflow-y: auto;
	background-color: rgba(245,245,245,0.4);
	padding: 20px 20px 0;
	box-sizing: border-box;
}

section > ul {
	display:block;
	list-style: none;
}

section > div  {
	width: 46%;
    float: left;
    height: 3em;
    line-height: 3em;
    font-size: 1.4em;
    background-color: #aaaaaa;
    padding: 1%;
    margin:1%;
    text-align: center;
    cursor: pointer;

}
section > div:hover {
	background-color: #888888;
	color:white;
}

#material-interface li {
	width: 40px;
	height: 40px;
	margin: 0px;
	display: inline-block;
	text-align: center;
	font-size: 0.9em;
}

#shirt-fit {
	text-align: center;
}
#shirt-fit li {
	/*height:50px;*/
	width: 60px;
	margin: 5px;
	display: inline-block;
	text-align: center;
	font-size: 0.9em;
}

#shirt-fit li:hover, #shirt-fit li.active {
	text-decoration: underline;
	cursor: pointer;
} 

#change-camera li {
	/*height:50px;*/
	width: 45px;
	height: 50px;
	display: inline-block;
	font-size: 0.9em;
	margin: 5px;
}

li>img {
	height: 100%;
	max-height: 100px;
	width: auto;
}