/* Keypath Gizmo CSS */

/* Default CSS */
.gizmo-container * {
  box-sizing: border-box;
  line-height: inherit;
}

.gizmo-container p {
  margin: 1em 0;
}
.gizmo-container p:first-child {
  margin-top: 0;
}

.gizmo-container p:last-child {
  margin-bottom: 0;
}

.gizmo-container .iframe-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}

.gizmo-container .iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Default Keypath CSS */


 
			/* Tabs Horizontal */
			.giz-tabs-h { margin:40px 0; clear:both; }
			.giz-tabs-h-buttons { margin-top:20px; }
			.giz-tabs-h-button { background:#9c261a; color:#fff; font-size:16px; padding:10px; margin-right:1px; cursor:pointer; transition:all 0.25s ease-in-out 0s; }
			.giz-tabs-h-content { background:#eaeaea; font-size:16px; display:inline-block; width:100%; overflow:hidden; }
			.giz-tabs-h-content-item { padding:20px; display:none;}
			.giz-tabs-h-current { padding:16px; margin-top:-12px; }
			.giz-tabs-h-current, .giz-tabs-h-button:hover { background:#eccf00; color:#fff; }  
			@media only screen and (max-width:768px) {
			.giz-tabs-h-button-wrapper { width:100% !important; }
			.giz-tabs-h-current { margin-top:0; }
			.giz-tabs-h-button { margin-bottom:1px; }
			}
			
			.giz-tabs-h-current.keypath, .giz-tabs-h-button.keypath:hover { color:#9c261a; }
			
			/* Tabs Rounded Horizontal */
			.giz-tabs-rounded-h { margin:40px 0; clear:both; }
			.giz-tabs-rounded-h-buttons { margin-top:20px; }
			.giz-tabs-rounded-h-button { background:#9c261a; color:#fff; font-size:16px; padding:55px 10px; margin-right:1px; width:140px; height:140px; margin:auto; border-radius:50%; text-align:center; cursor:pointer; transition:all 0.25s ease-in-out 0s; }
			.giz-tabs-rounded-h-content { background:#eaeaea; font-size:16px; display:inline-block; width:100%; margin-top:20px; border-radius:10px; overflow:hidden; clear:both; }
			.giz-tabs-rounded-h-content-item { padding:20px; display:none; }
			.giz-tabs-rounded-h-current, .giz-tabs-rounded-h-button:hover { padding:45px 10px; background:#eccf00; }
			@media only screen and (max-width:768px) {
			.giz-tabs-rounded-h-button-wrapper { width:100% !important; }
			.giz-tabs-rounded-h-current { margin-top:0; background:#eccf00; }
			.giz-tabs-rounded-h-button { margin-bottom:1px; }
			.giz-tabs-rounded-h-button:hover { background:#eccf00; }
			}
						
			.giz-tabs-rounded-h-current.keypath, .giz-tabs-rounded-h-button.keypath:hover { color:#9c261a; }
			 
			/* Tabs Acronym Horizontal */
			.giz-tabs-acronym-h { margin:40px 0; clear:both; }
			.giz-tabs-acronym-h-buttons { margin-top:20px; }
			.giz-tabs-acronym-h-button { background:#9c261a; color:#fff; font-size:60px; font-weight:bold; padding:28px 0; margin-right:1px; width:140px; height:140px; margin:auto; border-radius:50%; text-align:center; cursor:pointer; transition:all 0.25s ease-in-out 0s; }
			.giz-tabs-acronym-h-content { background:#eaeaea; font-size:16px; display:inline-block; width:100%; margin-top:20px; border-radius:10px; overflow:hidden; clear:both; }
			.giz-tabs-acronym-h-content-item { padding:20px; display:none; }
			.giz-tabs-acronym-h-current { padding:20px 0; }
			.giz-tabs-acronym-h-current, .giz-tabs-acronym-h-button:hover { background:#eccf00; }
			@media only screen and (max-width:768px) {
			.giz-tabs-acronym-h-button-wrapper { width:100% !important; }
			.giz-tabs-acronym-h-current { margin-top:0; }
			.giz-tabs-acronym-h-button { margin-bottom:1px; }
			}
						
			.giz-tabs-acronym-h-current.keypath, .giz-tabs-acronym-h-button.keypath:hover { color:#9c261a; }
			 
			/* Checkpoint Horizontal */
			.giz-checkpoint-h { margin:40px 0; clear:both; }
			.giz-checkpoint-h-bar { margin:60px 0; background:#eaeaea; height:10px;  }
			.giz-checkpoint-h-wrapper { float:left; }
			.giz-checkpoint-h-button { background:#fff; color:#9c261a; width:120px; overflow:hidden; font-weight:700; margin:-8px auto 0; padding:4px; border-radius:20px; text-align:center; box-shadow: 0 0 0 4px #9c261a; cursor:pointer; }
			.giz-checkpoint-h-button.giz-checkpoint-h-current, .giz-checkpoint-h-button:hover { box-shadow:0 0 0 4px #eccf00; }
			.giz-checkpoint-h-content { background:#9c261a; color:#fff; max-width:800px; margin:auto; padding:20px; text-align:left; border-radius:10px; }
			@media only screen and (max-width:768px) {
			.giz-checkpoint-h-bar { background:none; height:auto; }
			.giz-checkpoint-h-wrapper { width:100% !important; margin:12px 0; }
			}
			.giz-checkpoint-h-current, .giz-checkpoint-h-button:hover { background:#eccf00; color:#fff; box-shadow: 0 0 0 4px #eccf00; }
			
				.giz-checkpoint-h.keypath .giz-checkpoint-h-button.giz-checkpoint-h-current, .giz-checkpoint-h.keypath .giz-checkpoint-h-button:hover { color:#9c261a; }
			 
			/* Tabs Vertical */
			.giz-tabs-v, .giz-tabs-wrapper { margin:40px 0; background:#eaeaea; overflow:auto; clear:both; }
			.giz-tabs-v-buttons { width:30%; float:left; } 
			.giz-tabs-v-content { width:70%; float:left; }
			.giz-tabs-v-button { background:#9c261a; color:#fff; font-size:16px; line-height:24px; margin-bottom:1px; padding:15px; cursor:pointer; transition:all 0.25s ease-in-out 0s; }
			.giz-tabs-v-content { font-size:16px; display:inline-block; overflow:hidden; }
			.giz-tabs-v-content-item { padding:20px; display:none; }
			.giz-tabs-v-current { background:#eccf00; }
			.giz-tabs-v-button:hover { background:#eccf00; }
			@media only screen and (max-width:768px) {
			.giz-tabs-v-buttons, .giz-tabs-v-content { width:100%; }
			}
			 
			/* Flipcards */
			.giz-flipcards * { box-sizing:border-box; }
			.giz-flipcards { clear:both; }
			.giz-flipcard { width:100%; display:inline-block; position:relative; margin:20px 0; font-size:16px; transform:perspective(400px); }    
			.giz-flipcard-front { padding:20px; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#9c261a; color:#fff; transform:perspective(400px) rotateX(0deg); backface-visibility:hidden; transition:1.0s; opacity:1; border-radius:6px; }
			.giz-flipcard-front h1,.giz-flipcard-front h2,.giz-flipcard-front h3,.giz-flipcard-front h4,.giz-flipcard-front h5 { color:#fff !important; }
			.giz-flipcard-back { padding:20px; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#e1e1e1; color:#666; transform:perspective(400px) rotateX(-180deg); backface-visibility:hidden; transition:1.0s; opacity:0; border-radius:4px; }
			.giz-flipcard-circles { padding:18%; border-radius:50%; }
			.giz-flipcard-front-effect { opacity:0; transform:perspective(400px) rotateX(180deg); }
			.giz-flipcard-back-effect { opacity:1; transform: perspective(400px) rotateX(0deg); }
			 
			/* Flipcards 2 */

			/* animation */
			@keyframes spin {
				from { transform: rotate(0deg); }
				to { transform: rotate(360deg); }
			}	

			/* Flipcards 2 */
			.giz-flipcard2-circle-outside {
				width:280px;
				height:280px;
				border-radius:50%;
				background: #9c261a; /* Old browsers */
				background: -moz-linear-gradient(left, #9c261a 28%, #eccf00 100%); /* FF3.6-15 */
				background: -webkit-linear-gradient(left, #9c261a 28%,#eccf00 100%); /* Chrome10-25,Safari5.1-6 */
				background: linear-gradient(to right, #9c261a 28%,#eccf00 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
				animation-name: spin; 
				animation-duration: 3s; /* 3 seconds */
				animation-iteration-count: infinite; 
				animation-timing-function: linear;
				position:absolute;
				top:0;
				left:0;
			}

			.giz-flipcard2-circle-inside {
				width:260px;
				height:260px;
				margin:10px;	
				padding:35px 50px;	
				background:#9c261a;		
				border-radius:50%;			
				position:absolute;
				top:0;
				left:0;						
			}

			.giz-flipcard2 * { box-sizing:border-box; }
			.giz-flipcard2 h1, .giz-flipcard2 h2, .giz-flipcard2 h3 { color:#fff !important; font-size:24px !important; }
			.giz-flipcard2-circle { width:260px; height:260px; display:inline-block; position:relative; transform:perspective(400px); margin-right:40px; margin-bottom:40px; text-align:center; }    
			.giz-flipcard2-front { color:#fff; transform:perspective(400px) rotateX(0deg); backface-visibility:hidden; transition:1.0s; opacity:1; }
			.giz-flipcard2-back { transform:perspective(400px) rotateX(-180deg); backface-visibility:hidden; transition:1.0s; opacity:0; background:#ddd; color:#333;  }
			.giz-flipcard2-circles { padding:18%; border-radius:50%; }
			.giz-flipcard2-front-effect { opacity:0; transform:perspective(400px) rotateX(180deg); }
			.giz-flipcard2-back-effect { opacity:1; transform: perspective(400px) rotateX(0deg); }
			
			/* Accordion */
			.giz-accordion { margin:40px 0; clear:both; }
			.giz-accordion-title { background:#9c261a; margin:5px 0; padding:10px 15px; border:none; cursor:pointer; color:#fff; }
			.giz-accordion-title i { float:right; font-size:24px; }
			.giz-accordion-content { padding:20px; border:1px solid #ddd; border-radius:4px; }
			.giz-accordion-current { background:#eccf00; }
			
			.giz-accordion.keypath .giz-accordion-current { color:#9c261a; }
			
			/* Flow Chart Vertical */
			.flow-chart-v { margin:40px 0; clear:both; overflow:hidden; }
			.flow-chart-v-title { padding:20px; margin:1% 1% 0 1%; font-size:20px; text-align:center; background:#9c261a; color:#fff; }
			.flow-chart-v-entry-wrapper { float:left; width:50%; }
			.flow-chart-v-entry { padding:0 10px; }
			.flow-chart-v-arrow { background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/flow_chart_vertical/arrow.png'); width:40px; height:58px; margin:auto; }
			.flow-chart-v-box { background:#eaeaea; padding:20px; text-align:center; }
			.flow-chart-v-content { overflow:hidden; }
			.flow-chart-v-first-btn, .flow-chart-v-btn { margin:20px auto; padding:6px 20px; border-radius:4px; display:inline-block; text-align:center; cursor:pointer; background:#eccf00; color:#fff;}
			.flow-chart-v-readmore, .flow-chart-v-readless { background:#666; color:#fff; padding:2px 6px; font-size:15px; margin-top:6px; cursor:pointer; display:none; }
			.flow-chart-v-full-content { z-index:10; opacity:0.98; width:100%; height:auto; position:fixed; top:0; bottom:0; left:0; right:0; border-radius:0; margin:0; padding:20px;}
			.flow-chart-v-mobile { display:none; }
			.flow-chart-v-mobile-title .flow-chart-v-mobile-content { background:#9c261a; color:#fff; text-align:center; }

			@media only screen and (max-width:768px) {
			.flow-chart-v { display:none; }
			.flow-chart-v-mobile { display:block; }
			.flow-chart-v-mobile { color:#666; }
			.flow-chart-v-mobile-entry { padding-left:20px; position:relative; }
			.flow-chart-v-mobile-content { position:relative; background:#eee; padding:10px; z-index:10; }
			.flow-chart-v-mobile-column .flow-chart-v-mobile-entry:first-child:before { content:''; height:4px; width:20px; background-color:#eee; position:absolute; top:10px; left:0; margin:auto; }
			.flow-chart-v-mobile-column .flow-chart-v-mobile-entry:after { content:''; width:4px; height:108%; background-color:#eee; position:absolute; top:0; bottom:0; left:0; }
			.flow-chart-v-mobile-column .flow-chart-v-mobile-entry:last-child { padding-bottom:80px; }
			.flow-chart-v-mobile .flow-chart-v-mobile-column:last-child .flow-chart-v-mobile-entry:after { width:0; }
			.flow-chart-v-mobile-arrow { background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/flow_chart_vertical/arrow.svg'); width:40px; height:72px; margin:auto; }
			.flow-chart-v-mobile-title { padding-left:0; }
			}
			
			.flow-chart-v.keypath .flow-chart-v-title { background:#9c261a; }
			.flow-chart-v.keypath .flow-chart-v-first-btn, .flow-chart-v.keypath .flow-chart-v-btn { background:#eccf00; color:#9c261a; }
			 
			/* Timeline Vertical */
			.giz-timeline *:before, .giz-timeline *:after { box-sizing:content-box; }
			.giz-timeline { position:relative; width:96%; margin:40px auto; background:url('https://keypathassets.com/gizmo/assets/images/timeline_vertical/timeline.jpg') top center repeat-y; clear:both; }
			.giz-timeline-title { background:#fff; font-size:40px; font-weight:700; padding-bottom:10px; border-bottom:5px solid #f1eae8; text-align:center;  }
			.giz-timeline-inline-block { width:50%; float:left; }
			.giz-timeline-content { position:relative; background:#fff; color:#666; font-weight:300; padding:20px; box-shadow:0 0 30px #ddd; }
			.giz-timeline-content:before { content:""; position:absolute; top:0; width:20px; height:20px; background:#fff; border-radius:50%; border:5px solid #eccf00;   }
			.giz-timeline-entry { margin:20px 0; }
			.giz-timeline-entry ul { padding-left:25px; }
			.giz-timeline-entry:before, .giz-timeline-entry:after { content:" "; display:table; }
			.giz-timeline-entry:after { clear:both; }
			.giz-timeline-entry-left .giz-timeline-year  { float:right; font-size:24px; font-weight:700; margin-right:25px; display:inline-block; min-height: 20px;}
			.giz-timeline-entry-left .giz-timeline-content  { margin-left:25px; }
			.giz-timeline-entry-left .giz-timeline-content:before  { left:-40px; }
			.giz-timeline-entry-right .giz-timeline-year  { float:left; font-size:24px; font-weight:700; margin-left:25px; display:inline-block; min-height: 20px;}
			.giz-timeline-entry-right .giz-timeline-content  { margin-right:25px; }
			.giz-timeline-entry-right .giz-timeline-content:before  { right:-40px; }
			.giz-timeline-btn { background:#eccf00; color:#fff; padding:6px 20px; display:inline-block; cursor:pointer; text-align:center; border:none; }
						
			.keypath .giz-timeline-btn { color:#9c261a; }
			
			.cd-horizontal-timeline {
			  max-width:650px;
			  font-size: 1.6rem;			  
			  color: #383838;
			  background-color: #f8f8f8;
			}

			/* Timeline Horizontal */
			.cd-horizontal-timeline a {
			  color: #9c261a;
			  text-decoration: none;
			}

			.cd-horizontal-timeline ul,
			.cd-horizontal-timeline ol {
				list-style-type:none;
				padding:0;
			}

			/* -------------------------------- 

			Main Components 

			-------------------------------- */
			.cd-horizontal-timeline {
			  opacity: 0;
			  margin: 2em auto;
			  -webkit-transition: opacity 0.2s;
			  -moz-transition: opacity 0.2s;
			  transition: opacity 0.2s;
			}
			.cd-horizontal-timeline::before {
			  /* never visible - this is used in jQuery to check the current MQ */
			  content: 'mobile';
			  display: none;
			}
			.cd-horizontal-timeline.loaded {
			  /* show the timeline after events position has been set (using JavaScript) */
			  opacity: 1;
			}
			.cd-horizontal-timeline .timeline {
			  position: relative;
			  height: 100px;
			  width: 90%;
			  /*max-width: 800px;*/
			  margin: 0 auto;
			}
			.cd-horizontal-timeline .events-wrapper {
			  position: relative;
			  height: 100%;
			  margin: 0 40px;
			  overflow: hidden;
			}
			.cd-horizontal-timeline .events-wrapper::after, .cd-horizontal-timeline .events-wrapper::before {
			  /* these are used to create a shadow effect at the sides of the timeline */
			  content: '';
			  position: absolute;
			  z-index: 2;
			  top: 0;
			  height: 100%;
			  width: 20px;
			}
			.cd-horizontal-timeline .events-wrapper::before {
			  left: 0;
			  background-image: -webkit-linear-gradient( left , #f8f8f8, rgba(248, 248, 248, 0));
			  background-image: linear-gradient(to right, #f8f8f8, rgba(248, 248, 248, 0));
			}
			.cd-horizontal-timeline .events-wrapper::after {
			  right: 0;
			  background-image: -webkit-linear-gradient( right , #f8f8f8, rgba(248, 248, 248, 0));
			  background-image: linear-gradient(to left, #f8f8f8, rgba(248, 248, 248, 0));
			}
			.cd-horizontal-timeline .events {
			  /* this is the grey line/timeline */
			  position: absolute;
			  z-index: 1;
			  left: 0;
			  top: 49px;
			  height: 2px;
			  /* width will be set using JavaScript */
			  background: #dfdfdf;
			  -webkit-transition: -webkit-transform 0.4s;
			  -moz-transition: -moz-transform 0.4s;
			  transition: transform 0.4s;
			}
			.cd-horizontal-timeline .filling-line {
			  /* this is used to create the green line filling the timeline */
			  position: absolute;
			  z-index: 1;
			  left: 0;
			  top: 0;
			  height: 100%;
			  width: 100%;
			  background-color: #9c261a;
			  -webkit-transform: scaleX(0);
			  -moz-transform: scaleX(0);
			  -ms-transform: scaleX(0);
			  -o-transform: scaleX(0);
			  transform: scaleX(0);
			  -webkit-transform-origin: left center;
			  -moz-transform-origin: left center;
			  -ms-transform-origin: left center;
			  -o-transform-origin: left center;
			  transform-origin: left center;
			  -webkit-transition: -webkit-transform 0.3s;
			  -moz-transition: -moz-transform 0.3s;
			  transition: transform 0.3s;
			}
			.cd-horizontal-timeline .events a {
			  position: absolute;
			  bottom: 0;
			  z-index: 2;
			  text-align: center;
			  font-size: 15px;
			  padding-bottom: 15px;
			  color: #383838;
			  /* fix bug on Safari - text flickering while timeline translates */
			  -webkit-transform: translateZ(0);
			  -moz-transform: translateZ(0);
			  -ms-transform: translateZ(0);
			  -o-transform: translateZ(0);
			  transform: translateZ(0);
			}
			.cd-horizontal-timeline .events a::after {
			  /* this is used to create the event spot */
			  content: '';
			  position: absolute;
			  left: 50%;
			  right: auto;
			  -webkit-transform: translateX(-50%);
			  -moz-transform: translateX(-50%);
			  -ms-transform: translateX(-50%);
			  -o-transform: translateX(-50%);
			  transform: translateX(-50%);
			  bottom: -5px;
			  height: 12px;
			  width: 12px;
			  border-radius: 50%;
			  border: 2px solid #dfdfdf;
			  background-color: #f8f8f8;
			  -webkit-transition: background-color 0.3s, border-color 0.3s;
			  -moz-transition: background-color 0.3s, border-color 0.3s;
			  transition: background-color 0.3s, border-color 0.3s;
			}
			.no-touch .cd-horizontal-timeline .events a:hover::after {
			  background-color: #9c261a;
			  border-color: #9c261a;
			}
			.cd-horizontal-timeline .events a.selected {
			  pointer-events: none;
			}
			.cd-horizontal-timeline .events a.selected::after {
			  background-color: #eccf00;
			  border-color: #eccf00;
			}
			.cd-horizontal-timeline .events a.older-event::after {
			  border-color: #9c261a;
			}
			@media only screen and (min-width: 1100px) {
			  .cd-horizontal-timeline {
			    margin: 6em auto;
			  }
			  .cd-horizontal-timeline::before {
			    /* never visible - this is used in jQuery to check the current MQ */
			    content: 'desktop';
			  }
			}

			.cd-timeline-navigation a {
			  /* these are the left/right arrows to navigate the timeline */
			  position: absolute;
			  z-index: 1;
			  top: 50%;
			  bottom: auto;
			  -webkit-transform: translateY(-50%);
			  -moz-transform: translateY(-50%);
			  -ms-transform: translateY(-50%);
			  -o-transform: translateY(-50%);
			  transform: translateY(-50%);
			  height: 34px;
			  width: 34px;
			  border-radius: 50%;
			  border: 2px solid #dfdfdf;
			  /* replace text with an icon */
			  overflow: hidden;
			  color: transparent;
			  text-indent: 100%;
			  white-space: nowrap;
			  -webkit-transition: border-color 0.3s;
			  -moz-transition: border-color 0.3s;
			  transition: border-color 0.3s;
			}
			.cd-timeline-navigation a::after {
			  /* arrow icon */
			  content: '';
			  position: absolute;
			  height: 16px;
			  width: 16px;
			  left: 50%;
			  top: 50%;
			  bottom: auto;
			  right: auto;
			  -webkit-transform: translateX(-50%) translateY(-50%);
			  -moz-transform: translateX(-50%) translateY(-50%);
			  -ms-transform: translateX(-50%) translateY(-50%);
			  -o-transform: translateX(-50%) translateY(-50%);
			  transform: translateX(-50%) translateY(-50%);
			  background: url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/timeline_horizontal/cd-arrow.svg') no-repeat 0 0;
			}
			.cd-timeline-navigation a.prev {
			  left: 0;
			  -webkit-transform: translateY(-50%) rotate(180deg);
			  -moz-transform: translateY(-50%) rotate(180deg);
			  -ms-transform: translateY(-50%) rotate(180deg);
			  -o-transform: translateY(-50%) rotate(180deg);
			  transform: translateY(-50%) rotate(180deg);
			}
			.cd-timeline-navigation a.next {
			  right: 0;
			}
			.no-touch .cd-timeline-navigation a:hover {
			  border-color: #9c261a;
			}
			.cd-timeline-navigation a.inactive {
			  cursor: not-allowed;
			  display: none;
			}
			.cd-timeline-navigation a.inactive::after {
			  background-position: 0 -16px;
			}
			.no-touch .cd-timeline-navigation a.inactive:hover {
			  border-color: #dfdfdf;
			}

			.cd-horizontal-timeline .events-content {
			  position: relative;
			  width: 100%;			  
			  overflow: hidden;
			  -webkit-transition: height 0.4s;
			  -moz-transition: height 0.4s;
			  transition: height 0.4s;
			}
			.cd-horizontal-timeline li {
				list-style-type:none !important;
			 }
			.cd-horizontal-timeline .events-content li {
			  position: absolute;
			  z-index: 1;
			  width: 100%;
			  left: 0;
			  top: 0;			  
			  -webkit-transform: translateX(-100%);
			  -moz-transform: translateX(-100%);
			  -ms-transform: translateX(-100%);
			  -o-transform: translateX(-100%);
			  transform: translateX(-100%);
			  padding: 0 5%;
			  opacity: 0;
			  -webkit-animation-duration: 0.4s;
			  -moz-animation-duration: 0.4s;
			  animation-duration: 0.4s;
			  -webkit-animation-timing-function: ease-in-out;
			  -moz-animation-timing-function: ease-in-out;
			  animation-timing-function: ease-in-out;
			}
			.cd-horizontal-timeline .events-content li.selected {
			  /* visible event content */
			  position: relative;
			  z-index: 2;
			  opacity: 1;
			  -webkit-transform: translateX(0);
			  -moz-transform: translateX(0);
			  -ms-transform: translateX(0);
			  -o-transform: translateX(0);
			  transform: translateX(0);
			}
			.cd-horizontal-timeline .events-content li.enter-right, .cd-horizontal-timeline .events-content li.leave-right {
			  -webkit-animation-name: cd-enter-right;
			  -moz-animation-name: cd-enter-right;
			  animation-name: cd-enter-right;
			}
			.cd-horizontal-timeline .events-content li.enter-left, .cd-horizontal-timeline .events-content li.leave-left {
			  -webkit-animation-name: cd-enter-left;
			  -moz-animation-name: cd-enter-left;
			  animation-name: cd-enter-left;
			}
			.cd-horizontal-timeline .events-content li.leave-right, .cd-horizontal-timeline .events-content li.leave-left {
			  -webkit-animation-direction: reverse;
			  -moz-animation-direction: reverse;
			  animation-direction: reverse;
			}
			.cd-horizontal-timeline .events-content li > * {
			  /*max-width: 800px;*/
			  margin: 0 auto;
			}
			.cd-horizontal-timeline .events-content .event-title {
				color:#9c261a;
			  font-weight: bold;
			  font-size: 30px;			  
			  font-weight: 700;
			  line-height: 1.2;
			}
			.cd-horizontal-timeline .events-content em {
			  display:inline-block;
			  font-style:italic;
			  margin:15px auto 30px;
			  background:#ddd;
			  background:#eccf00;
			  color:#fff;
			  padding:5px 15px;
			  border-radius:25px;
			  font-size:17px;
			}			
			.cd-horizontal-timeline .events-content p {
			  font-size:16px;
			  color: #959595;
			}
			.cd-horizontal-timeline .events-content em, .cd-horizontal-timeline .events-content p {
			  line-height: 1.6;
			}
			

			@-webkit-keyframes cd-enter-right {
			  0% {
			    opacity: 0;
			    -webkit-transform: translateX(100%);
			  }
			  100% {
			    opacity: 1;
			    -webkit-transform: translateX(0%);
			  }
			}
			@-moz-keyframes cd-enter-right {
			  0% {
			    opacity: 0;
			    -moz-transform: translateX(100%);
			  }
			  100% {
			    opacity: 1;
			    -moz-transform: translateX(0%);
			  }
			}
			@keyframes cd-enter-right {
			  0% {
			    opacity: 0;
			    -webkit-transform: translateX(100%);
			    -moz-transform: translateX(100%);
			    -ms-transform: translateX(100%);
			    -o-transform: translateX(100%);
			    transform: translateX(100%);
			  }
			  100% {
			    opacity: 1;
			    -webkit-transform: translateX(0%);
			    -moz-transform: translateX(0%);
			    -ms-transform: translateX(0%);
			    -o-transform: translateX(0%);
			    transform: translateX(0%);
			  }
			}
			@-webkit-keyframes cd-enter-left {
			  0% {
			    opacity: 0;
			    -webkit-transform: translateX(-100%);
			  }
			  100% {
			    opacity: 1;
			    -webkit-transform: translateX(0%);
			  }
			}
			@-moz-keyframes cd-enter-left {
			  0% {
			    opacity: 0;
			    -moz-transform: translateX(-100%);
			  }
			  100% {
			    opacity: 1;
			    -moz-transform: translateX(0%);
			  }
			}
			@keyframes cd-enter-left {
			  0% {
			    opacity: 0;
			    -webkit-transform: translateX(-100%);
			    -moz-transform: translateX(-100%);
			    -ms-transform: translateX(-100%);
			    -o-transform: translateX(-100%);
			    transform: translateX(-100%);
			  }
			  100% {
			    opacity: 1;
			    -webkit-transform: translateX(0%);
			    -moz-transform: translateX(0%);
			    -ms-transform: translateX(0%);
			    -o-transform: translateX(0%);
			    transform: translateX(0%);
			  }
			}
			
      /* Overlapping Circles 3 */

      .gizmo-container.giz-circles-wrapper {
        background: white;
        width: 100%;
        margin: 0 auto;
      }

      .gizmo-container .giz-circles-container {
        position: relative;
        height: 40vw;
        width: 50vw;
        margin: 0 auto;
      }

      .gizmo-container .giz-circle-container {
        width: calc(100vw / 4.25);
        height: calc(100vw / 4.25);
        display: inline-block;
        position: absolute;
        line-height: 1.25;
        cursor: pointer;
        border-radius: 50%;
      }

      .gizmo-container .giz-circle-container .giz-circle {
        background: #9c261a;
        opacity: 0.95;
        border-radius: 50%;
        width: 100%;
        height: 100%;
        -webkit-transition: all 200ms ease-in;
        transition: all 200ms ease-in;
      }

      .gizmo-container .giz-circle-container .giz-circle.active {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
        background: #eccf00;
        -webkit-transition: all 200ms ease-in;
        transition: all 200ms ease-in;
      }

      .gizmo-container .giz-circle-container .giz-circle-label {
        text-align: center;
        position: relative;
        top: 50%;
        color: white;
        font-size: 1.3vw;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        opacity: 1;
        width: 90%;
        margin: auto;
        height: auto;
        text-shadow: 0 0 2px rgba(0, 0, 0, 0.45);
        text-overflow: ellipsis;
        white-space: pre-line;
        overflow: hidden;
      }

      .gizmo-container #circle1 {
        top: 0;
        left: 7.5%;
        z-index: 12;
      }

      .gizmo-container #circle1 >.giz-circle {
        -webkit-box-shadow: inset 8px 8px 4em -0.4em rgba(0, 0, 0, 0.2);
        box-shadow: inset 8px 8px 4em -0.4em rgba(0, 0, 0, 0.2);
      }

      .gizmo-container #circle2 {
        top: 0;
        right: 7.5%;
        z-index: 12;
      }

      .gizmo-container #circle2 >.giz-circle {
        -webkit-box-shadow: inset -8px 8px 4em -0.4em rgba(0, 0, 0, 0.2);
        box-shadow: inset -8px 8px 4em -0.4em rgba(0, 0, 0, 0.2);
      }

      .gizmo-container #circle3 {
        bottom: 0;
        right: 50%;
        z-index: 12;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
      }

      .gizmo-container #circle3 >.giz-circle {
        -webkit-box-shadow: inset 0 -12px 4em -0.4em rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 -12px 4em -0.4em rgba(0, 0, 0, 0.2);
      }

      .gizmo-container #middle-circle {
        width: calc(100vw / 7.65);
        height: calc(100vw / 7.65);
        z-index: 50;
        right: 50%;
        bottom: 52.5%;
        -webkit-transform: translateX(50%);
        transform: translate(50%, 50%);
        opacity: 0.99;
        padding: 0;
      }

      .gizmo-container #middle-circle .giz-circle {
        background: rgba(255, 255, 255, 0.95);
        border: 6px solid #eccf00;
        -webkit-box-shadow: inset 0 0 2em 0 rgba(0, 0, 0, 0.35);
        box-shadow: inset 0 0 2em 0 rgba(0, 0, 0, 0.35);
      }

      .gizmo-container #middle-circle .giz-circle.active {
        background: rgba(255, 255, 255, 0.99);
        opacity: 1;
      }

      .gizmo-container #middle-circle .giz-circle-label {
        color: #eccf00;
        text-shadow: 0 0 1px #EAEAEA;
        font-size: 1.12vw;
        font-weight: bold;
        line-height: 1;
        padding: 0.65vw;
      }

      .gizmo-container .giz-circle-container#circle3 .giz-circle-label {
        padding: 5vw 1vw 1vw 1vw;
      }
      .gizmo-container .giz-circle-container#circle2 .giz-circle-label {
        padding: 0 .65vw 2.25vw 5vw;
      }
      .gizmo-container .giz-circle-container#circle1 .giz-circle-label {
        padding: 0 5vw 2.25vw .65vw;
      }

      .gizmo-container .giz-circles-content-container {
        color: white;
        font: normal 1.2em/1.6;
        margin-top: 2em;
        width: 100%;
        -webkit-transition: all 200ms ease-in;
        transition: all 200ms ease-in;
      }

      .gizmo-container .giz-circles-content-container .giz-circles-content {
        background: #eccf00;
        border-radius: 0.4em;
        padding: 0.5em 1.5em;
        opacity: 0.9;
        margin: 0.5em 0;
        -webkit-transition: all 200ms ease-in;
        transition: all 200ms ease-in;
      }

      .gizmo-container .giz-circles-content-container #middle-circle-content {
        background: rgba(255, 255, 255, 0.95);
        color: #eccf00;
        border: 2px solid #eccf00;
      }

      @media only screen and (max-width: 992px) {
        .gizmo-container #middle-circle {
        width: calc(100vw / 5.6);
        height: calc(100vw / 5.6);
        }
        .gizmo-container #circle1 {
          left: 4.5%;
        }
        .gizmo-container #circle2 {
          right: 4.5%;
        }
        .gizmo-container #middle-circle .giz-circle {
          border-width: 3px;
        }
        .gizmo-container #middle-circle .giz-circle-label {
          font-size: 1.5vw;
          width: 100%;
          height: auto;
          border-radius: 0;
          background: initial;
          padding: 1vw;
        }
        .gizmo-container .giz-circle-container {
        width: calc(100vw / 3.35);
        height: calc(100vw / 3.35);
        }
        .gizmo-container .giz-circle-container .giz-circle-label {
          font-size: 1.62vw;
          margin: auto;
        }
        /* .gizmo-container .giz-circle-container#circle3 .giz-circle-label {
          padding: 4.75vw 1vw 1vw 1vw;
        }
        .gizmo-container .giz-circle-container#circle2 .giz-circle-label {
          padding: 0 .75vw 2.5vw 4.75vw;
        }
        .gizmo-container .giz-circle-container#circle1 .giz-circle-label {
          padding: 0 4.75vw 2.5vw .75vw;
        } */
        .gizmo-container .giz-circles-container {
          position: relative;
          height: 52.5vw;
          width: 61vw;
        }
      }

      @media only screen and (max-width: 768px) {
        .gizmo-container #middle-circle {
          width: calc(100vw / 4.25);
          height: calc(100vw / 4.25);
        }
        .gizmo-container #middle-circle .giz-circle-label {
          font-size: 1.8vw;
          padding: 0.25vw;
        }
        .gizmo-container .giz-circle-container {
          width: calc(100vw / 2.5);
          height: calc(100vw / 2.5);
        }
        .gizmo-container #circle1 {
          left: 0;
        }
        .gizmo-container #circle2 {
          right: 0;
        }
        .gizmo-container #middle-circle .giz-circle-label {
          padding: 1vw 1.82vw;
        }
        .gizmo-container .giz-circle-container .giz-circle-label {
          font-size: 2vw;
        }
        .gizmo-container .giz-circles-container {
          position: relative;
          height: 69vw;
          width: 75vw;
        }
      }

      
    
			/* Reveal Answer */			
			.giz-reveal-answer button { background:#eccf00; margin:20px 0; color:#fff; border:none; padding:10px 20px; font-weight:bold; }
			.giz-revealed-answer { background:#9c261a; color:#fff; border:3px solid #9c261a; padding:20px; margin-bottom:40px; display:none; }
			.giz-reveal-answer-content textarea { display:block; padding:15px; width:100%; margin-top:20px; margin-bottom:0; border:3px solid #9c261a; }
			.giz-reveal-answer-content textarea:focus { outline:none; border:3px solid #eccf00; }
			 
			/* Reveal the next */
			.giz-reveal-the-next { margin:40px 0; clear:both; }
			.giz-the-next { position:relative; background:#eaeaea; color:#666; padding:30px; font-weight:300; margin:10px 0; border-radius:10px; text-align:left; }
			.giz-reveal-the-next-first-btn { margin:auto; padding:6px 20px; border-radius:6px; display:inline-block; cursor:pointer; text-align:center; }
			.giz-reveal-the-next-btn { position:absolute; right:10px; bottom:-15px; margin:auto; padding:6px 20px; border-radius:6px; display:block; text-align:center; cursor:pointer; }
			.giz-reveal-the-next .giz-reveal-the-next-title { color:#9c261a; font-size:24px; margin-bottom:20px; font-weight:700; text-align:center; }
			.giz-reveal-the-next .giz-reveal-the-next-first-btn, .giz-reveal-the-next .giz-reveal-the-next-btn { background:#eccf00; color:#fff; }
			
			/* Sequence Reveal */
			.giz-sequence-reveal { margin:40px 0; clear:both; }
			.giz-sequence-reveal-entry { background:#9c261a; overflow:hidden; margin-bottom:1px; cursor:pointer; transition:all 0.25s ease-in-out 0s; }
			.giz-sequence-reveal-entry:hover { background:#eccf00; transition:all 0.25s ease-in-out 0s; }
			.giz-sequence-reveal-entry:hover .giz-sequence-reveal-title { background:#eccf00; transition:all 0.25s ease-in-out 0s; }
			.giz-sequence-reveal-title { width:30%; float:left; padding:15px; background:#9c261a; color:#fff; transition:all 0.25s ease-in-out 0s; }
			.giz-sequence-reveal-content { width:70%; float:left; padding:15px; background:#eee; overflow:hidden; }
			.giz-sequence-reveal-content span { background:#9c261a; opacity:0.7; color:#fff; position:relative; left:-1500px; display:block; margin:-15px; padding:15px; transition:all 0.25s ease-in-out 0s; }
			.giz-sequence-reveal-content span.show-content { left:0; }
			.giz-sequence-reveal-content.mobile { height:auto; padding:15px; }
			@media only screen and (max-width:768px) {
			.giz-sequence-reveal-title, .giz-sequence-reveal-content { width:100%; }
			.giz-sequence-reveal-content { height:0; padding:0; }
			}
			
			/* keypath */
			.keypath .giz-sequence-reveal-entry:hover { color:#9c261a; }
			.keypath .giz-sequence-reveal-entry:hover .giz-sequence-reveal-title { color:#9c261a; }
			 
			/* Quiz Basic */
			.giz-quiz .giz-quiz-item { margin:40px 0; }
			.giz-quiz .giz-quiz-q { font-size:20px; }
			.giz-quiz p { display:inline-block; }
			.giz-quiz ol { list-style-position:inside; list-style-type:lower-alpha; padding:0; }
			.giz-quiz ol li { position:relative; background:#f1f1f1; padding:10px; border-radius:4px; margin:5px 0; cursor:pointer; }
			.giz-quiz .giz-quiz-correct { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/correct.png'); width:30px; height:30px; background-size:30px; }
			.giz-quiz .giz-quiz-incorrect {  position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/incorrect.png'); width:30px; height:30px; background-size:30px; }
			.giz-quiz  .giz-quiz-correct-feedback, .giz-quiz  .giz-quiz-incorrect-feedback { background:#f1f0df; padding:20px; border-radius:4px; }
			.giz-quiz ol li:hover { background:#9c261a; color:#fff; }			
			
			/* Matching Game 1 */
			.giz-matching-game-1 { padding:10px; }
			.giz-matching-game-1-item:before, .giz-matching-game-1-item:after { content:" "; display:table }
		    .giz-matching-game-1-item:after { clear:both }
		    .giz-matching-game-1-dragzone-wrapper { float:left; width:25%; padding:5px; }
		    .giz-matching-game-1-dropzone-wrapper { position:relative; float:left; width:25%; padding:5px; }
		    .giz-matching-game-1-info-wrapper { float:left; width:50%; padding:5px; }        
		    .giz-matching-game-1-dragzone { background:#9c261a; padding:15px; color:#fff; border:2px solid #fff; cursor:move; } 
		    .giz-matching-game-1-dropzone { background:#eee; color:#999; padding:15px; border:2px dashed #b5b5b5; text-align:center; }
		    .giz-matching-game-1-dropzone.hoverclass { box-shadow:0 0 15px #aaa inset; border:2px dashed #9c261a; }			
		    .giz-matching-game-1-info { background:#e6e2d4; padding:15px; }
		    .giz-matching-game-1-info-mobile { background:#eeeeee; padding:15px; margin-bottom:30px; }
		    .giz-matching-game-1-table label { background:#e6e2d4; display:block; width:100%; padding:10px;  }
		    .giz-matching-game-1-submit, .giz-matching-game-1-retry { background:#eccf00; color:#fff; padding:10px 20px; margin:7px; font-size:16px; display:inline-block; border:none; cursor:pointer; }
		    .giz-matching-game-1 .giz-dropped { background:#666; color:#fff; border:none; }
		    .giz-matching-game-1 .giz-correct-input, .giz-matching-game-1-mobile .giz-correct-input { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/correct.png'); width:30px; height:30px; background-size:30px; }
		    .giz-matching-game-1 .giz-incorrect-input, .giz-matching-game-1-mobile .giz-incorrect-input { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/incorrect.png'); width:30px; height:30px; background-size:30px; }
		    .giz-matching-game-1-retry { display:none; }
		    .giz-matching-game-1-score { font-size:28px; font-weight:700; margin:7px; }
		    .giz-matching-game-1-mobile { display:none; }
			.giz-matching-game-1-mobile-table { display:none; }

		    .giz-matching-game-1-mobile-table { padding:4px; margin:20px 0; }
		    .giz-matching-game-1-mobile-table table { width:100%; }
		    .giz-matching-game-1-mobile-table td { padding:5px 15px; }
		    .giz-matching-game-1-mobile-label { background:#e6e2d4; color:#000; }
		    .giz-matching-game-1-mobile-description { background:#eee; color:#666; }

		    @media only screen and (max-width:768px) {
			.giz-matching-game-1-mobile { display:block !important; }
			.giz-matching-game-1-mobile .giz-dropped { background:#666; color:#fff; border:none; }
			.giz-matching-game-1-mobile-table { display:block !important; }
			.giz-matching-game-1 { display:none; }
			.giz-matching-game-1-item { margin:10px auto; }
			.giz-matching-game-1-dragzone-wrapper { width:50%; padding:2px; }
		    .giz-matching-game-1-dropzone-wrapper { width:30%; padding:2px; }
		    .giz-matching-game-1-info-wrapper { width:20%; padding:2px; }   
		    .giz-matching-game-1-dragzone { padding:8px; font-size:14px; }
		    .giz-matching-game-1-dropzone { padding:8px; font-size:14px; }
		    .giz-matching-game-1-info { padding:8px; }	
			}
			
			/* Matching Game 2 */
			.giz-matching-game-2 { padding:10px; clear:both; }
			.giz-matching-game-2-item:before, .giz-matching-game-2-item:after { content:" "; display:table }
		    .giz-matching-game-2-item:after { clear:both }
		    .giz-matching-game-2-dragzone-wrapper { float:left; width:50%; padding:5px; }
		    .giz-matching-game-2-dropzone-wrapper { float:left; width:50%; padding:5px; }
		    .giz-matching-game-2-dragzone { background:#9c261a; padding:15px; color:#fff; border:2px solid #fff; cursor:move; } 
		    .giz-matching-game-2-dropzone { position:relative; background:#eee; color:#999; padding:15px; border:2px dashed #b5b5b5; text-align:center; }
		    .giz-matching-game-2-dropzone.hoverclass { box-shadow:0 0 15px #aaa inset; border:2px dashed #9c261a; }
		    .giz-matching-game-2-retry, .giz-matching-game-2-submit { background:#eccf00; color:#fff; padding:10px 20px; margin:7px; font-size:16px; display:inline-block; border:none; cursor:pointer; }
			.giz-matching-game-2-retry { display:none; }
			.giz-matching-game-2-score { font-size:28px; font-weight:700; margin:7px; }
			.giz-matching-game-2 .giz-correct-input { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/correct.png'); width:30px; height:30px; background-size:30px; }
			.giz-matching-game-2 .giz-incorrect-input { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/incorrect.png'); width:30px; height:30px; background-size:30px; }
			
				/* Fill Blanks */
				.giz-fill-blanks { margin:40px 0; clear:both; }
				.giz-fill-blanks .giz-fill-blanks-question { background:#eaeaea; padding:20px; border-radius:10px; margin-bottom:20px; }
				.giz-fill-blanks .giz-fill-blanks-group { margin:20px 0; }
				.giz-fill-blanks .giz-blank-input { padding:10px; border:3px solid #ddd; }
				.giz-fill-blanks .giz-correct-input { background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/fill_blanks/correct.png') no-repeat 98% center; }
				.giz-fill-blanks .giz-incorrect-input { background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/fill_blanks/incorrect.png') no-repeat 98% center; }
				.giz-fill-blanks .giz-blank-input:focus { outline:none; border:3px solid #9c261a; }
				.giz-fill-blanks .giz-fill-blanks-submit { background:#eccf00; margin:0; color:#fff; border:none; padding:10px 20px; font-weight:bold; text-shadow:none; }			
				.giz-fill-blanks .giz-fill-blanks-correct-feedback, .giz-fill-blanks-incorrect-feedback, .giz-fill-blanks-retry-msg { display:none; margin-top:5px; background:#9c261a; color:#fff; padding:8px; }
			
			/* keypath */
			.keypath .giz-fill-blanks-submit { color:#9c261a; }
			
				/* Sortable Quiz */
				.giz-sortable-item { position:relative; background:#999; color:#fff; border:2px solid #fff; padding:10px; margin:5px; cursor:move; min-height:46px;}
				.giz-sortable-line-number { position:relative; border:2px solid #fff; padding:10px; margin:5px; min-height:46px; background:#9c261a; color:#fff; text-align:center; }
				.giz-sortable-correct-feedback, .giz-sortable-incorrect-feedback { display:none; margin-top:20px; margin-bottom:40px; padding:20px; box-shadow:0 20px 30px #ddd; }
				.giz-sortable-correct-feedback { border:3px solid #089c44; }
				.giz-sortable-incorrect-feedback { border:3px solid #bf0000; }
				.giz-sortable-feedback-title { font-size:28px; font-weight:bold; }
				.giz-sortable-button { background:#eccf00; color:#fff; padding:10px 20px; margin:7px; font-size:16px; display:inline-block; border:none; cursor:pointer; }
				.giz-sortable-icon-incorrect { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/incorrect.png'); width:30px; height:30px; background-size:30px; }
				.giz-sortable-icon-correct { position:absolute; top:-5px; right:-10px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/correct.png'); width:30px; height:30px; background-size:30px; }
				.submission-check { display:none; color:#ca0d0d; margin:7px;}
				.giz-sortable-rank {margin-left:50px;}
				.giz-sortable-left {float: left; width:55px;}
				#giz-sortable-frame:before, #giz-sortable-frame:after { content:" "; display:table; }
				#giz-sortable-frame:after { clear:both; }
			
			/* Diagram of 2 */
			.giz-diagram-of-2-title { padding:20px; margin:1% 1% 0 1%; font-size:20px; text-align:center; background:#9c261a }
			.giz-diagram-of-2-entry { float:left; width:48%; margin:0 1%; }
			.giz-diagram-of-2-box { background:#eaeaea; padding:20px; }
			.giz-diagram-of-2-first-btn, .giz-diagram-of-2-btn { margin:20px auto; padding:6px 20px; border-radius:6px; display:inline-block; text-align:center; cursor:pointer; background:#eccf00; color:#fff;}
			
			/* Matching Game Group */
			* { box-sizing:border-box; }

			.giz-macthing-game-group-col { float:left; width:50%; padding:10px; }
			.giz-matching-game-group-dragzone { background:#9c261a; padding:15px; color:#fff; border:2px solid #fff; display:inline-block; cursor:move; }
			.giz-matching-game-group-dropzone { position:relative; background:#eee; color:#999; border:2px dashed #b5b5b5; width:100%; min-height:150px; padding:15px; }
			.giz-matching-game-group-dropzone.hoverclass { box-shadow:0 0 15px #aaa inset; border:2px dashed #9c261a; }
			.giz-matching-game-group .giz-dropped { border:2px solid #9c261a; color:#9c261a; display:inline-block; padding:10px; margin:2px 10px 2px 2px; position:relative; }
			.giz-matching-game-group .giz-dragged { opacity:0.3; cursor:default; user-select:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; }
			.giz-matching-game-group-submit, .giz-matching-game-group-retry, .giz-matching-game-group-answer-btn { clear:both; float:left; background:#eccf00; color:#fff; padding:10px 20px; margin:10px; font-size:16px; display:inline-block; border:none; cursor:pointer; }
			.giz-matching-game-group-retry, .giz-matching-game-group-answer-content { display:none; }
			.giz-matching-game-group-answer-btn { margin:10px 0; }
			.giz-matching-game-group-submit:hover, .giz-matching-game-group-retry:hover, .giz-matching-game-group-answer-btn:hover { opacity:0.8; color:#fff; }
			.giz-matching-game-group-answer-content { display:none; }
			.giz-submission-check { clear:both; float:left; display:none; color:#ca0d0d; margin:7px;}
			.giz-dropped .giz-correct-input { position:absolute; top:-15px; right:-15px; background:url('https://s3.amazonaws.com/keypath-coursedev/gizmo/assets/images/matching_game_2/correct.png'); width:30px; height:30px; background-size:30px; }
			.giz-matching-game-group-description { background:#f1f0df; font-size:17px; margin-bottom:20px; padding:20px; }
			.giz-matching-game-group-correct-feedback, .giz-matching-game-group-incorrect-feedback { clear:both; margin:10px; border:5px solid #b5b5b5; padding:15px; background:#eeeeee; display:none; }
			.giz-matching-game-group-incorrect-feedback { float:left; width:100%; clear:both; margin:10px; border:5px solid #bf0000; padding:15px; background:#eeeeee; }
			.giz-matching-game-group-correct-feedback { float:left; width:100%; clear:both; margin:10px; border:5px solid #089c44; padding:15px; background:#eeeeee; }
			.giz-matching-game-group h3 { color:#fff; display:inline-block; padding:5px 20px; margin:0; }
			.giz-matching-game-group hr { border:1px solid #ddd; }			
			.giz-matching-game-group-incorrect-feedback h3 { background:#bf0000; }
			.giz-matching-game-group-correct-feedback h3 { background:#089c44; }
			.giz-matching-game-group-answer-content {margin: 8px;}
			.giz-matching-game-category { margin-bottom:10px; }

			.giz-matching-game-group table { border-collapse:collapse; }		   
			.giz-matching-game-group table th { background:#9c261a; color:#fff; padding:10px; border:1px solid #9c261a; }
			.giz-matching-game-group table td { color:#333; padding:10px; border:1px solid #9c261a; }
			.giz-matching-game-group table tr:nth-child(even) { background:#fff; }
			.giz-matching-game-group table tr:nth-child(odd) { background:#e3eef3; }

		    @media only screen and (max-width:768px) {
		    	.giz-macthing-game-group-col { width:100%; }			
			}