.sheet-container {
    /* background-image: url("http://i.imgur.com/nowLIVk.jpg"); */

    border-radius: 8px;
    border: 3px solid Black;
}

.sheet-MechaContainer {

	background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/d/d4/New_York_City_at_night_HDR_edit1.jpg/800px-New_York_City_at_night_HDR_edit1.jpg");
	background-size: cover;
	background-position: 50% 80%;
	background-repeat: no-repeat;	
    border-radius: 8px;
    border: 3px solid Black;
}

.sheet-centerRow {
    text-align:center;
    vertical-align:middle;
}

.sheet-textField {
    margin-left:auto;
    margin-right:0%;
    width:175px;
    height:100px;
}

.sheet-mechaWeaponName {
	width: 60%;
	
}


.sheet-textAreaBig {
    margin-Left:auto;
    margin-right:auto;
    width:90%;
    height:80px;
}

.sheet-textAreaHuge {
    margin-Left:auto;
    margin-right:auto;
    padding:2px;
    width:100%;
    height:120px;
}

.sheet-narrowTextField {
    margin-left:auto;
    margin-right:0%;
    width:100px;
    height:100px;
}



.sheet-narrowMechaField {
	width:100px;
	height:2em;
}

.sheet-mechaTextField {
    margin-left:auto;
    margin-right:0%;
    width: 95%;
    /* height:100px; */
}

.sheet-mechaNarrowTextField {
    margin-left:auto;
    margin-right:0%;
    width:150px;
    /* height:100px; */	
	
}

.sheet-shiftListBox {
    display:inline-block;
    /*width:15%;*/
    border: 3px solid DarkGreen;
    border-radius: 8px;
    vertical-align:top;
    margin:auto;
    padding:2px;
    background-color: white;
    text-align:left;
}

.sheet-helpIcon {
	display:inline-block;
	border: 3px solid;
	boder-radius: 8px;
	padding:2px;
}

.sheet-extraNarrow {
    width:20%;
}

.sheet-mediumWidth {
    width:40%;
}

.sheet-block {
	display:inline-block;
}

.sheet-fullWidth {
    width:90%;
}

.sheet-purpleBackground {
    display:inline-block;
    overflow:hidden;
    /* width:auto; */
    background-color: #0c0b13; /* tried DarkMagenta DarkSlateBlue */
    border: 5px solid Black;
    border-radius: 8px;
    margin:2px;
    padding:2px;
    text-align:center;
    vertical-align:middle;
}

.sheet-translucentBackground {
    /* display:inline-block; */
    /* overflow:hidden; */
    /* width:auto; */
	background-color: rgba(152,175,199,0.5);
    border: 5px solid Black;
    border-radius: 8px;
    margin:2px;
    padding:2px;
    text-align:center;
    /* vertical-align:middle; */
}




.sheet-popupHelp span {
    display:none;
    z-index:10;
    padding:14px 20px;
    left:33%;


    /* margin-top:-30px; margin-left:28px;*/
    width:300px; line-height:16px;
}

/*
.sheet-popupHelp span.sheet-popupLeft {
    display:none;
    z-index:10;
    left: 40%;
    width:300px; line-height:16px;
}
*/

.sheet-popupHelp:hover span {
    display:inline;
    position:absolute;
    color:#111;
    border:1px solid #DCA;
    background:#fffAF0;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-size: 1em;
    border-radius:4px;
    box-shadow: 5px 5px 8px #CCC;
}


.sheet-mechaPopupHelp span {
    display:none;
	position:relative;
    z-index:50;
    padding:14px 20px;
    /*left:100%;*/
	margin-top:20px;
	/*margin-left:28px;*/
    width:300px; line-height:16px;
}




.sheet-mechaPopupHelp:hover span {
    display:inline;
    position:fixed;
	overflow:visible;
    color:#111;
    border:1px solid #DCA;
    background:#fffAF0;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-size: 1em;
    border-radius:4px;
    box-shadow: 5px 5px 8px #CCC;
	margin:auto;
	width:60%;
	
}

.sheet-mechaLeftPanel .sheet-mechaPopupHelp:hover span {
	
	left:100%;
	/* right: 0; */
    transform: rotateZ(-5deg) rotateY(-15deg) rotateX(45deg) translateX(-25px) translateZ(113px);
	z-index: 30;

}
.sheet-mechaMiddlePanel .sheet-mechaPopupHelp:hover span {


	
    left: 12%;
    bottom: 55%;
	/* right: 0; */
    /* transform: translateZ(113px); */
	z-index: 30;

}

.sheet-mechaRightPanel .sheet-mechaPopupHelp:hover span {
	
	
	left: -80%;
    transform: rotateZ(5deg) rotateY(15deg) rotateX(45deg) translateX(25px) translateZ(113px);
	z-index: 30;
}


.sheet-mechaPopupHelp p {
    text-align:left;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-size: 1em;
}

.sheet-mechaPopupHelp {
   /* background:AntiqueWhite; */
	border-radius:25px;
	background: rgba(0, 133, 133, 0.5);
	color: aqua;
	text-align:center;
	border: 3px solid;
	padding-left:4px;
	padding-right:4px;
   
}

.sheet-mechaPopupCenterDisplay {

	/* 
		width:60%;
		top: 20px;
		left: 0px; 
		transform: translate(-50%, 0%);
	*/
	
}


div.sheet-tab-content { display: none; }

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;
}

input.sheet-tab
{
    width: 150px;
    height: 20px;
    position: relative;
    top: 5px;
    left: 6px;
    margin: -1.5px;
    cursor: pointer;
    z-index: 1;
}

input.sheet-tab::before
{
    content: attr(title);


    border: solid 1px #a8a8a8;
    border-bottom-color: black;
    text-align: center;
    display: inline-block;
    
    background: #fff;
    background: -moz-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
    background: -webkit-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
    background: -ms-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
    background: -o-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
    background: linear-gradient(to top, #c8c8c8, #fff, #c8c8c8);
    
    width: 150px;
    height: 20px;
    font-size: 18px;
}

input.sheet-tab:checked::before
{
    background: white;

    border-bottom-color: #fff;
}

input.sheet-tab:not(:first-child)::before
{
    border-left: none;
}

/* input.sheet-tab2::before
{
    background: aquamarine;

}

input.sheet-tab2:checked::before
{
    background: aqua;

    border-bottom-color: #blue;
}
*/

div.sheet-tab-content
{
    border: 1px solid #a8a8a8;
    border-top-color: #000;
    margin: 2px 0 0 5px;
    padding: 5px;
}

div.sheet-tab2
{
    background-color: azure;
}

div.sheet-tab3
{
	background-color: black;
}

div.sheet-mechaColumns
{
	height:100%;
	width:100%;
	vertical-align:bottom;
	/*
	transform: translateY(-100px);
	*/
	
	z-index:-15;
}


div.sheet-perspectiveParent
{
    /* display:inline-block; */
	-webkit-perspective: 1000px; /* Chrome, Safari, Opera */
    perspective: 1000px;
	/*height:100%;*/
	/* width:27%; */
	padding:0;
	margin:0;
	/*vertical-align:bottom;*/
	text-align:center;
	z-index:10;
}

div.sheet-floatLeft
{
   /* display: inline; */
   position:absolute;
   top:101px;
   left:39px;
   z-index:1;
   width:27%;
}

div.sheet-floatRight
{
	/*display: inline;*/
    position: absolute;
    top: 101px;
    right: 54px;
    z-index: 1;
	width:27%;
}

div.sheet-floatMiddle
{
	text-align: center;
	margin:auto;
	width:33%;
	
}

div.sheet-bottomAligned
{
	vertical-align:bottom;	
}



.sheet-mechaListBox {
    display:block;
    /*width:15%;*/
    border: 1px solid aqua;
    border-radius: 8px;
    vertical-align:top;
    margin:auto;
    padding:2px;
    /* background-color: white; */
    text-align:center;
	color:aqua;
	
}

.sheet-mechaListBox h3 
{
	background: rgba(0, 133, 133, 0.5);
	color: aqua;
	text-align:center;
}

.sheet-mechaListBox table
{
	width:100%;
	text-align: left;
}

.sheet-mechaListBox select
{
	width:55px;
	margin:0;
	padding:0;
}

div.sheet-mechaTopPanel {
    text-align:center;
    vertical-align:middle;
}

div.sheet-mechaLeftPanel
{
    position: relative;
    bottom: 0;
    left: 0;
    /* margin-right:-1000px; */
	display:inline-block;
	/* float:left; */
	width:100%;
	height:710px;
    -webkit-transform: rotate3d(-1, 0.5, 0, 45deg); /* Safari */
    transform: rotateX(-45deg) rotateY(15deg) rotateZ(5deg) translate3d(0,-10px,0px);
	transform-style: preserve-3d;
}



div.sheet-mechaMiddlePanel
{
	color:aqua;
	border: 0px;
	display:inline-block;
	width:80%;
	height:250px;
	vertical-align:bottom;
	position:relative;
	bottom:-125px;
	padding-top: 20px;
	background-color: rgba(0, 133, 133, 0.5);
	border-radius: 9px;	

}

.sheet-mechaCondition
{
	padding:5px;
	margin:0;
	
}

table.sheet-mechaDamageAndOverdrive
{
	/*position:relative;
	bottom:-150px;*/

	
}

div.sheet-mechaRightPanel
{
    position: relative;
    bottom: 0;
    right: 0;
	
	display:inline-block;
	/* float:right; */
	/* margin-left:-1000px; */
	width:100%;
	height:710px;
    -webkit-transform: rotate3d(-1, -0.42, 0, 45deg); /* Safari */
    transform: rotateX(-45deg) rotateY(-15deg) rotateZ(-5deg) translate3d(0,-10px,0px);
	transform-style: preserve-3d;
}

div.sheet-mechaButtonPanel
{
	width:100%;
    display: inline-block;
    color: chartreuse;
	background-color:black;
	
	-webkit-transform: rotateX(45deg);
    transform: rotateX(45deg) translate3d(0, 20px, 0px);
	
}

.sheet-mechaBottomRow
{
	width:100%;
	background-color:black;
	text-align:center;
	margin:auto;
	opacity:0.99;
	position:relative;
	z-index:15;
	
	
}


.sheet-mechaButtonPanel table
{
	width:100%;
	height:auto;
}

.sheet-mechaButtonPanel td
{
	padding:0;
	margin:0;
	width:50%;
	height:auto;
}

.sheet-mechaHUD-initiativeButton
{
    background-image: url("http://i.imgur.com/DMko44b.jpg");  
}

.sheet-mechaHUD-initiativeButton:hover
{
	transform:translateY(0);
}

.sheet-mechaButtonPanel button[type="roll"]
{
	background-size: cover;
	height:128px;
	width:128px;
	background-origin:border-box;
	

    border-radius: 8px;
    border: 3px solid Black;
	z-index: 15;	
}

button[type="roll"].sheet-plainButton, button[type="roll"].sheet-plainButton:hover, button[type="roll"].sheet-plainButton:active 
{
	/* reconfigure the default roll20 button look and feel */
	
}

button[type="roll"].sheet-plainButton::before
{
    content: ""; /* remove the inherited d20 icon on the button */
}


.sheet-mechaHUD-movementButton
{
    background-image: url("http://i.imgur.com/fLe1zip.jpg");  
}

.sheet-mechaHUD-attackButton
{
    background-image: url("http://i.imgur.com/cyTEwuB.jpg");  
}

.sheet-mechaHUD-defenseButton
{
    background-image: url("http://i.imgur.com/gt5QUMq.jpg");  
}

.sheet-mechaStatNumberInputs
{
	width: 2em;
	color: chartreuse;
	background-color: black;
	border-radius: 4px;
	border-color: aqua;
}

/* 
	-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
				Roll Template Styles
	-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
*/

rolltemplate {
	color: DarkCyan;
	background-color: black;
	font-family: "Helvetica Neue", Helvetica, sans-serif;		
}

rolltemplate table {
    width: 100%;
	border: 1px solid;
	border-color: Aqua;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;	
}

.sheet-rolltemplate-MechaRoll .inlinerollresult  {
	display: inline-block;
	min-width: 1.5em;
	text-align: center;
	border: 2px solid rgba(167, 168, 170,1); /*Cool Gray 6 C*/
	background-color: black;
	border-radius:9px;
}

.sheet-rolltemplate-MechaMovement .inlinerollresult {
	display: inline-block;
	min-width: 1.5em;
	text-align: center;
	border: 2px solid rgba(167, 168, 170,1); /*Cool Gray 6 C*/
	background-color: black;
	border-radius:9px;
}


	

.sheet-rolltemplate-MechaRoll table {
    width: 100%;
	border: 1px solid;
	boder-color: Aqua;
	color: DarkCyan;
	font-family: "Helvetica Neue", Helvetica, sans-serif;
	background-image: url("https://lh6.ggpht.com/nP4jkVRsIZYE-sYA-q-FXil-VW55BjMFWlVbNLmKDFu9af8dtz9GBh3xPvsLy0kf-w=w300");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	
}

.sheet-rolltemplate-MechaMovement table {
    width: 100%;
	border: 1px solid;
	boder-color: Aqua;
	color: Azure;
	font-family: "Helvetica Neue", Helvetica, sans-serif;
	background-image: url("http://i.imgur.com/z5QyAD9.jpg");
	background-size: 100% 100%;
	background-position: center center;
	background-repeat: no-repeat;	
	background-color: rgba(0,0,0, 0.8);
	
}

.sheet-rolltemplate-MechaMovement th {
	font-size: 1.2em;
	color: White;
	
}

.sheet-rolltemplate-MechaMovement td {
	background-color: rgba(0, 0, 0,0.8);
}

.sheet-rolltemplate-MechaMovement .sheet-fineprint {
	font-size: 0.8em;
	color: DimGray;	
}

.sheet-rolltemplate-MechaMovement .sheet-exciting {
	font-size: 0.8em;
	color: Chartreuse;
}


.sheet-rolltemplate-MechaRoll th {
	background-color: rgba(0, 0, 0, 0.5);
	color: DarkCyan;
	padding: 2px;
	border-bottom: 0px solid black;
	line-height: 1.6em;
	font-size: 1.2em;
}

.sheet-rolltemplate-MechaRoll .sheet-tcat {
	font-weight: bold;
	color: DarkCyan;
}

.sheet-rolltemplate-MechaRoll .sheet-fineprint {
	font-size: 0.8em;
	color: DimGray;
}

.sheet-rolltemplate-MechaRoll .sheet-exciting {
	font-size: 0.8em;
	color: Chartreuse;
}



.sheet-rolltemplate-MechaRoll td {
	padding: 5px;
	border-bottom: 0px solid black;
	text-align: center;
}

.sheet-rolltemplate-MechaRoll tr:nth-child(odd) {
	background-color: rgba(0, 0, 0,0.2);
}

.sheet-rolltemplate-MechaRoll tr:nth-child(even) {
	background-color: rgba(0, 0, 0,0.4);
}


.sheet-rolltemplate-MechaRoll .sheet-speedlines {
	display:inline-block;
	margin-left: auto;
	margin-right: auto;
    padding: 5px;
	margin: 5px;
	border: 2px solid;
	boder-color: Aqua;
	border-radius:9px;
	height: 30px;
	width: 80%;
	font-size: 1.5em;
	color: White;
	text-align:center;
	vertical-align: middle;
	background-image: url("http://i.imgur.com/z5QyAD9.jpg");
	background-size: cover;
	background-position: center center;	
}

.sheet-rolltemplate-MechaMovement .sheet-speedlines {
	display:inline-block;
	margin-left: auto;
	margin-right: auto;
    padding: 5px;
	margin: 5px;
	border: 2px solid;
	boder-color: Aqua;
	border-radius:9px;
	height: 30px;
	width: 80%;
	font-size: 1.5em;
	color: White;
	text-align:center;
	vertical-align: middle;
	background-image: url("http://i.imgur.com/z5QyAD9.jpg");
	background-size: cover;
	background-position: center center;	
}