/* 
Version 36, dynamic army cards.

*/




/* 
Army Cards stuff
*/


.title {
	border-radius: 0.3em 0.3em 0em 0em;
	padding: 0.3em;
	text-align: center;
	font-size: 1.6em;
	font-weight: bold;
	background-color: #534FF5;
	color: #fff;
	margin-top: 0;
	margin-block-end: 0;
}

.sectiontitle {
	text-align: center;
	font-size: 1.4em;
	font-weight: bold;
	background-color: #ddd;
	margin-bottom: 0;
	margin-block-end: 0.5em;
}

.taxtitle {
	margin-block-start: 0.5em;
	margin-block-end: -0.5em;
}

.sectionnotes {
	text-align: center;
	font-size: 1.0em;
	margin-bottom: 0;
 	margin-block-start: -0.3em; 
 	margin-block-end: -0.3em; 
}

.version {
	text-align: center;
	font-size: 1.0em;
	margin-bottom: 0;
 	margin-block-start: 0.2em; 
 	margin-block-end: -0.3em; 
}


.entry, .tax {
	font-size: 1.0em;
	margin-bottom: 0;
	font-weight: bold;
	border-top: 1px solid #dfdfdf;
	padding-top: 0.3em;
}

.tax {
	text-align: center;
	border-top: none;
	padding-top: none;
	margin-block-start: 0.5em;
	margin-block-end: 0em;
}

.unit {
	margin: 0.3em 0.5em;
}

.unit_first {
	margin-top: 1em;
}


.unit_indent, .unit_upgrade {
	text-indent: 1em;
}

.unit_points {
/* 	font-style: italic; */
	font-weight: bold;
}

.rule_title {
	font-weight: bold;
}

.unit_notes {
	font-style: italic;
	font-weight: normal;
}

/* 
.source_mods {
	font-style: italic;
}
 */

.mods_only {
	font-style: italic;
}


p.detachment_rule {
line-height: 18px;
overflow: hidden;
padding: 0.5em;
border-radius: 8px;
border: solid 2px #000;
background-color: #ddd;
margin: 1em 0.5em 0em 0.5em;
text-align: center;
font-style: italic;
}

p.detachment_rule_left {
text-align: left;
}


/* 

body {
	font-family: Roboto,sans-serif;
}

 */










@media print {
		
	body {
		background-color:white;
	}
	.inputform {
		/* display:none; */
	}
	
	.noprint {
		display:none;
	}
	
	.detachment {
    	page-break-inside: avoid !important;
		border: 1px solid black !important;
		padding:0.2em 0.2em 0.2em 0.2em !important;
	}
	
	.summary, .detachment {
		margin-bottom: 0.5em !important;
        font-size: 60% !important;
	}
	
	.summary {
		margin-bottom: 0.5em !important;
		border: 1px solid grey !important;
	}
	
	.info, .info_simple, .notes, .profiles {
		margin-bottom: 0.2em !important;
		border: 0.5px solid grey !important;
	}
	
	th {
		padding:0.2em !important;
	}
	
	td {
		padding:0.1em !important;
	}
	
	.info_simple td  {
		padding: 0.2em 0.5em 0.2em !important;
	}
	
	a:link {
  		color: black;
		font-weight: bold;
	}
	
	.profiles td:first-child + td {
	font-weight: normal !important;
	}
}









a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}


table {
	border-collapse:collapse;
}
th {
	padding:0.5em 0.3em 0.5em;
}
td {
	padding:0.5em 0.3em 0.5em;
}





.input {
	display:none;
}

.noshow {
	display:none;
}

.listnameinput {
	border:none;
	font-weight: bold;
	font-size: 18px;
	text-align: center;
	width: 90%;
}



textarea {
    white-space: pre;
    overflow:    scroll;
    overflow-y:  hidden;
    overflow-x:  scroll;
}


.info, .info_simple, .notes, .profiles {
	border: 1px solid grey;
	margin-bottom: 0.5em;
	width: 100%;
}

.info td:first-child  {
	text-align: right;
	font-weight: bold;
}
.info td:first-child + td + td  {
	text-align: right;
	font-weight: bold;
}


.info_simple td  {
	padding: 0.5em 0.6em 0.5em;
}

.info_simple td:first-child  {
	text-align: left ;
	font-weight: normal ;
	width: 20% ;
}

.info_simple td:first-child + td  {
	text-align: center ;
	font-weight: bold ;
}

.info_simple td:first-child + td + td  {
	text-align: right ;
	font-weight: normal ;
	width: 20% ;
}

.summary {
	border: 3px solid black;
	margin-bottom: 1em;
	width: 100%;
}

.summary tr:nth-child(even) {background: #e7e7e7}
.summary tr:nth-child(odd) {background: #FFF}

.summary td:first-child + td  {
	text-align: center;
}
.summary td:first-child + td + td  {
	text-align: center;
}
.summary td:first-child + td + td + td  {
	text-align: center;
}

.summary td:first-child + td + td + td + td  {
	text-align: center;
}

.summary td:first-child + td + td + td + td + td  {
	text-align: center;
}

.summary th:first-child  {
	text-align: left;
}


.totalsrow {
	font-weight: bold;
}


.info, .info_simple {
	background: white;
	margin-left: auto;
	margin-right: auto;
}

.info {
	width: 80%;
}

.info_simple {
	width: 70%;
}

/*
.info_simple td:first-child + td { 
	border-left:1px solid grey;
	border-right:1px solid grey;
}
*/

.notes tr:nth-child(even) {background: #e5f2fb}
.notes tr:nth-child(odd) {background: #FFF}
.notes td:first-child  {
	text-align: right;
	font-weight: bold;
}
.info td {
	padding: 0.3em ;
}





.profiles tbody > tr > th {
/* this works for Chrome but not Safari */
    position: sticky;
    top: -1px;
    z-index: 1;
}


.profiles th, .summary th {
/* this works for Safari but not Chrome */
    position: -webkit-sticky; // this is for all Safari (Desktop & iOS), not for Chrome
    position: sticky;
    top: -1px;
    background-color: #fff; // any bg-color to overlap
    z-index: 10; // any positive value, layer order is global
}



.profiles tr:nth-child(even) {background: #e5f2fb}
.profiles tr:nth-child(odd) {background: #FFF}

.profiles td:first-child  {
	text-align: center;
}
.profiles td:first-child + td {
	font-weight: bold;
}
.profiles td:first-child + td + td {
	text-align: center;
}

.profiles td:first-child + td + td + td {
	text-align: center;
}
.profiles td:first-child + td + td + td + td {
	text-align: center;
}
.profiles td:first-child + td + td + td + td + td {
	text-align: center;
}
.profiles td:first-child + td + td + td + td + td + td {
	text-align: center;
}
.profiles td:first-child + td + td + td + td + td + td + td {
	text-align: center;
}

.profiles th:first-child + th  {
	text-align: left;
}
.profiles th:last-child {
	text-align: left;
}


.profiles th.profile_name {
  width: 23%
}
.profiles th.profile_speed {
  width: 10%
}
.profiles th.profile_notes {
  width: 25%
}

.notes td.notes_name {
  width: 20%
}




/* 

.profiles_solo td:first-child  {
	text-align: left;
	font-weight: bold;
}
.profiles_solo td:first-child + td {
	text-align: center;
	font-weight: normal;
}
.profiles_solo td:first-child + td + td + td + td + td + td + td {
	text-align: left;
}
.profiles_solo th:first-child + th  {
	text-align: center;
}

 */

.detachment, .armycard {
	padding:0.5em 0.5em 0.5em 0.5em;
	border: 3px solid black;
	border-radius: 0.5em;
	background: #d5d5d5;
	margin-bottom: 1em;
}

.detachment {
	background: #d5d5d5;
}

.armycard {
	background: #fff;
	margin-top: 4.4em;
}


/* ================================== simplex stuff */

.simple_show {
	display:none;
}


/* ================================== tooltip stuff */


.SR_info {
	font-weight: normal;
}

.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
}
body .ui-tooltip {
	border-width: 2px;
}




/* ================================= CSS for the game selector switch */

.fixedUI {
  position: fixed;
  top: 0.2em;
  left: 0.2em;
  width: 250px;
  height: 60px;
  	border: 2px solid #a7a7a7;
	border-radius: 0.5em;
	background-color: #fff; // any bg-color to overlap
}



.gamesliderlabel {
        font-size: 150% ;
}

.gameslider {
	padding:0em 0.7em;
        font-size: 20px ;
        line-height: 2 ;
}


.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #534FF5;
}

input:focus + .slider {
  box-shadow: 0 0 1px orange;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}