.symbolDataHolder {
background: #d0ffd0;
border-radius: 4px;
border: 1px black solid;
min-width: 300px;
min-height: 460px;
margin: 30px 0px;
}

#emojiField {
background: #d0ffd0;
border-radius: 4px;
border: 1px black solid;
padding: 10px;
min-width: 300px;
margin: 20px 0px; 
}
#emojiField p {text-align: center;}

.symbolHolder {
margin: 3px;
padding: 10px;
text-align: center;
}

.codeTitle {
display: inline-table;
background: #c0c0c0;
color: black;
width: 30%;
border-radius: 4px;
padding: 5px;
margin: 5px;
text-align: right;
}


.codeData, .emojiButton {
background: #11600e;
color: white;
border-radius: 4px;
padding: 5px;
margin: 5px;
cursor: pointer;
box-shadow: inset 2px 2px 2px rgba(255, 255, 255, .4), inset -2px -2px 2px rgba(0, 0, 0, .4);
}

.codeData {display: inline-table; width: 45%;}

.codeData p {
background: #fff;
color: black;
border-radius: 4px;
padding: 5px;
}

.emojiImage {border: 8px #c0c0c0 solid; border-radius: 4px;}

.emojiButton {display: inline-flex; align-items: center; justify-content: center;}
.emojiButton img {margin-left: 5px;}

.fontSlider {padding: 0px; margin: 20px 0px; position: relative; left: 50%; border: solid #11600e 3px; border-radius: 4px;
background: url("../pics/sliderBackground.png");
background-repeat: no-repeat;
background-size: 300px 30px;
}
.pointerSlider {width: 2px; background: black; position: relative; left: 50px; height: 30px;}

@media screen and (max-width: 1199px){
.emojiButton:nth-of-type(2), .emojiButton:nth-of-type(3) {display: none;} 
}