* {-webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;}
body {font-family: system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen-Sans,Ubuntu,Cantarell,helvetica neue,sans-serif; background: #f0f0f0;}
h1 {font-size: 41px; font-weight: 600; margin-bottom: 20px;}
h3 {font-size: 30px; margin: 10px 0 20px 0; text-align: center;}
h2 {font-size: 28px; margin: 20px 0px;}
h4 {font-size: 24px; text-align: center; margin: 20px 0px;}
h5 {font-size: 20px; margin-top: 20px;}
a {color: #11600e;}
ul {list-style: square; margin: 10px 0 20px 20px;}
ul li {padding: 10px 0 0;}
img {max-width: 800px; height: auto;}

/*header*/
header {width: 100%; background: #000; display: flex; justify-content: center; align-items: center; position: fixed; height: 95px; top: 0px; z-index: 100;}
header a {color: white; text-decoration: none;}
.topLinks {display: flex; align-items: center; justify-content: center;}
.topLinks a {font-size: 17px; font-weight: 700; margin-left: 10px; text-align: center;}
.shadow {text-shadow: 2px 2px 5px #22bb22; margin-left: 15px; color: white; font-size: 23px; line-height: 1.1;}
/*search*/
#resultsBox {position: absolute; z-index: 2; top: 100px; width: 500px; background: #edf9eb; border: 2px #004400 solid; border-radius: 4px; margin-left: 10px; display: none;}
#searchHolder {display: flex; align-items: center; justify-content: start; margin: 0 20px 0 20px ;}
#searchBox{border-radius: 5px; width: 230px; height: 41px; padding: 7px; font-size: 19px; color: black; background: #eeffee; border: none; margin-right: 20px;}
input[type=search]:focus {outline: none;}
.search-result-link {display: block; padding: 5px 10px; color: #003300; font-size: 17px;}
.search-result-link:nth-of-type(even) {background: #e0e0e0;}
.search-result-link:last-of-type {border-bottom: 2px #004400 solid; padding-bottom: 20px;}
.topright {position: absolute; top: 0; left: 460px;}
#nextButtons {display: flex; align-items: center; margin: 5px 10px 10px 10px; font-size: 14px;}
#nextButtons div {font-weight: bold; margin: 10px 10px 0 0; color: #444;}
.helpUs {background: #e0ffe0; padding: 10px; margin: 20px 0; border-radius: 4px; border: 1px solid transparent; box-shadow: 0 1px 5px 0 rgba(10,10,10,.4);}
/*structure*/
main {display: flex; justify-content: center; font-size: 23px; line-height: 1.6;}
.container {padding-top: 100px; max-width: 1144px;}
.content {display: flex; align-items: stretch; width: 100%;}
.leftDiv {width: 100%; margin-right: 20px; padding: 10px 40px;} 
.rightDiv {width: 300px;}
.leftDiv, .rightDivBox, .curriculum-content, .testLink, .topLevelPages {background: white; border-radius: 3px; border: 1px solid transparent; box-shadow: 0 1px 5px 0 rgba(10,10,10,.4);}
.rightDivBox {padding: 10px; margin-bottom: 30px; width: 280px;}
footer {margin: 20px 0 0 0; padding: 7px 0; width: 100%; text-align: center; background: #222; color: white; font-size: 13px;}
footer a {color: #fff; text-decoration: none;}
#expandGameArea {border: 1px #355E3B solid; background: #d1f1d1; padding-bottom: 20px;}
.clearDecks {width: 100%; display: flex; justify-content: flex-end;}
.clearDecks img, .expandTest img {margin: 5px !important; cursor: pointer;}
.rightDiv h2 {text-align: center; margin-top: 0;}
.topH2 {font-size: 23px; font-weight: bold; padding-bottom: 20px; border-bottom: 1px #e0e0e0 solid; margin: 0 0 0 -30px;}
// .leftDiv h2 {margin-top: 30px;}
.biscuitTrail {display: flex; justify-content: start; align-items: center; margin: 0 0 20px -30px; padding-bottom: 10px; border-bottom: 1px #e0e0e0 solid; font-size: 23px;}
.biscuitTrail a {color: #004400; text-decoration: none; font-weight: bold;}
.arrow {color: #a0a0a0; padding: 0 7px;}
.nextPage a {display: block; background: black; color: white; border-radius: 4px; margin: 10px 0; text-align: center; text-decoration: none;}

/*see-also*/
.see-also, .scorerLine {display: flex; align-items: center; flex-wrap: wrap;}
.see-also a {display: inline-flex; align-items: center; justify-content: center; text-align: center; padding: 5px; border-radius: 7px; width: 190px; height: 100px; text-decoration: none; margin: 5px 10px; color: white; font-size: 19px; text-overflow: ellipsis;}
.see-also a:nth-of-type(3n){background: #004400;}
.see-also a:nth-of-type(3n+1){background: #005500;}
.see-also a:nth-of-type(3n+2){background: #006600;}
.see-also a:hover {background: black;}

.shareZone {display: flex; align-items: center; padding: 10px;}
.shareZone img {margin: 0 !important;}
#urlArea {width: 100%; height: 52px; color: #444; border: 2px #004400 solid; border-radius: 4px; padding: 2px;}
.centerIt {display: flex; justify-content: flex-start; align-items: center;}
.centerIt img {margin-right: 20px !important;}
.references {font-size: 10px; color: #888; margin: 20px;}
.text-centred {text-align: center; margin-bottom: 20px;}
.adHolder {display: flex; align-items: center; justify-content: space-between !important; position: relative; left: 50%; width: 640px; margin-left:-320px; height: 260px;}
.contentImage {margin: 5px 20px 5px 0px;}
.pageImage {margin: 30px 0px; text-align: center;}
.pageImage img {border: #e0e0e0 4px solid;}
.imageBlock {margin: 20px 0px;}
.imageBlock img {margin: 10px 10px 0px 0px; border: 4px solid #c0c0c0; border-radius: 3px; float: left;}
.topright {position: absolute; top: 0; left: 460px;}
table {border-collapse: collapse; width: 100%; margin: 30px 0px;}
th {background: #000; color: white; font-weight: bold; text-align: center; border-left: 1px solid white; padding: 10px;}
th:first-of-type {border-left: 1px solid black;}
th:last-of-type {border-right: 1px solid black;}
td {border: 1px solid black; padding: 10px; text-align: left;}

input[type=button] {padding: 5px; margin: 5px;}

.highlight {background: #d0d0d0;}

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
margin: 30px 0 15px 0;
border: 2px black solid;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.videobox {height: auto;}
.sidebar-content .videobox {margin-top: 20px;}
.extras {margin: 30px 0px;}
.ximage {border: #c0c0c0 5px solid;}
.fontred {color: red;}

/*ads*/
.adTop, .adBottom, .adMiddle {display: flex; align-items: center; justify-content: space-between; height: 250px; margin: 20px 0;}
.adTR {height: 250px; margin: 20px 0; text-align: center;}
.adBR {height: 600px; position: -webkit-sticky; position: sticky; top: 110px; margin: 20px 0 0; text-align: center;}

/*iPhone Formatting*/

#phoneMsg p {padding: 5px; border-radius: 2px;}
.cright, .cleft {display: flex; justify-content: space-between; margin-bottom: 5px;}
.cleft p {background: #aaffaa;}
.cright p {background: #d0d0d0;}
#phoneMsg {width: 340px; position: relative; left: 50%; margin-left: -170px; border: 4px solid black; border-radius: 4px; padding: 5px; min-height: 450px; background-image: url("https://www.cyberdefinitions.com/images/iphone_background.webp");}
.sorryMsg {display: flex; align-items: center; justify-content: center; font-size: 15px;}
.authorBox {display: flex; align-items: center; margin: 20px 0 20px; font-size: 17px;}
.authorBox img {border-radius: 50%; margin-right: 10px;}
#phoneTranslate {position: relative; left: 50%; width: 80px; margin: 10px 0px 10px -40px;}
#phoneTranslate button, .formButton {background: #004400; color: white; padding: 2px 4px; border-radius: 4px; font-size: 23px; border: 1px solid transparent; box-shadow: 0 1px 5px 0 rgba(10,10,10,.4); cursor: pointer;}
.shareMe {margin-left: 15px; font-size: 14px;}

/*Misc Formatting*/
.small {font-size: 0.8em;}
.big {font-size: 1.4em;}
.clearer {clear: both;}
.curs {cursor: pointer}
#messageWindow {display: none; position: fixed; width: 340px; height: 420px; top: 40%; left: 50%; margin: -200px 0 0 -182px; border: 2px solid #444; border-radius: 4px; background: white; text-align: center; padding: 5px 10px; z-index: 100;}
.trMsg  {position: absolute; top: 0; left: 300px;}
.mobileOnly {display: none;}
.hamburger {background: green; border: none; width: 30px; height: 30px; border-radius: 3px; padding: 2px;}
.hamburger img {transition: transform 1s;-webkit-transition: transform 0.5s;}



/*sidebox*/
.sidebox, .helpUs {
padding: 15px;
border: 2px solid #ddd;
border-radius: 2px;
margin: 2em 0em;
}

.sidebox {background: #e0e0e0;}
.helpUs {background: #ffffff;}
.helpUs h4 {margin-top: 0px;}
.sidebox img {vertical-align: middle; margin-right: 0.5em;}
.imageIntro {margin: 20px 0px;}
.imageLabel {margin-bottom: 30px;}

.topLevelPages a {display: block; border: dotted 2px #11600e; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 80px; margin: 10px; text-decoration: none;}
.topLevelPages p:first-of-type {font-weight: bold;}

.topLevelPages a:nth-of-type(1){
background-image: url('https://cyberdefinitions.com/images/send-large-emoji-sidebar.webp');
background-repeat: no-repeat;
}

.topLevelPages a:nth-of-type(5){
background-image: url('https://cyberdefinitions.com/images/send-encrypted-message-sidebar.webp');
background-repeat: no-repeat;
}
.socialsBox {display: flex !important; justify-content: space-around; align-items: center; margin-top: 20px; padding: 10px 0 0 !important;}
.top20 {margin-top: 20px;}
.bottom20 {margin-bottom: 20px;}
.jello-horizontal{-webkit-animation:jello-horizontal .9s both;animation:jello-horizontal .9s both}

@-webkit-keyframes jello-horizontal{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes jello-horizontal{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}
.rotate-center{-webkit-animation:rotate-center .6s ease-in-out both;animation:rotate-center .6s ease-in-out both}
@-webkit-keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-center{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}

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


/* ----------------------------------------------
 * Generated by Animista on 2023-8-1 9:21:4
 * ---------------------------------------------- */

/* small desktop */
@media screen and (min-width: 991px) and (max-width: 1260px) {
.container {padding-top: 100px; width: 95%;}
img {max-width: 500px;}
#searchHolder input[type=search]{width: 210px; border: 2px solid #004400;}
.shadow, .topLinks {font-size: 17px; margin-left: 10px;}
.shadow {padding: 2px 5px;}
.topLinks a {width: 75px; margin-left: 6px;}
#searchBox {margin: 0px;}
}

/* mobile */
@media screen and (max-width: 990px) {
body {background: white; font-size: 19px;}
header {width: 100%; height: 105px; position: fixed; z-index: 100; display: block;}
#searchHolder input[type=search]{width: 190px;}
#headerLogo {position: absolute; top: 35px; left: 10px; width: 60px; height: 60px;}

#searchBox {margin: 15px 0 0 100px;}
.adBox {width: 100%;}
/*search*/
#searchHolder {width: 100%; position: fixed; z-index: 100; justify-content: space-between; margin: 0;}
#searchHolder img {margin-right: 20px;}
#resultsBox {position: fixed; top: 115px; left: 50%; width: 350px; margin: 0 0 0 -175px;}
.topright {left: 315px; display: block !important;}
.shadow {margin: 5px 0 0 5px; font-size: 19px;}
h1 {margin: 100px 2% 0 2%; padding: 1%;}
.topLinks {display: none;}
main {width: 100%; background: white;}
.container, .content, .biscuitTrail, .topH2, .rightDivBox {display: block; width: 100%; margin: 0px; border: none; padding: 0px;}
.biscuitTrail {font-size: 16px; margin: 20px 0;} 
.leftDiv, .rightDiv {display: block; width: 94%; margin: 2%; border: none; padding: 1%; box-shadow: none;} 
.nomobile {display: none;}
.mobileOnly {display: block; margin-right: 10px;}
.biscuitTrail {font-size: 16px; margin: 20px 0;}
.nextPage p {padding: 10px;}
img {max-width: 350px; height: auto;}
.gridtable img {max-width: 170px;}
.see-also {justify-content: center;}
.see-also a {width: 48%; margin: 2px; font-size: 16px;}
.contentImage {width: 50%; margin: 10px;}
#urlArea {width: 200px; overflow: hidden;}
#shareArea {justify-content: space-evenly;}
#messageWindow {margin: -100px 0 0 -182px;}
#messageWindow h2 {margin: 15px 0;}
#navTable {margin: 20px 0 0 0;}
#navTable td {border: none;}
#navTable a {color: #001100; font-weight: 700; text-decoration: none; font-size: 19px;}
}