/* ADMIN PLUGIN STYLE -------------------------------------------------------------- */ .sabox-table.form-table th { width: 400px; padding: 10px 15px; vertical-align: middle; } .sabox-table.form-table { margin-bottom: 30px; } .sabox-table .epfw-tooltip { color: #b8cad7; margin-right: 10px; } .sabox-table .wp-picker-container { text-align: right; } .sabox-table .wp-picker-holder { position: absolute; } .sabox-table select { float: right; } .sabox-table.form-table tr { background-color: #fff; border-bottom: 1px solid #eee; vertical-align: middle !important; } .sabox-table tbody { border: 1px solid #ddd; } .sabox-table.form-table tr:last-of-type { border-bottom: 0; } .sabox-wrap { max-width: 860px; padding-left: 20px; margin: 0 auto; } .hide { display: none; } /*.sabox-slider-container .saboxfield { display: none; }*/ .sabox-slider-container { max-width: 390px; padding-bottom: 5px; box-sizing: border-box; } .sabox-slider-container .ui-slider .ui-slider-handle { width: auto; text-align: center; min-width: 1.2em; } .sabox-table p.description { font-weight: normal; } .wp-admin .checkbox_switch { display: inline-block; width: 100%; text-align: right; } .customize-control-title.onoffswitch_label { width: 71%; } .sabox-table .onoffswitch_label { display: inline-block; vertical-align: top; margin-right: 21px; margin-top: -1px; } .sabox-table .onoffswitch { position: relative; width: 52px; display: inline-block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .sabox-table .onoffswitch-checkbox { display: none !important; } .sabox-table .onoffswitch-label { display: block; overflow: hidden; cursor: pointer; height: 22px; padding: 0; line-height: 19px; transition: background-color 0.2s ease-in; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 30px; background-color: #c4c4c4; -webkit-box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.11); -moz-box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.11); box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.11); } .sabox-table .onoffswitch-label:before { content: ""; display: block; width: 18px; height: 18px; margin: 0; position: absolute; top: 2px; bottom: 0; right: 32px; background-color: #fff; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; transition: all 0.2s ease-in 0s; } .sabox-table .onoffswitch-label:after { content: "OFF"; display: block; color: #fff; position: absolute; top: 2px; bottom: 2px; right: 6px; font-size: 11px; font-family: 'Arial'; } .sabox-table .onoffswitch-checkbox:checked + .onoffswitch-label { background-color: #3caf0e; } .sabox-table .onoffswitch-checkbox:checked + .onoffswitch-label, .sabox-table .onoffswitch-checkbox:checked + .onoffswitch-label:before { border-color: #3caf0e; } .sabox-table .onoffswitch-checkbox:checked + .onoffswitch-label:before { right: 2px; } .sabox-table .onoffswitch-checkbox:checked + .onoffswitch-label:after { content: "ON"; display: block; color: #fff; position: absolute; top: 2px; bottom: 2px; right: 27px; font-size: 11px; font-family: 'Arial'; } .sabox-table .slider-container { position: relative; padding-left: 50px; } .sabox-table .slider-container input[type="text"] { border: none; text-align: center; padding: 2px; margin: 0; font-size: 12px; color: #333; border-radius: 10px; background-color: #f8f8f8; -webkit-box-shadow: inset 0px 2px 5px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0px 2px 5px 0px rgba(0, 0, 0, 0.1); box-shadow: inset 0px 2px 5px 0px rgba(0, 0, 0, 0.1); width: 42px; height: 22px; position: absolute; left: 0; top: 2px; } .sabox-table .slider-container .ui-slider { position: relative; text-align: left; height: 2px; border-radius: 3px; border: none; margin-top: 10px; margin-left: 22px; display: inline-block; width: 97%; background: #d6d6d6; } .sabox-table .slider-container .ui-slider .ui-slider-handle { position: absolute; z-index: 2; top: -10px; cursor: default; -ms-touch-action: none; touch-action: none; width: 18px; height: 18px; -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; background-color: #fff; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); border: solid 1px #d7d7d7; transform: translateX(-50%); } .sabox-table .slider-container .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: 0.7em; display: block; border: 0; background-position: 0 0; background: #e04d43; top: 0; bottom: 0; } /* Social Links */ .sabox-add-social-link { text-align: center; padding: 10px 0; max-width: 570px; } .sabox-add-social-link:hover { border-color: #000; } #sabox-social-table .dashicons-trash { vertical-align: middle; cursor: pointer; color: #a00; } #sabox-social-table .dashicons-trash:hover { color: #dc3232; } /* Simple Author Box Badge */ #sab-current-image img { max-width: 130px; height: auto; } .checkbox-label { text-transform: capitalize; } /* EPFW Styles * * @since 2.0.4 * -------------------------------------------------------------- */ /* tab styling */ .epfw-tab-wrapper.nav-tab-wrapper { background: #fff; padding: 0; border: 1px solid #ddd; text-align: center; margin-bottom: 20px; } .epfw-tab.nav-tab { background: transparent; border: 0; display: inline-block; margin-right: 20px; margin-left: 0; padding: 10px; border-bottom: 2px solid transparent; color: #0073aa; font-weight: 400; position: relative; bottom: -2px; } .epfw-tab.nav-tab.nav-tab-active { border-bottom: 2px solid #2e4453; color: #2e4453; } /* admin options page styling */ .masthead { text-align: center; border-bottom: 1px solid #DDD; margin-bottom: 20px; padding: 20px; } .masthead h1 { margin: 0; padding: 0; display: inline-block; font-size: 20px; color: #000; font-weight: 500; } .masthead a { display: inline-block; margin: 0 10px; text-decoration: none; } .sabox-version { margin: 20px auto; padding: 20px 0; display: block; text-align: center; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; } body.toplevel_page_simple-author-box-options { background-color: #f3f6f8; } body.toplevel_page_simple-author-box-options #wpcontent { padding-left: 0; } .sabox-masthead-left, .sabox-masthead-right { display: inline-block; } .sabox-masthead-left { float: left; } .sabox-masthead-right { float: right; } /* tooltips styling */ .epfw-tooltip { position: relative; display: inline; margin-right: 10px; } .epfw-tooltip:after { font-weight: 400; display: block; visibility: hidden; position: absolute; bottom: 0; left: 20%; opacity: 0; content: attr(data-tooltip); /* might also use attr(title) */ height: auto; min-width: 300px; z-index: 999; text-decoration: none; text-align: center; border: 1px solid #c8d7e1; border-radius: 4px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1), 0 0 56px rgba(0, 0, 0, 0.075); background: #fff; color: #4f748e; font-size: 13px; padding: 16px; } .epfw-tooltip:before { position: absolute; visibility: hidden; width: 0; height: 0; left: 50%; bottom: 0px; opacity: 0; content: ""; border-style: solid; border-width: 6px 6px 0 6px; border-color: rgba(255, 255, 255, 0.85) transparent transparent transparent; } .epfw-tooltip:hover:after { visibility: visible; opacity: 1; bottom: 20px; } .epfw-tooltip:hover:before { visibility: visible; opacity: 1; bottom: 14px; } /* radio group styling */ .sabox-table input[type="radio"] { display: none; margin: 10px; } .sabox-table input[type="radio"] + label { margin: .25em 0 .5em !important; min-width: 100px; display: inline-block; padding: 4px 12px; font-size: 14px; line-height: 20px; color: #333; text-align: center; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); vertical-align: middle; cursor: pointer; background-color: #f5f5f5; background-image: -moz-linear-gradient(top, #fff, #e6e6e6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#e6e6e6)); background-image: -webkit-linear-gradient(top, #fff, #e6e6e6); background-image: -o-linear-gradient(top, #fff, #e6e6e6); background-image: linear-gradient(to bottom, #fff, #e6e6e6); background-repeat: repeat-x; border: 1px solid #ccc; border-color: #e6e6e6 #e6e6e6 #bfbfbf; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); border-bottom-color: #b3b3b3; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0); filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); } .sabox-table input[type="radio"]:checked + label { background-image: none; outline: 0; -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); background-color: #e0e0e0; } .sabox-radio-group { text-align: right; } .sabox-multicheckbox { text-align: right; } .sabox-multicheckbox > div { display: inline-block; margin: 0 0 10px 10px; } /* Upsell */ a.upgrade-pro { float: right; color: red !important; margin-right: 0 !important; text-decoration: none; font-size: 14px; padding: 12px; } a.upgrade-pro:after { font-family: 'dashicons'; content: '\f155'; margin-left: 7px; vertical-align: middle; } .wp-has-submenu a[href*="admin.php?page=sab-upgrade"] { color: red !important; } .wp-has-submenu a[href*="admin.php?page=sab-upgrade"]:after { font-family: 'dashicons'; content: '\f155'; margin-left: 7px; vertical-align: middle; } /* Lite vs PRO SEction */ .featured-section.features .row { display: inline-block; width: 97%; padding: 15px; border-bottom: 1px solid rgba(0, 0, 0, .06); } .featured-section.features .row .dashicons-yes { color: #2cbe4e; } .featured-section.features .row .dashicons-no-alt { color: #ff3d2e; } .featured-section.features .row > div { display: inline-block; float: left; width: 15%; text-align: center; } .featured-section.features .row > .feature { width: 70%; text-align: left; } .featured-section .free-pro-table { border-spacing: 0; width: 100%; margin-top: 40px; } .featured-section .free-pro-table th { padding-bottom: 20px; } .featured-section .free-pro-table td { border-top: 1px solid #ccc; padding: 20px 0 25px; } .featured-section .free-pro-table h3 { margin: 0; } .featured-section .free-pro-table td p { margin: 0; } .featured-section .free-pro-table .sab-feature, .featured-section .free-pro-table .sab-pro-feature { text-align: center; width: 15%; } .featured-section .free-pro-table .dashicons-yes { color: #00a878; } .featured-section .free-pro-table .dashicons-no-alt { color: #ff3439; } .featured-section .free-pro-table .dashicons-before:before, .featured-section .free-pro-table .dashicons-before:before { font-size: 35px; height: 35px; width: 35px; } .featured-section .button-hero .dashicons { font-size: 16px; vertical-align: middle; } .featured-section .ti-about-page-text-center { text-align: center; } .free-pro-table .text-right { text-align: right; } body .simple-author-box-wrap .wp-badge { background: url('../img/sab-big-icon.png') center 35px no-repeat #27547d; padding-top: 160px; height: 0; background-size: 80%; } /* Preview */ .sabox-preview { border: 1px solid #ddd; margin: 20px auto; padding: 0; } .sabox-preview .saboxplugin-wrap { background-color: #FFF; } .sabox-preview .sabox-preview-topbar { background-color: #FAFAFA; border-bottom: 1px solid #DDD; text-align: center; padding: 10px; margin-bottom: 40px; } .sabox-preview .sabox-preview-topbar .dashicons { position: relative; top: 2px; margin-right: 10px; } .sabox-preview .note { margin-top: 40px; padding: 10px; background-color: #fafafa; border-top: 1px solid #ddd; font-style: italic; color: #777; }