/*imports for ie9 and 10, not sure why they aren't grabbing styles from the components*/

html {
  overflow: hidden;
}

body {
    font-size:21px;
    color: rgb(51, 51, 51);
    overflow-x: hidden;
}

html, body{
   margin: 0px; padding: 0px;
}

/*Hide iPad default play button on videos*/
*::-webkit-media-controls-start-playback-button {
 display: none !important;
 -webkit-appearance: none;
}

.full_stretch{
  width:100%;
}

.main_column{
  width:75%;
  margin: 0 auto;
  min-width:600px;
}

.deleted{
  background:transparent !important;
  cursor: text !important;
}

@media screen and (max-width: 1920px) {
    .main_column{
      width: 61.25%;
      min-width:0px;
    }
}

@media screen and (max-width: 1600px) {
    .main_column{
      width: 70%;
      min-width:0px;
    }
}

@media screen and (max-width: 1225px) {
    .main_column{
      width: 80%;
      min-width:0px;
    }
}

@media screen and (max-width: 768px) {
  .main_column{
    width: 87.5%;
    min-width:0px;
  }
}

@media screen and (min-width: 1921px) {
    .main_column{
      width: 61.25%;
      min-width:0px;
      max-width: 1400px;
    }
}

.media_heading{
  font-size:16px;
  font-style: italic;
  text-align:center;
}

.media_title{
  font-size:20px;
  font-weight: 600;
  margin-top:-8px;
  text-align:center;
}

.transparent{
  opacity: 0 !important;
}

.small_top_spacing{
  margin-top:0px;
}

.medium_top_spacing{
  margin-top:20px;
}

.large_top_spacing{
  margin-top:40px;
}

.small_bottom_spacing{
  margin-bottom:0px;
}

.medium_bottom_spacing{
  margin-bottom:20px;
}

.large_bottom_spacing{
  margin-bottom:40px;
}

.extra_large_bottom_spacing{
  margin-bottom:60px;
}

.bottom_spacing_tighten{
  margin-bottom: -20px;
}

.drop_shadow{

  -moz-box-shadow:    inset  0  15px 15px -15px rgba(0, 0, 0, 0.5),
                      inset  0  -15px 15px -15px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: inset  0  15px 15px -15px rgba(0, 0, 0, 0.5),
                      inset  0  -15px 15px -15px rgba(0, 0, 0, 0.5);
  box-shadow:         inset  0  15px 15px -15px rgba(0, 0, 0, 0.5),
                      inset  0  -15px 15px -15px rgba(0, 0, 0, 0.5);
}

.invisibleScrollbar::-webkit-scrollbar {
    width:0px;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.gloss-inline{
  font-weight:bold;
  cursor:pointer !important;
}

.gloss-inline *{
  cursor:pointer !important;
}

.gloss-inline {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  bottom: 1px;
}
.gloss-inline:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4px;
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.gloss-inline:hover:before, .gloss-inline:focus:before, .gloss-inline:active:before {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

*{
  -webkit-touch-callout: none;
  /*-webkit-user-select: none;*/
}

ul{
  list-style-type:none;
  margin-top:10px;
  overflow:hidden; /* prevent bullets overlapping float quotes */
}

.tableBullet1, .bullet1{
  margin-left:16px;
  background-image: url(../images/bullet1.gif);
}

.tableBullet2, .bullet2{
  margin-left:32px;
  background-image: url(../images/bullet2.gif);
}

.tableBullet3, .bullet3{
  margin-left:48px;
  background-image: url(../images/bullet3.gif);
}

.tableBullet4, .bullet4{
  margin-left:64px;
  background-image: url(../images/bullet4.gif);
}

table ul{
  padding-left: 0px;
  margin-top: 0px;
}

ul > li {
  background-image: url(../images/bullet1.gif);
  background-repeat: no-repeat;
  background-position: 0px 12px;
  padding-left: 16px;
}

.tableBullet1, .tableBullet2, .tableBullet3, .tableBullet4, .bullet1, .bullet2, .bullet3, .bullet4 {
	background-position: 0px 9px !important;
  background-repeat: no-repeat;
  padding-left: 16px;
}

div#recenter_container.overlay_shadow:after {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10000;
    background-color: rgba(0,0,0,0.8);

    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

.overlay_shadow{
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.ui-loader{
  display:none;
}

.choice_block_direction img{
  max-width: 100%;
}

.IE_version_9 my-chart, .IE_version_10 my-chart{
  display: none !important;
}

/* use this class to temporarily disable styles on an element */
.notransition {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;

  -webkit-animation-duration: 0s !important;
  animation-duration: 0s !important;
}

@keyframes fillAnimation{
  from {
    background-position-x: 200%;
  }
  to {
    background-position-x: 100%;
  }
}

.highlight_box .note_text_theme{
  background-color: transparent;
  outline: none;
}

.no_anim{
  animation-duration: 0s !important;
}

/* MARKUP */
.highlight_text_theme{
  padding: 5px 0px;
  cursor: pointer;
  animation-name: fillAnimation;
  animation-duration: 1s;
  background-repeat: no-repeat !important;
  background-size: 200% 200% !important;
}

.note_text_theme{
  padding: 5px 0px;
  cursor: pointer;
  animation-name: fillAnimation;
  animation-duration: 1s;
  background-repeat: no-repeat !important;
  background-size: 200% 200% !important;
}

/* modal styling, we use !important to override the plugin defaults */
.blocker{
  background-color: rgba(0,0,0,0.8) !important;
  z-index:16000 !important;
}

.modal{
  border-radius: 0px !important;
  box-shadow: 0px 0px 5px rgb(0, 0, 0) !important;
  background-color: rgb(255, 255, 255) !important;
  border: 2px solid #E0E0E0;
  white-space: pre-line;
}

.modal a.close-modal {
  position: absolute !important;
  top: 5px !important;
  right: 5px !important;
  cursor: pointer !important;
  background: url("../images/icons/X.svg") no-repeat 0 0 !important;
}

#modal_delete_note .close-modal{
  display: none !important;
}

/* phone styles */
@media screen and (max-width: 767px)   {
  .tableBullet1{
    margin-left: 8px;
  }

  ul{
    padding-left: 15px;
  }

  *[class*="IE_version_9"] .main_column, *[class*="IE_version_10"] .main_column{
    margin-left: 50px;
  }

  *[class*="IE_version"] .sidebar_button_container{
    display:block !important;
  }

  *[class*="IE_version_9"] #sidebar, *[class*="IE_version_10"] #sidebar{
    pointer-events: all !important;
  }
}

.quiz_answer i {
	font-style:normal;
}

.learning_objective_bullet_text > .bullet_text i{
	font-style:normal;
}

.pullQuoteText i{
	font-style:normal;
	font-size:30px;
	line-height:140%;
	vertical-align:bottom;
}

.flashcard_instructions i {
	font-style:normal;
}

.note_section i{
  font-style:normal;
}

.search_section i{
  font-style:normal;
}

.negative_medium_top_spacing {
	margin-top: -60px;
}


/* TIPPY POPUP STYLING (For Pull Through Guru) */

.popupDropdownAnswerChoices{
  font-weight:normal !important;
}

.popupContainer{
  font-size:14px;
  padding:5px;
  font-weight:bold;
  text-align:left;
}

.popupAnswerChoice{
  font-size:12px;
}

.popupAnswerChoiceBullet{
  position:relative;
  margin-left:5px;
}

/* .popupAnswerChoiceCheckbox{
  height:11px;
} */

.popupAnswerChoiceLabel{
  /*display:inline-block;
  margin-left:7px;
  color:red;*/

  margin-left: 1.4em;
  display: block;
  position: relative;
  margin-top: -1.4em;
  line-height: 1.4em;
}

.popupAnswerChoiceCheckbox{
  vertical-align:  -2px;
}

.popupAnswerChoiceRow{
  margin: 10px 0px;
}

.popupAnswerChoiceMatching{
  margin:0% 2%;
  display:inline-block;
  width:46%;
  vertical-align:middle;
  background-color: #FFF;
  border: 1px solid #243f55;
  padding:5px;
}

.popupAnswerChoiceGroup{
  margin-top:15px;
  text-align:left;
}

.tippy-tooltip.tomato-theme {
  background-color: #d8d8d8;
  color: #233f55;
  box-shadow: 3px 6px 5px #888888;
}

.tippy-tooltip.tomato-theme[data-animatefill] {
  background-color: transparent;
}

.tippy-tooltip.tomato-theme .tippy-backdrop {
  background-color: #d8d8d8;
}

.tippy-tooltip.tomato-theme[x-placement^='top'] .tippy-arrow {
  border-top-color: #d8d8d8;
}
.tippy-tooltip.tomato-theme[x-placement^='bottom'] .tippy-arrow {
  border-bottom-color: #d8d8d8;
}
.tippy-tooltip.tomato-theme[x-placement^='left'] .tippy-arrow {
  border-left-color: #d8d8d8;
}
.tippy-tooltip.tomato-theme[x-placement^='right'] .tippy-arrow {
  border-right-color: #d8d8d8;
}

.popupAnswerChoiceMatching0{
  background-color: #fff !important;
}

.popupAnswerChoiceMatching1{
  background-color: #ddd !important;
}

.popupAnswerChoiceMatching2{
  background-color: #ccc !important;
}

.popupAnswerChoiceMatching3{
  background-color: #aaa !important;
}

.popupAnswerChoiceMatching4{
  background-color: #888 !important;
}

/* Graphic Table Styles */

.graphicTableText {
  background: transparent !important;
  border: none !important;
  vertical-align: middle !important;
}

.graphicTableRow {
  background: transparent !important;
  border: none !important;
  vertical-align: middle !important;
}

.graphicTablePhoto {
  background: transparent !important;
  border: none !important;
  vertical-align: middle !important;
}

.question_text b{
  text-decoration: underline !important;
}
