css.css

body{margin:0;font-family:'Open Sans','Helvetica',sans-serif;overflow-y:scroll;font-size:13px;}
h1{margin:0;font-size:18px;}
a{font-weight:bold;text-decoration:none}
a,a:visited,a:hover,a:active{color:#00AFF1;font-weight:normal}
a:hover{text-decoration:underline}
button{padding:0.3em;height:2.3em}
h1,h2,h3{padding:0.6em;color:#00aff1;font-weight:normal}
h4{font-weight:normal;margin:1.2em;font-size:15px;color:#58595b}
legend{color:#58595b;font-size:16px}
table{border-collapse:collapse;}
.inline{display:inline-block;vertical-align:top}
.flex{
	display:flex;
	flex-wrap:wrap;
}
.tbd {background:red;padding:0.5em;text-align:center}
#fixedTopBar{z-index:9}
#sidebar{z-index:99}

/*default cells*/
th,td{border:1px solid #aaa;padding:0.35em;}
th{font-weight:normal;background:#2b6488;color:white;vertical-align:middle}
hr{display:block;height:1px;border:0;margin:0;padding:0;}

/*highlight inputs when mouse goes over a row that has a formula*/
tr[hl=yes]{background:yellow;color:black}
tr[hl=no]{background:default}
tr[hl_output=yes]{background:orange;color:black}
tr[hl_output=no]{background:default}
tr[hl], tr[hl_output]{
	transition:background 0.8s,color 0.8s;
}
span.estimated{color:red;font-size:16px;cursor:help}

/*ECAM blue*/.blue{background:#00AFF1;}
/*ECAM red*/.red{background:#D71D24;}

/*circles for benchmarking*/
span.circle {
	border:1px solid #eee;
	border-radius:5em;
	display:inline-block;
	width:14px;
	height:14px;
}

/*BUTTONS*/
	.button {        
		display: inline-block;
		white-space: nowrap;
		background-color: #ddd;
		background-image: linear-gradient(top, #eee, #ccc);
		border: 1px solid #777;
		padding: 0 1.5em;
		margin: 0.5em;
		font: bold 1em/2em Arial, Helvetica;
		text-decoration: none;
		color: #333;
		border-radius: .2em;
	}

	.button:hover {
		background-color: #eee;        
		background-image: linear-gradient(top, #fafafa, #ddd);
	}

	.button:active {
		box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
		top: 1px;
	}

	.button:focus {
		outline: 0;
		background: #fafafa;
	}    

	.button:before {
		background: #ccc;
		background: rgba(0,0,0,.1);
		float: left;        
		width: 1em;
		text-align: center;
		font-size: 1.5em;
		margin: 0 1em 0 -1em;
		padding: 0 .2em;
		box-shadow: 1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5);
		pointer-events: none;		
	}

	/* Buttons and inputs */
	button.button { 
		cursor: pointer;
		overflow: visible; /* removes extra side spacing in IE */
	}

	/* The disabled styles */
	.button[disabled], .button[disabled]:hover, .button.disabled, .button.disabled:hover {
		background: #eee;
		color: #aaa;
		border-color: #aaa;
		cursor: default;
		text-shadow: none;
		position: static;
		box-shadow: none;		
	}

	/* Hexadecimal entities for the icons */
	.add:before {
		content: "\271A";
	}

	.edit:before {
		content: "\270E";        
	}

	.delete:before {
		content: "\2718";        
	}

	.save:before {
		content: "\2714";        
	}

	.next:before {
		content: "\279C";
	}

	.prev:before {
		content: "\279C";
		transform: rotate(180deg);
		border-radius:0;
		box-shadow: -1px 0 0 0 rgba(0,0,0,.5);
	}
/*end buttons*/

/*cards*/
	.card {
		background:white;
		border-radius:0em;
		border:1px solid #ccc;
		opacity:0.98;
		overflow:auto;
		border:1px solid #ccc;
		box-shadow: 0 1px 2px rgba(0,0,0,.1);
		margin:6px 1px 2px 4px;
	}
	.card.folded{
		max-height:3.0em;
		overflow:hidden;
		font-size:10px;
	}
	.card.folded > *:nth-child(n+2) {opacity:0;}
	.card .menu {
		text-align:left;
		opacity:1;
		background:#f5f5f5;
		cursor:pointer;
		font-size:11px;
	}

	.card.folded .menu{color:#777;}

	.card .menu button {
		margin-left:-1px;
		margin-top:-1px;
		border-radius:0;
		width:20px;
		display:inline-block;
	}
	.card        .menu button:before {content:"-"}
	.card.folded .menu button:before {content:"+"}
	.card .menu button.btn_toggle:before {content:""}
	.card .menu button.btn_toggle {
		display:inline;
		width:initial;
		float:right;
		padding:0.5em;
		padding-left:5em;
		padding-right:5em;
		border:1px solid #ccc;
		background:none;
		outline:none;
	}
	.card .menu button.btn_toggle:hover {background:#bce4d3}
	.card .menu button.btn_toggle.active { 
		background:#bce4d3;
		box-shadow:inset 0 2px 4px rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.05);
	}
/*end cards*/

/*tab buttons*/
	div.tab_buttons               { text-align:center;font-size:19px;padding:0.5em 0;display:flex;justify-content:center}
	div.tab_buttons button        { display:block;padding:0 5px;border:1px solid #ccc;background:#f5f5f5;outline:none;}
	div.tab_buttons button:hover  { background:#e6e6e6}
	div.tab_buttons button.left   { border-radius:0.5em 0.0em 0.0em 0.5em; border-right-style:none}
	div.tab_buttons button.right  { border-radius:0.0em 0.5em 0.5em 0.0em; }
	div.tab_buttons button.middle { border-right-style:none}
	div.tab_buttons button.single { border-radius:0.5em}
	div.tab_buttons button[disabled] { background-color:#ccc;box-shadow:inset 0 2px 4px rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.05);}
/*tab buttons*/

/*content*/
.width_50{
	width: 50%;
	float: left;
}
#content::after{
	clear: both;
	content: "";
    clear: both;
    display: table;
}
/*end of content*/
/*header*/
.chrome_big{
	font-size: 19px;
}
.green_h1{
	color: #9fc231;
}
.blue_h1{
	font-size: 42px;
	font-weight: 700;
	color: #2b6488;
}
.blue_links{
	color: #2b6488;
	font-size: 16px;
}
.blue_links:visited{
	color: #2b6488;
}
/*end of header*/
/*footer*/
.license_img{
	width: 20px;
	height: auto;
}
.license_img-big{
	width: 90px;
}
/*end of footer*/