/**
 * Style:Options
 * 
 * @title      Options styling
 * @desc       CSS rules for the "options" page
 * @copyright  (c) 2021, Stephino
 * @author     Mark Jivko <stephino.team@gmail.com>
 * @package    stephino-rpg
 * @license    GPL v3+, https://gnu.org/licenses/gpl-3.0.txt
 */
/*Stephin RPG:Options*/@font-face{font-family:Lato;font-style:normal;font-weight:400;src:local("Lato Regular"),local("Lato-Regular"),url("../../fonts/Lato-Regular.woff2") format("woff2");}@font-face{font-family:Lato;font-style:normal;font-weight:400;src:local("Lato Regular"),local("Lato-Regular"),url("../../fonts/Lato-RegularLatin.woff2") format("woff2");}@font-face{font-family:Lato;font-style:normal;font-weight:700;src:local("Lato Bold"),local("Lato-Bold"),url("../../fonts/Lato-Bold.woff2") format("woff2");}@font-face{font-family:Lato;font-style:normal;font-weight:700;src:local("Lato Bold"),local("Lato-Bold"),url("../../fonts/Lato-BoldLatin.woff2") format("woff2");}body { font-family: Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}::-webkit-scrollbar { width: 6px;}::-webkit-scrollbar-track { border-radius: 6px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); box-shadow: inset 0 0 6px rgba(0,0,0,0.3)}::-webkit-scrollbar-thumb { border-radius: 6px; background: rgba(255,255,255,0.8);}::-webkit-scrollbar:horizontal { height: 6px;}.ui-draggable-handle{-ms-touch-action:none; touch-action:none}#wpwrap, #wpcontent, #wpbody { background: #222;}#wpcontent { padding-left: 0px;}#wpbody-content > .updated, #wpbody-content .notice { display: none !important;}.input-group-text { border: 1px solid #000; border-right-color: transparent;}.input-group-text + input { border-radius: 0px 5px 5px 0px;}select[multiple] { min-height: 200px;}input:-webkit-autofill,input:-webkit-autofill:hover, input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus { border: 1px solid #00d4ff; -webkit-text-fill-color: #00d4ff; -webkit-box-shadow: 0 0 0px 1000px #222 inset;}[disabled] { cursor: not-allowed;}div.content-loading { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 2;}div.content-loading > .loading-text { color: #fff; position: absolute; top: 50%; left: 50%; z-index: 100; font-size: 30px; line-height: 40px; width: 100px; margin-left: -50px; -webkit-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear;}div.content-loading > .loading-text:before { content: ""; width: 40px; height: 40px; background: url("../../img/icon.svg") no-repeat 50% 100% transparent; background-size: 100% 100%; left: -50px; top: 0px; position: absolute;}div.content-loading .left-door { background: #23282d; width: 50%; height: 100%; position: absolute; left: 0%; -webkit-transition: left 0.5s linear; -o-transition: left 0.5s linear; transition: left 0.5s linear;}div.content-loading .left-door .logo-holder { position: absolute; width: 300px; height: 300px; right: -150px; z-index: 2; top: 50%; margin-top: -150px; opacity: 1; -webkit-transform: scale(0.1); -ms-transform: scale(0.1); transform: scale(0.1); -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; background: #23282d; border-radius: 50%; overflow: hidden;}div.content-loading .left-door .logo-holder .logo { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background: url("../../img/loading-badge.png") no-repeat 0 0 transparent; background-size: 100% 100%;}div.content-loading .left-door .logo-holder .gradient-holder { width: 100%; height: 100%; position: absolute; z-index: 1; height: 0%; left: 0; bottom: 0; overflow: hidden; -webkit-transition: height 0.5s linear; -o-transition: height 0.5s linear; transition: height 0.5s linear;}div.content-loading .left-door .logo-holder .gradient-holder .gradient { position: absolute; background: -o-linear-gradient(bottom, rgba(219, 219, 219, 1) 0%, rgba(0, 212, 255, 1) 100%); background: -webkit-gradient(linear, left bottom, left top, from(rgba(219, 219, 219, 1)), to(rgba(0, 212, 255, 1))); background: linear-gradient(0deg, rgba(219, 219, 219, 1) 0%, rgba(0, 212, 255, 1) 100%); border-radius: 50%; width: 280px; height: 280px; bottom: 10px; left: 10px;}div.content-loading .right-door { background: #23282d; width: 50%; height: 100%; position: absolute; right: 0%; -webkit-transition: right 0.5s linear; -o-transition: right 0.5s linear; transition: right 0.5s linear;}div.content-loading .right-door .vertical-bar { width: 10px; height: 0%; position: absolute; left: -5px; z-index: 1; background: #00d4ff; background: -o-linear-gradient(bottom, rgba(219, 219, 219, 1) 0%, rgba(0, 212, 255, 1) 100%); background: -webkit-gradient(linear, left bottom, left top, from(rgba(219, 219, 219, 1)), to(rgba(0, 212, 255, 1))); background: linear-gradient(0deg, rgba(219, 219, 219, 1) 0%, rgba(0, 212, 255, 1) 100%); bottom: 0px; -webkit-transition: height 0.25s linear; -o-transition: height 0.25s linear; transition: height 0.25s linear; border-radius: 5px 5px 0 0;}div.content-loading.s1 .left-door .logo-holder { opacity: 1 !important; -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8);}div.content-loading.s1 > .loading-text { opacity: 0;}div.content-loading.s1 .right-door .vertical-bar { height: 40%;}div.content-loading.s1 .left-door .logo-holder .gradient-holder { height: 100%;}div.content-loading.s2 .right-door .vertical-bar { height: 100%;}div.content-loading.s3 .right-door { right: -80%;}div.content-loading.s3 .left-door { left: -80%;}div.content-loading.s3 .left-door .logo-holder { -webkit-transform: scale(0.1); -ms-transform: scale(0.1); transform: scale(0.1); -webkit-transition: -webkit-transform 0.2s linear; transition: -webkit-transform 0.2s linear; -o-transition: transform 0.2s linear; transition: transform 0.2s linear; transition: transform 0.2s linear, -webkit-transform 0.2s linear;}div.content-loading.s4 { display: none;}.card-loading { display: block; position: relative; width: 64px; height: 64px; margin: 0 auto;}.card-loading div { position: absolute; top: 27px; width: 11px; height: 11px; border-radius: 50%; background: #fff; -webkit-animation-timing-function: cubic-bezier(0, 1, 1, 0); animation-timing-function: cubic-bezier(0, 1, 1, 0);}.card-loading div:nth-child(1) { left: 6px; -webkit-animation: card-loading1 0.6s infinite; animation: card-loading1 0.6s infinite;}.card-loading div:nth-child(2) { left: 6px; -webkit-animation: card-loading2 0.6s infinite; animation: card-loading2 0.6s infinite;}.card-loading div:nth-child(3) { left: 26px; -webkit-animation: card-loading2 0.6s infinite; animation: card-loading2 0.6s infinite;}.card-loading div:nth-child(4) { left: 45px; -webkit-animation: card-loading3 0.6s infinite; animation: card-loading3 0.6s infinite;}@-webkit-keyframes card-loading1 { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); }}@keyframes card-loading1 { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); }}@-webkit-keyframes card-loading3 { 0% { -webkit-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(0); transform: scale(0); }}@keyframes card-loading3 { 0% { -webkit-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(0); transform: scale(0); }}@-webkit-keyframes card-loading2 { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 100% { -webkit-transform: translate(19px, 0); transform: translate(19px, 0); }}@keyframes card-loading2 { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 100% { -webkit-transform: translate(19px, 0); transform: translate(19px, 0); }}div.content { overflow: hidden; padding: 20px; text-shadow: 0px 1px 1px #000, 0px 1px 0px #000, 0px -1px 0px #000, 1px 0px 0px #000, -1px 0px 0px #000;}[role="tablist"] { margin-top: 20px;}.card-header { line-height: 30px; font-size: 25px; cursor: pointer; border-radius: 5px !important; margin-top: 5px;}.card[data-has-section="true"] { padding-bottom: 0px;}.card[data-has-section="true"] .card-header { margin: 20px -20px;}.card-header:before { content:"+"; display: inline-block; margin-right: 20px; font-weight: bold; font-family: monospace; font-size: 24px; line-height: 25px; vertical-align: baseline; text-align: center; width: 25px; height: 25px; background: #333; border-radius: 5px;}.card-header[aria-expanded="true"]:before { content:"-";}.card-content { padding-top: 25px; padding-left: 20px; padding-right: 20px;}.card-content > .row { margin-bottom: 20px;}.card-content > .row label { font-size: 14px; line-height: 14px;}.card-content > .row label .info { color: #00d4ff;}.card-content > .row label .info ul { margin-top: 10px;}.card-content > .row label .info li { text-indent: 20px;}.card-content > .row h4 { font-size: 20px; line-height: 25px; font-weight: bold;}.btn[data-role="add"] { background: #444; padding: 10px 20px; font-size: 16px; font-weight: bold; margin: 50px auto; display: inline-block; cursor: pointer;}.btn { cursor: pointer;}.btn.btn-default { background: #444;}.content [role="tablist"] .nav-link,.btn[data-role="add"], .btn, .card-header { background-position: 50% 100% !important; background-size: 100% 10%; background-repeat: no-repeat !important;}.btn[data-role="add"]:hover, .btn:hover,.content [role="tablist"] .nav-link:hover,.card-header:hover { background-image: url("../../img/header-banner.png"); background-size: 100% 50%; -webkit-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear;}.btn, .col.card, .content [role="tablist"] .nav-link.active { -webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.3);}.parameter-holder { text-align: center;}.parameter-holder .card { text-align: left;}[data-role="header"] .banner { padding-top: 25px; padding-bottom: 25px; display: inline-block; text-align: center; margin-bottom: -20px; position: relative;}[data-role="header"] .banner > .glow { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; background: url("../../img/header-banner.png") no-repeat 0% 101% transparent; background-size: 100% 75%; -webkit-transform: scaley(0.3); -ms-transform: scaley(0.3); transform: scaley(0.3); -webkit-transform-origin: bottom center; -ms-transform-origin: bottom center; transform-origin: bottom center; -webkit-animation: banner-pulse 4s infinite; animation: banner-pulse 4s infinite; overflow: hidden;}[data-role="header"] .banner > .glow > span { display: inline-block; width: 85%; height: 100%; border-radius: 50%; -webkit-filter: blur(20px); filter: blur(20px); -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%);}[data-role="header"] .banner[lang="de"] > .glow > span { background: -o-linear-gradient(315deg, rgba(0,0,0,1) 31%, rgba(245,65,49,1) 35%, rgba(245,65,49,1) 64%, rgba(243,247,52,1) 68%); background: linear-gradient(135deg, rgba(0,0,0,1) 31%, rgba(245,65,49,1) 35%, rgba(245,65,49,1) 64%, rgba(243,247,52,1) 68%);}[data-role="header"] .banner[lang="es"] > .glow > span { background: -o-linear-gradient(315deg, rgba(251,48,2,1) 31%, rgba(245,243,49,1) 35%, rgba(245,243,49,1) 64%, rgba(251,48,2,1) 68%); background: linear-gradient(135deg, rgba(251,48,2,1) 31%, rgba(245,243,49,1) 35%, rgba(245,243,49,1) 64%, rgba(251,48,2,1) 68%);}[data-role="header"] .banner[lang="fr"] > .glow > span { background: -o-linear-gradient(45deg, rgba(22,191,245,1) 31%, rgb(255 255 255) 35%, rgb(255 255 255) 64%, rgba(232,73,37,1) 68%); background: linear-gradient(45deg, rgba(22,191,245,1) 31%, rgb(255 255 255) 35%, rgb(255 255 255) 64%, rgba(232,73,37,1) 68%);}[data-role="header"] .banner[lang="it"] > .glow > span { background: -o-linear-gradient(45deg, rgb(22 245 33) 31%, rgb(255 255 255) 35%, rgb(255 255 255) 64%, rgba(232,73,37,1) 68%); background: linear-gradient(45deg, rgb(22 245 33) 31%, rgb(255 255 255) 35%, rgb(255 255 255) 64%, rgba(232,73,37,1) 68%);}[data-role="header"] .banner[lang="pt"] > .glow > span { background: -o-linear-gradient(45deg, rgb(22 245 33) 31%, rgba(232,73,37,1), rgba(232,73,37,1), rgba(232,73,37,1) 68%); background: linear-gradient(45deg, rgb(22 245 33) 31%, rgba(232,73,37,1), rgba(232,73,37,1), rgba(232,73,37,1) 68%);}[data-role="header"] .banner[lang="ro"] > .glow > span { background: -o-linear-gradient(45deg, rgba(22,191,245,1) 31%, rgba(245,237,49,1) 35%, rgba(245,237,49,1) 64%, rgba(232,73,37,1) 68%); background: linear-gradient(45deg, rgba(22,191,245,1) 31%, rgba(245,237,49,1) 35%, rgba(245,237,49,1) 64%, rgba(232,73,37,1) 68%);}[data-role="header"] .banner[lang="ru"] > .glow > span { background: -o-linear-gradient(315deg, rgb(255 255 255) 31%, rgba(22, 191, 245, 1) 35%, rgba(22, 191, 245, 1) 64%, rgba(232,73,37,1) 68%); background: linear-gradient(135deg, rgb(255 255 255) 31%, rgba(22, 191, 245, 1) 35%, rgba(22, 191, 245, 1) 64%, rgba(232,73,37,1) 68%);}@-webkit-keyframes banner-pulse { 0% { -webkit-transform: scaley(0.3); } 50% { -webkit-transform: scaley(1); } 100% { -webkit-transform: scaley(0.3); }}@keyframes banner-pulse { 0% { -webkit-transform: scaley(0.3); transform: scaley(0.3); } 50% { -webkit-transform: scaley(1); transform: scaley(1); } 100% { -webkit-transform: scaley(0.3); transform: scaley(0.3); }}[data-role="header"] .logo { background: url("../../img/icon.svg") no-repeat 0 0 transparent; width: 50px; height: 50px; display: inline-block; margin-right: 20px; line-height: 50px; background-size: 100% 100%; vertical-align: top; position: relative; z-index: 1;}[data-role="header"] .info { display: inline-block; width: auto; height: 50px; line-height: 25px; vertical-align: top; font-size: 20px; position: relative; z-index: 1; padding-top: 12px;}[data-role="header"] .info .version { font-size: 14px; color: #00d4ff;}[data-role="header"] .nav { margin-bottom: -25px; position: relative; z-index: 1;}[data-role="header"] .nav .nav-link,[data-role="header"] .nav [data-lang] { cursor: pointer;}[role="info-badge"] { position: fixed; top: 75px; right: 100px; background: #303030; z-index: 10000; min-height: 50px; padding-right: 20px; border-radius: 25px; overflow: hidden; margin-left: 20px; -webkit-box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.5), 0px -1px 0px 0px rgba(0, 0, 0, 0.5) inset, 0px 10px 20px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.5), 0px -1px 0px 0px rgba(0, 0, 0, 0.5) inset, 0px 10px 20px 1px rgba(0, 0, 0, 0.5); display: none;}[role="info-badge"].active { display: inline-block;}[role="info-badge"] > .icon { display: inline-block; width: 50px; height: 50px; background: url("../../img/badge-success.gif") 50% 50% no-repeat transparent; background-size: 75% !important; position: absolute; margin-right: 5px; -webkit-transform: scale(0.1); -ms-transform: scale(0.1); transform: scale(0.1); -webkit-transition: -webkit-transform 0.5s linear; transition: -webkit-transform 0.5s linear; -o-transition: transform 0.5s linear; transition: transform 0.5s linear; transition: transform 0.5s linear, -webkit-transform 0.5s linear;}[role="info-badge"].active > .icon { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}[role="info-badge"].badge-error > .icon { background-image: url("../../img/badge-error.gif");}[role="info-badge"] > .message { display: inline-block; color: #fff; font-size: 16px; text-shadow: 0px -1px 0px #000; line-height: 25px; margin-top: 10px; margin-bottom: 10px; padding-left: 50px; opacity: 0; -webkit-transform: opacity 0.5s linear; -ms-transform: opacity 0.5s linear; transform: opacity 0.5s linear;}[role="info-badge"].active > .message { opacity: 1;}.slot { margin-bottom: 20px; display: table; width: auto; border-radius: 3px;}.slot, .slots { background-position: 0 0; background-repeat: no-repeat; background-size: 100% 100%; background-color: #222;}.slot, .slot .slot-row, .slot .slot-row .cell { position: relative; z-index: 1; font-weight: bold; font-size: 18px;}.slot.slot-type-slot .cell.selected:before,.slot.slot-type-slots .cell.selected:before { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; content: "\2022"; text-align: center; line-height: 64px; font-family: monospace; font-size: 30px;}.slot.slot-type-slots .cell[ref-id]:before { display: none;}.slot .slot-row { width: auto; height: 64px; display: table-row;}.slot .slot-row .cell { width: 64px; height: 64px; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; color: #fff; border-radius: 5px; cursor: pointer; display: table-cell; vertical-align: top;}.slot.external .slot-row .cell { cursor: auto;}.slot .slot-row .cell[ref-id],.slot .slot-row .cell[data-role="keyframe"] { -webkit-box-shadow: 0px 0px 0px 1px #00d4ff inset; box-shadow: 0px 0px 0px 1px #00d4ff inset; cursor: move; text-align: center; z-index: 3; font-weight: bold; line-height: 64px;}.slot .slot-row .cell.selected { background: rgba(0, 212, 255, 0.5); -webkit-transition: background 0.2s linear; -o-transition: background 0.2s linear; transition: background 0.2s linear; -webkit-box-shadow: 0px 0px 0px 1px #00d4ff inset; box-shadow: 0px 0px 0px 1px #00d4ff inset;}.slot .slot-row .cell.selected.red-out { background: rgba(255, 0, 0, 0.5);}.slot .slot-row .cell.ui-droppable-disabled { z-index: 2;}.slot .slot-row .cell.ui-droppable-hover { -webkit-box-shadow: 0px 0px 0px 1px #00d4ff inset; box-shadow: 0px 0px 0px 1px #00d4ff inset;}.slot.slot-cityBuildingSlots .slot-row,.slot.slot-cityAnimationSlots .slot-row,.slot.keyframes .slot-row { height: 32px;}.slot.slot-cityBuildingSlots .slot-row .cell,.slot.slot-cityAnimationSlots .slot-row .cell,.slot.keyframes .slot-row .cell { width: 32px; height: 32px; border-radius: 3px; line-height: 32px; font-weight: bold;}.slot.slot-cityBuildingSlots .slot-row .cell.movable > div,.slot.slot-cityAnimationSlots .slot-row .cell.movable > div { content: ""; display: block; position: absolute; top: 0; left: 0; width: 64px; height: 64px; z-index: 1; border-radius: 4px; background-repeat: no-repeat; background-size: 100% 100% !important; background-color: rgba(0, 255, 255, 0.1);}.action-area { border: 1px solid #000; border-radius: 5px; position: relative; width: auto; display: inline-block; background-color: #444; padding: 0px !important; text-align: center;}.action-area canvas { background-position: 0px 0px; background-repeat: no-repeat; background-color: #222; background-size: 100% 100% !important; width: 512px !important; height: 512px !important; position: relative; width: 100%; height: 100%; cursor: pointer; margin: 5px 0px 10px 0px; display: inline-block; border-radius: 3px; -webkit-box-shadow: 0px 0px 0px 1px #000; box-shadow: 0px 0px 0px 1px #000;}.poly.form-inline { background: #444; border-radius: 5px; -webkit-box-shadow: 0px 0px 0px 1px #000; box-shadow: 0px 0px 0px 1px #000; padding: 10px 10px 0px; display: inline-block; width: auto;}.poly.form-inline > * { margin-bottom: 10px; display: inline-block; float: left;}.poly [data-group-key] { display: none; margin-left: 5px; margin-right: 5px;}.poly [data-group-key].visible { display: block;}.poly [data-group-key] input { width: 100px;}.poly select { border-radius: 5px 0px 0px 5px; margin-right: -1px; z-index: 2; position: relative;}.poly .formula { border-radius: 0px 5px 5px 0px; border-left-color: transparent; margin-right: 5px; color: #00d4ff !important;}.poly select.x-value { border-radius: 0px; color: #00d4ff !important; background: #222;}[data-param-type="animations"] { position: relative;}.animations { background: #444; width: auto; display: inline-block; padding: 5px; border-radius: 3px; border: 1px solid #000;}.animations > div { float: left; clear: both;}.animations > .btn { background: #222; border: 1px solid #000; color: #ccc; display: block; width: 100%; background-position: 50% 100%; background-size: 100% 10%;}.animations > .btn:hover { color: #fff; background: url("../../img/header-banner.png") no-repeat 50% 100% #222; background-size: 100% 50%; -webkit-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear;}.animation { margin-bottom: 10px; background: #444; padding: 10px; text-align: center; border-radius: 5px; -webkit-box-shadow: 0px 0px 0px 1px #000 inset; box-shadow: 0px 0px 0px 1px #000 inset; display: inline-block; margin-bottom: 5px;}.animation .form-inline { position: relative;}.animation .form-inline .input-group { margin-right: 10px; margin-bottom: 10px;}.animation [data-role="keyframe"] { position: relative; background: rgba(0, 212, 255, 0.5);}.animation [data-role="frame-width"],.animation [data-role="frame-height"],.animation [data-role="frame-duration"],.animation [data-role="frame-steps"] { width: 100px; border-radius: 0px 5px 5px 0px;}.animation .input-group-text { width: 130px;}.animation [data-role="delete"] { float: right; position: absolute; top: 0px; right: 0px;}.animation [data-role="keyframe"] .keyframe-info { width: 240px; background: rgba(0, 0, 0, 0.4); position: absolute; left: 32px; top: 0px; display: none; z-index: 5; padding: 10px; border-radius: 0px 5px 5px 5px;}.animation [data-role="keyframe"] .keyframe-info .preview { position: relative; border: 1px solid #fff; border-radius: 5px; background-color: #fff !important; margin: 0px auto 10px; display: none; float: left; left: 50%;}.animation .cell.visible [data-role="keyframe"] .keyframe-info .preview { display: inline-block;}.slot-row .cell.hover,.animation .cell.hover { -webkit-box-shadow: 0px 0px 0px 1px #00d4ff inset; box-shadow: 0px 0px 0px 1px #00d4ff inset;}.animation [data-role="keyframe-holder"] { background-size: 100% 100%; margin-bottom: 0px;}.animation [data-role="keyframe"] .keyframe-info .input-group { margin-bottom: 10px;}.animation [data-role="keyframe"] .keyframe-info .input-group-prepend { width: 100%;}.animation [cell-x].visible { z-index: 4 !important;}.animation [cell-x].visible [data-role="keyframe"] .keyframe-info { display: inline-block;}.animation [data-group-key="frame-sprite"] .input-group-prepend { width: 470px;}.animation [data-group-key="frame-sprite"] .input-group-prepend input { width: 100%;}.form-inline-level { margin-bottom: 5px;}.action-area .form-inline-level .input-group-text,.action-area .form-inline-level select { border: none; }.action-area .form-inline-level select { border-radius: 0px 5px 0px 5px; border-left: 1px solid #000; border-bottom: 1px solid #000;}.form-inline-level,.form-inline-level .input-group,.form-inline-level .input-group-prepend { width: 532px;}.action-area .form-inline-level,.action-area .form-inline-level .input-group,.action-area .form-inline-level .input-group-prepend { width: 542px;}.form-inline-level .input-group-text { width: 75%;}.form-inline-level select { width: 25% !important; border-radius: 0px 5px 5px 0px;}[data-role="result-area"].active { padding: 0 0 75px;}[data-role="result-area"] h1, [data-role="result-area"] h2, [data-role="result-area"] h3, [data-role="result-area"] h4, [data-role="result-area"] h5, [data-role="result-area"] h6 { color: #fff;}@media (max-aspect-ratio: 1/1) and (max-width: 512px),(min-aspect-ratio: 1/1) and (max-height: 512px) { div.content-loading.s1 .left-door .logo-holder { -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; }}@media (max-aspect-ratio: 1/1) and (max-width: 512px) { .param-input > .animations, .param-input > .action-area { -webkit-transform: scale(0.55); -ms-transform: scale(0.55); transform: scale(0.55); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; } .card-header { font-size: 20px; } .slot .slot-row .cell, .slot .slot-row .cell.selected { width: 32px; height: 32px; } .slot .slot-row .cell.selected:before, .slot .slot-row .cell.ui-droppable > div { line-height: 32px; font-size: 14px; } .slot .slot-row { height: 32px; } .card-content { padding-left: 0px; padding-right: 0px; } .poly.form-inline { padding: 0px; } .poly.form-inline > * { margin-bottom: 5px; } .poly .formula { margin-right: 5px; height: 40px; }}@media (max-aspect-ratio: 1/1) and (max-width: 380px) { .param-input > .animations, .param-input > .action-area { -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; }}@media (max-aspect-ratio: 1/1) and (max-width: 340px) { .param-input > .animations, .param-input > .action-area { -webkit-transform: scale(0.4); -ms-transform: scale(0.4); transform: scale(0.4); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; }}/*EOF*/