/* pp-tooltip container */ div[class^="pp-tooltip"] { position: relative; display: inline-block; background-color: #dadada; color: white; padding: 1px 6px 1px 6px; border-radius: 9px; width: 6px; height: 16px; text-align: center; font-family: Roboto, serif; } /* pp-tooltip text */ div[class^="pp-tooltip"] .text-pp-tooltip { position: absolute; visibility: hidden; min-width: 300px; background-color: #3e3f42; color: #fff; text-align: center; padding: 5px; border-radius: 6px; z-index: 1; font-family: Roboto, sans-serif; top: -100%; } .pp-tooltip-left .text-pp-tooltip { right: 1%; margin-right: 120%; } .pp-tooltip-right .text-pp-tooltip { margin-left: -5px; border-width: 5px; left: 150%; } /* Show the pp-tooltip text when you mouse over the pp-tooltip container */ div[class^="pp-tooltip"]:hover .text-pp-tooltip { visibility: visible; } /* arrow on pp-tooltip */ div[class^="pp-tooltip"] .text-pp-tooltip::after { content: " "; position: absolute; border-width: 5px; border-style: solid; top: 50%; } .pp-tooltip-left .text-pp-tooltip::after { border-color: transparent transparent transparent #3e3f42; right: -3%; } .pp-tooltip-right .text-pp-tooltip::after { border-color: transparent #3e3f42 transparent transparent; left: -3%; } /* Style the tab */ .pp-tab { font-size: 16px; overflow: hidden; border-bottom: 1px solid #EFEFEF; border-top: 1px solid #EFEFEF; width: 100%; } /* Style the buttons that are used to open the tab content */ .pp-tab button { background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 3vh 0; margin: 0 3%; transition: 0.3s; width: 19%; } /* Change background color of buttons on hover */ .pp-tab button:hover { background-color: #ddd; } /* Create an active/current tablink class */ .pp-tab button.active { border-bottom: 3px solid #1a6deb; font-weight: bold; } .pp-tabcontent { margin: 0 14px 14px 14px; } .pp-metamarks-row { margin-top: 3em; margin-left: 1em; position: relative; width: 90%; box-shadow: inset 0 0 0 1px #EAEDF3; border: 1px solid #EAEDF3; border-radius: 4px; } .pp-metamark-delete a { margin: 4px 0pt 0pt -2px; cursor: pointer; width: 10px; height: 10px; text-indent: -9999px; overflow: hidden; top: 4px; left: -14px; } div[id^="pp-hide-metamark"] { padding: 2em 2em 0 2em; } .pp-metamark-preview-pos-, .pp-metamark-delete { display: inline-block; margin: 1em; } .pp-metamark-edit, .pp-metamark-preview-type- { margin: 1em 0; display: inline-block; } .metamark-top-section { border-bottom: 1px solid #EAEDF3; border-radius: 4px 4px 0 0; box-shadow: inset 0 0 0 1px #EAEDF3; width: 100%; } div[class^="metamark-preview-"] { font-weight: bold; } .pp-metamark-edit, .pp-metamark-delete { float: right; } select[id^="pp-metamark-type-"] { width: 100%; height: 52px; vertical-align: top; } input[id^="pp-metamark-pos-"], input[id^="pp-metamark-dur-"], input[id^="pp-metamark-link-"], input[id^="pp-metamark-pos-"]:focus, input[id^="pp-metamark-dur-"]:focus, input[id^="pp-metamark-link-"]:focus { width: 100%; height: 58px; vertical-align: top; } textarea[id^="pp-metamark-val-"][class="pp-ep-box-input"], textarea[id^="pp-metamark-val-"][class="pp-ep-box-input"]:focus { height: 72px; width: 100%; margin: auto; vertical-align: top; resize: none; } div[id^="pp-dur-label"] { float: right; width: 30%; } div[id^="pp-pos-label"], div[id^="pp-type-label"] { margin-right: 4%; width: 30%; } .powerpress-label-container { display: inline-block; margin-top: 2ch; height: 70px; } div[id^="select-media-file"] { vertical-align: top; padding-top: 1vh; padding-left: 10px; float: right; } a[id^="pp-change-media-link"], div[id^="save-media"] { cursor: pointer; } select[id^="powerpress_category_"] { max-width: 51.6%; width: 100%; height: 56px; } div[id^="pp-category-dropdown-"] { margin: 1em 1em 0 1em; } .pp-ep-box-input.pp-width, .pp-ep-box-input.pp-width:focus { width: 100%; } #powerpress-podcast .inside { margin: 0; padding: 0; } div[id^="apple-podcast-opt"] { border-radius: 4px; background-color: #F1F4F9; padding: 3%; width: 90%; margin-bottom: 5vh; } div[id^="ep-info-not-apple"] { margin-bottom: 20px; } .pp-blue-button { display: inline-block; border-radius: 4px; background-color: #0c74d5; color: white; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; padding: 1ch 2em 1ch 2em; cursor: pointer; text-align: center; } .pp-gray-button { background-color: #f5f5f5; box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12), 0 1px 3px 0 rgba(0,0,0,0.2); color: black; display: inline-block; border-radius: 4px; font-family: Roboto, sans-serif; font-size: 14px; font-weight: 600; padding: 0.5ch 1em 0.5ch 1em; margin-right: 1em; cursor: pointer; text-align: center; border: 0; } h4[class^="pp-section-title"] { color: #3E3F42; font-family: Roboto, sans-serif; font-size: 16px; font-weight: bold; line-height: 38px; margin-bottom: 0; margin-top: 0; float: left; display: inline-block; } .pp-section-title-block { width: 100%; } .pp-ep-box-text { font-size: 14px; margin-top: 2ch; margin-bottom: 0; font-family: Roboto, sans-serif; } .pp-ep-box-settings-text { font-size: 12px; letter-spacing: 0.35px; margin-top: 3ch; margin-bottom: 0; } .pp-section-subtitle { color: #5A5C60; font-family: Roboto, sans-serif; font-size: 14px; font-weight: 500; line-height: 16px; } /* Style the tab content */ .pp-tabcontent { display: none; border-top: none; padding: 40px; } .pp-tabcontent.active { display: block; } h3[id^="pp-pp-selected-media-head"] { color: #263238; font-family: Roboto, sans-serif; font-size: 20px; font-weight: bold; letter-spacing: -0.06px; line-height: 24px; margin: 0; } .pp-ep-box-settings { float: right; } .ep-box-settings-icon { cursor: pointer; } div[id^="pp-edit-media-button"] { text-align: center; } div[id^="a-pp-selected-media"] { padding: 1em 2em 0 2em; } div[class="powerpress_remove_container"] { padding: 2ch 2ch; } div[class^="metamark-preview-"] { font-weight: bold; } div[id^="explicit-switch-base"] { display: inline-block; padding: 5px; background-color: #e6e6e6; width: 100%; border-radius: 4px; } .pp-explicit-option { background-color: #e6e6e6; } .explicit-selected { background-color: white; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16); border-radius: 4px; } .pp-explicit-option, .explicit-selected { border-collapse: collapse; font-weight: bold; display: inline-block; width: 32%; padding-top: 1ch; padding-bottom: 1ch; text-align: center; font-size: 14px; font-family: Roboto, sans-serif; cursor: pointer; } div[id^="pp-selected-media-text"] { width: 100%; display: inline-block; } .powerpress_podcast_box, #episode-box-container { padding: 10px; } div[id^="pp-change-media-file"] { vertical-align: top; margin-top: 1vh; margin-left: 10px; float: right; } div[class^="ep-box-line"] { box-sizing: border-box; display: inline-block; height: 1px; width: 100%; border-top: 1px solid #EFEFEF; } div[class="ep-box-line-bold"], div[class="ep-box-line-margin-bold"] { border-top: 2px solid #EFEFEF; width: 92%; } div[class="ep-box-line-bold"] { margin-left: 4%; margin-right: 4%; } .ep-box-line-margin, .ep-box-line-margin-bold { margin: 17px 0 17px 0; } .pp-shortcode-example { box-sizing: border-box; border: 1px solid #E8E8E8; background-color: #F0F0F0; line-height: 36px; padding-left: 2em; padding-right: 2em; } .pp-hidden-settings { display: none; } div[id^="ep-box-blubrry-connect-"] { background-color: #f1f4f9; margin-top: 1em; width: 98%; padding: 1em 1ch; } div[id^="ep-box-blubrry-connected-"] { margin-left: 1em; margin-top: 1em; width: 98%; padding: 1em 1ch; } .ep-box-blubrry-icon { display: inline-block; width: 2em; vertical-align: top; margin-left: 1em; margin-top: 1ch; } .ep-box-blubrry-info-container { display: inline-block; max-width: calc(100% - 320px); } img[id^="pp-image-preview"] { width: 16vh; height: 16vh; border: 3px solid #717171; } img[id^="poster-pp-image-preview"] { width: 32ch; height: 18ch; border: 3px solid #717171; } .powerpress-art-text { width: 70%; display: inline-block; vertical-align: top; } .powerpress-art-preview { width: 28%; display: inline-block; } div[id^="ep-box-filename-container"] { text-overflow: ellipsis; white-space: nowrap; max-width: 85%; overflow: hidden; display: inline-block; } p[id^="ep-box-filename"] { color: #4b4c4e; font-family: Roboto, sans-serif; font-size: 14px; letter-spacing: 0.15px; line-height: 56px; margin: 0 5px 0 5px; display: inline; } /* div[id^="pp-warning-messages"] { margin-left: 3em; } */ div[id^="pp-connect-account-"], div[id^="pp-cancel-container"] { display: inline-block; } div[id^="pp-cancel-container-"] { float: right; margin-right: 2em; } div[id^="hidden-media-details-"] { padding: 1em; margin-top: 2em; background-color: #f1f4f9; } div[class^="details-"] { display: inline-block; font-family: Roboto, sans-serif; } .details-specify { width: 45%; } .details-not-specified, .details-auto-detect { width: 25%; } div[id^="media-input-"] { margin-top: 1ch; } .pp-media-edit-details { color: #2C65DB; font-family: Roboto Medium, sans-serif; font-size: 12px; line-height: 22px; cursor: pointer; border: none; box-shadow: none; background-color: #F1F4F9; text-decoration: none; } button.media-details, button.apple-advanced { color: #2C65DB; font-family: Roboto Medium, sans-serif; font-size: 12px; line-height: 22px; cursor: pointer; border: none; box-shadow: none; background-color: #F5F5F5; font-weight: bold; } button.media-details { background-color: #ffffff; } .media-details-head { color: #3e3f42; font-weight: bold; font-family: Roboto Medium, sans-serif; font-size: 14px; line-height: 22px; margin: 0 1em; } input[id^="powerpress_size"], input[id^="powerpress_size"]:focus { width: 50%; text-align: center; height: 28px; } input[id^="powerpress_duration_"][class="pp-ep-box-input"], input[id^="powerpress_duration_"][class="pp-ep-box-input"]:focus { width: 48px; text-align: center; height: 34px; } div[id^="media-file-details"] { width: 100%; } .pp-detail-section { margin: 0 1em 2ch 1em; } .details-auto-detect { width: 30% } .details-specify { width: 43%; } .details-not-specified { width: 25%; } .blubrry-connect-info { margin: 0 1ch; } h4.blubrry-connect-info { color: #3E3F42; font-family: Roboto, sans-serif; font-size: 16px; font-weight: bold; line-height: 20px; } p.blubrry-connect-info { font-size: 14px; margin-bottom: 0; } a[id^="ep-box-connect-account"], a[id^="pp-change-media-link"] { text-decoration: none; display: inline-block; width: 35ch; margin-right: 1em; } div[id^="ep-box-connect-account-button-"], div[id^="change-media-button"] { border-radius: 4px; border: 1px solid #969696; color: #0c74d5; padding: 1ch 2em 1ch 2em; margin-right: 1em; text-align: center; font-family: Roboto, sans-serif; font-size: 14px; font-weight: 600; } a[id^="ep-box-connect-account"], div[id^="ep-box-connect-account-button-"], a[id^="pp-change-media-link"], div[id^="change-media-button"] { float: right; } input[class="media-details-radio"] { width: 22px; height: 22px; border: 2px solid #B1B1B1; } input[class="media-details-radio"]:checked { border: 2px solid #0c74d5; } input[class="media-details-radio"]:checked:before { width: 12px; height: 12px; margin: 3px; background-color: #0c74d5; } label[class="ep-box-caption"] { color: rgba(0,0,0,0.6); font-family: Roboto, sans-serif; font-size: 12px; letter-spacing: 0.4px; font-weight: 300; margin-left: 2em; } label[class^="pp-ep-box-label"] { position: relative; top: 2px; padding: 0 2px 0 2px; bottom: 10px; background: transparent; } label[class^="pp-ep-box-label-under"] { position: relative; padding: 0 2px 0 2px; bottom: 10px; left: 10px; top: 0; background: transparent; } input[class="pp-ep-box-input"], textarea[class="pp-ep-box-input"], select[class="pp-ep-box-input"], div[class="pp-ep-box-input"] { border-radius: 4px; background-color: white; border: 1px solid #B1B1B1; font-size: 14px; height: 56px; width: 100%; } input[class="pp-ep-box-input"]:focus, textarea[class="pp-ep-box-input"]:focus, select[class="pp-ep-box-input"]:focus, div[class="pp-ep-box-input"]:focus { border-radius: 4px; background-color: white; border: 1px solid #B1B1B1; font-size: 14px; height: 56px; width: 100%; } textarea[id^="powerpress_summary_"], textarea[id^="powerpress_summary_"]:focus { height: 130px; resize: none; padding: 10px; font-family: Roboto, sans-serif; font-size: 14px; line-height: 22px; width: 100%; } textarea[id^="powerpress_embed_"] { resize: none; } textarea[id^="powerpress_summary_"]::-webkit-scrollbar { height: 85%; } /* Track */ textarea[id^="powerpress_summary_"]::-webkit-scrollbar-track { box-shadow: inset 0 0 5px grey; border-radius: 4px; } /* Handle */ textarea[id^="powerpress_summary_"]::-webkit-scrollbar-thumb { background: white; border-radius: 4px; border: grey 1px solid; } div[id^="pp-url-input-container-"] { width: 100%; } div[id^="pp-url-input-label-container"] { display: inline-block; width: calc(100% - 175px); } input[id^="powerpress_url_"], div[id^="powerpress_url_"], input[id^="powerpress_url_"]:focus { width: 100%; border-radius: 4px; box-sizing: border-box; height: 56px; } div[id^="powerpress_url_show_"] { width: 100%; background-color: #f1f4f9; font-size: 14px; height: 56px; border-radius: 0; } input[id^="powerpress_itunes_image_"], input[id^="powerpress_image_"], input[id^="powerpress_itunes_image_"]:focus, input[id^="powerpress_image_"]:focus { width: 90%; border-radius: 4px; box-sizing: border-box; height: 56px; } input[id^="powerpress_feature_"] { border-radius: 2px; border: 2px solid #66788A; height: 18px; width: 18px; } /*input[class="ep-box-checkbox"] { box-sizing: border-box; height: 16px; width: 16px; border: 1px solid #D8DCE6; border-radius: 3px; background: linear-gradient(0deg, #F6F7F9 0%, #FFFFFF 100%); box-shadow: inset 0 2px 0 0 rgba(255,255,255,0.05), 0 1px 1px 0 rgba(22,29,37,0.05); margin: 1em 1ch 1em 1ch; }*/ input.ep-box-checkbox { border: 2px solid #d4d8e0; border-radius: 3px; height: 18px; width: 18px; box-shadow: none; margin-right: 1em; } input.ep-box-checkbox:checked { background-color: #2278cf; border-color: #2278cf; } input.ep-box-checkbox:checked:disabled { background-color: rgba(0,0,0,0.5); border-color: rgba(0,0,0,0.2); } input.ep-box-checkbox:checked::before { content: url('../images/check_white.svg'); height: 21px; width: 21px; margin: -3px 0 0 -4px; } input.ep-box-checkbox:checked + label.pp-checkbox-label { color: #0c74d5; } .pp-section-container { display: block; margin-bottom: 4ch; width: 100%; justify-content: space-between; } .apple-opt-section-container { display: block; margin-bottom: 2ch; width: 100%; justify-content: space-between; } div[id^="apple-feature"] { margin-top: 1vh; } div[id^="title-container"] { width: 50%; } div[id^="season-container"] { width: 30%; } input[id^="powerpress_episode_season"]:disabled { background-color: #f5f5f5; } div[id^="pp-explicit-container"] { display:inline-block; width: 35%; float: right; max-height: 30px; margin-right: 1em; } div[id^="apple-title-container"] { width: 55%; margin-right: 3ch; } div[id^="episode-no-container"], div[id^="season-container"] { display:inline-block; width:18%; margin-top: 3vh; } div[id^="season-container"] { float: right; } div[id^="feature-container"] { margin-top: 3vh; width: 70%; } div[id^="type-container"] { width: 29.5%; vertical-align: top; margin: 2ch 0 0 0; } div[id^="media-input"] { width: 100%; } div[id^="edit-media-file-"] { float: right; } div[id^="ep-box-min-blubrry-connect-"] { margin-top: 1ch; } /* Responsiveness with buttons, Apple Opt Section, and third option in media details */ @media (max-width: 1152px) { .details-not-specified { margin-top: 1em; width: 100% } .details-auto-detect, .details-specify { width: 48% } div[id^="pp-explicit-container"] { width: 40%; } div[id^="feature-container"] { width: 100%; } } /* Responsiveness for second option in media details (all 3 stack), explicit switch, and episode and season no */ @media (max-width: 832px) { div[class^="details-"] { width: 100%; margin-top: 1em; } .pp-detail-section { margin: 2ch 1em 2ch 1em; } div[id^="pp-explicit-container"] { width: 98%; margin: 1em 0 3em 0; float: left; } div[id^="apple-title-container"] { width: 100%; margin-top: 1em; } div[id^="episode-no-container"] { width: 45%; } div[id^="season-container"] { width: 45%; } .pp-tabcontent { padding: 15px; } #wpbody select { height: 52px; } div[id^="pp-type-label"] { width: 99%; margin: 1em 0 1em 0; } div[id^="pp-pos-label"] { width: 40%; margin-left: 0; } div[id^="pp-dur-label"] { width: 40%; margin-right: 0; } .powerpress-art-text, .powerpress-art-preview { width: 100%; } div[id^="type-container"] { width: 50%; } input[type="checkbox"]:checked:before { font: normal 21px/1 dashicons; } .powerpress-art-preview { text-align: center; } input[id^="powerpress_itunes_image_"], input[id^="powerpress_image_"], input[id^="powerpress_itunes_image_"]:focus, input[id^="powerpress_image_"]:focus { width: 100%; } } /* More responsiveness with buttons */ @media (max-width: 592px) { div[id^="ep-box-filename-container"] { max-width: 70%; } .pp-blue-button, .pp-gray-button { display: block; margin: 1ch 0 0 0; } .pp-explicit-option, .explicit-selected { font-size: 12px; } .artwork-button { padding: 1em 2ch; } div[id^="apple-podcast-opt"] { padding: 6%; } div[id^="pp-display-player"], div[id^="pp-player-size"] { width: 100%; } div[id^="type-container"] { width: 100%; } input[id^="powerpress_duration_"][class="pp-ep-box-input"], input[id^="powerpress_duration_"][class="pp-ep-box-input"]:focus { width: 36px; padding: 6px; height: 28px; } select[id^="powerpress_category"] option { width: 100%; } } @media (max-width: 375px) { .pp-detail-section { margin: 2ch 1em 2ch 0; } .media-details { margin-left: 0; } .pp-explicit-option, .explicit-selected { width: 31%; } div[id^="pp-pos-label"], div[id^="pp-dur-label"] { width: 100%; margin: 1em 0 1em 0; } .tab { font-size: 12px; } a[id^="show-details-link"], a[id^="hide-details-link"] { font-size: 12px; } input[id^="powerpress_duration_"][class="pp-ep-box-input"], input[id^="powerpress_duration_"][class="pp-ep-box-input"]:focus { width: 28px; padding: 2px; } } /* Responsiveness with buttons, Apple Opt Section, and third option in media details */ @media (max-width: 1456px) { .classic-editor .details-not-specified { margin-top: 1em; width: 100% } .classic-editor .details-auto-detect, .classic-editor .details-specify { width: 48% } .classic-editor div[id^="pp-explicit-container"] { width: 40%; } .classic-editor div[id^="feature-container"] { width: 100%; } } @media (max-width: 1350px) { .classic-editor div[id^="pp-explicit-container"] { width: 98%; margin: 1em 0 3em 0; float: left; } } @media (max-width: 1256px) { .classic-editor div[class^="details-"] { width: 100%; margin-top: 1em; margin-left: 1em; } } /* Responsiveness for second option in media details (all 3 stack), explicit switch, and episode and season no */ @media (max-width: 1132px) { .classic-editor div[class^="details-"] { width: 100%; margin-top: 1em; } .classic-editor .pp-detail-section { margin: 2ch 1em 2ch 1em; } .classic-editor div[id^="apple-title-container"] { width: 100%; margin-top: 1em; } .classic-editor div[id^="episode-no-container"] { width: 45%; } .classic-editor div[id^="season-container"] { width: 45%; } .classic-editor .pp-tabcontent { padding: 15px; } .classic-editor #wpbody select { height: 52px; } .classic-editor div[id^="pp-type-label"] { width: 99%; margin: 1em 0 1em 0; } .classic-editor div[id^="pp-pos-label"] { width: 40%; margin-left: 0; } .classic-editor div[id^="pp-dur-label"] { width: 40%; margin-right: 0; } .classic-editor .powerpress-art-text, .classic-editor .powerpress-art-preview { width: 100%; } .classic-editor div[id^="type-container"] { width: 50%; } .classic-editor input[type="checkbox"]:checked:before { font: normal 21px/1 dashicons; } .classic-editor .powerpress-art-preview { text-align: center; } .classic-editor input[id^="powerpress_itunes_image_"], .classic-editor input[id^="powerpress_image_"], .classic-editor input[id^="powerpress_itunes_image_"]:focus, .classic-editor input[id^="powerpress_image_"]:focus { width: 100%; } } @media (max-width: 1050px) { .classic-editor .ep-box-blubrry-info-container { max-width: calc(100% - 50px); } .classic-editor a[id^="ep-box-connect-account-"], .classic-editor a[id^="pp-change-media-link-"] { float: none; width: 100%; } .classic-editor div[id^="ep-box-connect-account-button-"], .classic-editor div[id^="change-media-button-"] { float: none; margin-top: 1em; } } @media (max-width: 640px) { .ep-box-blubrry-info-container { max-width: calc(100% - 50px); } a[id^="ep-box-connect-account-"], a[id^="pp-change-media-link-"] { float: none; width: 100%; } div[id^="ep-box-connect-account-button-"] { float: none; margin: 1em 0 0 1ch; } div[id^="change-media-button-"] { float: none; margin-top: 1em; } } /* More responsiveness with buttons */ @media (max-width: 892px) { .classic-editor .pp-blue-button, .classic-editor .pp-gray-button { display: block; } .classic-editor .pp-explicit-option, .classic-editor .explicit-selected { font-size: 12px; } .classic-editor .artwork-button { padding: 1em 2ch; } .classic-editor div[id^="apple-podcast-opt"] { padding: 6%; } .classic-editor div[id^="pp-display-player"], .classic-editor div[id^="pp-player-size"] { width: 100%; } .classic-editor div[id^="type-container"] { width: 100%; } .classic-editor input[id^="powerpress_duration_"][class="pp-ep-box-input"], .classic-editor input[id^="powerpress_duration_"][class="pp-ep-box-input"]:focus { width: 36px; padding: 6px; height: 28px; } .classic-editor select[id^="powerpress_category"] option { width: 100%; } }