/* COULEURS #69392E : marron #CD4509 : orange/rouge #EDD3BA : beige #C0C0C0 : gris #F7F7F7 : gris clair #AAC6D4 : bleu moyen */ /* ===== GENERAL ===== */ div, button, textarea, span, input, select{ box-sizing: border-box; } .sheet-italic{ font-style: italic; } .sheet-bold{ font-weight: bold; } /* ===== DIVS ===== */ div{ background-color: transparent; } div.sheet-main{ position: relative; width: 842px; min-height: 1077px; text-align:center; font-family: 'Arial'; /* background-color: white; */ background-image: url('https://raw.githubusercontent.com/NathaTerrien/roll20-wip/master/Wurm/wurm_fond_fdp_nb.jpg'); background-repeat: no-repeat; background-size: cover; margin: 0px 0px 0px 0px; } div.sheet-ligne{ margin: 1px 0px 1px 0px; display: block; text-align: center; width: 100%; /* border: 1px solid green; */ } div.sheet-mycolborder{ border-width: 1px; border-style: solid; border-color: #69392E; } div.sheet-mycol1{ margin: 0px 0px 0px 0px; display: inline-block; vertical-align: top; text-align: center; width: 276px; /* border: 1px solid red; */ } div.sheet-mycol2{ margin: 0px 0px 0px 0px; display: inline-block; vertical-align: top; text-align: center; width: 560px; /* border: 1px solid blue; */ } div.sheet-blacklib{ margin: 0px 0px 0px 0px; background-color: #69392E; color: white; font-size: 14px; font-weight: bold; text-align: center; padding-top: 3px; padding-bottom: 4px; } div.sheet-graylib{ margin: 0px 0px 0px 0px; background-color: #EDD3BA; color: black; font-size: 12px; text-align: center; padding-top: 3px; padding-bottom: 4px; } div.sheet-libsmall{ margin: 0px 0px 0px 0px; display: inline-block; font-style: italic; font-size: 12px; font-weight: bold; } div.sheet-lib1{ margin: 0px 0px 0px 0px; display: inline-block; width: 85px; text-align: left; } div.sheet-deschide{ margin: 0px 0px 0px 0px; display: none; } /* ===== DIV FOR BUTTONS ===== */ div.sheet-butd6{ font-size: 12px; color: white; font-weight: bold; /* text-shadow: 0px 0px 8px #69392E; */ text-shadow: 0px 0px 8px black; display: inline-block; background-size: 100% 100%; background-repeat: no-repeat; vertical-align: middle; width: 40px; height: 40px; } div.sheet-butd6-2{ background-image: url("https://raw.githubusercontent.com/NathaTerrien/roll20-wip/master/Wurm/wurm_de_2.png"); } div.sheet-butd6-3{ background-image: url("https://raw.githubusercontent.com/NathaTerrien/roll20-wip/master/Wurm/wurm_de_3.png"); } div.sheet-butd6-4{ background-image: url("https://raw.githubusercontent.com/NathaTerrien/roll20-wip/master/Wurm/wurm_de_4.png"); } div.sheet-butd6-5{ background-image: url("https://raw.githubusercontent.com/NathaTerrien/roll20-wip/master/Wurm/wurm_de_5.png"); } /* ===== INPUT ===== */ input, textarea,select{ background-color: rgba(255,255,255,0.3); display: inline-block; padding: 0; margin: 0; font-family: cursive; font-size: 12px; border: none; box-shadow: none; color: #69392E; border-radius: 0; } input[type="text"]{ height: 21px; padding-left: 2px; } input[type="number"]{ height: 21px; text-align: right; padding-right: 2px; } input:focus, input:hover, textarea:focus, textarea:hover, select:focus, select:hover{ box-shadow: inset 0px 1px 1px rgba(170,198,212,0.1),0 0 6px rgba(170,198,212,0.9); background-color: rgba(170,198,212,0.2); } input[type="text"].sheet-inpundl{ width: 250px; } input[type="number"].sheet-inpundl{ border-bottom: 1px solid #69392E; width: 60px; } input.sheet-inpuncen{ text-align: center; font-weight: bold; width: 274px; } input.sheet-inpuncensm{ text-align: center; width: 120px; } input[type="checkbox"].sheet-deschide{ width: 20px; height: 20px; max-width: 20px; opacity: 0; z-index: 2; margin: 0; } input[type="checkbox"].sheet-deschide + span{ display: inline-block; text-align: center; padding: 0; margin: 0; margin-left: -20px; width: 20px; max-width: 20px; height: 20px; z-index: 1; font-family: 'pictos'; font-size: 18px; color: rgba(105,57,46,0.7); line-height: 20px; border: 1px solid transparent; } input[type="checkbox"].sheet-deschide:checked + span{ color: #69392E; } input[type="checkbox"].sheet-deschide:hover + span{ color: #69392E; border-color: #69392E; box-shadow: 1px 1px 4px 2px rgba(105,57,46,0.8); } input[type="text"].sheet-inptfeat{ font-weight: bold; width: 210px; } input[type="checkbox"].sheet-deschide:checked ~ div.sheet-deschide{ display: inline-block; width: 100%; border-bottom : 1px dashed #69392E; } /* ===== SELECT ===== */ select{ line-height: 20px; height: 20px; } /* ===== TEXTAREA ===== */ textarea{ resize:none; overflow-y: auto; overflow-x: hidden; height: 40px; padding-left: 2px; padding-right: 2px; } textarea.sheet-areadesc{ height: 120px; } /* ===== BUTTONS ===== */ button[type="roll"] { display: inline-block; box-sizing: border-box; text-align: center !important; vertical-align: middle !important; padding: 0 0 !important; color: black; border-width: 1px; border-style: solid; border-color: transparent; background:transparent; box-shadow: none; text-shadow: none; -webkit-box-shadow: none; } button[type="roll"]:hover{ color: #69392E; border-color: #69392E; box-shadow: 1px 1px 4px 2px rgba(105,57,46,0.8); } button[type="roll"].sheet-butshow:before{ font-family: 'pictos'; font-size: 22px; content: 'E'; color: rgba(105,57,46,0.7); } button[type="roll"].sheet-butshow:hover:before{ color: #69392E; } button[type="roll"].sheet-butd6{ margin: 0 8px !important; color: rgba(105,57,46,0.7); } button[type="roll"].sheet-butd6:before{ content: ''; } button[type="roll"].sheet-butd6small:before{ font-family: "dicefontd6"; content: 'F'; font-size: 22px; color: rgba(105,57,46,0.7); } button[type="roll"].sheet-butd6small:hover:before{ color: #69392E; } /* fieldset button */ div.repcontrol{ display: inline-block; width: 100%; } .repcontrol_move{ height: 11px; line-height: 11px; margin-top: 4px; } .repcontrol_del { height: 22px; line-height: 12px; margin-top: 4px; width: 30px; } .repcontrol_add, .repcontrol_edit { color: transparent; box-shadow: none; background: transparent; border-color: transparent; text-shadow:none; width: 100px; } .repcontrol_add:focus, .repcontrol_edit:focus { outline: none; } .repcontrol .repcontrol_edit:after { content: 'y'; visibility: visible; font-family: pictos; border: 1px solid transparent; border-radius: 2px; font-size: 20px; height: 20px; width: 20px; padding: 2px 4px 2px 4px; color: rgba(105,57,46,0.7); } .editmode ~ .repcontrol .repcontrol_edit:after { content: '2'; } .repcontrol .repcontrol_add:before { content: '+'; visibility: visible; font-family: pictos; border: 1px solid transparent; border-radius: 2px; font-size: 20px; height: 20px; width: 20px; padding: 2px 4px 2px 4px; color: rgba(105,57,46,0.7); } .repcontrol .repcontrol_edit:hover:after, .repcontrol .repcontrol_add:hover:before { box-shadow: 1px 1px 4px 2px rgba(105,57,46,0.8); border-color: #69392E; color: #69392E; } .repcontrol_add:focus:before, .repcontrol_edit:focus:after { color: #69392E; } /* ===== TEMPLATE ===== */ .sheet-rolltemplate-wurm div{ text-align: center; vertical-align: middle; padding: 0px 0px 0px 0px; border: none; display: block; box-sizing: border-box; background-color: transparent; font-size: 13px; } .sheet-rolltemplate-wurm div.sheet-main{ background-color: #EDD3BA; border: 1px solid #69392E; width: 200px; } .sheet-rolltemplate-wurm div.sheet-char{ background-color: #69392E; color: white; text-transform: uppercase; padding: 2px 2px 2px 2px; } .sheet-rolltemplate-wurm div.sheet-name{ background-color: #EDD3BA; color: #69392E; font-weight: bold; padding: 2px 2px 2px 2px; border-top: 1px dashed #69392E; border-bottom: 1px dashed #69392E; } .sheet-rolltemplate-wurm div.sheet-type{ font-style: italic; color: #69392E; background-color: #AAC6D4; padding: 2px 2px 2px 2px; } .sheet-rolltemplate-wurm div.sheet-roll{ padding: 2px 2px 2px 2px; background-color: #E6E6E6; } .sheet-rolltemplate-wurm div.sheet-desc{ max-height: 150px; overflow-y: auto; background-color: #E6E6E6; text-align: left; padding: 2px 2px 2px 2px; font-size: 12px; font-family: cursive; } .sheet-rolltemplate-wurm .inlinerollresult { background-color: transparent; border: none; padding: 0px 0px; font-weight: bold; cursor: help; font-size: 20px; font-family: 'Candal'; } .sheet-rolltemplate-wurm .inlinerollresult.fullcrit{ border: none; color: #3F9315; } .sheet-rolltemplate-wurm .inlinerollresult.importantroll{ border: none; color: #4A57ED; } .sheet-rolltemplate-wurm .inlinerollresult.fullfail{ border: none; color: #7E0000; }