.selectedAns {background: yellow;}

.emojiBlock {text-align: center;}
.eHolder {display: inline-flex; align-items: center; justify-content: space-between; flex-direction: column; width: 220px; background: white; border: 1px solid black; border-radius: 4px; height: 310px; margin: 5px 3px;}
.eHolder p {text-align: center;}
.eHolder div {font-size: 64px;}
.eHolder button {width: 65px; font-size: 13px; text-align: center; padding: 2px;}
.eHolder p:nth-of-type(2):before {content: "Alt ";}
.eHolder p:nth-of-type(3):before {content: "Hex ";}
.eHolder p:nth-of-type(4){padding: 5px; font-size: 12px; height: 40px; margin-bottom: 5px;}
.eHolder p:nth-of-type(5){padding: 5px; font-size: 12px; height: 40px; margin-bottom: 5px;}

.searchLine p {display: inline-block; width: 30px;}
.searchLine button {margin: 0px 5px; padding: 5px;}
.copybtn {width: 60px;}

.searchLine {
display: block;
padding: 5px 10px;
color: black;
margin-left: 10px;
}
.searchLine:nth-of-type(odd) {
background: #e0e0e0;}

.searchLine:first-of-type {
border-top: solid 1px #c0c0c0;
}
.searchLine:last-of-type {
border-bottom: solid 1px #c0c0c0;
}

#wsbuttons {
margin: 10px;
}

.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);
}


#emojiField {
background: #d0ffd0;
border-radius: 4px;
border: 1px black solid;
padding: 10px;
margin: 20px 0px;
z-index: 10;
margin: 20px 0px;
}

#emojiField p {text-align: center;}
.createInstruction {border: 2px #c0c0c0 solid; border-radius: 4px; padding: 10px; color: #404040; background: #e0ffe0; margin-bottom: 20px;}


.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;}

.bounce-in-top{-webkit-animation:bounce-in-top 1.1s both;animation:bounce-in-top 1.1s both}

@-webkit-keyframes bounce-in-top{0%{-webkit-transform:translateY(-500px);transform:translateY(-500px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}38%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}55%{-webkit-transform:translateY(-65px);transform:translateY(-65px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}72%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}81%{-webkit-transform:translateY(-28px);transform:translateY(-28px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}90%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}95%{-webkit-transform:translateY(-8px);transform:translateY(-8px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes bounce-in-top{0%{-webkit-transform:translateY(-500px);transform:translateY(-500px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}38%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}55%{-webkit-transform:translateY(-65px);transform:translateY(-65px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}72%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}81%{-webkit-transform:translateY(-28px);transform:translateY(-28px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}90%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}95%{-webkit-transform:translateY(-8px);transform:translateY(-8px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}



@media screen and (max-width: 1199px){
.eHolder {width: 180px;}
.eHolder p:nth-of-type(2){font-size: 12px;}
.eHolder p:nth-of-type(3){font-size: 12px;}


.searchLine a {display: block;}
.emojiButton:nth-of-type(2), .emojiButton:nth-of-type(3) {display: none;} 
}