/* Set the min-width so that when the window is resized the look will stay consistant */ .charsheet { background-color: #FFFFFF; box-sizing: content-box; background-size: cover; width: 1050px; border: 5px solid #000000; } /* Universal styling applied to all elements of these types */ h2 { font-size: small; margin-bottom:5px; text-align: left; background-color: #000000; color:#FFFFFF; max-width:450px; } h3 { font-size: small; margin-bottom:5px; text-align: center; background-color: #000000; color:#FFFFFF; max-width:450px; font-weight:bold; } label { font-family: verdana; font-size: 1em ; margin-top:5px; margin-bottom: -2px; } input { font-family:verdana; display: inline; width: 100%; border:0px; border-bottom: 2px solid #000000; margin-bottom:5px; } img { max-height: 180px; } textarea { resize: vertical; border:2px solid #000000; } /* Targetted styling that only effects elements with these classes */ button.sheet-boutontalents { vertical-align:middle; } textarea.sheet-infoscomp { width:100%; height:50px; } textarea.sheet-notes { width:99%; } input.sheet-choix { width: 15px; } p.sheet-infos { font-family:verdana; color: #717172; font-weight:"bold"; } input.sheet-attributs { font-family:verdana; font-size:15px; border:0px; text-align:right; font-weight: bold; } input.sheet-choix2 { width: 12px; margin-bottom:2px; margin-top:2px; margin-right:-2px; margin-left=-2px; } input.sheet-attributs2 { font-family:verdana; display:inline; font-size:14px; border:0px; text-align:right; margin-bottom:2px; margin-top:2px; margin-right:-4px; margin-left=-10px; } input.sheet-talents { font-size: 15px; border:0px; font-weight: bold; vertical-align:middle; } input.sheet-texttalents2 { font-size: 14px; width:90%; display:inline; border:0px ; vertical-align:right; margin-bottom:2px; margin-top:2px; margin-right:0px; margin-left=0px; } input.sheet-pointsaventure { font-size: 12px; width:auto; display:inline; border:1px solid #000000; font-weight: bold; vertical-align:middle; margin-bottom:2px; margin-top:2px; margin-right:2px; margin-left=2px; } input.sheet-option4x4 { width: 15px; } input.sheet-optiontalents { width: 15px; } input.sheet-optionsorts { width: 15px; } input.sheet-affoptions { width:15px; } input.sheet-optiondecouverte { width:15px; } div.sheet-showoptions { display:none; } input.sheet-affoptions:checked ~ div.sheet-showoptions{ display:inline; } div.sheet-shownormal, input.sheet-optiondecouverte:checked ~ div.sheet-showdecouverte{ display:inline; } div.sheet-showdecouverte, input.sheet-optiondecouverte:checked ~ div.sheet-shownormal{ display:none; } div.sheet-show3x3, input.sheet-option4x4:checked ~ div.sheet-show4x4{ display:inline; } div.sheet-show4x4, input.sheet-option4x4:checked ~ div.sheet-show3x3{ display:none; } div.sheet-showmetier, input.sheet-optiontalents:checked ~ div.sheet-showtalents{ display:inline; } div.sheet-showtalents, input.sheet-optiontalents:checked ~ div.sheet-showmetier { display:none; } div.sheet-showtalents2 { display:none; } /* compatibilité avec l'ancien systeme de talents*/ input.sheet-optiontalents2 { width: 15px; } input.sheet-optiontalents2:checked ~ div.sheet-showtalents2 { display:inline; } /* ----------------------------------------------*/ div.sheet-showsorts { display:none; } input.sheet-optionsorts:checked ~ div.sheet-showsorts{ display:inline; } input.sheet-degats { font-size: 12px; width:50px; display:inline; border:1px solid #000000; font-weight: bold; vertical-align:middle; margin-bottom:2px; margin-top:2px; margin-right:2px; margin-left=2px; } input.sheet-choix2:checked ~ input.sheet-texttalents2 { text-decoration:underline; } img.sheet-logo{ height:30px; } select.sheet-dtype { vertical-align: top; width: 60px; } span.sheet-textattribut { font-size: 15px; font-weight: bold; vertical-align:middle; } p.sheet-texttitretalent { font-size: 15px; font-weight: bold; vertical-align:middle; text-align:center; } span.sheet-textattributetat { font-size: 16px; font-weight: bold; vertical-align:middle; } /* Targetted styling that only effects elements contained within the stated class */ .sheet-droite { text-align: right; } /* ROLLETEMPLATES */ /*TEST */ .sheet-rolltemplate-test div.sheet-template-container { border: 2px solid #000000 !important; border-radius: 3px 3px 3px 3px; } .sheet-rolltemplate-test .sheet-template-header { background-color: #FFFFFF; color: #000000; padding: 2px; border-bottom: 1px solid black; line-height: 1.6em; font-size: 1.2em; } .sheet-rolltemplate-test div { padding: 5px; border-bottom: 2px solid black; } .sheet-rolltemplate-test div:nth-child(odd) { background-color: #FFFFFF; } .sheet-rolltemplate-test div:nth-child(even) { background-color: #FFFFFF; } .sheet-rolltemplate-test .inlinerollresult { display: inline-block; min-width: 1.5em; text-align: center; border: 2px solid #000000; background-color:#FFFFFF; } /*.sheet-rolltemplate-test .inlinerollresult.fullcrit { border: 2px solid #000000; } .sheet-rolltemplate-test .inlinerollresult.fullfail { border: 2px solid #000000; } .sheet-rolltemplate-test .inlinerollresult.importantroll { border: 2px solid #000000; } */ /*REUSSITE*/ .sheet-rolltemplate-reussite div.sheet-template-container { border: 2px solid #000000 !important; border-radius: 3px 3px 3px 3px; } .sheet-rolltemplate-reussite .sheet-template-header { background-color: #FFFFFF; color: #000000; padding: 2px; border-bottom: 1px solid black; line-height: 1.6em; font-size: 1.2em; } .sheet-rolltemplate-reussite div { padding: 5px; border-bottom: 2px solid black; } .sheet-rolltemplate-reussite div:nth-child(odd) { background-color: #FFFFFF; } .sheet-rolltemplate-reussite div:nth-child(even) { background-color: #FFFFFF; } .sheet-rolltemplate-reussite .inlinerollresult { display: inline-block; min-width: 1.5em; text-align: center; border: 2px solid #000000; background-color:#FFFFFF; } /*.sheet-rolltemplate-reussite .inlinerollresult.fullcrit { border: 2px solid #000000; } .sheet-rolltemplate-reussite .inlinerollresult.fullfail { border: 2px solid #000000; } .sheet-rolltemplate-reussite .inlinerollresult.importantroll { border: 2px solid #000000; } */ /*ECHEC*/ .sheet-rolltemplate-echec div.sheet-template-container { border: 2px solid #000000 !important; border-radius: 3px 3px 3px 3px; } .sheet-rolltemplate-echec .sheet-template-header { background-color: #FFFFFF; color: #000000; padding: 2px; border-bottom: 1px solid black; line-height: 1.6em; font-size: 1.2em; } .sheet-rolltemplate-echec div { padding: 5px; border-bottom: 2px solid black; } .sheet-rolltemplate-echec div:nth-child(odd) { background-color: #FFFFFF; } .sheet-rolltemplate-echec div:nth-child(even) { background-color: #FFFFFF; } .sheet-rolltemplate-echec .inlinerollresult { display: inline-block; min-width: 1.5em; text-align: center; border: 2px solid #000000; background-color:#FFFFFF; } /*Menu*/ div.sheet-tab-content { display: none; font-size: 1em; } input.sheet-tab1:checked ~ div.sheet-tab1, input.sheet-tab2:checked ~ div.sheet-tab2, input.sheet-tab3:checked ~ div.sheet-tab3, input.sheet-tab4:checked ~ div.sheet-tab4 { display: block; font-size: 1em; } input.sheet-tab { width: 180px; height: 18px; position: relative; color: #5C2E05; vertical-align: middle; left: 100px; margin: -82px; cursor: pointer; z-index: 2; opacity: 0; } input.sheet-tab+span::before { content: attr(title); border: solid 1px #c8c8c8; background: #ffffff; border-color: black; text-align: center; display: inline-block; width: 180px; height: 18px; z-index: 1; } input.sheet-tab:checked+span::before { background: #000000; color:#ffffff; font-weight: bold; }