/* core css files for application build 9220 */ body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;backface-visibility:hidden;height:100%;left:0;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-webkit-transform:translateZ(0);transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s,visibility 0s linear .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s,visibility 0s;visibility:visible}.fancybox-infobar{color:#ccc;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;text-align:center;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;-webkit-transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;height:100%;margin-right:-.25em;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--next{z-index:99995}.fancybox-slide--image{overflow:visible;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px 6px 0}.fancybox-slide--iframe{padding:44px 44px 0}.fancybox-content{background:#fff;display:inline-block;margin:0 0 6px;max-width:100%;overflow:auto;padding:0;padding:24px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{-webkit-animation-timing-function:cubic-bezier(.5,0,.14,1);animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;margin:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;-webkit-transform-origin:top left;transform-origin:top left;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-drag .fancybox-content{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-content{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--html .fancybox-content{margin-bottom:6px}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;margin:0;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff;height:calc(100% - 44px);margin-bottom:44px}.fancybox-iframe,.fancybox-video{background:transparent;border:0;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{vertical-align:top}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;cursor:pointer;display:inline-block;height:44px;margin:0;outline:none;padding:10px;transition:color .2s;vertical-align:top;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:focus,.fancybox-button:hover{color:#fff}.fancybox-button.disabled,.fancybox-button.disabled:hover,.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default}.fancybox-button svg{display:block;overflow:visible;position:relative;shape-rendering:geometricPrecision}.fancybox-button svg path{fill:transparent;stroke:currentColor;stroke-linejoin:round;stroke-width:3}.fancybox-button--pause svg path:nth-child(1),.fancybox-button--play svg path:nth-child(2){display:none}.fancybox-button--play svg path,.fancybox-button--share svg path,.fancybox-button--thumbs svg path{fill:currentColor}.fancybox-button--share svg path{stroke-width:1}.fancybox-navigation .fancybox-button{height:38px;opacity:0;padding:6px;position:absolute;top:50%;width:38px}.fancybox-show-nav .fancybox-navigation .fancybox-button{transition:opacity .25s,visibility 0s,color .25s}.fancybox-navigation .fancybox-button:after{content:"";left:-25px;padding:50px;position:absolute;top:-25px}.fancybox-navigation .fancybox-button--arrow_left{left:6px}.fancybox-navigation .fancybox-button--arrow_right{right:6px}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#555;cursor:pointer;height:44px;margin:0;padding:6px;position:absolute;right:0;top:0;width:44px;z-index:10}.fancybox-close-small svg{fill:transparent;opacity:.8;stroke:currentColor;stroke-width:1.5;transition:stroke .1s}.fancybox-close-small:focus{outline:none}.fancybox-close-small:hover svg{opacity:1}.fancybox-slide--iframe .fancybox-close-small,.fancybox-slide--image .fancybox-close-small,.fancybox-slide--video .fancybox-close-small{color:#ccc;padding:5px;right:-12px;top:-44px}.fancybox-slide--iframe .fancybox-close-small:hover svg,.fancybox-slide--image .fancybox-close-small:hover svg,.fancybox-slide--video .fancybox-close-small:hover svg{background:transparent;color:#fff}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small{display:none}.fancybox-caption{bottom:0;color:#fff;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:25px 44px;right:0}.fancybox-caption:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEtCAQAAABjBcL7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHRJREFUKM+Vk8EOgDAIQ0vj/3+xBw8qIZZueFnIKC90MCAI8DlrkHGeqqGIU6lVigrBtpCWqeRWoHDNqs0F7VNVBVxmHRlvoVqjaYkdnDIaivH2HqZ5+oZj3JUzWB+cOz4G48Bg+tsJ/tqu4dLC/4Xb+0GcF5BwBC0AA53qAAAAAElFTkSuQmCC);background-repeat:repeat-x;background-size:contain;bottom:0;content:"";display:block;left:0;pointer-events:none;position:absolute;right:0;top:-25px;z-index:-1}.fancybox-caption:after{border-bottom:1px solid hsla(0,0%,100%,.3);content:"";display:block;left:44px;position:absolute;right:44px;top:0}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;border:6px solid hsla(0,0%,39%,.5);border-radius:100%;border-top-color:#fff;height:60px;left:50%;margin:-30px 0 0 -30px;opacity:.6;padding:0;position:absolute;top:50%;width:60px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;-webkit-transform:rotate(1turn);transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;-webkit-transform:scaleX(1) translateZ(0);transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#fff;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:transparent;top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs>ul{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x>ul{overflow:hidden}.fancybox-thumbs-y>ul::-webkit-scrollbar{width:7px}.fancybox-thumbs-y>ul::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y>ul::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs>ul>li{-webkit-backface-visibility:hidden;backface-visibility:hidden;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li{background-position:50%;background-repeat:no-repeat;background-size:cover}.fancybox-thumbs>ul>li:before{border:4px solid #4ea7f9;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs .fancybox-thumbs-active:before{opacity:1}@media (max-width:800px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs>ul>li{max-width:calc(100% - 10px)}}@import url("themes/tooltipster-light.css"); @import url("themes/tooltipster-noir.css"); @import url("themes/tooltipster-punk.css"); @import url("themes/tooltipster-shadow.css"); @import url("themes/tooltipster-claro.css");/* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */ .tooltipster-default { border-radius: 5px; border: 2px solid #000; background: #4c4c4c; color: #fff; } /* Use this next selector to style things like font-size and line-height: */ .tooltipster-default .tooltipster-content { font-size: 14px; line-height: 16px; padding: 8px 10px; overflow: hidden; } /* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */ .tooltipster-default .tooltipster-arrow .tooltipster-arrow-border { /* border-color: ... !important; */ } /* If you're using the icon option, use this next selector to style them */ .tooltipster-icon { display: inline-block; position:absolute; right:25px; bottom:50px; border: 3px solid #ff5e3c; border-radius: 100%; box-sizing: border-box; -moz-box-sizing: border-box; width: 5em; height: 5em; background: #ff5e3c; color: #fff; font-size: 1.1em; line-height: 1em; font-weight: 700; padding: 1.8em 0 0 0; text-align: center; margin: -1.4em 1em 0 0; text-transform: uppercase; cursor: help; margin-left: 4px; background: #0078c9; border: 3px solid #0078c9; width: 2.3em; height: 2.3em; padding: 0.4em 0 0; margin: 2em 0 0 -3em; } .tooltipster-icon:hover { background: #fff !important; color: #5d6365; border: 3px solid #5d6365 !important; cursor: pointer; } /* This is the base styling required to make all Tooltipsters work */ .tooltipster-base { padding: 0; line-height: 0; position: absolute; left: 0; top: 0; z-index: 9999999; pointer-events: none; width: auto; overflow: visible; } .tooltipster-base .tooltipster-content { overflow: hidden; } /* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */ .tooltipster-arrow { display: block; text-align: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .tooltipster-arrow span, .tooltipster-arrow-border { display: block; width: 0; height: 0; position: absolute; } .tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-top: 8px solid; bottom: -7px; } .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-top: 9px solid; bottom: -7px; } .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-bottom: 8px solid; top: -7px; } .tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-bottom: 9px solid; top: -7px; } .tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border { left: 0; right: 0; margin: 0 auto; } .tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span { left: 6px; } .tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { left: 5px; } .tooltipster-arrow-top-right span, .tooltipster-arrow-bottom-right span { right: 6px; } .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border { right: 5px; } .tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 8px solid transparent !important; border-bottom: 8px solid transparent !important; border-left: 8px solid; top: 50%; margin-top: -7px; right: -7px; } .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-left: 9px solid; margin-top: -8px; } .tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 8px solid transparent !important; border-bottom: 8px solid transparent !important; border-right: 8px solid; top: 50%; margin-top: -7px; left: -7px; } .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-right: 9px solid; margin-top: -8px; } /* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */ .tooltipster-fade { opacity: 0; -webkit-transition-property: opacity; -moz-transition-property: opacity; -o-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } .tooltipster-fade-show { opacity: 1; } .tooltipster-grow { -webkit-transform: scale(0,0); -moz-transform: scale(0,0); -o-transform: scale(0,0); -ms-transform: scale(0,0); transform: scale(0,0); -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; -webkit-backface-visibility: hidden; } .tooltipster-grow-show { -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -o-transform: scale(1,1); -ms-transform: scale(1,1); transform: scale(1,1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-swing { opacity: 0; -webkit-transform: rotateZ(4deg); -moz-transform: rotateZ(4deg); -o-transform: rotateZ(4deg); -ms-transform: rotateZ(4deg); transform: rotateZ(4deg); -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; } .tooltipster-swing-show { opacity: 1; -webkit-transform: rotateZ(0deg); -moz-transform: rotateZ(0deg); -o-transform: rotateZ(0deg); -ms-transform: rotateZ(0deg); transform: rotateZ(0deg); -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1); -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); } .tooltipster-fall { top: 0; -webkit-transition-property: top; -moz-transition-property: top; -o-transition-property: top; -ms-transition-property: top; transition-property: top; -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-fall-show { } .tooltipster-fall.tooltipster-dying { -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; -ms-transition-property: all; transition-property: all; top: 0px !important; opacity: 0; } .tooltipster-slide { left: -40px; -webkit-transition-property: left; -moz-transition-property: left; -o-transition-property: left; -ms-transition-property: left; transition-property: left; -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-slide.tooltipster-slide-show { } .tooltipster-slide.tooltipster-dying { -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; -ms-transition-property: all; transition-property: all; left: 0px !important; opacity: 0; } /* CSS transition for when contenting is changing in a tooltip that is still open. The only properties that will NOT transition are: width, height, top, and left */ .tooltipster-content-changing { opacity: 0.5; -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } .tooltipster-claro { border-radius: 2px; border: 1px solid #ccc; box-shadow: 1px 3px 15px -1px #333; background: #fff; color: #333; } .tooltipster-claro .tooltipster-content { line-height: 100%; padding: 0px; max-height: 500px; overflow-y: auto; } .tooltipster-claro .tooltipster-content .tooltip-header{ border-bottom: 1px solid #ccc; }.tooltipster-light { border-radius: 5px; border: 1px solid #cccccc; background: #ededed; color: #666666; } .tooltipster-light .tooltipster-content { font-size: 14px; line-height: 16px; padding: 8px 10px; }.tooltipster-noir { border-radius: 0px; border: 3px solid #2c2c2c; background: #fff; color: #2c2c2c; } .tooltipster-noir .tooltipster-content { font-size: 14px; line-height: 16px; padding: 8px 10px; }.tooltipster-punk { border-radius: 5px; border-bottom: 3px solid #f71169; background: #2a2a2a; color: #fff; } .tooltipster-punk .tooltipster-content { font-size: 14px; line-height: 16px; padding: 8px 10px; }.tooltipster-shadow { border-radius: 5px; background: #fff; box-shadow: 0px 0px 14px rgba(0,0,0,0.3); color: #2c2c2c; } .tooltipster-shadow .tooltipster-content { font-size: 14px; line-height: 16px; padding: 8px 10px; }/*! Flickity v2.0.5 http://flickity.metafizzy.co ---------------------------------------------- */ .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 100%; } .flickity-slider { position: absolute; width: 100%; height: 100%; } /* draggable */ .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing; } /* ---- previous/next buttons ---- */ .flickity-prev-next-button { position: absolute; top: 50%; width: 44px; height: 44px; border: none; border-radius: 50%; background: white; background: hsla(0, 0%, 100%, 0.75); cursor: pointer; /* vertically center */ -webkit-transform: translateY(-50%); transform: translateY(-50%); } .flickity-prev-next-button:hover { background: white; } .flickity-prev-next-button:focus { outline: none; box-shadow: 0 0 0 5px #09F; } .flickity-prev-next-button:active { opacity: 0.6; } .flickity-prev-next-button.previous { left: 10px; } .flickity-prev-next-button.next { right: 10px; } /* right to left */ .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-prev-next-button:disabled { opacity: 0.3; cursor: auto; } .flickity-prev-next-button svg { position: absolute; left: 20%; top: 20%; width: 60%; height: 60%; } .flickity-prev-next-button .arrow { fill: #333; } /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { opacity: 1; }/* // caption.js styles */ /* Main */ .captionjs { line-height: 0; } .captionjs figcaption { line-height: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; width: 100%; text-align: left; } .captionjs.overlay, .captionjs.stacked, .captionjs.animated, .captionjs.hide { position: relative; overflow: hidden; } .captionjs.stacked figcaption, .captionjs.animated figcaption, .captionjs.hide figcaption, .captionjs.overlay figcaption { position: absolute; } /* Stacked mode */ .captionjs.stacked figcaption { bottom: 0; } /* Overlay mode */ .captionjs.overlay{ margin: 0 !important; } .captionjs.overlay:after{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.6); opacity: 0; } .captionjs.overlay figcaption { display: flex; justify-content: center; align-items: center; margin: 0; top: 0; bottom: 0; opacity: 0; color: #fff; z-index: 3; } .captionjs.overlay figcaption, .captionjs.overlay:after { -webkit-transition: 0.5s opacity; -moz-transition: 0.5s opacity; -ms-transition: 0.5s opacity; -o-transition: 0.5s opacity; transition: 0.5s opacity; } .captionjs.overlay:hover figcaption, .captionjs.overlay:hover:after { opacity: 1 !important; } /* Animated mode */ .captionjs.animated figcaption { -webkit-transition: 0.25s bottom; -moz-transition: 0.25s bottom; -ms-transition: 0.25s bottom; -o-transition: 0.25s bottom; transition: 0.25s bottom; } .captionjs.animated:hover figcaption { bottom: 0 !important; } /* Hide mode */ .captionjs.hide figcaption { -webkit-transition: 0.25s margin-bottom; -moz-transition: 0.25s margin-bottom; -ms-transition: 0.25s margin-bottom; -o-transition: 0.25s margin-bottom; transition: 0.25s margin-bottom; } .captionjs.hide:hover figcaption { margin-bottom: 0 !important; } .captionjs figcaption{ border: none; } body.responsive .captionjs img{ width: auto !important; } .captionjs, .captionjs figcaption { margin: 0 0 20px; padding: 0; } .captionjs figcaption { font-size: 13px; line-height: 1.5; padding: 10px 15px; border-top: none; } .captionjs.animated figcaption, .captionjs.stacked figcaption { border-top: 1px solid rgba(255, 255, 255, 0.3); background-color: rgba(0, 0, 0, 0.5); color: #fff; border: none; } .captionjs.hide figcaption { border-top: 1px solid rgba(255, 255, 255, 0.3); background-color: rgba(33, 33, 99, 0.75); color: #fff; border: none; } .captionjs.default a { color: #000; }/*! nouislider - 8.2.1 - 2015-12-02 21:43:15 */ .noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative;direction:ltr}.noUi-base{width:100%;height:100%;position:relative;z-index:1}.noUi-origin{position:absolute;right:0;top:0;left:0;bottom:0}.noUi-handle{position:relative;z-index:1}.noUi-stacking .noUi-handle{z-index:10}.noUi-state-tap .noUi-origin{-webkit-transition:left .3s,top .3s;transition:left .3s,top .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-base{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;left:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;left:-6px;top:-17px}.noUi-background{background:#FAFAFA;box-shadow:inset 0 1px 1px #f0f0f0}.noUi-connect{background:#3FB8AF;box-shadow:inset 0 0 3px rgba(51,51,51,.45);-webkit-transition:background 450ms;transition:background 450ms}.noUi-origin{border-radius:2px}.noUi-target{border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-target.noUi-connect{box-shadow:inset 0 0 3px rgba(51,51,51,.45),0 3px 6px -5px #BBB}.noUi-draggable{cursor:w-resize}.noUi-vertical .noUi-draggable{cursor:n-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect,[disabled].noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-origin{cursor:not-allowed}.noUi-pips,.noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{width:40px;position:absolute;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-large,.noUi-marker-sub{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:50px;top:100%;left:0;width:100%}.noUi-value-horizontal{margin-left:-20px;padding-top:20px}.noUi-value-horizontal.noUi-value-sub{padding-top:15px}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{width:15px;margin-left:20px;margin-top:-5px}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;padding:5px;text-align:center}.noUi-horizontal .noUi-handle-lower .noUi-tooltip{top:-32px}.noUi-horizontal .noUi-handle-upper .noUi-tooltip{bottom:-32px}.noUi-vertical .noUi-handle-lower .noUi-tooltip{left:120%}.noUi-vertical .noUi-handle-upper .noUi-tooltip{right:120%}/* -------------------------------- Primary style -------------------------------- */ .dki-timeline-element *, .dki-timeline-element *:after, .dki-timeline-element *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .dki-tinmeline-element a { color: #acb7c0; text-decoration: none; font-family: "Open Sans", sans-serif; } .dki-timeline-element img { max-width: 100%; } .dki-timeline-element h1, .dki-timeline-element h2 { font-family: "Open Sans", sans-serif; font-weight: bold; } .dki-timeline-element section{ margin:10px 0; } .dki-timeline-element .cd-timeline-img i{ display:block; width: 30px; height: 30px; line-height: 30px; text-align: center; position:relative; padding:0 !important; } .dki-timeline-element .cd-timeline-img i{ font-size:30px; text-align:center; } .dki-timeline-element .cd-timeline-block.add { display:none !important; } .dki-timelineNode-element{ height:100%; padding:0 !important; } /* -------------------------------- Modules - reusable parts of our design -------------------------------- */ .cd-container { /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ width: 90%; max-width: 1170px; margin: 0 auto; } .cd-container::after { /* clearfix */ content: ''; display: table; clear: both; } /* -------------------------------- Main components -------------------------------- */ .dki-timeline-element header { height: 200px; line-height: 200px; text-align: center; background: #303e49; } @media only screen and (min-width: 1170px) { .dki-timeline-element header { height: 300px; line-height: 300px; } } .dki-timeline-element section { position: relative; padding: 2em 0; margin-top: 2em; margin-bottom: 2em; } .dki-timeline-element section::before { /* this is the vertical line */ content: ''; position: absolute; top: 0; left: 18px; height: 100%; width: 4px; background: #d7e4ed; } @media only screen and (min-width: 993px) { .dki-timeline-element section.tl-md, .dki-timeline-element section.tl-none{ margin-top: 3em; margin-bottom: 3em; } .dki-timeline-element section.tl-md::before, .dki-timeline-element section.tl-none::before { left: 50%; margin-left: -2px; } } @media only screen and (min-width: 769px) { .dki-timeline-element section.tl-sm{ margin-top: 3em; margin-bottom: 3em; } .dki-timeline-element section.tl-sm::before { left: 50%; margin-left: -2px; } } @media only screen and (min-width: 768px) { .dki-timeline-element section.tl-xs{ margin-top: 3em; margin-bottom: 3em; } .dki-timeline-element section.tl-xs::before { left: 50%; margin-left: -2px; } } .cd-timeline-block { position: relative; margin: 2em 0; } .cd-timeline-block:after { content: ""; display: table; clear: both; } .cd-timeline-block:first-child { margin-top: 0; } .cd-timeline-block:last-child { margin-bottom: 0; } @media only screen and (min-width: 993px) { .tl-md .cd-timeline-block { margin: 4em 0; } .tl-md .cd-timeline-block:first-child { margin-top: 0; } .tl-md .cd-timeline-block:last-child { margin-bottom: 0; } } @media only screen and (min-width: 769px) { .tl-sm .cd-timeline-block { margin: 4em 0; } .tl-sm .cd-timeline-block:first-child { margin-top: 0; } .tl-sm .cd-timeline-block:last-child { margin-bottom: 0; } } @media only screen and (min-width: 768px) { .tl-xs .cd-timeline-block { margin: 4em 0; } .tl-xs .cd-timeline-block:first-child { margin-top: 0; } .tl-xs .cd-timeline-block:last-child { margin-bottom: 0; } } .cd-timeline-img, .cd-timeline-img.active { z-index:2; position: absolute; top: 0; left: 0; width: 40px; height: 40px; border-radius: 50%; box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05); } .cd-timeline-img .img { display: block; width:100%; height:100%; border-radius:50%; background-size:contain; background-repeat:no-repeat; background-position:center; } .cd-timeline-img.cd-picture { background: #75ce66; } .cd-timeline-img.cd-movie { background: #c03b44; } .cd-timeline-img.cd-location { background: #f0ca45; } .cssanimations .cd-timeline-block .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; } .cssanimations .cd-timeline-img.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; } .cssanimations .cd-timeline-content.is-hidden, .cssanimations .cd-timeline-img.is-hidden { visibility: hidden; } @media only screen and (min-width: 993px) { .tl-md .cd-timeline-img { width: 60px; height: 60px; left: 50%; margin-left: -30px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; } .tl-md .cd-timeline-img i{ width: 50px; height: 50px; line-height: 50px; } .cssanimations .tl-md .cd-timeline-img.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; } } @media only screen and (min-width: 769px) { .tl-sm .cd-timeline-img { width: 60px; height: 60px; left: 50%; margin-left: -30px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; } .tl-sm .cd-timeline-img i{ width: 50px; height: 50px; line-height: 50px; } .cssanimations .tl-sm .cd-timeline-img.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; } } @media only screen and (min-width: 768px) { .tl-xs .cd-timeline-img { width: 60px; height: 60px; left: 50%; margin-left: -30px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; } .tl-xs .cd-timeline-img i{ width: 50px; height: 50px; line-height: 50px; } .cssanimations .tl-xs .cd-timeline-img.bounce-in { visibility: visible; -webkit-animation: cd-bounce-1 0.6s; -moz-animation: cd-bounce-1 0.6s; animation: cd-bounce-1 0.6s; } } @-webkit-keyframes cd-bounce-1 { 0% { opacity: 0; -webkit-transform: scale(0.5); } 60% { opacity: 1; -webkit-transform: scale(1.2); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes cd-bounce-1 { 0% { opacity: 0; -moz-transform: scale(0.5); } 60% { opacity: 1; -moz-transform: scale(1.2); } 100% { -moz-transform: scale(1); } } @keyframes cd-bounce-1 { 0% { opacity: 0; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); transform: scale(0.5); } 60% { opacity: 1; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .cd-timeline-content { position: relative; margin-left: 60px; } .cd-timeline-content:not(.panel) { box-shadow: 0 3px 0 #d7e4ed; border-radius: 0.25em; background: white; padding: 1em; } .cd-timeline-content:after { content: ""; display: table; clear: both; } .cd-timeline-content h2 { color: #303e49; } .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date { display: inline-block; } .cd-timeline-content p { margin: 1em 0; line-height: 1.6; } .cd-timeline-content .cd-read-more { float: right; padding: .8em 1em; background: #acb7c0; color: white; border-radius: 0.25em; } .no-touch .cd-timeline-content .cd-read-more:hover { background-color: #bac4cb; } .cd-timeline-content .cd-date { float: left; padding: .8em 0; opacity: .7; font-size:0.85em; } .cd-timeline-content::before { content: ''; position: absolute; top: 16px; right: 100%; height: 0; width: 0; border: 7px solid transparent; border-right: 7px solid white; } .cd-timeline-content.panel::before{ border:transparent; } @media only screen and (min-width: 993px) { .tl-md .cd-timeline-content, .tl-none .cd-timeline-content { padding: 1.6em; width: 45%; } .tl-md .cd-timeline-content::before, .tl-none .cd-timeline-content::before { top: 24px; left: 100%; border-color: transparent; border-left-color: white; } .tl-md .cd-timeline-content.panel::before, .tl-none .cd-timeline-content.panel::before{ border-left:transparent; } .tl-md .cd-timeline-content .cd-read-more, .tl-none .cd-timeline-content .cd-read-more { float: left; } .tl-md .cd-timeline-content .cd-date, .tl-none .cd-timeline-content .cd-date { position: absolute; width: 100%; left: 122%; top: 6px; font-size: 1em; } .tl-md .cd-timeline-block:nth-child(even) .cd-timeline-content, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content { float: right; } .tl-md .cd-timeline-block:nth-child(even) .cd-timeline-content::before, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content::before { top: 24px; left: auto; right: 100%; border-color: transparent; border-right-color: white; } .tl-md .cd-timeline-content.panel::before, .tl-none .cd-timeline-content.panel::before{ border-right:transparent; } .tl-md .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more { float: right; } .tl-md .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { left: auto; right: 122%; text-align: right; } .cssanimations .tl-md .cd-timeline-content.bounce-in, .cssanimations .tl-none .cd-timeline-content.bounce-in { visibility: visible; -webkit-animation: cd-bounce-2 0.6s; -moz-animation: cd-bounce-2 0.6s; animation: cd-bounce-2 0.6s; } } @media only screen and (min-width: 769px) { .tl-sm .cd-timeline-content, .tl-none .cd-timeline-content { padding: 1.6em; width: 45%; } .tl-sm .cd-timeline-content::before, .tl-none .cd-timeline-content::before { top: 24px; left: 100%; border-color: transparent; border-left-color: white; } .tl-sm .cd-timeline-content.panel::before, .tl-none .cd-timeline-content.panel::before{ border-left:transparent; } .tl-sm .cd-timeline-content .cd-read-more, .tl-none .cd-timeline-content .cd-read-more { float: left; } .tl-sm .cd-timeline-content .cd-date, .tl-none .cd-timeline-content .cd-date { position: absolute; width: 100%; left: 122%; top: 6px; font-size: 1em; } .tl-sm .cd-timeline-block:nth-child(even) .cd-timeline-content, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content { float: right; } .tl-sm .cd-timeline-block:nth-child(even) .cd-timeline-content::before, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content::before { top: 24px; left: auto; right: 100%; border-color: transparent; border-right-color: white; } .tl-sm .cd-timeline-content.panel::before, .tl-none .cd-timeline-content.panel::before{ border-right:transparent; } .tl-sm .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more { float: right; } .tl-sm .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date, .tl-none .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { left: auto; right: 122%; text-align: right; } .cssanimations .tl-sm .cd-timeline-content.bounce-in, .cssanimations .tl-none .cd-timeline-content.bounce-in { visibility: visible; -webkit-animation: cd-bounce-2 0.6s; -moz-animation: cd-bounce-2 0.6s; animation: cd-bounce-2 0.6s; } } @media only screen and (min-width: 768px) { .tl-xs .cd-timeline-content { margin-left: 0; padding: 1.6em; width: 45%; } .tl-xs .cd-timeline-content::before { top: 24px; left: 100%; border-color: transparent; border-left-color: white; } .tl-xs .cd-timeline-content.panel::before{ border-left:transparent; } .tl-xs .cd-timeline-content .cd-read-more { float: left; } .tl-xs .cd-timeline-content .cd-date { position: absolute; width: 100%; left: 122%; top: 6px; font-size: 1em; } .tl-xs .cd-timeline-block:nth-child(even) .cd-timeline-content { float: right; } .tl-xs .cd-timeline-block:nth-child(even) .cd-timeline-content::before { top: 24px; left: auto; right: 100%; border-color: transparent; border-right-color: white; } .tl-xs .cd-timeline-content.panel::before{ border-right:transparent; } .tl-xs .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more { float: right; } .tl-xs .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { left: auto; right: 122%; text-align: right; } .cssanimations .tl-xs .cd-timeline-content.bounce-in { visibility: visible; -webkit-animation: cd-bounce-2 0.6s; -moz-animation: cd-bounce-2 0.6s; animation: cd-bounce-2 0.6s; } } @media only screen and (min-width: 993px) { /* inverse bounce effect on even content blocks */ .cssanimations .tl-md .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; } } @media only screen and (min-width: 769px) { /* inverse bounce effect on even content blocks */ .cssanimations .tl-sm .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; } } @media only screen and (min-width: 768px) { /* inverse bounce effect on even content blocks */ .cssanimations .tl-xs .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { -webkit-animation: cd-bounce-2-inverse 0.6s; -moz-animation: cd-bounce-2-inverse 0.6s; animation: cd-bounce-2-inverse 0.6s; } } @-webkit-keyframes cd-bounce-2 { 0% { opacity: 0; -webkit-transform: translateX(-100px); } 60% { opacity: 1; -webkit-transform: translateX(20px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes cd-bounce-2 { 0% { opacity: 0; -moz-transform: translateX(-100px); } 60% { opacity: 1; -moz-transform: translateX(20px); } 100% { -moz-transform: translateX(0); } } @keyframes cd-bounce-2 { 0% { opacity: 0; -webkit-transform: translateX(-100px); -moz-transform: translateX(-100px); -ms-transform: translateX(-100px); -o-transform: translateX(-100px); transform: translateX(-100px); } 60% { opacity: 1; -webkit-transform: translateX(20px); -moz-transform: translateX(20px); -ms-transform: translateX(20px); -o-transform: translateX(20px); transform: translateX(20px); } 100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes cd-bounce-2-inverse { 0% { opacity: 0; -webkit-transform: translateX(100px); } 60% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes cd-bounce-2-inverse { 0% { opacity: 0; -moz-transform: translateX(100px); } 60% { opacity: 1; -moz-transform: translateX(-20px); } 100% { -moz-transform: translateX(0); } } @keyframes cd-bounce-2-inverse { 0% { opacity: 0; -webkit-transform: translateX(100px); -moz-transform: translateX(100px); -ms-transform: translateX(100px); -o-transform: translateX(100px); transform: translateX(100px); } 60% { opacity: 1; -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); -ms-transform: translateX(-20px); -o-transform: translateX(-20px); transform: translateX(-20px); } 100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } } /* Get the bourbon mixin from http://bourbon.io */ /* Reset */ .flip-clock-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } .flip-clock-wrapper a { cursor: pointer; text-decoration: none; color: #ccc; } .flip-clock-wrapper a:hover { color: #fff; } .flip-clock-wrapper ul { list-style: none; } .flip-clock-wrapper.clearfix:before, .flip-clock-wrapper.clearfix:after { content: " "; display: table; } .flip-clock-wrapper.clearfix:after { clear: both; } .flip-clock-wrapper.clearfix { *zoom: 1; } /* Main */ .flip-clock-wrapper { font: normal 11px "Helvetica Neue", Helvetica, sans-serif; -webkit-user-select: none; } .flip-clock-meridium { background: none !important; box-shadow: 0 0 0 !important; font-size: 36px !important; } .flip-clock-meridium a { color: #313333; } .flip-clock-wrapper { text-align: center; position: relative; width: 100%; margin: 1em; } .flip-clock-wrapper:before, .flip-clock-wrapper:after { content: " "; /* 1 */ display: table; /* 2 */ } .flip-clock-wrapper:after { clear: both; } /* Skeleton */ .flip-clock-wrapper ul { position: relative; float: left; margin: 5px; width: 60px; height: 90px; font-size: 80px; font-weight: bold; line-height: 87px; border-radius: 6px; background: #000; } .flip-clock-wrapper ul li { z-index: 1; position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 87px; text-decoration: none !important; } .flip-clock-wrapper ul li:first-child { z-index: 2; } .flip-clock-wrapper ul li a { display: block; height: 100%; -webkit-perspective: 200px; -moz-perspective: 200px; perspective: 200px; margin: 0 !important; overflow: visible !important; cursor: default !important; } .flip-clock-wrapper ul li a div { z-index: 1; position: absolute; left: 0; width: 100%; height: 50%; font-size: 80px; overflow: hidden; outline: 1px solid transparent; } .flip-clock-wrapper ul li a div .shadow { position: absolute; width: 100%; height: 100%; z-index: 2; } .flip-clock-wrapper ul li a div.up { -webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; -o-transform-origin: 50% 100%; transform-origin: 50% 100%; top: 0; } .flip-clock-wrapper ul li a div.up:after { content: ""; position: absolute; top: 44px; left: 0; z-index: 5; width: 100%; height: 3px; background-color: #000; background-color: rgba(0, 0, 0, 0.4); } .flip-clock-wrapper ul li a div.down { -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; -ms-transform-origin: 50% 0; -o-transform-origin: 50% 0; transform-origin: 50% 0; bottom: 0; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .flip-clock-wrapper ul li a div div.inn { position: absolute; left: 0; z-index: 1; width: 100%; height: 200%; color: #ccc; text-shadow: 0 1px 2px #000; text-align: center; background-color: #333; border-radius: 6px; font-size: 70px; } .flip-clock-wrapper ul li a div.up div.inn { top: 0; } .flip-clock-wrapper ul li a div.down div.inn { bottom: 0; } /* PLAY */ .flip-clock-wrapper ul.play li.flip-clock-before { z-index: 3; } .flip-clock-wrapper .flip { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7); } .flip-clock-wrapper ul.play li.flip-clock-active { -webkit-animation: asd 0.01s 0.49s linear both; -moz-animation: asd 0.01s 0.49s linear both; animation: asd 0.01s 0.49s linear both; z-index: 5; } .flip-clock-divider { float: left; display: inline-block; position: relative; width: 20px; height: 100px; } .flip-clock-divider:first-child { width: 0; } .flip-clock-dot { display: block; background: #323434; width: 10px; height: 10px; position: absolute; border-radius: 50%; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); left: 5px; } .flip-clock-divider .flip-clock-label { position: absolute; top: -1.5em; right: -86px; color: black; text-shadow: none; } .flip-clock-divider.minutes .flip-clock-label { right: -88px; } .flip-clock-divider.seconds .flip-clock-label { right: -91px; } .flip-clock-dot.top { top: 30px; } .flip-clock-dot.bottom { bottom: 30px; } @-webkit-keyframes asd { 0% { z-index: 2; } 100% { z-index: 4; } } @-moz-keyframes asd { 0% { z-index: 2; } 100% { z-index: 4; } } @-o-keyframes asd { 0% { z-index: 2; } 100% { z-index: 4; } } @keyframes asd { 0% { z-index: 2; } 100% { z-index: 4; } } .flip-clock-wrapper ul.play li.flip-clock-active .down { z-index: 2; -webkit-animation: turn 0.5s 0.5s linear both; -moz-animation: turn 0.5s 0.5s linear both; animation: turn 0.5s 0.5s linear both; } @-webkit-keyframes turn { 0% { -webkit-transform: rotateX(90deg); } 100% { -webkit-transform: rotateX(0deg); } } @-moz-keyframes turn { 0% { -moz-transform: rotateX(90deg); } 100% { -moz-transform: rotateX(0deg); } } @-o-keyframes turn { 0% { -o-transform: rotateX(90deg); } 100% { -o-transform: rotateX(0deg); } } @keyframes turn { 0% { transform: rotateX(90deg); } 100% { transform: rotateX(0deg); } } .flip-clock-wrapper ul.play li.flip-clock-before .up { z-index: 2; -webkit-animation: turn2 0.5s linear both; -moz-animation: turn2 0.5s linear both; animation: turn2 0.5s linear both; } @-webkit-keyframes turn2 { 0% { -webkit-transform: rotateX(0deg); } 100% { -webkit-transform: rotateX(-90deg); } } @-moz-keyframes turn2 { 0% { -moz-transform: rotateX(0deg); } 100% { -moz-transform: rotateX(-90deg); } } @-o-keyframes turn2 { 0% { -o-transform: rotateX(0deg); } 100% { -o-transform: rotateX(-90deg); } } @keyframes turn2 { 0% { transform: rotateX(0deg); } 100% { transform: rotateX(-90deg); } } .flip-clock-wrapper ul li.flip-clock-active { z-index: 3; } /* SHADOW */ .flip-clock-wrapper ul.play li.flip-clock-before .up .shadow { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black)); background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%; background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%; -webkit-animation: show 0.5s linear both; -moz-animation: show 0.5s linear both; animation: show 0.5s linear both; } .flip-clock-wrapper ul.play li.flip-clock-active .up .shadow { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black)); background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%; background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%; -webkit-animation: hide 0.5s 0.3s linear both; -moz-animation: hide 0.5s 0.3s linear both; animation: hide 0.5s 0.3s linear both; } /*DOWN*/ .flip-clock-wrapper ul.play li.flip-clock-before .down .shadow { background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1))); background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%; background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%; -webkit-animation: show 0.5s linear both; -moz-animation: show 0.5s linear both; animation: show 0.5s linear both; } .flip-clock-wrapper ul.play li.flip-clock-active .down .shadow { background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1))); background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%; background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%; -webkit-animation: hide 0.5s 0.3s linear both; -moz-animation: hide 0.5s 0.3s linear both; animation: hide 0.5s 0.2s linear both; } @-webkit-keyframes show { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes show { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes show { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes show { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes hide { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes hide { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes hide { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes hide { 0% { opacity: 1; } 100% { opacity: 0; } } #browserWarning_disabler { position:absolute; height:100%; width:100%; z-index:100000; background-color:#000000; -moz-opacity: 0.5; opacity: 0.5; filter:alpha(opacity=50); } #browserWarning_notice { background: transparent; width: 100%; max-width:720px; position:absolute; z-index:100001; color: #000; } #browserWarning_content { font-size:18px; background-color: #FFFFFF; width: 96%; margin-left: 2%; margin-right: 2%; max-width:700px; text-align:center; } #browserWarning_content h2 { font-size:40px; } #browserWarning_close { display:block; height:25px; width: 25px; background-image: url(../images/panel_closeButton.png); background-repeat:no-repeat; position:absolute; top:0px; right:0px; } #browserWarning_close span, #browserWarning_downloads a span { visibility:hidden; } #browserWarning_downloads { margin:10px auto; padding-top:20px; } #browserWarning_chromeDownload { background-position:0px 0px; } #browserWarning_firefoxDownload { background-position:-141px 0px; } #browserWarning_safariDownload { background-position:-423px 0px; } #browserWarning_ieDownload { display: none; /* no love for IE */ background-position:-564px 0px; } #browserWarning_downloads a { height:132px; width:141px; display:none; background-image: url(../images/browser_logos-128.png); background-repeat: no-repeat; vertical-align:bottom; } #browserWarning_downloads #browserWarning_ieDownload { display:none; } .android a#browserWarning_chromeDownload, .ios a#browserWarning_safariDownload, .mac a#browserWarning_chromeDownload, .mac a#browserWarning_firefoxDownload, .mac a#browserWarning_safariDownload, .windows a#browserWarning_chromeDownload, .windows a#browserWarning_firefoxDownload { display: inline-block; }@charset "UTF-8"; /* * CSS TOGGLE SWITCH * * Ionuț Colceriu - ghinda.net * https://github.com/ghinda/css-toggle-switch * */ /* supported values are px, rem-calc, em-calc */ /* imports */ /* Functions */ /* Shared */ /* Hide by default */ .switch-toggle a, .switch-light span span { display: none; } /* We can't test for a specific feature, * so we only target browsers with support for media queries. */ @media only screen { /* Checkbox */ .switch-light { position: relative; display: block; /* simulate default browser focus outlines on the switch, * when the inputs are focused. */ } .switch-light::after { clear: both; content: ""; display: table; } .switch-light *, .switch-light *:before, .switch-light *:after { box-sizing: border-box; } .switch-light a { display: block; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .switch-light label, .switch-light > span { /* breathing room for bootstrap/foundation classes. */ line-height: 2em; vertical-align: middle; } .switch-light input:focus ~ span a, .switch-light input:focus + label { outline-width: 2px; outline-style: solid; outline-color: Highlight; /* Chrome/Opera gets its native focus styles. */ } } @media only screen and (-webkit-min-device-pixel-ratio: 0) { .switch-light input:focus ~ span a, .switch-light input:focus + label { outline-color: -webkit-focus-ring-color; outline-style: auto; } } @media only screen { /* don't hide the input from screen-readers and keyboard access */ .switch-light input { position: absolute; opacity: 0; z-index: 3; } .switch-light input:checked ~ span a { right: 0%; } /* inherit from label */ .switch-light strong { font-weight: inherit; } .switch-light > span { position: relative; overflow: hidden; display: block; min-height: 2em; /* overwrite 3rd party classes padding * eg. bootstrap .well */ padding: 0; text-align: left; } .switch-light span span { position: relative; z-index: 2; display: block; float: left; width: 50%; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .switch-light a { position: absolute; right: 50%; top: 0; z-index: 1; display: block; width: 50%; height: 100%; padding: 0; } /* Radio Switch */ .switch-toggle { position: relative; display: block; /* simulate default browser focus outlines on the switch, * when the inputs are focused. */ /* For callout panels in foundation */ padding: 0 !important; /* 2 items */ /* 3 items */ /* 4 items */ /* 5 items */ /* 6 items */ } .switch-toggle::after { clear: both; content: ""; display: table; } .switch-toggle *, .switch-toggle *:before, .switch-toggle *:after { box-sizing: border-box; } .switch-toggle a { display: block; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .switch-toggle label, .switch-toggle > span { /* breathing room for bootstrap/foundation classes. */ line-height: 2em; vertical-align: middle; } .switch-toggle input:focus ~ span a, .switch-toggle input:focus + label { outline-width: 2px; outline-style: solid; outline-color: Highlight; /* Chrome/Opera gets its native focus styles. */ } } @media only screen and (-webkit-min-device-pixel-ratio: 0) { .switch-toggle input:focus ~ span a, .switch-toggle input:focus + label { outline-color: -webkit-focus-ring-color; outline-style: auto; } } @media only screen { .switch-toggle input { position: absolute; left: 0; opacity: 0; } .switch-toggle input + label { position: relative; z-index: 2; display: block; float: left; padding: 0 8px; margin: 0; text-align: center; } .switch-toggle label > a { position: absolute; top: 0; left: 0; padding: 0; z-index: 1; width: 10px; height: 100%; display:none; } .switch-toggle label.active > a { display:block; } .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(3), .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(3) ~ label { width: 50%; } .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(5), .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(5) ~ label { width: 33.33%; } .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(7), .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(7) ~ label { width: 25%; } .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(9), .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(9) ~ label { width: 20%; } .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(11), .switch-toggle.justified:not(.vertical) label:nth-child(2):nth-last-child(11) ~ label { width: 16.6%; } /* Candy Theme * Based on the "Sort Switches / Toggles (PSD)" by Ormal Clarck * http://www.premiumpixels.com/freebies/sort-switches-toggles-psd/ */ .switch-toggle.switch-candy, .switch-light.switch-candy > span { background-color: #2d3035; border-radius: 3px; box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.2); } .switch-light.switch-candy span span, .switch-light.switch-candy input:checked ~ span span:first-child, .switch-toggle.switch-candy label { color: #fff; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px #191b1e; } .switch-light.switch-candy input ~ span span:first-child, .switch-light.switch-candy input:checked ~ span span:nth-child(2), .switch-candy input:checked + label { color: #333; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); } .switch-candy a { border: 1px solid #333; border-radius: 3px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), inset 0 1px 1px rgba(255, 255, 255, 0.45); background-color: #70c66b; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), transparent); } .switch-candy-blue a { background-color: #38a3d4; } .switch-candy-yellow a { background-color: #f5e560; } /* iOS Theme */ .switch-ios.switch-light span span { color: #888b92; } .switch-ios.switch-light a { left: 0; top: 0; width: 32px; height: 32px; background-color: #fff; border-radius: 100%; border: 4px solid #D8D9DB; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .switch-ios.switch-light > span { display: block; width: 100%; height: 32px; background-color: #D8D9DB; border-radius: 28px; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .switch-ios.switch-light > span span { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; line-height: 30px; vertical-align: middle; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .switch-ios.switch-light > span span:first-of-type { opacity: 1; padding-left: 30px; } .switch-ios.switch-light > span span:last-of-type { padding-right: 30px; } .switch-ios.switch-light input:checked ~ span a { left: 100%; border-color: #4BD865; margin-left: -32px; } .switch-ios.switch-light input:checked ~ span { border-color: #4BD865; box-shadow: inset 0 0 0 30px #4BD865; } .switch-ios.switch-light input:checked ~ span span:first-of-type { opacity: 0; } .switch-ios.switch-light input:checked ~ span span:last-of-type { opacity: 1; color: #fff; } .switch-ios.switch-toggle { background-color: #D8D9DB; border-radius: 30px; box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 0; } .switch-ios.switch-toggle a { background-color: #4BD865; border: 2px solid #D8D9DB; border-radius: 28px; -webkit-transition: all 0.12s ease-out; -moz-transition: all 0.12s ease-out; transition: all 0.12s ease-out; } .switch-ios.switch-toggle label { height: 2.4em; color: #888b92; line-height: 2.4em; vertical-align: middle; } .switch-ios input:checked + label { color: #3e4043; } /* Holo Theme */ .switch-toggle.switch-holo, .switch-light.switch-holo > span { background-color: #464747; border-radius: 1px; box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 0; color: #fff; text-transform: uppercase; } .switch-holo label { color: #fff; } .switch-holo > span span { opacity: 0; -webkit-transition: all 0.1s; -moz-transition: all 0.1s; transition: all 0.1s; } .switch-holo > span span:first-of-type { opacity: 1; } .switch-holo > span span, .switch-holo label { font-size: 85%; line-height: 34.5px; } .switch-holo a { background-color: #666; border-radius: 1px; box-shadow: inset rgba(255, 255, 255, 0.2) 0 1px 0, inset rgba(0, 0, 0, 0.3) 0 -1px 0; } /* Selected ON switch-light */ .switch-holo.switch-light input:checked ~ span a { background-color: #0E88B1; } .switch-holo.switch-light input:checked ~ span span:first-of-type { opacity: 0; } .switch-holo.switch-light input:checked ~ span span:last-of-type { opacity: 1; } /* Material Theme */ /* switch-light */ .switch-light.switch-material a { top: -3px; width: 28px; height: 28px; border-radius: 50%; background: #fafafa; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 2px 4px 0 rgba(0, 0, 0, 0.12); -webkit-transition: right 0.28s cubic-bezier(0.4, 0, 0.2, 1); -moz-transition: right 0.28s cubic-bezier(0.4, 0, 0.2, 1); transition: right 0.28s cubic-bezier(0.4, 0, 0.2, 1); } .switch-material.switch-light { overflow: visible; } .switch-material.switch-light::after { clear: both; content: ""; display: table; } .switch-material.switch-light > span { overflow: visible; position: relative; top: 3px; width: 52px; height: 24px; min-height: auto; border-radius: 16px; background: rgba(0, 0, 0, 0.26); } .switch-material.switch-light span span { position: absolute; clip: rect(0 0 0 0); } .switch-material.switch-light input:checked ~ span a { right: 0; background: #3f51b5; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } .switch-material.switch-light input:checked ~ span { background: rgba(63, 81, 181, 0.5); } /* switch-toggle */ .switch-toggle.switch-material { overflow: visible; } .switch-toggle.switch-material::after { clear: both; content: ""; display: table; } .switch-toggle.switch-material a { top: 48%; width: 6px !important; height: 6px; margin-left: 4px; background: #3f51b5; border-radius: 100%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: -webkit-transform; -moz-transition: -moz-transform; transition: transform; } .switch-toggle.switch-material label { color: rgba(0, 0, 0, 0.54); font-size: 1em; } .switch-toggle.switch-material label:before { content: ''; position: absolute; top: 48%; left: 0; display: block; width: 14px; height: 14px; border-radius: 100%; border: 2px solid rgba(0, 0, 0, 0.54); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .switch-toggle.switch-material input:checked + label:before { border-color: #3f51b5; } /* ripple */ .switch-light.switch-material > span:before, .switch-light.switch-material > span:after, .switch-toggle.switch-material label:after { content: ''; position: absolute; top: 0; left: 0; z-index: 3; display: block; width: 64px; height: 64px; border-radius: 100%; background: #3f51b5; opacity: .4; margin-left: -20px; margin-top: -20px; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: opacity 0.4s ease-in; -moz-transition: opacity 0.4s ease-in; transition: opacity 0.4s ease-in; } .switch-light.switch-material > span:after { left: auto; right: 0; margin-left: 0; margin-right: -20px; } .switch-toggle.switch-material label:after { width: 52px; height: 52px; margin-top: -12px; } @-webkit-keyframes materialRipple { 0% { -webkit-transform: scale(0); } 20% { -webkit-transform: scale(1); } 100% { opacity: 0; -webkit-transform: scale(1); } } @-moz-keyframes materialRipple { 0% { -moz-transform: scale(0); } 20% { -moz-transform: scale(1); } 100% { opacity: 0; -moz-transform: scale(1); } } @keyframes materialRipple { 0% { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } 20% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { opacity: 0; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .switch-material.switch-light input:not(:checked) ~ span:after, .switch-material.switch-light input:checked ~ span:before, .switch-toggle.switch-material input:checked + label:after { -webkit-animation: materialRipple 0.4s ease-in; -moz-animation: materialRipple 0.4s ease-in; animation: materialRipple 0.4s ease-in; } /* trick to prevent the default checked ripple animation from showing * when the page loads. * the ripples are hidden by default, and shown only when the input is focused. */ .switch-light.switch-material.switch-light input ~ span:before, .switch-light.switch-material.switch-light input ~ span:after, .switch-material.switch-toggle input + label:after { visibility: hidden; } .switch-light.switch-material.switch-light input:focus:checked ~ span:before, .switch-light.switch-material.switch-light input:focus:not(:checked) ~ span:after, .switch-material.switch-toggle input:focus:checked + label:after { visibility: visible; } } /* Bugfix for older Webkit, including mobile Webkit. Adapted from * http://css-tricks.com/webkit-sibling-bug/ */ @media only screen and (-webkit-max-device-pixel-ratio: 2) and (max-device-width: 1280px) { .switch-light, .switch-toggle { -webkit-animation: webkitSiblingBugfix infinite 1s; } } @-webkit-keyframes webkitSiblingBugfix { from { -webkit-transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); } } /*# sourceMappingURL=toggle-switch-px.css.map */ .dki-image-element.dki-authoring-element-element.cssFX, html.flow-authoring .dki-image-element.cssFX{ height: 100%; width: 100%; } /* * Claro.ui.cssFx.styles.THIN() */ .cssFX-Thin div.cssFX-level1{ border : 1px solid #a9a9a9 !important; border-top : 1px solid #f5f5f5 !important; box-shadow : 0px 4px 4px -1px #acacac; background-color: #ffffff; position : absolute; top : 0px; left : 0px; right : 0px; bottom : 0px; } .cssFX-Thin div.cssFX-level1 div.cssFX-level2{ border : none; position : absolute; left : 8px; bottom : 8px; right : 8px; top : 8px; } .cssFX-Thin div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; height:100%; width:100%; } /* * Claro.ui.cssFx.styles.THICK() */ .cssFX-Thick div.cssFX-level1{ border : 1px solid #a9a9a9 !important; border-top : 1px solid #f5f5f5 !important; box-shadow : 0px 4px 4px -1px #acacac; background-color: #ffffff; position : absolute; top : 0px; left : 0px; right : 0px; bottom : 0px } .cssFX-Thick div.cssFX-level1 div.cssFX-level2{ border :none; position : absolute; left : 15px; bottom : 15px; right : 15px; top : 15px; } .cssFX-Thick div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; height:100%; width:100%; } /* * Claro.ui.cssFx.style.POLAROID() */ .cssFX-Polaroid div.cssFX-level1{ border-top : 1px solid #D1CEC7 !important; border-right : 1px solid #5B5C56 !important; border-bottom : 1px solid #87847F !important; border-left : 1px solid #A2A39B !important; box-shadow : 0px 0px 16px 3px #87847F; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Polaroid div.cssFX-level1 div.cssFX-level2{ border-style : solid; border-color : #f1f1f1; border-width : 10px; border-bottom-width: 50px; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Polaroid div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; height:100%; width:100%; } /* * Claro.ui.cssFx.style.BEVEL() */ .cssFX-Bevel div.cssFX-level1{ border-top : 4px solid #D1CEC7 !important; border-right : 4px solid #5B5C56 !important; border-bottom : 4px solid #87847F !important; border-left : 4px solid #A2A39B !important; box-shadow : 0px 0px 16px 3px #87847F; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Bevel div.cssFX-level1 div.cssFX-level2{ background-color: #dbd9cd; border : 2px solid #dbd9cd; border-top-color: #fcf9f2; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Bevel div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ border : none; position : absolute; left : 14px; bottom : 14px; right : 14px; top : 14px; } /* * Claro.ui.cssFx.style.SHADOW() */ .cssFX-Shadow div.cssFX-level1{ border : none; box-shadow : 10px 10px 20px 0px #333; -webkit-box-shadow : 10px 10px 20px 0px #333; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Shadow div.cssFX-level1 div.cssFX-level2{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Shadow div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Shadow div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div img{ } /* * Claro.ui.cssFx.style.ROUNDED() */ .cssFX-Rounded div.cssFX-level1{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Rounded div.cssFX-level1 div.cssFX-level2{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Rounded div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Rounded div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div img{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; behavior : url(../css/PIE.htc) } .cssFX-Circle div.cssFX-level1{ -moz-border-radius : 50%; -webkit-border-radius : 50%; border-radius : 50%; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Circle div.cssFX-level1 div.cssFX-level2{ -moz-border-radius : 50%; -webkit-border-radius : 50%; border-radius : 50%; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Circle div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ -moz-border-radius : 50%; -webkit-border-radius : 50%; border-radius : 50%; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-Circle div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div img{ -moz-border-radius : 50%; -webkit-border-radius : 50%; border-radius : 50%; overflow : hidden; behavior : url(../css/PIE.htc) } /* * Claro.ui.cssFx.style.Reflect() */ .cssFX-Reflect div.cssFX-level1{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } html.flow-authoring .cssFX-Reflect div.cssFX-level1{ display: inline-block; left: auto; right: auto; top: auto; bottom: auto; } .cssFX-Reflect div.cssFX-level1 div.cssFX-level2{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Reflect div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-Reflect div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div.dki-authoring-content-wrapper img.reflected{ position : absolute; left : 0px; top : 0px; right : 0px; height : 70% !important; filter : inherit; } .cssFX-Reflect div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div.dki-authoring-content-wrapper canvas, .cssFX-Reflect div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div.dki-authoring-content-wrapper img{ position : absolute; bottom : 0px; margin : 0px !important; height : 30% !important; width : 100% !important; filter : inherit; } /* * Claro.ui.cssFx.style.ROUNDEDSHADOW() */ .cssFX-RoundedShadow div.cssFX-level1{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; box-shadow : 14px 14px 20px 0px #acacac; -webkit-box-shadow : 14px 14px 20px 0px #acacac; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-RoundedShadow div.cssFX-level1 div.cssFX-level2{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-RoundedShadow div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; behavior : url(../css/PIE.htc) } .cssFX-RoundedShadow div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div img{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; overflow : hidden; behavior : url(../css/PIE.htc) } /* * Claro.ui.cssFx.style.RoundedMirror() */ .cssFX-MirrorRounded div.cssFX-level1{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } html.flow-authoring .cssFX-MirrorRounded div.cssFX-level1{ display: inline-block; left: auto; right: auto; top: auto; bottom: auto; } .cssFX-MirrorRounded div.cssFX-level1 div.cssFX-level2{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-MirrorRounded div.cssFX-level1 div.cssFX-level2 div.cssFX-level3{ position : absolute; left : 0px; bottom : 0px; right : 0px; top : 0px; } .cssFX-MirrorRounded div.dki-authoring-content-wrapper div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 img.reflected{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; filter : inherit; opacity:inherit } .cssFX-MirrorRounded div.dki-authoring-content-wrapper div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div canvas, .cssFX-MirrorRounded div.dki-authoring-content-wrapper div.cssFX-level1 div.cssFX-level2 div.cssFX-level3 div img{ -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; filter : inherit; opacity:inherit } /*letterFX*/ .letterfx{display:inline-block;margin:0;padding:0;transition:all 1s;-ms-transition:all 1s;-webkit-transition:all 1s}.letterfx-spin-before{transform:rotate(3600deg);-ms-transform:rotate(3600deg);-webkit-transform:rotate(3600deg)}.letterfx-spin-after{transform:none}.letterfx-fade-before{opacity:0}.letterfx-grow-before{transform:scale(0,0);-ms-transform:scale(0,0);-webkit-transform:scale(0,0)}.letterfx-grow-after{transform:none}.letterfx-smear-before{color:transparent;text-shadow:-1px -1px 25px transparent}.letterfx-smear-after{color:inherit;text-shadow:0 0 #333}.letterfx-fall-before{visibility:hidden;transform:scale(3,3);-ms-transform:scale(3,3);-webkit-transform:scale(3,3)}.letterfx-fall-after{transform:scale(1,1);-ms-transform:scale(1,1);-webkit-transform:scale(1,1);text-shadow:0}.letterfx-swirl-before{visibility:hidden;transform:scale(3,3) rotate(3600deg);-ms-transform:scale(3,3) rotate(3600deg);-webkit-transform:scale(3,3) rotate(3600deg)}.letterfx-swirl-after{transform:none text-shadow:0}.letterfx-wave-container .letterfx{position:relative}.letterfx-wave-before{bottom:0}.letterfx-wave-after{bottom:15px}.letterfx-fly-left-container .letterfx,.letterfx-fly-right-container .letterfx,.letterfx-fly-top-container .letterfx,.letterfx-fly-bottom-container .letterfx{position:relative}.letterfx-fly-left-before{left:-50em}.letterfx-fly-left-after{left:0}.letterfx-fly-right-before{right:-50em}.letterfx-fly-right-after{right:0}.letterfx-fly-top-before{top:-20em}.letterfx-fly-top-after{top:0}.letterfx-fly-bottom-before{bottom:-20em}.letterfx-fly-bottom-after{bottom:0}#contentFrame { } html.csstransitions .dkiContentFrame { -moz-opacity:1.0; opacity:1.0; filter:alpha(opacity=100); -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -ms-transition-duration: 0.5s; transtion-duration: 0.5s; -webkit-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; -ms-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; } html.csstransitions .dkiContentFrame.none{ -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -o-transition-duration: 0s; -ms-transition-duration: 0s; transtion-duration: 0s; } .dkiContentFrame.current{ z-index:0; visibility: visible; } .dkiContentFrame.previous.dk-hidden, .dkiContentFrame.next.dk-hidden { z-index:-1; } .dkiContentFrame.previous.fade, .dkiContentFrame.next.fade { -moz-opacity:0.0; opacity:0.0; filter:alpha(opacity=0); } html.csstransforms3d .dkiContentFrame.previous.slide { -webkit-transform: translate3d(-100%, 0px, 0px); -moz-transform: translate3d(-100%, 0px, 0px); -o-transform: translateX(-100%); -ms-transform: translate3d(-100%, 0px, 0px); transform: translate3d(-100%, 0px, 0px); } html.no-csstransforms3d .dkiContentFrame.previous.slide { -webkit-transform: translateX(-1200px); -moz-transform: translateX(-1200px); -o-transform: translateX(-1200px); -ms-transform: translateX(-1200px); transform: translateX(-1200px); } html.csstransforms3d .dkiContentFrame.next.slide { -webkit-transform: translate3d(100%, 0px, 0px); -moz-transform: translate3d(100%, 0px, 0px); -o-transform: translateX(100%); -ms-transform: translate3d(100%, 0px, 0px); transform: translate3d(100%, 0px, 0px); } html.no-csstransforms3d .dkiContentFrame.next.slide { -webkit-transform: translateX(1200px); -moz-transform: translateX(1200px); -o-transform: translateX(1200px); -ms-transform: translateX(1200px); transform: translateX(1200px); } .dkiContentFrame.none, #contentFrame.forward .dkiContentFrame.next, #contentFrame.back .dkiContentFrame.previous, #contentFrame.loading .dkiContentFrame { -webkit-transition-property: none; -moz-transition-property: none; -o-transition-property: none; -ms-transition-property: none; transition-property: none; } .dkiContentFrame.none.previous, .dkiContentFrame.none.next { left: -200%; top: -200%; visibility: hidden; } .dkiContentFrame.slide, .dkiContentFrame.flip, .dkiContentFrame.pop { -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; } .dkiContentFrame.fade { -webkit-transition-property: opacity; -moz-transition-property: opacity; -o-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } .dkiContentFrame.slide.fade, .dkiContentFrame.flip.fade, .dkiContentFrame.pop.fade { -webkit-transition-property: opacity, -webkit-transform; -moz-transition-property: opacity, -moz-transform; -o-transition-property: opacity, -o-transform; -ms-transition-property: opacity, -ms-transform; transition-property: opacity, transform; -webkit-transition-duration: 0.25s, 0.5s; -moz-transition-duration: 0.25s, 0.5s; -o-transition-duration: 0.25s, 0.5s; -ms-transition-duration: 0.25s, 0.5s; transition-duration: 0.25s, 0.5s; } html.csstransforms3d .dkiContentFrame.previous.flip { -webkit-transform: rotateY(-90deg); -moz-transform: rotateY(-90deg); -o-transform: rotateY(-90deg); -ms-transform: rotateY(-90deg); transform: rotateY(-90deg); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; } html.no-csstransforms3d .dkiContentFrame.previous.flip { -webkit-transform: translateX(-1200px); -moz-transform: translateX(-1200px); -o-transform: translateX(-1200px); -ms-transform: translateX(-1200px); transform: translateX(-1200px); } html.csstransforms3d .dkiContentFrame.next.flip { -webkit-transform: rotateY(90deg); -moz-transform: rotateY(90deg); -o-transform: rotateY(90deg); -ms-transform: rotateY(90deg); transform: rotateY(90deg); } html.no-csstransforms3d .dkiContentFrame.next.flip { -webkit-transform: translateX(1200px); -moz-transform: translateX(1200px); -o-transform: translateX(1200px); -ms-transform: translateX(1200px); transform: translateX(1200px); } .dkiContentFrame.previous.pop, .dkiContentFrame.next.pop { -webkit-transform: scale(0.1); -moz-transform: scale(0.1); -o-transform: scale(0.1); -ms-transform: scale(0.1); transform: scale(0.1); } @-webkit-keyframes flipInH { from { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); z-index: 0; } to { -webkit-transform: rotateY(0); transform: rotateY(0); z-index: 2; } } @keyframes flipInH { from { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); z-index: 0; } to { -webkit-transform: rotateY(0); transform: rotateY(0); z-index: 2; } } .flipInH { -webkit-backface-visibility: hidden !important; backface-visibility: hidden !important; animation: flipInH; -webkit-animation: flipInH; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; } @-webkit-keyframes flipOutH { from { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); z-index: 2; } to { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); z-index: 0; } } @keyframes flipOutH { from { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); z-index: 2; } to { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); z-index: 0; } } .flipOutH { -webkit-backface-visibility: hidden !important; backface-visibility: hidden !important; animation: flipOutH; -webkit-animation: flipOutH; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; } @keyframes flipInV { from { -webkit-transform: rotateX(-180deg); transform: rotateX(-180deg); z-index: 0; } to { -webkit-transform: rotateX(0); transform: rotateX(0); z-index: 2; } } @-webkit-keyframes flipInV { from { transform: rotateX(-180deg); -webkit-transform: rotateX(-180deg); z-index: 0; } to { transform: rotateX(0); -webkit-transform: rotateX(0); z-index: 2; } } .flipInV { -webkit-backface-visibility: hidden !important; backface-visibility: hidden !important; animation: flipInV; -webkit-animation: flipInV; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; } @keyframes flipOutV{ from { -webkit-transform: rotateX(0deg); transform: rotateX(0deg); z-index: 2; } to { -webkit-transform: rotateX(180deg); transform: rotateX(180deg); z-index: 0; } } @-webkit-keyframes flipOutV{ from { transform: rotateX(0deg); -webkit-transform: rotateX(0deg); z-index: 2; } to { transform: rotateX(180deg); -webkit-transform: rotateX(180deg); z-index: 0; } } .flipOutV { -webkit-backface-visibility: hidden !important; backface-visibility: hidden !important; animation: flipOutV; -webkit-animation: flipOutV; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; } .dki-flipCard-element .bounceInDown { z-index:2 !important; } .dki-flipCard-element .zoomOutUp { z-index:-1 !important; } /*siloed to flipcards*/ .dki-flipCard-element .owl-stage{ perspective: 2000px; } @keyframes textEffect_typeIn{ from { visibility: hidden; } to { visibility: visible; } } @-webkit-keyframes textEffect_typeIn{ from { visibility: hidden; } to { visibility: visible; } } .textEffect_typeIn { animation: textEffect_typeIn; -webkit-animation: textEffect_typeIn; } .textEffect_typeIn:after{ content: ""; display: inline; border-right: 1px solid black; animation: fadeOut; -webkit-animation: fadeOut; animation-timing-function: ease-out; }#contentFrame{ position: relative; } .dkiContentFrame { position:absolute; width:100%; top:0px; bottom:0px; overflow: hidden; } .disabled, .disabled-element { -moz-opacity:0.5; opacity:0.5; filter:alpha(opacity=50); cursor: default !important; } .disablerWrapper, .disabler { display: none; z-index: 99; position:absolute; top:0px; left:0px; right:0px; bottom: 0px; cursor:pointer; } .previewLoader{ position: fixed; } .disabler, .previewLoader{ opacity:0.90; moz-opacity:0.90; filter:alpha(opacity=90); background-color: #000; } .disabler-play { width:100px; height:100px; background-image: url("../images/disabler-play.png"); background-repeat: no-repeat; position:absolute; left:50%; margin-left:-50px; cursor:pointer; } .disabler:hover .disabler-play{ background-position:0 -100px; } .disabler.spinner{ background-image: url("../images/ajax-loader.gif"); background-position: center center; background-repeat: no-repeat; } html.csstransforms .disabler.spinner{ background-image:none; content: " "; position: absolute; margin: 0 auto; left: 0; top: 40%; top: calc(45% - 30px); bottom: 0; right: 0; width: 7px; height: 7px; border-radius: 100%; box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); -o-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); -ms-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); -webkit-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);\ -moz-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); animation: cssload-spin ease infinite 4.6s; -o-animation: cssload-spin ease infinite 4.6s; -ms-animation: cssload-spin ease infinite 4.6s; -webkit-animation: cssload-spin ease infinite 4.6s; -moz-animation: cssload-spin ease infinite 4.6s; } @keyframes cssload-spin { 0%, 100% { box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); } 25% { box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73); } 50% { box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223); } 75% { box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49; } } @-o-keyframes cssload-spin { 0%, 100% { box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); } 25% { box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73); } 50% { box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223); } 75% { box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49; } } @-ms-keyframes cssload-spin { 0%, 100% { box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); } 25% { box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73); } 50% { box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223); } 75% { box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49; } } @-webkit-keyframes cssload-spin { 0%, 100% { box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); } 25% { box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73); } 50% { box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223); } 75% { box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49; } } @-moz-keyframes cssload-spin { 0%, 100% { box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223); } 25% { box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73); } 50% { box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223); } 75% { box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49; } } .disabler.previewLoader{ background-position: 50% 36%; } .disablerMessage{ position:absolute; top:45%; margin-top:-12px; color:white; text-align:center; width:100%; font-size: 24px; z-index: 100; } .bgRepeater { position: relative; } #skipToContent, #skipToNavigation{ width: 0px !important; height: 0px !important; } #skipToContent{ float: left; } #skipToNavigation{ float: right; } /*Banner custom player styles */ .dki-banner { border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; z-index: 100; } html.csstransitions .dki-banner.noTransition{ -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .dki-banner-header { background: #0a5ba0; text-shadow: none; cursor:move; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .dki-banner-notificationArea { background-color:transparent; } .dki-banner-notificationArea.rounded { border-radius: 0px; } .dki-banner-notice { padding: 5px 0px; margin: 5px 0px; } #eventLoggerContainer .dki-banner-notice{ margin: 0; } #eventLoggerContainer .dki-banner-notice-title { margin-bottom:0px; } .dki-banner-notice .timestamp { float:right; } .dki-banner-notice-message { word-break: break-word; } .dki-banner-notice-wrapper { border: 0px; margin:0px; } .dki-banner-notice.info{ background-color: rgb(120, 197, 231); border: 1px solid rgb(59, 173, 214); } .dki-banner-notice.info *{ color: #FFF; } .dki-banner-notice.info .dki-banner-evMessage:hover{ background-color:rgb(59, 173, 214); } .dki-banner-notice.info .dki-banner-evMessage { border-bottom: 1px solid rgb(59, 173, 214); } .dki-banner-notice.warning { background-color: rgb(255, 234, 168); border :1px solid rgb(255, 194, 55); } .dki-banner-notice.warning *{ color: rgb(130, 98, 0); } .dki-banner-notice.warning .dki-banner-evMessage { border-bottom: 1px solid rgb(255, 194, 55); } .dki-banner-header.yellow { background: rgb(255, 234, 168); color: rgb(130, 98, 0); } .dki-banner-header .currDate { display:inline-block; float: left; font-weight: bold; } .console-wrapper .fa{ padding: 10px; } .console-wrapper { position:fixed; top: 0px; width: 140px; left: 50%; margin-left : -70px; background: #0a5ba0; color: #FFF; font-weight:bold; text-align:center; cursor: pointer; font-size: 12px; padding-left: 10px; } .dki-banner, .console-wrapper{ z-index: 5000 !important; } .headerPage,.footerPage { position:relative; /*Adding position relative to header and footer pages to anchor the absolutely positioned page background div to their layer*/ } .fancybox-close { position: absolute; top: 0; left: 0; width: 36px; height: 36px; cursor: pointer; z-index: 99995; background-image: url(../images/fancybox_sprite.png); } /* This file contains the base styling for content of a course. Included in authoring */ /* Base Line Styles*/ body.noscroll { overflow: hidden; } body.not-responsive .bgRepeater{ max-height: 600px !important; margin: auto; } audio.dki-media-control { background-color:#333; background-image:url(../images/control_play.png); background-repeat:no-repeat; background-position:5px center; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; display:block; height:20px; opacity:0.7; filter: alpha(opacity = 70); } audio.dki-media-control.playing { background-image:url(../images/control_pause.png); } /* Content wrappers */ .pageElementsWrapper { position: absolute; width: 100%; height: 100%; } .pageContentWrapper{ } .page-standAlone{ height: 100%; overflow:auto; position:relative; z-index:1; } .dki-audio-element.hiddenNarration[data-narration='1']{ width: 0px !important; height: 0px !important; opacity: 0 !important; } .zoomedWrapper{ position: absolute; top: 0px; left: 0px; } /* Text Elements */ html.enableTextHighlight .dki-element-text{ user-select: text; } .nav-stacked .dki-tab-element .dki-element-content, .nav-stacked .dki-panelHeader-element .dki-element-content, .nav-stacked .dki-panelFooter-element .dki-element-content{ white-space: normal; } .dki-authoring-element[data-isrichtext='true'] .dki-element-content img, .dki-authoring-element-element[data-isrichtext='true'] .dki-element-content img{ width: initial; display: inline; } .dki-text-style-bold{ font-weight: bold; } .dki-text-style-italic{ font-style: italic; } .dki-text-style-underline{ text-decoration: underline; } .dki-text-style-strike{ text-decoration: line-through; } .dki-inline-text-variable-name{ display: none; } .dki-tabset-element .panel-heading { padding: 0; } .dki-tabset-element .panel-heading .panel-title>a { padding: 10px 15px; } .dki-glossary-link, .dki-text-tooltip{ text-decoration: underline; cursor: pointer; color:inherit; position: relative; } html .on-device .dki-glossary-link:after, html .on-device .dki-text-tooltip:after{ content: ''; position: absolute; top: -2px; left: -5px; right: -5px; bottom: -2px; background-image: url(../images/transparent.gif); background-repeat: repeat; } .dki-citation-link sup.refSup{ cursor: pointer; } .dki-htm-element .dki-element-content{ min-height: 1em; } .dki-authoring-element.dki-htm-element .dki-authoring-content-wrapper .dki-element-content { word-wrap: break-word; word-break: normal; } .dki-authoring-element[data-isrichtext="true"] .dki-element-content img, .cke_editable img { max-width: 100%; box-sizing: border-box; border-width: 0px; border-style: solid; padding: 5px; } .cke_dialog_contents_body .ImagePreviewBox img{ height: auto !important; } .dki-htm-element sup, .dki-table-element sup{ font-size : 0.6em; position: relative; top: -0.3em; vertical-align: top; backface-visibility: unset !important; } .dki-htm-element sub, .dki-table-element sub{ font-size : 0.6em; position: relative; top: 0.3em; vertical-align: bottom; backface-visibility: unset !important; } .dki-htm-element *{ line-height: inherit; } .dki-justify-left{ text-align: left !important; } .dki-justify-right{ text-align: right !important; } .dki-justify-center{ text-align: center !important; } .dki-justify-block{ text-align: justify !important; } .dki-table-element table{ margin-bottom: 0px; } .dki-font-family-arial{ font-family: Arial,'DejaVu Sans','Liberation Sans',Freesans,sans-serif !important; } .dki-font-family-arial-narrow{ font-family: 'Arial Narrow', 'Arial', 'Nimbus Sans L', sans-serif !important; font-stretch: condensed; } .dki-font-family-arial-black{ font-family: 'Arial Black',Gadget,sans-serif !important; font-weight: 900; } .dki-font-family-bookman{ font-family: Bookman,'Bookman Old Style','URW Bookman L','Palatino Linotype',serif !important; } .dki-font-family-bookman-old-style{ font-family: 'Bookman Old Style',Bookman,'URW Bookman L','Palatino Linotype',serif !important; } .dki-font-family-century-gothic{ font-family: 'Century Gothic',futura,'URW Gothic L',Verdana,sans-serif !important; } .dki-font-family-console{ font-family: Consolas,'Lucida Console','DejaVu Sans Mono',monospace !important; } .dki-font-family-comic-sans-ms{ font-family: 'Comic Sans MS', cursive !important; } .dki-font-family-courier{ font-family: Courier,'Courier New','Nimbus Mono L',monospace !important; } .dki-font-family-courier-new{ font-family: 'Courier New',Courier,'Nimbus Mono L',monospace !important; } .dki-font-family-georgia{ font-family: Georgia,Constantia,'Nimbus Roman No9 L',serif !important; } .dki-font-family-helvetica{ font-family: Helvetica,Arial,'DejaVu Sans','Liberation Sans',Freesans,sans-serif !important; } .dki-font-family-impact{ font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif !important; } .dki-font-family-lucida-console{ font-family: 'Lucida Console',Consolas,'DejaVu Sans Mono',monospace !important; } .dki-font-family-lucida-sans-unicode{ font-family: 'Lucida Sans Unicode','Lucida Grande','Lucida Sans','DejaVu Sans Condensed',sans-serif !important; } .dki-font-family-palatino-linotype{ font-family: 'Palatino Linotype',Cambria,'Book Antiqua','URW Palladio L',serif !important; } .dki-font-family-tahoma{ font-family: 'Tahoma',sans-serif !important; } .dki-font-family-times-new-roman{ font-family: 'Times New Roman',Cambria,'Nimbus Roman No9 L','Freeserif',Times,serif !important; } .dki-font-family-trebuchet-ms{ font-family: 'Trebuchet MS',sans-serif !important; } .dki-font-family-verdana{ font-family: Verdana,Geneva,'DejaVu Sans',sans-serif !important; } .dki-indent-1{ margin-left: 40px; } .dki-indent-2{ margin-left: 80px; } .dki-indent-3{ margin-left: 120px; } .dki-indent-4{ margin-left: 160px; } .dki-indent-5{ margin-left: 200px; } /* All Elements */ body.not-responsive .dki-authoring-group{ position: absolute; box-sizing: border-box; width:1px; /*can't reliably detect if the group is visible without giving it a height or width*/ left: 0; /*for rtl languages, to ensure everything places properly*/ top: 0px; } html.document-mode .dki-authoring-group{ width: auto; height: auto; left: auto; } .dki-authoring-group.hiddenOnLoad, .dki-authoring-element.hiddenOnLoad, .dki-authoring-element-element.hiddenOnLoad, .dki-authoring-group.hidden, .dki-authoring-element.hidden, .dki-authoring-element-element.hidden{ display: none; } .dki-authoring-element.hiddenUntilInView, .dki-authoring-element-element.hiddenUntilInView{ opacity: 0; display: initial; visibility: initial; } iframe.dki-element-content{ box-sizing: border-box; } .dki-element-anchor{ position:absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; } *:focus { outline: 0; } /* testing taborder stuff. *:focus { outline: 1px auto #c6defd !important; } *:focus { background-color: #F1CA7F; z-index: 5; opacity: 0.5; } *:focus:before{ content: "focus is here"; background-color: yellow; position: absolute; z-index: 100000; top: 0; left: 0; } */ #contentFrame .dkiContentFrame.dk-hidden *[tabindex], #contentFrame .dkiContentFrame.dk-hidden a, #contentFrame .pageElementsWrapper.design a, #contentFrame .pageElementsWrapper.design *[tabindex], #contentFrame .dkiContentFrame.dk-hidden video, #contentFrame .dkiContentFrame.dk-hidden audio, #contentFrame .dkiContentFrame.dk-hidden iframe{ visibility: hidden; } #contentFrame .dkiContentFrame.current *[tabindex], #contentFrame .dkiContentFrame.current a{ visibility: inherit; } .pageElementsWrapper>.dki-authoring-row, .pageElementsWrapper>.dki-authoring-section, .pageElementsWrapper .dki-authoring-section>.dki-authoring-row, .pageElementsWrapper .dki-authoring-element, .pageElementsWrapper .dki-authoring-element-element{ padding-left: 0px; padding-right: 0px; } .dki-image-element img.masked{ visibility: hidden !important; position: relative; } .dki-image-element .svgMask{ position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; } .dki-label-element { box-sizing:initial; } .dki-authoring-element-element.dki-speechBubble-element .dki-element-content{ box-sizing:border-box; margin: 0 !important; } .dki-authoring-element-elements-wrapper > .dki-authoring-element-element{ padding: 0px !important; position:absolute; } .dki-authoring-element.dki-element-highlighted{ outline: 2px dashed red; display: block !important; } .dki-htm-element .dki-text-highlight, .dki-table-element .dki-text-highlight{ background-color: yellow; } .dki-hotspot-element .dki-element-content{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .dki-hotspot-element{ background-image: url(../images/transparent.gif); background-repeat: repeat; } .dki-shape-element{ background-image: url(../images/transparent.gif); background-repeat: repeat; } /* Image Maps */ .dki-authoring-element area{ cursor: pointer; } .dki-authoring-content-wrapper{ box-sizing: border-box; } .dki-progress-element .dki-authoring-content-wrapper{ z-index:1; position:relative; } .dki-instructionalText-element{ box-sizing: border-box; background-color: #000; opacity: 0.9; border-radius: 4px; color: white; } .dki-instructionalText-element .dki-authoring-content-wrapper{ padding: 5px !important; padding-top: 10px !important; } .scene-mouse-pointer{ width: 32px; height: 32px; background-image: url(../images/mousePointer.png); position: absolute; top: -50px; left: -50px; display: none; z-index: 10000; } .dki-hotspot-element{ cursor: pointer; } /* End for PPT Import */ .dki-placeholder-element{ display: none; height:0; min-height:0 !important; } .dki-media-placeholder:before { display: block; position: absolute; top: 40%; left: 0px; right: 0px; padding: 2px 0px; text-align: center; color: #FFF; background-color: #000; opacity: 0.9; filter: alpha(opacity = 90); } html.flow-authoring .dki-media-placholder { background-color: transparent; } .dki-media-placeholder { background-image: url(../images/control_play.png); background-repeat: no-repeat; background-position: 5px center; background-size: contain; background-color:rgba(204, 204, 204, 0.6); position: relative; } html.flow-authoring .dki-media-placholder { background-color: transparent; } .dki-media-placeholder.hasPoster { opacity: 1.0; filter: alpha(opacity = 100); } .dki-html-element.bordered .dki-authoring-content-wrapper{ border: 1px solid black; box-sizing: border-box; } .dki-html-element.bordered .dki-authoring-content-wrapper{ border: 1px solid black; box-sizing: border-box; } .dki-element-overlay { position:absolute; top:0; left:0; z-index:2; background-image: url(../images/transparent.gif); background-repeat: repeat; } /* Test Questions */ .submitButton, .questionScoreDisplay { display: none; position: fixed; right:10px; bottom:0px; z-index:1; } html.rtl .submitButton { right: auto; left: 10px; } .submitButton { cursor: pointer; } .questionScoreDisplay{ height: 30px; overflow: visible; } .feedbackWrapper { -webkit-transition-property: opacity, -webkit-transform; -moz-transition-property: opacity, -moz-transform; -o-transition-property: opacity, -o-transform; -ms-transition-property: opacity, -ms-transform; transition-property: opacity, transform; -webkit-transition-duration: 0.25s, 0.5s; -moz-transition-duration: 0.25s, 0.5s; -o-transition-duration: 0.25s, 0.5s; -ms-transition-duration: 0.25s, 0.5s; transition-duration: 0.25s, 0.5s; position:absolute; z-index:1; max-height: 580px; min-height: 120px; width: 420px; left: 50%; margin-left: -210px; } body.phone .feedbackWrapper{ width: 280px; max-height: 380px; margin-left: -140px; } .questionFeedback{ max-height: 520px; max-width: 950px; min-height: 80px; } .feedbackWrapper.dragging { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .feedbackWrapper.hidden { z-index: 0; display: none; } .feedbackClose{ background-repeat: no-repeat; } .panel_header, .panel_header table { width:100%; } .panel_mid, .panel_mid table { width:100%; } .panel_footer, .panel_footer table { width:100%; } .questionFeedback { display:none; } /* Elements can have padding and margin set to them by the toolbox. We need to override them for this functionality to work */ html.legacy .correct { padding-left: 21px; margin-left: -21px; background-image: url(../images/correct.png); background-repeat: no-repeat; } html.legacy .incorrect { padding-left: 21px; margin-left: -21px; background-image: url(../images/incorrect.png); background-repeat: no-repeat; } html.legacy .multiChoiceCorrectResponse { padding-left: 21px; border: 2px solid green; margin-left: -21px; box-sizing: border-box; } .optionNumber{ display: inline-block; min-width: 20px; font-weight: normal; margin-right:5px; } .dki-multiChoiceOption-element input, .dki-trueFalseOption-element input{ margin-right: 5px; vertical-align: middle; } .dki-multiChoiceOption-element label.form-control{ height: auto; } .dki-multiChoice-selector, .dki-trueFalse-selector { height:100%; width:100%; position: absolute; z-index: 3; cursor: pointer; background-image: url('../images/transparent.gif'); } .dki-multiChoiceOption-element, .dki-trueFalseOption-element{ background-image: url(../images/transparent.gif); } .dki-freeFormOption-element textarea{ color: #000; resize: none; } .dki-authoring-element[data-is-draggable=true]{ cursor: move; } .dki-multiPulldownOption-element .contentWrapper { width: 100%; box-sizing: border-box; padding-left: 25px; position: absolute; top: 0; left: 0; } html.rtl .dki-multiPulldownOption-element .contentWrapper { padding-left: 0; padding-right: 25px; } .dki-authoring-row{ clear: both; } .dki-authoring-row .dki-multiPulldownOption-element .contentWrapper { padding-right: 15px; } .dki-multiPulldownOption-element select.content { width: 100%; } #pageElementsWrapper{ visibility: hidden; } option.content, select.content, input.content { color:#000; } .dki-textbox-element textarea{ resize: none; } .dki-question-option select, .dki-question-option textarea, .dki-question-option input[type="text"] { font-family: inherit; } .dki-authoring-element-elements-wrapper{ z-index: 3; position: absolute; top:0; left:0%; } body.responsive .dki-authoring-element-elements-wrapper{ display:none; } /* Lightbox styles */ .fancybox-title-inside-wrap{ font-size: 1.2em; font-weight: bold; border-bottom: 1px solid #333; padding-top: 0px; margin-bottom: 5px; } .popup-content{ padding: 5px; } .fancybox-lock .fancybox-overlay{ overflow-y: auto; -webkit-overflow-scrolling: auto; } .fancybox-inner .dki-video-element{ overflow: hidden; /* prevent scroll bars from appearing while loading videos in a lightbox */ } .fancybox-nav { width: 60px; } .fancybox-nav span { visibility: visible; opacity: 0.5; } .fancybox-nav:hover span { opacity: 1; } /*Make sure the controls are always visible for accessibility purposes*/ .fancybox-toolbar { visibility: visible !important; opacity: 1 !important; } html.on-device .windowContainer div.panel:before, html.on-device .viewContainer div.panel:before, html.on-device .browserList:before, html.on-device .fancybox-lock .fancybox-overlay:before{ content: ''; display: block; min-height: 101%; width: 1px; float: left; margin-left: -1px; } .dki-inline-variable-name:before{ content: "{{"; } .dki-inline-variable-name:after{ content: "}}"; } html.coursePlayer .dki-inline-variable-name{ display: none !important; } html.authoring-tool .dki-inline-variable-name, html.singlePage .dki-inline-variable-name{ display: inline !important; } .tabset-add { display:none !important; } .dki_heading_red_exclaimed{ color:red; text-decoration:none; text-align:left; font-weight:bold; } .dki_heading_red_exclaimed:after{ content:''; display:inline; } .dki_heading_red_exclaimed i{ color:blue; font-size:2em; } .dki_big_round_red{ color:#ffffff; background-color:#ff0000; border-radius:50%; } .dki_big_flat_blue{ color:#ffffff; background-color:#0b5396; border-radius:0; border-color:#093C6B; border-style:solid; border-width:2px; } /* Window Clases */ .windowContainer, .viewContainer { background-color: #F3F3F3; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; color: #6B6B6B; border: 1px solid #BBB; overflow:hidden; position: absolute; top: 43px; z-index:5; box-shadow: 10px 10px 15px -5px #333; -webkit-box-shadow: 10px 10px 15px -5px #333; -moz-box-shadow: 10px 10px 15px -5px #333; display: none; height: 500px; width:800px; } html.position-fixed .windowContainer, html.position-fixed .viewContainer { position:fixed; } /* Case 48021 - If a course is no nav, our windows should have top 0, otherwise they need to show up under the top nav bar*/ html.noNav .windowContainer, html.noNav .viewContainer { top: 0px; } .windowContainer div.browserHeader, .viewContainer div.browserHeader { border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-right-radius: 3px; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; background-image: url(../images/headerBar_slice.png); background-repeat: repeat-x; background-position: top left; height: 23px; width: 100%; } .windowContainer span.headerTitle, .viewContainer span.headerTitle, .windowContainer span.browserTitle, .viewContainer span.browserTitle { color: white; margin-left: 10px; line-height: 23px; font-size: 17px; float:left; } .rtl .windowContainer span.headerTitle, .rtl .viewContainer span.headerTitle, .rtl .windowContainer span.browserTitle, .rtl .viewContainer span.browserTitle { float:right; margin-right: 10px; } .windowContainer div.searchContainer div.searchIcon, .viewContainer div.searchContainer div.searchIcon { float:left; vertical-align:middle; width: 20px; height: 100%; background-image: url(../images/searchButton.png); background-repeat: no-repeat; background-position: center center; margin-right: 5px; } .windowContainer input.searchInput, .viewContainer input.searchInput { font-size: 20px; border: none; background-color:inherit; color: #333; width: 100%; height: 23px; } .windowContainer div.sectionBreak, .viewContainer div.sectionBreak { border-top: 1px solid #AAA; width: 510px !important; clear:both; margin: 0px; } .windowContainer div.panel, .viewContainer div.panel { background-color: inherit; float: left; height: 97%; line-height: 20px; padding: 0px 10px; overflow: auto; -webkit-overflow-scrolling: auto; } .browserList { overflow: auto; -webkit-overflow-scrolling: auto; left:10px; width: 201px; border-right: 1px solid #C1C1C1; } .browserList li.selected { background-color:#D1DEF3; } .browserList li a:link { color:#6B6B6B; text-decoration: none; } .browserList li a:visited { color:#D1DEF3; } .browserContentContainer { width:100%; height: auto; position:absolute; top:24px; bottom:3px; } .windowContainer div.browserList ul, .windowContainer div.browserList li, .viewContainer div.browserList ul, .viewContainer div.browserList li{ list-style-type: none; cursor: default; } .windowContainer div.browserList ul.subList, .viewContainer div.browserList ul.subList { margin-top: 5px; margin-left: 0px; border-top: 1px solid #AAA; } .windowContainer div.browserList li span.icon, .viewContainer div.browserList li span.icon { background-image: url(../images/assetmanager_sprites.png); background-repeat: no-repeat; width:16px; height:16px; display:inline-block; vertical-align:bottom; margin-right: 5px; } .windowContainer div.browserList li span.linkIcon, .viewContainer div.browserList li span.linkIcon { width:16px; height:16px; display:block; background-image: url(../images/elementLink.png); background-repeat:no-repeat; background-position: 1px 9px; } .windowContainer ul.resultList, .windowContainer ul.resultList li, .viewContainer ul.resultList, .viewContainer ul.resultList li{ margin-left: 0px; font-weight: bold; } .windowContainer ul.resultList ul li, .viewContainer ul.resultList ul li { padding: 2px 0px 2px 0px; cursor:pointer; margin: 5px 0px 5px 15px; list-style-type : none; } .windowContainer li.subItem, .viewContainer li.subItem { font-weight: normal; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 165px; line-height:18px; } .windowContainer div.panel.details, .viewContainer div.panel.details { width: 550px; visibility: hidden; } .windowContainer div.detailsContent div.assetProperties a, .viewContainer div.detailsContent div.assetProperties a { color: #333; } .windowContainer div.detailsContent.border, .viewContainer div.detailsContent.border { border: 1px solid #AAA; } .windowContainer div.assetProperties, .viewContainer div.assetProperties { background-color:#CCC; padding: 5px 5px 5px 5px; } .windowContainer div.largeIco, .viewContainer div.largeIco { margin: 0 auto; width: 100px; height: 100px; background-size: contain; background-repeat: no-repeat; } .windowContainer div.searchDetails, .viewContainer div.searchDetails { padding: 10px; } .windowContainer div.searchContainer, .viewContainer div.searchContairen { margin-bottom:10px; margin-right: 5px; border:none; } .windowContainer div.backButton, .viewContainer div.backButton { -webkit-border-radius: 3px; background-image: url(../images/headerBar_slice.png); background-repeat: repeat-x; background-position: top left; display:none; color: white; font-size: 16px; padding: 4px 15px; margin: 6px 9px 0px 5px; float:right; cursor:pointer; } .windowContainer div.largeIco.elements, .viewContainer div.largeIco.elements { background-image: url(../images/search/elementsThumb.png); } .windowContainer div.largeIco.pages, .viewContainer div.largeIco.pages { background-image: url(../images/search/pageThumb.png); } .windowContainer div.largeIco.objects, .viewContainer div.largeIco.objects { background-image: url(../images/search/LOThumb.png); } .windowContainer div.largeIco.modules, .viewContainer div.largeIco.modules { background-image: url(../images/search/moduleThumb.png); } .windowContainer div.largeIco.course, .viewContainer div.largeIco.course { background-image: url(../images/search/courseThumb.png); } .windowContainer div.largeIco.glossaries, .viewContainer div.largeIco.glossaries { background-image: url(../images/search/glossaryThumb.png); } .windowContainer div.largeIco.references, .windowContainer div.largeIco.citations, .viewContainer div.largeIco.references, .viewContainer div.largeIco.citations { background-image: url(../images/search/referenceThumb.png); } .windowContainer div.largeIco.labels, .viewContainer div.largeIco.labels { background-image: url(../images/search/imageLabelThumb.png); } .windowContainer ul.resultList li.link span.linkIcon, .viewContainer ul.resultList li.link span.linkIcon { display: inline-block; } .windowContainer ul.resultList li span.icon.link, .viewContainer ul.resultList li span.icon.link { background-position:0px 0px; } .windowContainer ul.resultList li span.icon.image, .viewContainer ul.resultList li span.icon.image { background-position:0px -96px; } .windowContainer ul.resultList li span.icon.flash, .viewContainer ul.resultList li span.icon.flash { background-position:0px -48px; } .windowContainer ul.resultList li span.icon.video, .viewContainer ul.resultList li span.icon.video { background-position:0px -64px; } .windowContainer ul.resultList li span.icon.audio, .viewContainer ul.resultList li span.icon.audio { background-position:0px -80px; } .windowContainer ul.resultList li span.icon.document, .viewContainer ul.resultList li span.icon.document { background-position:0px -32px; } .windowContainer ul.resultList li span.icon.html, .viewContainer ul.resultList li span.icon.html { background-position:0px -112px ; } /* Window Phone Styles */ .phone div.windowContainer, .phone div.viewContainer { height: 440px; margin-left: 15px; } .phone div.detailsContent { width: 100%; } .phone div.browserList { border: none; } .phone div.windowContainer div.searchContainer, .phone div.viewContainer div.searchContainer { padding: 6px 0px 0px 10px; } .dki-sticky-group{ z-index: 5000; } .section-decoration{ display: none; z-index: 1; height: 60px; position: absolute; left: 0; right: 0; } .dki-authoring-section.has-top-decoration:first-child{ margin-top: 60px; } .dki-authoring-section.has-bottom-decoration:last-child{ margin-bottom: 60px; } .dki-authoring-section.has-top-decoration .section-decoration.top{ display: block; z-index: 0; top: -60px; } .dki-authoring-section.has-bottom-decoration .section-decoration.bottom{ display: block; bottom: -60px; } .dki-authoring-section.before-decoration.has-bottom-decoration .section-decoration.bottom{ z-index: 0; } .dki-authoring-section.after-decoration.has-top-decoration{ padding-top: 0px; } .before-decoration{ padding-bottom: 60px; } .after-decoration{ padding-top: 60px; } .bg-parallax, .bg-parallaxer, .bg-parallaxest{ background-attachment: scroll !important; } .dki-authoring-section.dki-bg-attach-fixed .dki-authoring-section-fixed-background{ display: none; } html.on-device .dki-authoring-section.dki-bg-attach-fixed{ background-image: none !important; } html.on-device .dki-authoring-section.dki-bg-attach-fixed .dki-authoring-section-fixed-background{ display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; clip: rect(0,auto,auto,0); } html.on-device .dki-authoring-section.dki-bg-attach-fixed .dki-authoring-section-fixed-background picture{ display: block; position: fixed; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; } html.on-device .dki-authoring-section.dki-bg-attach-fixed .dki-authoring-section-fixed-background picture img{ object-fit: cover; width: 100%; height: 100%; } @keyframes bg-vertical-motion { from { background-position-y: 0px; } to { background-position-y: -1000%; } } .bg-vertical-motion{ background-repeat: repeat !important; animation: bg-vertical-motion 100s linear infinite; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-horizontal-motion { from { background-position-x: 0px; } to { background-position-x: 1000%; } } .bg-horizontal-motion{ background-repeat: repeat !important; animation: bg-horizontal-motion 100s linear infinite; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-diagonal-motion { from { background-position: 0 0; } to { background-position: -1000% -1000%; } } .bg-diagonal-motion{ background-repeat: repeat !important; animation: bg-diagonal-motion 100s linear infinite; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-zoom-in-small { from { background-size: 100% 100%; } to { background-size: 125% 125%; } } .bg-zoom-in-small{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-in-small 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-zoom-in-medium { from { background-size: 100% 100%; } to { background-size: 150% 150%; } } .bg-zoom-in-medium{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-in-medium 10s linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @keyframes bg-zoom-in-large { from { background-size: 100% 100%; } to { background-size: 200% 200%; } } .bg-zoom-in-large{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-in-large 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-zoom-out-small { from { background-size: 125% 125%; } to { background-size: 100% 100%; } } .bg-zoom-out-small{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-out-small 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-zoom-out-medium { from { background-size: 150% 150%; } to { background-size: 100% 100%; } } .bg-zoom-out-medium{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-out-medium 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-zoom-out-large { from { background-size: 200% 200%; } to { background-size: 100% 100%; } } .bg-zoom-out-large{ background-repeat: no-repeat !important; background-position: center center; animation: bg-zoom-out-large 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-in-small { from { background-size: 100% 100%; } to { background-size: 75% 75%; } } .bg-scale-in-small{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-in-small 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-in-medium { from { background-size: 100% 100%; } to { background-size: 50% 50%; } } .bg-scale-in-medium{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-in-medium 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-in-large { from { background-size: 100% 100%; } to { background-size: 0% 0%; } } .bg-scale-in-large{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-in-large 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-out-small { from { background-size: 75% 75%; } to { background-size: 100% 100%; } } .bg-scale-out-small{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-out-small 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-out-medium { from { background-size: 50% 50%; } to { background-size: 100% 100%; } } .bg-scale-out-medium{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-out-medium 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } @keyframes bg-scale-out-large { from { background-size: 0% 0%; } to { background-size: 100% 100%; } } .bg-scale-out-large{ background-repeat: no-repeat !important; background-position: center center; animation: bg-scale-out-large 10s linear; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; } .dki-table-element .tablesorter th { cursor : pointer; position:relative; } .dki-table-element .tablesorter th > div:after { font-family: FontAwesome; right:10px; position:absolute; } .rtl .dki-table-element .tablesorter th > div:after { right: auto; left: 10px; } .dki-table-element .tablesorter th.tablesorter-headerUnSorted:hover > div:after { content: "\f0dc"; } .dki-table-element .tablesorter th.tablesorter-headerAsc > div:after { content: "\f0dd"; } .dki-table-element .tablesorter th.tablesorter-headerDesc > div:after { content: "\f0de"; } .dki-contentCarousel-element .sideControls .owl-controls { display:none; } .dki-contentCarousel-element .side-control{ font-size: 20px; opacity: 1; z-index: 5; background-color: rgba(40, 40, 40, 0.3); position: absolute; top: 50%; margin-top: -30px; height: 60px; line-height: 60px; width: 40px; text-align: center; transition: font-size 200ms, opacity 500ms; -webkit-transition: font-size 200ms, opacity 500ms; } .dki-contentCarousel-element .hidenav .side-control{ opacity: 0; } .dki-contentCarousel-element:hover .side-control{ opacity: 1 !important; } .dki-contentCarousel-element .side-control.left{ left: 0px; } .dki-contentCarousel-element .side-control.right{ right: 0px; } .dki-contentCarousel-element .side-control i{ vertical-align: middle; color: white; } .dki-contentCarousel-element .side-control:hover{ font-size: 30px; } /* .dki-contentCarousel-element .topBottom.side-control{ margin-top: 0px; height: 50%; text-align: center; } .dki-contentCarousel-element .topBottom.side-control i{ position: absolute; top: 50%; height: 40px; line-height: 40px; margin-top: -20px; } */ .dki-contentCarousel-element .topBottom.side-control.prev { margin-top: -60px; } .dki-contentCarousel-element .topBottom.side-control.next { margin-top: 0px; } .dki-contentCarousel-element .owl-nav .btn{ margin: 5px; } .owl-carousel .owl-item .dki-panel-element img { display:inline-block !important; width: initial !important; } /* A fix for flickering panels in owl carousel items. If this needs to be altered, check that owl items do not flicker when the carousel is transitioned to show more content see: https://github.com/OwlCarousel2/OwlCarousel2/issues/599*/ .owl-carousel .owl-item { transform :translateZ(0) scale(1.0, 1.0); -webkit-transform :translateZ(0) scale(1.0, 1.0); } /*-----------Slider Variations--------------*/ .dki-slider-element .slider:not(.values) .noUi-value{ display:none; } /*Tracks*/ .dki-slider-element .line-track .slider.noUi-vertical{ width:0px; margin-left:8.5px; margin-top:0px; } .dki-slider-element .line-track .slider{ height:0px; margin-top:8.5px; } .dki-slider-element .line-track .noUi-vertical .noUi-base{ margin-top:0px; margin-left:-8.5px; } .dki-slider-element .line-track .noUi-base{ margin-top:-8.5px; } .dki-slider-element .mood.line-track .noUi-base{ margin-top: 0; } .dki-slider-element .mood.line-track .slider.noUi-vertical , .dki-slider-element .mood.line-track .noUi-vertical .noUi-base{ margin-left: 0; } .dki-slider-element .mood.line-track .slider{ border:none; } .dki-slider-element .mood.line-track .slider:not(.noUi-vertical){ height:3px; } .dki-slider-element .mood.line-track .slider.noUi-vertical{ width:3px; } /*Handles*/ .dki-slider-element .circle-handle .noUi-handle{ width:34px; height:34px; left:-17px; border-radius:34px; } .dki-slider-element .circle-handle .noUi-handle:before, .dki-slider-element .circle-handle .noUi-handle:after{ left:8.5px; } .dki-slider-element .horizontal.circle-handle .noUi-handle { top:-9px; } .dki-slider-element .horizontal.circle-handle .noUi-handle:before { left:14px; top: 8.5px; } .dki-slider-element .horizontal.circle-handle .noUi-handle:after { left:17px; top:8.5px; } .dki-slider-element .triangle-handle .noUi-handle{ width: 0; height: 0; border-left: 23px solid transparent; border-right: 23px solid transparent; border-top: 23px solid #AAA; border-bottom: 0; background-color:transparent; box-shadow:none; left:-14.5px; top:-5px; } .dki-slider-element .triangle-handle .noUi-rtl .noUi-handle{ border-top: 0; border-bottom:23px solid #AAA; top:-10px; } .dki-slider-element .triangle-handle .noUi-handle:before, .dki-slider-element .triangle-handle .noUi-handle:after{ display:none; } .dki-slider-element .horizontal.triangle-handle .noUi-handle{ border-top: 23px solid transparent; border-bottom: 23px solid transparent; border-left: 23px solid #AAA; border-right:0; top:-14px; left:-6px; } .dki-slider-element .horizontal.triangle-handle .noUi-rtl .noUi-handle{ border-left: 0; border-right: 23px solid #AAA; left:-12px; } .dki-slider-element .dki-element-content>div { padding: 10px; } .dki-slider-element .horizontal { height: 75px; } .dki-slider-element .vertical { height: 300px; display: inline-block; } .dki-slider-element .vertical .slider { height: 100%; } .dki-slider-element .mood:not(.vertical) div:not(.noUi-rtl) .noUi-base{ background: #eb3c28; /* Old browsers */ background: -moz-linear-gradient(left, #eb3c28 0%, #f47a24 25%, #f8aa22 50%, #8cc602 75%, #1c9807 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb3c28', endColorstr='#1c9807',GradientType=1 ); /* IE6-9 */ } .dki-slider-element .mood.vertical div:not(.noUi-rtl) .noUi-base{ background: #eb3c28; /* Old browsers */ background: -moz-linear-gradient(#eb3c28 0%, #f47a24 25%, #f8aa22 50%, #8cc602 75%, #1c9807 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(#eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(#eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb3c28', endColorstr='#1c9807',GradientType=1 ); /* IE6-9 */ } .dki-slider-element .mood.vertical .noUi-rtl .noUi-base{ background: #eb3c28; /* Old browsers */ background: -moz-linear-gradient(#1c9807 0%, #8cc602 25%, #f8aa22 50%, #f47a24 75%, #eb3c28 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(#1c9807 0%, #8cc602 25%, #f8aa22 50%, #f47a24 75%, #eb3c28 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(#1c9807 0%, #8cc602 25%, #f8aa22 50%, #f47a24 75%, #eb3c28 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c9807', endColorstr='#eb3c28',GradientType=1 ); /* IE6-9 */ } .dki-slider-element .mood .noUi-rtl .noUi-base{ background: #eb3c28; /* Old browsers */ background: -moz-linear-gradient(right, #eb3c28 0%, #f47a24 25%, #f8aa22 50%, #8cc602 75%, #1c9807 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(right, #eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to left, #eb3c28 0%,#f47a24 25%,#f8aa22 50%,#8cc602 75%,#1c9807 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb3c28', endColorstr='#1c9807',GradientType=1 ); /* IE6-9 */ } .dki-slider-element .mood.vertical .noUi-rtl .noUi-origin:before{ top:-300px; left:0; right:0; bottom:100%; } .dki-slider-element .mood .noUi-rtl .noUi-origin:before{ content: ""; position:absolute; background-color:white; top:0; left:-5000px; right:100%; bottom:0; } .dki-slider-element .mood .noUi-rtl .noUi-base { overflow:hidden; } .dki-slider-element .mood .noUi-origin{ background-color: white; } .dki-slider-element .mood .noUi-rtl .noUi-origin{ background-color: transparent; } .dki-slider-element .rounded-track .noUi-base, .dki-slider-element .rounded-track .noUi-target{ border-radius:10px; } .dki-slider-element .mood.rounded-track div:not(.noUI-rtl) .noUi-origin{ border-radius:0 10px 10px 0; } .dki-slider-element .mood.rounded-track div.noUi-rtl .noUi-origin{ border-radius:10px; } .dki-slider-element .mood.rounded-track.vertical div:not(.noUI-rtl) .noUi-origin{ border-radius:0 0 10px 10px; } .dki-slider-element .mood .noUi-handle:before{ font: normal normal normal 20px/1 FontAwesome; left:10px; top:0; padding:5px; background:transparent; width:30px; height:30px; position:abolute; } .dki-slider-element .mood .noUi-handle { border:none; background:none; box-shadow:none; } .dki-slider-element .mood .noUi-handle:after{ display:none; } /* TOGGLES */ .dki-toggle-element label { cursor : pointer; display: inline-table; } .tg-list { text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .dki-toggle-element .dki-element-content label .dki-element-text{ display: table-cell; vertical-align:middle; } .dki-toggle-element .dki-element-content label.tbl-btn .dki-element-text{ display: inline-block; } .dki-toggle-element label { margin-bottom:0; padding:; } .tg-list-item { margin: 0 2em; } .tgl { display: none; } .tgl-btn { text-align:left !important; } .tgl-btn .dki-element-text{ display: none !important; } .tgl, .tgl:after, .tgl:before, .tgl *, .tgl *:after, .tgl *:before, .tgl + .tgl-btn { box-sizing: border-box; } .tgl::-moz-selection, .tgl:after::-moz-selection, .tgl:before::-moz-selection, .tgl *::-moz-selection, .tgl *:after::-moz-selection, .tgl *:before::-moz-selection, .tgl + .tgl-btn::-moz-selection { background: none; } .tgl::selection, .tgl:after::selection, .tgl:before::selection, .tgl *::selection, .tgl *:after::selection, .tgl *:before::selection, .tgl + .tgl-btn::selection { background: none; } .tgl + .tgl-btn { outline: 0; display: inline-block; width: 4em; height: 2em; position: relative; cursor: pointer; vertical-align:middle; margin:5px 0px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .tgl + .tgl-btn:after, .tgl + .tgl-btn:before { position: relative; display: inline-block; content: ""; width: 50%; height: 100%; } .tgl + .tgl-btn:after { left: 0; } .tgl + .tgl-btn:before { display: none; } .tgl:checked + .tgl-btn:after { left: 50%; } .tgl-light + .tgl-btn { background: #f0f0f0; border-radius: 2em; padding: 2px; -webkit-transition: all .4s ease; transition: all .4s ease; } .tgl-light + .tgl-btn:after { border-radius: 50%; background: #fff; -webkit-transition: all .2s ease; transition: all .2s ease; } .tgl-light:checked + .tgl-btn { background: #9FD6AE; } .tgl-ios + .tgl-btn { background: #fbfbfb; border-radius: 2em; padding: 2px; -webkit-transition: all .4s ease; transition: all .4s ease; border: 1px solid #e8eae9; } .tgl-ios + .tgl-btn:after { border-radius: 2em; background: #fbfbfb; -webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease; transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08); } .tgl-ios + .tgl-btn:hover:after { will-change: padding; } .tgl-ios + .tgl-btn:active { box-shadow: inset 0 0 0 2em #e8eae9; } .tgl-ios + .tgl-btn:active:after { padding-right: .8em; } .tgl-ios:checked + .tgl-btn { background: #86d993; } .tgl-ios:checked + .tgl-btn:active { box-shadow: none; } .tgl-ios:checked + .tgl-btn:active:after { margin-left: -.8em; } .tgl-skewed + .tgl-btn { overflow: hidden; -webkit-transform: skew(-10deg); transform: skew(-10deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: all .2s ease; transition: all .2s ease; font-family: sans-serif; background: #888; } .tgl-skewed + .tgl-btn:after, .tgl-skewed + .tgl-btn:before { -webkit-transform: skew(10deg); transform: skew(10deg); display: inline-block; -webkit-transition: all .2s ease; transition: all .2s ease; width: 100%; text-align: center; position: absolute; line-height: 2em; font-weight: bold; color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4); } .tgl-skewed + .tgl-btn:after { left: 100%; content: attr(data-on); } .tgl-skewed + .tgl-btn:before { left: 0; content: attr(data-off); } .tgl-skewed + .tgl-btn:active { background: #888; } .tgl-skewed + .tgl-btn:active:before { left: -10%; } .tgl-skewed:checked + .tgl-btn { background: #86d993; } .tgl-skewed:checked + .tgl-btn:before { left: -100%; } .tgl-skewed:checked + .tgl-btn:after { left: 0; } .tgl-skewed:checked + .tgl-btn:active:after { left: 10%; } .tgl-flat + .tgl-btn { padding: 2px; -webkit-transition: all .2s ease; transition: all .2s ease; background: #fff; border: 4px solid #f2f2f2; border-radius: 2em; } .tgl-flat + .tgl-btn:after { -webkit-transition: all .2s ease; transition: all .2s ease; background: #f2f2f2; content: ""; border-radius: 1em; } .tgl-flat:checked + .tgl-btn { border: 4px solid #7FC6A6; } .tgl-flat:checked + .tgl-btn:after { left: 50%; background: #7FC6A6; } .tgl-flip + .tgl-btn { padding: 2px; -webkit-transition: all .2s ease; transition: all .2s ease; font-family: sans-serif; -webkit-perspective: 100px; perspective: 100px; } .tgl-flip + .tgl-btn:after, .tgl-flip + .tgl-btn:before { display: inline-block; -webkit-transition: all .4s ease; transition: all .4s ease; width: 100%; text-align: center; position: absolute; line-height: 2em; font-weight: bold; color: #fff; position: absolute; top: 0; left: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; border-radius: 4px; } .tgl-flip + .tgl-btn:after { content: attr(data-on); background: #02C66F; -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .tgl-flip + .tgl-btn:before { background: #FF3A19; content: attr(data-off); } .tgl-flip + .tgl-btn:active:before { -webkit-transform: rotateY(-20deg); transform: rotateY(-20deg); } .tgl-flip:checked + .tgl-btn:before { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); } .tgl-flip:checked + .tgl-btn:after { -webkit-transform: rotateY(0); transform: rotateY(0); left: 0; background: #7FC6A6; } .tgl-flip:checked + .tgl-btn:active:after { -webkit-transform: rotateY(20deg); transform: rotateY(20deg); } .tgl-container { position:relative; display:inline-block; width:40px; height:60px; background-color:#bbb; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; text-align:center; } .tgl-container input { width:100%; height:100%; margin:0 0; padding:0 0; position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; cursor:pointer; opacity:0; filter:alpha(opacity=0); } .tgl-container label { display:block; position:absolute; top:1px; right:1px; bottom:1px; left:1px; background-image:-webkit-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%); background-image:-moz-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%); background-image:-ms-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%); background-image:-o-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%); background-image:linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%); -webkit-box-shadow:0 2px 3px rgba(0,0,0,0.4), inset 0 -1px 1px #888, inset 0 -5px 1px #bbb, inset 0 -6px 0 white; -moz-box-shadow:0 2px 3px rgba(0,0,0,0.4), inset 0 -1px 1px #888, inset 0 -5px 1px #bbb, inset 0 -6px 0 white; box-shadow:0 2px 3px rgba(0,0,0,0.4), inset 0 -1px 1px #888, inset 0 -5px 1px #bbb, inset 0 -6px 0 white; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; font:normal 11px Arial,Sans-Serif; color:#666; text-shadow:0 1px 0 white; cursor:text; } .tgl-container label:before { content:attr(data-off); position:absolute; top:6px; right:0; left:0; z-index:4; } .tgl-container label:after { content:attr(data-on); position:absolute; right:0; bottom:11px; left:0; color:#666; text-shadow:0 -1px 0 #eee; } .tgl-container input:checked + label { background-image:-webkit-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%); background-image:-moz-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%); background-image:-ms-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%); background-image:-o-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%); background-image:linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%); -webkit-box-shadow:0 0 1px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; -moz-box-shadow:0 0 1px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; box-shadow:0 0 1px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; } .tgl-container input:checked:hover + label { -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; -moz-box-shadow:0 1px 3px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; box-shadow:0 1px 3px rgba(0,0,0,0.4), inset 0 1px 7px -1px #ccc, inset 0 5px 1px #fafafa, inset 0 6px 0 white; } .tgl-container input:checked + label:before { z-index:1; top:11px; } .tgl-container input:checked + label:after { bottom:9px; color:#aaa; text-shadow:none; z-index:4; } .dki-toggle-element .dki-element-content{ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .dki-toggle-element input[type=checkbox].check { /* to hide the checkbox itself */ visibility: hidden; /* using display:none causes edge to not repaint when the state changes */ position: absolute; } .dki-toggle-element input[type=checkbox].check + label:before { font-family: FontAwesome; display: inline-block; font-size:20px; position:relative; vertical-align:middle; width:28px; } .dki-toggle-element input[type=checkbox].check + label:before { content: '\f096'; } .dki-toggle-element input[type=checkbox].check:checked + label:before { content: '\f046'; } .dki-toggle-element input[type=checkbox].check.dark + label:before { content: '\f0c8'; } .dki-toggle-element input[type=checkbox].check.dark:checked + label:before{ content: '\f14a'; } .dki-toggle-element input[type=checkbox].check.round + label:before { content: '\f10c'; } .dki-toggle-element input[type=checkbox].check.round:checked + label:before{ content: '\f05d'; } .dki-toggle-element input[type=checkbox].check.roundDark + label:before { content: '\f111'; } .dki-toggle-element input[type=checkbox].check.roundDark:checked + label:before{ content: '\f058'; } .dki-toggle-element input[type=checkbox].check.radio + label:before { content: '\f10c'; } .dki-toggle-element input[type=checkbox].check.radio:checked + label:before{ content: '\f192'; } .dki-selection-element .dropdown .caret { margin-left:10px; } .bg-transparent{ background-color: transparent; } .dki-input-element .form-group { margin-bottom:0; } .dki-input-element .form-group > label { text-align:left; font-weight:normal; width:100%; } .dki-selection-element .btn-group button.transparent{ background:transparent; color:#333; } .dki-selection-element .selectedCont{ margin-right:0px; } .dki-submit-button .titleCont{ display: none; } .flow-authoring .dki-section-height[data-section-height='100']{ min-height: 100vh; } .flow-authoring .dki-section-height[data-section-height='75']{ min-height: 75vh; } .flow-authoring .dki-section-height[data-section-height='50']{ min-height: 50vh; } .flow-authoring .dki-section-height[data-section-height='25']{ min-height: 25vh; } .tooltipster-content{ line-height: normal !important; } .dki-course-max-width { opacity:1 !important; transition: opacity 500ms linear; } .dki-course-max-width.loading { opacity:0 !important; visibility:hidden; } /* large */ .dki-contentCarousel-element .flickity.large-1 .flickity-slider > .dki-authoring-element-element{ width:100%; } .dki-contentCarousel-element .flickity.large-2 .flickity-slider > .dki-authoring-element-element{ width:50%; } .dki-contentCarousel-element .flickity.large-3 .flickity-slider > .dki-authoring-element-element{ width:33.33%; } /* medium */ @media (max-width: 1199px) { .dki-contentCarousel-element .flickity.medium-1 .flickity-slider > .dki-authoring-element-element{ width:100%; } .dki-contentCarousel-element .flickity.medium-2 .flickity-slider > .dki-authoring-element-element{ width:50%; } .dki-contentCarousel-element .flickity.medium-3 .flickity-slider > .dki-authoring-element-element{ width:33.33%; } } /* small */ @media (max-width: 991px) { .dki-contentCarousel-element .flickity.small-1 .flickity-slider > .dki-authoring-element-element{ width:100%; } .dki-contentCarousel-element .flickity.small-2 .flickity-slider > .dki-authoring-element-element{ width:50%; } .dki-contentCarousel-element .flickity.small-3 .flickity-slider > .dki-authoring-element-element{ width:33.33%; } } /* xsmall */ @media (max-width: 767px) { .dki-contentCarousel-element .flickity.xsmall-1 .flickity-slider > .dki-authoring-element-element{ width:100%; } .dki-contentCarousel-element .flickity.xsmall-2 .flickity-slider > .dki-authoring-element-element{ width:50%; } .dki-contentCarousel-element .flickity.xsmall-3 .flickity-slider > .dki-authoring-element-element{ width:33.33%; } } .dki-element-content.darkGlow{ text-shadow: 0px 0px 10px rgba(0,0,0,0.5); } .dki-element-content.lightGlow{ text-shadow: 0px 0px 10px rgba(255,255,255,0.5); } #countdown-timer-div, #content-timer-div { background-color: #eee; color: #000; padding: 0 5px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border:1px solid #ccc; position: fixed; top: 60px; left: 0; z-index: 1000; text-align: center; } .popupContent { margin: 5px 0px; padding-bottom: 5px; line-height: 140%; } #glossaryPopup div.glossaryPopupBody, #glossaryPopup div.glossaryPopupBody div{ width : 100%; } #glossaryHoverDefinition { padding: 5px 5px; z-index:1; display:none; box-shadow: 5px 5px 10px -3px #333; -webkit-box-shadow: 5px 5px 10px -3px #333; -moz-box-shadow: 5px 5px 10px -3px #333; background-color: #F2F2F2; border: 1px solid #BFBFBF; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; position: absolute; color: #444; position: absolute; z-index: 1000 !important; box-shadow: 10px 10px 15px -5px #333; -webkit-box-shadow: 10px 10px 15px -5px #333; -moz-box-shadow: 10px 10px 15px -5px #333; } #glossaryPopup { width: 250px; } #glossaryPopupPronunciation div.jp-controls-holder { height: auto !important; } .dki-glossary-link { border-radius: 5px; } .dki-glossary-link.over{ background: #f5ee13; /* Old browsers */ background: -moz-linear-gradient(top, #f5ee13 0%, #eccf03 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5ee13), color-stop(100%,#eccf03)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f5ee13 0%,#eccf03 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f5ee13 0%,#eccf03 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f5ee13 0%,#eccf03 100%); /* IE10+ */ background: linear-gradient(to bottom, #f5ee13 0%,#eccf03 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5ee13', endColorstr='#eccf03',GradientType=0 ); /* IE6-9 */ } .dki-glossary-link.untranslated.over{ background: #e55457; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2U1NTQ1NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZDk3OWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #e55457 1%, #ed979e 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e55457), color-stop(100%,#ed979e)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #e55457 1%,#ed979e 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #e55457 1%,#ed979e 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #e55457 1%,#ed979e 100%); /* IE10+ */ background: linear-gradient(to bottom, #e55457 1%,#ed979e 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e55457', endColorstr='#ed979e',GradientType=0 ); /* IE6-8 */ } #glossaryPopupPronunciation{ float: right; width: 25px; height:25px; vertical-align: middle; margin-left: 10px; } #glossaryPopupTerm{ font-size: 16px; display: inline-block; font-weight: bold; vertical-align: middle; margin-top:5px; } #glossaryPopupDefinitionContainer{ font-size: 14px; display: inline-block; line-height: 15px; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: auto; max-height: 150px; margin: 5px 0px; } html.on-device #glossaryPopupDefinitionContainer:before{ content: ''; display: block; min-height: 101%; width: 1px; float: left; margin-left: -1px; } div.sectionBreak { margin-left: 10px; width: 90% !important; border:0; border-top: 1px solid #ccc; } .browserCloseButton { background-image: url(../images/close_x.png); background-repeat: no-repeat; width: 28px; height: 23px; cursor: pointer; position:absolute; right: 5px; float:right; } #glossaryBrowseContainer { margin: 0 auto; width: 770px; height: 500px; top: 50px; left: 50%; margin-left: -40%; } #glossaryBrowserContainer input.searchInput { width: 140px; font-size: 12px; border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; float:left; background-color:white; } .windowContainer div.loading, #glossaryPopup.loading, .viewContainer div.loading{ opacity:0; filter: alpha(opacity = 0); width: 0px; height: 0px; overflow: hidden; } #glossaryBrowserContainer .browserList ul li { padding: 3px 0px 3px 10px; cursor:pointer; margin: 5px 0px; list-style-type : none; } #back { cursor: pointer; } #termUl { margin-left:0px; } #termDetails #term { font-weight: bold; margin: 5px 10px 7px 0px; font-size:16px; } #termDetails div.detailsContent #definition, #termDetails div.detailsContent #attribution { width: 100%; margin: 7px 0px; } #termDetails #term, #termDetails #glossaryManagePronunciation { float:left; } #viewBrowserLink { background-image:url(../images/glossaryIcon.png); background-repeat: no-repeat; background-position:5px center; margin: 1px; width:25px; height:25px; margin: 6px 1px 1px 6px; display:block; } #viewBrowserLink:hover { margin: 5px 0px 0px 5px; border: 1px solid #333; border-radius: 3px; } .online div.detailsContent, .tablet div.detailsContent{ } div.windowContainer.phone .panel, div.viewContainer.phone .panel { width: 254px !important; height: 100%; } .phone #glossaryContentContainer { width: 548px; top:70px; } div.windowContainer.phone, div.viewContainer.phone { width: 275px; height: 450px; max-height: 95%; font-size: 20px; top: 10px; } .phone #glossaryPopup { width: 180px; } .phone div.windowContainer, .phone div.viewContainer { margin-left: 15px; } .phone div.detailsContent { width: 100%; } html.on-device div.detailsContent{ float: right; } .phone div.browserList { border: none; } .phone div.windowContainer div.searchContainer, .phone div.viewContainer div.searchContainer { padding: 6px 0px 0px 10px; } .phone #glossaryBrowserContainer div.searchContainer input, { width: 150px; margin: 0px; } .phone #browserHeader { margin-bottom: 10px; } .phone div.windowContainer div.sectionBreak, .phone div.viewContainer div.sectionBreak { width: 246px !important; } .navHidden div.windowContainer, .navHidden div.viewContainer { top: 10px; } .phone .browserCloseButton { left: 240px; } #termUl li { margin-left: 15px; } #termUl li.mobile { line-height: 34px; padding: 0px 0px 0px 0px; } #termUl li.mobile span.termIcon { width: 34px; height: 34px; display: inline-block; vertical-align: bottom; background-image: url(../images/assetmanager_sprites.png); background-repeat: no-repeat; background-position: 0px -400px; margin: 0px 5px; } #glossaryBrowserContainer .windowContainer div.searchContainer, #glossaryBrowserContainer .viewContainer div.searchContainer { float: right; } .dki-glossary-list-term{ cursor: pointer; list-style:none; } .tooltipster-content .dki-glossary-term-tooltip{ padding-left: 10px; padding-right: 10px; } .tooltipster-content .dki-glossary-term-content{ padding: 10px; } .tooltipster-content .dki-glossary-term-content-header-container{ } .dki-glossary-term-content-header .jPlayerAudioSimple{ margin-left: 5px; } .dki-glossary-term-content-header .jPlayerAudioSimple, .dki-glossary-term-content-header .dki-glossary-term-tooltip-close{ position: relative; display: inline-block; cursor: pointer; line-height: 100%; vertical-align: middle; } .dki-glossary-term-content-header .dki-glossary-term-tooltip-close{ float: right; font-size: 18px; font-weight: 200; padding-left: 10px; padding-right: 10px; } .dki-glossary-term-content-definition{ max-width: 270px; } .dki-glossary-term-content-header .jPlayerAudioSimple:before{ content: '\f028'; font-family: FontAwesome; font-weight: normal; font-style: normal; display: inline-block; text-decoration: inherit; text-align: center; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; } @media (max-width: 768px) { .tooltipster-base.glossary-tooltip { max-width: 100%; z-index: 999999; top: 0px !important; left: 0px !important; right: 0px !important; bottom: 0px !important; width: 100% !important; } }/* @group Buttons Library Styles ----------------------------------------------- */ /* DEFAULT STYLING */ .dki-authoring-button { font: bold 13px/1.6em; color: white; text-decoration: none; text-shadow: 0 1px 0 rgba(0,0,0,.4); display: block; display: inline-block; text-align: center; vertical-align: middle; border: none; -webkit-box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2), inset 0 2px 0 rgba(255,255,255,.25); -moz-box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2), inset 0 2px 0 rgba(255,255,255,.25); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2), inset 0 2px 0 rgba(255,255,255,.25); -webkit-background-clip: padding-box; -moz-background-clip: padding-box; background-clip: padding-box; } .dki-authoring-button.rounded{ -moz-border-radius: 8px; border-radius: 8px; } .dki-authoring-button.circle{ -moz-border-radius: 50%; border-radius: 50%; } html.no-touch .dki-authoring-button:hover { text-decoration: none; cursor: pointer; } .dki-authoring-button:hover, .dki-authoring-button:focus { color: white; } .dki-authoring-button:active { -webkit-box-shadow: inset 0 100% 0 0 rgba(0,0,0,0.2); } /* @group Colors ----------------------------------------------- */ /* RED */ .dki-authoring-button.red { background: #c64249; background: #c64249 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #c64249 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.red:hover { background: #c64249 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #c64249 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.red:active { background: #c64249 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #c64249 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* ORANGE */ .dki-authoring-button.orange { background: #d36221; background: #d36221 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #d36221 -moz-linear-gradient( top, rgba(255,255,255,.4),rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.orange:hover { background: #d36221 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #d36221 -moz-linear-gradient( top, rgba(255,255,255,.55),rgba(0,0,0,0)); } .dki-authoring-button.orange:active { background: #d36221 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #d36221 -moz-linear-gradient( top,rgba(0,0,0,.1),rgba(0,0,0,0)); } /* WOODY */ .dki-authoring-button.woody { background: #d99734; background: #d99734 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #d99734 -moz-linear-gradient( top, rgba(255,255,255,.4),rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.woody:hover { background: #d99734 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #d99734 -moz-linear-gradient( top, rgba(255,255,255,.55),rgba(0,0,0,0)); } .dki-authoring-button.woody:active { background: #d99734 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #d99734 -moz-linear-gradient( top,rgba(0,0,0,.1),rgba(0,0,0,0)); } /* HOT PINK */ .dki-authoring-button.pink { background: #d93880; background: #d93880 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #d93880 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.pink:hover { background: #d93880; background: #d93880 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #d93880 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.pink:active { background: #d93880 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #d93880 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* GRAPHITE */ .dki-authoring-button.graphite { background: #6f7f8d; background: #6f7f8d -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #6f7f8d -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.graphite:hover { background: #6f7f8d -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #6f7f8d -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.graphite:active { background: #6f7f8d -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #6f7f8d -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* TURQUOISE */ .dki-authoring-button.turquoise { background: #3ab29e; background: #3ab29e -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #3ab29e -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.turquoise:hover { background: #3ab29e -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #3ab29e -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.turquoise:active { background: #3ab29e -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #3ab29e -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* EMERALD */ .dki-authoring-button.emerald { background: #4fbb6c; background: #4fbb6c -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #4fbb6c -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.emerald:hover { background: #4fbb6c -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #4fbb6c -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.emerald:active { background: #4fbb6c -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #4fbb6c -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* GRASS */ .dki-authoring-button.grass { background: #475311; background: #475311 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #475311 -moz-linear-gradient( top, rgba(255,255,255,.4),rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.grass:hover { background: #475311 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #475311 -moz-linear-gradient( top, rgba(255,255,255,.55),rgba(0,0,0,0)); } .dki-authoring-button.grass:active { background: #475311 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #475311 -moz-linear-gradient( top,rgba(0,0,0,.1),rgba(0,0,0,0)); } /* BLUE */ .dki-authoring-button.blue { background: #3d67a6; background: #3d67a6 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #3d67a6 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.blue:hover { background: #3d67a6 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #3d67a6 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.blue:active { background: #3d67a6 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #3d67a6 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* ROYAL BLUE */ .dki-authoring-button.royalblue { background: #4099c5; background: #4099c5 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #4099c5 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.royalblue:hover { background: #4099c5 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #4099c5 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.royalblue:active { background: #4099c5 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #4099c5 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* BROWN */ .dki-authoring-button.brown { background: #c57c40; background: #c57c40 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #c57c40 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.brown:hover { background: #c57c40 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #c57c40 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.brown:active { background: #c57c40 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #c57c40 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* DARK BROWN */ .dki-authoring-button.darkbrown { background: #532611; background: #532611 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #532611 -moz-linear-gradient( top, rgba(255,255,255,.4),rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.darkbrown:hover { background: #532611 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #532611 -moz-linear-gradient( top, rgba(255,255,255,.55),rgba(0,0,0,0)); } .dki-authoring-button.darkbrown:active { background: #532611 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #532611 -moz-linear-gradient( top,rgba(0,0,0,.1),rgba(0,0,0,0)); } /* MINT */ .dki-authoring-button.mint { background: #a5cb3a; background: #a5cb3a -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #a5cb3a -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.mint:hover { background: #a5cb3a -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #a5cb3a -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.mint:active { background: #a5cb3a -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #a5cb3a -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* GRAPE */ .dki-authoring-button.grape { background: #8d6b85; background: #8d6b85 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #8d6b85 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.grape:hover { background: #8d6b85 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #8d6b85 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.grape:active { background: #8d6b85 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #8d6b85 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* MAGENTA */ .dki-authoring-button.magenta { background: #c642a2; background: #c642a2 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #c642a2 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.magenta:hover { background: #c642a2 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #c642a2 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.magenta:active { background: #c642a2 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #c642a2 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* PURPLE */ .dki-authoring-button.purple { background: #5c3bbc; background: #5c3bbc -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #5c3bbc -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.purple:hover { background: #5c3bbc -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #5c3bbc -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.purple:active { background: #5c3bbc -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #5c3bbc -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* DARK GREY */ .dki-authoring-button.darkgrey { background: #707070; background: #707070 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #707070 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.darkgrey:hover { background: #707070 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #707070 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.darkgrey:active { background: #707070 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #707070 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* SILVER */ .dki-authoring-button.silver { background: #c4c4c4; background: #c4c4c4 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #c4c4c4 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.silver:hover { background: #c4c4c4 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #c4c4c4 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.silver:active { background: #c4c4c4 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #c4c4c4 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* GOLDEN */ .dki-authoring-button.golden { background: #c5ab43; background: #c5ab43 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #c5ab43 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.golden:hover { background: #c5ab43 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #c5ab43 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.golden:active { background: #c5ab43 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #c5ab43 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* BLACK */ .dki-authoring-button.black { background: #1a1a1a; background: #1a1a1a -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #1a1a1a -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.black:hover { background: #1a1a1a -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #1a1a1a -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.black:active { background: #1a1a1a -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #1a1a1a -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* WHITE */ .dki-authoring-button.white { color: #1a1a1a; text-shadow: 0 0 1px white; background: #f9f9f9; background: #f9f9f9 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.2)),to(rgba(0,0,0,0))); background: #f9f9f9 -moz-linear-gradient( top, rgba(255,255,255,.4), rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.white:hover { background: #f9f9f9 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #f9f9f9 -moz-linear-gradient( top, rgba(255,255,255,.55), rgba(0,0,0,0)); } .dki-authoring-button.white:active { background: #f9f9f9 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #f9f9f9 -moz-linear-gradient( top, rgba(0,0,0,.1), rgba(0,0,0,0)); } /* CYAN */ .dki-authoring-button.cyan { background: #5acbe1; background: #5acbe1 -webkit-gradient( linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.4)),to(rgba(0,0,0,0))); background: #5acbe1 -moz-linear-gradient( top, rgba(255,255,255,.4),rgba(0,0,0,0)); } html.no-touch .dki-authoring-button.cyan:hover { background: #5acbe1 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.55)), to(rgba(0,0,0,0))); background: #5acbe1 -moz-linear-gradient( top, rgba(255,255,255,.55),rgba(0,0,0,0)); } .dki-authoring-button.cyan:active { background: #5acbe1 -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.3)), to(rgba(0,0,0,0))); background: #5acbe1 -moz-linear-gradient( top,rgba(0,0,0,.1),rgba(0,0,0,0)); } /* @end */ /* @end */ #headerContainer, #footerContainer, #westPanel, #feedbackTab, #feedbackPanel, #moreOverlay { display:none; } ul.jsonSuggest { position: absolute; background-color: #FFFFFF; border-bottom:1px solid #BBB; border-left : 1px solid #BBB; border-right: 1px solid #BBB; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; margin: 0px; padding-right:10px; } ul.jsonSuggest li { padding: 5px 0px 5px 10px; list-style: none; cursor: pointer; margin: 0px; } ul.jsonSuggest li.resultHover { background-color: #F3F3F3; } #resourceBrowserContainer { margin: 0 auto; width: 770px; height: 500px; top: 50px; left: 50%; margin-left: -40%; } #resourceView { display:none; width: 555px; padding-top: 10px; margin-top: 15px; height: calc(97% - 15px); } .phone #resourceContentContainer { top: 60px; } #resourceWindowContainer input.searchInput { width: 140px; font-size: 12px; border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; float:left; background-color:white; } .phone #resourceWindowContainer div.searchContainer input { width: 150px; margin: 0px; } #resourceWindowContainer .backButton{ background-size: contain; } #resourceWindowContainer div.searchContainer{ padding-bottom: 15px; } #resourceWindowContainer .resultList, #resourceWindowContainer .resultList .subList{ padding-left: 0; } .viewContainer div.sectionBreak { margin: 5px 0px; } #resourceContent { margin: 0 auto; } #resourceContent #imageContent, #resourceContent #imageContent iframe { height: 100%; width: 100%; } #resourceContent { position: relative; top: 0px; left: 0px; overflow: hidden; } .mediaContainer img { width:100%; height:100%; } #resourceContent div.jp-audio div.jp-type-single div.jp-time-holder { left: 60px; width: 158px; display:block; top: 30px; } #resourceContent div.jp-interface { display:none; } #resourceContent div.jp-audio div.jp-type-single div.jp-progress { width: 165px; } #resourceTitle { font-weight:bold; font-size: 14px; padding-bottom: 10px; overflow:hidden; text-overflow: ellipsis; } #resourceTitle a:link {color: inherit; text-decoration: none; display:inline-block; margin-top: 5px;} #resourceTitle a:active {color: inherit;} #resourceTitle a:visited {color: inherit;} #resourceTitle a:hover {color: inherit;} #resourceTitle a span.downloadIcon { background-image: url(../images/download.png); background-repeat: no-repeat; width: 16px; height: 16px; display:inline-block; margin: 0px 5px; vertical-align:middle; } #resourceTitle a.link:link, #resourceTitle a.link:active, #resourceTitle a.link:visited, #resourceTitle a.link:hover { color: blue; text-decoration: underline; } #resourceContent :first-child { display:block; } #resourceList #list { font-size:14px; } #resourceList .Resource_type_label { text-transform: capitalize; } #resourceList #list li p { display:inline-block; } #resourceContent div.docImg { width: 100px; height: 100px; background-repeat: no-repeat; background-image : url(../images/docThumb.png); } #resourceContent div.docImg.doc, #resourceContent div.docImg.docx { background-image : url(../images/docThumb.png); } #resourceContent div.docImg.pdf{ background-image : url(../images/pdfThumb.png); } #resourceContent div.docImg.ppt, #resourceContent div.docImg.pptx { background-image : url(../images/pptThumb.png); } #resourceContent div.docImg.xls, #resourceContent div.docImg.xlsx { background-image : url(../images/xlsThumb.png); } #resourceContent div.docImg.rtf{ background-image : url(../images/rtfThumb.png); } #resourceContent div.docImg.key, #resourceContent div.docImg.keynote { background-image : url(../images/keynoteThumb.png); } #resourceContent div.docImg.pages{ background-image : url(../images/pagesThumb.png); } #resourceContent div.docImg.numbers { background-image : url(../images/numbersThumb.png); } #resourceContent .resourceLinkLabel{ cursor: pointer; } .phone #resourceTitle { font-size: 22px; } .phone #resourceView { width: 254px; } .phone #resourceContentContainer { width:600px; } #resourceList #list li.subItem.mobile { width: 240px; line-height: 22px; cursor: default; } #resourceList #list li.mobile span.linkIcon { width:34px; height:34px; background-position: 15px 23px; } #resourceList #list li.subItem.mobile span.icon{ width:34px; height:34px; cursor: pointer; } #resourceList #list li.subItem.mobile span.icon.link { background-position:0px -332px; } #resourceList #list li.subItem.mobile span.icon.image { background-position:0px -264px; } #resourceList #list li.subItem.mobile span.icon.flash { background-position:0px -230px; } #resourceList #list li.subItem.mobile span.icon.video { background-position:0px -196px; } #resourceList #list li.subItem.mobile span.icon.audio { background-position:0px -162px; } #resourceList #list li.subItem.mobile span.icon.html { background-position:0px -366px; } #resourceList #list li.subItem.mobile span.icon.document { background-position:0px -128px; } /*new flow player list styles*/ .dki-resource-list .list-group-item-heading{ text-transform: capitalize; } .dki-resource-list .dki-resource-list-item{ cursor: pointer; } .dki-resource-list .dki-resource-list-item > a{ word-break:break-word; } .dki-resource-list .dki-resource-list-item .dki-resource-asset-list-item-download{ float: right; padding: 5px; position: relative; top: -5px; right: -5px; cursor: pointer; } .dki-resource-list .dki-resource-list-inline-media{ display: none; } .fancybox-inner .dki-resource-list-inline-media .jp-over-max{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .fancybox-inner .dki-resource-list-inline-media .jp-over-max .jp-type-single{ height: 100%; } .fancybox-inner .dki-resource-list-inline-media .vidPlayer{ margin: auto; } #referencePopup { width: 250px; background-color: #F2F2F2; border: 1px solid #BFBFBF; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; position: absolute; color: #444; position: absolute; z-index: 1000 !important; box-shadow: 10px 10px 15px -5px #333; -webkit-box-shadow: 10px 10px 15px -5px #333; -moz-box-shadow: 10px 10px 15px -5px #333; } #referencePopup .popupContent { width: 90% !important; padding-left:5%; padding-top: 5px; line-height: 1em; overflow-x:auto; } .rtl #referencePopup .popupContent{ padding-left: 0; padding-right: 5%; } #referencePopup span.refNum, #glossaryPopup span.refNum { font-weight:bold; text-decoration: underline; font-size: 1.1em; } #referencePopup #viewBibliographyLink { background-image: url(../images/referenceIcon.png); background-repeat: no-repeat; background-position: 5px center; margin: 1px; width: 25px; height: 25px; margin: 3px 1px 3px 10px; display: block; cursor: pointer; float:left; } #referencePopup div.nav { display: block; float: right; margin: 3px 5px 3px 10px; height: 26px; } #referencePopup div.nav span{ display:inline-block; } #referencePopup div.nav span.counter{ margin: 0px 3px; vertical-align:top; line-height: 26px; } #referencePopup div.nav span.citationNav{ cursor: pointer; width:26px; height:26px; background-image: url(../images/reference_sprites.png); background-repeat: no-repeat; } #referencePopup div.nav span.previous{background-position:0px 0px;} #referencePopup div.nav span.next{background-position: -26px 0px;} #referencePopup div.nav span.previous.disable{background-position:0px -26px;} #referencePopup div.nav span.next.disable{background-position: -26px -26px;} #referencePopup #viewBibliographyLink:hover { margin: 2px 0px 2px 9px; border: 1px solid #333; border-radius: 3px; } #bibliographyContainer #bibliographyContentContainer ul { list-style-type: none; font-size: 1em; width: 95%; margin : 0 auto; } #bibliographyContainer #bibliographyContentContainer li { margin-top: 10px; line-height: 1.2em; border-bottom: 1px solid #AAA; padding-bottom: 10px; } #bibliographyContainer #bibliographyContentContainer li span.refIndex { font-weight:bold; } #bibliographyContainer #bibliographyContentContainer { overflow-y: scroll; width:100%; height: auto; position:absolute; top:24px; bottom:3px; } .responsive #bibliographyContainer { height: auto; min-height: 300px; } #bibliographyContainer { width: 90%; max-width: 900px; max-height: 500px; left: auto; } #bibliographyContainer .browserCloseButton { float:right; position: static; margin-right: 5px; } .rtl #bibliographyContainer .browserCloseButton { float:left; } #searchBrowserContainer input.searchInput { font-size: 1.42em; } #searchBrowserContainer div.searchContainer { margin: 14px 0px 24px 10px; } #searchBrowserContainer div.panel.details { background-color: white; visibility: visible; overflow:hidden; padding: 0px; height: 100%; } #searchBrowserContainer .listPanel .imageThumb{ float: left; margin: 7.5px; width :110px; height:110px; background-size: contain; padding:5px; background-origin:content-box; background-repeat: no-repeat; cursor: pointer; background-position:center; border: 1px solid #868686; background-color:#EBEBEB; } #searchBrowserContainer { width:90%; max-width: 950px; height:80%; max-height: 550px; top: 10%; } #searchBrowserContainer .browserContentContainer { line-height: 1; font-size: 14px; position:absolute; top:30px; bottom: 0px; width: 100%; } #searchBrowserContainer .panel.details { position:absolute; left:250px; right:0px; width:auto; } #searchBrowserContainer div.searchContainer { border-left: 1px solid #333; padding: 3px 5px; } /*---------Item Display----------*/ #searchBrowserContainer .itemContainer{ min-height: 85px; max-height: 100px; padding: 10px 0px 10px 20px; width: 100%; border-bottom: 1px solid #DDD; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor:pointer; } #searchBrowserContainer .itemContainer .chevronContainer { width: 75px; height: 100%; float:right; } #searchBrowserContainer .itemContainer .iconContainer { float:left; height:100%; } #searchBrowserContainer .listPanel .itemContainer:first-child, #searchBrowserContainer .links .itemContainer:first-child { border-top: 1px solid #DDD; } #searchBrowserContainer .listPanel .itemContainer:last-child, #searchBrowserContainer .links .itemContainer:last-child { border-bottom: 1px solid #DDD; } #searchBrowserContainer .itemContainer .metaContainer h3, #searchBrowserContainer .itemContainer .metaContainer p{ display: block; overflow:hidden; text-overflow: ellipsis; } #searchBrowserContainer h3{ font-weight: 600; margin-bottom: 5px; font-size:inherit; font-size: 1.14em; } #searchBrowserContainer p{ font-size: 14px; color: #888; } #searchBrowserContainer .itemContainer .metaContainer h3 { white-space: nowrap; padding: 2px 0px; margin-top:4px; } #searchBrowserContainer .itemContainer p{ max-height: 33px; min-height: 17px; margin-bottom: 0; /* Support for multiline ellipsis in webit only */ display: -webkit-box !important; -webkit-line-clamp : 2; -webkit-box-orient: vertical; line-height: 1.2; } #searchBrowserContainer .itemContainer .metaContainer{ margin: 0 auto; width: auto; } #searchBrowserContainer .sequential { margin-top: 20px; display: none; color: #333; font-weight:bold; } #searchBrowserContainer .sequential h3 { font-size: inherit; display:inline-block; } #searchBrowserContainer .sequential p { font-weight: normal; } #searchBrowserContainer .browserList { width:250px; padding-top:0px; box-sizing:border-box; } /*---------Right Panel---------*/ #searchBrowserContainer div.panel.details.list .switchContainer{ left : 0px; -webkit-transition: 500ms ease-in-out; -moz-transition: 500ms ease-in-out; -o-transition: 500ms ease-in-out; } #searchBrowserContainer div.panel.details.properties .switchContainer{ left : -100%; -webkit-transition: 500ms ease-in-out; -moz-transition: 500ms ease-in-out; -o-transition: 500ms ease-in-out; } #searchBrowserContainer div.panel.details.properties h3 { height: auto; } #searchBrowserContainer div.panel.details .switchContainer{ height: 100%; position:relative; display:block; width: 200%; } #searchBrowserContainer div.panel.details .switchContainer > div{ float:left; width: 50%; height: 100%; padding: 10px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #searchBrowserContainer div.panel.details .switchContainer div.propertiesPanel { padding: 0px; position:relative; } #searchBrowserContainer div.panel.details div.listPanel { overflow-y: auto; overflow-x: hidden; } /*---------Details Panel----------*/ #searchBrowserContainer .backNav { width: 100%; padding: 5px 10px; background-color: #DDD; cursor: pointer; box-sizing: border-box; } #searchBrowserContainer .backNav span{ display:inline-block; vertical-align: middle; } #searchBrowserContainer .backNav .backChevron{ margin-right: 5px; } #searchBrowserContainer div.panel.details div.propertiesContent { width: 100%; box-sizing: border-box; } #searchBrowserContainer div.panel.details .overflowContainer { overflow-y: auto; overflow-x: hidden; position:absolute; top:30px; bottom:0px; width: 100%; } #searchBrowserContainer div.panel.details div.propertiesContent .propertiesMeta { margin: 15px 0px; padding: 0px 10px; } #searchBrowserContainer div.panel.details div.propertiesContent .propertiesMeta h3 { text-align:center; } #searchBrowserContainer div.panel.details div.propertiesContent .propertiesMeta p { line-height: 1.3; margin-top: 20px; } #searchBrowserContainer div.panel.details div.linksContainer { margin-top: 30px; width: 100%; padding: 10px 20px; box-sizing: border-box; border-top: 1px solid #E1E1E1; background-color: #FAFAFA; } #searchBrowserContainer div.panel.details .linksContainer .linksTitle { margin-bottom: 15px; } #searchBrowserContainer div.panel.details div.preview { width: 100%; max-height: 200px; max-width: 350px; margin: 15px auto 15px auto; overflow:hidden; } #searchBrowserContainer div.panel.details .extraLinks { padding-top: 5px; margin-top: 20px; } #searchBrowserContainer div.panel.details .widgetPlaceholder { width:146px; height: 96px; background-image: url(../images/search/widgetPlaceholder.png); background-position:center; background-size: contain; background-repeat:no-repeat; cursor:pointer; margin: 0 auto; } /* Icons */ #searchBrowserContainer .iconContainer { height: 100%; width:30px; } #results .searchItem span.icon { margin-right: 10px; } #searchBrowserContainer .iconContainer { width: 30px; } #searchBrowserContainer .itemContainer .chevronContainer span { float:right; margin-top: 12px; } #searchBrowserContainer span.icon { background-image : url(../images/search/search-sprite.png); width: 24px; height: 24px; background-repeat: no-repeat; display:inline-block; } #searchBrowserContainer span.icon.top { background-position:0 -24px; } #searchBrowserContainer span.icon.image { background-position:0 -48px; } #searchBrowserContainer span.icon.video { background-position:0 -72px; } #searchBrowserContainer span.icon.audio { background-position:0 -96px; } #searchBrowserContainer span.icon.alert { background-position: 0 -144px; } #searchBrowserContainer span.icon.glossary{ background-position:0 -168px; } #searchBrowserContainer span.icon.reference{ background-position:0 -192px; } #searchBrowserContainer span.icon.page { background-position:0 -216px; } #searchBrowserContainer span.icon.chevron { background-position: 0 -240px; } #searchBrowserContainer span.icon.backChevron { background-position: 0 -264px; } #searchBrowserContainer span.icon.jump { background-position: 0 -289px; height: 20px; } #searchBrowserContainer span.icon.objects { background-position: 0 -312px; } #searchBrowserContainer span.icon.text{ background-position:0 -336px; } #searchBrowserContainer span.icon.richMedia { background-position: 0 -360px; } #searchBrowserContainer span.searchPageJump { color: #333; text-decoration: underline; cursor: pointer; } /*--------Filters--------*/ #results { padding-left:10px; } #results li{ color: #676767; font-weight: 600; -webkit-font-smoothing: antialiased; display:none; } #results .searchItem { padding: 5px 16px 5px 15px; cursor: pointer; } #results .division { margin: 10px 0px; border-bottom: 1px solid #DDD; } #results .resCount { float:right; color: #001677; margin-top: 7px; display:inline-block; } #results .filterTitle { max-width:160px; display:inline-block; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; vertical-align:top; margin-top:5px; line-height:18px; } /*-------- Mobile Stuff --------*/ #searchBrowserContainer.phone .chevronContainer { width:50px; } #searchBrowserContainer.phone .listPanel { padding:0px !important; } #searchBrowserContainer.phone .browserList { box-sizing:border-box; height: 100%; } #searchBrowserContainer.phone .browserCloseButton { left:225px; } #searchBrowserContainer.phone .itemContainer p{ max-height: 42px; /* Support for multiline ellipsis in webit only */ display: -webkit-box !important; -webkit-line-clamp : 3; -webkit-box-orient: vertical; } .listPanel .backNav { display:none; } @media (max-width: 480px){ .listPanel .backNav { display:block; } #searchBrowserContainer .panel.details { position: initial; } #searchBrowserContainer .browserContentContainer { width: 200%; } #searchBrowserContainer .browserContentContainer > div { width: 50% !important; } #searchBrowserContainer.shift .browserContentContainer { left: -100%; -webkit-transition: 500ms ease-in-out; -moz-transition: 500ms ease-in-out; -o-transition: 500ms ease-in-out; } #searchBrowserContainer div.panel.details .switchContainer .listPanel { padding: 0px; } }#course_passing_status { text-align: center; padding:5px 0px; margin-bottom: 5px; } #course_passing_status.pass { color: white; background-color: #2A6313; } #course_passing_status.fail { color: white; background-color: #7f0000; } /* Endscreens */ .endScreen h2 { text-align:center; font-size:18px; margin-bottom:5px; } .endScreenWrapper{ height: 100%; overflow-y: auto; } .endScreen.pre .endMod_revisitLink, .endScreen.pre .endMod_testingLink, .endScreen.content .endMod_reviewLink { display: none; } .endScreen #endCourse_actions span { display: none; } .endScreen.showCertificate #endCourse_actions #endCourse_certificateLink, .endScreen.showBibliography #endCourse_actions #endCourse_bibliographyLink, .endScreen.showRevisitContent #endCourse_actions .endCourse_revisitLink, .endScreen.showTakeTest #endCourse_actions #endCourse_takeTestLink{ display: inline-block; } .endScreen #endCourse_testing .dki-scroller { max-height: 350px; } .endScreen.showCertificate #endCourse_testing .dki-scroller { max-height: 320px; } .no-csstransitions div.endscreen div.showCertificate #endCourse_testing .dki-scroller { height: 335px; } .no-csstransitions div.endscreen #endCourse_testing .dki-scroller { height: 365px; } .endScreen .section { display:block; width:100%; margin-bottom:10px; } .endScreen p { margin:0px; } .endScreen h1 { text-align:center; } .endScreen .status, .endScreen #testing ul { margin-left: 0; padding-bottom:8px; } .endScreen #testing li { list-style:none; border-bottom:1px solid black; padding:8px 0px 0px 0px; width:100%; } .endScreen #testing b { padding-right: 1em; } .endScreen #testing li a { cursor:pointer; } .endScreen .actions ul { margin:0px; width:100%; } .endScreen .actions li { margin:0px; list-style:none; } .endScreen #endMod_learningStatus_content, .endScreen .endMod_score_content, .endScreen #endCourse_learningStatuscontent, .endScreen #endCourse_testingLineContent{ text-align: center; width: 100%; } .endScreen #endMod_learningStatus_content .title-text, .endScreen .endMod_score_content .title-text, .endScreen #endCourse_learningStatuscontent .title-text, .endScreen #endCourse_testingLineContent .title-text{ margin: 0; } .endScreen #endMod_header, .endScreen #endCourse_header{ display: inline-block; background-repeat: no-repeat; background-size: cover; } .endScreen #endMod_status, .endScreen #endMod_testScoreDetails, .endScreen #endCourse_status{ padding-top: 45px; } .endScreen #endMod_testScoreDetails .objectTestItem{ margin-bottom: 30px; } .endScreen #endMod_testScoreDetails .objectTestItem .objectTestItemContentWrapper, .endScreen #endCourse_testing .moduleitem .moduleTestItemContentWrapper{ padding: 0 15px; } .endScreen #endCourse_testing .moduleitem .dki-modAttempts{ padding: 20px 0 10px 0; } .endScreen #endMod_testScoreDetails .objectTestScore, .endScreen #endMod_testScoreDetails .objectTestPoints{ display: block; } .endMod_status > .panel-body{ padding-bottom: 0px; } .endScreen #endMod_actions, .endScreen #endMod_status > div, .endScreen #endMod_testScoreDetails, .endScreen #endCourse_actions, .endScreen #endCourse_status, .endScreen #endCourse_testing{ text-align: center; } .endScreen .centerBlock{ display: inline-block; float: none; vertical-align: top; } .endScreen .actions a { border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px; line-height:40px; margin-bottom: 10px; display:block; text-align:center; padding: 0; cursor:pointer; } html.rtl .endScreen .actions a { margin-left: auto; margin-right: 5%; } .endScreen .actions a.disabled { -moz-opacity: 0.3; opacity: 0.3; filter:alpha(opacity=30); } .endMod_scoreLine { display:none; } .endMod_scoreLine.visible { display:inline-block; } .modTestName { display:block; font-weight:bold; padding-left:5px; } .modTestScore { margin-right:20px; padding-left:5px; } .pass { color: #2a6313; } .fail { color: #7F0000; } .passing_score_container { display: none; } .passing_score_container.visible { display: inline-block; } body.phone .passing_score_container.visible { display: block; position: static; } /** * New End screens */ #endCourse_status .dki-lineitem{ margin: 5px 2% 0px 0px; } #endCourse_status .dki-lineitem.moduleitem{ margin: 0px; } .dki-section-panel .dki-lineitem.showPassing { padding-top: 25px; } .dki-section-panel .dki-lineitem .dki-modTitle{ display : block; margin-bottom : 5px; margin-right : 10px; } .dki-section-panel .dki-lineitem .dki-modTitleLabel{ font-weight : bold; } .dki-section-panel .dki-lineitem .dki-modTitleLabel.mod-jump{ cursor : pointer; } .dki-section-panel .dki-lineitem .dki-modTitleLabel.mod-jump:hover{ text-decoration: underline; } .dki-section-panel .dki-lineitem .dki-modScore{ margin-left : 20px; margin-right : 20px; display : inline-block; } #testingLine .dki-lineitem .dki-modScore{ margin-left: 0px; } #endCourse_testing .dki-lineitem .dki-modScore .pass, #endCourse_testing .dki-lineitem .dki-modScore .fail{ font-weight:bold; font-size:2em; } .dki-section-panel .dki-lineitem .dki-modTestDetails { margin-left: 20px; margin-top: 5px; } .dki-section-panel .dki-lineitem .endMod_passStatus { width: 100%; text-align: center; padding: 5px 0px; margin-bottom: 5px; display:none; } .dki-section-panel .dki-lineitem .endMod_passingScoreLine { position:absolute; left:50%; display:none; } .dki-section-panel.showPassing .dki-lineitem .endMod_passingScoreLine, .dki-section-panel.showPassing .dki-lineitem .endMod_passStatus { display: inline-block; } .dki-section-panel .dki-lineitem .dki-modBtn{ display: inline-block; text-align : center; padding : 0px 10px 0px 10px; cursor : pointer; height: 30px; margin: 0; width: auto; max-width: 100%; } .dki-section-panel .dki-lineitem .actions{ width: auto; } .dki-section-panel .dki-lineitem span{ } body.phone .dki-section-panel .dki-lineitem .dki-modBtn { position: static; margin: 5px 0px; } body #endCourse_status .dki-lineitem span.dki-modScore span.dki-themeTextColor { font-weight: bold; } body.phone .dki-section-panel .dki-lineitem .dki-modAttempts { margin-left: 0px; } body.phone .dki-section-panel .dki-lineitem span.dki-label { text-align: right; margin-right: 5px; } body.phone .dki-section-panel .dki-lineitem .dki-modScore{ display : block; width : 100%; } .dki-section-panel .dki-lineitem-last{ border-bottom-width : 0px } .dki-section-panl .dki-lineitem-last .dki-modBtn { bottom: 0px; } .dki-section-panel .dki-lineitem span.dki-label{ display : inline-block; text-align : right; margin-right : 10px } html.rtl .dki-section-panel .dki-lineitem span.dki-label{ margin-left: 10px; } .dki-section-panel li.dki-lineitem strong { } .modulePassingStatus { position: absolute; width: 100%; text-align: center; top: 0px; left: 0px; padding: 3px 0px; } .modulePassingStatus.pass, .endMod_passStatus.pass { color: white; background-color: #2a6313; } .modulePassingStatus.fail, .endMod_passStatus.fail { color: white; background-color: #7f0000; } /*! jQuery UI - v1.10.3 - 2013-07-04 * http://jqueryui.com * Includes: jquery.ui.core.css, jquery.ui.resizable.css * Copyright 2013 jQuery Foundation and other contributors Licensed MIT */ .ui-helper-hidden{display:none}.ui-helper-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none}.ui-helper-clearfix:before,.ui-helper-clearfix:after{content:"";display:table;border-collapse:collapse}.ui-helper-clearfix:after{clear:both}.ui-helper-clearfix{min-height:0}.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0)}.ui-front{z-index:100}.ui-state-disabled{cursor:default!important}.ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat}.ui-widget-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ui-resizable{position:relative}.ui-resizable-handle{position:absolute;font-size:.1px;display:block}.ui-resizable-disabled .ui-resizable-handle,.ui-resizable-autohide .ui-resizable-handle{display:none}.ui-resizable-n{cursor:n-resize;height:7px;width:100%;top:-5px;left:0}.ui-resizable-s{cursor:s-resize;height:7px;width:100%;bottom:-5px;left:0}.ui-resizable-e{cursor:e-resize;width:7px;right:-5px;top:0;height:100%}.ui-resizable-w{cursor:w-resize;width:7px;left:-5px;top:0;height:100%}.ui-resizable-se{cursor:se-resize;width:12px;height:12px;right:1px;bottom:1px}.ui-resizable-sw{cursor:sw-resize;width:9px;height:9px;left:-5px;bottom:-5px}.ui-resizable-nw{cursor:nw-resize;width:9px;height:9px;left:-5px;top:-5px}.ui-resizable-ne{cursor:ne-resize;width:9px;height:9px;right:-5px;top:-5px}@charset "UTF-8"; /*! * animate.css -http://daneden.me/animate * Version - 3.5.0 * Licensed under the MIT license - http://opensource.org/licenses/MIT * * Copyright (c) 2016 Daniel Eden */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut { -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } @keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.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); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.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); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } .headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } @keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } @keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } .jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center; } @-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } to { opacity: 0; } } @keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } .dki-jumbotron-element .jumbotron { margin-bottom:0px; position:relative; z-index:0; } .dki-jumbotron-element .hideButton .dki-btn-element { display:none; } .dki-jumbotron-element .jumbotron .background { position: absolute; top:0px; bottom:0px; left:0px; right:0px; z-index:-1; opacity : 1; } .background.bg-default { background-color:#EEE; } .dki-jumbotron-element .jumbotron .background.transparency80 { opacity: 0.2; } .dki-jumbotron-element .jumbotron .background.transparency60 { opacity: 0.4; } .dki-jumbotron-element .jumbotron .background.transparency40 { opacity: 0.6; } .dki-jumbotron-element .jumbotron .background.transparency100 { opacity: 0; } .dki-jumbotron-element .jumbotron{ background-color:transparent; }.certificate { padding-top:30px; font-family: Tahoma, Geneva, Verdana, sans-serif; font-size: 18px; text-align: center; } .certificate h1 { font-size: 32px; font-weight: bold; } #certificate_studentName { display:block; font-size:24px; font-weight: bold; padding:10px 0 10px 0; } #certificate_courseName { display:block; font-size:24px; font-weight: bold; padding:10px 0 10px 0; } #certificate_date { display:block; position:absolute; bottom:10px; left:10px; } #certificate_print { display:block; position:absolute; top:10px; right:10px; } #certificate_signature { display:none; } .dki-marker-element{ } .dki-marker-element.ribbonDropdownItem .dki-element-content{ background-color: #333 !important; color: white !important; } .ribbonDropdownItem .dki-element-content, .dki-marker-element .dki-element-content{ text-align: center; cursor: pointer; box-sizing: border-box; line-height: 100%; display:inline-block; width:100%; height:100%; } .dki-marker-element .dki-element-content.round{ border-radius: 50%; } .dki-marker-element .dki-element-content:before{ font-size: 0.6em; vertical-align: top; display: inline-block; } /*double characters need to be smaller...*/ .dki-marker-element .dki-element-content.fa-10:before, .dki-marker-element .dki-element-content.fa-11:before, .dki-marker-element .dki-element-content.fa-12:before, .dki-marker-element .dki-element-content.fa-13:before, .dki-marker-element .dki-element-content.fa-14:before, .dki-marker-element .dki-element-content.fa-15:before, .dki-marker-element .dki-element-content.fa-16:before, .dki-marker-element .dki-element-content.fa-17:before, .dki-marker-element .dki-element-content.fa-18:before, .dki-marker-element .dki-element-content.fa-19:before, .dki-marker-element .dki-element-content.fa-20:before{ font-size: 0.4em; } .fa-0:before { content: "0"; } .fa-1:before { content: "1"; } .fa-2:before { content: "2"; } .fa-3:before { content: "3"; } .fa-4:before { content: "4"; } .fa-5:before { content: "5"; } .fa-6:before { content: "6"; } .fa-7:before { content: "7"; } .fa-8:before { content: "8"; } .fa-9:before { content: "9"; } .fa-10:before { content: "10"; } .fa-11:before { content: "11"; } .fa-12:before { content: "12"; } .fa-13:before { content: "13"; } .fa-14:before { content: "14"; } .fa-15:before { content: "15"; } .fa-16:before { content: "16"; } .fa-17:before { content: "17"; } .fa-18:before { content: "18"; } .fa-19:before { content: "19"; } .fa-20:before { content: "20"; } .fa-roman1:before { content: "I"; } .fa-roman2:before { content: "II"; } .fa-roman3:before { content: "III"; } .fa-roman4:before { content: "IV"; } .fa-roman5:before { content: "V"; } .fa-roman6:before { content: "VI"; } .fa-roman7:before { content: "VII"; } .fa-roman8:before { content: "VIII"; } .fa-roman9:before { content: "IX"; } .fa-roman10:before { content: "X"; } .fa-roman11:before { content: "XI"; } .fa-roman12:before { content: "XII"; } .fa-roman13:before { content: "XIII"; } .fa-roman14:before { content: "XIV"; } .fa-roman15:before { content: "XV"; } .fa-roman16:before { content: "XVI"; } .fa-roman17:before { content: "XVII"; } .fa-roman18:before { content: "XVIII"; } .fa-roman19:before { content: "XIX"; } .fa-roman20:before { content: "XX"; }/* * Skin for jPlayer Plugin (jQuery JavaScript Library) * http://www.happyworm.com/jquery/jplayer * * Skin Name: Blue Monday * * Copyright (c) 2010-2011 Happyworm Ltd * Dual licensed under the MIT and GPL licenses. * - http://www.opensource.org/licenses/mit-license.php * - http://www.gnu.org/copyleft/gpl.html * * Author: Silvia Benvenuti * Skin Version: 4.0 (jPlayer 2.1.0) * Date: 1st September 2011 */ div.jp-audio, div.jp-video { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; /* Edit the font-size to counteract inherited font sizing. * Eg. 1.25em = 1 / 0.8em */ position:relative; width:100%; } div.jp-audio { color: #fff; line-height:1.6; font-size:1.25em; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */ font-family:Verdana, Arial, sans-serif; } div.jp-video:-webkit-full-screen { width: 100%; height: 100%; } div.jp-video.jp-video-full .jp-video-player img{ display: none !important; } div.jp-video.jp-video-full .jp-video-player, div.jp-video.jp-video-full .jp-video-play, div.jp-video.jp-video-full .playHeadBlocker, div.jp-video.jp-video-full div.jp-gui{ z-index: 555555; } div.jp-video .jp-gui{ opacity: 0; -webkit-transition: 0.5s opacity; -moz-transition: 0.5s opacity; -ms-transition: 0.5s opacity; -o-transition: 0.5s opacity; transition: 0.5s opacity; position: absolute; bottom: 0px; left: 0px; right: 0px; z-index:1; } div.jp-video:hover .jp-gui{ opacity: 1; } div.jp-video .subClass { z-index:2147483647; bottom: 2%; width:100%; text-align:middle; -webkit-transition: 0.5s bottom cubic-bezier(0.1, 0.6, 0.8, 1.000); -moz-transition: 0.5s bottom cubic-bezier(0.1, 0.6, 0.8, 1.000); -ms-transition: 0.5s bottom cubic-bezier(0.1, 0.6, 0.8, 1.000); -o-transition: 0.5s bottom cubic-bezier(0.1, 0.6, 0.8, 1.000); transition: 0.5s bottom cubic-bezier(0.1, 0.6, 0.8, 1.000); } div.jp-video .subClass > div { background-color:rgba(0,0,0,0.75); border-radius:2.6px; -webkit-box-decoration-break:clone; } div.jp-video.vid-sm .subClass { font-size:0.5em; } div.jp-video.vid-md .subClass { font-size:0.75em; } div.jp-video.jp-video-full .subClass, div.jp-video.vid-lg .subClass { font-size:1em; } html:not(.on-device) div.jp-video:hover .subClass, div.jp-video.controls .subClass { bottom: 60px; } div.jp-audio.hideControls, div.jp-basic.hideControls { display:none; } html:not(.forTimeline) div.jp-video video { cursor:pointer; /*Video elements are inline block... This gets rid of a weird bottom margin on video elements*/ display:block; } div.jp-video { height:100%; /* border:1px solid #009be3; */ } div.jp-basic { height:100%; width:100%; background: transparent; overflow:hidden; } div.jp-video-full { /* Rules for IE6 (full-screen) */ height:100%; width:100%; /* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */ position:static !important; position:relative } div.jp-video-full div.jp-jplayer, div.jp-video-full div.jp-video-player, div.jp-video-full div.jp-video-play { top: 0; left: 0; position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */ overflow: hidden; z-index:1000; } div.jp-video-full div.jp-gui { left: 0; width:100%; z-index:1000; position: fixed; } .jp-gui.forceShow{ display: block !important; opacity: 1 !important; filter:alpha(opacity=100) !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important; } div.jp-video-full div.jp-interface { position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */ bottom: 0; left: 0; z-index:1000; } div.jp-basic div.jp-interface { background: transparent; } div.jp-interface { text-align: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */ width:100%; padding: 10px 5px 10px 5px; } div.jp-audio .jp-interface { background:rgba(0,0,0,0.2); padding: 2.5px 5px 0 5px; } div.jPlayerAudioSimple .jp-interface{ padding: 2.5px 0; } /* @group CONTROLS */ div.jp-audio div.jp-controls-holder { min-width: 100px; } div.jp-controls-holder { clear: both; width:100%; position: relative; height:100%; } div.jp-interface ul.jp-controls { list-style-type:none; margin:0; padding: 0 5px; } div.jp-interface ul.jp-controls li { display:inline-block; vertical-align:middle; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; backface-visibility: visible !important; } div.jp-basic .jp-interface ul.jp-controls li { display:list-item; } div.jp-audio ul.jp-controls { margin-top:-2.5px; padding-bottom:5px; } div.jp-video ul.jp-controls, div.jp-interface ul.jp-controls a { display:block; color:transparent; cursor: pointer; margin:0 5px; backface-visibility: visible !important; } div.jp-audio a.jp-play, div.jp-video a.jp-play, div.jp-audio a.jp-pause, div.jp-video a.jp-pause { width:20px; height:20px; margin:10px 0; } div.jp-basic a.jp-play, div.jp-basic a.jp-pause { width:25px; height:25px; } div.jp-audio a.jp-play, div.jp-video a.jp-play { background: url("video_play.png"); } div.jp-audio a.jp-play:hover, div.jp-video a.jp-play:hover { background: url("video_play.png"); } div.jp-audio a.jp-pause, div.jp-video a.jp-pause { background: url("video_pause.png"); display: none; position:relative; left:-5px; } div.jp-audio div.jp-interface a.jp-pause, div.jp-video div.jp-interface a.jp-pause { backface-visibility : hidden !important; } div.jp-audio a.jp-pause:hover, div.jp-video a.jp-pause:hover { background: url("video_pause.png"); } div.jp-basic a.jp-play { background: url("basicAudioPlayer.png") no-repeat; } div.jp-basic a.jp-pause { background: url("basicAudioPlayer-activated.png") no-repeat; } div.jp-interface ul.jp-controls a.jp-stop, div.jp-interface ul.jp-controls a.jp-previous, div.jp-interface ul.jp-controls a.jp-next, div.jp-interface ul.jp-controls a.jp-volume-max, div.jp-interface ul.jp-controls li.jp-cc { display:none; } div.jp-video.cc div.jp-interface ul.jp-controls .jp-cc { display:inline-block; } a.jp-stop, a.jp-previous, a.jp-next { width:28px; height:28px; } /* a.jp-stop { background: url("jplayer.blue.monday.png") 0 -83px no-repeat; margin-left:10px; } a.jp-stop:hover { background: url("jplayer.blue.monday.png") -29px -83px no-repeat; } a.jp-previous { background: url("jplayer.blue.monday.png") 0 -112px no-repeat; } a.jp-previous:hover { background: url("jplayer.blue.monday.png") -29px -112px no-repeat; } a.jp-next { background: url("jplayer.blue.monday.png") 0 -141px no-repeat; } a.jp-next:hover { background: url("jplayer.blue.monday.png") -29px -141px no-repeat; }*/ /* @end */ /* @group progress bar */ div.jp-progress { backface-visibility:visible !important; background-color: #ddd; } div.jp-audio div.jp-progress { height:3px; } div.jp-audio div.jp-type-single div.jp-progress { left:80px; right:30px; } div.jp-audio .jp-transcript{ left: 45px; } div.jp-video div.jp-progress { width:100%; height:3px; z-index:1001; margin-bottom:10px; } div.jp-seek-bar { background-color:white; width:0px; height:100%; cursor: pointer; backface-visibility:visible !important; } div.jp-play-bar { background-color:red; width:0px; height:100%; backface-visibility: visible !important; } /* @end */ /* @group volume controls */ .jp-bookmark{ } .jp-bookmark:before{ font-family: FontAwesome; content: '\f02e'; color: white; font-size: 20px; } .jp-bm{ width: 30px; height: 30px; position: absolute; right: 0px; top: 3px; } a.jp-mute, a.jp-unmute, a.jp-volume-max { width:20px; height:20px; top:12px; } div.jp-audio div.jp-type-single a.jp-mute, div.jp-audio div.jp-type-single a.jp-unmute { right: 5px; } div.jp-basic a.jp-mute, div.jp-basic a.jp-unmute { display:none; } div.jp-video .jp-cc i{ color:white; } div.jp-video .jp-cc a { margin: 0 !important; } div.jp-video.cc .jp-cc { width:21px; height:20px; margin-top:8px; } div.jp-video.cc .jp-cc .fa-cc { margin-left:2px; font-size:17px; } div.jp-video .jp-cc:before { position:absolute; width:0px; height:3px; background-color:red; top:20px; border-radius:3px; content : " "; display:block; -moz-transition: left .1s cubic-bezier(0.4,0.0,1,1),width .1s cubic-bezier(0.4,0.0,1,1); -webkit-transition: left .1s cubic-bezier(0.4,0.0,1,1),width .1s cubic-bezier(0.4,0.0,1,1); transition: left .1s cubic-bezier(0.4,0.0,1,1),width .1s cubic-bezier(0.4,0.0,1,1); left:12px; } div.jp-video .subClass { display:none; } div.jp-video.showCC .subClass { display:block; } div.jp-video.showCC .jp-cc:before { width:calc(100% + 1px); left:1px; -moz-transition: left .25s cubic-bezier(0.0,0.0,0.2,1),width .25s cubic-bezier(0.0,0.0,0.2,1); -webkit-transition: left .25s cubic-bezier(0.0,0.0,0.2,1),width .25s cubic-bezier(0.0,0.0,0.2,1); transition: left .25s cubic-bezier(0.0,0.0,0.2,1),width .25s cubic-bezier(0.0,0.0,0.2,1); } div.jp-audio a.jp-volume-max { margin-left: 56px; display:none; } div.jp-video .jp-volume-bar{ display: none !important; } div.jp-video a.jp-volume-max { left: 134px; } a.jp-mute { background: url("video_volume.png"); } a.jp-mute:hover { background: url("video_volume.png"); } a.jp-unmute { background: url("video_muted.png"); } a.jp-unmute:hover { /* background: url("jplayer.blue.monday.png") -79px -170px no-repeat; */ } /* a.jp-volume-max { background: url("jplayer.blue.monday.png") 0 -186px no-repeat; } a.jp-volume-max:hover { background: url("jplayer.blue.monday.png") -19px -186px no-repeat; }*/ div.jp-volume-bar { overflow:hidden; /*background: url("jplayer.blue.monday.png") 0 -250px repeat-x;*/ width:46px; height:2px; cursor: pointer; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } div.jp-audio div.jp-volume-bar { top:37px; left:330px; display:none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } div.jp-video div.jp-volume-bar { top:18px; left:100px; width:36px; } div.jp-video.no-fullscreen div.jp-volume-bar { left: 70px; width:46px; } div.jp-volume-bar-value { /*background: url("jplayer.blue.monday.png") 0 -256px repeat-x;*/ width:0px; height:5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } /* @end */ /* @group current time and duration */ div.jp-audio div.jp-time-holder { position:absolute; top:50px; display:none; } div.jp-audio div.jp-type-single div.jp-time-holder { left:110px; width:186px; } .jp-fs , .jp-cc{ margin:7px 0 2px 0; position:absolute; } .jp-fs, .jp-cc { right: 0; } .jp-controls.allowFs .jp-bm{ right:25px; } .jp-controls.allowFs .jp-cc { right:35px; } [data-bookmarks] .jp-cc { right:35px; } [data-bookmarks] .jp-controls.allowFs .jp-cc { right:60px; } .bookmark-wrapper{ position: absolute; right: 0px; top: 0px; bottom: 62px; width: 35%; max-width: 250px; background-color: rgba(0,0,0,0.3); color: white; display: none; overflow-y: auto; padding: 2px; } .bookmark-wrapper .bookmark-item{ padding: 5px 10px; transition: background-color 0.1s ease-out; cursor: pointer; border-bottom: 1px solid rgba(255,255,255,0.3); } .bookmark-wrapper .bookmark-item:last-child{ border-bottom: 0; } .bookmark-wrapper .bookmark-item:hover{ background-color: rgba(255,255,255,0.15); text-shadow: 0px 0px 10px rgba(0,0,0,0.5); } .jp-time, .jp-time > div{ display:inline-block; text-indent:initial; color:#fff; font-size:12px; margin:3px 5px 3px 3px; vertical-align:top; } /* div.jp-current-time { margin: 0 5px; } div.jp-duration { margin:0 5px; } */ div.jp-video div.jp-current-time { } div.jp-video div.jp-duration { } @media (max-width: 990px) { .dki-authoring-group.col-sm-3 div.jp-video div.jp-current-time { display: none; } .dki-authoring-group.col-sm-3 div.jp-video div.jp-duration { display: none; } } @media (max-width: 766px) { .dki-authoring-group.col-sm-3 div.jp-video div.jp-current-time { display: inline; } .dki-authoring-group.col-sm-3 div.jp-video div.jp-duration { display: inline; } .dki-authoring-group.col-xs-3 div.jp-video div.jp-current-time, .dki-authoring-group.col-xs-4 div.jp-video div.jp-current-time { display: none } .dki-authoring-group.col-xs-3 div.jp-video div.jp-duration, .dki-authoring-group.col-xs-4 div.jp-video div.jp-duration { display: none; } } /* @end */ div.jp-video-play, div.playHeadBlocker { position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0); /* Makes IE9 work with the active area over the whole video area. IE6/7/8 only have the button as active area. */ } div.jp-video-play{ cursor:pointer; } div.jp-video-full div.jp-video-play, div.jp-video-full div.jp-type-single, div.jp-video-full div.playHeadBlocker { height:100%; z-index:1000; } html.video-fullScreen div.jp-video-full div.jp-type-single{ position:fixed; width:100%; top:0; left:0; } html.video-fullScreen .dki-authoring-element.video-fullScreen-element{ z-index:999; } a.jp-video-play-icon { position:relative; display:block; width: 112px; height: 100px; margin-left:-56px; margin-top:-50px; left:50%; top:50%; background: url("jplayer.blue.monday.video.play.png") 0 0 no-repeat; text-indent:-9999px; } div.jp-video-play:hover a.jp-video-play-icon { background: url("jplayer.blue.monday.video.play.png") 0 -100px no-repeat; } div.jp-jplayer audio, div.jp-jplayer { width:0px; height:0px; } div.jp-jplayer { } /* @group TOGGLES */ /* The audio toggles are nested inside jp-time-holder */ ul.jp-toggles { list-style-type:none; padding:0; margin:0 auto; overflow:hidden; } div.jp-audio .jp-type-single ul.jp-toggles { width:25px; } div.jp-video ul.jp-toggles { margin-top:10px; width:100px; } ul.jp-toggles li { display:block; float:right; } ul.jp-toggles li a { display:block; width:25px; height:18px; text-indent:-9999px; line-height:100%; /* need this for IE6 */ } a.jp-transcript{ width: 20px; height: 20px; background: url("video_transcript.png"); background-repeat: no-repeat; } a.jp-full-screen { background: url("video_fullScreen.png") no-repeat; width:20px; height:20px; } a.jp-full-screen:hover { background: url("video_fullscreen.png") no-repeat; } a.jp-restore-screen { background: url("video_extFullscreen.png") no-repeat; width:20px; height:20px; } a.jp-restore-screen:hover { background: url("video_extFullscreen.png") no-repeat; } div.no-fullscreen ul.jp-controls a.jp-restore-screen, div.no-fullscreen ul.jp-controls a.jp-full-screen { display: none; } a.jp-repeat { background: url("jplayer.blue.monday.png") 0 -290px no-repeat; } a.jp-repeat:hover { background: url("jplayer.blue.monday.png") -30px -290px no-repeat; } a.jp-repeat-off { background: url("jplayer.blue.monday.png") -60px -290px no-repeat; } a.jp-repeat-off:hover { background: url("jplayer.blue.monday.png") -90px -290px no-repeat; } a.jp-shuffle { background: url("jplayer.blue.monday.png") 0 -270px no-repeat; margin-left: 5px; } a.jp-shuffle:hover { background: url("jplayer.blue.monday.png") -30px -270px no-repeat; } a.jp-shuffle-off { background: url("jplayer.blue.monday.png") -60px -270px no-repeat; margin-left: 5px; } a.jp-shuffle-off:hover { background: url("jplayer.blue.monday.png") -90px -270px no-repeat; } /* @end */ /* @group NO SOLUTION error feedback */ .jp-no-solution { position:absolute; width:390px; margin-left:-202px; left:50%; top: 10px; padding:5px; font-size:.8em; border:2px solid #009be3; color:#000; display:none; } .jp-no-solution a { color:#000; } .jp-no-solution span { font-size:1em; display:block; text-align:center; font-weight:bold; } /* @end */ ul.jp-controls{ position:relative; } div.jp-basic ul.jp-controls li a{ min-height:25px; max-width: 35px; } div.jp-basic .jp-progress { display: none; } .hidePlayerHead .jp-video-play-icon { display:none; } .forTimeline .dki-video-element.selected .jp-interface { display:none; } .dki-video-element.examining .video-play-head { display:none !important; } /** * For the big red top of page feedback button */ #reviewerTabContainer{ position: fixed; top: 0px; left:50%; margin-left:-80px; z-index: 1500; font-size: 12px; background-color: #f98520; height: auto; min-width: 207px; display: block; padding: 5px; padding-left: 20px; padding-right: 20px; line-height: 100%; color: white; } .reviewerButtonLabel{ line-height: 100%; vertical-align: middle; margin-right: 10px; font-size: 13px; } .reviewerTabDraggableIcon { cursor: move; } #pinFeedback{ background-image: url(../images/review-element.png); } #answerKey{ background-image: url(../images/review-answer-key.png); } .reviewerTabButton{ background-repeat: no-repeat; width: 16px; height: 16px; line-height: 100%; display: inline-block !important; font-size: 11px; margin-left: 3px; cursor: pointer; vertical-align: middle; } .reviewerTabButton:hover{ } html.on-device .reviewerTabButton{ padding: 10px; background-position: center center; } .reviewerTabLabel{ text-decoration: none; color: #555; vertical-align: middle; } #endReviewTab{ background-image: url(../images/review-close.png); } #feedbackTab{ background-image: url(../images/review-note.png); } body.pin-feedback-mode{ cursor: pointer !important; } body.pin-feedback-mode .dki-authoring-element .dki-element-content{ filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; cursor: crosshair !important; } body.pin-feedback-mode .dki-authoring-element .dki-element-content:hover{ filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; cursor: pointer !important; outline: 1px solid #FF7601; } body.pin-feedback-mode .dki-authoring-element .dki-element-content:before{ content: ""; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background-image: url(../images/transparent.gif); background-repeat: repeat; } .element-feedback-tooltip-body{ width: 275px; max-height: 500px; overflow-y: auto; } .feedback-note-comments-wrapper:after, .feedback-submit-wrapper:after, .element-feedback-tooltip-body:after{ content: ""; display: table; clear: both; } .feedback-note-body, .feedback-note-body span.notranslate{ color: #666; font-size: 11px; user-select: text; word-wrap: break-word; } .feedback-note-header{ color: #333; font-weight: bold; margin-bottom: 5px; } .feedback-note-wrapper{ margin-bottom: 5px; background-color: #fff; width: 100%; box-sizing: border-box; } .feedback-note-body-wrapper{ display: table; width: 100%; box-sizing: border-box; padding: 10px; position: relative; } .feedback-note-rating{ position: absolute; left: 14px; top: 39px; width: 16px; height: 16px; color: #f2f2f2; font-size: 14px; background-color: #f98520; line-height: 16px; vertical-align: middle; text-align: center; } .feedback-page-title{ margin-bottom: 3px; font-size: 13px; font-weight: bold; } textarea.txtArea-feedback{ height : 53px; width : 100%; resize : none; display: block; border: 1px solid #ddd; padding: 5px; box-sizing: border-box; } .feedback-btnSubmit{ width : 70px; height : 23px; vertical-align : middle; border : 1px solid #ddd; background-color : #dcd9df; font-size : 11px; color : #555555; padding-bottom : 2px; float: right; margin-top: 10px; margin-bottom: 10px; } .feedback-note-avatar{ display: table-cell; background-size: contain; background-position: top center; background-repeat: no-repeat; width: 24px; } .feedback-note-details{ display: table-cell; padding-left: 5px; } .feedback-date{ float: right; font-weight: normal; } .feedback-name{ font-size: 12px; } .feedback.tooltipster-base{ padding: 5px; font-size: 12px; background-color: #efefef; z-index: 1500; font-family: Verdana, Arial, Helvetica, sans-serif; } .feedback-notes{ max-height: 300px; overflow-y: auto; clear: both; width: 275px; } .element-feedback-tooltip-body textarea.txtArea-feedback{ margin-top: 10px; } .element-feedback-tooltip-body .feedback-btnSubmit{ margin-bottom: 5px; } .feedback-note-comments-wrapper .feedback-note-action.reply{ display: none; } .feedback-note-action{ padding: 3px; } .dki-authoring-element .element-feedback-icon{ display: none; position: absolute; z-index: 50; top: 0px; right: 0px; background-image: url(../images/review-note.png); background-repeat: no-repeat; background-position: center center; xpadding: 5px; width: 15px; height: 16px; cursor: pointer !important; } .dki-authoring-element.has-review-note > .element-feedback-icon, .dki-authoring-element-element.has-review-note > .element-feedback-icon{ display: block; } .feedback-wrapper .feedback-note-action.reply, .feedback-wrapper .feedback-note-action.edit{ display: inline-block; } .feedback-wrapper .feedback-note-action.resolve, .feedback-wrapper .feedback-note-action.delete{ display: none; } .feedback-reply-wrapper, .feedback-edit-wrapper{ display: none; } .feedback-note-comments-wrapper{ border-bottom: 1px solid #ccc; margin-left: 20px; padding-left: 10px; box-sizing: border-box; } .feedback-note-actions{ text-align: right; } .feedback-note-action{ color: #0b5396; font-size: 12px; cursor: pointer; } .feedback-answer-key-wrapper{ color: #666; font-size: 10px; padding: 10px; max-width: 300px; position: relative; } .feedback-answer-key-wrapper .status-header{ color: #333; font-weight: bold; font-size: 12px; } .feedback-answer-key-wrapper .status-container{ margin-bottom: 10px; } .feedback-answer-key-wrapper .status-details{ padding: 10px; } .feedback-answer-key-wrapper .status-details table{ border-collapse: separate; border-spacing: 3px; } .feedback-answer-key-wrapper .status-details th, .feedback-answer-key-wrapper .status-details td{ text-align: left; vertical-align: top; } .feedback-answer-key-wrapper .status-detail-wrapper{ min-height: 12px; line-height: 100%; } .feedback-answer-key-wrapper .status-detail-label{ min-width: 100px; } .feedback-answer-key-wrapper .status-detail-label, .feedback-answer-key-wrapper .status-detail-value{ display: inline-block; line-height: 100%; vertical-align: top; } .feedback-element-link{ width: 16px; height: 16px; background-image: url(../images/review-element-link.png); background-repeat: no-repeat; background-position: center center; display: inline-block; padding: 3px; cursor: pointer; } .feedback-highlighted{ position: relative; } .feedback-highlighted:before{ content:""; position: absolute; top: -1px; right: -1px; bottom: -1px; left: -1px; background-color: #c6defd; outline: 2px auto #0b5396 !important; z-index: -1; } .status-detail-wrapper.max_selections{ display: none; } .status-container.question.type-2 .status-detail-wrapper.max_selections{ display: table-row; } .status-container.question.type-1 .status-detail-wrapper.partialScoring{ display: none; } .status-container.question-feedback .status-detail-label{ display: block; font-weight: bold; color: #333; margin-top: 5px; margin-bottom: 2px; } .question-option-element-link{ color: #0b5396; cursor: pointer; } .status-container.question-choices th{ color: #333; font-size: 11px; font-weight: bold; } .status-container.question-choices .status-details{ padding: 0px; padding-left: 10px; } .status-container.question-choices .option-feedback{ max-height: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 130px; } #closeAnswerKey{ position: absolute; top: 3px; right: 3px; width: 16px; height: 16px; font-size: 16px; line-height: 100%; cursor: pointer; } .feedback-closeFeedbackTab{ position: relative; float: right; padding-bottom: 5px; width: 16px; height: 16px; font-size: 16px; line-height: 100%; cursor: pointer; } .custom-scrollbar::-webkit-scrollbar { -webkit-appearance: none; } .custom-scrollbar::-webkit-scrollbar:vertical { width: 12px; overflow: visible; } .custom-scrollbar::-webkit-scrollbar-thumb { border-radius: 8px; background-color: rgba(0, 0, 0, .2); border: 3px solid #f5f5f5; } .custom-scrollbar::-webkit-scrollbar-track { -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); background-color: #f5f5f5; } .capture-project-container .transparent { opacity: 0; } .centered-element { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); } .no-padding { padding: 0; } .no-padding-bottom { padding-bottom: 0; } .no-padding-left { padding-left: 0; } .no-padding-top { padding-top: 0; } .one-liner { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .top-buffer { margin-top: 3%; } .top-buffer-small { margin-top: 1.25%; } .top-buffer-fixed { margin-top: 12px; } .bottom-buffer { margin-bottom: 3%; } .bottom-buffer-small { margin-bottom: 1.25%; } .bottom-buffer-fixed { margin-bottom: 12px; } .big-top-buffer { margin-top: 6%; } .big-bottom-buffer { margin-bottom: 6%; } @keyframes flicker { 0% { opacity: 0.5; transform: scale(1); } 50% { opacity: 0; transform: scale(1.15); } 100% { opacity: 0.5; transform: scale(1); } } @keyframes arrow-hint { 0% { opacity:0; left:5px; transform: scale(1); } 100% { opacity:1; left:0px; transform: scale(1.15); } } @keyframes hint { 0% { opacity: 1; transform: translateY(0); } 40% { opacity: 0.8; transform: translateY(-4px); } 75% { opacity:0.8; transform: translateY(2px); } 100% { opacity: 1; transform: translateY(0); } } @keyframes step-hint { 0% { opacity: 1; transform: translateX(0); } 50% { opacity: 0.8; transform: translateX(8px); } 100% { opacity: 1; transform: translateX(0); } }