/* Created by Stephan Koskowski */

#targetSection, #targetSection > div, .minion, .minion > p, #targetDisplayPanel > div:nth-child(1),#targetDisplayPanel > div:nth-child(1) > div,
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > *, #targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > p, #targetDisplayPanel > div:nth-child(3){
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}
null{
	-webkit-box-flex: 1;
	flex: 1;
}
#targetSection, #targetSection > div, #targetDisplayPanel > div:nth-child(1), #targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div, #targetDisplayPanel > div:nth-child(3){
	-webkit-box-orient: horizontal;
	-webkit-flex-flow: row;
	-moz-flex-flow: row;
	-ms-flex-flow: row;
	flex-flow: row;
	flex-direction: row;
}
#targetDisplayPanel > div:nth-child(1) > div{
	-webkit-box-orient: vertical;
	-webkit-flex-flow: column;
	-moz-flex-flow: column;
	-ms-flex-flow: column;
	flex-flow: column;
	flex-direction: column;
}
#targetSection, #targetDisplayPanel > div:nth-child(1), #targetDisplayPanel > div:nth-child(2), #targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > p,
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > p{
	-ms-flex-pack: center;
	-moz-box-pack: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}
#targetDisplayPanel > div:nth-child(1){
    -ms-flex-pack: justify;
	-moz-box-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-around;
	-moz-justify-content: space-around;
	-ms-justify-content: space-around;
	justify-content: space-around;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div, #targetDisplayPanel > div:nth-child(3){
    -ms-flex-pack: justify;
	-moz-box-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
}
#targetDisplayPanel > div:nth-child(1) > div{
    -ms-flex-pack: start;
	-moz-box-pack: start;
	-webkit-box-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	justify-content: flex-start;
}
null{
    -ms-flex-pack: end;
	-moz-box-pack: end;
	-webkit-box-pack: end;
	-webkit-justify-content: flex-end;
	-moz-justify-content: flex-end;
	-ms-justify-content: flex-end;
	justify-content: flex-end;
}
#targetSection, .minion, #targetDisplayPanel > div:nth-child(1) > div:nth-child(1), #targetDisplayPanel > div:nth-child(1) > div:nth-child(2),
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > p{
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
null{
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	-moz-box-align: flex-start;
	-ms-flex-align: flex-start;
	align-items: flex-start;
}
null{
	-webkit-align-items: stretch;
	-webkit-box-align: stretch;
	-moz-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
}



#targetDisplayPanel > div:nth-child(1) > div:nth-child(1) > div.inactive:nth-child(1), #targetDisplayPanel > div:nth-child(1) > div:nth-child(2) > div.inactive:nth-child(1){
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: url(ffFilters.svg#grayscale); /* Firefox 4+ */
	filter: gray; /* IE 6-9 */
}
null{
	-webkit-filter: grayscale(50%);
	-moz-filter: grayscale(50%);
	-ms-filter: grayscale(50%);
	-o-filter: grayscale(50%);
	filter: grayscale(50%);
	filter: url(ffFilters.svg#semigrayscale); /* Firefox 4+ */
	filter: gray; /* IE 6-9 */
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(1) > div.active:nth-child(1), #targetDisplayPanel > div:nth-child(1) > div:nth-child(2) > div.active:nth-child(1){
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: none;
	filter: grayscale(0%);
}

#targetSection > div{
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	
	height: 499px;
	min-height: 499px;
	max-height: 499px;
}

#targetSelectionPanel{
	width: 30%;
	min-width: 30%;
	max-width: 30%;
	
	height: 499px;
	min-height: 499px;
	max-height: 499px;
	
	border-right: 1px solid black;
	
	overflow-y: auto;
}

#targetDisplayPanel{
	width: 70%;
	min-width: 70%;
	max-width: 70%;
	
	height: 499px;
	min-height: 499px;
	max-height: 499px;
}

.minion{
	background: rgba(0,0,0,0.5);
	margin: 5px;
	border-radius: 5px;
}
.minion:hover{
	background: rgba(75,75,75,0.5);
}
.minion.active{
	background: rgba(220,220,220,0.7);
}
.minion > img{
	width: 32px;
	min-width: 32px;
	max-width: 32px;
	
	height: 32px;
	min-height: 32px;
	max-height: 32px;
}
.minion > p{
	margin-left: 15px;
	font: 24px Ropa Sans;
}

#targetDisplayPanel > div:nth-child(1){
	height: 20%;
	min-height: 20%;
	max-height: 20%;
	
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(1) > div:nth-child(1){
	height: 50px;
	min-height: 50px;
	max-height: 50px;
	
	width: 50px;
	min-width: 50px;
	max-width: 50px;
	
	outline: 1px solid gray;
	
	background: url('../images/Items/Aegis of the Legion.png');
	background-size: 100%;
	background-repeat: no-repeat;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(2) > div:nth-child(1){
	height: 50px;
	min-height: 50px;
	max-height: 50px;
	
	width: 50px;
	min-width: 50px;
	max-width: 50px;
	
	outline: 1px solid gray;
	
	background: url('../images/Items/Abyssal Scepter.png');
	background-size: 100%;
	background-repeat: no-repeat;
}
#targetDisplayPanel > div:nth-child(1) > div > div.inactive:hover{
	outline: 1px solid white;
}
#targetDisplayPanel > div:nth-child(1) > div > div.active{
	outline: 2px solid white;
}
#targetDisplayPanel > div:nth-child(2){
	height: 30%;
	min-height: 30%;
	max-height: 30%;
	
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}
#targetDisplayPanel > div:nth-child(3){
	height: 30%;
	min-height: 30%;
	max-height: 30%;
	
	width: 85%;
	min-width: 85%;
	max-width: 85%;
	
	padding: 50px;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3){
	width: 110px;
	min-width: 110px;
	max-width: 110px;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > p{
	font: 32px Tahoma;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > img{
	outline: 1px solid gray;
	
	width: 24px;
	min-width: 24px;
	max-width: 24px;
	
	height: 24px;
	min-height: 24px;
	max-height: 24px;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > img:hover{
	outline: 1px solid white;
}
#targetDisplayPanel > div:nth-child(1) > div:nth-child(3) > div > p{
	font: 16px Tahoma;
}

table.targetTable{
	margin-left: 10px;
	background: rgba(0,0,0,0.5);
	border-radius: 10px;
}

table.targetTable > * > tr{
	height: 35px;
}

table.targetTable > * > tr > td, table.targetTable > * > tr > th{
	width: 130px;
	text-align: left:
}
table.targetTable > * > tr > th:nth-child(2){
	color: #fc8a01;
}
table.targetTable > * > tr > th:nth-child(3){
	color: #97fc97;
}
#targetTime:after{
	content:"Min";
	padding-left: 3px;
}

#targetDisplayPanel > div:nth-child(3) > div{
	width: 49%;
	min-width: 49%;
	max-width: 49%;
	
	height: 100%;
	min-height: 100%;
	max-height: 100%;
	
	background: rgba(0,0,0,0.5);
}
#targetDisplayPanel > div:nth-child(3) > div > div:first-child{
	font: 13px;
	padding-top: 35px;
	padding-bottom: 25px;
}
#targetDisplayPanel > div:nth-child(3) > div > div:last-child{
	font: bold 30px Arial;
}
#targetDisplayPanel > div:nth-child(3) > div > div:last-child:after{
	content: " HP";
}