/*Configure the tab buttons*/ .sheet-complete, .sheet-simple { display: none; } /* show the selected tab */ .sheet-tabstoggle[value="complete"] ~ div.sheet-complete, .sheet-tabstoggle[value="simple"] ~ div.sheet-simple { display: block; } .sheet-background_image{ background-image: url('https://i.imgur.com/QBsGsKJ.jpg'); background-repeat: no-repeat; background-size: cover; max-width: 800px; min-width: 800px; height: 100%; } .sheet-info{ display: flex; flex-direction: row; align-items: center; justify-content: space-around; } .sheet-info_name{ width: 110px; font-size: 20px; font-family:Serif; } .sheet-info_name_2{ width: 110px; font-size: 16px; font-family:Serif; } .sheet-info_input{ font-size: 18px; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; } .sheet-info_input_2{ width: 40px; font-size: 18px; text-align: center; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; } .sheet-info_input_3{ width: 130px; font-size: 18px; background-color: transparent; border-top: transparent; border-radius: 12px 12px 12px 12px; border-width: 2px; border-color: #737373; } .sheet-ability{ display: flex; flex-direction: row; align-items: center; justify-content: space-around; margin-top: 20px; height: 230px; } .sheet-ability_column{ display: flex; flex-direction: column; align-items: center; justify-content: space-around; height: 200px; } .sheet-ability_input{ width: 30px; height: 30px; font-size: 15px; font-weight: 700; text-align: center; border-radius: 100%; background-color: transparent; border-width: 2px; border-color: #737373; } .sheet-ability_input_simple{ width: 30px; height: 30px; font-size: 15px; font-weight: 700; text-align: center; color: transparent; border-radius: 100%; background-color: transparent; border-width: 2px; border-color: transparent; } .sheet-ability_input_red{ width: 30px; height: 30px; font-size: 15px; font-weight: 700; text-align: center; border-radius: 100%; background-color: #ff704d; border-width: 2px; border-color: #737373; } .sheet-ability_input_yellow{ width: 30px; height: 30px; font-size: 15px; font-weight: 700; text-align: center; border-radius: 100%; background-color: #ffcc00; border-width: 2px; border-color: #737373; } .sheet-ability_name{ display: flex; width: 125px; font-size: 20px; font-family:Serif; align-items: center; justify-content: center; } .sheet-ability_bonus{ margin-left: 20px; margin-right: 20px; font-size: 25px; } .sheet-ability_button{ background-color: transparent; border-color: transparent; width: 102px; background: none; } .sheet-ability_button_name{ background-color: transparent; border-color: transparent; width: 102px; background: none; text-align:center; font-family:Serif; font-size:17px; } button[type=roll].sheet-ability_button::before{ content: ''; } .sheet-weapons{ display: flex; flex-direction: column; align-items: center; justify-content: space-around; } .sheet-align{ display: flex; align-items: center; margin-top: 10px; } .sheet-align_2{ margin-top: 10px; } button[type=roll].sheet-weapons_button::before{ content: ''; } button[type=roll].sheet-weapons_button_damage::before{ content: ''; } .sheet-weapons_button{ width: 40px; height: 40px; border-radius: 100%; background-color: transparent; border-width: 0px; background: none; } .sheet-weapons_button_damage{ margin-left: 10px; width: 40px; height: 40px; border-radius: 100%; border-width: 0px; background-color: transparent; background: none; } .sheet-weapons_damage{ display: flex; flex-direction: column; align-items: center; margin-left: 5px; margin-right: 5px; } .sheet-weapons_damage_name{ font-family:Serif; font-size:15px; align-items: center; } .sheet-weapons_damage_text_dx{ margin-left: 4px; margin-right: 4px; } .sheet-weapons_damage_text_sx{ margin-right: 4px; color: transparent; } .sheet-weapons_damage_2{ display: flex; flex-direction: row; align-items: center; } .sheet-weapon_name{ margin-left: 5px; margin-right: 2px; width: 31px; } .sheet-weapons_input{ width: 35px; font-size: 20px; text-align: center; background-color: transparent; border-width: 2px; border-color: #737373; } .sheet-weapons_input_damage_green{ width: 30px; font-size: 18px; font-weight: 700; text-align: center; background-color: #73e600; } .sheet-weapons_input_damage_yellow{ width: 30px; font-size: 18px; font-weight: 700; text-align: center; background-color: #ffd11a; } .sheet-weapons_input_damage_red{ width: 30px; font-size: 18px; font-weight: 700; text-align: center; background-color: #ff704d; } .sheet-weapons_input_weapon_name{ width: 130px; margin-right: 10px; font-size: 20px; background-color: transparent; border-width: 2px; border-color: #737373; } .sheet-weapons_input_weapon_name_sx{ margin-left: 18px; width: 158px; margin-right: 10px; font-size: 20px; background-color: transparent; border-width: 2px; border-color: #737373; } .sheet-equip{ margin-top: 10px; display: flex; flex-direction: row; align-items: center; justify-content: space-around; } .sheet-equip-name{ font-family:cursive; font-size:20px; color: #800000; } .sheet-equip_input{ display: flex; flex-direction: column; align-items: center; justify-content: center; } .sheet-equip_input_sx{ width: 200px; margin-top: 5px; font-size: 17px; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; } .sheet-equip_input_money{ width: 42px; margin-top: 5px; font-size: 15px; text-align: center; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; } .sheet-equip_input_dx{ font-size: 17px; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; } .sheet-total{ margin-top: 5px; font-size: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .sheet-total_align{ display: flex; flex-direction: row; } .sheet-total_align_down{ display: flex; flex-direction: column; } .sheet-total_align_down_dx{ display: flex; flex-direction: column; margin-left: 80px; } .sheet-total_input{ width: 140px; text-align:center; font-family:Serif; font-size:15px; } .sheet-equip_input_money_tot{ width: 50px; font-size: 15px; text-align: center; background-color: transparent; border-top: transparent; border-left: transparent; border-right: transparent; border-bottom-width: 2px; border-bottom-color: #737373; }