.qwiz_shortcodes_hidden {
   position:         relative;
   visibility:       hidden;
   height:           300px;
}

.qwiz_wrapper_fallback,
.qdeck_wrapper_fallback {
   position:         absolute;
   visibility:       hidden;
   height:           300px;
   width:            500px;
   border:           1px solid black;
   padding-top:      125px;
   background:       white;
   text-align:       center;
}

/* The "canvas" for each item: question, answers (choices), feedback. */
div.qcard_window {
   position:            relative;
   width:               500px;
   height:              300px;
   margin-bottom:       80px;   /* Progress, header, and next-buttons. */
}

/* Some styles set padding to 0. */
div.qcard_window ul {
   padding:             40px;
}

/* Mobile qcard window fills screen. */
div.qdeck-mobile {
   position:            absolute;
   left:                0;
   top:                 0;
   width:               100vw;       /* 100% of viewport width, height. */
   height:              100vh;
   z-index:             1999;
   box-sizing:          border-box;  /* Width and height include border */
   -moz-box-sizing:     border-box;  /* and padding, not margin. */
}

/* Card container fills to size of qcard window, but transparent bottom border
   leaves room for next-buttons after accounting for progress and header.
   Negative bottom margin: next-buttons within "border." */
div.qdeck-mobile div.card-container {
   width:               100%;
   height:              100%;
   box-sizing:          border-box;
   border-bottom:       80px solid rgba(0, 0, 0, 0);
   margin-bottom:       -80px;
}

.qcard_progress {
   position:            relative;
   text-align:          right;
   min-height:          14px;
   font-size:           9pt;
}

.qcard_progress p {
   font-size:           9pt;
   color:               gray;
   margin:              0px 18px 0 0 !important;
}

/* Create a click target larger than the image icon. Appears to "get on top of"
 * next div (mode) only if positioned absolutely. */
div.go-mobile-qdeck,
div.exit-mobile-qdeck {
   display:             none;
   position:            absolute;
   width:               40px;
   height:              40px;
   top:                 -10px;
   left:                -10px;
   z-index:             2;
}
img.go-mobile-qdeck,
img.exit-mobile-qdeck {
   display:             none;
   position:            absolute;
   margin:              4px 4px 0 0;
   border:              none;
   top:                 0;
   left:                0;
}


.qwiz-usermenu_icon {
   visibility:          hidden;
   position:            absolute;
   right:               1px;
   top:                 -2px;
   transform:           scale(1.0, 0.65);
   -webkit-transform:   scale(1.0, 0.65);
}

.qwiz-icon-bounce {
   animation-name:                    icon-bounce;
   animation-duration:                3.5s;
   animation-iteration-count:         infinite;

   -webkit-animation-name:            icon-bounce;
   -webkit-animation-duration:        3.5s;
   -webkit-animation-iteration-count: infinite;
}
@keyframes icon-bounce {
   from {
      margin-top:   -2px;
   } 7% {
      margin-top:   -10px;
   } 15% {
      margin-top:   -2px;
   } 22% {
      margin-top:   -7px;
   } 30% {
      margin-top:   -2px;
   } 37% {
      margin-top:   -7px;
   } 50% {
      margin-top:   -2px;
   } to {
      margin-top:   -2px;
   }
}

@-webkit-keyframes icon-bounce {
   from {
      margin-top:   -2px;
   } 7% {
      margin-top:   -10px;
   } 15% {
      margin-top:   -2px;
   } 22% {
      margin-top:   -7px;
   } 30% {
      margin-top:   -2px;
   } 37% {
      margin-top:   -7px;
   } 50% {
      margin-top:   -2px;
   } to {
      margin-top:   -2px;
   }
}

div.qdeck-usermenu {
   position:        absolute;
   display:         none;

   /* Keep in front of labels. */
   z-index:         3;

   top:             2px;
   right:           0px;
   background:      white;
   padding:         5px;
   border:          2px solid rgba(79, 112, 153, 1);
   box-shadow:      -3px 3px 2px gray;
   text-align:      left;
}

div.qdeck-usermenu div {
   padding-bottom:  5px;
}

div.qdeck-login {
   text-align:          center;
   font-weight:         normal;
}

div.qdeck-login p {
   margin-bottom:       6px;
}

div.qdeck-login input[type="text"],
div.qdeck-login input[type="password"] {
   padding:             3px;
   width:               20rem !important;
}

div.qdeck-login table {
   width:               auto;
   margin:              auto;
   border:              0px;
}

div.qdeck-login td {
   border:              none;
}

.qdeck-register-forgot {
   font-size:           80%;
}
.qdeck-remember {
   position:            relative;
   font-size:           80%;
}

span.qdeck-remember span {
   position:            relative;
   top:                 2px;
}

span.qdeck-remember input[type="checkbox"] {
   transform:           scale(0.8);
   -webkit-transform:   scale(0.8);
}

div.qdeck-login p.login_error {
   visibility:          hidden;
   color:               red;
   font-weight:         bold;
   text-align:          center;
}

div.qcard_header {
   color:               white;
   background:          black;
   margin:              0px;
   padding:             0px;
}

/* Any sub-elements of header have zero margin. */
div.qcard_header * {
   margin:              0px !important;
                    /* top right bot left */
   padding:             0px 5px 0px 5px !important;
   font-size:           10pt;
}

/* Card */
div.qcard_card {
   position:            relative;
}

div.qcard_textentry {
   display:             inline-block;
   position:            relative;
   width:               240px;
   font-weight:         bold;
   color:               blue;
}

div.qcard_single_char_entry {
   display:             inline-block;
   position:            relative;
   font-weight:         bold;
   color:               blue;
}

input.qcard_textentry,
input.qcard_single_char_entry {
   width:               228px;
   padding:             5px;
   font-weight:         bold;
   color:               blue;
   font-size:           100%;
}

div.card_back_textentry {
   /*
   position:            absolute;
   top:                 0px;
   left:                0px;
   display:             none;
   */
   position:            relative;
}

.back_qcard_textentry {
   font-weight:         bold;
   color:               blue;
}

input.qcard_textentry::-webkit-input-placeholder {
   font-size:           83%;
   font-weight:         normal;
   color:               gray;
}

input.qcard_textentry::-moz-placeholder {
   font-size:           83%;
   font-weight:         normal;
   color:               gray;
}

/* Older versions of Firefox */
input.qcard_textentry:-moz-placeholder {
   font-size:           83%;
   font-weight:         normal;
   color:               gray;
}

input.qcard_textentry:-ms-input-placeholder {
   font-size:           83%;
   font-weight:         normal;
   color:               gray;
}

button.textentry_hint {
   position:            absolute;
   right:               0px;
   top:                 50%;
   transform:           translateY(-50%);
   -webkit-transform:   translateY(-50%);
   font-size:           11px !important;
   line-height::        90%;
                    /* top right bot left */
   padding:             2px 2px 1px 2px;
   border-radius:       5px;
   display:             none;
}

.back_textentry_p {
   margin-top:          0px;
}

div.qdeck_hangman {
   position:            relative;
   display:             inline-block;
   height:              45px;
   margin-bottom:       12pt;
}
div.qdeck_hangman_w_hint {
   margin-right:        33px;
}

div.qdeck_hangman div.entry {
   font-size:           125%;
   padding-left:        4px;
   display:             inline-block;
}
div.qdeck_hangman .entry {
   font-family:         'courier new';
   font-weight:         bold;
   color:               blue;
   background:          white;
}

div.qdeck_hangman input {
   position:            absolute;
   left:                0;
   top:                 0;
   box-sizing:          border-box;  /* Width and height include border */
   -moz-box-sizing:     border-box;  /* and padding, not margin. */
   width:               100%;
   background:          none;
   font-family:         'courier new';
   font-size:           125%;
   font-weight:         bold;
   letter-spacing:      0.055em;   /* Pad out en-space to match regular chars
                                      plus hair-space. */
   padding:             3px;
}
input[type="text"]:focus {
   background:          none !important;
}

button.hangman_hint {
   position:            absolute;
   top:                 0px;
   right:               -33px;
   font-size:           11px !important;
   line-spacing:        90%;
   border-radius:       5px;
}

div.qdeck_hangman div.hangman_status {
   position:            absolute;
   left:                0px;
   top:                 2.5em;
   min-width:           14em;
   line-height:         110%;
   text-align:          left;
   font-size:           80%;
}

span.type_letters {
   font-family:         arial, verdana, sans-serif;
   font-size:           8pt;
   font-weight:         normal;
   color:               gray;
}
.qcard-inline {
   display:             inline;
}
div.qdeck_hangman .hangman_incorrect_letters_allowed {
   font-weight:         normal  !important;
   font-size:           125%    !important;
   padding:             0px     !important;
   /*
   background:          #40FF00 !important;
   */
   background:          white !important;
}
div.qdeck_hangman .hangman_incorrect_letters_exceeded {
   font-weight:         normal  !important;
   font-size:           125%    !important;
   padding:             0px     !important;
   /*
   background:          #FA5858 !important;
   */
   background:          white !important;
}
.spacer {
   visibility:          hidden;
}
.qdeck_hangman_msg {
   display:             none;
}

div.qcard-front-back {
   position:            absolute;
   width:               100%;     /* DKTMP */
   height:              100%;     /* DKTMP */
   min-height:          265px;
   border-collapse:     separate;
   background-color:    white;

   box-sizing:          border-box;  /* Width and height include border */
   -moz-box-sizing:     border-box;  /* and padding, not margin. */
}
div.qcard-border-important {

   /* "!important", to overcome theme styling, if there. */
   border-width:        2px !important;
   border-style:        solid !important;
   border-color:        black !important;
}
div.qcard-border {

   /* Alternative to important when user specifies border styling. */
   border-width:        2px;
   border-style:        solid;
   border-color:        black;
}

div.qcard-front {
   min-height:          265px;
   background:          white;
}

div.qcard_content {
   position:            relative;
   text-align:          center;
   font-size:           12pt;
   font-weight:         bold;
}
div.qcard_content_size {
   display:             inline-block;
   padding:             5px;
}

div.qcard_card img {
   border:              none !important;
   box-shadow:          none !important;
}

p.topic_list {
   font-weight:         normal;
   text-align:          left;
   margin-left:         2em !important;
   text-indent:         -2em;
}

div.icon_qdeck {
   position:        absolute;
   left:            2px;
   bottom:          2px;
   width:           16px;
   height:          16px;
   line-height:     0px;
}

img.icon_qdeck {
   opacity:         0.4;
}

img.icon_qdeck:hover {
   opacity:         1.0;
}

div.qcard-back {
   background-image:    url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAf4AAAE2CAIAAAAPtmerAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEnklEQVR4nO3YMW1AMRQEwTgyf3ix9Mm8sLCLnUFw1Ra3ZuYHgJLf1wMAuE36AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIEf6AXKkHyBH+gFypB8gR/oBcqQfIGf//P293gDAVWtmXm8A4CqHD0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+Ts883rDQBctWakH6DF4QOQI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA5+3zzegMAV60Z6QdocfgA5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9Azj7fvN4AwFVrRvoBWhw+ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkLPPN683AHDVmpF+gBaHD0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+Ts883rDQBctWakH6DF4QOQI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA5+3zzegMAV60Z6QdocfgA5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9Azj7fvN4AwFVrRvoBWhw+ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkLPPN683AHDVmpF+gBaHD0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+RIP0CO9APkSD9AjvQD5Eg/QI70A+Ts883rDQBctWakH6DF4QOQI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA50g+QI/0AOdIPkCP9ADnSD5Aj/QA5/8mNPTHI1j+2AAAAAElFTkSuQmCC);
   background-repeat:   no-repeat;
   background-size:     contain;
   background-position: center;
   min-height:          265px;
   line-height:         25px;
   font-size:           12pt;

   /* Initial setting in order to show intro (Firefox). */
   visibility:          hidden;
}
div.qcard_card button.cbutton {
   display:          none;
}
.qcard_next_buttons {
   position:            relative;
   margin-top:          5px;
   text-align:          center;
}
.qbutton {
   margin-bottom: 2px;
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 3px 3px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px !important;
   font-weight: bold;
   font-family: arial, verdana, sans-serif;
   text-decoration: none;
   vertical-align: middle;
}
.qbutton_disabled,
.qbutton_disabled:hover {
   margin-bottom: 2px !important;
   border-top: 1px solid #cccccc;
   background: #cccccc;
   padding: 3px 3px !important;
   -webkit-border-radius: 8px !important;
   -moz-border-radius: 8px !important;
   border-radius: 8px !important;
   -webkit-box-shadow: none !important;
   -moz-box-shadow: none !important;
   box-shadow: none !important;
   text-shadow: none !important;
   color: #e6e6e6;
   font-size: 14px !important;
   font-weight: bold !important;
   font-family: arial, verdana, sans-serif;
   text-decoration: none;
   vertical-align: middle;
}
.qcard_next_buttons .qbutton:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
}
.qcard_next_buttons .qbutton:active {
   border-top-color: #1b435e;
   background: #1b435e;
}
.clear {
   clear:               both;
}

div.focusable {
   width:               5px;
   height:              2px;
   overflow:            hidden;
}
div.focusable input {
   border:              0px;
   background:          none;
}

/* Some WordPress themes eat these.  Restore. */
input[type="checkbox"] {
   -webkit-appearance:  checkbox !important;
}
input[type="radio"] {
   -webkit-appearance:  radio !important;
}
input[type="submit"],
input[type="button"] {
   -webkit-appearance:  button !important;
}
/*
select {
   -webkit-appearance:  textfield !important;
}
*/

/* For qwizard and user-page TinyMCE table plugin. */
.mce-item-table td,
.mce-item-table th {
   min-width:           25px !important;
}
/* To move table menu out of way. */
.mce-floatpanel {
   transform:           translate(0,40px) !important;
}

// flipCard_v2.css.
/* === CARD CONTAINER === */
div.fc_card-container img {
   position: static !important;
}
div.card-container {
   position: relative;
   display: block;
   width: 100%;
   height: 100%;
   padding: 0;
   margin: 0;

   -webkit-perspective: 1000px;
      -moz-perspective: 1000px;
        -o-perspective: 1000px;
       -ms-perspective: 1000px;
           perspective: 1000px;
}
/* === CARD === */
.card-container .card {
   border-radius: 0px;
   width: 100%;
   height: 100%;
   position: absolute;
   display: inline-block;
   padding: 0;
   margin: 0;
   -webkit-transition: -webkit-transform .7s;
    -moz-transition: -moz-transform .7s;
      -o-transition: -o-transform .7s;
     -ms-transition: -o-transform .7s;
         transition: transform .7s;
   -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
       -ms-transform-style: preserve-3d;
           transform-style: preserve-3d;
}
/* === STYLE FOR THE FRONT & BACK SIDE === */
div.card-container div.qcard_card {	
   border-radius: 0px;
   
   height: 100%;
   width: 100%;
   position: absolute;
   text-align: center;
   
   margin: 0;
   -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
       -ms-box-sizing:border-box;
           box-sizing:border-box;
/*
   -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
        -o-backface-visibility: hidden;
       -ms-backface-visibility: hidden;
           backface-visibility: hidden;
*/
}
/* === BEGINNING EFFECT === */
div.card-container div.qcard_card[data-direction="top"] div.qcard-back, 
div.card-container div.qcard_card[data-direction="bottom"] div.qcard-back {
   -webkit-transform: rotateX(180deg);
      -moz-transform: rotateX(180deg);
        -o-transform: rotateX(180deg);
       -ms-transform: rotateX(180deg);
           transform: rotateX(180deg);
}
div.card-container div.qcard_card[data-direction="right"] div.qcard-back,
div.card-container div.qcard_card[data-direction="left"] div.qcard-back {
        -webkit-transform: rotateY(180deg);
         -moz-transform: rotateY(180deg);
           -o-transform: rotateY(180deg);
          -ms-transform: rotateY(180deg);
              transform: rotateY(180deg);
}
/* === EFFECT DIRECTIONS === */
.flipping-right {
 -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
      -o-transform: rotateY(180deg);
     -ms-transform: rotateY(180deg);
         transform: rotateY(180deg);
   right:           0;
}
.flipping-left {
   -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
      -o-transform: rotateY(-180deg);
     -ms-transform: rotateY(-180deg);
         transform: rotateY(-180deg);
   right:           0;
}
.flipping-top {
   -webkit-transform: rotateX(180deg);
      -moz-transform: rotateX(180deg);
        -o-transform: rotateX(180deg);
       -ms-transform: rotateX(180deg);
           transform: rotateX(180deg);
}
.flipping-bottom {
   -webkit-transform: rotateX(-180deg);
    -moz-transform: rotateX(-180deg);
      -o-transform: rotateX(-180deg);
     -ms-transform: rotateX(-180deg);
         transform: rotateX(-180deg);
}
.noCSS3Container{
        -webkit-perspective: none !important;
           -moz-perspective: none !important;
                 -o-perspective: none !important;
            -ms-perspective: none !important;
                        perspective: none !important; 
}
.noCSS3Card{
   -webkit-transition: none !important;
      -moz-transition: none !important;
        -o-transition: none !important;
       -ms-transition: none !important;
                    transition: none !important;
   -webkit-transform-style: none !important;
      -moz-transform-style: none !important;
        -o-transform-style: none !important;
       -ms-transform-style: none !important;
           transform-style: none !important;
}
.noCSS3Sides{
   -webkit-backface-visibility: visible !important;
      -moz-backface-visibility: visible !important;
        -o-backface-visibility: visible !important;
       -ms-backface-visibility: visible !important;
           backface-visibility: visible !important;
   -webkit-transform: none !important;
      -moz-transform: none !important;
        -o-transform: none !important;
       -ms-transform: none !important;
           transform: none !important;
}
