/*cyber definitions encryption*/

.letterHolder, .numberHolder, .textHolder {
display: inline-table;
text-align: center;
margin: 5px;
width: 30px;
height: 30px;
border: 1px solid black;
}

.letterHolder {background: #c0c0c0;}
.numberHolder {background: #e0e0e0;}
.textHolder {background: #fff;}

#explainCrypt, #encryptionBox, #step5 {
display: none;
word-wrap: break-word;
margin: 10px 0px;
}

.explainCryptHolder {
display: none;
border: 2px solid black;
border-radius: 5px;
padding: 10px;
background: #fff;
width: 100%;
}

.cryptoBox {
margin: 20px 0px;
border: 2px solid black;
border-radius: 5px;
padding: 10px;
background-color: #e5ffe5;
width: calc(100%-0px);
}

.cryptoBox:nth-of-type(3) {
background-image: url('https://cyberdefinitions.com/images/send-encrypted-message-large.png');
// background-repeat: repeat-x;
background-position: center left;
background-color: transparent !important;
}
.cryptoBox h2 {margin: 0px 0px 30px; text-align: center;}
.shareButton {background: #11600e; color: white; display: flex; align-items: center;}
.shareButton img {margin: 0px 10px;}

#myCryptoWord, #myCryptoMessage, #myDeCryptMessage, #cryptoButtons1, #cryptoButtons2, #exampleText {padding: 10px; font-size: 23px;}
#encryptMsg, .resultsArea {width: 100%;}

#myCryptoWord {width: 400px;}
#myCryptoMessage, #myDeCryptMessage, #exampleText {width: 100%;}

.crypoBtn {padding: 10px; font-size: 23px; border: none; border: 1px #c0c0c0 solid; border-radius: 3px; margin: 5px 10px;
box-shadow: inset 2px 2px 2px rgba(255, 255, 255, .4), inset -2px -2px 2px rgba(0, 0, 0, .4);}
.buttonOff {background: #e0e0e0; color: #c0c0c0;}


.explainStep {
background: #e0e0e0;
color: #444;
border: 1px #c0c0c0 solid;
border-radius: 3px;
padding: 10px;
margin: 10px 0px;
overflow-wrap: break-word;
}

.callOutBlock {display: flex; align-items: center; border: 3px #c0c0c0 solid; padding: 10px; border-radius: 4px; margin: 20px 0px;}
.callOutBlock p {margin-left: 20px;}


@media screen and (max-width: 1199px) {

#myCryptoWord, #myCryptoMessage, #myDeCryptMessage {width: 100%; font-size: 17px;}
	
}