*,html{padding:0;margin:0;box-sizing:border-box}.page-wrap{max-width:1200px;margin:0 auto}.row{display:flex;flex-wrap:wrap;width:100%}.col1-12{width:8.3333333333333%}.col2-12{width:16.666666666667%}.col3-12{width:25%}.col4-12{width:33.333333333333%}.col5-12{width:41.666666666667%}.col6-12{width:50%}.col7-12{width:58.333333333333%}.col8-12{width:66.666666666667%}.col9-12{width:75%}.col10-12{width:83.333333333333%}.col11-12{width:91.666666666667%}.col12-12{width:100%}.col1-12,.col2-12,.col3-12,.col4-12,.col5-12,.col6-12,.col7-12,.col8-12,.col9-12,.col10-12,.col11-12,.col12-12,.col1-5{display:block;float:left;min-height:20px;border-left:8px solid transparent;border-right:8px solid transparent}[class*=col]:first-child{border-left:none}[class^=col]:last-child{border-right:none}body{background:rgba(0,0,0,0.1);padding:0;color:#222;font-family:sans-serif;font-size:14px}a{color:inherit;text-decoration:none}a:hover{color:#d45500}.w-pad{width:10px}.h-pad{height:10px}.byte-bg-data{background:#ffe680!important}.byte-bg-key{background:#fac!important}.byte-bg-initvector{background:#f95!important}.byte-bg-general{background:gray!important}.byte-bg-static{background:#999!important;opacity:.7}.page-title{margin-top:10px;margin-bottom:5px}.heading{justify-content:space-between;align-items:center}.menu{display:flex}.menu .item{padding:5px;display:inline-block;border:1px solid #000;margin-bottom:8px;display:block;font-size:.8em}.menu .item.active{background:#222;color:#eee}.menu .item:first-child{border-radius:3px 0 0 3px}.menu .item:last-child{border-radius:0 3px 3px 0}.input-block{background:#fff;padding:10px;box-shadow:1px 5px 5px rgba(0,0,0,0.1);margin-bottom:15px;border-radius:5px}.input-block textarea,.input-block input{padding:5px;margin-bottom:8px;border:1px solid rgba(0,0,0,0.3);border-radius:3px}.general-input{display:flex;flex-direction:column}.general-input label{font-size:.8em;opacity:.6}.allow-x-scoll{overflow-x:auto}.text-byte-block{background:rgba(0,0,0,0.1);position:relative}.text-byte-block .name{font-size:.6em;position:absolute;padding:0 2px;background:green;color:#fff;opacity:.5;transition:all .1s}.text-byte-block:hover .name{background:#000;font-size:.9em;opacity:1;z-index:2}.text-byte-block .block{display:flex;align-items:center}.text-byte-block .item{background:#ff0;width:20px;height:20px;border:1px solid #000;line-height:1em;text-align:center;display:flex;align-items:end;justify-content:center;flex-shrink:0}.text-byte-block .item.s{font-size:11px}.action-cols-container{overflow-x:auto;display:flex;padding-bottom:10px}.action-cols-container.compress{max-height:300px}.compress-height-toggle{display:flex;align-items:center;-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;padding:3px 20px;font-size:.8em}.compress-height-toggle:hover{color:red}.block-spaced{justify-content:space-between}.block-title{margin-top:10px;margin-bottom:5px;color:#444}.action-cols{padding:4px;margin-right:10px;box-shadow:0 2px 5px rgba(0,0,0,0.5);border-radius:5px;background:#fff;flex-shrink:0}.action-cols .title{background:#333;color:#eee;padding:5px;text-align:center;font-weight:700;border-radius:3px;margin-bottom:5px}.char-block{display:flex}.char-block .item{width:20px;height:14px;display:flex;align-items:center;line-height:1em;justify-content:center}.single-action-block{background:#fff;padding:3px;margin-bottom:10px;box-shadow:0 3px 7px rgba(0,0,0,0.2);border-radius:3px}.single-permutation-block{padding:10px;background:#fff;border-radius:5px;box-shadow:1px 5px 6px rgba(0,0,0,0.1);margin-bottom:20px;margin-right:20px}.single-permutation-block .subtitle{background:#333;color:#ccc;padding:5px 10px;margin-bottom:10px;border-radius:3px}.sample-table{display:flex;flex-direction:column}.sample-table .cell{width:20px;height:3px;border-top:1px solid #000;border-left:1px solid #000}.sample-table .cell:last-child{border-right:1px solid #000}.single-iteration{background:#d7e3f4;margin-bottom:10px;padding:5px;border-radius:3px}.single-iteration .subtitle{margin-bottom:8px;text-align:center;font-weight:700;font-size:.8em;padding:3px 2px;border-bottom:1px dotted #fff}.input-span{margin-left:5px;margin-right:10px}.key-gen-block{background:#fff;margin-top:2px;margin-right:10px;margin-bottom:10px;box-shadow:1px 1px 10px rgba(0,0,0,0.5);padding:5px;border-radius:5px}.key-gen-block .title{background:red;margin-bottom:5px;padding:2px 5px;background:#333;color:#ddd;font-size:.8em}.key-gen-block .small{font-size:.7em}.key-connector{width:2px;height:60px;border-left:1px dashed blue;transform:translate(-5px,40px) rotate(22deg)}.bits-row{margin:1px 0}.bits-row:hover .item .index{cursor:none}.bytes-bits{border:1px solid #000}.bytes-bits .item{float:left;font-size:.6em;display:flex;flex-direction:column;justify-content:space-between}.bytes-bits .item:hover .index{background:red;opacity:1;color:#fff}.bytes-bits .item .index{width:3px;height:2.1em;overflow-wrap:break-word;line-height:1em;opacity:.5}.bytes-bits .item .bit{background:#222;color:#eee}.sbox-block{margin-bottom:10px}.sbox-bits{margin:5px 0;margin-right:10px}.sbox-bits:hover{cursor:none}.sbox-bits .item{float:left;font-size:1em;display:flex;flex-direction:column;justify-content:space-between}.sbox-bits .item .index{width:3px;height:2.1em;overflow-wrap:break-word;line-height:1em;opacity:.3}.sbox-bits .item:hover .index{background:red;opacity:1}.sbox-bits .item .bit.x{background:green}.sbox-y-bg{background:#ff7f2a}.sbox-x-bg{background:#ffd42a}.sbox-calc-part{font-size:.8em}.sbox-calc-part .title{opacity:.7}.sbox-calc-part .result-half-byte{background:#c6e9af;padding:3px;text-align:center;font-size:1.3em}.general-error-block{background:#f4d7d7;padding:20px;border-radius:5px;margin:50px 0;box-shadow:1px 5px 8px rgba(255,0,0,0.1)}footer{margin-top:20px;padding:10px;background:rgba(0,0,0,0.1)}@media screen and (max-width: 1220px){.page-wrap{margin:0 10px}}