instructorjs
Version:
On-screen tutorials for web pages and web applications
1 lines • 6.09 kB
CSS
@font-face{font-family:gemelli;src:url(/fonts/gemelli.ttf) format('truetype');font-weight:400;font-style:normal}.instructor{position:fixed;width:100%;height:100%;top:0;left:0;z-index:1090;pointer-events:none;overflow:hidden}.instructor h1,.instructor h2,.instructor h3,.instructor h4,.instructor h5,.instructor h6{font-family:gemelli,Arial}.instructor_hide{display:none}.instructor_disable_events{position:absolute;width:2000px;height:1500px;z-index:1091;pointer-events:all}.instructor_next_btn{position:absolute;z-index:1092;pointer-events:all;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;width:100px;height:40px;cursor:pointer;margin:0 auto;border:2px solid #76fa76;-webkit-border-radius:40px;border-radius:40px;font:normal normal normal 17px/40px "Open Sans",Helvetica,sans-serif;color:#76fa76;text-align:center;-o-text-overflow:clip;text-overflow:clip;text-transform:capitalize;letter-spacing:1px;background:rgba(0,0,0,0);-webkit-transition:opacity .4s cubic-bezier(.42,0,.58,1),background-color .3s cubic-bezier(0,0,0,0),color .3s cubic-bezier(0,0,0,0),width .3s cubic-bezier(0,0,0,0),border-width .3s cubic-bezier(0,0,0,0),border-color .3s cubic-bezier(0,0,0,0);-moz-transition:opacity .4s cubic-bezier(.42,0,.58,1),background-color .3s cubic-bezier(0,0,0,0),color .3s cubic-bezier(0,0,0,0),width .3s cubic-bezier(0,0,0,0),border-width .3s cubic-bezier(0,0,0,0),border-color .3s cubic-bezier(0,0,0,0);-o-transition:opacity .4s cubic-bezier(.42,0,.58,1),background-color .3s cubic-bezier(0,0,0,0),color .3s cubic-bezier(0,0,0,0),width .3s cubic-bezier(0,0,0,0),border-width .3s cubic-bezier(0,0,0,0),border-color .3s cubic-bezier(0,0,0,0);transition:opacity .4s cubic-bezier(.42,0,.58,1),background-color .3s cubic-bezier(0,0,0,0),color .3s cubic-bezier(0,0,0,0),width .3s cubic-bezier(0,0,0,0),border-width .3s cubic-bezier(0,0,0,0),border-color .3s cubic-bezier(0,0,0,0)}.instructor_next_btn:hover{color:#fff;background:rgba(118,250,118,.3);border:2px solid #55de55}.instructor_next_btn:active{border:2px solid #76fa76;background:#76fa76}.instructor_next_btn[disabled],.instructor_next_btn[disabled]:active,.instructor_next_btn[disabled]:hover{border:2px solid #666;color:#666;cursor:not-allowed;pointer-events:none}.instructor_close_btn{display:inline-block;position:absolute;z-index:1092;pointer-events:all;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;width:.3em;height:.3em;border:none;-webkit-border-radius:1em;border-radius:1em;font:400 8em/normal Arial,Helvetica,sans-serif;color:rgba(0,0,0,1);-o-text-overflow:clip;text-overflow:clip;background:rgba(0,0,0,0);border:2px solid #4fc2f5}.instructor_close_btn::before{display:inline-block;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;width:73%;height:2px;position:absolute;content:"";top:48%;left:14%;border:none;font:normal 100%/normal Arial,Helvetica,sans-serif;color:rgba(0,0,0,1);-o-text-overflow:clip;text-overflow:clip;background:#fff;text-shadow:none;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.instructor_close_btn::after{display:inline-block;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;width:73%;height:2px;position:absolute;content:"";top:46%;left:15%;border:none;font:normal 100%/normal Arial,Helvetica,sans-serif;color:rgba(0,0,0,1);-o-text-overflow:clip;text-overflow:clip;background:#fff;text-shadow:none;-webkit-transform:rotateZ(-45deg);transform:rotateZ(-45deg)}.instructor_close_btn:hover{color:rgba(255,255,255,1);background:#4fc2f5;cursor:pointer}.instructor_close_btn:active{border:2px solid #4fc2f5;background:#4fc2f5;-webkit-transition:none;-moz-transition:none;-o-transition:none;transition:none}.instructor div.canvas-container{position:absolute}.instructor_canvas{position:absolute;z-index:100;width:100%;height:100%;pointer-events:none}#kinetic_container{pointer-events:none;position:absolute;width:100%;height:100%;top:0;left:0}.instructor .instructor_disable_events.blocker{cursor:not-allowed}.instructor .instructor_disable_events.blocker[invalid]{cursor:initial;pointer-events:none;border:solid 2px red}.instructor_svg_wrapper{position:absolute;width:100%;height:100%;top:0;left:0;z-index:100;-webkit-transition:opacity .4s cubic-bezier(.42,0,.58,1);-moz-transition:opacity .4s cubic-bezier(.42,0,.58,1);transition:opacity .4s cubic-bezier(.42,0,.58,1)}.instructor_svg_wrapper svg{position:absolute;width:100%;height:100%;top:0;left:0}.instructor_svg_transparent .instructor_label,.instructor_svg_transparent .instructor_next_btn,.instructor_svg_transparent .instructor_svg_wrapper{opacity:0}.instructor_label{position:absolute;color:#fff;z-index:1092;font-size:24px;font-family:gemelli,Arial;-webkit-transition:opacity .4s cubic-bezier(.42,0,.58,1);-moz-transition:opacity .4s cubic-bezier(.42,0,.58,1);transition:opacity .4s cubic-bezier(.42,0,.58,1)}div.kineticjs-content{position:absolute}.instructor_label{display:inline-block;min-width:200px;text-align:center;max-width:80%;min-width:80%}.instructor_label a{color:#76fa76;text-decoration:underline;cursor:pointer;pointer-events:initial}.instructor_label a:hover{color:#2da12d;text-decoration:underline;pointer-events:initial}.instructor_label a:focus{color:#76fa76;text-decoration:underline;pointer-events:initial}.instructor_label br{margin-top:2em;content:"";display:block}.instructor_btn_offset{top:60px}.instructor_label .instructor_primary,.instructor_label strong{font-weight:initial;color:#4fc2f5}.instructor_label .instructor_danger,.instructor_label del{text-decoration:none;color:#f67777}.instructor_label .instructor_success,.instructor_label em{font-style:initial;color:#76fa76}.instructor_label .instructor_example,.instructor_label ins{text-decoration:none;color:#f7f876}.instructor_label .instructor_calendar_evt{border-radius:4px;background:#3db0d1;width:300px;margin:auto;margin-top:8px;text-align:left}.instructor_label .instructor_calendar_evt>small{padding:8px 12px;display:block;line-height:20px}