roll20-character-sheets/Spire/Spire.css

.sheet-container {
	background-color: #dce4f0;
	
}

.sheet-container div {
	padding: 2px;
	margin: 2px;
	vertical-align: top;
}

.sheet-topSection {

}

.sheet-middleSection {

}

.sheet-bottomSection {

}

.sheet-narrowCol {
	display: inline-block;
	width: 20%;
	margin: 0;
	padding: 0;

}

.sheet-wideCol {
	display: inline-block;
	width: 50%;
	margin: 0;
	padding: 0;
}

.sheet-tallBox {
	/* width: 150px; */
	/* height: 200px; */
	display: inline-block;
}

.sheet-tallBox input[type="text"], .sheet-shortBox input[type="text"] {
	width: 100%;
}

.sheet-shortBox {
	/* width: 150px; */
	/* height: 150px; */
	display: inline-block;
}

.sheet-wideBox {
	width: 60%;
	/* height: 300px; */
	display: inline-block;
}

.sheet-narrowBox {
	width: 25%;
	display: inline-block;
}

.sheet-giantBox {
	width: 100%;

	border: 1px solid indigo;
}

div.sheet-giantBox + div {

	display: inline-block;
}

div.sheet-giantBox div h2 {
	width: 175px;
}

div.sheet-giantBox div textarea {
	width: 175px;
	height: 100px;
}

div.sheet-giantBox div.repcontainer div {
	display: inline-block;
	margin: 0;
	padding: 0;
}

div.sheet-giantBox div h2 input {
	width: 175px;
	background: transparent;
	border: 0;
	box-shadow: none;
	font-size: large;
	
}

div.sheet-giantBox div h2 input:hover,
div.sheet-giantBox div h2 input:focus  {
	background-color: white;
	border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

h3 {
	width: 100%;
}

textarea {
	width: 90%;
	height: 100px;
}

button.sheet-spireButton[type="roll"] {
	height:75px;
	width:75px;	
	font-size: -webkit-xxx-large;
}

button.sheet-spireButton[type="roll"]:hover {
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}

div.sheet-inlineText {
	display: inline-block;
	width: 100px;
}

/* 
			_/_/_/    _/    _/  _/_/_/_/_/  _/_/_/_/_/    _/_/    _/      _/    _/_/_/   
		   _/    _/  _/    _/      _/          _/      _/    _/  _/_/    _/  _/          
		  _/_/_/    _/    _/      _/          _/      _/    _/  _/  _/  _/    _/_/       
		 _/    _/  _/    _/      _/          _/      _/    _/  _/    _/_/        _/      
		_/_/_/      _/_/        _/          _/        _/_/    _/      _/  _/_/_/       

 */

.repcontrol {
    min-height: 27px;
	display: block;
}

.repcontrol .btn {
    /* visibility: hidden; */ /* Doesn't work in Firefox! */
    border: medium none;
    color: transparent !important;
    background: none;
    box-shadow: none;
	float: none;
	display: inline-block;
	text-shadow: none !important;
	
	
}

.repcontrol .btn:focus {
    outline: 0;
}

.repcontrol .repcontrol_edit {
	float: none;
}

.repcontrol .repcontrol_edit:after {
    content: '(';
    visibility: visible;
    font-family: pictos;
    background-color: white;
    border: 1px solid black;
    border-radius: 2px;
    font-size: 12px;
    height: 12px;
    width: 12px;
    padding: 2px 4px 2px 4px;
    color: black;
	margin-left: -10px;
}

.editmode ~ .repcontrol .repcontrol_edit:after {
    content: ')';
}

.repcontrol .repcontrol_add:before {
    content: '&';
    visibility: visible;
    font-family: pictos;
    background-color: #fff;
    border: 1px solid black;
    border-radius: 2px;
    font-size: 12px;
    height: 12px;
    width: 12px;
    padding: 2px 4px 2px 4px;
    color: black;
}

.repcontrol .repcontrol_edit:hover:after,
.repcontrol .repcontrol_add:hover:before
{
    background-color: #EFEFEF;
}

.sheet-resources .repcontrol {
    margin-top: -10px;
}

.itemcontrol {
    z-index: 10;
}

.itemcontrol .repcontrol_del {
    font-size: 10px;
    margin-top: 3px;
    padding: 0px;
    height: 18px;
    width: 18px;
}

.itemcontrol .repcontrol_move {
    font-size: 10px;
    margin-top: 3px;
    padding: 0px;
    height: 18px;
    width: 18px;
}