body{
	font-family: sans-serif;
    color: white;
	background: #ebf9fb;
}

h1{
	text-align: center;
	/*ketebalan font*/
	font-weight: 300;
}

img.tengah {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.kotak_login{
    font-family: sans-serif;
	width: 350px;
	background: #ea5829;
	/*meletakkan form ke tengah*/
	margin: 80px auto;
	padding: 30px 20px;
	box-shadow: 0px 0px 100px 4px #d6d6d6;
}

label{
	font-size: 11pt;
}

.form_login{
	/*membuat lebar form penuh*/
	box-sizing : border-box;
	width: 100%;
	padding: 10px;
	font-size: 11pt;
	margin-bottom: 20px;
}

.tombol_login{
	background: #2aa7e2;
	color: white;
	font-size: 11pt;
	width: 100%;
	border: none;
	border-radius: 3px;
	padding: 10px 20px;
}

.link{
	color: #232323;
	text-decoration: none;
	font-size: 10pt;
}

.alert{
	background: #e44e4e;
	color: white;
	padding: 10px;
	text-align: center;
	border:1px solid #b32929;
}

/* hide retired drivers */
table tbody tr:nth-last-child(-n+3) {
  display: none;
}

/* hide the checkbox that manipulates last table rows */
#showRetired {
  display: none;
}

/* hide "hide" button */
#showRetired ~ #hideBtn {
  display: none;
}

/* show retired drivers. */
#showRetired:checked {
  & + table tbody tr:nth-last-child(-n+3) {
    display: table-row;
  }
  /* change the buttons around */
  & ~ #showBtn {
    display: none;
  }
  & ~ #hideBtn {
    display: inline;
  }
}


/* style buttons a little bit */
label[for='showRetired'] {
  background: lightgreen;
  border-radius: 4px;
  cursor: pointer;
  padding: 10px;
  position: relative;
  top: 20px;
}

/* style table a little bit */
table {
  border-collapse: collapse;
  thead {
    background: antiquewhite;
  }
  tr {
    border: 1px dotted gray;
    line-height: 24px;
    &:nth-child(even) {
      background: mintcream;
    }
  }
  td {
    width: 100px;
  }
}