.sheet-item_col_1_B:nth-child(3n+1) { order: 1; } .sheet-item_col_2_B:nth-child(3n+2) { order: 2; } /* Force new columns */ .sheet-logo::before, .sheet-logo::after { content: ""; flex-basis: 100%; width: 0; order: 1; } .sheet-top { display: flex; flex-flow: column wrap; align-content: space-between; height: 190px; border-bottom: 1px solid #000; padding: 20px; width: 700px; } .sheet-logo { display: flex; flex-flow: column wrap; align-content: space-between; border-bottom: 1px solid #000; height: 80px; padding: 10px; width: 700px; } .sheet-item_col_1_A { width: 400px; position: relative; margin-bottom: 2%; color: #000; padding: 5px; } .sheet-item_col_1_B { width: 400px; position: relative; margin-bottom: 2%; color: #000; padding: 5px; } .sheet-T_A { font-size: 10px; } .sheet-item_col_1 { width: 60%; position: relative; margin-bottom: 2%; padding: 5px; } .sheet-item_col_2 { width: 32%; position: relative; margin-bottom: 2%; color: #000; padding: 15px; } .sheet-item_col_2_A { width: 300px; position: relative; margin-bottom: 2%; color: #000; padding: 15px; } .sheet-item_col_2_B { width: 200px; position: relative; margin-bottom: 2%; color: #000; } .sheet-id-tb { width: 98%; height: 150px; text-align: left; border: dashed 1px #000; outline: none; } .sheet-specialAbilities { width: 98%; height: 100%; text-align: left; border: 1px; border-style: dashed; margin-right: 10px; overflow: none; } .sheet-nodec { list-style: none; list-style-type: none; } .sheet-ix { width: 150px; text-align: center; border: 0px; border-bottom: 1px dashed; } textarea, select, input, button { outline: none; } .sheet-itemCente#edc0c0 { text-align: center; } .sheet-label_A { font-size: 12px; width: 75px; display: inline-block; text-align: right; margin-right: 5px; } ​.sheet-itemCente#edc0c0 { text-align: center; } .sheet-container { display: flex; flex-flow: column wrap; align-content: space-between; /* Your container needs a fixed height, and it* needs to be taller than your tallest column. */ height: 665px; /* Optional */ padding: 20px; width: 700px; } .sheet-item { width: 32%; /* Optional */ position: relative; margin-bottom: 2%; color: #000; padding: 15px; box-sizing: border-box; } /* Re-order items into 3 rows */ .sheet-item:nth-child(3n+1) { order: 1; } .sheet-item:nth-child(3n+2) { order: 2; } .sheet-item:nth-child(3n) { order: 3; } /* Force new columns */ .sheet-container::before, .sheet-container::after { content: ""; flex-basis: 100%; width: 0; order: 2; } .attr_in { width: 75px; text-align: center; display: block; margin: 10 auto; font-size: 18px; border: 0px; border-bottom: 1px dashed; } .sheet-gen { border: 0; background: none; box-shadow: none; border-radius: 0px; font-size: 14px; font-size: 14px !important; } .sheet-gen_a { border: 0; background: none; box-shadow: none; border-radius: 0px; font-size: 16px; margin-bottom: 2px; } .sheet-genButton { text-align: center; background-color: #eff0f0; margin-bottom: 15px; line-height: 10px; margin: 0; overflow: visible; text-transform: none; border-style: none; padding: 0; background: transparent; cursor: pointer; color: #000; font-size: 20px !important; font-weight: bold; } .sheet-genButton:before { color: white; font-weight: normal; border: 1px solid lightgrey; height: 20px; width: 20px; //font-size: 42px; background-color: lightgrey; border-radius: 50%; padding: 5px; } .sheet-genButtonM { text-align: center; background-color: #eff0f0; margin-bottom: 15px; line-height: 10px; margin: 0; overflow: visible; text-transform: none; border-style: none; padding: 0; background: transparent; cursor: pointer; color: #000; font-size: 20px !important; font-weight: bold; } .sheet-genButtonM:before { display: none; } .sheet-d { line-height: 20px; vertical-align: center; color: white; font-weight: normal; border: 1px solid #edc0c0; height: 20px; width: 20px; //font-size: 42px; background-color: #edc0c0; border-radius: 50%; padding: 5px; } .sheet-a { line-height: 20px; vertical-align: center; color: white; font-weight: normal; border: 1px solid #daedc0; height: 20px; width: 20px; //font-size: 42px; background-color: #daedc0; border-radius: 50%; padding: 5px; } .sheet-d20 { font-family: "dicefontd20"; color: white; font-weight: normal; border: 1px solid #ddd; font-size: 18px; background-color: #daedc0; border-radius: 50%; padding: 5px; margin-left: 10px; } .sheet-radio-toolbar { display: inline-block; text-align: center; align-content: center; background-color: #fff !important; vertical-align: center; height: 21px; } .sheet-rolltemplate-saveCheck, .sheet-rolltemplate-saveCheck-disadvantage, .sheet-rolltemplate-saveCheck-advantage { padding: 2px; line-height: 1.6em; font-size: 16px; width: 100% } .sheet-rolltemplate-saveCheck div.sheet-template-container, .sheet-rolltemplate-saveCheck-advantage div.sheet-template-container, .sheet-rolltemplate-saveCheck-disadvantage div.sheet-template-container, div.sheet-template-container { background-color: white !important; color: black; padding: 5px; } .sheet-rolltemplate-saveCheck, .inlinerollresult, .sheet-rolltemplate-saveCheck-advantage, .sheet-rolltemplate-saveCheck-disadvantage { display: inline-block; min-width: 1.5em; text-align: center; } .sheet-rolltemplate-saveCheck-disadvantage .inlinerollresult.fullcrit, .sheet-rolltemplate-saveCheck-advantage .inlinerollresult.fullcrit, .sheet-rolltemplate-saveCheck .inlinerollresult.fullcrit { border: 0px solid #3FB315 !important; } .sheet-rolltemplate-saveCheck-advantage .inlinerollresult.fullfail, .sheet-rolltemplate-saveCheck-disadvantage .inlinerollresult.fullfail, .sheet-rolltemplate-saveCheck .inlinerollresult.fullfail { border: 0px solid #B31515 !important; } .sheet-rolltemplate-saveCheck .inlinerollresult.importantroll, .sheet-rolltemplate-saveCheck-advantage .inlinerollresult.importantroll, .sheet-rolltemplate-saveCheck-disadvantage .inlinerollresult.importantroll { border: 0px solid #4A57ED; } .sheet-rolltemplate-attributes .sheet-template-header, .sheet-rolltemplate-resources .sheet-template-header { text-align: center; }