/************* SHEET ***************/ div, button, textarea, span, input, select, table, tr, td, th{ box-sizing: border-box; } input[type=radio].sheet-styleCypher, input[type=radio].sheet-styleNumenera, input[type=radio].sheet-styleTheStrange, input[type=radio].sheet-styleNpc, input[type=radio].sheet-actionRoll, input[type=radio].sheet-macroRoll{ margin-left: 2px; margin-right: 1px; display: inline-block; } input[type=radio].sheet-styleCypher + span, input[type=radio].sheet-styleNumenera + span, input[type=radio].sheet-styleTheStrange + span, input[type=radio].sheet-styleNpc + span, input[type=radio].sheet-actionRoll + span, input[type=radio].sheet-macroRoll + span, input[type=checkbox].sheet-chkUseAsset + span, input[type=checkbox].sheet-chkUseBonus + span, input[type=checkbox].sheet-chkUseCost + span { font-size:11px; color: #888888; text-align:left; } div.sheet-UseAsset, div.sheet-UseBonus, div.sheet-UseCost{ display: none } input[type=checkbox].sheet-chkUseAsset:checked ~ div.sheet-main div.sheet-UseAsset{ display: inline-block; } input[type=checkbox].sheet-chkUseBonus:checked ~ div.sheet-main div.sheet-UseBonus{ display: inline-block; } input[type=checkbox].sheet-chkUseCost:checked ~ div.sheet-main div.sheet-UseCost{ display: inline-block; } input[type=radio].sheet-styleNumenera:checked ~ .sheet-main{ background: linear-gradient(#E1E1EE,white); width: 1056px; padding: 10px; } input[type=radio].sheet-styleNumenera:checked ~ .sheet-main{ background: white; width: 1056px; padding: 10px; } input[type=radio].sheet-styleTheStrange:checked ~ .sheet-main{ background: linear-gradient(#1B1E30, #DBDCDE, #E0E7ED, white); width: 1056px; padding: 10px; } input[type=radio].sheet-styleNpc:checked ~ .sheet-main{ display: none; } input[type=radio].sheet-styleCypher:checked ~ .sheet-npc, input[type=radio].sheet-styleNumenera:checked ~ .sheet-npc, input[type=radio].sheet-styleTheStrange:checked ~ .sheet-npc{ display: none; } input[type=radio].sheet-styleNpc:checked ~ .sheet-npc{ display: inherit; } button[type=roll].sheet-btDesc{ color: inherit; height:20px; width:22px; line-height: 16px; vertical-align: middle; padding:none; border:none; margin:none; background:none; border-radius:10px; opacity: 0.4; } button[type=roll].sheet-btDesc:before{ content:none; } button[type=roll].sheet-btDesc:hover{ box-shadow: 1px 1px 1px 1px #888888; opacity: 0.7; } button[type=roll].sheet-basicbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color:#22428F; border-width: 1px; border-style: solid; border-color: rgba(34,66,143,0.5); border-radius: 10px; } button[type=roll].sheet-basicbt:hover{ border-width: 2px; border-color:#22428F; font-weight: bold; } button[type=roll].sheet-actionbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color:#22428F; border-width: 1px; border-style: solid; border-color: rgba(34,66,143,0.5); border-radius: 10px; } button[type=roll].sheet-actionbt:hover{ border-width: 2px; border-color:#22428F; font-weight: bold; } button[type=roll].sheet-macrobt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color:#22428F; border-width: 1px; border-style: solid; border-color: rgba(34,66,143,0.5); border-radius: 3px; } button[type=roll].sheet-macrobt:hover{ border-width: 2px; border-color:#22428F; font-weight: bold; } input[type=radio].sheet-macroRoll:checked ~ div.sheet-main button[type=roll].sheet-actionbt{ display: none; } input[type=radio].sheet-actionRoll:checked ~ div.sheet-main button[type=roll].sheet-actionbt{ display: inline-block; } input[type=radio].sheet-macroRoll:checked ~ div.sheet-main button[type=roll].sheet-macrobt{ display: inline-block; } input[type=radio].sheet-actionRoll:checked ~ div.sheet-main button[type=roll].sheet-macrobt{ display: none; } input[type=radio].sheet-actionRoll:checked ~ div.sheet-main div.sheet-divaction{ display: inline-block; } input[type=radio].sheet-macroRoll:checked ~ div.sheet-main div.sheet-divaction{ display: none; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-basicbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: bold; color: #A09C90; border-width: 1px; border-style: solid; border-color: #A09C90; border-radius: 10px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-basicbt:hover{ border-width: 2px; color: #53628A; border-color:#53628A; font-weight: bold; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-actionbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: bold; color: #A09C90; border-width: 1px; border-style: solid; border-color: #A09C90; border-radius: 10px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-actionbt:hover{ border-width: 2px; color: #53628A; border-color:#53628A; font-weight: bold; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-macrobt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: bold; color: #A09C90; border-width: 1px; border-style: solid; border-color: #A09C90; border-radius: 3px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main button[type=roll].sheet-macrobt:hover{ border-width: 2px; color: #53628A; border-color:#53628A; font-weight: bold; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-basicbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color: #050E29; border-width: 1px; border-style: solid; border-color: rgba(5,14,41,0.5); border-radius: 10px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-basicbt:hover{ border-width: 2px; color: #050E29; border-color:#050E29; font-weight: bold; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-actionbt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color: #050E29; border-width: 1px; border-style: solid; border-color: rgba(5,14,41,0.5); border-radius: 10px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-actionbt:hover{ border-width: 2px; color: #050E29; border-color:#050E29; font-weight: bold; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-macrobt { padding: 2px 0px 0px 1px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; height: 20px; width: 20px; font-size: 1.2em; font-weight: normal; color: #050E29; border-width: 1px; border-style: solid; border-color: rgba(5,14,41,0.5); border-radius: 3px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main button[type=roll].sheet-macrobt:hover{ border-width: 2px; color: #050E29; border-color:#050E29; font-weight: bold; } button[type=roll].sheet-apibt{ padding: 2px 0px 0px 0px; margin: 0px 0px 0px 0px; text-shadow: none; box-shadow: none; text-align:center; vertical-align: middle; line-height: 0px; font-size: 1em; font-weight: normal; width:15px; height: 15px; color: #6D0100; border: 1px solid #CC9F9F; border-radius: 0px 3px 0px 3px; } button[type=roll].sheet-apibt:hover{ border-color: #6D0100; font-weight: bold; } table{ border-collapse: collapse; padding:none; margin:none; width: 100%; } tr{ padding:none; margin:none; } td{ padding:none; margin:none; white-space: nowrap; text-align: center; } input[type=text]{ margin: 0px; padding-left: 0.3em; padding-right: 0.1em; padding-top: 0.1em; padding-bottom: 0.1em; background-color: white; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type=text]{ margin: 0px; padding-left: 0.3em; padding-right: 0.1em; padding-top: 0.1em; padding-bottom: 0.1em; background-color: #F5F7FC; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main input[type=text]{ margin: 0px; padding-left: 0.3em; padding-right: 0.1em; padding-top: 0.1em; padding-bottom: 0.1em; background-color: white; border-radius: 0px; } select{ height: 20px; margin: 0px; padding-left: 0em; padding-right: 0.2em; padding-top: 0.2em; padding-bottom: 0.1em; background-color: white; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main select{ height: 20px; margin: 0px; padding-left: 0.3em; padding-right: 0.2em; padding-top: 0.2em; padding-bottom: 0.1em; background-color: #F5F7FC; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main select{ height: 20px; margin: 0px; padding-left: 0.3em; padding-right: 0.2em; padding-top: 0.2em; padding-bottom: 0.1em; background-color: #F5F7FC; } select.sheet-selaction{ width: 40px; height: 18px; line-height: 18px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main textarea{ background-color: #F5F7FC; } input[type="number"]{ text-align: right; height: 20px; margin: 0px; padding-left: 0.3em; padding-right: 0.2em; padding-top: 0.2em; padding-bottom: 0.1em; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type="number"]{ text-align: right; height: 20px; margin: 0px; padding-left: 0.3em; padding-right: 0.2em; padding-top: 0.2em; padding-bottom: 0.1em; background-color: #F5F7FC; } input[type="radio"]{ padding: 0px; margin: 0px; width: 12px; } input[type=text].sheet-whiteinput{ background: white; height: 25px; border-width: 0px 0px 3px 0px; font-weight: bold; border-color: #22428F; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main input[type=text].sheet-whiteinput{ background: white; border-color: #53628A; border-width: 0px 0px 2px 0px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main input[type=text].sheet-whiteinput{ border-color: #050E29; border-width: 0px 0px 1px 0px; } .sheet-underwhite{ color: white; background-color: #BDC3DC; border: none; border-bottom-right-radius: 7px; padding-left: 3px; padding-top: 0px; padding-bottom: 0px; margin-bottom: 5px; font-size: 10px; font-weight: bold; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-underwhite{ color: #53628A; background: linear-gradient(to right,#E7DEB0,#FDF9F4);/* #E7DEB0;*/ border: none; border-bottom-right-radius: 7px; padding-left: 3px; padding-top: 0px; padding-bottom: 0px; margin-bottom: 5px; font-size: 10px; font-weight: bold; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-underwhite{ color: #DCDFE4; background: transparent; border: none; border-bottom-right-radius: 0px; padding-left: 3px; padding-top: 0px; padding-bottom: 0px; margin-bottom: 5px; font-size: 10px; font-weight: normal; font-style: italic; } .sheet-text1{ color: #22428F; background: transparent; font-weight: bold; font-size: 12px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-text1{ color: #7F2E23; background: transparent; font-weight: bold; font-size: 12px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-text1{ color: #050E29; background: transparent; font-weight: bold; font-size: 12px; } .sheet-text2{ color: #22428F; background: transparent; font-size: 11px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-text2{ color: #53628A; background: transparent; font-size: 11px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-text2{ color: #050E29; background: transparent; font-size: 11px; } .sheet-textfat{ color: #22428F; background: transparent; font-weight: bold; font-size: 12px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-textfat{ color: #7F2E23; background: transparent; font-weight: bold; font-size: 12px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-textfat{ color: white; background: transparent; font-weight: bold; font-size: 12px; } .sheet-supblock{ width: 340px; text-align: center; } .sheet-blublock{ padding: 0px 0px 0px 4px; background-color: #22428F; border-bottom-left-radius: 7px; border-top-right-radius: 7px; border: 1px solid #22428F; text-align: center; margin-bottom: 5px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-blublock{ padding: 0px 0px 0px 2px; background-color: #53628A; /* border-bottom-left-radius: 7px; border-top-right-radius: 7px; */ border-radius: 7px; border: 1px solid #53628A; text-align: center; margin-bottom: 5px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-blublock{ padding: 2px; background-color: #050E29; border-radius: 0px; border: 1px solid white; text-align: center; margin-bottom: 5px; } .sheet-inpblock{ background-color: #E0E0ED; border: none; border-radius: 7px; padding:0px 4px 0px 4px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-inpblock{ /* background-color: white;*/ background: radial-gradient(#FDF9F4 40%,#E7DEB0); border: none; border-radius: 7px; padding:0px 4px 0px 4px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-inpblock{ background-color: #DCDFE4; border: none; border-radius: 0px; padding:0px 4px 0px 4px; } .sheet-inpblock2{ background-color: #C8C8DF; border: none; border-radius: 7px; padding:0px 4px 0px 4px; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main .sheet-inpblock2{ background: radial-gradient(#FDF9F4 40%,#E7DEB0); border: none; border-radius: 7px; padding:0px 4px 0px 4px; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main .sheet-inpblock2{ background-color: #DCDFE4; border: none; border-radius: 0px; padding:0px 4px 0px 4px; } img.sheet-gamelogoCypher{ width: 330px; display: none; } img.sheet-gamelogoNumenera{ width: 330px; display: none; } img.sheet-gamelogoTheStrange{ width: 330px; display: none; } input[type=radio].sheet-styleCypher:checked ~ div.sheet-main img.sheet-gamelogoCypher{ display: block; } input[type=radio].sheet-styleNumenera:checked ~ div.sheet-main img.sheet-gamelogoNumenera{ display: block; } input[type=radio].sheet-styleTheStrange:checked ~ div.sheet-main img.sheet-gamelogoTheStrange{ display: block; } /************ DESCRIPTION TAILLE VARIABLE **************************/ input[type="checkbox"].sheet-dispcheck{ width: 18px; height: 18px; max-width: 18px; opacity: 0; z-index: 2; } input[type="checkbox"].sheet-dispcheck + span{ display: inline-block; text-align: center; margin-left: -18px; width: 18px; max-width: 18px; height: 18px; z-index: 1; font-family: pictos; color: #888888; font-size: 15px; } input[type="checkbox"].sheet-dispcheck:hover + span{ color: black; } input[type="checkbox"].sheet-dispcheck:checked + span{ font-weight: bold; color: black; } textarea{ box-shadow: none; text-shadow: none; padding: 1px; margin: 2px; } textarea.sheet-textdesc{ height: 22px; resize: none; font-size: 12px; } input[type="checkbox"].sheet-dispcheck:checked ~ textarea.sheet-textdesc{ height: 140px; } /* Roll templates */ .sheet-rolltemplate-cyphMsg table { width: 100%; padding: 2px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; border: none; background-color: #FEFAFA; border-bottom: 1px solid #B80000; } .sheet-rolltemplate-cyphMsg tr { border-left: 1px solid #B80000; border-right: 1px solid #B80000; } .sheet-rolltemplate-cyphMsg th { background-color: #B80000; color : #FBFCFC; line-height: 1.4em; font-size: 1.2em; text-align: center; font-family: "Times New Roman", Times, serif; font-variant: small-caps; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; margin-bottom: 6px; } .sheet-rolltemplate-cyphInit table { width: 100%; padding: 2px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; border: none; background-color: #FAF4FA; border-bottom: 1px solid #931693; } .sheet-rolltemplate-cyphInit tr { border-left: 1px solid #931693; border-right: 1px solid #931693; } .sheet-rolltemplate-cyphInit th { background-color: #931693; color : #FBFCFC; line-height: 1.4em; font-size: 1.2em; text-align: center; font-family: "Times New Roman", Times, serif; font-variant: small-caps; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; margin-bottom: 6px; } .sheet-rolltemplate-cyphRecovery table { width: 100%; padding: 2px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; border: none; background-color: #EAF3EA; border-bottom: 1px solid #2E8A2E; } .sheet-rolltemplate-cyphRecovery tr { border-left: 1px solid #2E8A2E; border-right: 1px solid #2E8A2E; } .sheet-rolltemplate-cyphRecovery th { background-color: #2E8A2E; color : #FBFCFC; line-height: 1.4em; font-size: 1.2em; text-align: center; font-family: "Times New Roman", Times, serif; font-variant: small-caps; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; margin-bottom: 6px; } .sheet-rolltemplate-cyphDesc table { width: 100%; padding: 2px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; border: none; background-color: #FAF4FA; border-bottom: 1px solid #702082; } .sheet-rolltemplate-cyphDesc tr { border-left: 1px solid #702082; border-right: 1px solid #702082; } .sheet-rolltemplate-cyphDesc th { background-color: #702082; color : #FBFCFC; line-height: 1.4em; font-size: 1.2em; text-align: center; font-family: "Times New Roman", Times, serif; font-variant: small-caps; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; margin-bottom: 6px; } .sheet-rolltemplate-cyphDesc span { font-weight: bold; } .sheet-rolltemplate-cyphBasicRoll table { width: 100%; padding: 2px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; border: none; background-color: #FBFCFC; border-bottom: 1px solid #4E686A; } .sheet-rolltemplate-cyphBasicRoll tr:first-child , .sheet-rolltemplate-cyphRecovery tr:first-child , .sheet-rolltemplate-cyphInit tr:first-child , .sheet-rolltemplate-cyphMsg tr:first-child , .sheet-rolltemplate-cyphDesc tr:first-child { border:none; } .sheet-rolltemplate-cyphBasicRoll tr { border-left: 1px solid #4E686A; border-right: 1px solid #4E686A; } .sheet-rolltemplate-cyphBasicRoll th { background-color: #4E686A; color : #FBFCFC; line-height: 1.4em; font-size: 1.2em; text-align: center; font-family: "Times New Roman", Times, serif; font-variant: small-caps; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; margin-bottom: 6px; } .sheet-rolltemplate-cyphBasicRoll td , .sheet-rolltemplate-cyphRecovery td , .sheet-rolltemplate-cyphInit td , .sheet-rolltemplate-cyphMsg td , .sheet-rolltemplate-cyphDesc td{ padding-left: 5px; font-family: "Verdana"; font-size: 0.9em; } .sheet-rolltemplate-cyphMsg .inlinerollresult ,.sheet-rolltemplate-cyphDesc .inlinerollresult{ font-weight:normal; background-color: transparent; border: none; font-family: "Verdana"; font-size: 1em; } .sheet-rolltemplate-cyphBasicRoll .inlinerollresult , .sheet-rolltemplate-cyphRecovery .inlinerollresult , .sheet-rolltemplate-cyphInit .inlinerollresult { font-weight:normal; background-color: transparent; font-family: "Verdana"; font-size: 1em; border: 1px solid LightGray; } .sheet-rolltemplate-cyphBasicRoll hr , .sheet-rolltemplate-cyphRecovery hr , .sheet-rolltemplate-cyphInit hr ,.sheet-rolltemplate-cyphMsg hr { margin: 4px 0 4px 0; border: 0; height: 1px; background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(5,109,161,1.75), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(5,109,161,1.75), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(5,109,161,1.75), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(5,109,161,1.75), rgba(0,0,0,0)); } .sheet-rolltemplate-cyphDesc div.sheet-jetdesc{ font-family: 'Verdana', serif; font-size: 0.9em; max-height: 140px; overflow-y: auto; }