CTRS2 stylesheet

/*ahklanding8*/
body
	{background:#E68D37;}
#log div:nth-child(2)::after{
	content: 'version 2.0.0';
}
#box-store{
	width: 612px;
	//width: 816px;
	border-collapse:collapse;
	height: 100%;
	float: right;
}
#title
	{position: fixed;
	left: 320px;
	right: 602px;
	top: 28px;
	height: 5%;
	border-style: hidden;
	box-shadow: initial;}
.gametitle
	{font-size: 40px;
	background-color: blue;}
.gametitle .gameAuthor::before{
	content: ' nope ';
}
#upgrades
	{height: auto;
	width: auto;
	overflow: auto;
	left: 315px;
	right: 602px;
	top: 28px;
	margin-top: 40px;
	bottom: 35%;
	margin-bottom: 0px;
	position: fixed;
	border-style: groove;
	border-color: blue;}
#clickables
	{position: fixed;
	left: 315px;
	/*right: 65%;*/
	min-width: 140px;
	width: 140px;
	top: 65%;
	margin-top: -3px;
	margin-right: -1px;
	bottom: 2%;
	overflow-x: none;
	overflow-y: auto;
	border-style: groove;
	border-color: blue;}
#achievements
 	{min-width: 1px;
	position: fixed;
	right: 602px;
	left: 476px;
	top: 65%;
	bottom: 2%;
	margin-top: -3px;
	margin-left: -1px;
	overflow-x: none;
	overflow-y: auto;
	border-style: groove;
	border-color: blue;}
#resources
	{position: fixed;
	top: 28px;
	bottom: 30px;
	width: 300px;
	float: left;
	overflow-x: none;
	overflow-y: auto;
	border-style: groove;
	border-color: blue;}
#popups{
	bottom: 35px;
	left: 12px;
}
#buildings
	{/*position: fixed;*/
	top: 28px;
	bottom: 30px;
	float: right;
	/*width: 300px;*/
	overflow-x: none;
	overflow-y: auto;
	z-index: 42;
	border-style: groove;
	border-color: blue;
	display:inline-block;
	padding-left: 11px;
	padding-right:0px;
	padding-bottom: 12px;
	}
#buildings>td{
	height:100%;
}
#clickableTitle
	{display: none;}
.biggerresource
	{font-size: 18px;}
.bigresource
	{font-size: 16px;}
.smallresource
	{font-size: 12px;}
.upgrade
	{margin: 1px;}
.bought
	{/*font-size: 0px;*/
	margin: 2px;
	padding: 0px;}
.upgrade .upgradeType
	{font-weight: bold;}
/*#save
	{position:fixed;
	left:78%;
	top:80%;
	height:17%;}*/
.achievement
	{/*font-size: 0px;*/
	margin: 2px;
	padding: 0px;}




/*Buildings*/

.costs .label
	{font-size: 0px;}
#buildingTitle
	{display:none;}

.building{
	opacity: 0.87;
	background: black;
	border: 2px solid rgb(2, 250, 2);
	border-style: solid;
	width: 170px;
	height:100%;
	vertical-align: text-top;
	margin-top: 8px;
	margin-right:0px;
	margin-left:4px;
	/*display:inline-block;*/
}
.building .name.buildingType{
	font-size: 16px;
	font-weight: bold;
	position: absolute;
	width: 100%;
}
.building .name~.amount{
	position: absolute;
	right: 3px;
	bottom: 3px;
	font-size: 16px;
	font-weight: bold
}
.building:not(.moreThan0) .name~.amount{
	font-size: 0px;
}
.building:not(.moreThan0) .name~.amount::after{
	content: 'NEW';
	font-size: 16px;
}


.building .costs .cost:first-child{
	margin-top: 19px;
}
.building .costs .disabled{
	color: rgb(255,120,120);
}
.occupations  .label{
	font-size:0px;
}
.occupations .label::after{
	font-size:12px;
	content: 'occupies ';
}
.occupations .disabled{
	color: rgb(255,120,120);
}

.building .sell{
	width: 30px;
	padding-left: 2px;
	padding-right: 2px;
}
.building .sell:hover, .building .sell:focus{
	background-color: rgb(200,50,50);
}
.line{
	height:1px;
	min-height: 1px;
	opacity: 0;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: none;
	width: 500px;
}
.line .name, .line  .amount{
	display:none;
}



.upgrade{
	opacity: 0.80;
	background: black;
	border: 1px solid rgb(2, 250, 2);
	border-style: solid;
	vertical-align: middle;
}
.upgrade.bought{
	//background: black;
	opacity: 0.7;
	border-color: white;
}
.thing.disabled {
  opacity: 0.50;
  border-color: rgb(255, 2, 2);
  background: black;
  color: limegreen;}
.upgrade .costs .disabled{
	color: rgb(255,100,100);
}

.clickable{
	opacity: 0.80;
	background: black;
	border: 1px solid rgb(2, 250, 2);
	border-style: solid;
	margin-left: auto;
    margin-right: auto;
}
.clickables:active{
	-webkit-transform:scale(0.98,0.98);opacity:1;
}

/*Rescources*/

#resourceTitle{
	font-size: 0px;
	width: 100%;
	background-color: rgba(5,5,5,.3);
	text-align: center;
	margin-top: 2px;
	margin-bottom: 2px;
	padding-top: 1px;
	padding-bottom: 1px;
}
#resourceTitle::after{
	content: 'Key resources';
	font-size: 14px;
}

.resource{
	margin-top: 1px;
	margin-bottom: 1px;
}

.resHeader{
	font-size: 0px;
	width: 100%;
	background-color: rgba(5,5,5,.3);
	text-align: center;
	margin-top: 2px;
	margin-bottom: 2px;
	padding-top: 1px;
	padding-bottom: 1px;
}
.resHeader .name{
	font-size: 14px;
	font-weight: bold;
}


/*Achievements*/

.achievement{
	border: hidden;
	box-shadow: initial;
	font-size: 15px;
}
.achievement:hover{
	background-color: rgba(10,10,10,0.3);
}
.achievement div:after{
	content: ',';
}
.stats .title{
	font-size:0px;
}
.stats .title:after{
	content: 'Checklist';
	font-size:15px;
}


/*Titles*/
.gameTitle:not(.title) + .gameAuthor{
	color: rgb(50,250,50);
	font-size:0px;
}
.gameTitle:not(.title) + .gameAuthor::after{
	color: rgb(50,250,50);
	font-size: 10px;
	content: 'Mac15001900';
}
.gameTitle:not(.title){
	font-size: 0px;
}
.gameTitle:not(.title)::after{
	font-size: 10px;
	color: rgb(50,250,50);
	content: 'Cut Trees, Reach Singularity';
}

#title{
	border-style: hidden;
	font-size: 25px;
	color: rgb(0,255,0);
	text-align: center;
}
#title>.gameAuthor{
	color: blue;
	background: yellow;
	}

/*#title>.gameAuthor:before{
	content:' nope ';
	font-size: 0px;
	background: yellow;}*/

#tooltip{
	border-style: groove;
	border-color: rgb(40,255,40);
	background: white;
	background-color: rgba(2,0,2,0.93);
}
#tooltip .name{
	text-align: center;
	color: rgb(40,255,40);
	margin-bottom: 8px;
}
#tooltip .description{
	/*color: rgb(40,255,40);*/
}

#topBar .gameAuthor{
	color: green;
}
#topBar>div{
	color: rgb(80,255,80);
}


#tooltip b{
	color: rgb(40,255,40);
}
#tooltip i{
	text-decoration: none;
	font-style: normal;
	font-weight: bold;
	color: rgb(255,40,40);
}


/*Savebox*/

#saveBox{
	border-style: groove;
	border-color: blue;
	opacity: 0.87;
	background: black;
	float: right;
	min-width: 1px;
	margin-bottom: 10px;
}
#saveBox .button:last-child{
	border: 2px solid rgb(200, 30, 30);
	color: rgb(200, 30, 30);
	float: right;
}
#saveBox .button:last-child:hover{
	background:rgba(200,50,50,0.2);
}
#saveBox .button:first-child{
	border: 2px solid rgb(2, 250, 2);
}
#saveBox .button:first-child:hover{
	background:rgba(50,200,50,0.6);
}


/*Popups*/
.popup{
	border-style: groove;
	border-color: rgb(40,255,40);
	background: white;
	background-color: rgba(2,0,2,0.93);
	color: white;
}
.popup b{
	color: rgb(40,250,40);
}
.popup .close:hover{
	background-color: rgba(150,20,20,0.93);
}
.popup .close{
	top: 0px;
	padding-bottom: 8px;
	padding-left: 5px;
}


/*Changelog*/
#log
	{background: rgba(20,20,20,0.85);
	width: 300px;
	min-width: 300px;
	height: 15px;}
#log div{
	font-size: 0px;
}
#log div::after{
	font-size: 10px;
}
#log div:first-child, #log div:nth-child(2){
	width: 100%;
	text-align: center;
	margin-bottom: 2px;
}
#log div:first-child::after{
	font-size: 20px;
	content: 'Changelog';
}
#log div:nth-child(2)::after{
	font-size: 12px;
}
#log div:last-child::after{
	font-size: 0px;
}
#log div:nth-child(3)::after{
	content: 'TO-DO: make a working changelog';
}




/*Begin testing grounds. Proceed with caution*/

.button:not(.disabled){
  /*display: inline-block;
  vertical-align: middle;*/
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  /*box-shadow: 0 0 1px rgba(0, 0, 0, 0);*/
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  /*background: #e1e1e1;*/
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.button:not(.disabled)::before{
  content: '';
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2ac52a;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.button:not(.disabled):hover, .button:not(.disabled):focus, .button:not(.disabled):active {
  color: white;
}
.button:not(.disabled):hover:before, .button:not(.disabled):focus:before, .button:not(.disabled):active:before {
  -webkit-transform: scale(1);
  transform: scale(1);
}

#saveBox .button:last-child::before{
	background: rgb(100,25,25);
}


/*Things that don't work and probably won't until an IGM update (aka never)*/


/*@font-face {
    font-family: titleFont;
    src: url(http://www.dafont.com/old-republic.font);
}*/


/*@media screen and (max-width: 1700px){
	#box-store{width: 612px;}
}*/
/*@media screen and (max-width: 300px) {
    body {
        background-color: lightblue;
    }
}*/

div[id="support"]
{
    position: fixed;
	margin-right: 15px;
	right: 13%;
	bottom: 0;
}

</style>
<script>alert('worth trying though');
</script>
<style>


	My