diff --git a/City Of Mist Offical/city-of-mist.css b/City Of Mist Offical/city-of-mist.css deleted file mode 100644 index 8552a7c5ed..0000000000 --- a/City Of Mist Offical/city-of-mist.css +++ /dev/null @@ -1,6407 +0,0 @@ -/* GENERAL FORMATING START ----------------------------------------------------- GENERAL FORMATING START */ - -@font-face { - font-family: 'Contrail One'; - src: url('https://fonts.googleapis.com/css?family=Contrail+One'); -} - -@font-face { - font-family: 'Rock Salt'; - src: url('https://fonts.googleapis.com/css?family=Rock+Salt'); -} - - .sheet-hidden { - display: none; - } - - - .sheet-section { - width: 100%; - display: block; - clear: both; - padding: 0 !important; - - } - - .sheet-line { - width: 100%; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-stretch { - width: 100%; - } - - .sheet-right { - float: right; - } - - .sheet-center { - margin: auto; - text-align: center; - } - - .sheet-middle { - display: -webkit-flex; - display: flex; - -webkit-flex-wrap: wrap; - flex-wrap: wrap; - -webkit-align-content: center; - align-content: center; - } - - .sheet-left { - float: left; - } - - textarea { - resize: none; - } - - label { - color: #453428; - } - - textarea { - height: 50px; - } - - input[type=checkbox] { - box-shadow: none; - height: 18px; - width: 18px; - background: #fff; - vertical-align: middle; - } - - button[type=roll] .sheet-blank-roll-button::before { content: ''; } - - button[type=roll]:focus { - outline:0; - } - - .sheet-character_sheet { - width: 100%; - margin: 0px; - padding: 0px; - overflow-x: hidden; - } - -/* GENERAL FORMATING END ------------------------------------------------------- GENERAL FORMATING END */ - -/* SPECIAL CASE FORMATING START ------------------------------------------------ SPECIAL CASE FORMATING START */ - - /*CLEAR BUTTON ---------------------------------------------------------------- START*/ - - .sheet-clear_check { - opacity: 0; - position: relative; - top: 0px; - left: 0px; - cursor: pointer; - z-index: 1; - } - - .sheet-clear_button { - width: 100%; - height: 28px; - background: lightgrey; - border: solid; - border-width: 1px; - border-color: darkgrey; - border-radius: 5px; - } - - .sheet-clear_button:hover { - background: white; - } - - .sheet-clear_button:active { - background: white; - border-color: white; - } - - .sheet-clear_label{ - position: relative; - bottom: 22px; - } - - /*CLEAR BUTTON ----------------------------------------------------------------- END*/ - - .sheet-playbook_logostags { - color: black; - font-size: 12px; - font-style: italic; - background: #fff1a2; - } - - .sheet-playbook_mythostags { - color: white; - font-size: 12px; - font-style: italic; - background: #512b71; - } - - .sheet-playbook_statustags { - color: black; - font-size: 12px; - font-style: italic; - background: #d9e8ae; - } - - .sheet-playbook_spectrumtags { - color: black; - font-size: 12px; - font-style: italic; - background: #daaca3; - } - -/* SPECIAL CASE FORMATING END -------------------------------------------------- SPECIAL CASE FORMATING END */ - - .sheet-moves_mat { - position: relative; - top: -30px; - width: 100%; - height: 260px; - margin: 0px 0px -20px; - perspective: 2000px; - transform:translate3d(0,0,0); - -webkit-transform:translate3d(0,0,0); - z-index: 50; - - } - - .sheet-moves_sheet .sheet-move_button { - width: 200px; - margin: 5px; - - } - - .sheet-moves_sheet .sheet-move_button:hover { - background-color: white; - } - - .sheet-moves_sheet .sheet-move_button:active { - background-color: white; - border: white; - box-shadow: 0px 0px 1px white; - } - - .sheet-move_sheet_header { - width: 438px; - height: 36px; - margin: -10px -10px 10px -10px; - background-color: #726960; - - border-radius: 8px 8px 0px 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-moves_sheet_title { - height: 36px; - padding: 0px 5px; - margin: 0px 10px; - background: transparent; - border: none; - outline: none; - - - font-family: 'Contrail One', Sans-Serif; - line-height: 36px; - font-size: 26px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: white; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - text-align: left; - } - - .sheet-core_moves_sheet { - position: absolute; - left: calc(25% - 250px); ; - top: 0px; - transform: rotate(1.2deg) scale(0.9, 0.9); - } - - .sheet-cinematic_moves_sheet { - position: absolute; - left: calc(75% - 250px); ; - top: 0px; - transform: rotate(-1.2deg) scale(0.9, 0.9); - } - - .sheet-core_moves_sheet:hover { - z-index: 100; - } - - .sheet-cinematic_moves_sheet:hover { - z-index: 100; - } - - .sheet-moves_sheet { - - width: 500px; - background-color: #e6e0d3; - box-shadow: inset 0px 0px 40px 10px #d2cac3; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - mask-image: url(https://i.imgur.com/O6JNLDM.png); - mask-size: 100% auto; - mask-position: center center; - mask-repeat: repeat-y; - - -webkit-mask-image: url(https://i.imgur.com/O6JNLDM.png); - -webkit-mask-size: 100% auto; - -webkit-mask-position: center center; - -webkit-mask-repeat: repeat-y; - - padding: 30px 30px; - } - - .sheet-moves_sheet_inset { - border: 2px solid #726960; - border-radius: 10px; - - height: 100%; - padding: 10px; - margin: 0px auto; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-moves_sheet_line { - width: 100%; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - } - - .sheet-moves_sheet_column { - width: 100%; - height: 140px; - display: flex; - flex-direction: column; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-moves_sheet_number { - height: 60px; - width: 100%; - margin-bottom: 10px; - - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-moves_sheet_number .sheet-clear_button { - width: 60px; - height: 30px; - position: relative; - top: 14px; - margin-left: -20px; - margin-right: -10px; - - transform-origin: center center; - transform: rotate(-84deg) skew(6deg); - -ms-transform: rotate(-84deg) skew(6deg); /* IE 9 */ - -webkit-transform: rotate(-84deg) skew(6deg); /* Safari */ - } - - .sheet-moves_sheet_number .sheet-clear_button label { - width: 60px; - margin-right: 0px; - transform: rotate(0deg); - -ms-transform: rotate(0deg); /* IE 9 */ - -webkit-transform: rotate(0deg); /* Safari */ - transform-origin: center center; - } - - .sheet-moves_sheet_number label { - width: 60px; - margin-right: -40px; - transform: rotate(-84deg) skew(6deg); - -ms-transform: rotate(-84deg) skew(6deg); /* IE 9 */ - -webkit-transform: rotate(-84deg) skew(6deg); /* Safari */ - transform-origin: center center; - } - - .sheet-moves_sheet_number input[type=number] { - height: 60px; - margin-right: 10px; - background: white; - border: none; - padding: auto; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - text-align: center; - word-wrap: break-word; - word-break: keep-all; - overflow:hidden; - - font-family: Sans-Serif; - letter-spacing: -2px; - line-height: 60px; - font-size: 46px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: black; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - } - - .sheet-core_moves_check { - width: 125px; - margin-right: 10px; - white-space: nowrap; - position: relative; - top: -4px; - } - - .sheet-core_moves_check input[type="radio"] - { - opacity: 0; - width: 100%; - height: 36px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -50%; - } - - - .sheet-core_moves_check input[type="radio"] + span::before - { - content: "CORE MOVES"; - - font-family: 'Contrail One', Sans-Serif; - line-height: 36px; - font-size: 26px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: white; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - text-align: left; - - width: 100%; - height: 100%; - text-align: center; - display: inline-block; - vertical-align: middle; - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-core_moves_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-core_moves_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-cinematic_moves_check { - width: 175px; - margin-left: 10px; - white-space: nowrap; - position: relative; - top: -4px; - } - - .sheet-cinematic_moves_check input[type="radio"] - { - opacity: 0; - width: 100%; - height: 36px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -50%; - } - - - .sheet-cinematic_moves_check input[type="radio"] + span::before - { - content: "CINEMATIC MOVES"; - - font-family: 'Contrail One', Sans-Serif; - line-height: 36px; - font-size: 26px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: white; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - text-align: left; - - width: 100%; - height: 100%; - text-align: center; - display: inline-block; - vertical-align: middle; - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-cinematic_moves_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-cinematic_moves_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-core_moves_switch:not(:checked) ~ .sheet-core_moves_body { - display: none; - } - - .sheet-cinematic_moves_switch:not(:checked) ~ .sheet-cinematic_moves_body { - display: none; - } - - .sheet-burn_roll_switch:checked ~ .sheet-standard_roll_body { - display: none; - } - - .sheet-burn_roll_switch:not(:checked) ~ .sheet-burn_roll_body { - display: none; - } - - /* DYNAMITE CHECK ----------------------------------------------- DYNAMITE CHECK */ - - .sheet-dynamite_check { - white-space: nowrap; - margin: 5px; - } - - .sheet-dynamite_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-dynamite_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/fl8SIc1.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-dynamite_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-dynamite_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-dynamite_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-dynamite_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/fl8SIc1.png); - opacity: 1; - filter: brightness(0%); - -webkit-filter: brightness(0%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* BURN ROLL CHECK ----------------------------------------------- BURN ROLL CHECK */ - - .sheet-burn_roll_check { - white-space: nowrap; - margin: 5px; - } - - .sheet-burn_roll_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-burn_roll_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/U4fwJaK.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-burn_roll_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-burn_roll_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-burn_roll_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-burn_roll_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/U4fwJaK.png); - opacity: 1; - filter: brightness(0%); - -webkit-filter: brightness(0%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* MUTE CHECK ----------------------------------------------- MUTE CHECK */ - - .sheet-mute_check { - white-space: nowrap; - margin: 5px; - } - - .sheet-mute_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-mute_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/uwrfzd5.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-mute_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-mute_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-mute_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-mute_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/uwrfzd5.png); - opacity: 1; - filter: brightness(0%); - -webkit-filter: brightness(0%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* TOOLTIPS START ---------------------------------------------------------- TOOL TIPS START */ - - .sheet-moves_sheet_roll_tooltip { - height: 36px; - - position: absolute; - right: 115px; - top: -1px; - - - font-family: 'Contrail One', Sans-Serif; - font-size: 18px; - line-height: 36px; - text-align: right; - color: white; - } - - .sheet-dynamite_check:not(:hover) ~ .sheet-dynamite_tooltip, - .sheet-burn_roll_check:not(:hover) ~ .sheet-burn_roll_tooltip, - .sheet-mute_check:not(:hover) ~ .sheet-mute_tooltip { - display: none; - } - -/* CORE MOVE BAR START --------------------------------------------------------- CORE MOVE BAR START */ - - .sheet-core_moves_grid { - width: 100%; - height: 200px; - margin: 0px; - padding: 0px; - - position: relative; - - background: #D3D3D3; - } - - .sheet-core_power_indicator { - height: 160px; - width: 230px; - padding: 10px; - - background-color: white; - border-radius: 10px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - position: absolute; - top: calc(50% - 80px); - left: calc(50% - 115px); - - } - - .sheet-core_move_container_left { - display: flex; - flex-direction: column; - flex-wrap: nowrap; - justify-content: space-between; - - height: 170px; - width: 260px; - padding: 10px; - - background-color: white; - border-radius: 10px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - position: absolute; - top: calc(50% - 85px); - left: calc(20% - 130px); - - } - - .sheet-core_move_container_right { - display: flex; - flex-direction: column; - flex-wrap: nowrap; - justify-content: space-between; - height: 170px; - width: 260px; - padding: 10px; - - background-color: white; - border-radius: 10px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - position: absolute; - top: calc(50% - 85px); - left: calc(80% - 130px); - - } - - - .sheet-move_button { - width: 240px; - height: 30px; - padding: 0px; - background: lightgrey; - border: solid; - border-width: 1px; - border-color: darkgrey; - border-radius: 5px; - margin: 5px 10px; - } - - .sheet-move_button { - font-size: 0.75em; - } - - .sheet-move_button:hover { - } - - .sheet-move_button:active { - background: white; - } - - .sheet-move_button:before { - content: "" !important; - font-size: 0.75em; - display: none; - } - - .sheet-move_button label{ - text-transform: uppercase; - font-size: 0.75em; - } - -/* CORE MOVE BAR END ----------------------------------------------------------- CORE MOVE BAR END */ - -/* THEME CARD MAT START -------------------------------------------------------- THEME CARD MAT START */ - - /* CARD POSITIONING -------------------------------------------------------- CARD POSITIONING */ - - .sheet-theme_card_mat { - width: 100%; - min-height: 700px; - margin: 0px 0px 40px; - padding: 0px; - - position: relative; - transform:translate3d(0,0,0); - -webkit-transform:translate3d(0,0,0); - perspective: 2000px; - } - - .sheet-theme_card_1, - .sheet-theme_card_2, - .sheet-theme_card_3, - .sheet-theme_card_4, - .sheet-theme_card_5, - .sheet-theme_card_6, - .sheet-theme_card_7, - .sheet-theme_card_8, - .sheet-theme_card_t { - position: absolute; - transition: all 0.6s ease-in-out, z-index 0s, transform 0.2s ease-in-out, top 0.2s ease-in-out; - z-index: 200; - transform-origin: center top; - filter: blur(0px) grayscale(0%) drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - padding: 0px; - margin: 0px; - border: none; - overflow: visible; - } - - .sheet-theme_card_t { - top: 70px; - left: calc(85% - 130px); - transform: rotate(6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_1 { - top: 50px; - left: calc(71% - 130px); - transform: rotate(3.6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_2 { - top: 40px; - left: calc(57% - 130px); - transform: rotate(1.2deg) scale(0.9, 0.9); - } - - .sheet-theme_card_3 { - top: 40px; - left: calc(43% - 130px); - transform: rotate(-1.2deg) scale(0.9, 0.9); - } - - .sheet-theme_card_4 { - top: 50px; - left: calc(29% - 130px); - transform: rotate(-3.6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_5 { - visibility: hidden; - opacity: 0; - top: 50px; - left: calc(29% - 130px); - transform: rotate(-3.6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_6 { - visibility: hidden; - opacity: 0; - top: 50px; - left: calc(29% - 130px); - transform: rotate(-3.6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_7 { - visibility: hidden; - opacity: 0; - top: 50px; - left: calc(29% - 130px); - transform: rotate(-3.6deg) scale(0.9, 0.9); - } - - .sheet-theme_card_8 { - top: 70px; - left: calc(15% - 130px); - transform: rotate(-6deg) scale(0.9, 0.9); - } - - - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1 { - top: 53px; - left: calc(73.3% - 130px); - transform: rotate(4deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2 { - - top: 42px; - left: calc(61.6% - 130px); - transform: rotate(2deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3 { - top: 39px; - left: calc(50% - 130px); - transform: rotate(0deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4 { - top: 42px; - left: calc(38.4% - 130px); - transform: rotate(-2deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5 { - visibility: visible; - opacity: 1; - top: 53px; - left: calc(26.7% - 130px); - transform: rotate(-4deg) scale(0.9, 0.9); - } - - - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1 { - top: 55px; - left: calc(75% - 130px); - transform: rotate(4.29deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2 { - top: 45px; - left: calc(65% - 130px); - transform: rotate(2.57deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3 { - top: 39px; - left: calc(55% - 130px); - transform: rotate(0.86deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4 { - top: 39px; - left: calc(45% - 130px); - transform: rotate(-0.86deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5 { - visibility: visible; - opacity: 1; - top: 45px; - left: calc(35% - 130px); - transform: rotate(-2.57deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6 { - visibility: visible; - opacity: 1; - top: 55px; - left: calc(25% - 130px); - transform: rotate(-4.29deg) scale(0.9, 0.9); - } - - - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1 { - top: 56px; - left: calc(76.2% - 130px); - transform: rotate(4.5deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2 { - top: 47px; - left: calc(67.5% - 130px); - transform: rotate(3deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3 { - top: 41px; - left: calc(58.7% - 130px); - transform: rotate(1.5deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4 { - visibility: visible; - opacity: 1; - top: 39px; - left: calc(50% - 130px); - transform: rotate(0deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5 { - visibility: visible; - opacity: 1; - top: 41px; - left: calc(41.3% - 130px); - transform: rotate(-1.5deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6 { - visibility: visible; - opacity: 1; - top: 47px; - left: calc(32.5% - 130px); - transform: rotate(-3deg) scale(0.9, 0.9); - } - - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7 { - visibility: visible; - opacity: 1; - top: 56px; - left: calc(23.8% - 130px); - transform: rotate(-4.5deg) scale(0.9, 0.9); - } - - - - - .sheet-theme_card_1:hover, - .sheet-theme_card_2:hover, - .sheet-theme_card_3:hover, - .sheet-theme_card_4:hover, - .sheet-theme_card_8:hover, - .sheet-theme_card_t:hover, - .sheet-theme_card_1:focus-within, - .sheet-theme_card_2:focus-within, - .sheet-theme_card_3:focus-within, - .sheet-theme_card_4:focus-within, - .sheet-theme_card_8:focus-within, - .sheet-theme_card_t:focus-within { - z-index: 250; - top: 30px; - transform: rotate(0deg) scale(1, 1); - } - - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_8:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_t:hover, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_8:focus-within, - .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_t:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_8:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_t:hover, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_8:focus-within, - .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_t:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_8:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_t:hover, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_8:focus-within, - .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_t:focus-within { - z-index: 250; - top: 30px; - transform: rotate(0deg) scale(1, 1); - } - - .sheet-playbook_switch:checked ~ .sheet-theme_card_1, - .sheet-playbook_switch:checked ~ .sheet-theme_card_2, - .sheet-playbook_switch:checked ~ .sheet-theme_card_3, - .sheet-playbook_switch:checked ~ .sheet-theme_card_4, - .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_1, - .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_2, - .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_3, - .sheet-playbook_switch:checked ~ .sheet-theme_card_crew, - .sheet-playbook_switch:checked ~ .sheet-theme_card_character { - top: 40px; - left: 20px; - transform: rotate(0deg) scale(0.9, 0.9); - filter: blur(3px) grayscale(60%) drop-shadow(0px 20px 25px rgba(0,0,0,0)); - } - - .sheet-playbook_character_switch:checked ~ .sheet-theme_card_character, - .sheet-playbook_crew_switch:checked ~ .sheet-theme_card_crew, - .sheet-playbook_theme1_themebook_switch:checked ~ .sheet-theme_card_1, - .sheet-playbook_theme2_themebook_switch:checked ~ .sheet-theme_card_2, - .sheet-playbook_theme3_themebook_switch:checked ~ .sheet-theme_card_3, - .sheet-playbook_theme4_themebook_switch:checked ~ .sheet-theme_card_4, - .sheet-playbook_extra_theme1_themebook_switch:checked ~ .sheet-extra_theme_card_1, - .sheet-playbook_extra_theme2_themebook_switch:checked ~ .sheet-extra_theme_card_2, - .sheet-playbook_extra_theme3_themebook_switch:checked ~ .sheet-extra_theme_card_3 { - z-index: 300; - top: 30px; - transform: rotate(0deg) scale(1, 1); - filter: blur(0px) grayscale(0%) drop-shadow(0px 20px 25px rgba(0,0,0,0.25)); - } - -/* THEME CARD MAT END ---------------------------------------------------------- THEME CARD MAT END */ - -/* THEME CARD STYLING ---------------------------------------------------------- START */ - - /* CARD FLIP MECHANICS ------------------------------------- CARD FLIP MECHANICS */ - - .sheet-card_flip { - height: 100%; - width: 100%; - - position: absolute; - transform-origin: right center; - transform-style: preserve-3d; - -webkit-transform-style: preserve-3d; - - transition: all 0.6s; - -webkit-transition: all 0.6s; - - transition-timing-function: ease-in-out; - -webkit-transition-timing-function: ease-in-out; - } - - .sheet-side { - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - backface-visibility: hidden; - position: absolute; - overflow: visible; - } - - .sheet-front { - transform: rotateY( 360deg ); - } - - .sheet-back { - transform: rotateY( 180deg ); - } - - .sheet-flip:checked ~ .sheet-card_flip { - transform: translateX( -100% ) rotateY( -180deg ); - } - - /* CARD STYLING ------------------------------------------------ CARD STYLING */ - - .sheet-theme_card_container { - height: 660px; - width: 260px; - float: left; - flex-shrink: 1; - padding: 0px; - border: none; - - perspective: 2000px; - - } - - .sheet-theme_card input[type=checkbox] { - box-shadow: none; - height: 18px; - width: 18px; - background: #fff; - vertical-align: middle; - } - - .sheet-theme_card { - height: 100%; - width: 100%; - border: 1px solid white; - border-radius: 12px 12px 12px 12px; - padding: 10px; - display: flex; - flex-flow: column nowrap; - - } - - .sheet-theme_inset { - display: flex; - flex-flow: column nowrap; - margin: 0px; - padding: 0px; - height: 100%; - width: 100%; - border-radius: 10px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - box-shadow: inset 0px 0px 55px 25px #d2cac3; - } - - .sheet-theme_header { - height: 32px; - border-radius: 10px 10px 0px 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-theme_footer { - height: 32px; - margin-top: auto; - border-radius: 0px 0px 10px 10px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-theme_select { - margin: auto; - } - - .sheet-theme_select select { - height: 18px; - width: 100%; - padding: 0px 5px; - margin: auto; - background: transparent; - border: none; - outline: none; - - color: white; - text-shadow: 0px 0px 2px black; - font-family: 'Contrail One', Sans-Serif; - line-height: 16px; - font-size: 16px; - font-style: normal; - text-transform: uppercase; - } - - .sheet-theme_select option { - text-align: left; - } - - .sheet-theme_body { - height: 574px; - margin: 0px; - padding: 0px; - border: none; - } - - .sheet-theme_details { - padding: 0px; - margin: 0px; - } - - .sheet-theme_title { - display: block; - width: 95%; - height: 84px; - background: transparent; - border: none; - margin: 6px auto; - padding: auto; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - text-align: center; - word-wrap: break-word; - word-break: keep-all; - overflow:hidden; - - font-family: 'Contrail One', Sans-Serif; - letter-spacing: -2px; - line-height: 40px; - font-size: 38px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: black; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - } - - .sheet-theme_identity_mystery { - display: block; - width: 95%; - height: 36px; - border: none; - outline: none; - margin: 2px auto 6px; - padding: 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - font-family: 'Rock Salt', 'Shadows Into Light', cursive; - font-size: 16px; - font-style: normal; - font-weight: 600; - letter-spacing: 0px; - line-height: 18px; - text-transform: uppercase; - - word-wrap: break-word; - word-break: keep-all; - overflow: hidden; - background: transparent; - } - - .sheet-theme_concept { - display: block; - width: 90%; - height: 42px; - border: none; - outline: none; - margin: 2px auto 6px; - padding: 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - font-size: 12px; - font-style: normal; - font-weight: normal; - letter-spacing: 0px; - line-height: 14px; - - word-wrap: break-word; - word-break: keep-all; - overflow: hidden; - background: transparent; - } - - .sheet-theme_label { - font-size: 16px; - font-weight: bolder; - text-shadow: 0px 0px 2px #534233; - vertical-align: text-top; - margin: auto 0px; - - } - - .sheet-theme_divider { - height: 4px; - border-radius: 2px; - margin: auto; - } - - .sheet-theme_exp_label { - height: 18px; - margin: 3px; - padding: 0px; - font-size: 12px; - line-height: 18px; - } - - /* ATTENTION CHECK ---------------------------------------------------------- ATTENTION CHECK */ - - .sheet-attention_check { - width: 18px; - height: 18px; - margin: 0px 1px; - padding: 0px; - - position: relative; - white-space: nowrap; - transform: scale(0.9, 0.9); - transform-origin: center center; - - } - - .sheet-attention_check input[type="checkbox"] - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-attention_check input[type="checkbox"] + span::before - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/nOPQB6O.png); - opacity: 1; - - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-attention_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-attention_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-attention_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-attention_image span - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/nOPQB6O.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* CRACK CHECK ---------------------------------------------------------- CRACK CHECK */ - - .sheet-crack_check { - width: 18px; - height: 18px; - margin: 0px 1px; - padding: 0px; - - position: relative; - white-space: nowrap; - transform: scale(0.9, 0.9); - transform-origin: center center; - } - - .sheet-crack_check input[type="checkbox"] - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-crack_check input[type="checkbox"] + span::before - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/LZlk31P.png); - opacity: 1; - - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-crack_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-crack_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-crack_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-crack_image span - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/LZlk31P.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* CRACK CHECK ---------------------------------------------------------- CRACK CHECK */ - - .sheet-buildup_check { - width: 18px; - height: 18px; - margin: 0px 3px; - padding: 0px; - - position: relative; - white-space: nowrap; - transform: scale(0.9, 0.9); - transform-origin: center center; - } - - .sheet-buildup_check input[type="checkbox"] - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-buildup_check input[type="checkbox"] + span::before - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/VpWGwCT.png); - opacity: 1; - - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-buildup_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-buildup_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-buildup_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-buildup_image span - { - width: 18px; - height: 18px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/VpWGwCT.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* EXPERIENC ROW -------------------------------------------------------- START */ - - .sheet-exp_grid { - width: 100%; - margin: 0px; - display: flex; - flex-direction: row-reverse; - flex-wrap: nowrap; - justify-content: flex-end; - } - - .sheet-attention_check:hover ~ .sheet-attention_check span, - .sheet-crack_check:hover ~ .sheet-crack_check span, - .sheet-buildup_check:hover ~ .sheet-buildup_check span { - filter: brightness(200%); - -webkit-filter: brightness(200%); - } - - .sheet-attention_check:hover span, - .sheet-crack_check:hover span, - .sheet-buildup_check:hover span, - .sheet-attention_check:checked ~ .sheet-attention_check span, - .sheet-crack_check:checked ~ .sheet-crack_check span, - .sheet-buildup_check:checked ~ .sheet-buildup_check span { - filter: brightness(200%); - -webkit-filter: brightness(200%); - } - - /* EXPERIENC ROW -------------------------------------------------------- END */ - - .sheet-theme_powertags { - height: 250px; - padding: 0px 6px; - margin: 0px 0px auto; - } - - .sheet-theme_weaknesstags { - height: 120px; - padding: 0px 6px; - margin: 0px; - } - - .sheet-theme_line { - width: 100%; - height: 22px; - margin: auto 0px; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-theme_tag_label { - font-size: 14px; - width: 100%; - height: 18px; - line-height: 18px; - padding: 0px 5px; - background: transparent; - border: none; - outline: none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - overflow:hidden; - resize:none; - } - - .sheet-theme_improvements { - padding: 6px 6px 0px; - margin: 0px 0px auto; - } - - .sheet-theme_improv_label { - font-weight: bold; - line-height: 1.0; - margin: auto 0px; - } - - .sheet-theme_improv_desc{ - margin: 3px 0px 5px; - font-size: 11px; - line-height: 1.0; - font-weight: normal; - word-wrap: break-word; - } - - .sheet-theme_improvement_label { - font-size: 14px; - width: 240px; - height: 18px; - line-height: 18px; - - margin: auto; - padding: 0px 5px; - - background: transparent; - border: none; - outline: none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - overflow:hidden; - resize:none; - - - font-weight: bold; - line-height: 1.0; - } - - .sheet-theme_improvement_field { - margin: 3px 0px 5px; - font-size: 11px; - line-height: 1.0; - font-weight: normal; - - word-wrap: break-word; - word-break: keep-all; - overflow: hidden; - - height: 55px; - background: transparent; - border: none; - outline: none; - margin: 0px auto; - padding: 0px; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - } - - .sheet-theme_flipside { - height: 120px; - padding: 0px 6px; - margin: 0px; - overflow: hidden; - } - - .sheet-theme_fliptext { - - display: block; - height: 100%; - width: 100%; - border: none; - outline: none; - margin: 0px auto; - padding: 0px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - font-size: 14px; - font-style: normal; - font-weight: normal; - letter-spacing: 0px; - line-height: 16px; - - word-wrap: break-word; - word-break: keep-all; - overflow: hidden; - background: transparent; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - } - - .sheet-theme_flip { - width: 100%; - height: 32px; - margin: 0px; - } - - - .sheet-theme_flip input[type="radio"] { - opacity: 0; - width: 100%; - height: 32px; - position: relative; - top: 0px; - left: 50%; - margin: -50%; - z-index: 1; - } - - - .sheet-theme_flip span { - width: 100%; - height: 32px; - border: none; - line-height: 32px; - text-align: center; - display: inline-block; - vertical-align: middle; - - font-family: 'Contrail One', Sans-Serif; - font-size: 16px; - letter-spacing: 0px; - font-style: normal; - font-variant: small-caps; - font-weight: bolder; - color: white; - text-shadow: 0px 0px 1px black; - text-transform: uppercase; - position: relative; - top: 1px; - } - - /* CHARACTER CARD --------------------------------------------- CHARACTER CARD */ - - .sheet-identity_select { - height: 16px; - width: 100%; - padding: 0px 8px; - margin: auto; - - color: white; - text-shadow: 0px 0px 2px black; - font-family: 'Contrail One', Sans-Serif; - line-height: 16px; - font-size: 16px; - font-style: normal; - vertical-align: middle; - text-transform: uppercase; - } - - .sheet-identity_concept, - .sheet-theme_identity_mystery { - display: block; - width: 90%; - height: 80px; - border: none; - outline: none; - margin: 2px auto; - padding-right: 5%; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - font-family: fantasy; - font-size: 16px; - font-style: italic; - font-weight: 600; - letter-spacing: 1px; - line-height: 18px; - text-transform: uppercase; - - word-wrap: break-word; - word-break: keep-all; - overflow: overlay; - background: transparent; - } - - .sheet-identity_theme { - width: 100%; - padding: 0px 6px; - margin: 0px ; - } - - .sheet-identity_crew { - width: 225px; - padding: 0px 6px; - height: 140px; - margin: 0px ; - } - - .sheet-identity_story { - width: 225px; - padding: 0px 6px; - height: 140px; - margin: auto 0px 0px; - } - - .sheet-identity_evolution { - width: 225px; - height: 265px; - padding: 0px 6px; - margin: 6px auto 6px; - - } - - .sheet-evo_line { - width: 100%; - margin: 4px 0px; - } - - .sheet-evo_checkbox { - float: left; - margin-right: 4px; - } - - .sheet-evo_label { - font-size: 12px; - padding: auto 0px; - } - - .sheet-evo_extratheme1:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_extratheme2, - .sheet-evo_extratheme2:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_extratheme3, - .sheet-evo_dynamite1:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_dynamite2, - .sheet-evo_dynamite2:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_dynamite3 { - visibility: hidden; - } - - .sheet-identity_notes { - width: 225px; - height: 265px; - padding: 0px 6px; - margin: 6px auto; - } - - .sheet-identity_line { - width: 100%; - height: 22px; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-identity_column { - width: 80px; - float: right; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-identity_helphurt { - height: 18px; - width: 40px; - padding: 0px; - margin: 0px auto; - text-align: center; - background: transparent; - border: none; - outline: none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - font-size: 16px; - font-style: normal; - font-weight: normal; - letter-spacing: 0px; - line-height: 18px; - text-transform: uppercase; - - word-wrap: break-word; - word-break: keep-all; - overflow: hidden; - } - - /* LOGOS STYLING ------------------------------------------- LOGOS STYLING */ - - .sheet-logos_card .sheet-theme_card { - background-color: #e6e0d3; - box-shadow: inset 0px 0px 25px 5px #d2cac3; - } - - .sheet-logos_card .sheet-theme_inset { - box-shadow: inset 0px 0px 55px 25px #d2cac3; - } - - .sheet-logos_card .sheet-theme_header, - .sheet-logos_card .sheet-theme_footer { - background-color: #a1574a ; - } - - .sheet-logos_card .sheet-theme_select option { - background-color: #a1574a ; - } - - .sheet-logos_card .sheet-theme_divider { - background-color: #a1574a ; - } - - /* MYTHOS STYLING ----------------------------------------- MYTHOS STYLING */ - - .sheet-mythos_card .sheet-theme_card { - background-color: #e4dfd4; - box-shadow: inset 0px 0px 25px 5px #cbbfcd; - } - - .sheet-mythos_card .sheet-theme_inset { - background-color: #ccc0cc; - box-shadow: inset 0px 0px 55px 25px #b19eba; - } - - .sheet-mythos_card .sheet-theme_header, - .sheet-mythos_card .sheet-theme_footer { - background-color: #6f5d6e ; - } - - .sheet-mythos_card .sheet-theme_select option { - background-color: #6f5d6e ; - } - - .sheet-mythos_card .sheet-theme_divider { - background-color: #6f5d6e ; - } - - /* IDENTITY STYLING ------------------------------------- IDENTITY STYLING */ - - .sheet-identity_card .sheet-theme_card { - background-color: #e1ddd4; - box-shadow: inset 0px 0px 25px 5px #cec9c5; - } - - .sheet-identity_card .sheet-theme_inset { - background-color: #e1ded9; - box-shadow: inset 0px 0px 55px 25px #cec9c5; - } - - .sheet-identity_card .sheet-theme_header, - .sheet-identity_card .sheet-theme_footer { - background-color: #726960 ; - } - - .sheet-identity_card .sheet-theme_select option { - background-color: #726960 ; - } - - .sheet-identity_card .sheet-theme_divider { - background-color: #726960 ; - } - - /* CHECK STYLING ----------------------------------------------- CHECK STYLING */ - - /* LOGOS CHECK ----------------------------------------------- LOGOS CHECK */ - - .sheet-logos_check { - white-space: nowrap; - } - - .sheet-logos_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-logos_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/87FMS1R.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-logos_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-logos_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-logos_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/87FMS1R.png); - opacity: 1; - filter: brightness(0%); - -webkit-filter: brightness(0%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* MYTHOS CHECK --------------------------------------------- MYTHOS CHECK */ - - .sheet-mythos_check { - white-space: nowrap; - } - - .sheet-mythos_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-mythos_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/QnGFnMB.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-mythos_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-mythos_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-mythos_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/HgywpVb.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* IDENTITY CHECK ----------------------------------------- IDENTITY CHECK */ - - .sheet-identity_check { - white-space: nowrap; - } - - .sheet-identity_check input[type="checkbox"] - { - opacity: 0.0; - width: 33px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px -17px; - } - - - .sheet-identity_check input[type="checkbox"] + span::before - { - width: 33px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/YrYX9ri.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-identity_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-identity_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* CREW CHECK ------------------------------------------------- CREW CHECK */ - - .sheet-crew_check { - white-space: nowrap; - } - - .sheet-crew_check input[type="checkbox"] - { - opacity: 0.0; - width: 33px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px -17px; - } - - - .sheet-crew_check input[type="checkbox"] + span::before - { - width: 33px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/xEFubud.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-crew_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-crew_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* EXTRA CHECK ------------------------------------------------- EXTRA CHECK */ - - .sheet-extra_check { - white-space: nowrap; - } - - .sheet-extra_check input[type="checkbox"] - { - opacity: 0.0; - width: 33px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px -17px; - } - - - .sheet-extra_check input[type="checkbox"] + span::before - { - width: 33px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/tF4WDzo.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-extra_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-extra_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* BURN CHECK -------------------------------------------------- BURN CHECK*/ - - .sheet-burn_check { - white-space: nowrap; - } - - .sheet-burn_check input[type="checkbox"] - { - opacity: 0.0; - width: 18px; - height: 18px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -9px; - } - - - .sheet-burn_check input[type="checkbox"] + span::before - { - width: 18px; - height: 18px; - font-size: 18px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/OSiNxHY.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-burn_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-burn_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* PLAYBOOK CHECK ------------------------------------------ PLAYBOOK CHECK*/ - - .sheet-playbook_check { - display: none; - } - .sheet-playbook_check input[type="checkbox"] - { - opacity: 0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 13px; - margin: -13px; - cursor: pointer; - z-index: 2; - } - - - .sheet-playbook_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - font-size: 20px; - opacity: 1; - z-index: 1; - content: url(https://i.imgur.com/3c9mAC3.png); - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-playbook_check input[type="checkbox"]:checked + span::before { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-playbook_check input[type="checkbox"]:active + span::before { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* CARD MECHANICS ---------------------------------------------------------- CARD MECHANICS */ - - /* LOGOS MYTHOS TOGGLE ------------------------------------------------- LOGOS MYTHOS TOGGLE */ - - .sheet-logos_1_card, - .sheet-logos_2_card, - .sheet-logos_3_card, - .sheet-logos_4_card{ - display: initial; - } - - .sheet-mythos_1_card, - .sheet-mythos_2_card, - .sheet-mythos_3_card, - .sheet-mythos_4_card{ - display: initial; - } - - .sheet-mythos_1:checked ~ .sheet-logos_1_card, - .sheet-mythos_2:checked ~ .sheet-logos_2_card, - .sheet-mythos_3:checked ~ .sheet-logos_3_card, - .sheet-mythos_4:checked ~ .sheet-logos_4_card{ - display: none; - } - - .sheet-logos_1:checked ~ .sheet-mythos_1_card, - .sheet-logos_2:checked ~ .sheet-mythos_2_card, - .sheet-logos_3:checked ~ .sheet-mythos_3_card, - .sheet-logos_4:checked ~ .sheet-mythos_4_card{ - display: none; - } - - /* LOGOS SELECT -------------------------------------------------------- LOGOS SELECT */ - .sheet-body_custom, - .sheet-body_event, - .sheet-body_relationship, - .sheet-body_mission, - .sheet-body_personality, - .sheet-body_possessions, - .sheet-body_routine, - .sheet-body_training { - display: none; - } - - - .sheet-switch_custom:checked ~ .sheet-body_custom, - .sheet-switch_event:checked ~ .sheet-body_event, - .sheet-switch_relationship:checked ~ .sheet-body_relationship, - .sheet-switch_mission:checked ~ .sheet-body_mission, - .sheet-switch_personality:checked ~ .sheet-body_personality, - .sheet-switch_possessions:checked ~ .sheet-body_possessions, - .sheet-switch_routine:checked ~ .sheet-body_routine, - .sheet-switch_training:checked ~ .sheet-body_training{ - display: initial; - } - - - /* MYTHOS SELECT ------------------------------------------------------- MYTHOS SELECT */ - .sheet-body_adaptation, - .sheet-body_bastion, - .sheet-body_divination, - .sheet-body_express, /* body_expression breaks css for some reason, thus abreviated to body_express */ - .sheet-body_mobility, - .sheet-body_relic, - .sheet-body_subversion { - display: none; - } - - .sheet-switch_adaptation:checked ~ .sheet-body_adaptation, - .sheet-switch_bastion:checked ~ .sheet-body_bastion, - .sheet-switch_divination:checked ~ .sheet-body_divination, - .sheet-switch_express:checked ~ .sheet-body_express, - .sheet-switch_mobility:checked ~ .sheet-body_mobility, - .sheet-switch_relic:checked ~ .sheet-body_relic, - .sheet-switch_subversion:checked ~ .sheet-body_subversion { - display: initial; - } - - /* EXTRA SELECT ------------------------------------------------------- EXTRA SELECT */ - .sheet-body_ally, - .sheet-body_base, - .sheet-body_ride { - display: none; - } - - .sheet-switch_ally:checked ~ .sheet-body_ally, - .sheet-switch_base:checked ~ .sheet-body_base, - .sheet-switch_ride:checked ~ .sheet-body_ride { - display: initial; - } - - /* TAG TOGGLE ---------------------------------------------------------- TAG TOGGLE */ - - .sheet-tag_A, - .sheet-tag_B, - .sheet-tag_C, - .sheet-tag_D, - .sheet-tag_E, - .sheet-tag_F, - .sheet-tag_G, - .sheet-tag_H, - .sheet-tag_I, - .sheet-tag_J, - .sheet-tag_K{ - display: none; - } - - .sheet-add_A:checked ~ .sheet-tag_A, - .sheet-add_B:checked ~ .sheet-tag_B, - .sheet-add_C:checked ~ .sheet-tag_C, - .sheet-add_D:checked ~ .sheet-tag_D, - .sheet-add_E:checked ~ .sheet-tag_E, - .sheet-add_F:checked ~ .sheet-tag_F, - .sheet-add_G:checked ~ .sheet-tag_G, - .sheet-add_H:checked ~ .sheet-tag_H, - .sheet-add_I:checked ~ .sheet-tag_I, - .sheet-add_J:checked ~ .sheet-tag_J, - .sheet-add_K:checked ~ .sheet-tag_K{ - display: flex; - } - - /* BURN TOGGLE --------------------------------------------------------- BURN TOGGLE */ - - .sheet-burned { - display: initial; - } - - .sheet-burn { - margin-right: 0px; - } - - .sheet-burn:checked ~ .sheet-burned { - display: none; - } - - /* IMPROVEMENT TOGGLE -------------------------------------------------- IMPROVEMENT TOGGLE */ - - .sheet-imp_buttons { - display: none; - } - - .sheet-imp_active:checked ~ .sheet-imp_buttons { - display: initial; - } - -/* THEME CARD STYLING ----------------------------------------------------------- END */ - -/* PLAYBOOK FRAME START -------------------------------------------------------- PLAYBOOK FRAME START */ - .sheet-playbook_mat { - height: auto; - width: 100%; - margin: 0px; - padding: 0px; - overflow: hidden; - position: relative; - background: white; - - transition: all 0.6s ease-in-out; - -webkit-transform:translate3d(0,0,0); - } - - .sheet-playbook_top { - background-image: url("https://i.imgur.com/JVxBgF8.png"); - background-repeat: repeat-x; - background-position: center; - height: 40px; - width: 100%; - top: 0px; - position: absolute; - - filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.5)); - z-index: 100; - } - - .sheet-playbook_bottom { - background-image: url("https://i.imgur.com/OPmtxW0.png"); - background-repeat: repeat-x; - background-position: center; - height: 60px; - width: 100%; - bottom: 18px; - position: absolute; - - filter: drop-shadow(0px -6px 5px rgba(0, 0, 0, 0.25)); - z-index: 100; - } - - .sheet-playbook_whiteout { - height: 800px; - width: 100%; - background-color: white; - - position: absolute; - top: 0px; - z-index: 120; - - transition: all 0.6s ease-in-out; - opacity: 1; - visibility: visible; - - } - - .sheet-playbook_switch:checked ~ .sheet-playbook_mat .sheet-playbook_whiteout{ - opacity: 0; - visibility: hidden; - } - - .sheet-playbook_scrollmargin { - height: 20px; - width: 100%; - background: white; - position: absolute; - bottom: 0px; - left: 0px; - display: none; - } - - .sheet-playbook_body { - height: 0px; - margin: 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - overflow: hidden; - - transition: all 0.6s ease-in-out; - opacity: 0; - - } - - - .sheet-playbook_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body { - height: 840px; - opacity: 1; - } - - .sheet-playbook_content { - height: 840px; - width: 101%; - margin: 0px; - padding: 40px 20px 0px 300px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - overflow-x: scroll; - overflow-y: hidden; - - display: flex; - flex-wrap: nowrap; - - } - - .sheet-playbook_content_back_margin { - flex: 0 0 10px; - margin: 0px 10px; - } - - .sheet-playbook_content::-webkit-scrollbar-button{ display: none; } - .sheet-playbook_content::-webkit-scrollbar-thumb{ background-color: black; } - .sheet-playbook_content::-webkit-scrollbar-track{ background-color: white; } - .sheet-playbook_content::-webkit-scrollbar{ height: 20px; } - - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { - opacity: 1; - visibility: visible; - } - - .sheet-playbook_character_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_crew_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_theme1_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_theme2_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_theme3_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_theme4_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { - opacity: 0; - visibility: hidden; - } - - .sheet-playbook_character_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_buttons, - .sheet-playbook_crew_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew_buttons, - .sheet-playbook_theme1_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_buttons, - .sheet-playbook_theme2_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_buttons, - .sheet-playbook_theme3_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_buttons, - .sheet-playbook_theme4_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_buttons { - opacity: 0; - visibility: hidden; - } - - .sheet-playbook_themebook_mythos1_switch:not(:checked) ~ .sheet-playbook_themebook_mythos1, - .sheet-playbook_themebook_logos1_switch:not(:checked) ~ .sheet-playbook_themebook_logos1, - .sheet-playbook_themebook_mythos2_switch:not(:checked) ~ .sheet-playbook_themebook_mythos2, - .sheet-playbook_themebook_logos2_switch:not(:checked) ~ .sheet-playbook_themebook_logos2, - .sheet-playbook_themebook_mythos3_switch:not(:checked) ~ .sheet-playbook_themebook_mythos3, - .sheet-playbook_themebook_logos3_switch:not(:checked) ~ .sheet-playbook_themebook_logos3, - .sheet-playbook_themebook_mythos4_switch:not(:checked) ~ .sheet-playbook_themebook_mythos4, - .sheet-playbook_themebook_logos4_switch:not(:checked) ~ .sheet-playbook_themebook_logos4 { - opacity: 0; - visibility: hidden; - } - - .sheet-playbook_character_creation_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_creation, - .sheet-playbook_character_evolution_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_evolution, - .sheet-playbook_mythos_growth_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_mythos_growth, - .sheet-playbook_logos_growth_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_logos_growth, - .sheet-playbook_mythos_crisis_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_mythos_crisis, - .sheet-playbook_logos_crisis_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_logos_crisis { - display: none; - } - - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, - .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, - .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, - .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, - .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, - .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, - .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { - display: none; - } - - /* THEMEBOOKS -------------------------------------------------------------- THEMEBOOKS*/ - - .sheet-playbook_themebook { - height: 660px; - flex: 0 0 2560px; - display: flex; - flex-wrap: nowrap; - } - - .sheet-playbook_tagbook { - height: 640px; - flex: 0 0 620px; - display: flex; - flex-wrap: nowrap; - margin: 0px 10px; - } - - .sheet-switch_custom:not(:checked) ~ .sheet-playbook_custom, - .sheet-switch_adaptation:not(:checked) ~ .sheet-playbook_adaptation, - .sheet-switch_bastion:not(:checked) ~ .sheet-playbook_bastion, - .sheet-switch_divination:not(:checked) ~ .sheet-playbook_divination, - .sheet-switch_express:not(:checked) ~ .sheet-playbook_express, - .sheet-switch_mobility:not(:checked) ~ .sheet-playbook_mobility, - .sheet-switch_relic:not(:checked) ~ .sheet-playbook_relic, - .sheet-switch_subversion:not(:checked) ~ .sheet-playbook_subversion { - display: none; - } - - .sheet-switch_custom:not(:checked) ~ .sheet-playbook_custom, - .sheet-switch_event:not(:checked) ~ .sheet-playbook_event, - .sheet-switch_relationship:not(:checked) ~ .sheet-playbook_relationship, - .sheet-switch_mission:not(:checked) ~ .sheet-playbook_mission, - .sheet-switch_personality:not(:checked) ~ .sheet-playbook_personality, - .sheet-switch_possessions:not(:checked) ~ .sheet-playbook_possessions, - .sheet-switch_routine:not(:checked) ~ .sheet-playbook_routine, - .sheet-switch_training:not(:checked) ~ .sheet-playbook_training{ - display: none; - } - -/* PLAYBOOK FRAME END ---------------------------------------------------------- PLAYBOOK FRAME END */ - -/* PLAYBOOK INTERIOR START ----------------------------------------------------- PLAYBOOK INTERIOR START */ - .sheet-playbook_content { - position: absolute; - top: 0px; - transition: all 0.6s ease-in-out; - - font-family: Sans-Serif; - font-size: 11px; - line-height: 16px; - text-align: justify; - text-justify: inter-word; - } - - .sheet-playbook_column { - height: 100%; - margin: 0px 10px; - flex: 0 0 300px; - - } - - .sheet-playbook_line { - width: 100%; - margin: 11px 0px 11px; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - } - - .sheet-playbook_body ul { - margin: 8px 0px 8px 16px; - } - - .sheet-playbook_body li { - line-height: 14px; - margin: 8px 0px; - } - - .sheet-playbook_entry { - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; - } - - .sheet-playbook_big_title { - font-size: 32px; - line-height: 32px; - font-weight: 900; - transform-origin: top; - transform: scaleY(2.4); - letter-spacing: 4px; - text-transform: uppercase; - margin: -12px 0px 44px; - } - - .sheet-playbook_small_title { - font-size: 26px; - line-height: 26px; - font-weight: 900; - transform-origin: top; - transform: scaleY(2.4); - letter-spacing: 4px; - text-transform: uppercase; - margin: -10px 0px 36px; - } - - .sheet-playbook_subtitle { - font-size: 11px; - line-height: 14px; - font-style: italic; - } - - .sheet-playbook_label { - font-size: 16px; - font-weight: 900; - text-align: initial; - text-transform: uppercase; - transform: scaleY(1.5); - margin: 0px 0px 8px; - } - - .sheet-playbook_small_label { - font-size: 14px; - font-weight: 600; - text-align: initial; - text-transform: uppercase; - margin: 0px 0px 8px; - } - - .sheet-playbook_improv_label { - font-size: 14px; - font-weight: 600; - text-align: initial; - text-transform: uppercase; - width: 270px; - } - - .sheet-playbook_example { - font-family: serif; - font-size: 11px; - font-weight: lighter; - line-height: 14px; - letter-spacing: 1px; - text-align: justify; - text-justify: inter-word; - margin: 0px 12px; - } - - .sheet-playbook_question { - line-height: 14px; - font-size: 11px; - text-transform: uppercase; - text-align: initial; - width: 270px; - } - - .sheet-playbook_question_field { - font-family: 'Rock Salt', 'Shadows Into Light', cursive; - font-size: 16px; - font-style: normal; - font-weight: 600; - line-height: 18px; - letter-spacing: 2px; - width: 270px; - height: 62px; - padding: 3px 6px; - background: transparent; - margin: 0px 0px 0px 30px; - border: none; - border-radius: 0px; - outline: none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - overflow:hidden; - resize:none; - } - - .sheet-playbook_question_field::placeholder { - font-family: Sans-Serif; - font-size: 11px; - line-height: 14px; - letter-spacing: 0px; - font-style: italic; - opacity: 1; /* Firefox */ - } - - .sheet-playbook_question_field::-moz-placeholder { - font-family: Sans-Serif; - font-size: 11px; - line-height: 14px; - letter-spacing: 0px; - font-style: italic; - opacity: 1; /* Firefox */ - } - - .sheet-playbook_question_field:-ms-input-placeholder { - font-family: initial; - font-size: 11px; - line-height: 14px; - letter-spacing: 0px; - font-style: italic; - } - .sheet-playbook_question_field::-ms-input-placeholder { - font-family: Sans-Serif; - font-size: 11px; - line-height: 14px; - letter-spacing: 0px; - font-style: italic; - } - - .sheet-playbook_question_box { - width: 18px; - height: 18px; - font-size: 14px; - line-height: 18px; - margin-bottom: auto; - margin-right: 10px; - margin-left: 0px; - padding: auto; - border: none; - outline: none; - text-align: center; - } - - .sheet-playbook_question_checkbox { - display: block; - position: relative; - margin-bottom: auto; - margin-right: 10px; - margin-left: 0px; - height: 18px; - width: 18px; - } - - .sheet-playbook_question_checkbox input[type="radio"] , - .sheet-playbook_question_checkbox input[type="checkbox"] - { - position: absolute; - opacity: 0.0; - width: 18px; - height: 18px; - top: 9px; - left: 9px; - cursor: pointer; - z-index: 1; - margin: -9px; - } - - - .sheet-playbook_question_checkbox span - { - position: absolute; - top: 0px; - left: 0px; - width: 18px; - height: 18px; - font-size: 14px; - line-height: 18px; - color: white; - text-align: center; - vertical-align: middle; - padding: 0px; - border: none; - outline: none; - opacity: 1; - } - - .sheet-playbook_question_check { - display: block; - position: relative; - margin-bottom: auto; - margin-right: 10px; - margin-left: 0px; - height: 18px; - width: 18px; - } - - .sheet-playbook_question_check input[type="checkbox"] - { - position: absolute; - opacity: 0.0; - width: 18px; - height: 18px; - top: 9px; - left: 9px; - cursor: pointer; - z-index: 1; - margin: -9px; - } - - - .sheet-playbook_question_check span - { - position: absolute; - top: 0px; - left: 0px; - width: 18px; - height: 18px; - font-size: 14px; - line-height: 18px; - color: white; - text-align: center; - vertical-align: middle; - padding: 0px; - border: none; - outline: none; - opacity: 1; - } - - .sheet-playbook_question_plusminus { - margin: auto; - } - - .sheet-playbook_question_plusminus input[type="radio"]:checked + span::before , - .sheet-playbook_question_plusminus input[type="checkbox"]:checked + span::before { - content: "-"; - } - .sheet-playbook_question_plusminus input[type="radio"]:not(:checked) + span::before , - .sheet-playbook_question_plusminus input[type="checkbox"]:not(:checked) + span::before { - content: "+"; - } - - /* PLAYBOOK MYTHOS STYLE ----------------------------------------------- PLAYBOOK MYTHOS STYLE */ - - .sheet-playbook_style_mythos { - background-image: url(https://i.imgur.com/m8V3xeY.png); - background-repeat: repeat; - background-color: #6f5d6e; - color: white; - - height: 100%; - } - - .sheet-playbook_style_mythos .sheet-playbook_big_title, - .sheet-playbook_style_mythos .sheet-playbook_small_title, - .sheet-playbook_style_mythos .sheet-playbook_title { - color: #1e1137; - -webkit-text-fill-color: rgba(0, 0, 0, 0.0); - -webkit-text-stroke: 1px #eb018c; - filter: drop-shadow(0px 0px 0px #eb018c) drop-shadow(0px 0px 1px #eb018c) drop-shadow(0px 0px 6px #eb018c); - } - - .sheet-playbook_style_mythos .sheet-playbook_label, - .sheet-playbook_style_mythos .sheet-playbook_small_label{ - color: #eb018c; - text-shadow: 0px 0px 1px #eb018c; - } - - .sheet-playbook_style_mythos b { - font-size: 12px; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_box { - font-size: 12px; - background-color: #eb018c ; - color: white; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox span, - .sheet-playbook_style_mythos .sheet-playbook_question_check span - { - background-color: grey ; - color: #1e1137; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:hover + span, - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:hover + span, - .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:hover + span - { - color: #1e1137; - text-shadow: 0px 0px 1px #1e1137; - background-color: #eb018c ; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:checked + span, - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:checked + span, - .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:checked + span - { - color: white; - text-shadow: 0px 0px 1px white; - background-color: #eb018c ; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:active + span, - .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:active + span, - .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:active + span - { - color: white; - text-shadow: 0px 0px 3px white, 0px 0px 3px white; - background-color: #eb018c ; - box-shadow: 0px 0px 3px 1px #eb018c ; - } - - .sheet-playbook_style_mythos .sheet-playbook_question { - color: white; - } - - .sheet-playbook_style_mythos .sheet-playbook_question_field { - color: white; - background: #452362; - } - - .sheet-playbook_style_mythos select { - color: white; - background: #452362; - border: none; - } - - .sheet-playbook_style_mythos select:hover { - box-shadow: 0px 0px 3px 2px #ebafd3, 0px 0px 3px 3px #eb018c; - } - - .sheet-playbook_style_mythos select:focus { - box-shadow: 0px 0px 3px 2px #ebafd3, 0px 0px 3px 3px #eb018c; - outline:0; - } - - .sheet-playbook_style_mythos .sheet-playbook_note { - width: 300px; - flex: 0 0 300px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - color: white; - border-color: #ebafd3; border-style: solid; - border-width: 2px; - padding: 10px; - border-radius: 10px; - box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; - margin: 0px 0px 20px; - - } - - .sheet-playbook_style_mythos .sheet-playbook_note .sheet-playbook_small_label { - color: #eb018c; - border-radius: 1px 1px 0px 0px; - margin: 0px 0px 10px; - } - - - /* PLAYBOOK LOGOS STYLE ------------------------------------------------ PLAYBOOK LOGOS STYLE */ - - .sheet-playbook_style_logos { - background-image: url(https://i.imgur.com/juI6Nsa.png); - background-repeat: repeat; - background-color: #fcfaf2; - color: #1f140d; - - height: 100%; - } - - .sheet-playbook_style_logos .sheet-playbook_big_title, - .sheet-playbook_style_logos .sheet-playbook_small_title, - .sheet-playbook_style_logos .sheet-playbook_title { - color: #1f140d; - text-shadow: 0px 0px 0px #1f140d; - } - - .sheet-playbook_style_logos .sheet-playbook_label, - .sheet-playbook_style_logos .sheet-playbook_small_label{ - color: #1f140d; - text-shadow: 0px 0px 0px transparent; - } - - .sheet-playbook_style_logos b { - font-size: 12px; - } - - .sheet-playbook_style_logos .sheet-playbook_tag { - font-size: 12px; - font-style: italic; - background: #fff3b2; - } - - .sheet-playbook_style_logos .sheet-playbook_question_box { - font-size: 12px; - background-color: #8a2e39 ; - color: #fcfaf2; - } - - .sheet-playbook_style_logos .sheet-playbook_question_checkbox span, - .sheet-playbook_style_logos .sheet-playbook_question_check span - { - font-size: 12px; - background-color: grey ; - color: #fcfaf2; - } - - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:hover + span, - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:hover + span, - .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:hover + span - { - font-size: 12px; - color: white; - text-shadow: 0px 0px 1px white; - background-color: #8a2e39 ; - } - - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:checked + span, - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:checked + span, - .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:checked + span - { - color: white; - text-shadow: 0px 0px 1px white; - background-color: #8a2e39 ; - } - - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:active + span, - .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:active + span, - .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:active + span - { - color: white; - text-shadow: 0px 0px 3px white, 0px 0px 3px white; - background-color: #8a2e39 ; - box-shadow: 0px 0px 3px 1px #8a2e39 ; - } - - .sheet-playbook_style_logos .sheet-playbook_question { - color: #1f140d; - } - - .sheet-playbook_style_logos .sheet-playbook_question_field { - color: #1f140d; - background: #fff3b2; - } - - .sheet-playbook_style_logos select { - color: #1f140d; - background: #fff3b2; - border: none; - } - - .sheet-playbook_style_logos select:hover { - box-shadow: 0px 0px 3px 1px #8a2e39; - } - - .sheet-playbook_style_logos select:focus { - box-shadow: 0px 0px 3px 1px #8a2e39; - outline:0; - } - - .sheet-playbook_style_logos .sheet-playbook_note { - width: 300px; - flex: 0 0 300px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - color: black; - background-color: #dcd3b8; - padding: 6px; - border-radius: 6px; - border: 2px solid #4c4646; - box-shadow: 0px 0px 0px 6px #dcd3b8, 1px 1px 15px 3px black; - margin: 0px 0px 20px; - } - - .sheet-playbook_style_logos .sheet-playbook_note .sheet-playbook_small_label { - font-size: 16px; - color: #dcd3b8; - background-color: #4c4646; - border-radius: 1px 1px 0px 0px; - box-shadow: 0px 0px 0px 7px #4c4646; - margin: 0px 0px 10px; - } - - - /* IMPROVBOOK ---------------------------------------------------------- IMPROVBOOK*/ - - .sheet-improvbook { - height: 680px; - flex-wrap: nowrap; - overflow: visible; - margin: 0px; - } - - .sheet-improvbook_columns { - column-count: auto; - -webkit-column-count: auto; - -moz-column-count: auto; - column-width: 326px; - -webkit-column-width: 326px; - -moz-column-width: 326px; - column-gap: 20px; - -webkit-column-gap: 20px; - -moz-column-gap: 20px; - height: 100%; - margin: 0px 10px; - } - - .sheet-broadpowertag_active:not(:checked) ~ .sheet-broadpowertag_entry, - .sheet-extrathemeally_active:not(:checked) ~ .sheet-extrathemeally_entry, - .sheet-extrathemebase_active:not(:checked) ~ .sheet-extrathemebase_entry, - .sheet-extrathemeride_active:not(:checked) ~ .sheet-extrathemeride_entry, - .sheet-closure_active:not(:checked) ~ .sheet-closure_entry, - .sheet-transformation_active:not(:checked) ~ .sheet-transformation_entry, - .sheet-leavethecity_active:not(:checked) ~ .sheet-leavethecity_entry, - .sheet-dynamite1_active:not(:checked) ~ .sheet-dynamite1_entry, - .sheet-dynamite2_active:not(:checked) ~ .sheet-dynamite2_entry, - .sheet-dynamite3_active:not(:checked) ~ .sheet-dynamite3_entry, - .sheet-seethroughmist_active:not(:checked) ~ .sheet-seethroughmist_entry { - display: none; - } - - .sheet-oblivious_active:not(:checked) ~ .sheet-oblivious_entry, - .sheet-madeforthis_active:not(:checked) ~ .sheet-madeforthis_entry, - .sheet-themythoswithin_active:not(:checked) ~ .sheet-themythoswithin_entry, - .sheet-specialization_active:not(:checked) ~ .sheet-specialization_entry, - .sheet-afightingchance_active:not(:checked) ~ .sheet-afightingchance_entry, - .sheet-ripples_active:not(:checked) ~ .sheet-ripples_entry, - .sheet-transference_active:not(:checked) ~ .sheet-transference_entry { - display: none; - } - - .sheet-whostheboss_active:not(:checked) ~ .sheet-whostheboss_entry, - .sheet-qualitymatters_active:not(:checked) ~ .sheet-qualitymatters_entry, - .sheet-itsshowtime_active:not(:checked) ~ .sheet-itsshowtime_entry, - .sheet-gettinggoodatthis_e_active:not(:checked) ~ .sheet-gettinggoodatthis_e_entry, - .sheet-gettinggoodatthis_m_active:not(:checked) ~ .sheet-gettinggoodatthis_m_entry, - .sheet-gettinggoodatthis_p_active:not(:checked) ~ .sheet-gettinggoodatthis_p_entry, - .sheet-gettinggoodatthis_r_active:not(:checked) ~ .sheet-gettinggoodatthis_r_entry, - .sheet-gettinggoodatthis_t_active:not(:checked) ~ .sheet-gettinggoodatthis_t_entry, - .sheet-echosfromthepast_active:not(:checked) ~ .sheet-echosfromthepast_entry, - .sheet-sharedexperiences_active:not(:checked) ~ .sheet-sharedexperiences_entry, - .sheet-cantbetooready_active:not(:checked) ~ .sheet-cantbetooready_entry, - .sheet-whyidothis_p_active:not(:checked) ~ .sheet-whyidothis_p_entry, - .sheet-toolsofthetrade_active:not(:checked) ~ .sheet-toolsofthetrade_entry, - .sheet-whyidothis_r_active:not(:checked) ~ .sheet-whyidothis_r_entry, - .sheet-senseofpurpose_active:not(:checked) ~ .sheet-senseofpurpose_entry { - display: none; - } - - - .sheet-imp1_active:not(:checked) ~ .sheet-imp1_entry, - .sheet-imp2_active:not(:checked) ~ .sheet-imp2_entry, - .sheet-imp3_active:not(:checked) ~ .sheet-imp3_entry, - .sheet-imp4_active:not(:checked) ~ .sheet-imp4_entry, - .sheet-imp5_active:not(:checked) ~ .sheet-imp5_entry, - .sheet-imp6_active:not(:checked) ~ .sheet-imp6_entry, - .sheet-imp7_active:not(:checked) ~ .sheet-imp7_entry, - .sheet-imp8_active:not(:checked) ~ .sheet-imp8_entry, - .sheet-imp9_active:not(:checked) ~ .sheet-imp9_entry, - .sheet-imp10_active:not(:checked) ~ .sheet-imp10_entry, - .sheet-imp11_active:not(:checked) ~ .sheet-imp11_entry, - .sheet-imp12_active:not(:checked) ~ .sheet-imp12_entry, - .sheet-imp13_active:not(:checked) ~ .sheet-imp13_entry, - .sheet-imp14_active:not(:checked) ~ .sheet-imp14_entry, - .sheet-imp15_active:not(:checked) ~ .sheet-imp15_entry { - display: none; - } - - .sheet-playbook_Ktagbook { - display: none; - } - - .sheet-Ktagbook_open:checked ~ .sheet-playbook_Ktagbook { - display: inherit; - } - - .sheet-tagbook_adaptation_open:not(:checked) ~ .sheet-tagbook_adaptation, - .sheet-tagbook_bastion_open:not(:checked) ~ .sheet-tagbook_bastion, - .sheet-tagbook_divination_open:not(:checked) ~ .sheet-tagbook_divination, - .sheet-tagbook_express_open:not(:checked) ~ .sheet-tagbook_express, - .sheet-tagbook_mobility_open:not(:checked) ~ .sheet-tagbook_mobility, - .sheet-tagbook_relic_open:not(:checked) ~ .sheet-tagbook_relic, - .sheet-tagbook_subversion_open:not(:checked) ~ .sheet-tagbook_subversion { - display: none; - } - - .sheet-tagbook_event_open:not(:checked) ~ .sheet-tagbook_event, - .sheet-tagbook_relationship_open:not(:checked) ~ .sheet-tagbook_relationship, - .sheet-tagbook_mission_open:not(:checked) ~ .sheet-tagbook_mission, - .sheet-tagbook_personality_open:not(:checked) ~ .sheet-tagbook_personality, - .sheet-tagbook_possessions_open:not(:checked) ~ .sheet-tagbook_possessions, - .sheet-tagbook_routine_open:not(:checked) ~ .sheet-tagbook_routine, - .sheet-tagbook_training_open:not(:checked) ~ .sheet-tagbook_training { - display: none; - } - - .sheet-KA_notactive:checked ~ .sheet-KA_entry, - .sheet-KB_notactive:checked ~ .sheet-KB_entry, - .sheet-KC_notactive:checked ~ .sheet-KC_entry, - .sheet-KD_notactive:checked ~ .sheet-KD_entry, - .sheet-KE_notactive:checked ~ .sheet-KE_entry, - .sheet-KF_notactive:checked ~ .sheet-KF_entry, - .sheet-KG_notactive:checked ~ .sheet-KG_entry, - .sheet-KH_notactive:checked ~ .sheet-KH_entry, - .sheet-KI_notactive:checked ~ .sheet-KI_entry, - .sheet-KJ_notactive:checked ~ .sheet-KJ_entry { - display: none; - } - - .sheet-KA_active:not(:checked) ~ .sheet-KA_field, - .sheet-KB_active:not(:checked) ~ .sheet-KB_field, - .sheet-KC_active:not(:checked) ~ .sheet-KC_field, - .sheet-KD_active:not(:checked) ~ .sheet-KD_field, - .sheet-KE_active:not(:checked) ~ .sheet-KE_field, - .sheet-KF_active:not(:checked) ~ .sheet-KF_field, - .sheet-KG_active:not(:checked) ~ .sheet-KG_field, - .sheet-KH_active:not(:checked) ~ .sheet-KH_field, - .sheet-KI_active:not(:checked) ~ .sheet-KI_field, - .sheet-KJ_active:not(:checked) ~ .sheet-KJ_field { - display: none; - } - - .sheet-QMA_notactive:checked ~ .sheet-QMA_entry, - .sheet-QMB_notactive:checked ~ .sheet-QMB_entry, - .sheet-QMC_notactive:checked ~ .sheet-QMC_entry, - .sheet-QMD_notactive:checked ~ .sheet-QMD_entry, - .sheet-QME_notactive:checked ~ .sheet-QME_entry, - .sheet-QMF_notactive:checked ~ .sheet-QMF_entry, - .sheet-QMG_notactive:checked ~ .sheet-QMG_entry, - .sheet-QMH_notactive:checked ~ .sheet-QMH_entry, - .sheet-QMI_notactive:checked ~ .sheet-QMI_entry, - .sheet-QMJ_notactive:checked ~ .sheet-QMJ_entry, - .sheet-QMK_notactive:checked ~ .sheet-QMK_entry { - display: none; - } - - - .sheet-QMA_active:not(:checked) ~ .sheet-QMA_entry, - .sheet-QMB_active:not(:checked) ~ .sheet-QMB_entry, - .sheet-QMC_active:not(:checked) ~ .sheet-QMC_entry, - .sheet-QMD_active:not(:checked) ~ .sheet-QMD_entry, - .sheet-QME_active:not(:checked) ~ .sheet-QME_entry, - .sheet-QMF_active:not(:checked) ~ .sheet-QMF_entry, - .sheet-QMG_active:not(:checked) ~ .sheet-QMG_entry, - .sheet-QMH_active:not(:checked) ~ .sheet-QMH_entry, - .sheet-QMI_active:not(:checked) ~ .sheet-QMI_entry, - .sheet-QMJ_active:not(:checked) ~ .sheet-QMJ_entry, - .sheet-QMK_active:not(:checked) ~ .sheet-QMK_entry { - display: none; - } - - /* VERTICAL TEAR ------------------------------------------------------------------- VERTICAL TEAR */ - .sheet-playbook_vertical_tear { - height: 840px; - position: relative; - margin-left: 10px; - margin-right: -10px; - transform: translate(0px, -40px); - } - - .sheet-playbook_vertical_tear_inside { - width: auto; - height: 840px; - padding: 0px; - margin: 0px 40px; - overflow: hidden; - position: relative; - background-image: initial; - background-color: white; - } - - .sheet-playbook_vertical_tear_inner_body { - display: flex; - flex-wrap: nowrap; - width: 680px; - height: 840px; - padding: 40px 20px 0pc; - box-sizing: border-box; - } - - .sheet-playbook_vertical_tear_inner_left { - background-image: url("https://i.imgur.com/Bd9LDdg.png"); - background-repeat: repeat-y; - background-position: center; - height: 840px; - width: 40px; - top: 0px; - left: 0px; - position: absolute; - z-index: 10; - - filter: drop-shadow(-6px 1px 15px black); - } - - .sheet-playbook_vertical_tear_inner_right { - background-image: url("https://i.imgur.com/M0RBznR.png"); - background-repeat: repeat-y; - background-position: center; - height: 840px; - width: 40px; - top: 0px; - right: 0px; - position: absolute; - z-index: 10; - - filter: drop-shadow(6px 1px 15px black); - } - - .sheet-playbook_vertical_tear_outer_left { - background-image: url("https://i.imgur.com/M0RBznR.png"); - background-repeat: repeat-y; - background-position: center; - height: 840px; - width: 40px; - top: 0px; - left: 0px; - position: absolute; - } - - .sheet-playbook_vertical_tear_outer_right { - background-image: url("https://i.imgur.com/Bd9LDdg.png"); - background-repeat: repeat-y; - background-position: center; - height: 840px; - width: 40px; - top: 0px; - right: 0px; - position: absolute; - } - - /* STATIC TEAR ---------------------------------------------------------------------- STATIC TEAR*/ - - .sheet-playbook_vertical_tear_static_mythos { - color: white; - background-image: url(https://i.imgur.com/m8V3xeY.png); - background-repeat: repeat; - background-color: #6f5d6e; - box-shadow: 0px 0px 15px 0px #fcfaf2 inset, 0px 0px 15px 0px #fcfaf2 inset, 0px 0px 15px 0px #fcfaf2 inset; - margin: 0px; - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_label, - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_small_label { - color: #eb018c; - text-shadow: 0px 0px 1px #eb018c; - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question_box { - font-size: 12px; - background-color: #eb018c ; - color: white; - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question { - color: white; - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question_field { - color: white; - background: #452362; - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_highlight { - border-color: #ebafd3; border-style: solid; - border-width: 2px; - padding: 10px; - border-radius: 10px; - box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; - margin: 0px 0px 20px; - } - - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_note { - width: 300px; - flex: 0 0 300px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - color: white; - background-color: transparent; - border-color: #ebafd3; border-style: solid; - border-width: 2px; - padding: 10px; - border-radius: 10px; - box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; - margin: 0px 0px 20px; - - } - - .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_note .sheet-playbook_small_label { - color: #eb018c; - background-color: transparent; - box-shadow: 0px 0px 0px 0px transparent; - border-radius: 1px 1px 0px 0px; - margin: 0px 0px 10px; - } - - .sheet-playbook_vertical_tear_static_logos { - color: #1f140d; - background-image: url(https://i.imgur.com/juI6Nsa.png); - background-repeat: repeat; - background-color: #fcfaf2; - margin: 0px; - - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_label, - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_small_label{ - color: #1f140d; - text-shadow: 0px 0px 0px transparent; - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question_box { - font-size: 12px; - background-color: #8a2e39 ; - color: #fcfaf2; - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question { - color: #1f140d; - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question_field { - color: #1f140d; - background: #fff3b2; - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_note { - width: 300px; - flex: 0 0 300px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - color: black; - background-color: #dcd3b8; - padding: 6px; - border-radius: 6px; - border: 2px solid #4c4646; - box-shadow: 0px 0px 0px 6px #dcd3b8, 1px 1px 15px 3px black; - } - - .sheet-playbook_vertical_tear_static_logos .sheet-playbook_note .sheet-playbook_small_label { - font-size: 16px; - color: #dcd3b8; - background-color: #4c4646; - border-radius: 1px 1px 0px 0px; - box-shadow: 0px 0px 0px 7px #4c4646; - margin: 0px 0px 10px; - } - - /* COLLAPSING TEAR ------------------------------------------------------------------ COLLAPSING TEAR */ - - .sheet-playbook_vertical_tear_inner_whiteout { - height: 100%; - width: 100%; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - transition: all 0.6s ease-in-out; - z-index: 1; - - background-color: white; - opacity: 1.0; - } - - .sheet-playbook_identity_concept_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout, - .sheet-playbook_identity_concept_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout{ - opacity: 0.0; - } - - /* CONCEPT COLUMN ------------------------------------------------------------------- CONCEPT COLUMN */ - - .sheet-playbook_identity_concept_column { - display: flex; - flex: 0 0 auto; - min-width: 300px; - max-width: 1060px; - height: 100%; - margin: 0px 10px; - position: relative; - } - - .sheet-playbook_identity_concept_spacer { - flex: 0 0 300px; - min-width: 300px; - } - - .sheet-playbook_identity_concept_desc { - position: absolute; - top: 0px; - width: 300px; - } - - .sheet-playbook_identity_concept_mythos { - position: absolute; - top: 150px; - width: 300px; - - } - - .sheet-playbook_identity_concept_logos { - position: absolute; - top: 325px; - width: 300px; - - } - - .sheet-playbook_identity_concept_name { - position: absolute; - top: 500px; - width: 300px; - - } - - .sheet-playbook_vertical_tear_inside_collapse { - max-width: 0px; - filter: brightness(200%); - transition: all 0.6s ease-in-out; - } - - .sheet-playbook_identity_concept_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse, - .sheet-playbook_identity_concept_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse { - max-width: 680px; - filter: brightness(100%); - } - - .sheet-playbook_identity_concept_logos_desc, - .sheet-playbook_identity_concept_mythos_desc { - display: flex; - flex-wrap: nowrap; - width: 680px; - height: 840px; - padding: 40px 20px 0pc; - box-sizing: border-box; - - position: absolute; - top: 0px; - left: 0px; - } - - .sheet-playbook_identity_concept_mythos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_concept_mythos_desc, - .sheet-playbook_identity_concept_logos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_concept_logos_desc { - display: none; - } - - /* THEME COLUMN ------------------------------------------------------------------- THEME COLUMN */ - - .sheet-playbook_identity_theme_column { - display: flex; - flex: 0 0 auto; - min-width: 300px; - max-width: 1060px; - height: 100%; - margin: 0px 10px; - position: relative; - } - - .sheet-playbook_identity_theme_spacer { - flex: 0 0 300px; - min-width: 300px; - } - - .sheet-playbook_identity_theme_desc { - position: absolute; - top: 0px; - width: 300px; - - } - - .sheet-playbook_identity_theme_mythos { - position: absolute; - top: 120px; - width: 300px; - - } - - .sheet-playbook_identity_theme_logos { - position: absolute; - top: 350px; - width: 300px; - - } - - - .sheet-playbook_identity_theme_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout, - .sheet-playbook_identity_theme_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout{ - opacity: 0.0; - } - - - .sheet-playbook_identity_theme_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse, - .sheet-playbook_identity_theme_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse { - max-width: 680px; - filter: brightness(100%); - } - - .sheet-playbook_identity_theme_logos_desc, - .sheet-playbook_identity_theme_mythos_desc { - display: flex; - flex-wrap: nowrap; - width: 680px; - height: 840px; - padding: 40px 20px 0pc; - box-sizing: border-box; - - position: absolute; - top: 0px; - left: 0px; - } - - .sheet-playbook_identity_theme_mythos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_theme_mythos_desc, - .sheet-playbook_identity_theme_logos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_theme_logos_desc { - display: none; - } - - -/* PLAYBOOK INTERIOR END ------------------------------------------------------- PLAYBOOK INTERIOR END */ - -/* NOTE STYLING START ---------------------------------------------------------- START */ - - /* YELLOW -------------------------------------------------------------- YELLOW */ - - .sheet-scraps_yellow { - filter: drop-shadow(0px 5px 10px black); - overflow: hidden; - line-height: 16px; - font-size: 11px; - color: black; - } - - .sheet-scraps_yellow_body { - background: #f5eda8; - padding: 6px 10px 6px; - margin: 0px 0px -6px; - } - - .sheet-scraps_yellow_top { - background-image: url("https://i.imgur.com/kzeM9Rp.png"); - background-repeat: repeat-x; - background-position: center; - height: 20px; - width: 100%; - } - - .sheet-scraps_yellow_bottom { - background-image: url("https://i.imgur.com/R3yzbB8.png"); - background-repeat: no-repeat; - background-size: 100%; - height: 20px; - width: 100%; - } - - .sheet-scraps_yellow_body .sheet-scraps_label { - color: #8a2e39; - font-size: 18px; - font-weight: 600; - text-align: initial; - margin: 0px 0px 6px; - } - - .sheet-scraps_yellow_body b { - font-size: 12px; - background: transparent; - } - - .sheet-theme_card_stand_in { - height: 660px; - width: 260px; - padding: 0px; - margin: 0px 20px; - border: 1px solid white; - border-radius: 12px 12px 12px 12px; - background: green; - - position: absolute; - top: 30px; - margin: 0px 20px; - - z-index: 50; - - } - - .sheet-theme_button1_stand_in { - height: 30px; - width: 260px; - padding: 0px; - margin: 0px 20px; - border: 1px solid white; - border-radius: 12px 12px 12px 12px; - background: green; - - position: absolute; - top: 700px; - margin: 0px 20px; - - z-index: 50; - - - } - - .sheet-theme_button2_stand_in { - height: 30px; - width: 260px; - padding: 0px; - margin: 0px 20px; - border: 1px solid white; - border-radius: 12px 12px 12px 12px; - background: green; - - position: absolute; - top: 740px; - margin: 0px 20px; - - z-index: 50; - } - - .sheet-playbook_button_1 { - top: 700px; - left: 20px; - } - - .sheet-playbook_button_2 { - top: 740px; - left: 20px; - } - - .sheet-playbook_chapter_button { - - position: absolute; - margin: 0px; - padding: 0px; - height: 30px; - width: 260px; - z-index: 50; - - } - - .sheet-playbook_chapter_button input[type="checkbox"] { - height: 100%; - width: 100%; - position: absolute; - opacity: 0; - - top: 0%; - left: 0%; - cursor: pointer; - z-index: 1; - margin: 0%; - - } - - - .sheet-playbook_chapter_button span - { - height: 30px; - width: 260px; - padding: 0px; - border-radius: 6px 6px 6px 6px; - - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - position: absolute; - top: 0px; - left: 0px; - - font-family: 'Contrail One', Sans-Serif; - font-size: 16px; - font-style: normal; - text-transform: uppercase; - - line-height: 30px; - text-align: center; - vertical-align: middle; - border: none; - outline: none; - opacity: 1; - - } - - .sheet-playbook_chapter_button_mythos span - { - background-color: grey ; - color: #1e1137; - } - - .sheet-playbook_chapter_button_mythos input[type="checkbox"]:hover + span - { - color: #1e1137; - text-shadow: 0px 0px 1px #1e1137; - background-color: #eb018c ; - } - - .sheet-playbook_chapter_button_mythos input[type="checkbox"]:checked + span - { - color: white; - text-shadow: 0px 0px 1px white; - background-color: #eb018c ; - } - - .sheet-playbook_chapter_button_mythos input[type="checkbox"]:active + span - { - color: white; - text-shadow: 0px 0px 3px white, 0px 0px 3px white; - background-color: #eb018c ; - box-shadow: 0px 0px 3px 1px #eb018c ; - } - - .sheet-playbook_chapter_button_logos span - { - background-color: grey ; - color: #fcfaf2; - } - - .sheet-playbook_chapter_button_logos input[type="checkbox"]:hover + span - { - color: white; - text-shadow: 0px 0px 1px white; - background-color: #a1574a ; - } - - .sheet-playbook_chapter_button_logos input[type="checkbox"]:checked + span - { - color: white; - text-shadow: 0px 0px 1px white; - background-color: #a1574a ; - } - - .sheet-playbook_chapter_button_logos input[type="checkbox"]:active + span - { - color: white; - text-shadow: 0px 0px 3px white, 0px 0px 3px white; - background-color: #a1574a ; - box-shadow: 0px 0px 3px 1px #a1574a ; - } - -/* STATUS CARD STYLING --------------------------------------------------------- START */ - - .sheet-status_card_mat { - width: 100%; - min-height: 580px; - margin: 0px 0px 30px; - padding: 0px; - - position: relative; - -webkit-transform:translate3d(0,0,0); - perspective: 2000px; - } - - .sheet-status_card { - height: 260px; - width: 400px; - background-color: #e6e0d3; - box-shadow: inset 0px 0px 25px 5px #d2cac3; - - border: 1px solid white; - border-radius: 12px 12px 12px 12px; - padding: 10px; - - display: flex; - flex-flow: column nowrap; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - - perspective: 2000px; - } - - .sheet-status_card input[type=checkbox] { - box-shadow: none; - height: 26px; - width: 26px; - margin: auto 6px; - background: #fff; - vertical-align: middle; - } - - .sheet-status_card_inset { - display: flex; - flex-flow: column nowrap; - margin: 0px; - padding: 0px; - height: 100%; - width: 100%; - border-radius: 10px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - box-shadow: inset 0px 0px 55px 25px #d2cac3; - } - - .sheet-status_card_header { - height: 36px; - width: 100%; - color: white; - background-color: #a1574a ; - border-radius: 10px 10px 0px 0px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-status_card_footer { - height: 32px; - width: 100%; - color: white; - background-color: #a1574a ; - border-radius: 10px 10px 0px 0px; - margin-top: auto; - border-radius: 0px 0px 10px 10px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-status_card_body { - height: calc(100% - 68px); - width: 100%; - padding: 6px; - box-sizing: border-box; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - } - - .sheet-status_card_title { - height: 36px; - width: 210px; - padding: 0px 5px; - margin: 0px 10px; - background: transparent; - border: none; - outline: none; - - - font-family: 'Contrail One', Sans-Serif; - line-height: 36px; - font-size: 26px; - font-style: normal; - font-variant: small-caps; - font-weight: 900; - color: white; - text-shadow: 0px 0px 2px #534233; - text-transform: uppercase; - text-align: left; - } - - .sheet-status_card_tag { - height: 60px; - width: 350px; - padding: 0px 5px; - margin: 0px auto; - background: transparent; - border: none; - outline: none; - overflow: hidden; - resize: none; - - line-height: 30px; - font-size: 26px; - font-style: normal; - font-variant: small-caps; - text-transform: uppercase; - text-align: left; - - font-family: 'Rock Salt', 'Shadows Into Light', cursive; - letter-spacing: 2px; - font-weight: 600; - } - - .sheet-status_card_tag::placeholder { - font-family: 'Contrail One', Sans-Serif; - font-weight: 900; - text-shadow: 0px 0px 2px #534233; - letter-spacing: 0px; - opacity: 1; /* Firefox */ - } - - .sheet-status_card_tag::-moz-placeholder { - font-family: 'Contrail One', Sans-Serif; - font-weight: 900; - text-shadow: 0px 0px 2px #534233; - letter-spacing: 0px; - opacity: 1; /* Firefox */ - } - - .sheet-status_card_tag:-ms-input-placeholder { - font-family: 'Contrail One', Sans-Serif; - font-weight: 900; - text-shadow: 0px 0px 2px #534233; - letter-spacing: 0px; - opacity: 1; /* Firefox */ - } - - .sheet-status_card_tag::-ms-input-placeholder { - font-family: 'Contrail One', Sans-Serif; - font-weight: 900; - text-shadow: 0px 0px 2px #534233; - letter-spacing: 0px; - opacity: 1; /* Firefox */ - } - - .sheet-status_card_icon_standin { - height: 26px; - width: 26px; - border-radius: 50%; - background-color: white; - margin: auto; - } - - .sheet-status_card_footer .sheet-theme_label { - color: white; - } - - .sheet-status_switch_clue:not(:checked) ~ .sheet-status_body_clue, - .sheet-status_switch_juice:not(:checked) ~ .sheet-status_body_juice, - .sheet-status_switch_storytag:not(:checked) ~ .sheet-status_body_storytag, - .sheet-status_switch_status:not(:checked) ~ .sheet-status_body_status { - display: none; - } - - - - .sheet-status_card_1, - .sheet-status_card_2, - .sheet-status_card_3, - .sheet-status_card_4, - .sheet-status_card_5, - .sheet-status_card_6, - .sheet-status_card_7, - .sheet-status_card_8 { - position: absolute; - transition: all 0.6s ease-in-out, z-index 0s, transform 0.2s ease-in-out, top 0.2s ease-in-out; - filter: drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); - transform-origin: center top; - } - - .sheet-status_card_1 { - top: 20px; - left: calc(15% - 130px); - transform: rotate(-3deg) scale(0.9, 0.9); - } - - .sheet-status_card_2 { - top: 10px; - left: calc(38.3% - 177px); - transform: rotate(-1deg) scale(0.9, 0.9); - } - - .sheet-status_card_3 { - top: 10px; - left: calc(61.7% - 223px); - transform: rotate(1deg) scale(0.9, 0.9); - } - - .sheet-status_card_4 { - top: 20px; - left: calc(85% - 270px); - transform: rotate(3deg) scale(0.9, 0.9); - } - - .sheet-status_card_5 { - top: 320px; - left: calc(15% - 130px); - transform: rotate(-3deg) scale(0.9, 0.9); - } - - .sheet-status_card_6 { - top: 310px; - left: calc(38.3% - 177px); - transform: rotate(-1deg) scale(0.9, 0.9); - } - - .sheet-status_card_7 { - top: 310px; - left: calc(61.7% - 223px); - transform: rotate(1deg) scale(0.9, 0.9); - } - - .sheet-status_card_8 { - top: 320px; - left: calc(85% - 270px); - transform: rotate(3deg) scale(0.9, 0.9); - } - - .sheet-status_card_1:hover , - .sheet-status_card_2:hover , - .sheet-status_card_3:hover , - .sheet-status_card_4:hover , - .sheet-status_card_1:focus-within , - .sheet-status_card_2:focus-within , - .sheet-status_card_3:focus-within , - .sheet-status_card_4:focus-within { - z-index: 250; - top: 0px; - transform: scale(1, 1); - } - - .sheet-status_card_5:hover , - .sheet-status_card_6:hover , - .sheet-status_card_7:hover , - .sheet-status_card_8:hover , - .sheet-status_card_5:focus-within , - .sheet-status_card_6:focus-within , - .sheet-status_card_7:focus-within , - .sheet-status_card_8:focus-within { - z-index: 250; - top: 300px; - transform: scale(1, 1); - } - - /* CLUE CHECK ---------------------------------------------------------- CLUE CHECK */ - - .sheet-clue_check { - white-space: nowrap; - margin: 5px 0px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-clue_check input[type="radio"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-clue_check input[type="radio"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/vsisO6I.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-clue_check input[type="radio"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-clue_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-clue_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-clue_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/vsisO6I.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* JUICE CHECK ---------------------------------------------------------- JUICE CHECK */ - - .sheet-juice_check { - white-space: nowrap; - margin: 5px 0px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-juice_check input[type="radio"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-juice_check input[type="radio"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/4Y8QreG.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-juice_check input[type="radio"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-juice_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-juice_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-juice_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/4Y8QreG.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* STORYTAG CHECK ---------------------------------------------------------- STORYTAG CHECK */ - - .sheet-storytag_check { - white-space: nowrap; - margin: 5px 0px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-storytag_check input[type="radio"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - .sheet-storytag_check input[type="radio"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-storytag_check input[type="radio"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/Gq20Q17.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-storytag_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-storytag_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-storytag_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/Gq20Q17.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* STATUS CHECK ---------------------------------------------------------- STATUS CHECK */ - - .sheet-statustag_check { - white-space: nowrap; - margin: 5px 0px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-statustag_check input[type="radio"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-statustag_check input[type="radio"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/61pyyF4.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-statustag_check input[type="radio"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-statustag_check input[type="radio"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-statustag_check input[type="radio"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-statustag_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/61pyyF4.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* PLUS CHECK ---------------------------------------------------------- PLUS CHECK */ - - .sheet-plus_check { - white-space: nowrap; - margin: auto 10px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-plus_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-plus_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/tF4WDzo.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-plus_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-plus_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-plus_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-plus_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/tF4WDzo.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - /* MINUS CHECK ---------------------------------------------------------- MINUS CHECK */ - - .sheet-minus_check { - white-space: nowrap; - margin: auto 10px; - padding: 0px; - width: 26px; - height: 26px; - } - - .sheet-minus_check input[type="checkbox"] - { - opacity: 0.0; - width: 26px; - height: 26px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -13px; - } - - - .sheet-minus_check input[type="checkbox"] + span::before - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/hYlWl6M.png); - opacity: 1; - filter: brightness(75%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); - } - - .sheet-minus_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-minus_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-minus_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-minus_image span - { - width: 26px; - height: 26px; - font-size: 26px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(https://i.imgur.com/hYlWl6M.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - position: relative; - top: -4px; - margin: 0px 6px; - } - - .sheet-status_pip_left { - height: 65px; - width: 18px; - background: white; - margin: 0px 0px 0px -4px; - padding: 0px; - -webkit-clip-path: polygon(6.8px 0, 100% 0, 100% 100%, 0% 100%); - clip-path: polygon(6.8px 0, 100% 0, 100% 100%, 0% 100%); - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - display: none; - } - - .sheet-status_pip_right { - height: 65px; - width: 18px; - background: white; - margin: 0px 4px 0px 0px; - padding: 0px; - -webkit-clip-path: polygon(0 0, 100% 0, 11.2px 100%, 0% 100%); - clip-path: polygon(0 0, 100% 0, 11.2px 100%, 0% 100%); - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - display: none; - } - - /* PIP 1 CHECK ---------------------------------------------------------- PIP 1 CHECK */ - - .sheet-status_pip_1_check { - width: 26px; - height: 65px; - margin: 0px 8px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - } - - .sheet-status_pip_1_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_1_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/BO3DedW.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_1_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_1_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_1_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_1_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/BO3DedW.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP 2 CHECK ---------------------------------------------------------- PIP 2 CHECK */ - - .sheet-status_pip_2_check { - width: 26px; - height: 65px; - margin: 0px 8px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - } - - .sheet-status_pip_2_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_2_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/YvafgYl.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_2_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_2_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_2_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_2_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/YvafgYl.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP 3 CHECK ---------------------------------------------------------- PIP 3 CHECK */ - - .sheet-status_pip_3_check { - width: 26px; - height: 65px; - margin: 0px 8px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - - } - - .sheet-status_pip_3_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_3_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/XkTpd5k.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_3_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_3_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_3_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_3_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/XkTpd5k.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP 4 CHECK ---------------------------------------------------------- PIP 4 CHECK */ - - .sheet-status_pip_4_check { - width: 26px; - height: 65px; - margin: 0px 8px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - } - - .sheet-status_pip_4_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_4_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/vnviOBo.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_4_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_4_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_4_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_4_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/vnviOBo.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP 5 CHECK ---------------------------------------------------------- PIP 5 CHECK */ - - .sheet-status_pip_5_check { - width: 26px; - height: 65px; - margin: 0px 8px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - - } - - .sheet-status_pip_5_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_5_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/wpKxCfQ.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_5_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_5_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_5_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_5_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/wpKxCfQ.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP 6 CHECK ---------------------------------------------------------- PIP 6 CHECK */ - - .sheet-status_pip_6_check { - width: 26px; - height: 65px; - margin: 0px 0px 0px 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - - } - - .sheet-status_pip_6_check input[type="checkbox"] - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_6_check input[type="checkbox"] + span::before - { - width: 26px; - height: 65px; - margin:0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/8wgAAgw.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_6_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_6_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_6_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_6_image span - { - width: 26px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/8wgAAgw.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* PIP SUB CHECK ---------------------------------------------------------- PIP SUB CHECK */ - - .sheet-status_pip_sub_check { - width: 12px; - height: 65px; - margin: 0px; - padding: 0px; - - position: relative; - white-space: nowrap; - - transform: skew(-6deg); - -ms-transform: skew(-6deg); /* IE 9 */ - -webkit-transform: skew(-6deg); /* Safari */ - transform-origin: center center; - - } - - .sheet-status_pip_sub_check input[type="checkbox"] - { - width: 12px; - height: 65px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - opacity: 0.0; - cursor: pointer; - z-index: 1; - } - - .sheet-status_pip_sub_check input[type="checkbox"] + span::before - { - width: 12px; - height: 65px; - margin: 0px; - padding: 0px; - - position: absolute; - top: 0px; - left: 0px; - - content: url(https://i.imgur.com/jMX2abh.png); - opacity: 1; - - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_sub_check input[type="checkbox"]:hover + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_sub_check input[type="checkbox"]:checked + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-status_pip_sub_check input[type="checkbox"]:active + span::before - { - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - .sheet-status_pip_sub_image span - { - width: 12px; - height: 65px; - margin: 0px; - padding: 0px; - - display: inline-block; - content: url(https://i.imgur.com/jMX2abh.png); - opacity: 1; - filter: brightness(100%); - -webkit-filter: brightness(100%); - } - - /* STATUS CARD SPECTRUM -------------------------------------------------------- START */ - - .sheet-status_grid { - width: 100%; - margin: 4px 0px 10px; - display: flex; - flex-direction: row-reverse; - flex-wrap: nowrap; - justify-content: center; - background-color: rgba(255, 255, 255, 0.0); - - transform: scale(1.08, 1.08); - -ms-transform: scale(1.08, 1.08); /* IE 9 */ - -webkit-transform: scale(1.08, 1.08); /* Safari */ - transform-origin: center center; - } - - .sheet-status_pip_sub_check:hover ~ .sheet-status_pip_sub_check span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_6 span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_5 span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_4 span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_3 span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_2 span, - .sheet-status_tier_6:hover ~ .sheet-status_tier_1 span, - .sheet-status_tier_5:hover ~ .sheet-status_tier_5 span, - .sheet-status_tier_5:hover ~ .sheet-status_tier_4 span, - .sheet-status_tier_5:hover ~ .sheet-status_tier_3 span, - .sheet-status_tier_5:hover ~ .sheet-status_tier_2 span, - .sheet-status_tier_5:hover ~ .sheet-status_tier_1 span, - .sheet-status_tier_4:hover ~ .sheet-status_tier_4 span, - .sheet-status_tier_4:hover ~ .sheet-status_tier_3 span, - .sheet-status_tier_4:hover ~ .sheet-status_tier_2 span, - .sheet-status_tier_4:hover ~ .sheet-status_tier_1 span, - .sheet-status_tier_3:hover ~ .sheet-status_tier_3 span, - .sheet-status_tier_3:hover ~ .sheet-status_tier_2 span, - .sheet-status_tier_3:hover ~ .sheet-status_tier_1 span, - .sheet-status_tier_2:hover ~ .sheet-status_tier_2 span, - .sheet-status_tier_2:hover ~ .sheet-status_tier_1 span, - .sheet-status_tier_1:hover ~ .sheet-status_tier_1 span { - filter: brightness(200%); - -webkit-filter: brightness(200%); - } - - .sheet-status_pip_sub_check:hover span, - .sheet-status_pip_sub_check:checked ~ .sheet-status_pip_sub_check span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_6 span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_5 span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_4 span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_3 span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_2 span, - .sheet-status_tier_6:checked ~ .sheet-status_tier_1 span, - .sheet-status_tier_5:checked ~ .sheet-status_tier_5 span, - .sheet-status_tier_5:checked ~ .sheet-status_tier_4 span, - .sheet-status_tier_5:checked ~ .sheet-status_tier_3 span, - .sheet-status_tier_5:checked ~ .sheet-status_tier_2 span, - .sheet-status_tier_5:checked ~ .sheet-status_tier_1 span, - .sheet-status_tier_4:checked ~ .sheet-status_tier_4 span, - .sheet-status_tier_4:checked ~ .sheet-status_tier_3 span, - .sheet-status_tier_4:checked ~ .sheet-status_tier_2 span, - .sheet-status_tier_4:checked ~ .sheet-status_tier_1 span, - .sheet-status_tier_3:checked ~ .sheet-status_tier_3 span, - .sheet-status_tier_3:checked ~ .sheet-status_tier_2 span, - .sheet-status_tier_3:checked ~ .sheet-status_tier_1 span, - .sheet-status_tier_2:checked ~ .sheet-status_tier_2 span, - .sheet-status_tier_2:checked ~ .sheet-status_tier_1 span, - .sheet-status_tier_1:checked ~ .sheet-status_tier_1 span { - filter: brightness(200%); - -webkit-filter: brightness(200%); - } - - .sheet-status_tier_5:not(:checked) ~ .sheet-status_pip_sub_6 input[type="checkbox"] , - .sheet-status_tier_4:not(:checked) ~ .sheet-status_pip_sub_5 input[type="checkbox"] , - .sheet-status_tier_3:not(:checked) ~ .sheet-status_pip_sub_4 input[type="checkbox"] , - .sheet-status_tier_2:not(:checked) ~ .sheet-status_pip_sub_3 input[type="checkbox"] { - display: none; - } - - /* STATUS TAG TOGGLE ----------------------------------------------------------- START */ - - .sheet-stat_6_F:checked ~ .sheet-stat_5, - .sheet-stat_6_F:checked ~ .sheet-stat_4, - .sheet-stat_6_F:checked ~ .sheet-stat_3, - .sheet-stat_6_F:checked ~ .sheet-stat_2, - .sheet-stat_6_F:checked ~ .sheet-stat_1, - .sheet-stat_5_E:checked ~ .sheet-stat_4, - .sheet-stat_5_E:checked ~ .sheet-stat_3, - .sheet-stat_5_E:checked ~ .sheet-stat_2, - .sheet-stat_5_E:checked ~ .sheet-stat_1, - .sheet-stat_4_D:checked ~ .sheet-stat_3, - .sheet-stat_4_D:checked ~ .sheet-stat_2, - .sheet-stat_4_D:checked ~ .sheet-stat_1, - .sheet-stat_3_C:checked ~ .sheet-stat_2, - .sheet-stat_3_C:checked ~ .sheet-stat_1, - .sheet-stat_2_B:checked ~ .sheet-stat_1{ - display: none; - - } - - .sheet-stat_5 - .sheet-stat_4, - .sheet-stat_3, - .sheet-stat_2, - .sheet-stat_1{ - display: inline; - } - - .sheet-stat_6_F:checked ~ .sheet-stat_E, - .sheet-stat_6_F:checked ~ .sheet-stat_D, - .sheet-stat_6_F:checked ~ .sheet-stat_C, - .sheet-stat_6_F:checked ~ .sheet-stat_B, - .sheet-stat_6_F:checked ~ .sheet-stat_A, - .sheet-stat_5_E:checked ~ .sheet-stat_D, - .sheet-stat_5_E:checked ~ .sheet-stat_C, - .sheet-stat_5_E:checked ~ .sheet-stat_B, - .sheet-stat_5_E:checked ~ .sheet-stat_A, - .sheet-stat_4_D:checked ~ .sheet-stat_C, - .sheet-stat_4_D:checked ~ .sheet-stat_B, - .sheet-stat_4_D:checked ~ .sheet-stat_A, - .sheet-stat_3_C:checked ~ .sheet-stat_B, - .sheet-stat_3_C:checked ~ .sheet-stat_A, - .sheet-stat_2_B:checked ~ .sheet-stat_A{ - display: inline; - } - - - .sheet-stat_F, - .sheet-stat_E, - .sheet-stat_D, - .sheet-stat_C, - .sheet-stat_B, - .sheet-stat_A{ - display: none; - } - - .sheet-stat_E_B:checked ~ .sheet-stat_D, - .sheet-stat_E_B:checked ~ .sheet-stat_C, - .sheet-stat_E_B:checked ~ .sheet-stat_B, - .sheet-stat_E_B:checked ~ .sheet-stat_A, - .sheet-stat_D_B:checked ~ .sheet-stat_C, - .sheet-stat_D_B:checked ~ .sheet-stat_B, - .sheet-stat_D_B:checked ~ .sheet-stat_A, - .sheet-stat_C_B:checked ~ .sheet-stat_B, - .sheet-stat_C_B:checked ~ .sheet-stat_A, - .sheet-stat_B_B:checked ~ .sheet-stat_A{ - filter: brightness(160%); - -webkit-filter: brightness(160%); - } - - .sheet-stat_5_E:checked ~ .sheet-spectrum_right_cap, - .sheet-stat_4_D:checked ~ .sheet-spectrum_right_cap, - .sheet-stat_3_C:checked ~ .sheet-spectrum_right_cap, - .sheet-stat_2_B:checked ~ .sheet-spectrum_right_cap, - .sheet-stat_1_A:checked ~ .sheet-spectrum_right_cap{ - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - - .sheet-stat_6_F:checked ~ .sheet-stat_E, - .sheet-stat_6_F:checked ~ .sheet-stat_D, - .sheet-stat_6_F:checked ~ .sheet-stat_C, - .sheet-stat_6_F:checked ~ .sheet-stat_B, - .sheet-stat_6_F:checked ~ .sheet-stat_A{ - filter: brightness(200%); - -webkit-filter: brightness(200%); - } - - .sheet-stat_6_F:checked ~ .sheet-spectrum_left_cap, - .sheet-stat_6_F:checked ~ .sheet-spectrum_right_cap{ - filter: brightness(200%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(200%) drop-shadow(0px 0px 1px black); - } - - /* STATUS TAG TOGGLE ----------------------------------------------------------- END */ - - - - /* SPECTRUM 1*/ - - .sheet-spectrum_1 { - white-space: nowrap; - } - - .sheet-spectrum_1 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_1 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/rg3B6BY.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_1 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_1 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* SPECTRUM 2*/ - - .sheet-spectrum_2 { - white-space: nowrap; - } - - .sheet-spectrum_2 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_2 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/ztNJj67.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_2 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_2 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* SPECTRUM 3*/ - - .sheet-spectrum_3 { - white-space: nowrap; - } - - .sheet-spectrum_3 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_3 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/Z8z95bU.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_3 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_3 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* SPECTRUM 4*/ - - .sheet-spectrum_4 { - white-space: nowrap; - } - - .sheet-spectrum_4 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_4 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/TseF8Rt.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_4 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_4 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* SPECTRUM 5*/ - - .sheet-spectrum_5 { - white-space: nowrap; - } - - .sheet-spectrum_5 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_5 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/h8JsmKI.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_5 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_5 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* SPECTRUM 6*/ - - .sheet-spectrum_6 { - white-space: nowrap; - } - - .sheet-spectrum_6 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-spectrum_6 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/b5u5MjM.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_6 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_6 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* STATUS SPECTRUM -------------------------------------------------------- END */ - - /* DUMMY SPECTRUM -------------------------------------------------------- START */ - - /* DUMMY 1*/ - - .sheet-dummy_1 { - white-space: nowrap; - } - - .sheet-dummy_1 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_1 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/rg3B6BY.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_1 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_1 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY 2*/ - - .sheet-dummy_2 { - white-space: nowrap; - } - - .sheet-dummy_2 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_2 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/ztNJj67.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_2 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_2 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY 3*/ - - .sheet-dummy_3 { - white-space: nowrap; - } - - .sheet-dummy_3 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_3 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/Z8z95bU.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_3 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_3 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY 4*/ - - .sheet-dummy_4 { - white-space: nowrap; - } - - .sheet-dummy_4 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_4 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/TseF8Rt.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_4 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_4 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY 5*/ - - .sheet-spectrum_5 { - white-space: nowrap; - } - - .sheet-dummy_5 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_5 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/h8JsmKI.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_5 input[type="checkbox"]:checked + span::before - { - opacity: 1; - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_5 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY 6*/ - - .sheet-dummy_6 { - white-space: nowrap; - } - - .sheet-dummy_6 input[type="checkbox"] - { - opacity: 0.0; - width: 40px; - height: 60px; - position: relative; - top: 0px; - left: 50%; - cursor: pointer; - z-index: 1; - margin: -20px; - } - - - .sheet-dummy_6 input[type="checkbox"] + span::before - { - width: 40px; - height: 60px; - font-size: 40px; - text-align: center; - display: inline-block; - vertical-align: middle; - content: url(http://i.imgur.com/b5u5MjM.png); - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_6 input[type="checkbox"]:checked + span::before - { - filter: brightness(80%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); - } - - .sheet-dummy_6 input[type="checkbox"]:active + span::before - { - opacity: 1; - filter: brightness(100%) drop-shadow(0px 0px 1px white); - -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); - } - - /* DUMMY SPECTRUM -------------------------------------------------------------- END */ - - /* SPECTRUM CAPS---------------------------------------------------------------- START */ - - .sheet-spectrum_right_cap { - background: url('http://i.imgur.com/HReGU96.png') no-repeat; - display: block; - width: 30px; - height: 60px; - background-size: contain; - background-position: center; - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - .sheet-spectrum_left_cap { - background: url('http://i.imgur.com/hb5alW9.png') no-repeat; - display: block; - width: 30px; - height: 60px; - background-size: contain; - background-position: center; - filter: brightness(50%) drop-shadow(0px 0px 1px black); - -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); - } - - /* SPECTRUM CAPS --------------------------------------------------------------- END */ - -/* STATUS CARD STYLING --------------------------------------------------------- END */ - - .sheet-hidden { - display: none; - } - - .sheet-shadow { - filter: drop-shadow(0px 0px 1px rgba(0,0,0,0.5)) drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); - } - -/* ROLL TEMEPLATE CORE --------------------------------------------------------- START */ - -.sheet-rolltemplate-core { -} - -.sheet-rolltemplate-core .sheet-scraps_1 { - filter: drop-shadow(0px 5px 10px black); - overflow: visible; - margin: auto; -} - -.sheet-rolltemplate-core .sheet-scraps_1_body { - background: #fdfef9; - padding: 6px; - -} - -.sheet-rolltemplate-core .sheet-scraps_1_top { - background-image: url("https://i.imgur.com/awHCJ8P.png"); - background-repeat: repeat-x; - background-position: center; - height: 30px; - width: 100%; - -} - -.sheet-rolltemplate-core .sheet-scraps_1_bottom { - background-image: url("https://i.imgur.com/fdTFQ9k.png"); - background-repeat: repeat-x; - background-position: center; - height: 30px; - width: 100%; - -} - -/* ROLL TEMEPLATE CINEMATIC --------------------------------------------------------- START */ - -.sheet-rolltemplate-cinema { -} - -.sheet-rolltemplate-cinema .sheet-scraps_1 { - filter: drop-shadow(0px 5px 10px black); - overflow: visible; - margin: auto; -} - -.sheet-rolltemplate-cinema .sheet-scraps_1_body { - background: #fdfef9; - padding: 6px; - -} - -.sheet-rolltemplate-cinema .sheet-scraps_1_top { - background-image: url("https://i.imgur.com/awHCJ8P.png"); - background-repeat: repeat-x; - background-position: center; - height: 30px; - width: 100%; - -} - -.sheet-rolltemplate-cinema .sheet-scraps_1_bottom { - background-image: url("https://i.imgur.com/fdTFQ9k.png"); - background-repeat: repeat-x; - background-position: center; - height: 30px; - width: 100%; - -} - -/* The switch - the box around the slider */ -.sheet-switch { - position: relative; - display: inline-block; - width: 50px; - height: 24px; -} - -/* Hide default HTML checkbox */ -.sheet-switch input { - opacity: 0; - width: 0; - height: 0; -} - -/* The slider */ -.sheet-slider { - -webkit-transition: .4s; - background-color: #ccc; - border-radius: 34px; - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - transition: .4s; -} - -.sheet-slider:before { - -webkit-transition: .4s; - background-color: white; - border-radius: 50%; - bottom: 4px; - content: ""; - height: 16px; - left: 4px; - position: absolute; - transition: .4s; - width: 16px; -} - -input:checked + .sheet-slider { - background-color: #a1574a; -} - -input:focus + .sheet-slider { - box-shadow: 0 0 1px lightgrey; -} - -input:checked + .sheet-slider:before { - -webkit-transform: translateX(26px); - -ms-transform: translateX(26px); - transform: translateX(26px); -} - -input.sheet-status-toggle[value='true'] ~ div.sheet-moves_mat, -input.sheet-status-toggle[value='true'] ~ div.sheet-theme_card_mat { - display: none; -} \ No newline at end of file diff --git a/City Of Mist Offical/city-of-mist-preview.jpg b/City Of Mist Official/city-of-mist-preview.jpg similarity index 100% rename from City Of Mist Offical/city-of-mist-preview.jpg rename to City Of Mist Official/city-of-mist-preview.jpg diff --git a/City Of Mist Official/city-of-mist.css b/City Of Mist Official/city-of-mist.css new file mode 100644 index 0000000000..566cb339a0 --- /dev/null +++ b/City Of Mist Official/city-of-mist.css @@ -0,0 +1,6480 @@ +/* GENERAL FORMATING START ----------------------------------------------------- GENERAL FORMATING START */ + +@font-face { + font-family: 'Contrail One'; + src: url('https://fonts.googleapis.com/css?family=Contrail+One'); +} + +@font-face { + font-family: 'Rock Salt'; + src: url('https://fonts.googleapis.com/css?family=Rock+Salt'); +} + + .sheet-hidden { + display: none; + } + + + .sheet-section { + width: 100%; + display: block; + clear: both; + padding: 0 !important; + + } + + .sheet-line { + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-stretch { + width: 100%; + } + + .sheet-right { + float: right; + } + + .sheet-center { + margin: auto; + text-align: center; + } + + .sheet-middle { + display: -webkit-flex; + display: flex; + -webkit-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-align-content: center; + align-content: center; + } + + .sheet-left { + float: left; + } + + textarea { + resize: none; + } + + label { + color: #453428; + } + + textarea { + height: 50px; + } + + input[type=checkbox] { + box-shadow: none; + height: 18px; + width: 18px; + background: #fff; + vertical-align: middle; + } + + button[type=roll] .sheet-blank-roll-button::before { content: ''; } + + button[type=roll]:focus { + outline:0; + } + + .sheet-character_sheet { + width: 100%; + margin: 0px; + padding: 0px; + overflow-x: hidden; + } + +/* GENERAL FORMATING END ------------------------------------------------------- GENERAL FORMATING END */ + +/* SPECIAL CASE FORMATING START ------------------------------------------------ SPECIAL CASE FORMATING START */ + + /*CLEAR BUTTON ---------------------------------------------------------------- START*/ + + .sheet-clear_check { + opacity: 0; + position: relative; + top: 0px; + left: 0px; + cursor: pointer; + z-index: 1; + } + + .sheet-clear_button { + width: 100%; + height: 28px; + background: lightgrey; + border: solid; + border-width: 1px; + border-color: darkgrey; + border-radius: 5px; + } + + .sheet-clear_button:hover { + background: white; + } + + .sheet-clear_button:active { + background: white; + border-color: white; + } + + .sheet-clear_label{ + position: relative; + bottom: 22px; + } + + /*CLEAR BUTTON ----------------------------------------------------------------- END*/ + + .sheet-playbook_logostags { + color: black; + font-size: 12px; + font-style: italic; + background: #fff1a2; + } + + .sheet-playbook_mythostags { + color: white; + font-size: 12px; + font-style: italic; + background: #512b71; + } + + .sheet-playbook_statustags { + color: black; + font-size: 12px; + font-style: italic; + background: #d9e8ae; + } + + .sheet-playbook_spectrumtags { + color: black; + font-size: 12px; + font-style: italic; + background: #daaca3; + } + +/* SPECIAL CASE FORMATING END -------------------------------------------------- SPECIAL CASE FORMATING END */ + + .sheet-moves_mat { + position: relative; + top: -30px; + width: 100%; + height: 260px; + margin: 0px 0px -20px; + perspective: 2000px; + transform:translate3d(0,0,0); + -webkit-transform:translate3d(0,0,0); + z-index: 50; + + } + + .sheet-moves_sheet .sheet-move_button { + width: 200px; + margin: 5px; + + } + + .sheet-moves_sheet .sheet-move_button:hover { + background-color: white; + } + + .sheet-moves_sheet .sheet-move_button:active { + background-color: white; + border: white; + box-shadow: 0px 0px 1px white; + } + + .sheet-move_sheet_header { + width: 438px; + height: 36px; + margin: -10px -10px 10px -10px; + background-color: #726960; + + border-radius: 8px 8px 0px 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-moves_sheet_title { + height: 36px; + padding: 0px 5px; + margin: 0px 10px; + background: transparent; + border: none; + outline: none; + + + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + } + + .sheet-core_moves_sheet { + position: absolute; + left: calc(25% - 250px); ; + top: 0px; + transform: rotate(1.2deg) scale(0.9, 0.9); + } + + .sheet-cinematic_moves_sheet { + position: absolute; + left: calc(75% - 250px); ; + top: 0px; + transform: rotate(-1.2deg) scale(0.9, 0.9); + } + + .sheet-core_moves_sheet:hover { + z-index: 100; + } + + .sheet-cinematic_moves_sheet:hover { + z-index: 100; + } + + .sheet-moves_sheet { + + width: 500px; + background-color: #e6e0d3; + box-shadow: inset 0px 0px 40px 10px #d2cac3; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + mask-image: url(https://i.imgur.com/O6JNLDM.png); + mask-size: 100% auto; + mask-position: center center; + mask-repeat: repeat-y; + + -webkit-mask-image: url(https://i.imgur.com/O6JNLDM.png); + -webkit-mask-size: 100% auto; + -webkit-mask-position: center center; + -webkit-mask-repeat: repeat-y; + + padding: 30px 30px; + } + + .sheet-moves_sheet_inset { + border: 2px solid #726960; + border-radius: 10px; + + height: 100%; + padding: 10px; + margin: 0px auto; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-moves_sheet_line { + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + } + + .sheet-moves_sheet_column { + width: 100%; + height: 140px; + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-moves_sheet_number { + height: 60px; + width: 100%; + margin-bottom: 10px; + + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-moves_sheet_number .sheet-clear_button { + width: 60px; + height: 30px; + position: relative; + top: 14px; + margin-left: -20px; + margin-right: -10px; + + transform-origin: center center; + transform: rotate(-84deg) skew(6deg); + -ms-transform: rotate(-84deg) skew(6deg); /* IE 9 */ + -webkit-transform: rotate(-84deg) skew(6deg); /* Safari */ + } + + .sheet-moves_sheet_number .sheet-clear_button label { + width: 60px; + margin-right: 0px; + transform: rotate(0deg); + -ms-transform: rotate(0deg); /* IE 9 */ + -webkit-transform: rotate(0deg); /* Safari */ + transform-origin: center center; + } + + .sheet-moves_sheet_number label { + text-align:center; + width: 60px; + margin-right: -40px; + transform: rotate(-84deg) skew(6deg); + -ms-transform: rotate(-84deg) skew(6deg); /* IE 9 */ + -webkit-transform: rotate(-84deg) skew(6deg); /* Safari */ + transform-origin: center center; + } + + .sheet-moves_sheet_number input[type=number] { + height: 60px; + margin-right: 10px; + background: white; + border: none; + padding: auto; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + text-align: center; + word-wrap: break-word; + word-break: keep-all; + overflow:hidden; + + font-family: Sans-Serif; + letter-spacing: -2px; + line-height: 60px; + font-size: 46px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: black; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + } + + .sheet-core_moves_check { + width: 125px; + margin-right: 10px; + white-space: nowrap; + position: relative; + top: -4px; + } + + .sheet-core_moves_check input[type="radio"] + { + opacity: 0; + width: 100%; + height: 36px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -50%; + } + +/* + .sheet-core_moves_check input[type="radio"] + span::before + { + content: "CORE MOVES"; + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + + width: 100%; + height: 100%; + text-align: center; + display: inline-block; + vertical-align: middle; + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-core_moves_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-core_moves_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } +*/ + + + .sheet-core_moves_check input[type="radio"] + span + { + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + + width: 100%; + height: 100%; + text-align: center; + display: inline-block; + vertical-align: middle; + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-core_moves_check input[type="radio"]:checked + span + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-core_moves_check input[type="radio"]:active + span + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + + .sheet-cinematic_moves_check { + width: 175px; + margin-left: 10px; + white-space: nowrap; + position: relative; + top: -4px; + } + + .sheet-cinematic_moves_check input[type="radio"] + { + opacity: 0; + width: 100%; + height: 36px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -50%; + } + +/* + .sheet-cinematic_moves_check input[type="radio"] + span::before + { + content: "CINEMATIC MOVES"; + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + + width: 100%; + height: 100%; + text-align: center; + display: inline-block; + vertical-align: middle; + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-cinematic_moves_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-cinematic_moves_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } +*/ + .sheet-cinematic_moves_check input[type="radio"] + span + { + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + + width: 100%; + height: 100%; + text-align: center; + display: inline-block; + vertical-align: middle; + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-cinematic_moves_check input[type="radio"]:checked + span + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-cinematic_moves_check input[type="radio"]:active + span + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + + .sheet-core_moves_switch:not(:checked) ~ .sheet-core_moves_body { + display: none; + } + + .sheet-cinematic_moves_switch:not(:checked) ~ .sheet-cinematic_moves_body { + display: none; + } + + .sheet-burn_roll_switch:checked ~ .sheet-standard_roll_body { + display: none; + } + + .sheet-burn_roll_switch:not(:checked) ~ .sheet-burn_roll_body { + display: none; + } + + /* DYNAMITE CHECK ----------------------------------------------- DYNAMITE CHECK */ + + .sheet-dynamite_check { + white-space: nowrap; + margin: 5px; + } + + .sheet-dynamite_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-dynamite_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/fl8SIc1.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-dynamite_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-dynamite_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-dynamite_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-dynamite_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/fl8SIc1.png); + opacity: 1; + filter: brightness(0%); + -webkit-filter: brightness(0%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* BURN ROLL CHECK ----------------------------------------------- BURN ROLL CHECK */ + + .sheet-burn_roll_check { + white-space: nowrap; + margin: 5px; + } + + .sheet-burn_roll_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-burn_roll_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/U4fwJaK.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-burn_roll_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-burn_roll_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-burn_roll_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-burn_roll_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/U4fwJaK.png); + opacity: 1; + filter: brightness(0%); + -webkit-filter: brightness(0%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* MUTE CHECK ----------------------------------------------- MUTE CHECK */ + + .sheet-mute_check { + white-space: nowrap; + margin: 5px; + } + + .sheet-mute_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-mute_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/uwrfzd5.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-mute_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-mute_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-mute_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-mute_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/uwrfzd5.png); + opacity: 1; + filter: brightness(0%); + -webkit-filter: brightness(0%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* TOOLTIPS START ---------------------------------------------------------- TOOL TIPS START */ + + .sheet-moves_sheet_roll_tooltip { + height: 36px; + + position: absolute; + right: 115px; + top: -1px; + + + font-family: 'Contrail One', Sans-Serif; + font-size: 18px; + line-height: 36px; + text-align: right; + color: white; + } + + .sheet-dynamite_check:not(:hover) ~ .sheet-dynamite_tooltip, + .sheet-burn_roll_check:not(:hover) ~ .sheet-burn_roll_tooltip, + .sheet-mute_check:not(:hover) ~ .sheet-mute_tooltip { + display: none; + } + +/* CORE MOVE BAR START --------------------------------------------------------- CORE MOVE BAR START */ + + .sheet-core_moves_grid { + width: 100%; + height: 200px; + margin: 0px; + padding: 0px; + + position: relative; + + background: #D3D3D3; + } + + .sheet-core_power_indicator { + height: 160px; + width: 230px; + padding: 10px; + + background-color: white; + border-radius: 10px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + position: absolute; + top: calc(50% - 80px); + left: calc(50% - 115px); + + } + + .sheet-core_move_container_left { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-between; + + height: 170px; + width: 260px; + padding: 10px; + + background-color: white; + border-radius: 10px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + position: absolute; + top: calc(50% - 85px); + left: calc(20% - 130px); + + } + + .sheet-core_move_container_right { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-between; + height: 170px; + width: 260px; + padding: 10px; + + background-color: white; + border-radius: 10px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + position: absolute; + top: calc(50% - 85px); + left: calc(80% - 130px); + + } + + + .sheet-move_button { + width: 240px; + height: 30px; + padding: 0px; + background: lightgrey; + border: solid; + border-width: 1px; + border-color: darkgrey; + border-radius: 5px; + margin: 5px 10px; + } + + .sheet-move_button { + font-size: 0.75em; + } + + .sheet-move_button:hover { + } + + .sheet-move_button:active { + background: white; + } + + .sheet-move_button:before { + content: "" !important; + font-size: 0.75em; + display: none; + } + + .sheet-move_button label{ + text-transform: uppercase; + font-size: 0.75em; + } + +/* CORE MOVE BAR END ----------------------------------------------------------- CORE MOVE BAR END */ + +/* THEME CARD MAT START -------------------------------------------------------- THEME CARD MAT START */ + + /* CARD POSITIONING -------------------------------------------------------- CARD POSITIONING */ + + .sheet-theme_card_mat { + width: 100%; + min-height: 700px; + margin: 0px 0px 40px; + padding: 0px; + + position: relative; + transform:translate3d(0,0,0); + -webkit-transform:translate3d(0,0,0); + perspective: 2000px; + } + + .sheet-theme_card_1, + .sheet-theme_card_2, + .sheet-theme_card_3, + .sheet-theme_card_4, + .sheet-theme_card_5, + .sheet-theme_card_6, + .sheet-theme_card_7, + .sheet-theme_card_8, + .sheet-theme_card_t { + position: absolute; + transition: all 0.6s ease-in-out, z-index 0s, transform 0.2s ease-in-out, top 0.2s ease-in-out; + z-index: 200; + transform-origin: center top; + filter: blur(0px) grayscale(0%) drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + padding: 0px; + margin: 0px; + border: none; + overflow: visible; + } + + .sheet-theme_card_t { + top: 70px; + left: calc(85% - 130px); + transform: rotate(6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_1 { + top: 50px; + left: calc(71% - 130px); + transform: rotate(3.6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_2 { + top: 40px; + left: calc(57% - 130px); + transform: rotate(1.2deg) scale(0.9, 0.9); + } + + .sheet-theme_card_3 { + top: 40px; + left: calc(43% - 130px); + transform: rotate(-1.2deg) scale(0.9, 0.9); + } + + .sheet-theme_card_4 { + top: 50px; + left: calc(29% - 130px); + transform: rotate(-3.6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_5 { + visibility: hidden; + opacity: 0; + top: 50px; + left: calc(29% - 130px); + transform: rotate(-3.6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_6 { + visibility: hidden; + opacity: 0; + top: 50px; + left: calc(29% - 130px); + transform: rotate(-3.6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_7 { + visibility: hidden; + opacity: 0; + top: 50px; + left: calc(29% - 130px); + transform: rotate(-3.6deg) scale(0.9, 0.9); + } + + .sheet-theme_card_8 { + top: 70px; + left: calc(15% - 130px); + transform: rotate(-6deg) scale(0.9, 0.9); + } + + + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1 { + top: 53px; + left: calc(73.3% - 130px); + transform: rotate(4deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2 { + + top: 42px; + left: calc(61.6% - 130px); + transform: rotate(2deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3 { + top: 39px; + left: calc(50% - 130px); + transform: rotate(0deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4 { + top: 42px; + left: calc(38.4% - 130px); + transform: rotate(-2deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5 { + visibility: visible; + opacity: 1; + top: 53px; + left: calc(26.7% - 130px); + transform: rotate(-4deg) scale(0.9, 0.9); + } + + + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1 { + top: 55px; + left: calc(75% - 130px); + transform: rotate(4.29deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2 { + top: 45px; + left: calc(65% - 130px); + transform: rotate(2.57deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3 { + top: 39px; + left: calc(55% - 130px); + transform: rotate(0.86deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4 { + top: 39px; + left: calc(45% - 130px); + transform: rotate(-0.86deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5 { + visibility: visible; + opacity: 1; + top: 45px; + left: calc(35% - 130px); + transform: rotate(-2.57deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6 { + visibility: visible; + opacity: 1; + top: 55px; + left: calc(25% - 130px); + transform: rotate(-4.29deg) scale(0.9, 0.9); + } + + + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1 { + top: 56px; + left: calc(76.2% - 130px); + transform: rotate(4.5deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2 { + top: 47px; + left: calc(67.5% - 130px); + transform: rotate(3deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3 { + top: 41px; + left: calc(58.7% - 130px); + transform: rotate(1.5deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4 { + visibility: visible; + opacity: 1; + top: 39px; + left: calc(50% - 130px); + transform: rotate(0deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5 { + visibility: visible; + opacity: 1; + top: 41px; + left: calc(41.3% - 130px); + transform: rotate(-1.5deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6 { + visibility: visible; + opacity: 1; + top: 47px; + left: calc(32.5% - 130px); + transform: rotate(-3deg) scale(0.9, 0.9); + } + + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7 { + visibility: visible; + opacity: 1; + top: 56px; + left: calc(23.8% - 130px); + transform: rotate(-4.5deg) scale(0.9, 0.9); + } + + + + + .sheet-theme_card_1:hover, + .sheet-theme_card_2:hover, + .sheet-theme_card_3:hover, + .sheet-theme_card_4:hover, + .sheet-theme_card_8:hover, + .sheet-theme_card_t:hover, + .sheet-theme_card_1:focus-within, + .sheet-theme_card_2:focus-within, + .sheet-theme_card_3:focus-within, + .sheet-theme_card_4:focus-within, + .sheet-theme_card_8:focus-within, + .sheet-theme_card_t:focus-within { + z-index: 250; + top: 30px; + transform: rotate(0deg) scale(1, 1); + } + + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_8:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_t:hover, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_1:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_2:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_3:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_4:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_5:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_8:focus-within, + .sheet-extra_theme_card_1_switch:checked ~ .sheet-theme_card_t:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_8:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_t:hover, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_1:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_2:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_3:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_4:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_5:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_6:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_8:focus-within, + .sheet-extra_theme_card_2_switch:checked ~ .sheet-theme_card_t:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_8:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_t:hover, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_1:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_2:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_3:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_4:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_5:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_6:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_7:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_8:focus-within, + .sheet-extra_theme_card_3_switch:checked ~ .sheet-theme_card_t:focus-within { + z-index: 250; + top: 30px; + transform: rotate(0deg) scale(1, 1); + } + + .sheet-playbook_switch:checked ~ .sheet-theme_card_1, + .sheet-playbook_switch:checked ~ .sheet-theme_card_2, + .sheet-playbook_switch:checked ~ .sheet-theme_card_3, + .sheet-playbook_switch:checked ~ .sheet-theme_card_4, + .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_1, + .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_2, + .sheet-playbook_switch:checked ~ .sheet-extra_theme_card_3, + .sheet-playbook_switch:checked ~ .sheet-theme_card_crew, + .sheet-playbook_switch:checked ~ .sheet-theme_card_character { + top: 40px; + left: 20px; + transform: rotate(0deg) scale(0.9, 0.9); + filter: blur(3px) grayscale(60%) drop-shadow(0px 20px 25px rgba(0,0,0,0)); + } + + .sheet-playbook_character_switch:checked ~ .sheet-theme_card_character, + .sheet-playbook_crew_switch:checked ~ .sheet-theme_card_crew, + .sheet-playbook_theme1_themebook_switch:checked ~ .sheet-theme_card_1, + .sheet-playbook_theme2_themebook_switch:checked ~ .sheet-theme_card_2, + .sheet-playbook_theme3_themebook_switch:checked ~ .sheet-theme_card_3, + .sheet-playbook_theme4_themebook_switch:checked ~ .sheet-theme_card_4, + .sheet-playbook_extra_theme1_themebook_switch:checked ~ .sheet-extra_theme_card_1, + .sheet-playbook_extra_theme2_themebook_switch:checked ~ .sheet-extra_theme_card_2, + .sheet-playbook_extra_theme3_themebook_switch:checked ~ .sheet-extra_theme_card_3 { + z-index: 300; + top: 30px; + transform: rotate(0deg) scale(1, 1); + filter: blur(0px) grayscale(0%) drop-shadow(0px 20px 25px rgba(0,0,0,0.25)); + } + +/* THEME CARD MAT END ---------------------------------------------------------- THEME CARD MAT END */ + +/* THEME CARD STYLING ---------------------------------------------------------- START */ + + /* CARD FLIP MECHANICS ------------------------------------- CARD FLIP MECHANICS */ + + .sheet-card_flip { + height: 100%; + width: 100%; + + position: absolute; + transform-origin: right center; + transform-style: preserve-3d; + -webkit-transform-style: preserve-3d; + + transition: all 0.6s; + -webkit-transition: all 0.6s; + + transition-timing-function: ease-in-out; + -webkit-transition-timing-function: ease-in-out; + } + + .sheet-side { + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + backface-visibility: hidden; + position: absolute; + overflow: visible; + } + + .sheet-front { + transform: rotateY( 360deg ); + } + + .sheet-back { + transform: rotateY( 180deg ); + } + + .sheet-flip:checked ~ .sheet-card_flip { + transform: translateX( -100% ) rotateY( -180deg ); + } + + /* CARD STYLING ------------------------------------------------ CARD STYLING */ + + .sheet-theme_card_container { + height: 660px; + width: 260px; + float: left; + flex-shrink: 1; + padding: 0px; + border: none; + + perspective: 2000px; + + } + + .sheet-theme_card input[type=checkbox] { + box-shadow: none; + height: 18px; + width: 18px; + background: #fff; + vertical-align: middle; + } + + .sheet-theme_card { + height: 100%; + width: 100%; + border: 1px solid white; + border-radius: 12px 12px 12px 12px; + padding: 10px; + display: flex; + flex-flow: column nowrap; + + } + + .sheet-theme_inset { + display: flex; + flex-flow: column nowrap; + margin: 0px; + padding: 0px; + height: 100%; + width: 100%; + border-radius: 10px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-shadow: inset 0px 0px 55px 25px #d2cac3; + } + + .sheet-theme_header { + height: 32px; + border-radius: 10px 10px 0px 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-theme_footer { + height: 32px; + margin-top: auto; + border-radius: 0px 0px 10px 10px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-theme_select { + margin: auto; + } + + .sheet-theme_select select { + height: 18px; + width: 100%; + padding: 0px 5px; + margin: auto; + background: transparent; + border: none; + outline: none; + + color: white; + text-shadow: 0px 0px 2px black; + font-family: 'Contrail One', Sans-Serif; + line-height: 16px; + font-size: 16px; + font-style: normal; + text-transform: uppercase; + } + + .sheet-theme_select option { + text-align: left; + } + + .sheet-theme_body { + height: 574px; + margin: 0px; + padding: 0px; + border: none; + } + + .sheet-theme_details { + padding: 0px; + margin: 0px; + } + + .sheet-theme_title { + display: block; + width: 95%; + height: 84px; + background: transparent; + border: none; + margin: 6px auto; + padding: auto; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + text-align: center; + word-wrap: break-word; + word-break: keep-all; + overflow:hidden; + + font-family: 'Contrail One', Sans-Serif; + letter-spacing: -2px; + line-height: 40px; + font-size: 38px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: black; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + } + + .sheet-theme_identity_mystery { + display: block; + width: 95%; + height: 36px; + border: none; + outline: none; + margin: 2px auto 6px; + padding: 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + font-family: 'Rock Salt', 'Shadows Into Light', cursive; + font-size: 16px; + font-style: normal; + font-weight: 600; + letter-spacing: 0px; + line-height: 18px; + text-transform: uppercase; + + word-wrap: break-word; + word-break: keep-all; + overflow: hidden; + background: transparent; + } + + .sheet-theme_concept { + display: block; + width: 90%; + height: 42px; + border: none; + outline: none; + margin: 2px auto 6px; + padding: 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + font-size: 12px; + font-style: normal; + font-weight: normal; + letter-spacing: 0px; + line-height: 14px; + + word-wrap: break-word; + word-break: keep-all; + overflow: hidden; + background: transparent; + } + + .sheet-theme_label { + font-size: 16px; + font-weight: bolder; + text-shadow: 0px 0px 2px #534233; + vertical-align: text-top; + margin: auto 0px; + + } + + .sheet-theme_divider { + height: 4px; + border-radius: 2px; + margin: auto; + } + + .sheet-theme_exp_label { + height: 18px; + margin: 3px; + padding: 0px; + font-size: 12px; + line-height: 18px; + } + + /* ATTENTION CHECK ---------------------------------------------------------- ATTENTION CHECK */ + + .sheet-attention_check { + width: 18px; + height: 18px; + margin: 0px 1px; + padding: 0px; + + position: relative; + white-space: nowrap; + transform: scale(0.9, 0.9); + transform-origin: center center; + + } + + .sheet-attention_check input[type="checkbox"] + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-attention_check input[type="checkbox"] + span::before + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/nOPQB6O.png); + opacity: 1; + + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-attention_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-attention_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-attention_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-attention_image span + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/nOPQB6O.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* CRACK CHECK ---------------------------------------------------------- CRACK CHECK */ + + .sheet-crack_check { + width: 18px; + height: 18px; + margin: 0px 1px; + padding: 0px; + + position: relative; + white-space: nowrap; + transform: scale(0.9, 0.9); + transform-origin: center center; + } + + .sheet-crack_check input[type="checkbox"] + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-crack_check input[type="checkbox"] + span::before + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/LZlk31P.png); + opacity: 1; + + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-crack_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-crack_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-crack_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-crack_image span + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/LZlk31P.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* CRACK CHECK ---------------------------------------------------------- CRACK CHECK */ + + .sheet-buildup_check { + width: 18px; + height: 18px; + margin: 0px 3px; + padding: 0px; + + position: relative; + white-space: nowrap; + transform: scale(0.9, 0.9); + transform-origin: center center; + } + + .sheet-buildup_check input[type="checkbox"] + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-buildup_check input[type="checkbox"] + span::before + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/VpWGwCT.png); + opacity: 1; + + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-buildup_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-buildup_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-buildup_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-buildup_image span + { + width: 18px; + height: 18px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/VpWGwCT.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* EXPERIENC ROW -------------------------------------------------------- START */ + + .sheet-exp_grid { + width: 100%; + margin: 0px; + display: flex; + flex-direction: row-reverse; + flex-wrap: nowrap; + justify-content: flex-end; + } + + .sheet-attention_check:hover ~ .sheet-attention_check span, + .sheet-crack_check:hover ~ .sheet-crack_check span, + .sheet-buildup_check:hover ~ .sheet-buildup_check span { + filter: brightness(200%); + -webkit-filter: brightness(200%); + } + + .sheet-attention_check:hover span, + .sheet-crack_check:hover span, + .sheet-buildup_check:hover span, + .sheet-attention_check:checked ~ .sheet-attention_check span, + .sheet-crack_check:checked ~ .sheet-crack_check span, + .sheet-buildup_check:checked ~ .sheet-buildup_check span { + filter: brightness(200%); + -webkit-filter: brightness(200%); + } + + /* EXPERIENC ROW -------------------------------------------------------- END */ + + .sheet-theme_powertags { + height: 250px; + padding: 0px 6px; + margin: 0px 0px auto; + } + + .sheet-theme_weaknesstags { + height: 120px; + padding: 0px 6px; + margin: 0px; + } + + .sheet-theme_line { + width: 100%; + height: 22px; + margin: auto 0px; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-theme_tag_label { + font-size: 14px; + width: 100%; + height: 18px; + line-height: 18px; + padding: 0px 5px; + background: transparent; + border: none; + outline: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + overflow:hidden; + resize:none; + } + + .sheet-theme_improvements { + padding: 6px 6px 0px; + margin: 0px 0px auto; + } + + .sheet-theme_improv_label { + font-weight: bold; + line-height: 1.0; + margin: auto 0px; + } + + .sheet-theme_improv_desc{ + margin: 3px 0px 5px; + font-size: 11px; + line-height: 1.0; + font-weight: normal; + word-wrap: break-word; + } + + .sheet-theme_improvement_label { + font-size: 14px; + width: 240px; + height: 18px; + line-height: 18px; + + margin: auto; + padding: 0px 5px; + + background: transparent; + border: none; + outline: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + overflow:hidden; + resize:none; + + + font-weight: bold; + line-height: 1.0; + } + + .sheet-theme_improvement_field { + margin: 3px 0px 5px; + font-size: 11px; + line-height: 1.0; + font-weight: normal; + + word-wrap: break-word; + word-break: keep-all; + overflow: hidden; + + height: 55px; + background: transparent; + border: none; + outline: none; + margin: 0px auto; + padding: 0px; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + } + + .sheet-theme_flipside { + height: 120px; + padding: 0px 6px; + margin: 0px; + overflow: hidden; + } + + .sheet-theme_fliptext { + + display: block; + height: 100%; + width: 100%; + border: none; + outline: none; + margin: 0px auto; + padding: 0px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + font-size: 14px; + font-style: normal; + font-weight: normal; + letter-spacing: 0px; + line-height: 16px; + + word-wrap: break-word; + word-break: keep-all; + overflow: hidden; + background: transparent; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + } + + .sheet-theme_flip { + width: 100%; + height: 32px; + margin: 0px; + } + + + .sheet-theme_flip input[type="radio"] { + opacity: 0; + width: 100%; + height: 32px; + position: relative; + top: 0px; + left: 50%; + margin: -50%; + z-index: 1; + } + + + .sheet-theme_flip span { + width: 100%; + height: 32px; + border: none; + line-height: 32px; + text-align: center; + display: inline-block; + vertical-align: middle; + + font-family: 'Contrail One', Sans-Serif; + font-size: 16px; + letter-spacing: 0px; + font-style: normal; + font-variant: small-caps; + font-weight: bolder; + color: white; + text-shadow: 0px 0px 1px black; + text-transform: uppercase; + position: relative; + top: 1px; + } + + /* CHARACTER CARD --------------------------------------------- CHARACTER CARD */ + + .sheet-identity_select { + height: 16px; + width: 100%; + padding: 0px 8px; + margin: auto; + + color: white; + text-shadow: 0px 0px 2px black; + font-family: 'Contrail One', Sans-Serif; + line-height: 16px; + font-size: 16px; + font-style: normal; + vertical-align: middle; + text-transform: uppercase; + } + + .sheet-identity_concept, + .sheet-theme_identity_mystery { + display: block; + width: 90%; + height: 80px; + border: none; + outline: none; + margin: 2px auto; + padding-right: 5%; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + font-family: fantasy; + font-size: 16px; + font-style: italic; + font-weight: 600; + letter-spacing: 1px; + line-height: 18px; + text-transform: uppercase; + + word-wrap: break-word; + word-break: keep-all; + overflow: overlay; + background: transparent; + } + + .sheet-identity_theme { + width: 100%; + padding: 0px 6px; + margin: 0px ; + } + + .sheet-identity_crew { + width: 225px; + padding: 0px 6px; + height: 140px; + margin: 0px ; + } + + .sheet-identity_story { + width: 225px; + padding: 0px 6px; + height: 140px; + margin: auto 0px 0px; + } + + .sheet-identity_evolution { + width: 225px; + height: 265px; + padding: 0px 6px; + margin: 6px auto 6px; + + } + + .sheet-evo_line { + width: 100%; + margin: 4px 0px; + } + + .sheet-evo_checkbox { + float: left; + margin-right: 4px; + } + + .sheet-evo_label { + font-size: 12px; + padding: auto 0px; + } + + .sheet-evo_extratheme1:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_extratheme2, + .sheet-evo_extratheme2:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_extratheme3, + .sheet-evo_dynamite1:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_dynamite2, + .sheet-evo_dynamite2:not(:checked) ~ .sheet-evo_line .sheet-evo_checkbox_dynamite3 { + visibility: hidden; + } + + .sheet-identity_notes { + width: 225px; + height: 265px; + padding: 0px 6px; + margin: 6px auto; + } + + .sheet-identity_line { + width: 100%; + height: 22px; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-identity_column { + width: 80px; + float: right; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-identity_helphurt { + height: 18px; + width: 40px; + padding: 0px; + margin: 0px auto; + text-align: center; + background: transparent; + border: none; + outline: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + font-size: 16px; + font-style: normal; + font-weight: normal; + letter-spacing: 0px; + line-height: 18px; + text-transform: uppercase; + + word-wrap: break-word; + word-break: keep-all; + overflow: hidden; + } + + /* LOGOS STYLING ------------------------------------------- LOGOS STYLING */ + + .sheet-logos_card .sheet-theme_card { + background-color: #e6e0d3; + box-shadow: inset 0px 0px 25px 5px #d2cac3; + } + + .sheet-logos_card .sheet-theme_inset { + box-shadow: inset 0px 0px 55px 25px #d2cac3; + } + + .sheet-logos_card .sheet-theme_header, + .sheet-logos_card .sheet-theme_footer { + background-color: #a1574a ; + } + + .sheet-logos_card .sheet-theme_select option { + background-color: #a1574a ; + } + + .sheet-logos_card .sheet-theme_divider { + background-color: #a1574a ; + } + + /* MYTHOS STYLING ----------------------------------------- MYTHOS STYLING */ + + .sheet-mythos_card .sheet-theme_card { + background-color: #e4dfd4; + box-shadow: inset 0px 0px 25px 5px #cbbfcd; + } + + .sheet-mythos_card .sheet-theme_inset { + background-color: #ccc0cc; + box-shadow: inset 0px 0px 55px 25px #b19eba; + } + + .sheet-mythos_card .sheet-theme_header, + .sheet-mythos_card .sheet-theme_footer { + background-color: #6f5d6e ; + } + + .sheet-mythos_card .sheet-theme_select option { + background-color: #6f5d6e ; + } + + .sheet-mythos_card .sheet-theme_divider { + background-color: #6f5d6e ; + } + + /* IDENTITY STYLING ------------------------------------- IDENTITY STYLING */ + + .sheet-identity_card .sheet-theme_card { + background-color: #e1ddd4; + box-shadow: inset 0px 0px 25px 5px #cec9c5; + } + + .sheet-identity_card .sheet-theme_inset { + background-color: #e1ded9; + box-shadow: inset 0px 0px 55px 25px #cec9c5; + } + + .sheet-identity_card .sheet-theme_header, + .sheet-identity_card .sheet-theme_footer { + background-color: #726960 ; + } + + .sheet-identity_card .sheet-theme_select option { + background-color: #726960 ; + } + + .sheet-identity_card .sheet-theme_divider { + background-color: #726960 ; + } + + /* CHECK STYLING ----------------------------------------------- CHECK STYLING */ + + /* LOGOS CHECK ----------------------------------------------- LOGOS CHECK */ + + .sheet-logos_check { + white-space: nowrap; + } + + .sheet-logos_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-logos_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/87FMS1R.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-logos_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-logos_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-logos_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/87FMS1R.png); + opacity: 1; + filter: brightness(0%); + -webkit-filter: brightness(0%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* MYTHOS CHECK --------------------------------------------- MYTHOS CHECK */ + + .sheet-mythos_check { + white-space: nowrap; + } + + .sheet-mythos_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-mythos_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/QnGFnMB.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-mythos_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-mythos_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-mythos_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/HgywpVb.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* IDENTITY CHECK ----------------------------------------- IDENTITY CHECK */ + + .sheet-identity_check { + white-space: nowrap; + } + + .sheet-identity_check input[type="checkbox"] + { + opacity: 0.0; + width: 33px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px -17px; + } + + + .sheet-identity_check input[type="checkbox"] + span::before + { + width: 33px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/YrYX9ri.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-identity_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-identity_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* CREW CHECK ------------------------------------------------- CREW CHECK */ + + .sheet-crew_check { + white-space: nowrap; + } + + .sheet-crew_check input[type="checkbox"] + { + opacity: 0.0; + width: 33px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px -17px; + } + + + .sheet-crew_check input[type="checkbox"] + span::before + { + width: 33px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/xEFubud.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-crew_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-crew_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* EXTRA CHECK ------------------------------------------------- EXTRA CHECK */ + + .sheet-extra_check { + white-space: nowrap; + } + + .sheet-extra_check input[type="checkbox"] + { + opacity: 0.0; + width: 33px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px -17px; + } + + + .sheet-extra_check input[type="checkbox"] + span::before + { + width: 33px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/tF4WDzo.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-extra_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-extra_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* BURN CHECK -------------------------------------------------- BURN CHECK*/ + + .sheet-burn_check { + white-space: nowrap; + } + + .sheet-burn_check input[type="checkbox"] + { + opacity: 0.0; + width: 18px; + height: 18px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -9px; + } + + + .sheet-burn_check input[type="checkbox"] + span::before + { + width: 18px; + height: 18px; + font-size: 18px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/OSiNxHY.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-burn_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-burn_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* PLAYBOOK CHECK ------------------------------------------ PLAYBOOK CHECK*/ + + .sheet-playbook_check { + display: none; + } + .sheet-playbook_check input[type="checkbox"] + { + opacity: 0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 13px; + margin: -13px; + cursor: pointer; + z-index: 2; + } + + + .sheet-playbook_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + font-size: 20px; + opacity: 1; + z-index: 1; + content: url(https://i.imgur.com/3c9mAC3.png); + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-playbook_check input[type="checkbox"]:checked + span::before { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-playbook_check input[type="checkbox"]:active + span::before { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* CARD MECHANICS ---------------------------------------------------------- CARD MECHANICS */ + + /* LOGOS MYTHOS TOGGLE ------------------------------------------------- LOGOS MYTHOS TOGGLE */ + + .sheet-logos_1_card, + .sheet-logos_2_card, + .sheet-logos_3_card, + .sheet-logos_4_card{ + display: initial; + } + + .sheet-mythos_1_card, + .sheet-mythos_2_card, + .sheet-mythos_3_card, + .sheet-mythos_4_card{ + display: initial; + } + + .sheet-mythos_1:checked ~ .sheet-logos_1_card, + .sheet-mythos_2:checked ~ .sheet-logos_2_card, + .sheet-mythos_3:checked ~ .sheet-logos_3_card, + .sheet-mythos_4:checked ~ .sheet-logos_4_card{ + display: none; + } + + .sheet-logos_1:checked ~ .sheet-mythos_1_card, + .sheet-logos_2:checked ~ .sheet-mythos_2_card, + .sheet-logos_3:checked ~ .sheet-mythos_3_card, + .sheet-logos_4:checked ~ .sheet-mythos_4_card{ + display: none; + } + + /* LOGOS SELECT -------------------------------------------------------- LOGOS SELECT */ + .sheet-body_custom, + .sheet-body_event, + .sheet-body_relationship, + .sheet-body_mission, + .sheet-body_personality, + .sheet-body_possessions, + .sheet-body_routine, + .sheet-body_training { + display: none; + } + + + .sheet-switch_custom:checked ~ .sheet-body_custom, + .sheet-switch_event:checked ~ .sheet-body_event, + .sheet-switch_relationship:checked ~ .sheet-body_relationship, + .sheet-switch_mission:checked ~ .sheet-body_mission, + .sheet-switch_personality:checked ~ .sheet-body_personality, + .sheet-switch_possessions:checked ~ .sheet-body_possessions, + .sheet-switch_routine:checked ~ .sheet-body_routine, + .sheet-switch_training:checked ~ .sheet-body_training{ + display: initial; + } + + + /* MYTHOS SELECT ------------------------------------------------------- MYTHOS SELECT */ + .sheet-body_adaptation, + .sheet-body_bastion, + .sheet-body_divination, + .sheet-body_express, /* body_expression breaks css for some reason, thus abreviated to body_express */ + .sheet-body_mobility, + .sheet-body_relic, + .sheet-body_subversion { + display: none; + } + + .sheet-switch_adaptation:checked ~ .sheet-body_adaptation, + .sheet-switch_bastion:checked ~ .sheet-body_bastion, + .sheet-switch_divination:checked ~ .sheet-body_divination, + .sheet-switch_express:checked ~ .sheet-body_express, + .sheet-switch_mobility:checked ~ .sheet-body_mobility, + .sheet-switch_relic:checked ~ .sheet-body_relic, + .sheet-switch_subversion:checked ~ .sheet-body_subversion { + display: initial; + } + + /* EXTRA SELECT ------------------------------------------------------- EXTRA SELECT */ + .sheet-body_ally, + .sheet-body_base, + .sheet-body_ride { + display: none; + } + + .sheet-switch_ally:checked ~ .sheet-body_ally, + .sheet-switch_base:checked ~ .sheet-body_base, + .sheet-switch_ride:checked ~ .sheet-body_ride { + display: initial; + } + + /* TAG TOGGLE ---------------------------------------------------------- TAG TOGGLE */ + + .sheet-tag_A, + .sheet-tag_B, + .sheet-tag_C, + .sheet-tag_D, + .sheet-tag_E, + .sheet-tag_F, + .sheet-tag_G, + .sheet-tag_H, + .sheet-tag_I, + .sheet-tag_J, + .sheet-tag_K{ + display: none; + } + + .sheet-add_A:checked ~ .sheet-tag_A, + .sheet-add_B:checked ~ .sheet-tag_B, + .sheet-add_C:checked ~ .sheet-tag_C, + .sheet-add_D:checked ~ .sheet-tag_D, + .sheet-add_E:checked ~ .sheet-tag_E, + .sheet-add_F:checked ~ .sheet-tag_F, + .sheet-add_G:checked ~ .sheet-tag_G, + .sheet-add_H:checked ~ .sheet-tag_H, + .sheet-add_I:checked ~ .sheet-tag_I, + .sheet-add_J:checked ~ .sheet-tag_J, + .sheet-add_K:checked ~ .sheet-tag_K{ + display: flex; + } + + /* BURN TOGGLE --------------------------------------------------------- BURN TOGGLE */ + + .sheet-burned { + display: initial; + } + + .sheet-burn { + margin-right: 0px; + } + + .sheet-burn:checked ~ .sheet-burned { + display: none; + } + + /* IMPROVEMENT TOGGLE -------------------------------------------------- IMPROVEMENT TOGGLE */ + + .sheet-imp_buttons { + display: none; + } + + .sheet-imp_active:checked ~ .sheet-imp_buttons { + display: initial; + } + +/* THEME CARD STYLING ----------------------------------------------------------- END */ + +/* PLAYBOOK FRAME START -------------------------------------------------------- PLAYBOOK FRAME START */ + .sheet-playbook_mat { + height: auto; + width: 100%; + margin: 0px; + padding: 0px; + overflow: hidden; + position: relative; + background: white; + + transition: all 0.6s ease-in-out; + -webkit-transform:translate3d(0,0,0); + } + + .sheet-playbook_top { + background-image: url("https://i.imgur.com/JVxBgF8.png"); + background-repeat: repeat-x; + background-position: center; + height: 40px; + width: 100%; + top: 0px; + position: absolute; + + filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.5)); + z-index: 100; + } + + .sheet-playbook_bottom { + background-image: url("https://i.imgur.com/OPmtxW0.png"); + background-repeat: repeat-x; + background-position: center; + height: 60px; + width: 100%; + bottom: 18px; + position: absolute; + + filter: drop-shadow(0px -6px 5px rgba(0, 0, 0, 0.25)); + z-index: 100; + } + + .sheet-playbook_whiteout { + height: 800px; + width: 100%; + background-color: white; + + position: absolute; + top: 0px; + z-index: 120; + + transition: all 0.6s ease-in-out; + opacity: 1; + visibility: visible; + + } + + .sheet-playbook_switch:checked ~ .sheet-playbook_mat .sheet-playbook_whiteout{ + opacity: 0; + visibility: hidden; + } + + .sheet-playbook_scrollmargin { + height: 20px; + width: 100%; + background: white; + position: absolute; + bottom: 0px; + left: 0px; + display: none; + } + + .sheet-playbook_body { + height: 0px; + margin: 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + overflow: hidden; + + transition: all 0.6s ease-in-out; + opacity: 0; + + } + + + .sheet-playbook_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body { + height: 840px; + opacity: 1; + } + + .sheet-playbook_content { + height: 840px; + width: 101%; + margin: 0px; + padding: 40px 20px 0px 300px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + overflow-x: scroll; + overflow-y: hidden; + + display: flex; + flex-wrap: nowrap; + + } + + .sheet-playbook_content_back_margin { + flex: 0 0 10px; + margin: 0px 10px; + } + + .sheet-playbook_content::-webkit-scrollbar-button{ display: none; } + .sheet-playbook_content::-webkit-scrollbar-thumb{ background-color: black; } + .sheet-playbook_content::-webkit-scrollbar-track{ background-color: white; } + .sheet-playbook_content::-webkit-scrollbar{ height: 20px; } + + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { + opacity: 1; + visibility: visible; + } + + .sheet-playbook_character_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_crew_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_theme1_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_theme2_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_theme3_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_theme4_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { + opacity: 0; + visibility: hidden; + } + + .sheet-playbook_character_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_buttons, + .sheet-playbook_crew_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew_buttons, + .sheet-playbook_theme1_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_buttons, + .sheet-playbook_theme2_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_buttons, + .sheet-playbook_theme3_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_buttons, + .sheet-playbook_theme4_themebook_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_buttons { + opacity: 0; + visibility: hidden; + } + + .sheet-playbook_themebook_mythos1_switch:not(:checked) ~ .sheet-playbook_themebook_mythos1, + .sheet-playbook_themebook_logos1_switch:not(:checked) ~ .sheet-playbook_themebook_logos1, + .sheet-playbook_themebook_mythos2_switch:not(:checked) ~ .sheet-playbook_themebook_mythos2, + .sheet-playbook_themebook_logos2_switch:not(:checked) ~ .sheet-playbook_themebook_logos2, + .sheet-playbook_themebook_mythos3_switch:not(:checked) ~ .sheet-playbook_themebook_mythos3, + .sheet-playbook_themebook_logos3_switch:not(:checked) ~ .sheet-playbook_themebook_logos3, + .sheet-playbook_themebook_mythos4_switch:not(:checked) ~ .sheet-playbook_themebook_mythos4, + .sheet-playbook_themebook_logos4_switch:not(:checked) ~ .sheet-playbook_themebook_logos4 { + opacity: 0; + visibility: hidden; + } + + .sheet-playbook_character_creation_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_creation, + .sheet-playbook_character_evolution_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character_evolution, + .sheet-playbook_mythos_growth_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_mythos_growth, + .sheet-playbook_logos_growth_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_logos_growth, + .sheet-playbook_mythos_crisis_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_mythos_crisis, + .sheet-playbook_logos_crisis_switch:not(:checked) ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_logos_crisis { + display: none; + } + + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_character, + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_crew, + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme1_themebook, + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme2_themebook, + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme3_themebook, + .sheet-playbook_character_creation_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, + .sheet-playbook_character_evolution_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, + .sheet-playbook_mythos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, + .sheet-playbook_logos_growth_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, + .sheet-playbook_mythos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook, + .sheet-playbook_logos_crisis_switch:checked ~ .sheet-playbook_mat .sheet-playbook_body .sheet-playbook_theme4_themebook { + display: none; + } + + /* THEMEBOOKS -------------------------------------------------------------- THEMEBOOKS*/ + + .sheet-playbook_themebook { + height: 660px; + flex: 0 0 2560px; + display: flex; + flex-wrap: nowrap; + } + + .sheet-playbook_tagbook { + height: 640px; + flex: 0 0 620px; + display: flex; + flex-wrap: nowrap; + margin: 0px 10px; + } + + .sheet-switch_custom:not(:checked) ~ .sheet-playbook_custom, + .sheet-switch_adaptation:not(:checked) ~ .sheet-playbook_adaptation, + .sheet-switch_bastion:not(:checked) ~ .sheet-playbook_bastion, + .sheet-switch_divination:not(:checked) ~ .sheet-playbook_divination, + .sheet-switch_express:not(:checked) ~ .sheet-playbook_express, + .sheet-switch_mobility:not(:checked) ~ .sheet-playbook_mobility, + .sheet-switch_relic:not(:checked) ~ .sheet-playbook_relic, + .sheet-switch_subversion:not(:checked) ~ .sheet-playbook_subversion { + display: none; + } + + .sheet-switch_custom:not(:checked) ~ .sheet-playbook_custom, + .sheet-switch_event:not(:checked) ~ .sheet-playbook_event, + .sheet-switch_relationship:not(:checked) ~ .sheet-playbook_relationship, + .sheet-switch_mission:not(:checked) ~ .sheet-playbook_mission, + .sheet-switch_personality:not(:checked) ~ .sheet-playbook_personality, + .sheet-switch_possessions:not(:checked) ~ .sheet-playbook_possessions, + .sheet-switch_routine:not(:checked) ~ .sheet-playbook_routine, + .sheet-switch_training:not(:checked) ~ .sheet-playbook_training{ + display: none; + } + +/* PLAYBOOK FRAME END ---------------------------------------------------------- PLAYBOOK FRAME END */ + +/* PLAYBOOK INTERIOR START ----------------------------------------------------- PLAYBOOK INTERIOR START */ + .sheet-playbook_content { + position: absolute; + top: 0px; + transition: all 0.6s ease-in-out; + + font-family: Sans-Serif; + font-size: 11px; + line-height: 16px; + text-align: justify; + text-justify: inter-word; + } + + .sheet-playbook_column { + height: 100%; + margin: 0px 10px; + flex: 0 0 300px; + + } + + .sheet-playbook_line { + width: 100%; + margin: 11px 0px 11px; + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + } + + .sheet-playbook_body ul { + margin: 8px 0px 8px 16px; + } + + .sheet-playbook_body li { + line-height: 14px; + margin: 8px 0px; + } + + .sheet-playbook_entry { + -webkit-column-break-inside: avoid; + page-break-inside: avoid; + break-inside: avoid; + } + + .sheet-playbook_big_title { + font-size: 32px; + line-height: 32px; + font-weight: 900; + transform-origin: top; + transform: scaleY(2.4); + letter-spacing: 4px; + text-transform: uppercase; + margin: -12px 0px 44px; + } + + .sheet-playbook_small_title { + font-size: 26px; + line-height: 26px; + font-weight: 900; + transform-origin: top; + transform: scaleY(2.4); + letter-spacing: 4px; + text-transform: uppercase; + margin: -10px 0px 36px; + } + + .sheet-playbook_subtitle { + font-size: 11px; + line-height: 14px; + font-style: italic; + } + + .sheet-playbook_label { + font-size: 16px; + font-weight: 900; + text-align: initial; + text-transform: uppercase; + transform: scaleY(1.5); + margin: 0px 0px 8px; + } + + .sheet-playbook_small_label { + font-size: 14px; + font-weight: 600; + text-align: initial; + text-transform: uppercase; + margin: 0px 0px 8px; + } + + .sheet-playbook_improv_label { + font-size: 14px; + font-weight: 600; + text-align: initial; + text-transform: uppercase; + width: 270px; + } + + .sheet-playbook_example { + font-family: serif; + font-size: 11px; + font-weight: lighter; + line-height: 14px; + letter-spacing: 1px; + text-align: justify; + text-justify: inter-word; + margin: 0px 12px; + } + + .sheet-playbook_question { + line-height: 14px; + font-size: 11px; + text-transform: uppercase; + text-align: initial; + width: 270px; + } + + .sheet-playbook_question_field { + font-family: 'Rock Salt', 'Shadows Into Light', cursive; + font-size: 16px; + font-style: normal; + font-weight: 600; + line-height: 18px; + letter-spacing: 2px; + width: 270px; + height: 62px; + padding: 3px 6px; + background: transparent; + margin: 0px 0px 0px 30px; + border: none; + border-radius: 0px; + outline: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + overflow:hidden; + resize:none; + } + + .sheet-playbook_question_field::placeholder { + font-family: Sans-Serif; + font-size: 11px; + line-height: 14px; + letter-spacing: 0px; + font-style: italic; + opacity: 1; /* Firefox */ + } + + .sheet-playbook_question_field::-moz-placeholder { + font-family: Sans-Serif; + font-size: 11px; + line-height: 14px; + letter-spacing: 0px; + font-style: italic; + opacity: 1; /* Firefox */ + } + + .sheet-playbook_question_field:-ms-input-placeholder { + font-family: initial; + font-size: 11px; + line-height: 14px; + letter-spacing: 0px; + font-style: italic; + } + .sheet-playbook_question_field::-ms-input-placeholder { + font-family: Sans-Serif; + font-size: 11px; + line-height: 14px; + letter-spacing: 0px; + font-style: italic; + } + + .sheet-playbook_question_box { + width: 18px; + height: 18px; + font-size: 14px; + line-height: 18px; + margin-bottom: auto; + margin-right: 10px; + margin-left: 0px; + padding: auto; + border: none; + outline: none; + text-align: center; + } + + .sheet-playbook_question_checkbox { + display: block; + position: relative; + margin-bottom: auto; + margin-right: 10px; + margin-left: 0px; + height: 18px; + width: 18px; + } + + .sheet-playbook_question_checkbox input[type="radio"] , + .sheet-playbook_question_checkbox input[type="checkbox"] + { + position: absolute; + opacity: 0.0; + width: 18px; + height: 18px; + top: 9px; + left: 9px; + cursor: pointer; + z-index: 1; + margin: -9px; + } + + + .sheet-playbook_question_checkbox span + { + position: absolute; + top: 0px; + left: 0px; + width: 18px; + height: 18px; + font-size: 14px; + line-height: 18px; + color: white; + text-align: center; + vertical-align: middle; + padding: 0px; + border: none; + outline: none; + opacity: 1; + } + + .sheet-playbook_question_check { + display: block; + position: relative; + margin-bottom: auto; + margin-right: 10px; + margin-left: 0px; + height: 18px; + width: 18px; + } + + .sheet-playbook_question_check input[type="checkbox"] + { + position: absolute; + opacity: 0.0; + width: 18px; + height: 18px; + top: 9px; + left: 9px; + cursor: pointer; + z-index: 1; + margin: -9px; + } + + + .sheet-playbook_question_check span + { + position: absolute; + top: 0px; + left: 0px; + width: 18px; + height: 18px; + font-size: 14px; + line-height: 18px; + color: white; + text-align: center; + vertical-align: middle; + padding: 0px; + border: none; + outline: none; + opacity: 1; + } + + .sheet-playbook_question_plusminus { + margin: auto; + } + + .sheet-playbook_question_plusminus input[type="radio"]:checked + span::before , + .sheet-playbook_question_plusminus input[type="checkbox"]:checked + span::before { + content: "-"; + } + .sheet-playbook_question_plusminus input[type="radio"]:not(:checked) + span::before , + .sheet-playbook_question_plusminus input[type="checkbox"]:not(:checked) + span::before { + content: "+"; + } + + /* PLAYBOOK MYTHOS STYLE ----------------------------------------------- PLAYBOOK MYTHOS STYLE */ + + .sheet-playbook_style_mythos { + background-image: url(https://i.imgur.com/m8V3xeY.png); + background-repeat: repeat; + background-color: #6f5d6e; + color: white; + + height: 100%; + } + + .sheet-playbook_style_mythos .sheet-playbook_big_title, + .sheet-playbook_style_mythos .sheet-playbook_small_title, + .sheet-playbook_style_mythos .sheet-playbook_title { + color: #1e1137; + -webkit-text-fill-color: rgba(0, 0, 0, 0.0); + -webkit-text-stroke: 1px #eb018c; + filter: drop-shadow(0px 0px 0px #eb018c) drop-shadow(0px 0px 1px #eb018c) drop-shadow(0px 0px 6px #eb018c); + } + + .sheet-playbook_style_mythos .sheet-playbook_label, + .sheet-playbook_style_mythos .sheet-playbook_small_label{ + color: #eb018c; + text-shadow: 0px 0px 1px #eb018c; + } + + .sheet-playbook_style_mythos b { + font-size: 12px; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_box { + font-size: 12px; + background-color: #eb018c ; + color: white; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox span, + .sheet-playbook_style_mythos .sheet-playbook_question_check span + { + background-color: grey ; + color: #1e1137; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:hover + span, + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:hover + span, + .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:hover + span + { + color: #1e1137; + text-shadow: 0px 0px 1px #1e1137; + background-color: #eb018c ; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:checked + span, + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:checked + span, + .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:checked + span + { + color: white; + text-shadow: 0px 0px 1px white; + background-color: #eb018c ; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="checkbox"]:active + span, + .sheet-playbook_style_mythos .sheet-playbook_question_checkbox input[type="radio"]:active + span, + .sheet-playbook_style_mythos .sheet-playbook_question_check input[type="checkbox"]:active + span + { + color: white; + text-shadow: 0px 0px 3px white, 0px 0px 3px white; + background-color: #eb018c ; + box-shadow: 0px 0px 3px 1px #eb018c ; + } + + .sheet-playbook_style_mythos .sheet-playbook_question { + color: white; + } + + .sheet-playbook_style_mythos .sheet-playbook_question_field { + color: white; + background: #452362; + } + + .sheet-playbook_style_mythos select { + color: white; + background: #452362; + border: none; + } + + .sheet-playbook_style_mythos select:hover { + box-shadow: 0px 0px 3px 2px #ebafd3, 0px 0px 3px 3px #eb018c; + } + + .sheet-playbook_style_mythos select:focus { + box-shadow: 0px 0px 3px 2px #ebafd3, 0px 0px 3px 3px #eb018c; + outline:0; + } + + .sheet-playbook_style_mythos .sheet-playbook_note { + width: 300px; + flex: 0 0 300px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + color: white; + border-color: #ebafd3; border-style: solid; + border-width: 2px; + padding: 10px; + border-radius: 10px; + box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; + margin: 0px 0px 20px; + + } + + .sheet-playbook_style_mythos .sheet-playbook_note .sheet-playbook_small_label { + color: #eb018c; + border-radius: 1px 1px 0px 0px; + margin: 0px 0px 10px; + } + + + /* PLAYBOOK LOGOS STYLE ------------------------------------------------ PLAYBOOK LOGOS STYLE */ + + .sheet-playbook_style_logos { + background-image: url(https://i.imgur.com/juI6Nsa.png); + background-repeat: repeat; + background-color: #fcfaf2; + color: #1f140d; + + height: 100%; + } + + .sheet-playbook_style_logos .sheet-playbook_big_title, + .sheet-playbook_style_logos .sheet-playbook_small_title, + .sheet-playbook_style_logos .sheet-playbook_title { + color: #1f140d; + text-shadow: 0px 0px 0px #1f140d; + } + + .sheet-playbook_style_logos .sheet-playbook_label, + .sheet-playbook_style_logos .sheet-playbook_small_label{ + color: #1f140d; + text-shadow: 0px 0px 0px transparent; + } + + .sheet-playbook_style_logos b { + font-size: 12px; + } + + .sheet-playbook_style_logos .sheet-playbook_tag { + font-size: 12px; + font-style: italic; + background: #fff3b2; + } + + .sheet-playbook_style_logos .sheet-playbook_question_box { + font-size: 12px; + background-color: #8a2e39 ; + color: #fcfaf2; + } + + .sheet-playbook_style_logos .sheet-playbook_question_checkbox span, + .sheet-playbook_style_logos .sheet-playbook_question_check span + { + font-size: 12px; + background-color: grey ; + color: #fcfaf2; + } + + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:hover + span, + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:hover + span, + .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:hover + span + { + font-size: 12px; + color: white; + text-shadow: 0px 0px 1px white; + background-color: #8a2e39 ; + } + + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:checked + span, + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:checked + span, + .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:checked + span + { + color: white; + text-shadow: 0px 0px 1px white; + background-color: #8a2e39 ; + } + + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="checkbox"]:active + span, + .sheet-playbook_style_logos .sheet-playbook_question_checkbox input[type="radio"]:active + span, + .sheet-playbook_style_logos .sheet-playbook_question_check input[type="checkbox"]:active + span + { + color: white; + text-shadow: 0px 0px 3px white, 0px 0px 3px white; + background-color: #8a2e39 ; + box-shadow: 0px 0px 3px 1px #8a2e39 ; + } + + .sheet-playbook_style_logos .sheet-playbook_question { + color: #1f140d; + } + + .sheet-playbook_style_logos .sheet-playbook_question_field { + color: #1f140d; + background: #fff3b2; + } + + .sheet-playbook_style_logos select { + color: #1f140d; + background: #fff3b2; + border: none; + } + + .sheet-playbook_style_logos select:hover { + box-shadow: 0px 0px 3px 1px #8a2e39; + } + + .sheet-playbook_style_logos select:focus { + box-shadow: 0px 0px 3px 1px #8a2e39; + outline:0; + } + + .sheet-playbook_style_logos .sheet-playbook_note { + width: 300px; + flex: 0 0 300px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + color: black; + background-color: #dcd3b8; + padding: 6px; + border-radius: 6px; + border: 2px solid #4c4646; + box-shadow: 0px 0px 0px 6px #dcd3b8, 1px 1px 15px 3px black; + margin: 0px 0px 20px; + } + + .sheet-playbook_style_logos .sheet-playbook_note .sheet-playbook_small_label { + font-size: 16px; + color: #dcd3b8; + background-color: #4c4646; + border-radius: 1px 1px 0px 0px; + box-shadow: 0px 0px 0px 7px #4c4646; + margin: 0px 0px 10px; + } + + + /* IMPROVBOOK ---------------------------------------------------------- IMPROVBOOK*/ + + .sheet-improvbook { + height: 680px; + flex-wrap: nowrap; + overflow: visible; + margin: 0px; + } + + .sheet-improvbook_columns { + column-count: auto; + -webkit-column-count: auto; + -moz-column-count: auto; + column-width: 326px; + -webkit-column-width: 326px; + -moz-column-width: 326px; + column-gap: 20px; + -webkit-column-gap: 20px; + -moz-column-gap: 20px; + height: 100%; + margin: 0px 10px; + } + + .sheet-broadpowertag_active:not(:checked) ~ .sheet-broadpowertag_entry, + .sheet-extrathemeally_active:not(:checked) ~ .sheet-extrathemeally_entry, + .sheet-extrathemebase_active:not(:checked) ~ .sheet-extrathemebase_entry, + .sheet-extrathemeride_active:not(:checked) ~ .sheet-extrathemeride_entry, + .sheet-closure_active:not(:checked) ~ .sheet-closure_entry, + .sheet-transformation_active:not(:checked) ~ .sheet-transformation_entry, + .sheet-leavethecity_active:not(:checked) ~ .sheet-leavethecity_entry, + .sheet-dynamite1_active:not(:checked) ~ .sheet-dynamite1_entry, + .sheet-dynamite2_active:not(:checked) ~ .sheet-dynamite2_entry, + .sheet-dynamite3_active:not(:checked) ~ .sheet-dynamite3_entry, + .sheet-seethroughmist_active:not(:checked) ~ .sheet-seethroughmist_entry { + display: none; + } + + .sheet-oblivious_active:not(:checked) ~ .sheet-oblivious_entry, + .sheet-madeforthis_active:not(:checked) ~ .sheet-madeforthis_entry, + .sheet-themythoswithin_active:not(:checked) ~ .sheet-themythoswithin_entry, + .sheet-specialization_active:not(:checked) ~ .sheet-specialization_entry, + .sheet-afightingchance_active:not(:checked) ~ .sheet-afightingchance_entry, + .sheet-ripples_active:not(:checked) ~ .sheet-ripples_entry, + .sheet-transference_active:not(:checked) ~ .sheet-transference_entry { + display: none; + } + + .sheet-whostheboss_active:not(:checked) ~ .sheet-whostheboss_entry, + .sheet-qualitymatters_active:not(:checked) ~ .sheet-qualitymatters_entry, + .sheet-itsshowtime_active:not(:checked) ~ .sheet-itsshowtime_entry, + .sheet-gettinggoodatthis_e_active:not(:checked) ~ .sheet-gettinggoodatthis_e_entry, + .sheet-gettinggoodatthis_m_active:not(:checked) ~ .sheet-gettinggoodatthis_m_entry, + .sheet-gettinggoodatthis_p_active:not(:checked) ~ .sheet-gettinggoodatthis_p_entry, + .sheet-gettinggoodatthis_r_active:not(:checked) ~ .sheet-gettinggoodatthis_r_entry, + .sheet-gettinggoodatthis_t_active:not(:checked) ~ .sheet-gettinggoodatthis_t_entry, + .sheet-echosfromthepast_active:not(:checked) ~ .sheet-echosfromthepast_entry, + .sheet-sharedexperiences_active:not(:checked) ~ .sheet-sharedexperiences_entry, + .sheet-cantbetooready_active:not(:checked) ~ .sheet-cantbetooready_entry, + .sheet-whyidothis_p_active:not(:checked) ~ .sheet-whyidothis_p_entry, + .sheet-toolsofthetrade_active:not(:checked) ~ .sheet-toolsofthetrade_entry, + .sheet-whyidothis_r_active:not(:checked) ~ .sheet-whyidothis_r_entry, + .sheet-senseofpurpose_active:not(:checked) ~ .sheet-senseofpurpose_entry { + display: none; + } + + + .sheet-imp1_active:not(:checked) ~ .sheet-imp1_entry, + .sheet-imp2_active:not(:checked) ~ .sheet-imp2_entry, + .sheet-imp3_active:not(:checked) ~ .sheet-imp3_entry, + .sheet-imp4_active:not(:checked) ~ .sheet-imp4_entry, + .sheet-imp5_active:not(:checked) ~ .sheet-imp5_entry, + .sheet-imp6_active:not(:checked) ~ .sheet-imp6_entry, + .sheet-imp7_active:not(:checked) ~ .sheet-imp7_entry, + .sheet-imp8_active:not(:checked) ~ .sheet-imp8_entry, + .sheet-imp9_active:not(:checked) ~ .sheet-imp9_entry, + .sheet-imp10_active:not(:checked) ~ .sheet-imp10_entry, + .sheet-imp11_active:not(:checked) ~ .sheet-imp11_entry, + .sheet-imp12_active:not(:checked) ~ .sheet-imp12_entry, + .sheet-imp13_active:not(:checked) ~ .sheet-imp13_entry, + .sheet-imp14_active:not(:checked) ~ .sheet-imp14_entry, + .sheet-imp15_active:not(:checked) ~ .sheet-imp15_entry { + display: none; + } + + .sheet-playbook_Ktagbook { + display: none; + } + + .sheet-Ktagbook_open:checked ~ .sheet-playbook_Ktagbook { + display: inherit; + } + + .sheet-tagbook_adaptation_open:not(:checked) ~ .sheet-tagbook_adaptation, + .sheet-tagbook_bastion_open:not(:checked) ~ .sheet-tagbook_bastion, + .sheet-tagbook_divination_open:not(:checked) ~ .sheet-tagbook_divination, + .sheet-tagbook_express_open:not(:checked) ~ .sheet-tagbook_express, + .sheet-tagbook_mobility_open:not(:checked) ~ .sheet-tagbook_mobility, + .sheet-tagbook_relic_open:not(:checked) ~ .sheet-tagbook_relic, + .sheet-tagbook_subversion_open:not(:checked) ~ .sheet-tagbook_subversion { + display: none; + } + + .sheet-tagbook_event_open:not(:checked) ~ .sheet-tagbook_event, + .sheet-tagbook_relationship_open:not(:checked) ~ .sheet-tagbook_relationship, + .sheet-tagbook_mission_open:not(:checked) ~ .sheet-tagbook_mission, + .sheet-tagbook_personality_open:not(:checked) ~ .sheet-tagbook_personality, + .sheet-tagbook_possessions_open:not(:checked) ~ .sheet-tagbook_possessions, + .sheet-tagbook_routine_open:not(:checked) ~ .sheet-tagbook_routine, + .sheet-tagbook_training_open:not(:checked) ~ .sheet-tagbook_training { + display: none; + } + + .sheet-KA_notactive:checked ~ .sheet-KA_entry, + .sheet-KB_notactive:checked ~ .sheet-KB_entry, + .sheet-KC_notactive:checked ~ .sheet-KC_entry, + .sheet-KD_notactive:checked ~ .sheet-KD_entry, + .sheet-KE_notactive:checked ~ .sheet-KE_entry, + .sheet-KF_notactive:checked ~ .sheet-KF_entry, + .sheet-KG_notactive:checked ~ .sheet-KG_entry, + .sheet-KH_notactive:checked ~ .sheet-KH_entry, + .sheet-KI_notactive:checked ~ .sheet-KI_entry, + .sheet-KJ_notactive:checked ~ .sheet-KJ_entry { + display: none; + } + + .sheet-KA_active:not(:checked) ~ .sheet-KA_field, + .sheet-KB_active:not(:checked) ~ .sheet-KB_field, + .sheet-KC_active:not(:checked) ~ .sheet-KC_field, + .sheet-KD_active:not(:checked) ~ .sheet-KD_field, + .sheet-KE_active:not(:checked) ~ .sheet-KE_field, + .sheet-KF_active:not(:checked) ~ .sheet-KF_field, + .sheet-KG_active:not(:checked) ~ .sheet-KG_field, + .sheet-KH_active:not(:checked) ~ .sheet-KH_field, + .sheet-KI_active:not(:checked) ~ .sheet-KI_field, + .sheet-KJ_active:not(:checked) ~ .sheet-KJ_field { + display: none; + } + + .sheet-QMA_notactive:checked ~ .sheet-QMA_entry, + .sheet-QMB_notactive:checked ~ .sheet-QMB_entry, + .sheet-QMC_notactive:checked ~ .sheet-QMC_entry, + .sheet-QMD_notactive:checked ~ .sheet-QMD_entry, + .sheet-QME_notactive:checked ~ .sheet-QME_entry, + .sheet-QMF_notactive:checked ~ .sheet-QMF_entry, + .sheet-QMG_notactive:checked ~ .sheet-QMG_entry, + .sheet-QMH_notactive:checked ~ .sheet-QMH_entry, + .sheet-QMI_notactive:checked ~ .sheet-QMI_entry, + .sheet-QMJ_notactive:checked ~ .sheet-QMJ_entry, + .sheet-QMK_notactive:checked ~ .sheet-QMK_entry { + display: none; + } + + + .sheet-QMA_active:not(:checked) ~ .sheet-QMA_entry, + .sheet-QMB_active:not(:checked) ~ .sheet-QMB_entry, + .sheet-QMC_active:not(:checked) ~ .sheet-QMC_entry, + .sheet-QMD_active:not(:checked) ~ .sheet-QMD_entry, + .sheet-QME_active:not(:checked) ~ .sheet-QME_entry, + .sheet-QMF_active:not(:checked) ~ .sheet-QMF_entry, + .sheet-QMG_active:not(:checked) ~ .sheet-QMG_entry, + .sheet-QMH_active:not(:checked) ~ .sheet-QMH_entry, + .sheet-QMI_active:not(:checked) ~ .sheet-QMI_entry, + .sheet-QMJ_active:not(:checked) ~ .sheet-QMJ_entry, + .sheet-QMK_active:not(:checked) ~ .sheet-QMK_entry { + display: none; + } + + /* VERTICAL TEAR ------------------------------------------------------------------- VERTICAL TEAR */ + .sheet-playbook_vertical_tear { + height: 840px; + position: relative; + margin-left: 10px; + margin-right: -10px; + transform: translate(0px, -40px); + } + + .sheet-playbook_vertical_tear_inside { + width: auto; + height: 840px; + padding: 0px; + margin: 0px 40px; + overflow: hidden; + position: relative; + background-image: initial; + background-color: white; + } + + .sheet-playbook_vertical_tear_inner_body { + display: flex; + flex-wrap: nowrap; + width: 680px; + height: 840px; + padding: 40px 20px 0pc; + box-sizing: border-box; + } + + .sheet-playbook_vertical_tear_inner_left { + background-image: url("https://i.imgur.com/Bd9LDdg.png"); + background-repeat: repeat-y; + background-position: center; + height: 840px; + width: 40px; + top: 0px; + left: 0px; + position: absolute; + z-index: 10; + + filter: drop-shadow(-6px 1px 15px black); + } + + .sheet-playbook_vertical_tear_inner_right { + background-image: url("https://i.imgur.com/M0RBznR.png"); + background-repeat: repeat-y; + background-position: center; + height: 840px; + width: 40px; + top: 0px; + right: 0px; + position: absolute; + z-index: 10; + + filter: drop-shadow(6px 1px 15px black); + } + + .sheet-playbook_vertical_tear_outer_left { + background-image: url("https://i.imgur.com/M0RBznR.png"); + background-repeat: repeat-y; + background-position: center; + height: 840px; + width: 40px; + top: 0px; + left: 0px; + position: absolute; + } + + .sheet-playbook_vertical_tear_outer_right { + background-image: url("https://i.imgur.com/Bd9LDdg.png"); + background-repeat: repeat-y; + background-position: center; + height: 840px; + width: 40px; + top: 0px; + right: 0px; + position: absolute; + } + + /* STATIC TEAR ---------------------------------------------------------------------- STATIC TEAR*/ + + .sheet-playbook_vertical_tear_static_mythos { + color: white; + background-image: url(https://i.imgur.com/m8V3xeY.png); + background-repeat: repeat; + background-color: #6f5d6e; + box-shadow: 0px 0px 15px 0px #fcfaf2 inset, 0px 0px 15px 0px #fcfaf2 inset, 0px 0px 15px 0px #fcfaf2 inset; + margin: 0px; + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_label, + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_small_label { + color: #eb018c; + text-shadow: 0px 0px 1px #eb018c; + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question_box { + font-size: 12px; + background-color: #eb018c ; + color: white; + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question { + color: white; + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_question_field { + color: white; + background: #452362; + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_highlight { + border-color: #ebafd3; border-style: solid; + border-width: 2px; + padding: 10px; + border-radius: 10px; + box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; + margin: 0px 0px 20px; + } + + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_note { + width: 300px; + flex: 0 0 300px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + color: white; + background-color: transparent; + border-color: #ebafd3; border-style: solid; + border-width: 2px; + padding: 10px; + border-radius: 10px; + box-shadow: 0px 0px 3px 1px #eb018c inset, 0px 0px 3px 1px #eb018c; + margin: 0px 0px 20px; + + } + + .sheet-playbook_vertical_tear_static_mythos .sheet-playbook_note .sheet-playbook_small_label { + color: #eb018c; + background-color: transparent; + box-shadow: 0px 0px 0px 0px transparent; + border-radius: 1px 1px 0px 0px; + margin: 0px 0px 10px; + } + + .sheet-playbook_vertical_tear_static_logos { + color: #1f140d; + background-image: url(https://i.imgur.com/juI6Nsa.png); + background-repeat: repeat; + background-color: #fcfaf2; + margin: 0px; + + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_label, + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_small_label{ + color: #1f140d; + text-shadow: 0px 0px 0px transparent; + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question_box { + font-size: 12px; + background-color: #8a2e39 ; + color: #fcfaf2; + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question { + color: #1f140d; + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_question_field { + color: #1f140d; + background: #fff3b2; + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_note { + width: 300px; + flex: 0 0 300px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + color: black; + background-color: #dcd3b8; + padding: 6px; + border-radius: 6px; + border: 2px solid #4c4646; + box-shadow: 0px 0px 0px 6px #dcd3b8, 1px 1px 15px 3px black; + } + + .sheet-playbook_vertical_tear_static_logos .sheet-playbook_note .sheet-playbook_small_label { + font-size: 16px; + color: #dcd3b8; + background-color: #4c4646; + border-radius: 1px 1px 0px 0px; + box-shadow: 0px 0px 0px 7px #4c4646; + margin: 0px 0px 10px; + } + + /* COLLAPSING TEAR ------------------------------------------------------------------ COLLAPSING TEAR */ + + .sheet-playbook_vertical_tear_inner_whiteout { + height: 100%; + width: 100%; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + transition: all 0.6s ease-in-out; + z-index: 1; + + background-color: white; + opacity: 1.0; + } + + .sheet-playbook_identity_concept_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout, + .sheet-playbook_identity_concept_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout{ + opacity: 0.0; + } + + /* CONCEPT COLUMN ------------------------------------------------------------------- CONCEPT COLUMN */ + + .sheet-playbook_identity_concept_column { + display: flex; + flex: 0 0 auto; + min-width: 300px; + max-width: 1060px; + height: 100%; + margin: 0px 10px; + position: relative; + } + + .sheet-playbook_identity_concept_spacer { + flex: 0 0 300px; + min-width: 300px; + } + + .sheet-playbook_identity_concept_desc { + position: absolute; + top: 0px; + width: 300px; + } + + .sheet-playbook_identity_concept_mythos { + position: absolute; + top: 150px; + width: 300px; + + } + + .sheet-playbook_identity_concept_logos { + position: absolute; + top: 325px; + width: 300px; + + } + + .sheet-playbook_identity_concept_name { + position: absolute; + top: 500px; + width: 300px; + + } + + .sheet-playbook_vertical_tear_inside_collapse { + max-width: 0px; + filter: brightness(200%); + transition: all 0.6s ease-in-out; + } + + .sheet-playbook_identity_concept_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse, + .sheet-playbook_identity_concept_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse { + max-width: 680px; + filter: brightness(100%); + } + + .sheet-playbook_identity_concept_logos_desc, + .sheet-playbook_identity_concept_mythos_desc { + display: flex; + flex-wrap: nowrap; + width: 680px; + height: 840px; + padding: 40px 20px 0pc; + box-sizing: border-box; + + position: absolute; + top: 0px; + left: 0px; + } + + .sheet-playbook_identity_concept_mythos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_concept_mythos_desc, + .sheet-playbook_identity_concept_logos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_concept_logos_desc { + display: none; + } + + /* THEME COLUMN ------------------------------------------------------------------- THEME COLUMN */ + + .sheet-playbook_identity_theme_column { + display: flex; + flex: 0 0 auto; + min-width: 300px; + max-width: 1060px; + height: 100%; + margin: 0px 10px; + position: relative; + } + + .sheet-playbook_identity_theme_spacer { + flex: 0 0 300px; + min-width: 300px; + } + + .sheet-playbook_identity_theme_desc { + position: absolute; + top: 0px; + width: 300px; + + } + + .sheet-playbook_identity_theme_mythos { + position: absolute; + top: 120px; + width: 300px; + + } + + .sheet-playbook_identity_theme_logos { + position: absolute; + top: 350px; + width: 300px; + + } + + + .sheet-playbook_identity_theme_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout, + .sheet-playbook_identity_theme_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_whiteout{ + opacity: 0.0; + } + + + .sheet-playbook_identity_theme_mythos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse, + .sheet-playbook_identity_theme_logos:focus-within ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside_collapse { + max-width: 680px; + filter: brightness(100%); + } + + .sheet-playbook_identity_theme_logos_desc, + .sheet-playbook_identity_theme_mythos_desc { + display: flex; + flex-wrap: nowrap; + width: 680px; + height: 840px; + padding: 40px 20px 0pc; + box-sizing: border-box; + + position: absolute; + top: 0px; + left: 0px; + } + + .sheet-playbook_identity_theme_mythos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_theme_mythos_desc, + .sheet-playbook_identity_theme_logos:not(:focus-within) ~ .sheet-playbook_vertical_tear .sheet-playbook_vertical_tear_inside .sheet-playbook_vertical_tear_inner_body .sheet-playbook_identity_theme_logos_desc { + display: none; + } + + +/* PLAYBOOK INTERIOR END ------------------------------------------------------- PLAYBOOK INTERIOR END */ + +/* NOTE STYLING START ---------------------------------------------------------- START */ + + /* YELLOW -------------------------------------------------------------- YELLOW */ + + .sheet-scraps_yellow { + filter: drop-shadow(0px 5px 10px black); + overflow: hidden; + line-height: 16px; + font-size: 11px; + color: black; + } + + .sheet-scraps_yellow_body { + background: #f5eda8; + padding: 6px 10px 6px; + margin: 0px 0px -6px; + } + + .sheet-scraps_yellow_top { + background-image: url("https://i.imgur.com/kzeM9Rp.png"); + background-repeat: repeat-x; + background-position: center; + height: 20px; + width: 100%; + } + + .sheet-scraps_yellow_bottom { + background-image: url("https://i.imgur.com/R3yzbB8.png"); + background-repeat: no-repeat; + background-size: 100%; + height: 20px; + width: 100%; + } + + .sheet-scraps_yellow_body .sheet-scraps_label { + color: #8a2e39; + font-size: 18px; + font-weight: 600; + text-align: initial; + margin: 0px 0px 6px; + } + + .sheet-scraps_yellow_body b { + font-size: 12px; + background: transparent; + } + + .sheet-theme_card_stand_in { + height: 660px; + width: 260px; + padding: 0px; + margin: 0px 20px; + border: 1px solid white; + border-radius: 12px 12px 12px 12px; + background: green; + + position: absolute; + top: 30px; + margin: 0px 20px; + + z-index: 50; + + } + + .sheet-theme_button1_stand_in { + height: 30px; + width: 260px; + padding: 0px; + margin: 0px 20px; + border: 1px solid white; + border-radius: 12px 12px 12px 12px; + background: green; + + position: absolute; + top: 700px; + margin: 0px 20px; + + z-index: 50; + + + } + + .sheet-theme_button2_stand_in { + height: 30px; + width: 260px; + padding: 0px; + margin: 0px 20px; + border: 1px solid white; + border-radius: 12px 12px 12px 12px; + background: green; + + position: absolute; + top: 740px; + margin: 0px 20px; + + z-index: 50; + } + + .sheet-playbook_button_1 { + top: 700px; + left: 20px; + } + + .sheet-playbook_button_2 { + top: 740px; + left: 20px; + } + + .sheet-playbook_chapter_button { + + position: absolute; + margin: 0px; + padding: 0px; + height: 30px; + width: 260px; + z-index: 50; + + } + + .sheet-playbook_chapter_button input[type="checkbox"] { + height: 100%; + width: 100%; + position: absolute; + opacity: 0; + + top: 0%; + left: 0%; + cursor: pointer; + z-index: 1; + margin: 0%; + + } + + + .sheet-playbook_chapter_button span + { + height: 30px; + width: 260px; + padding: 0px; + border-radius: 6px 6px 6px 6px; + + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + position: absolute; + top: 0px; + left: 0px; + + font-family: 'Contrail One', Sans-Serif; + font-size: 16px; + font-style: normal; + text-transform: uppercase; + + line-height: 30px; + text-align: center; + vertical-align: middle; + border: none; + outline: none; + opacity: 1; + + } + + .sheet-playbook_chapter_button_mythos span + { + background-color: grey ; + color: #1e1137; + } + + .sheet-playbook_chapter_button_mythos input[type="checkbox"]:hover + span + { + color: #1e1137; + text-shadow: 0px 0px 1px #1e1137; + background-color: #eb018c ; + } + + .sheet-playbook_chapter_button_mythos input[type="checkbox"]:checked + span + { + color: white; + text-shadow: 0px 0px 1px white; + background-color: #eb018c ; + } + + .sheet-playbook_chapter_button_mythos input[type="checkbox"]:active + span + { + color: white; + text-shadow: 0px 0px 3px white, 0px 0px 3px white; + background-color: #eb018c ; + box-shadow: 0px 0px 3px 1px #eb018c ; + } + + .sheet-playbook_chapter_button_logos span + { + background-color: grey ; + color: #fcfaf2; + } + + .sheet-playbook_chapter_button_logos input[type="checkbox"]:hover + span + { + color: white; + text-shadow: 0px 0px 1px white; + background-color: #a1574a ; + } + + .sheet-playbook_chapter_button_logos input[type="checkbox"]:checked + span + { + color: white; + text-shadow: 0px 0px 1px white; + background-color: #a1574a ; + } + + .sheet-playbook_chapter_button_logos input[type="checkbox"]:active + span + { + color: white; + text-shadow: 0px 0px 3px white, 0px 0px 3px white; + background-color: #a1574a ; + box-shadow: 0px 0px 3px 1px #a1574a ; + } + +/* STATUS CARD STYLING --------------------------------------------------------- START */ + + .sheet-status_card_mat { + width: 100%; + min-height: 580px; + margin: 0px 0px 30px; + padding: 0px; + + position: relative; + -webkit-transform:translate3d(0,0,0); + perspective: 2000px; + } + + .sheet-status_card { + height: 260px; + width: 400px; + background-color: #e6e0d3; + box-shadow: inset 0px 0px 25px 5px #d2cac3; + + border: 1px solid white; + border-radius: 12px 12px 12px 12px; + padding: 10px; + + display: flex; + flex-flow: column nowrap; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + + perspective: 2000px; + } + + .sheet-status_card input[type=checkbox] { + box-shadow: none; + height: 26px; + width: 26px; + margin: auto 6px; + background: #fff; + vertical-align: middle; + } + + .sheet-status_card_inset { + display: flex; + flex-flow: column nowrap; + margin: 0px; + padding: 0px; + height: 100%; + width: 100%; + border-radius: 10px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-shadow: inset 0px 0px 55px 25px #d2cac3; + } + + .sheet-status_card_header { + height: 36px; + width: 100%; + color: white; + background-color: #a1574a ; + border-radius: 10px 10px 0px 0px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-status_card_footer { + height: 32px; + width: 100%; + color: white; + background-color: #a1574a ; + border-radius: 10px 10px 0px 0px; + margin-top: auto; + border-radius: 0px 0px 10px 10px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-status_card_body { + height: calc(100% - 68px); + width: 100%; + padding: 6px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + } + + .sheet-status_card_title { + height: 36px; + width: 210px; + padding: 0px 5px; + margin: 0px 10px; + background: transparent; + border: none; + outline: none; + + + font-family: 'Contrail One', Sans-Serif; + line-height: 36px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + font-weight: 900; + color: white; + text-shadow: 0px 0px 2px #534233; + text-transform: uppercase; + text-align: left; + } + + .sheet-status_card_tag { + height: 60px; + width: 350px; + padding: 0px 5px; + margin: 0px auto; + background: transparent; + border: none; + outline: none; + overflow: hidden; + resize: none; + + line-height: 30px; + font-size: 26px; + font-style: normal; + font-variant: small-caps; + text-transform: uppercase; + text-align: left; + + font-family: 'Rock Salt', 'Shadows Into Light', cursive; + letter-spacing: 2px; + font-weight: 600; + } + + .sheet-status_card_tag::placeholder { + font-family: 'Contrail One', Sans-Serif; + font-weight: 900; + text-shadow: 0px 0px 2px #534233; + letter-spacing: 0px; + opacity: 1; /* Firefox */ + } + + .sheet-status_card_tag::-moz-placeholder { + font-family: 'Contrail One', Sans-Serif; + font-weight: 900; + text-shadow: 0px 0px 2px #534233; + letter-spacing: 0px; + opacity: 1; /* Firefox */ + } + + .sheet-status_card_tag:-ms-input-placeholder { + font-family: 'Contrail One', Sans-Serif; + font-weight: 900; + text-shadow: 0px 0px 2px #534233; + letter-spacing: 0px; + opacity: 1; /* Firefox */ + } + + .sheet-status_card_tag::-ms-input-placeholder { + font-family: 'Contrail One', Sans-Serif; + font-weight: 900; + text-shadow: 0px 0px 2px #534233; + letter-spacing: 0px; + opacity: 1; /* Firefox */ + } + + .sheet-status_card_icon_standin { + height: 26px; + width: 26px; + border-radius: 50%; + background-color: white; + margin: auto; + } + + .sheet-status_card_footer .sheet-theme_label { + color: white; + } + + .sheet-status_switch_clue:not(:checked) ~ .sheet-status_body_clue, + .sheet-status_switch_juice:not(:checked) ~ .sheet-status_body_juice, + .sheet-status_switch_storytag:not(:checked) ~ .sheet-status_body_storytag, + .sheet-status_switch_status:not(:checked) ~ .sheet-status_body_status { + display: none; + } + + + + .sheet-status_card_1, + .sheet-status_card_2, + .sheet-status_card_3, + .sheet-status_card_4, + .sheet-status_card_5, + .sheet-status_card_6, + .sheet-status_card_7, + .sheet-status_card_8 { + position: absolute; + transition: all 0.6s ease-in-out, z-index 0s, transform 0.2s ease-in-out, top 0.2s ease-in-out; + filter: drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); + transform-origin: center top; + } + + .sheet-status_card_1 { + top: 20px; + left: calc(15% - 130px); + transform: rotate(-3deg) scale(0.9, 0.9); + } + + .sheet-status_card_2 { + top: 10px; + left: calc(38.3% - 177px); + transform: rotate(-1deg) scale(0.9, 0.9); + } + + .sheet-status_card_3 { + top: 10px; + left: calc(61.7% - 223px); + transform: rotate(1deg) scale(0.9, 0.9); + } + + .sheet-status_card_4 { + top: 20px; + left: calc(85% - 270px); + transform: rotate(3deg) scale(0.9, 0.9); + } + + .sheet-status_card_5 { + top: 320px; + left: calc(15% - 130px); + transform: rotate(-3deg) scale(0.9, 0.9); + } + + .sheet-status_card_6 { + top: 310px; + left: calc(38.3% - 177px); + transform: rotate(-1deg) scale(0.9, 0.9); + } + + .sheet-status_card_7 { + top: 310px; + left: calc(61.7% - 223px); + transform: rotate(1deg) scale(0.9, 0.9); + } + + .sheet-status_card_8 { + top: 320px; + left: calc(85% - 270px); + transform: rotate(3deg) scale(0.9, 0.9); + } + + .sheet-status_card_1:hover , + .sheet-status_card_2:hover , + .sheet-status_card_3:hover , + .sheet-status_card_4:hover , + .sheet-status_card_1:focus-within , + .sheet-status_card_2:focus-within , + .sheet-status_card_3:focus-within , + .sheet-status_card_4:focus-within { + z-index: 250; + top: 0px; + transform: scale(1, 1); + } + + .sheet-status_card_5:hover , + .sheet-status_card_6:hover , + .sheet-status_card_7:hover , + .sheet-status_card_8:hover , + .sheet-status_card_5:focus-within , + .sheet-status_card_6:focus-within , + .sheet-status_card_7:focus-within , + .sheet-status_card_8:focus-within { + z-index: 250; + top: 300px; + transform: scale(1, 1); + } + + /* CLUE CHECK ---------------------------------------------------------- CLUE CHECK */ + + .sheet-clue_check { + white-space: nowrap; + margin: 5px 0px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-clue_check input[type="radio"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-clue_check input[type="radio"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/vsisO6I.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-clue_check input[type="radio"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-clue_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-clue_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-clue_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/vsisO6I.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* JUICE CHECK ---------------------------------------------------------- JUICE CHECK */ + + .sheet-juice_check { + white-space: nowrap; + margin: 5px 0px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-juice_check input[type="radio"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-juice_check input[type="radio"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/4Y8QreG.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-juice_check input[type="radio"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-juice_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-juice_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-juice_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/4Y8QreG.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* STORYTAG CHECK ---------------------------------------------------------- STORYTAG CHECK */ + + .sheet-storytag_check { + white-space: nowrap; + margin: 5px 0px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-storytag_check input[type="radio"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + .sheet-storytag_check input[type="radio"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-storytag_check input[type="radio"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/Gq20Q17.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-storytag_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-storytag_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-storytag_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/Gq20Q17.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* STATUS CHECK ---------------------------------------------------------- STATUS CHECK */ + + .sheet-statustag_check { + white-space: nowrap; + margin: 5px 0px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-statustag_check input[type="radio"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-statustag_check input[type="radio"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/61pyyF4.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-statustag_check input[type="radio"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-statustag_check input[type="radio"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-statustag_check input[type="radio"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-statustag_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/61pyyF4.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* PLUS CHECK ---------------------------------------------------------- PLUS CHECK */ + + .sheet-plus_check { + white-space: nowrap; + margin: auto 10px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-plus_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-plus_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/tF4WDzo.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-plus_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-plus_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-plus_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-plus_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/tF4WDzo.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + /* MINUS CHECK ---------------------------------------------------------- MINUS CHECK */ + + .sheet-minus_check { + white-space: nowrap; + margin: auto 10px; + padding: 0px; + width: 26px; + height: 26px; + } + + .sheet-minus_check input[type="checkbox"] + { + opacity: 0.0; + width: 26px; + height: 26px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -13px; + } + + + .sheet-minus_check input[type="checkbox"] + span::before + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/hYlWl6M.png); + opacity: 1; + filter: brightness(75%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(75%) drop-shadow(0px 0px 1px black); + } + + .sheet-minus_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-minus_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-minus_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-minus_image span + { + width: 26px; + height: 26px; + font-size: 26px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(https://i.imgur.com/hYlWl6M.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + position: relative; + top: -4px; + margin: 0px 6px; + } + + .sheet-status_pip_left { + height: 65px; + width: 18px; + background: white; + margin: 0px 0px 0px -4px; + padding: 0px; + -webkit-clip-path: polygon(6.8px 0, 100% 0, 100% 100%, 0% 100%); + clip-path: polygon(6.8px 0, 100% 0, 100% 100%, 0% 100%); + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + display: none; + } + + .sheet-status_pip_right { + height: 65px; + width: 18px; + background: white; + margin: 0px 4px 0px 0px; + padding: 0px; + -webkit-clip-path: polygon(0 0, 100% 0, 11.2px 100%, 0% 100%); + clip-path: polygon(0 0, 100% 0, 11.2px 100%, 0% 100%); + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + display: none; + } + + /* PIP 1 CHECK ---------------------------------------------------------- PIP 1 CHECK */ + + .sheet-status_pip_1_check { + width: 26px; + height: 65px; + margin: 0px 8px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + } + + .sheet-status_pip_1_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_1_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/BO3DedW.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_1_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_1_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_1_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_1_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/BO3DedW.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP 2 CHECK ---------------------------------------------------------- PIP 2 CHECK */ + + .sheet-status_pip_2_check { + width: 26px; + height: 65px; + margin: 0px 8px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + } + + .sheet-status_pip_2_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_2_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/YvafgYl.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_2_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_2_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_2_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_2_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/YvafgYl.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP 3 CHECK ---------------------------------------------------------- PIP 3 CHECK */ + + .sheet-status_pip_3_check { + width: 26px; + height: 65px; + margin: 0px 8px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + + } + + .sheet-status_pip_3_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_3_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/XkTpd5k.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_3_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_3_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_3_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_3_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/XkTpd5k.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP 4 CHECK ---------------------------------------------------------- PIP 4 CHECK */ + + .sheet-status_pip_4_check { + width: 26px; + height: 65px; + margin: 0px 8px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + } + + .sheet-status_pip_4_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_4_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/vnviOBo.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_4_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_4_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_4_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_4_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/vnviOBo.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP 5 CHECK ---------------------------------------------------------- PIP 5 CHECK */ + + .sheet-status_pip_5_check { + width: 26px; + height: 65px; + margin: 0px 8px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + + } + + .sheet-status_pip_5_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_5_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/wpKxCfQ.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_5_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_5_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_5_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_5_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/wpKxCfQ.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP 6 CHECK ---------------------------------------------------------- PIP 6 CHECK */ + + .sheet-status_pip_6_check { + width: 26px; + height: 65px; + margin: 0px 0px 0px 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + + } + + .sheet-status_pip_6_check input[type="checkbox"] + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_6_check input[type="checkbox"] + span::before + { + width: 26px; + height: 65px; + margin:0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/8wgAAgw.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_6_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_6_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_6_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_6_image span + { + width: 26px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/8wgAAgw.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* PIP SUB CHECK ---------------------------------------------------------- PIP SUB CHECK */ + + .sheet-status_pip_sub_check { + width: 12px; + height: 65px; + margin: 0px; + padding: 0px; + + position: relative; + white-space: nowrap; + + transform: skew(-6deg); + -ms-transform: skew(-6deg); /* IE 9 */ + -webkit-transform: skew(-6deg); /* Safari */ + transform-origin: center center; + + } + + .sheet-status_pip_sub_check input[type="checkbox"] + { + width: 12px; + height: 65px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + opacity: 0.0; + cursor: pointer; + z-index: 1; + } + + .sheet-status_pip_sub_check input[type="checkbox"] + span::before + { + width: 12px; + height: 65px; + margin: 0px; + padding: 0px; + + position: absolute; + top: 0px; + left: 0px; + + content: url(https://i.imgur.com/jMX2abh.png); + opacity: 1; + + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_sub_check input[type="checkbox"]:hover + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_sub_check input[type="checkbox"]:checked + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-status_pip_sub_check input[type="checkbox"]:active + span::before + { + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + .sheet-status_pip_sub_image span + { + width: 12px; + height: 65px; + margin: 0px; + padding: 0px; + + display: inline-block; + content: url(https://i.imgur.com/jMX2abh.png); + opacity: 1; + filter: brightness(100%); + -webkit-filter: brightness(100%); + } + + /* STATUS CARD SPECTRUM -------------------------------------------------------- START */ + + .sheet-status_grid { + width: 100%; + margin: 4px 0px 10px; + display: flex; + flex-direction: row-reverse; + flex-wrap: nowrap; + justify-content: center; + background-color: rgba(255, 255, 255, 0.0); + + transform: scale(1.08, 1.08); + -ms-transform: scale(1.08, 1.08); /* IE 9 */ + -webkit-transform: scale(1.08, 1.08); /* Safari */ + transform-origin: center center; + } + + .sheet-status_pip_sub_check:hover ~ .sheet-status_pip_sub_check span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_6 span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_5 span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_4 span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_3 span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_2 span, + .sheet-status_tier_6:hover ~ .sheet-status_tier_1 span, + .sheet-status_tier_5:hover ~ .sheet-status_tier_5 span, + .sheet-status_tier_5:hover ~ .sheet-status_tier_4 span, + .sheet-status_tier_5:hover ~ .sheet-status_tier_3 span, + .sheet-status_tier_5:hover ~ .sheet-status_tier_2 span, + .sheet-status_tier_5:hover ~ .sheet-status_tier_1 span, + .sheet-status_tier_4:hover ~ .sheet-status_tier_4 span, + .sheet-status_tier_4:hover ~ .sheet-status_tier_3 span, + .sheet-status_tier_4:hover ~ .sheet-status_tier_2 span, + .sheet-status_tier_4:hover ~ .sheet-status_tier_1 span, + .sheet-status_tier_3:hover ~ .sheet-status_tier_3 span, + .sheet-status_tier_3:hover ~ .sheet-status_tier_2 span, + .sheet-status_tier_3:hover ~ .sheet-status_tier_1 span, + .sheet-status_tier_2:hover ~ .sheet-status_tier_2 span, + .sheet-status_tier_2:hover ~ .sheet-status_tier_1 span, + .sheet-status_tier_1:hover ~ .sheet-status_tier_1 span { + filter: brightness(200%); + -webkit-filter: brightness(200%); + } + + .sheet-status_pip_sub_check:hover span, + .sheet-status_pip_sub_check:checked ~ .sheet-status_pip_sub_check span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_6 span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_5 span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_4 span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_3 span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_2 span, + .sheet-status_tier_6:checked ~ .sheet-status_tier_1 span, + .sheet-status_tier_5:checked ~ .sheet-status_tier_5 span, + .sheet-status_tier_5:checked ~ .sheet-status_tier_4 span, + .sheet-status_tier_5:checked ~ .sheet-status_tier_3 span, + .sheet-status_tier_5:checked ~ .sheet-status_tier_2 span, + .sheet-status_tier_5:checked ~ .sheet-status_tier_1 span, + .sheet-status_tier_4:checked ~ .sheet-status_tier_4 span, + .sheet-status_tier_4:checked ~ .sheet-status_tier_3 span, + .sheet-status_tier_4:checked ~ .sheet-status_tier_2 span, + .sheet-status_tier_4:checked ~ .sheet-status_tier_1 span, + .sheet-status_tier_3:checked ~ .sheet-status_tier_3 span, + .sheet-status_tier_3:checked ~ .sheet-status_tier_2 span, + .sheet-status_tier_3:checked ~ .sheet-status_tier_1 span, + .sheet-status_tier_2:checked ~ .sheet-status_tier_2 span, + .sheet-status_tier_2:checked ~ .sheet-status_tier_1 span, + .sheet-status_tier_1:checked ~ .sheet-status_tier_1 span { + filter: brightness(200%); + -webkit-filter: brightness(200%); + } + + .sheet-status_tier_5:not(:checked) ~ .sheet-status_pip_sub_6 input[type="checkbox"] , + .sheet-status_tier_4:not(:checked) ~ .sheet-status_pip_sub_5 input[type="checkbox"] , + .sheet-status_tier_3:not(:checked) ~ .sheet-status_pip_sub_4 input[type="checkbox"] , + .sheet-status_tier_2:not(:checked) ~ .sheet-status_pip_sub_3 input[type="checkbox"] { + display: none; + } + + /* STATUS TAG TOGGLE ----------------------------------------------------------- START */ + + .sheet-stat_6_F:checked ~ .sheet-stat_5, + .sheet-stat_6_F:checked ~ .sheet-stat_4, + .sheet-stat_6_F:checked ~ .sheet-stat_3, + .sheet-stat_6_F:checked ~ .sheet-stat_2, + .sheet-stat_6_F:checked ~ .sheet-stat_1, + .sheet-stat_5_E:checked ~ .sheet-stat_4, + .sheet-stat_5_E:checked ~ .sheet-stat_3, + .sheet-stat_5_E:checked ~ .sheet-stat_2, + .sheet-stat_5_E:checked ~ .sheet-stat_1, + .sheet-stat_4_D:checked ~ .sheet-stat_3, + .sheet-stat_4_D:checked ~ .sheet-stat_2, + .sheet-stat_4_D:checked ~ .sheet-stat_1, + .sheet-stat_3_C:checked ~ .sheet-stat_2, + .sheet-stat_3_C:checked ~ .sheet-stat_1, + .sheet-stat_2_B:checked ~ .sheet-stat_1{ + display: none; + + } + + .sheet-stat_5 + .sheet-stat_4, + .sheet-stat_3, + .sheet-stat_2, + .sheet-stat_1{ + display: inline; + } + + .sheet-stat_6_F:checked ~ .sheet-stat_E, + .sheet-stat_6_F:checked ~ .sheet-stat_D, + .sheet-stat_6_F:checked ~ .sheet-stat_C, + .sheet-stat_6_F:checked ~ .sheet-stat_B, + .sheet-stat_6_F:checked ~ .sheet-stat_A, + .sheet-stat_5_E:checked ~ .sheet-stat_D, + .sheet-stat_5_E:checked ~ .sheet-stat_C, + .sheet-stat_5_E:checked ~ .sheet-stat_B, + .sheet-stat_5_E:checked ~ .sheet-stat_A, + .sheet-stat_4_D:checked ~ .sheet-stat_C, + .sheet-stat_4_D:checked ~ .sheet-stat_B, + .sheet-stat_4_D:checked ~ .sheet-stat_A, + .sheet-stat_3_C:checked ~ .sheet-stat_B, + .sheet-stat_3_C:checked ~ .sheet-stat_A, + .sheet-stat_2_B:checked ~ .sheet-stat_A{ + display: inline; + } + + + .sheet-stat_F, + .sheet-stat_E, + .sheet-stat_D, + .sheet-stat_C, + .sheet-stat_B, + .sheet-stat_A{ + display: none; + } + + .sheet-stat_E_B:checked ~ .sheet-stat_D, + .sheet-stat_E_B:checked ~ .sheet-stat_C, + .sheet-stat_E_B:checked ~ .sheet-stat_B, + .sheet-stat_E_B:checked ~ .sheet-stat_A, + .sheet-stat_D_B:checked ~ .sheet-stat_C, + .sheet-stat_D_B:checked ~ .sheet-stat_B, + .sheet-stat_D_B:checked ~ .sheet-stat_A, + .sheet-stat_C_B:checked ~ .sheet-stat_B, + .sheet-stat_C_B:checked ~ .sheet-stat_A, + .sheet-stat_B_B:checked ~ .sheet-stat_A{ + filter: brightness(160%); + -webkit-filter: brightness(160%); + } + + .sheet-stat_5_E:checked ~ .sheet-spectrum_right_cap, + .sheet-stat_4_D:checked ~ .sheet-spectrum_right_cap, + .sheet-stat_3_C:checked ~ .sheet-spectrum_right_cap, + .sheet-stat_2_B:checked ~ .sheet-spectrum_right_cap, + .sheet-stat_1_A:checked ~ .sheet-spectrum_right_cap{ + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + + .sheet-stat_6_F:checked ~ .sheet-stat_E, + .sheet-stat_6_F:checked ~ .sheet-stat_D, + .sheet-stat_6_F:checked ~ .sheet-stat_C, + .sheet-stat_6_F:checked ~ .sheet-stat_B, + .sheet-stat_6_F:checked ~ .sheet-stat_A{ + filter: brightness(200%); + -webkit-filter: brightness(200%); + } + + .sheet-stat_6_F:checked ~ .sheet-spectrum_left_cap, + .sheet-stat_6_F:checked ~ .sheet-spectrum_right_cap{ + filter: brightness(200%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(200%) drop-shadow(0px 0px 1px black); + } + + /* STATUS TAG TOGGLE ----------------------------------------------------------- END */ + + + + /* SPECTRUM 1*/ + + .sheet-spectrum_1 { + white-space: nowrap; + } + + .sheet-spectrum_1 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_1 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/rg3B6BY.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_1 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_1 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* SPECTRUM 2*/ + + .sheet-spectrum_2 { + white-space: nowrap; + } + + .sheet-spectrum_2 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_2 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/ztNJj67.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_2 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_2 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* SPECTRUM 3*/ + + .sheet-spectrum_3 { + white-space: nowrap; + } + + .sheet-spectrum_3 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_3 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/Z8z95bU.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_3 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_3 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* SPECTRUM 4*/ + + .sheet-spectrum_4 { + white-space: nowrap; + } + + .sheet-spectrum_4 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_4 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/TseF8Rt.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_4 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_4 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* SPECTRUM 5*/ + + .sheet-spectrum_5 { + white-space: nowrap; + } + + .sheet-spectrum_5 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_5 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/h8JsmKI.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_5 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_5 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* SPECTRUM 6*/ + + .sheet-spectrum_6 { + white-space: nowrap; + } + + .sheet-spectrum_6 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-spectrum_6 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/b5u5MjM.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_6 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_6 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* STATUS SPECTRUM -------------------------------------------------------- END */ + + /* DUMMY SPECTRUM -------------------------------------------------------- START */ + + /* DUMMY 1*/ + + .sheet-dummy_1 { + white-space: nowrap; + } + + .sheet-dummy_1 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_1 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/rg3B6BY.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_1 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_1 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY 2*/ + + .sheet-dummy_2 { + white-space: nowrap; + } + + .sheet-dummy_2 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_2 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/ztNJj67.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_2 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_2 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY 3*/ + + .sheet-dummy_3 { + white-space: nowrap; + } + + .sheet-dummy_3 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_3 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/Z8z95bU.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_3 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_3 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY 4*/ + + .sheet-dummy_4 { + white-space: nowrap; + } + + .sheet-dummy_4 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_4 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/TseF8Rt.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_4 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_4 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY 5*/ + + .sheet-spectrum_5 { + white-space: nowrap; + } + + .sheet-dummy_5 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_5 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/h8JsmKI.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_5 input[type="checkbox"]:checked + span::before + { + opacity: 1; + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_5 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY 6*/ + + .sheet-dummy_6 { + white-space: nowrap; + } + + .sheet-dummy_6 input[type="checkbox"] + { + opacity: 0.0; + width: 40px; + height: 60px; + position: relative; + top: 0px; + left: 50%; + cursor: pointer; + z-index: 1; + margin: -20px; + } + + + .sheet-dummy_6 input[type="checkbox"] + span::before + { + width: 40px; + height: 60px; + font-size: 40px; + text-align: center; + display: inline-block; + vertical-align: middle; + content: url(http://i.imgur.com/b5u5MjM.png); + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_6 input[type="checkbox"]:checked + span::before + { + filter: brightness(80%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(80%) drop-shadow(0px 0px 1px black); + } + + .sheet-dummy_6 input[type="checkbox"]:active + span::before + { + opacity: 1; + filter: brightness(100%) drop-shadow(0px 0px 1px white); + -webkit-filter: brightness(100%) drop-shadow(0px 0px 1px white); + } + + /* DUMMY SPECTRUM -------------------------------------------------------------- END */ + + /* SPECTRUM CAPS---------------------------------------------------------------- START */ + + .sheet-spectrum_right_cap { + background: url('http://i.imgur.com/HReGU96.png') no-repeat; + display: block; + width: 30px; + height: 60px; + background-size: contain; + background-position: center; + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + .sheet-spectrum_left_cap { + background: url('http://i.imgur.com/hb5alW9.png') no-repeat; + display: block; + width: 30px; + height: 60px; + background-size: contain; + background-position: center; + filter: brightness(50%) drop-shadow(0px 0px 1px black); + -webkit-filter: brightness(50%) drop-shadow(0px 0px 1px black); + } + + /* SPECTRUM CAPS --------------------------------------------------------------- END */ + +/* STATUS CARD STYLING --------------------------------------------------------- END */ + + .sheet-hidden { + display: none; + } + + .sheet-shadow { + filter: drop-shadow(0px 0px 1px rgba(0,0,0,0.5)) drop-shadow(0px 10px 15px rgba(0,0,0,0.25)); + } + +/* ROLL TEMEPLATE CORE --------------------------------------------------------- START */ + +.sheet-rolltemplate-core { +} + +.sheet-rolltemplate-core .sheet-scraps_1 { + filter: drop-shadow(0px 5px 10px black); + overflow: visible; + margin: auto; +} + +.sheet-rolltemplate-core .sheet-scraps_1_body { + background: #fdfef9; + padding: 6px; + +} + +.sheet-rolltemplate-core .sheet-scraps_1_top { + background-image: url("https://i.imgur.com/awHCJ8P.png"); + background-repeat: repeat-x; + background-position: center; + height: 30px; + width: 100%; + +} + +.sheet-rolltemplate-core .sheet-scraps_1_bottom { + background-image: url("https://i.imgur.com/fdTFQ9k.png"); + background-repeat: repeat-x; + background-position: center; + height: 30px; + width: 100%; + +} + +/* ROLL TEMEPLATE CINEMATIC --------------------------------------------------------- START */ + +.sheet-rolltemplate-cinema { +} + +.sheet-rolltemplate-cinema .sheet-scraps_1 { + filter: drop-shadow(0px 5px 10px black); + overflow: visible; + margin: auto; +} + +.sheet-rolltemplate-cinema .sheet-scraps_1_body { + background: #fdfef9; + padding: 6px; + +} + +.sheet-rolltemplate-cinema .sheet-scraps_1_top { + background-image: url("https://i.imgur.com/awHCJ8P.png"); + background-repeat: repeat-x; + background-position: center; + height: 30px; + width: 100%; + +} + +.sheet-rolltemplate-cinema .sheet-scraps_1_bottom { + background-image: url("https://i.imgur.com/fdTFQ9k.png"); + background-repeat: repeat-x; + background-position: center; + height: 30px; + width: 100%; + +} + +/* The switch - the box around the slider */ +.sheet-switch { + position: relative; + display: inline-block; + width: 50px; + height: 24px; +} + +/* Hide default HTML checkbox */ +.sheet-switch input { + opacity: 0; + width: 0; + height: 0; +} + +/* The slider */ +.sheet-slider { + -webkit-transition: .4s; + background-color: #ccc; + border-radius: 34px; + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + transition: .4s; +} + +.sheet-slider:before { + -webkit-transition: .4s; + background-color: white; + border-radius: 50%; + bottom: 4px; + content: ""; + height: 16px; + left: 4px; + position: absolute; + transition: .4s; + width: 16px; +} + +input:checked + .sheet-slider { + background-color: #a1574a; +} + +input:focus + .sheet-slider { + box-shadow: 0 0 1px lightgrey; +} + +input:checked + .sheet-slider:before { + -webkit-transform: translateX(26px); + -ms-transform: translateX(26px); + transform: translateX(26px); +} + +input.sheet-status-toggle[value='true'] ~ div.sheet-moves_mat, +input.sheet-status-toggle[value='true'] ~ div.sheet-theme_card_mat { + display: none; +} \ No newline at end of file diff --git a/City Of Mist Offical/city-of-mist.html b/City Of Mist Official/city-of-mist.html similarity index 91% rename from City Of Mist Offical/city-of-mist.html rename to City Of Mist Official/city-of-mist.html index 4067869b03..858021baeb 100644 --- a/City Of Mist Offical/city-of-mist.html +++ b/City Of Mist Official/city-of-mist.html @@ -5780,47 +5780,47 @@ setAttrs(settings);
-
POWER
+
POWER
-
+
-
+
-
+
-
ROLL DYNAMITE -
-
BURN TAG FOR HIT -
-
DISABLE DESCRIPTIONS -
+
ROLL DYNAMITE -
+
BURN TAG FOR HIT -
+
DISABLE DESCRIPTIONS -
-
- +
+ - + - +
- +
- 1. Describe your character’s action. + 1. Describe your character’s action.
2. Activate the Tags and Statuses relevant to your character's action.
3. Press the button for the Move your action triggers.
- 4. Follow the outcome description based on your score. + 4. Follow the outcome description based on your score.
@@ -5831,7 +5831,7 @@ setAttrs(settings);
-
+
/
@@ -5845,46 +5845,46 @@ setAttrs(settings);
- - - - + + + +
- - - - + + + +
- - - - + + + +
- - - - + + + +
- - - - + + + +
- - - - + + + +
@@ -5902,27 +5902,27 @@ setAttrs(settings); @@ -5931,35 +5931,35 @@ setAttrs(settings); @@ -5968,28 +5968,28 @@ setAttrs(settings); @@ -5998,41 +5998,41 @@ setAttrs(settings); @@ -6041,9 +6041,9 @@ setAttrs(settings); @@ -6100,35 +6100,35 @@ setAttrs(settings); @@ -6137,28 +6137,28 @@ setAttrs(settings); @@ -6167,27 +6167,27 @@ setAttrs(settings); @@ -6198,43 +6198,43 @@ setAttrs(settings); @@ -6277,7 +6277,7 @@ setAttrs(settings);
- CREW THEME + CREW THEME
@@ -6288,38 +6288,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -6346,7 +6346,7 @@ setAttrs(settings);
- +
@@ -6358,7 +6358,7 @@ setAttrs(settings);
- +
@@ -6370,7 +6370,7 @@ setAttrs(settings);
- +
@@ -6382,7 +6382,7 @@ setAttrs(settings);
- +
@@ -6394,7 +6394,7 @@ setAttrs(settings);
- +
@@ -6406,7 +6406,7 @@ setAttrs(settings);
- +
@@ -6418,7 +6418,7 @@ setAttrs(settings);
- +
@@ -6430,7 +6430,7 @@ setAttrs(settings);
- +
@@ -6442,7 +6442,7 @@ setAttrs(settings);
- +
@@ -6454,7 +6454,7 @@ setAttrs(settings);
- +
@@ -6466,7 +6466,7 @@ setAttrs(settings);
- +
@@ -6477,7 +6477,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -6486,7 +6486,7 @@ setAttrs(settings);
- +
@@ -6494,7 +6494,7 @@ setAttrs(settings);
- +
@@ -6502,7 +6502,7 @@ setAttrs(settings);
- +
@@ -6510,7 +6510,7 @@ setAttrs(settings);
- +
@@ -6525,7 +6525,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -6539,7 +6539,7 @@ setAttrs(settings);
- CREW THEME + CREW THEME
@@ -6554,33 +6554,33 @@ setAttrs(settings);
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -6594,7 +6594,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -6628,38 +6628,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -6680,7 +6680,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_A_name" />
@@ -6692,7 +6692,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_B_name" />
@@ -6704,7 +6704,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_C_name">
@@ -6716,7 +6716,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_D_name">
@@ -6728,7 +6728,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_E_name">
@@ -6740,7 +6740,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_F_name" />
@@ -6752,7 +6752,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_G_name" />
@@ -6764,7 +6764,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_H_name" />
@@ -6776,7 +6776,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_I_name" />
@@ -6788,7 +6788,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_J_name">
@@ -6800,7 +6800,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra3_power_K_name">
@@ -6811,7 +6811,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -6820,7 +6820,7 @@ setAttrs(settings);
- +
@@ -6828,7 +6828,7 @@ setAttrs(settings);
- +
@@ -6836,7 +6836,7 @@ setAttrs(settings);
- +
@@ -6844,7 +6844,7 @@ setAttrs(settings);
- +
@@ -6859,7 +6859,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -6893,33 +6893,33 @@ setAttrs(settings);
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -6932,7 +6932,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -6966,38 +6966,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -7018,7 +7018,7 @@ setAttrs(settings);
- +
@@ -7030,7 +7030,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_B_name" />
@@ -7042,7 +7042,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_C_name">
@@ -7054,7 +7054,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_D_name">
@@ -7066,7 +7066,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_E_name">
@@ -7078,7 +7078,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_F_name" />
@@ -7090,7 +7090,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_G_name" />
@@ -7102,7 +7102,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_H_name" />
@@ -7114,7 +7114,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_I_name" />
@@ -7126,7 +7126,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_J_name">
@@ -7138,7 +7138,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra2_power_K_name">
@@ -7149,7 +7149,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -7158,7 +7158,7 @@ setAttrs(settings);
- +
@@ -7166,7 +7166,7 @@ setAttrs(settings);
- +
@@ -7174,7 +7174,7 @@ setAttrs(settings);
- +
@@ -7182,7 +7182,7 @@ setAttrs(settings);
- +
@@ -7197,7 +7197,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7225,39 +7225,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -7270,7 +7270,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7304,38 +7304,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -7356,7 +7356,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_A_name" />
@@ -7368,7 +7368,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_B_name" />
@@ -7380,7 +7380,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_C_name">
@@ -7392,7 +7392,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_D_name">
@@ -7404,7 +7404,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_E_name">
@@ -7416,7 +7416,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_F_name" />
@@ -7428,7 +7428,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_G_name" />
@@ -7440,7 +7440,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_H_name" />
@@ -7452,7 +7452,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_I_name" />
@@ -7464,7 +7464,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_J_name">
@@ -7476,7 +7476,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_extra1_power_K_name">
@@ -7487,7 +7487,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -7496,7 +7496,7 @@ setAttrs(settings);
- +
@@ -7504,7 +7504,7 @@ setAttrs(settings);
- +
@@ -7512,7 +7512,7 @@ setAttrs(settings);
- +
@@ -7520,7 +7520,7 @@ setAttrs(settings);
- +
@@ -7535,7 +7535,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7563,39 +7563,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -7608,7 +7608,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7634,14 +7634,14 @@ setAttrs(settings);
@@ -7652,38 +7652,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -7710,7 +7710,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_A_name" />
@@ -7722,7 +7722,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_B_name" />
@@ -7734,7 +7734,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_C_name">
@@ -7746,7 +7746,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_D_name">
@@ -7758,7 +7758,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_E_name">
@@ -7770,7 +7770,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_F_name" />
@@ -7782,7 +7782,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_G_name" />
@@ -7794,7 +7794,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_H_name" />
@@ -7806,7 +7806,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_I_name" />
@@ -7818,7 +7818,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_J_name">
@@ -7830,7 +7830,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos4_power_K_name">
@@ -7841,7 +7841,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -7850,7 +7850,7 @@ setAttrs(settings);
- +
@@ -7858,7 +7858,7 @@ setAttrs(settings);
- +
@@ -7866,7 +7866,7 @@ setAttrs(settings);
- +
@@ -7874,7 +7874,7 @@ setAttrs(settings);
- +
@@ -7889,7 +7889,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7903,14 +7903,14 @@ setAttrs(settings);
@@ -7922,39 +7922,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -7962,10 +7962,10 @@ setAttrs(settings);
- FLIPSIDE: + FLIPSIDE:
- +
@@ -7974,7 +7974,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -7995,15 +7995,15 @@ setAttrs(settings);
@@ -8014,38 +8014,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- FADE: + FADE:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -8069,7 +8069,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_A_name" />
@@ -8081,7 +8081,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_B_name" />
@@ -8093,7 +8093,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_C_name">
@@ -8105,7 +8105,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_D_name">
@@ -8117,7 +8117,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_E_name">
@@ -8129,7 +8129,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_F_name" />
@@ -8141,7 +8141,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_G_name" />
@@ -8153,7 +8153,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_H_name" />
@@ -8165,7 +8165,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_I_name" />
@@ -8177,7 +8177,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_J_name">
@@ -8189,7 +8189,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos4_power_K_name">
@@ -8200,7 +8200,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -8209,7 +8209,7 @@ setAttrs(settings);
- +
@@ -8217,7 +8217,7 @@ setAttrs(settings);
- +
@@ -8225,7 +8225,7 @@ setAttrs(settings);
- +
@@ -8233,7 +8233,7 @@ setAttrs(settings);
- +
@@ -8248,7 +8248,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -8262,15 +8262,15 @@ setAttrs(settings);
@@ -8282,49 +8282,49 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- FLIPSIDE: + FLIPSIDE:
- +
@@ -8333,7 +8333,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -8360,14 +8360,14 @@ setAttrs(settings);
@@ -8378,38 +8378,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -8436,7 +8436,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_A_name" />
@@ -8448,7 +8448,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_B_name" />
@@ -8460,7 +8460,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_C_name">
@@ -8472,7 +8472,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_D_name">
@@ -8484,7 +8484,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_E_name">
@@ -8496,7 +8496,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_F_name" />
@@ -8508,7 +8508,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_G_name" />
@@ -8520,7 +8520,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_H_name" />
@@ -8532,7 +8532,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_I_name" />
@@ -8544,7 +8544,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_J_name">
@@ -8556,7 +8556,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos3_power_K_name">
@@ -8567,7 +8567,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -8576,7 +8576,7 @@ setAttrs(settings);
- +
@@ -8584,7 +8584,7 @@ setAttrs(settings);
- +
@@ -8592,7 +8592,7 @@ setAttrs(settings);
- +
@@ -8600,7 +8600,7 @@ setAttrs(settings);
- +
@@ -8615,7 +8615,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -8629,14 +8629,14 @@ setAttrs(settings);
@@ -8648,39 +8648,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -8688,10 +8688,10 @@ setAttrs(settings);
- FLIPSIDE: + FLIPSIDE:
- +
@@ -8700,7 +8700,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -8721,15 +8721,15 @@ setAttrs(settings);
@@ -8740,38 +8740,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- FADE: + FADE:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -8795,7 +8795,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_A_name" />
@@ -8807,7 +8807,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_B_name" />
@@ -8819,7 +8819,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_C_name">
@@ -8831,7 +8831,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_D_name">
@@ -8843,7 +8843,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_E_name">
@@ -8855,7 +8855,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_F_name" />
@@ -8867,7 +8867,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_G_name" />
@@ -8879,7 +8879,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_H_name" />
@@ -8891,7 +8891,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_I_name" />
@@ -8903,7 +8903,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_J_name">
@@ -8915,7 +8915,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos3_power_K_name">
@@ -8926,7 +8926,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -8935,7 +8935,7 @@ setAttrs(settings);
- +
@@ -8943,7 +8943,7 @@ setAttrs(settings);
- +
@@ -8951,7 +8951,7 @@ setAttrs(settings);
- +
@@ -8959,7 +8959,7 @@ setAttrs(settings);
- +
@@ -8974,7 +8974,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -8988,15 +8988,15 @@ setAttrs(settings);
@@ -9008,49 +9008,49 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- FLIPSIDE: + FLIPSIDE:
- +
@@ -9059,7 +9059,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -9086,14 +9086,14 @@ setAttrs(settings);
@@ -9104,38 +9104,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -9162,7 +9162,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_A_name" />
@@ -9174,7 +9174,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_B_name" />
@@ -9186,7 +9186,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_C_name">
@@ -9198,7 +9198,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_D_name">
@@ -9210,7 +9210,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_E_name">
@@ -9222,7 +9222,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_F_name" />
@@ -9234,7 +9234,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_G_name" />
@@ -9246,7 +9246,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_H_name" />
@@ -9258,7 +9258,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_I_name" />
@@ -9270,7 +9270,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_J_name">
@@ -9282,7 +9282,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos2_power_K_name">
@@ -9293,7 +9293,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -9302,7 +9302,7 @@ setAttrs(settings);
- +
@@ -9310,7 +9310,7 @@ setAttrs(settings);
- +
@@ -9318,7 +9318,7 @@ setAttrs(settings);
- +
@@ -9326,7 +9326,7 @@ setAttrs(settings);
- +
@@ -9341,7 +9341,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -9355,14 +9355,14 @@ setAttrs(settings);
@@ -9374,39 +9374,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -9414,10 +9414,10 @@ setAttrs(settings);
- FLIPSIDE: + FLIPSIDE:
- +
@@ -9426,7 +9426,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -9447,15 +9447,15 @@ setAttrs(settings);
@@ -9466,38 +9466,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- FADE: + FADE:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -9521,7 +9521,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_A_name" />
@@ -9533,7 +9533,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_B_name" />
@@ -9545,7 +9545,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_C_name">
@@ -9557,7 +9557,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_D_name">
@@ -9569,7 +9569,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_E_name">
@@ -9581,7 +9581,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_F_name" />
@@ -9593,7 +9593,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_G_name" />
@@ -9605,7 +9605,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_H_name" />
@@ -9617,7 +9617,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_I_name" />
@@ -9629,7 +9629,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_J_name">
@@ -9641,7 +9641,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos2_power_K_name">
@@ -9652,7 +9652,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -9661,7 +9661,7 @@ setAttrs(settings);
- +
@@ -9669,7 +9669,7 @@ setAttrs(settings);
- +
@@ -9677,7 +9677,7 @@ setAttrs(settings);
- +
@@ -9685,7 +9685,7 @@ setAttrs(settings);
- +
@@ -9700,7 +9700,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -9714,15 +9714,15 @@ setAttrs(settings);
@@ -9737,43 +9737,43 @@ setAttrs(settings);
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- FLIPSIDE: + FLIPSIDE:
- +
@@ -9782,7 +9782,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -9809,14 +9809,14 @@ setAttrs(settings);
@@ -9827,38 +9827,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- CRACK: + CRACK:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -9885,7 +9885,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_A_name" />
@@ -9897,7 +9897,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_B_name" />
@@ -9909,7 +9909,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_C_name">
@@ -9921,7 +9921,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_D_name">
@@ -9933,7 +9933,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_E_name">
@@ -9945,7 +9945,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_F_name" />
@@ -9957,7 +9957,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_G_name" />
@@ -9969,7 +9969,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_H_name" />
@@ -9981,7 +9981,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_I_name" />
@@ -9993,7 +9993,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_J_name">
@@ -10005,7 +10005,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_logos1_power_K_name">
@@ -10016,7 +10016,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -10025,7 +10025,7 @@ setAttrs(settings);
- +
@@ -10033,7 +10033,7 @@ setAttrs(settings);
- +
@@ -10041,7 +10041,7 @@ setAttrs(settings);
- +
@@ -10049,7 +10049,7 @@ setAttrs(settings);
- +
@@ -10064,7 +10064,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10078,14 +10078,14 @@ setAttrs(settings);
@@ -10097,39 +10097,39 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -10137,10 +10137,10 @@ setAttrs(settings);
- FLIPSIDE: + FLIPSIDE:
- +
@@ -10149,7 +10149,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10170,15 +10170,15 @@ setAttrs(settings);
@@ -10189,38 +10189,38 @@ setAttrs(settings);
- +
-
+
- ATTN: + ATTN:
-
+
- FADE: + FADE:
- - + +
- POWER TAGS: + POWER TAGS:
@@ -10244,7 +10244,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_A_name" />
@@ -10256,7 +10256,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_B_name" />
@@ -10268,7 +10268,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_C_name">
@@ -10280,7 +10280,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_D_name">
@@ -10292,7 +10292,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_E_name">
@@ -10304,7 +10304,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_F_name" />
@@ -10316,7 +10316,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_G_name" />
@@ -10328,7 +10328,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_H_name" />
@@ -10340,7 +10340,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_I_name" />
@@ -10352,7 +10352,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_J_name">
@@ -10364,7 +10364,7 @@ setAttrs(settings);
- + "Power Tag" name="attr_mythos1_power_K_name">
@@ -10375,7 +10375,7 @@ setAttrs(settings);
- WEAKNESS TAGS: + WEAKNESS TAGS:
@@ -10384,7 +10384,7 @@ setAttrs(settings);
- +
@@ -10392,7 +10392,7 @@ setAttrs(settings);
- +
@@ -10400,7 +10400,7 @@ setAttrs(settings);
- +
@@ -10408,7 +10408,7 @@ setAttrs(settings);
- +
@@ -10423,7 +10423,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10437,15 +10437,15 @@ setAttrs(settings);
@@ -10457,49 +10457,49 @@ setAttrs(settings);
- IMPROVEMENTS: + IMPROVEMENTS:
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- FLIPSIDE: + FLIPSIDE:
- +
@@ -10508,7 +10508,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10532,7 +10532,7 @@ setAttrs(settings);
- CHARACTER CARD + CHARACTER CARD
@@ -10544,11 +10544,11 @@ setAttrs(settings);
- +
-
+
@@ -10559,7 +10559,7 @@ setAttrs(settings);
- BUILD-UP: + BUILD-UP:
@@ -10571,16 +10571,16 @@ setAttrs(settings);
- MYTHOS: + MYTHOS:
- +
- LOGOS: + LOGOS:
- +
@@ -10588,11 +10588,11 @@ setAttrs(settings);
- CREW: + CREW:
-
HELP
-
HURT
+
HELP
+
HURT
@@ -10605,7 +10605,7 @@ setAttrs(settings);
- +
@@ -10615,7 +10615,7 @@ setAttrs(settings);
- +
@@ -10625,7 +10625,7 @@ setAttrs(settings);
- +
@@ -10635,7 +10635,7 @@ setAttrs(settings);
- +
@@ -10645,7 +10645,7 @@ setAttrs(settings);
- +
@@ -10655,7 +10655,7 @@ setAttrs(settings);
- +
@@ -10670,7 +10670,7 @@ setAttrs(settings);
- STORY TAGS: + STORY TAGS:
@@ -10699,7 +10699,7 @@ setAttrs(settings);
- +
@@ -10708,7 +10708,7 @@ setAttrs(settings);
- +
@@ -10717,7 +10717,7 @@ setAttrs(settings);
- +
@@ -10726,7 +10726,7 @@ setAttrs(settings);
- +
@@ -10735,7 +10735,7 @@ setAttrs(settings);
- +
@@ -10744,7 +10744,7 @@ setAttrs(settings);
- +
@@ -10797,7 +10797,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10814,7 +10814,7 @@ setAttrs(settings);
- CHARACTER CARD + CHARACTER CARD
@@ -10828,7 +10828,7 @@ setAttrs(settings);
- MOMENTS OF EVOLUTION: + MOMENTS OF EVOLUTION:
@@ -10839,8 +10839,8 @@ setAttrs(settings);
-
- Choose another broad power tag +
+ Choose another broad power tag
@@ -10848,8 +10848,8 @@ setAttrs(settings);
-
- Gain an extra theme +
+ Gain an extra theme
@@ -10857,8 +10857,8 @@ setAttrs(settings);
-
- Gain an extra theme +
+ Gain an extra theme
@@ -10866,8 +10866,8 @@ setAttrs(settings);
-
- Gain an extra theme +
+ Gain an extra theme
@@ -10875,8 +10875,8 @@ setAttrs(settings);
-
- Get closure from your Nemeses +
+ Get closure from your Nemeses
@@ -10884,8 +10884,8 @@ setAttrs(settings);
-
- Go through a transformation +
+ Go through a transformation
@@ -10893,8 +10893,8 @@ setAttrs(settings);
-
- Leave the City +
+ Leave the City
@@ -10902,8 +10902,8 @@ setAttrs(settings);
-
- Make one Core Move Dynamite! +
+ Make one Core Move Dynamite!
@@ -10911,8 +10911,8 @@ setAttrs(settings);
-
- Make one Core Move Dynamite! +
+ Make one Core Move Dynamite!
@@ -10920,8 +10920,8 @@ setAttrs(settings);
-
- Make one Core Move Dynamite! +
+ Make one Core Move Dynamite!
@@ -10929,8 +10929,8 @@ setAttrs(settings);
-
- See through the Mist +
+ See through the Mist
@@ -10938,13 +10938,13 @@ setAttrs(settings); -
- NOTES: +
+ NOTES:
- +
@@ -10956,7 +10956,7 @@ setAttrs(settings);
- FLIP CARD + FLIP CARD
@@ -10980,7 +10980,7 @@ setAttrs(settings);
- TRACKING CARDS ONLY (NPC) + TRACKING CARDS ONLY (NPC)